:root{color:#3f382f;font-synthesis:none;text-rendering:optimizelegibility;--cream:#fff9ef;--peach:#f2b58b;--peach-dark:#d88762;--green:#6c956e;--brown:#6f5543;--shadow:0 10px 30px #64462d1f;background:#f7ead8;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100%;margin:0}body{min-height:100vh;min-height:100dvh;overflow-x:hidden}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;border:0}button:disabled{cursor:not-allowed;opacity:.48}h1,h2,h3,p{margin-top:0}.app-shell{width:min(100%,760px);min-height:100vh;min-height:100dvh;padding:env(safe-area-inset-top) 0 calc(82px + env(safe-area-inset-bottom));background:linear-gradient(#fff9ef 0%,#f9efdf 65%,#f3e0cb 100%);margin:0 auto;box-shadow:0 0 60px #5839241f}.hud{z-index:20;color:#5a4031;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fff9efeb;border-bottom:1px solid #7b53361a;justify-content:space-between;align-items:center;min-height:68px;padding:10px 18px;display:flex;position:sticky;top:0}.brand{letter-spacing:.05em;font-size:20px;font-weight:800;display:block}.level{color:#fff;background:var(--green);border-radius:99px;margin-top:2px;padding:2px 8px;font-size:12px;font-weight:700;display:inline-block}.resources{gap:8px;display:flex}.resources span{background:#fff;border:1px solid #ead9c5;border-radius:99px;padding:7px 10px;font-size:13px;font-weight:700}.main-content{padding:12px 12px 32px}.scene-loading{color:#69806c;background:#edf2dd;border-radius:24px;place-items:center;min-height:420px;display:grid}.phaser-frame{position:relative}.phaser-tutorial-target{z-index:2;pointer-events:none;position:absolute}.phaser-host{width:100%;box-shadow:var(--shadow);touch-action:none;background:#e5edcf;border:5px solid #fff;border-radius:24px;overflow:hidden}.phaser-host canvas{display:block;width:100%!important;height:auto!important}.control-panel,.page-card{box-shadow:var(--shadow);background:#ffffffd1;border:1px solid #8b61421f;border-radius:22px;margin-top:12px;padding:16px}.panel-heading,.page-title{justify-content:space-between;align-items:center;gap:12px;display:flex}.panel-heading h2,.page-title h1{margin-bottom:8px;font-size:19px}.panel-heading span,.page-title>span{color:#806b59;font-size:13px}.eyebrow{color:var(--peach-dark);letter-spacing:.12em;font-size:12px;font-weight:800}.chip-list,.inventory-row,.action-row{flex-wrap:wrap;gap:8px;display:flex}.chip,.secondary-button,.action-row button,.tabs button{background:#f5eadc;border:1px solid #e8d4bd;border-radius:12px;min-height:42px;padding:8px 12px}.chip.selected,.tabs button.active{color:#fff;background:var(--green);border-color:var(--green);box-shadow:0 5px 12px #52785038}.inventory-row,.action-row{margin-top:12px}.secondary-button{background:#fff}.primary-button,.shop-card button,.quest-card button{color:#fff;font-weight:700;background:var(--peach-dark)!important;border-color:var(--peach-dark)!important}.hint{color:#8a7563;margin:12px 0 0;font-size:13px;line-height:1.55}.navigation{z-index:30;width:min(100%,760px);min-height:calc(72px + env(safe-area-inset-bottom));padding:7px 7px env(safe-area-inset-bottom);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fffcf6f2;border-top:1px solid #ead9c6;grid-template-columns:repeat(5,1fr);margin:auto;display:grid;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -8px 25px #5a3c261a}.navigation button{color:#826d5b;background:0 0;border-radius:14px;min-height:56px;font-size:11px}.navigation button span{margin-bottom:2px;font-size:22px;display:block}.navigation button.active{color:#684733;background:#f7dfc9;font-weight:800}.wardrobe-list{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px;max-height:260px;display:grid;overflow-y:auto}.clothing-card{text-align:left;background:#fffaf4;border:1px solid #ead9c8;border-radius:12px;grid-template-columns:22px 1fr;gap:3px 7px;min-height:56px;padding:8px;display:grid}.clothing-card .swatch{background:var(--item-color);border:2px solid #fff;border-radius:8px;grid-row:1/3;width:22px;height:38px;box-shadow:0 2px 5px #00000026}.clothing-card span{font-size:12px;font-weight:700}.clothing-card small{color:#998373}.clothing-card.selected{outline:3px solid #c47f9d}.page-card{min-height:610px;padding:20px}.tabs{gap:8px;margin:14px 0;display:flex}.tabs button{flex:1}.shop-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;display:grid}.shop-card{background:#fffaf4;border:1px solid #eadac9;border-radius:17px;flex-direction:column;min-height:190px;padding:14px;display:flex}.shop-card h3{margin:8px 0 4px;font-size:14px}.shop-card p{color:#8d7866;flex:1;font-size:12px}.shop-card button{border-radius:10px;min-height:40px;padding:7px}.shop-emoji{font-size:36px}.furniture-preview,.clothing-preview{border:5px solid #fff;width:54px;height:54px;margin:auto;display:block;box-shadow:0 4px 12px #0000001f}.furniture-preview{border-radius:12px}.clothing-preview{border-radius:22px 22px 9px 9px;width:45px}.quest-page h2{margin:22px 0 8px;font-size:16px}.quest-list{gap:8px;display:grid}.quest-card{background:#fffaf5;border:1px solid #eadaca;border-radius:14px;justify-content:space-between;align-items:center;gap:12px;padding:12px;display:flex}.quest-card h3{margin-bottom:4px;font-size:14px}.quest-card p{color:#86715f;margin:0;font-size:12px}.quest-card button{border-radius:10px;min-width:70px;min-height:40px}.collection-grid{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.collection-grid button{text-align:center;background:#f7eadc;border-radius:14px;padding:15px 6px}.collection-grid strong,.collection-grid span{display:block}.collection-grid strong{margin-bottom:3px;font-size:18px}.collection-grid span{color:#88725f;font-size:12px}.collection-section{gap:12px;display:grid}.collection-grid button{border:2px solid #0000;min-height:72px;position:relative}.collection-grid button.active{border-color:var(--peach-dark);background:#fff4e5}.collection-grid em{color:#fff;background:#d85f66;border-radius:99px;padding:2px 5px;font-size:9px;font-style:normal;font-weight:800;position:absolute;top:-7px;right:-4px}.collection-reward{background:#fff3ca;border:1px solid #ead38a;border-radius:15px;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;display:flex}.collection-reward strong,.collection-reward span{display:block}.collection-reward strong{margin-bottom:3px;font-size:14px}.collection-reward span{color:#846f49;font-size:12px}.collection-reward button{color:#fff;background:var(--peach-dark);border-radius:10px;min-width:90px;min-height:40px;padding:7px 10px;font-size:12px;font-weight:700}.collection-catalog{grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:8px;max-height:390px;padding:3px;display:grid;overflow-y:auto}.collection-entry{background:#fffaf4;border:1px solid #ead9c8;border-radius:14px;justify-items:center;gap:4px;min-height:126px;padding:12px 8px 9px;display:grid;position:relative}.collection-entry:disabled{cursor:default;opacity:.58;filter:grayscale(.8)}.collection-entry.is-new{border-color:#d85f66;box-shadow:0 4px 12px #d85f6626}.collection-entry strong{font-size:12px;line-height:1.3}.collection-entry small{color:#927d6b;font-size:10px}.collection-visual{color:#5f493a;background:var(--collection-color);border:4px solid #fff;border-radius:15px;place-items:center;width:48px;height:48px;font-size:25px;display:grid;box-shadow:0 3px 9px #4b342524}.new-badge{z-index:1;color:#fff;background:#d85f66;border-radius:99px;padding:2px 5px;font-size:9px;font-weight:900;position:absolute;top:4px;right:4px}.collection-detail{background:#f4eadf;border-radius:15px;align-items:center;gap:12px;min-height:76px;padding:12px;display:flex}.collection-detail p{color:#806d5d;margin:4px 0 0;font-size:12px}.tutorial-spotlight{z-index:24;top:var(--tutorial-top);left:var(--tutorial-left);width:var(--tutorial-width);height:var(--tutorial-height);pointer-events:none;border:3px solid #ffe07a;border-radius:16px;transition:inset .16s,width .16s,height .16s;animation:1.4s ease-in-out infinite tutorial-pulse;position:fixed;box-shadow:0 0 0 9999px #362b206b}@keyframes tutorial-pulse{50%{border-color:#fff6c8;transform:scale(1.025)}}.tutorial-card{z-index:25;top:calc(74px + env(safe-area-inset-top));color:#503f32;pointer-events:none;background:#fff4cc;border:2px solid #e8c766;border-radius:17px;justify-content:space-between;align-items:flex-start;gap:12px;padding:11px 14px;display:flex;position:fixed;left:max(14px,50vw - 365px);right:max(14px,50vw - 365px);box-shadow:0 8px 28px #4e3a2033}.tutorial-copy{flex:1;min-width:0}.tutorial-progress{color:#917323;margin-bottom:2px;font-size:11px;font-weight:900;display:block}.tutorial-card strong{font-size:14px;display:block}.tutorial-card p{margin:3px 0 0;font-size:12px;line-height:1.45}.tutorial-card small{color:#8a7357;margin-top:4px;font-size:11px;display:block}.tutorial-card .tutorial-warning{color:#a4493f}.tutorial-actions{flex-direction:column;flex:none;gap:6px;display:flex}.tutorial-card button{pointer-events:auto;background:#f0d785;border-radius:10px;min-width:82px;min-height:38px;padding:6px 10px}.tutorial-card .primary-button{color:#fff;background:#d88762}.toast{z-index:60;top:max(82px, calc(env(safe-area-inset-top) + 72px));color:#fff;text-align:center;width:max-content;max-width:calc(100% - 40px);box-shadow:var(--shadow);background:#373029eb;border-radius:99px;padding:11px 18px;position:fixed;left:50%;transform:translate(-50%)}.update-banner{z-index:70;max-width:calc(100% - 24px);box-shadow:var(--shadow);background:#fff;border-radius:12px;align-items:center;gap:8px;padding:10px;display:flex;position:fixed;top:10px;left:50%;transform:translate(-50%)}.update-banner span{font-size:12px}.update-banner button{background:#f4e6d5;border-radius:8px;padding:7px 9px}.dev-tools{color:#745d4d;background:#f0e5d7;border-radius:12px;margin-top:12px;padding:10px;font-size:12px}.dev-tools button{background:#fff;border-radius:8px;margin:8px 8px 0 0;padding:8px}.loading-screen{min-height:100vh;text-align:center;background:#fff9ef;place-content:center;min-height:100dvh;padding:25px;display:grid}.loading-screen>span{font-size:70px;animation:1.4s ease-in-out infinite bob}.loading-screen h1{color:#5c755c;margin-top:10px;font-size:22px}.loading-screen button{background:#f3c49f;border-radius:12px;min-height:44px;padding:8px 18px}.sound-settings-button{background:#fff;border:1px solid #ead9c5;border-radius:50%;place-items:center;width:44px;min-width:44px;min-height:44px;padding:0;font-size:19px;display:grid}.settings-backdrop{z-index:80;padding:max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#3a2d227a;place-items:center;display:grid;position:fixed;inset:0}.settings-panel{background:var(--cream);border:2px solid #fff;border-radius:22px;width:min(100%,420px);padding:22px;box-shadow:0 18px 60px #32241a47}.settings-heading{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.settings-heading h2{margin:3px 0 0;font-size:22px}.settings-heading>span{font-size:34px}.volume-control{background:#fff;border:1px solid #ead9c5;border-radius:14px;margin-top:14px;padding:12px;display:block}.volume-control>span{justify-content:space-between;gap:12px;font-size:13px;font-weight:800;display:flex}.volume-control output{color:var(--peach-dark)}.volume-control input{width:100%;min-height:44px;accent-color:var(--peach-dark);touch-action:pan-x;margin:4px 0 0}.settings-panel p{color:#806d5d;margin:12px 0;font-size:12px;line-height:1.5}.settings-panel>button{border-radius:12px;width:100%;min-height:46px}@keyframes bob{50%{transform:translateY(-8px)rotate(4deg)}}@media (max-width:480px){.hud{padding-left:10px;padding-right:10px}.brand{font-size:17px}.resources{gap:4px}.resources span{padding:6px 7px;font-size:11px}.main-content{padding:8px 8px 24px}.control-panel,.page-card{border-radius:17px;padding:12px}.page-card{min-height:calc(100dvh - 165px)}.shop-grid{grid-template-columns:repeat(2,1fr)}.tutorial-card{flex-direction:column;align-items:stretch;left:8px;right:8px}.tutorial-actions{flex-direction:row;justify-content:flex-end}}@media (pointer:coarse){button,input[type=range]{min-height:44px}}@media (max-height:600px) and (orientation:landscape){.settings-backdrop{place-items:start center;overflow-y:auto}.settings-panel{max-height:calc(100dvh - 24px);overflow-y:auto}.tutorial-card{top:max(8px, env(safe-area-inset-top))}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}