:root{--frame-max-width: 430px;--frame-max-height: 932px;--frame-border: 0px;--stage-width: min(100vw, var(--frame-max-width));--stage-height: 100vh;--tile-dark: #fefefa;--tile-light: #f0f8ff;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--usable-height: calc(var(--stage-height) - var(--safe-top) - var(--safe-bottom));--tile-size: min(calc(var(--stage-width) / 7), calc(var(--usable-height) / 13));--path-width: calc(var(--tile-size) * 5);--path-height: calc(var(--tile-size) * 11);--side-gap-width: var(--tile-size);--top-gap-height: var(--tile-size);--bottom-gap-height: var(--tile-size);--page-top: #e8efe1;--page-bottom: #cfdcc8;--screen-top: #f8fbf4;--screen-bottom: #e4ebdf;--frame-shadow: 0 28px 70px rgba(45, 60, 47, .22);--side-fill: #d7e2d0}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:linear-gradient(180deg,var(--page-top),var(--page-bottom))}body{min-height:100vh}.loading-screen{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:linear-gradient(180deg,#eef4e8,#d9e4d1);z-index:100;transition:opacity .24s ease,visibility .24s ease}.loading-screen.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.loading-panel{width:min(320px,calc(100vw - 48px));padding:24px 22px;border-radius:24px;background:#fffffff0;box-shadow:0 20px 48px #39503d2e}.loading-title{color:#29412b;font-family:Arial,sans-serif;font-size:1.1rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.loading-bar{width:100%;height:10px;margin-top:16px;border-radius:999px;overflow:hidden;background:#29412b1f}.loading-bar-fill{width:0%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#57d4c0,#1795a1);transition:width .18s ease}.loading-text{margin-top:12px;color:#49604a;font-family:Arial,sans-serif;font-size:.92rem;font-weight:700}.app-shell{min-height:100vh;display:grid;place-items:center;padding:0}.phone-frame{width:var(--stage-width);height:var(--stage-height);display:flex;justify-content:center;align-items:stretch}.game-screen{position:relative;flex:1;display:flex;flex-direction:column;height:100%;background:linear-gradient(180deg,var(--screen-top),var(--screen-bottom))}.bg-music-toggle{position:absolute;top:12px;right:12px;width:42px;height:42px;border:0;border-radius:50%;display:grid;place-items:center;background:#ffffffeb;color:#29412b;box-shadow:0 10px 24px #39503d29;cursor:pointer;z-index:12}.bg-music-toggle:hover,.bg-music-toggle:focus-visible{outline:none;box-shadow:0 0 0 3px #007fff29,0 10px 24px #39503d29}.bg-music-toggle-icon{font-size:18px;line-height:1}.board-stage{flex:1;display:grid;place-items:center;padding:0}.board-shell{width:100%;height:100%;background:linear-gradient(180deg,#dde7d8,#d1dccb);overflow:hidden;position:relative;display:grid;place-items:center}.board-camera{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;display:grid;place-items:center}.board-world{width:100%;height:100%;display:grid;grid-template-columns:1fr var(--path-width) 1fr;grid-template-rows:1fr var(--path-height) 1fr;transform-origin:center center;transform:translate(var(--camera-pan-x, 0px),var(--camera-pan-y, 0px)) scale(var(--camera-scale, 1));transition:transform .7s cubic-bezier(.22,1,.36,1);will-change:transform}.side-gap{grid-row:1 / -1;height:100%;background:linear-gradient(180deg,var(--side-fill),#cdd9c8);position:relative;overflow:visible;z-index:0}.top-gap{grid-column:2;width:100%;position:relative;overflow:visible;z-index:0;grid-row:1}.bottom-gap{grid-column:2;width:100%;position:relative;overflow:visible;z-index:0;grid-row:3}.board-left-decoration{grid-column:1}.board-right-decoration{grid-column:3}.board-top-decoration,.board-bottom-decoration{background:#ffe628}.board-decoration-image{position:absolute;top:0;right:0;width:auto;height:100%;display:block;max-width:none;z-index:1}.test-yellow-box{position:absolute;top:0;left:0;width:100%;height:100%;background:#ff0;z-index:0}.board-decoration-image.is-flipped{transform:scaleX(-1);left:0;right:auto}.board-top-image,.board-bottom-decoration .board-top-image{display:none}.game-grid{display:grid;grid-template-columns:repeat(5,var(--tile-size));grid-template-rows:repeat(11,var(--tile-size));width:var(--path-width);height:var(--path-height)}.path-wrap{grid-column:2;grid-row:2;position:relative;width:var(--path-width);height:var(--path-height);z-index:1}.glow-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1}.tile-glow{--glow-size: calc(var(--tile-size) * .88);position:absolute;width:var(--glow-size);height:var(--glow-size);left:calc((var(--glow-column) - 1) * var(--tile-size) + ((var(--tile-size) - var(--glow-size)) / 2));top:calc((var(--glow-row) - 1) * var(--tile-size) + ((var(--tile-size) - var(--glow-size)) / 2));border-radius:16px;background:radial-gradient(circle,#007fff94,#007fff1f 58%,#007fff00);box-shadow:0 0 0 1px #007fff33,0 0 14px #007fff57;opacity:0;transform:scale(.68)}.tile-glow.is-active{animation:tile-click-glow .42s ease-out forwards}.box-placeholder.has-placeholder-image.is-highlighted .placeholder-image{filter:drop-shadow(0 0 .6rem rgba(0,127,255,.55)) drop-shadow(0 0 1.2rem rgba(0,127,255,.35))}.asset-layer{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;grid-template-columns:repeat(5,var(--tile-size));grid-template-rows:repeat(11,var(--tile-size));pointer-events:none;z-index:3}.front-asset-layer{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;grid-template-columns:repeat(5,var(--tile-size));grid-template-rows:repeat(11,var(--tile-size));pointer-events:none;z-index:6}.front-npc-layer{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;grid-template-columns:repeat(5,var(--tile-size));grid-template-rows:repeat(11,var(--tile-size));pointer-events:none;z-index:7}.top-asset-layer{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;grid-template-columns:repeat(5,var(--tile-size));grid-template-rows:repeat(11,var(--tile-size));pointer-events:none;z-index:9}.floor-layer{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;grid-template-columns:repeat(5,var(--tile-size));grid-template-rows:repeat(11,var(--tile-size));pointer-events:none;z-index:2}.npc-layer{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;grid-template-columns:repeat(5,var(--tile-size));grid-template-rows:repeat(11,var(--tile-size));pointer-events:none;z-index:4}.asset-layer.is-scene-locked .placeholder-interactive,.front-asset-layer.is-scene-locked .placeholder-interactive,.front-npc-layer.is-scene-locked .placeholder-interactive,.top-asset-layer.is-scene-locked .placeholder-interactive,.npc-layer.is-scene-locked .placeholder-interactive{pointer-events:none}.player-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5}.player-layer.is-depth-front{z-index:8}.tile{padding:0;border:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--tile-dark);cursor:pointer}.tile-alt{background:var(--tile-light)}.tile:focus-visible{outline:2px solid rgba(63,137,160,.45);outline-offset:-2px}@keyframes tile-click-glow{0%{opacity:0;transform:scale(.72)}18%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.18)}}@keyframes npc-pulse{0%{opacity:.85;transform:scale(.88)}to{opacity:0;transform:scale(1.18)}}@keyframes player-item-pop{0%{opacity:0;transform:translate(-50%) translateY(10px) scale(.32)}72%{opacity:1;transform:translate(-50%) translateY(-2px) scale(1.12)}to{opacity:1;transform:translate(-50%) translateY(0) scale(1)}}.box-placeholder{display:grid;place-items:center;position:relative;margin:14%;border-radius:8px;background:linear-gradient(180deg,#d6b07a,#b78548);color:#4b2f16;font-family:Arial,sans-serif;font-size:clamp(10px,calc(var(--tile-size) * .18),14px);font-weight:700;line-height:1.1;text-align:center;box-shadow:inset 0 2px #ffffff47,inset 0 -2px #5836172e,0 2px 6px #50361d29}.box-placeholder.is-walkable-highlight{background:#f8f4ff}.box-placeholder[data-box-id=cabinet-left]{background:gray;box-shadow:inset 0 2px #ffffff47,inset 0 -2px #0000001f,0 2px 6px #00000029}.has-placeholder-image{margin:0;border-radius:10px;background:none;box-shadow:none}.has-placeholder-image .placeholder-image{display:block;pointer-events:none;-webkit-user-select:none;user-select:none}.has-placeholder-image.is-contained-image{overflow:hidden}.has-placeholder-image.is-contained-image .placeholder-image{width:100%;height:100%;object-fit:contain;object-position:center}.has-placeholder-image.is-overflow-image{overflow:visible}.has-placeholder-image.is-overflow-image .placeholder-image{position:absolute;left:50%;bottom:0;width:100%;height:auto;transform:translate(-50%)}.box-placeholder.has-placeholder-image.is-overflow-image[data-box-id=cabinet] .placeholder-image{width:135%}.box-placeholder:after{content:none}.box-placeholder.is-highlighted{box-shadow:0 0 0 4px #007fff29,0 0 18px #007fff6b,inset 0 2px #ffffff47,inset 0 -2px #5836172e,0 2px 6px #50361d29}.box-placeholder.is-highlighted:before{content:"";position:absolute;top:-10%;right:-10%;bottom:-10%;left:-10%;border-radius:12px;border:2px solid rgba(0,127,255,.24);animation:npc-pulse 1.6s ease-out infinite;pointer-events:none}.human-placeholder{display:grid;place-items:center;align-self:center;justify-self:center;position:relative;width:54%;aspect-ratio:1;border-radius:50%;background:#8fa4b5;color:#21313d;font-family:Arial,sans-serif;font-size:clamp(9px,calc(var(--tile-size) * .16),12px);font-weight:700;line-height:1;text-align:center;box-shadow:inset 0 2px #ffffff3d,0 4px 8px #4355622e}.human-placeholder.has-placeholder-image{width:100%;height:100%;align-self:stretch;justify-self:stretch;aspect-ratio:auto;background:none;box-shadow:none;color:transparent;border-radius:0;--bubble-offset: calc(var(--tile-size) * .62)}.human-placeholder.has-placeholder-image .placeholder-image{width:120%}.box-placeholder.has-placeholder-image[data-box-id=spill]{background:none;box-shadow:none;border-radius:0}.placeholder-interactive{pointer-events:auto;cursor:pointer}.human-placeholder.is-highlighted{box-shadow:0 0 0 4px #007fff29,0 0 18px #007fff6b,inset 0 2px #ffffff3d,0 4px 8px #4355622e}.human-placeholder.is-highlighted:before{content:"";position:absolute;top:-18%;right:-18%;bottom:-18%;left:-18%;border-radius:50%;border:2px solid rgba(0,127,255,.24);animation:npc-pulse 1.6s ease-out infinite}.player-placeholder{--player-size: calc(var(--tile-size) * .72);position:absolute;display:grid;place-items:center;width:var(--player-size);height:var(--player-size);left:calc((var(--player-column) - 1) * var(--tile-size) + ((var(--tile-size) - var(--player-size)) / 2));top:calc((var(--player-row) - 1) * var(--tile-size) + ((var(--tile-size) - var(--player-size)) / 2));border-radius:50%;background:linear-gradient(180deg,#57d4c0,#1795a1);color:#fff;font-family:Arial,sans-serif;font-size:clamp(9px,calc(var(--tile-size) * .16),12px);font-weight:700;line-height:1;text-align:center;box-shadow:inset 0 2px #ffffff4d,0 6px 12px #165e6838;transition:left .14s linear,top .14s linear,transform .14s ease}.player-placeholder.has-player-image{border-radius:0;background:none;box-shadow:none;--bubble-offset: calc(var(--tile-size) * .62)}.player-image{position:absolute;left:50%;bottom:0;width:140%;height:auto;transform:translate(-50%);pointer-events:none;-webkit-user-select:none;user-select:none}.player-label{position:relative;z-index:1}.player-placeholder.is-moving{transform:scale(.92)}.player-item-token{position:absolute;left:50%;bottom:calc(100% + 24px);transform:translate(-50%) translateY(8px) scale(.4);width:calc(var(--tile-size) * .82);height:calc(var(--tile-size) * .82);border-radius:50%;overflow:hidden;padding:12%;display:grid;place-items:center;background:#fffffff5;color:#9a6a22;font-family:Arial,sans-serif;font-size:clamp(8px,calc(var(--tile-size) * .14),11px);font-weight:700;text-align:center;box-shadow:0 10px 22px #39503d2e;opacity:0;pointer-events:none;z-index:5;transition:opacity .22s ease,transform .22s ease,box-shadow .22s ease}.player-item-token.is-visible{opacity:1;transform:translate(-50%) translateY(0) scale(1);animation:player-item-pop .38s cubic-bezier(.22,1.3,.36,1)}.player-item-token.is-glowing{box-shadow:0 0 0 4px #ffcb5c2e,0 0 18px #ffcb5c80,0 10px 22px #39503d2e}.player-item-token .player-item-image{width:74%;height:74%;display:block;align-self:center;justify-self:center;object-fit:contain;object-position:center}.speech-bubble{position:absolute;left:50%;bottom:calc(100% + var(--bubble-offset, 10px));transform:translate(-50%);min-width:calc(var(--tile-size) * 2.2);max-width:calc(var(--tile-size) * 4.4);padding:10px 12px;border-radius:16px;background:#fffffff5;color:#29412b;font-family:Arial,sans-serif;font-size:clamp(10px,calc(var(--tile-size) * .18),13px);font-weight:700;line-height:1.3;text-align:center;box-shadow:0 12px 28px #39503d29;pointer-events:none;z-index:4}.speech-bubble:after{content:"";position:absolute;left:50%;top:100%;width:12px;height:12px;background:inherit;transform:translate(-50%) rotate(45deg);border-radius:2px}.player-bubble{max-width:calc(var(--tile-size) * 3.6)}.npc-bubble{min-width:calc(var(--tile-size) * 2.4)}.prompt-bubble{min-width:0;width:calc(var(--tile-size) * .72);height:calc(var(--tile-size) * .72);padding:0;border-radius:50%;display:grid;place-items:center;font-size:clamp(12px,calc(var(--tile-size) * .24),18px);font-weight:900;line-height:1}.prompt-bubble:after{display:none}.choice-tray{position:absolute;left:0;right:0;bottom:0;min-height:190px;display:grid;gap:10px;padding:21px 16px calc(var(--safe-bottom) + 21px);border-radius:24px 24px 0 0;background:#dfe7daf0;box-shadow:0 -18px 40px #39503d29,0 0 0 999px #1822192e;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:6;transform:translateY(20px);opacity:0;pointer-events:none;transition:transform .22s ease,opacity .22s ease}.choice-tray.is-visible{transform:translateY(0);opacity:1;pointer-events:auto}.choice-button{width:100%;min-height:54px;border:0;border-radius:18px;background:#fffffff5;color:#29412b;cursor:pointer;font-family:Arial,sans-serif;font-size:.94rem;font-weight:700;line-height:1.2;text-align:left;padding:14px 16px;box-shadow:0 12px 28px #39503d29;transition:box-shadow .18s ease,transform .18s ease,border-color .18s ease;border:2px solid transparent}.choice-button:hover:not(:disabled),.choice-button:focus-visible:not(:disabled){border-color:#007fff94;box-shadow:0 0 0 3px #007fff29,0 12px 28px #39503d29;transform:translateY(-1px)}.choice-button:disabled{opacity:.48;box-shadow:none;cursor:default}.modal-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#0009;display:grid;place-items:center;z-index:10;opacity:0;pointer-events:none;transition:opacity .22s ease}.modal-overlay.is-visible{opacity:1;pointer-events:auto}.modal-content{background:#fff;padding:24px;border-radius:24px;width:90%;max-width:340px;text-align:center;box-shadow:0 20px 40px #0000004d;transform:translateY(20px);transition:transform .3s cubic-bezier(.22,1,.36,1)}.modal-overlay.is-visible .modal-content{transform:translateY(0)}.modal-content h2{margin-top:0;color:#29412b;font-family:Arial,sans-serif;font-size:1.4rem}.emoji-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0}.emoji-button{aspect-ratio:1;font-size:2rem;border:2px solid #f0f0f0;border-radius:12px;background:#fbfbfb;cursor:pointer;display:grid;place-items:center;transition:all .18s ease}.emoji-button:hover,.emoji-button:focus-visible{background:#f8f4ff;border-color:#007fff;transform:scale(1.05)}.emoji-button.is-wrong{opacity:.3;pointer-events:none;filter:grayscale(1)}.modal-close-button{background:none;border:0;color:#888;font-family:Arial,sans-serif;font-weight:700;cursor:pointer;margin-top:10px}.congrats-content p{color:#555;margin-bottom:24px;font-family:Arial,sans-serif}.cleaning-progress-wrap{position:absolute;bottom:calc(100% + 12px);left:50%;transform:translate(-50%);width:calc(var(--tile-size) * 1.5);display:flex;flex-direction:column;align-items:center;pointer-events:none;z-index:10}.cleaning-progress-wrap[hidden]{display:none!important}.progress-bar-bg{width:100%;height:8px;background:#00000026;border-radius:4px;overflow:hidden;box-shadow:inset 0 1px 2px #0003}.progress-bar-fill{width:0%;height:100%;background:linear-gradient(90deg,#5ea6d8,#007fff);border-radius:4px;transition:width .1s linear}.progress-text{margin-top:4px;font-family:Arial,sans-serif;font-size:10px;font-weight:700;color:#007fff;text-transform:uppercase;letter-spacing:.5px;text-shadow:0 1px 2px rgba(255,255,255,.8)}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:768px){:root{--frame-border: 8px;--stage-width: min( calc(100vw - 48px) , calc(var(--frame-max-width) + (var(--frame-border) * 2)));--stage-height: min( calc(100vh - 48px) , calc(var(--frame-max-height) + (var(--frame-border) * 2)));--tile-size: min( calc((var(--stage-width) - (var(--frame-border) * 2)) / 7), calc((var(--stage-height) - (var(--frame-border) * 2)) / 13) )}.app-shell{padding:24px}.phone-frame{border-radius:34px;overflow:hidden;box-shadow:var(--frame-shadow);border:var(--frame-border) solid rgba(61,74,60,.12)}}