:root{--ink:#3a2e2a;--cream:#f6ebd8;--cream-2:#efdfc2;--terracotta:#d06a3b;--leaf:#5e8c4a;--dusk:#4a5b7d;--gold:#e8b84a;--neon:#e86a92;--hud-bg:#3a2e2ad1;--font:"Baloo 2", "Comic Sans MS", "Chalkboard SE", "Arial Rounded MT Bold", "Hiragino Maru Gothic ProN", "Yu Gothic UI", system-ui, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--ink);font-family:var(--font);color:var(--ink);-webkit-user-select:none;user-select:none;overscroll-behavior:none;margin:0;padding:0;position:fixed;inset:0;overflow:hidden}#game-root{background:var(--ink);position:fixed;top:0;left:0;overflow:hidden}button{font-family:var(--font);cursor:pointer;touch-action:manipulation;border:none}.screen{display:none;position:absolute;inset:0}.screen.visible{flex-direction:column;display:flex}.title-screen{background:radial-gradient(120% 90% at 50% 0%, #5a463e 0%, var(--ink) 70%);text-align:center;justify-content:center;align-items:center;gap:14px;padding:24px}.title-mascot{filter:drop-shadow(0 8px 18px #00000059);width:min(38vw,170px);animation:2.6s ease-in-out infinite mascot-bob}@keyframes mascot-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.title-logo{color:var(--cream);letter-spacing:1px;text-shadow:0 3px #00000059;margin:0;font-size:clamp(34px,9vw,52px);font-weight:900}.title-tagline{color:var(--cream-2);margin-bottom:10px;font-size:clamp(15px,4vw,19px)}.title-enter-hint{color:#f6ebd88c;margin-top:8px;font-size:13px}.title-mute{top:calc(14px + env(safe-area-inset-top));right:calc(14px + env(safe-area-inset-right));position:absolute}.how-card{z-index:5;background:#1e1613eb;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:28px;display:none;position:absolute;inset:0}.how-card.visible{display:flex}.how-card .overlay-body{max-width:420px;color:var(--cream);font-size:16px;line-height:1.55}.btn{border-radius:16px;min-width:48px;min-height:48px;padding:12px 26px;font-size:17px;font-weight:800;transition:transform 80ms,filter .15s}.btn:active{transform:scale(.95)}.btn-primary{background:linear-gradient(180deg, #ffd94a, var(--gold));color:#5a3c00;box-shadow:0 4px #b98a2a,0 6px 14px #0000004d}.btn-secondary{background:var(--cream);color:var(--ink);box-shadow:0 4px #c9b694,0 6px 14px #00000040}.btn-big{width:min(74vw,300px);font-size:20px}.btn-block{width:100%;margin-top:10px}.btn-icon{background:var(--hud-bg);width:46px;height:46px;color:var(--cream);border-radius:14px;justify-content:center;align-items:center;font-size:22px;display:flex}.btn-tool{background:var(--hud-bg);width:56px;height:56px;color:var(--cream);border-radius:50%;justify-content:center;align-items:center;font-size:24px;display:flex;box-shadow:0 3px #00000059}.btn-tool:disabled{opacity:.45;filter:grayscale(.7)}.btn-tool.active{background:var(--gold);color:#5a3c00}.btn-tool.ready{background:linear-gradient(180deg, #ffd94a, var(--gold));color:#5a3c00;animation:1.2s ease-in-out infinite hint-pulse}@keyframes hint-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.btn-offer{color:#083354;background:linear-gradient(#7fd0ff,#4aa8e8);margin-top:12px;font-size:15px;box-shadow:0 4px #2a78b0,0 6px 14px #0000004d}.levels-screen{background:radial-gradient(120% 90% at 50% 0%, #5a463e 0%, var(--ink) 70%);padding:calc(12px + env(safe-area-inset-top)) 16px calc(16px + env(safe-area-inset-bottom))}.levels-header{align-items:center;gap:12px;margin-bottom:14px;display:flex}.levels-title{color:var(--cream);flex:1;font-size:26px;font-weight:900}.levels-stars{color:var(--gold);font-size:18px;font-weight:900}.levels-grid{touch-action:pan-y;flex:1;grid-template-columns:repeat(auto-fill,minmax(108px,1fr));align-content:start;gap:12px;width:100%;max-width:760px;margin:0 auto;padding-bottom:20px;display:grid;overflow-y:auto}.level-tile{aspect-ratio:1;background:var(--cream);background-position:50%;background-size:cover;border-radius:18px;flex-direction:column;justify-content:center;align-items:center;gap:2px;display:flex;box-shadow:0 4px #c9b694}.level-tile .level-num,.level-tile .level-tier,.level-tile .level-stars{text-shadow:0 1px 3px #0000008c,0 0 8px #f6ebd8a6}.level-tile.tier-mid{background:#f3e2c4}.level-tile.tier-high{background:#e8d3b3}.level-tile.locked{opacity:.55;filter:grayscale(.6)}.level-tile.found{outline:3px solid var(--leaf)}.level-num{font-size:26px;font-weight:900}.level-tier{color:#7a6558;font-size:12px;font-weight:700}.level-stars{color:var(--gold);text-shadow:0 1px #0003;font-size:15px}.game-screen{background:var(--ink)}.stage-wrap{position:absolute;inset:0}.stage{position:absolute;inset:0;overflow:hidden}.stage-backdrop{filter:blur(26px)brightness(.55);background-position:50%;background-size:cover;position:absolute;inset:-40px;transform:scale(1.1)}.scene-frame{touch-action:none;border-radius:6px;position:absolute;top:50%;left:50%;overflow:hidden;translate:-50% -50%;box-shadow:0 10px 40px #00000080}.scene-transform{transform-origin:0 0;will-change:transform;position:absolute;top:0;left:0}.scene-img{pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0}.hint-layer,.reveal-layer{pointer-events:none;position:absolute;inset:0}.ripple-layer{pointer-events:none;position:absolute;inset:0;overflow:hidden}.sparkle-canvas{pointer-events:none;position:absolute;inset:0}.hint-region{background:#ffd94a1f;border:4px dashed #ffd94af2;border-radius:50%;animation:1.4s ease-in-out infinite hint-region-pulse;position:absolute;box-shadow:0 0 24px #ffd94a73}@keyframes hint-region-pulse{0%,to{opacity:.95;transform:scale(1)}50%{opacity:.7;transform:scale(1.06)}}.ripple{pointer-events:none;border-radius:50%;animation:.45s ease-out forwards ripple-expand;position:absolute}.ripple-miss{border:3px solid #dcdcdcbf}.ripple-hit{border:4px solid var(--gold);box-shadow:0 0 18px #e8b84acc}@keyframes ripple-expand{0%{opacity:1;transform:scale(.4)}to{opacity:0;transform:scale(1.6)}}.reveal-ring{pointer-events:none;border-radius:50%;position:absolute}.reveal-ring.reveal-found{border:5px solid var(--gold);animation:.9s ease-out forwards reveal-pop;box-shadow:0 0 30px #e8b84ae6}.reveal-ring.reveal-timeout{border:5px solid #8ea3d0;animation:.9s ease-out forwards reveal-calm;box-shadow:0 0 26px #4a5b7de6}.reveal-crop{pointer-events:none;border-radius:50%;position:absolute}.reveal-crop.reveal-found{animation:.9s ease-out forwards reveal-pop}.reveal-crop.reveal-timeout{filter:saturate(.85);animation:.9s ease-out forwards reveal-calm}.ear-wiggle{animation:.9s ease-out forwards reveal-pop,.5s ease-in-out .92s 2 ear-wiggle}@keyframes reveal-pop{0%{opacity:0;transform:scale(.2)}35%{opacity:1;transform:scale(1.15)}60%{transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes reveal-calm{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes ear-wiggle{0%,to{transform:scale(1)rotate(0)}30%{transform:scale(1.03)rotate(-2deg)}70%{transform:scale(1.03)rotate(2deg)}}.magnifier-lens{pointer-events:none;z-index:6;border:5px solid #f6ebd8f2;border-radius:50%;width:156px;height:156px;display:none;position:absolute;overflow:hidden;box-shadow:0 0 0 3px #3a2e2a99,0 10px 30px #00000080,inset 0 0 18px #ffffff40}.magnifier-lens img{transform-origin:0 0;position:absolute;top:0;left:0}.hud-top{padding:calc(10px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) 10px calc(12px + env(safe-area-inset-left));z-index:8;pointer-events:none;align-items:center;gap:10px;display:flex;position:absolute;top:0;left:0;right:0}.hud-top>*{pointer-events:auto}.hud-chip{background:var(--hud-bg);color:var(--cream);white-space:nowrap;border-radius:14px;padding:9px 14px;font-size:15px;font-weight:800}.hud-level{text-overflow:ellipsis;flex:0 auto;overflow:hidden}.hud-timer{font-variant-numeric:tabular-nums;margin-left:auto;font-size:18px}.hud-timer.warn{color:#ffe28a;background:#a03a2a;animation:1s ease-in-out infinite timer-heartbeat}@keyframes timer-heartbeat{0%,to{transform:scale(1)}25%{transform:scale(1.12)}}.hud-bottom{padding:10px calc(16px + env(safe-area-inset-right)) calc(14px + env(safe-area-inset-bottom)) calc(16px + env(safe-area-inset-left));z-index:8;pointer-events:none;justify-content:space-between;align-items:flex-end;gap:12px;display:flex;position:absolute;bottom:0;left:0;right:0}.hud-bottom>*{pointer-events:auto}.hud-hint-wrap{flex-direction:column;align-items:center;gap:4px;display:flex}.hud-hint-sub{color:var(--cream);background:var(--hud-bg);white-space:nowrap;border-radius:10px;padding:3px 10px;font-size:12px;font-weight:800}.wide .hud-bottom{padding:12px calc(12px + env(safe-area-inset-right)) 12px 12px;flex-direction:column;align-items:center;inset:50% 0 auto auto;translate:0 -50%}.veil{z-index:9;background:#1e1613e0;flex-direction:column;justify-content:center;align-items:center;gap:16px;display:none;position:absolute;inset:0}.veil.visible{display:flex}.veil-spinner{border:5px solid #f6ebd840;border-top-color:var(--gold);border-radius:50%;width:44px;height:44px;animation:.9s linear infinite veil-spin}@keyframes veil-spin{to{transform:rotate(360deg)}}.veil-text{color:var(--cream);font-size:17px;font-weight:800}.veil-error{color:#ffb0a0}.overlay{z-index:12;background:#1e1613b8;justify-content:center;align-items:center;padding:24px;display:none;position:absolute;inset:0}.overlay.visible{display:flex}.overlay-card{background:var(--cream);text-align:center;border-radius:22px;width:min(86vw,360px);padding:26px 24px;box-shadow:0 16px 50px #00000080}.overlay-title{margin-bottom:8px;font-size:24px;font-weight:900}.overlay-body{color:#6b574a;margin-bottom:10px;font-size:15px;line-height:1.5}.buffer-overlay{z-index:30;background:#1e16138c}.buffer-text{color:var(--cream);text-shadow:0 2px 6px #0009;font-size:22px;font-weight:900;animation:1s ease-in-out infinite hint-pulse}.rotate-overlay{z-index:40;background:var(--ink)}.rotate-overlay .overlay-title{color:var(--cream)}.toast{background:var(--hud-bg);color:var(--cream);z-index:50;text-align:center;border-radius:14px;max-width:84vw;padding:10px 20px;font-size:15px;font-weight:800;display:none;position:fixed;bottom:18%;left:50%;translate:-50%}.toast.visible{animation:.25s ease-out toast-in;display:block}@keyframes toast-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.tutorial-layer{pointer-events:none;z-index:10;display:none;position:absolute;inset:0}.tutorial-layer.visible{display:block}.tut-bubble{background:var(--gold);color:#5a3c00;text-align:center;border-radius:16px;max-width:84vw;padding:10px 18px;font-size:16px;font-weight:900;animation:1.6s ease-in-out infinite tut-bubble-bob;position:absolute;left:50%;translate:-50%;box-shadow:0 6px 18px #00000059}.tut-bubble-top{top:calc(64px + env(safe-area-inset-top))}.tut-bubble-bottom{bottom:calc(108px + env(safe-area-inset-bottom))}@keyframes tut-bubble-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.tut-ring-center{border:4px solid #ffd94ae6;border-radius:50%;width:84px;height:84px;animation:1.3s ease-in-out infinite hint-region-pulse;position:absolute;top:33%;left:50%;translate:-50% -50%}.tut-ghost{filter:drop-shadow(0 4px 8px #00000080);font-size:44px;position:absolute}.tut-ghost-tap{animation:1.3s ease-in-out infinite tut-tap;top:33%;left:50%;translate:-12% -30%}@keyframes tut-tap{0%,to{transform:translateY(0)scale(1)}45%{transform:translateY(10px)scale(.88)}60%{transform:translateY(10px)scale(.88)}}.tut-ghost-drag{animation:1.8s ease-in-out infinite tut-drag;top:56%;left:35%}@keyframes tut-drag{0%,to{transform:translate(0)}50%{transform:translate(30vw)}}.tut-pointer{filter:drop-shadow(0 4px 8px #00000080);font-size:38px;animation:.9s ease-in-out infinite tut-point;position:absolute;translate:-50%}.tut-pointer-hint{left:50%;bottom:calc(86px + env(safe-area-inset-bottom))}@keyframes tut-point{0%,to{transform:translateY(0)}50%{transform:translateY(10px)}}.result-screen{z-index:11;background:#1e16138c;justify-content:center;align-items:center;padding:22px;display:none}.result-screen.visible{display:flex}.result-card{background:var(--cream);text-align:center;border-radius:24px;width:min(88vw,380px);padding:24px 22px;animation:.35s cubic-bezier(.2,1.4,.4,1) result-in;box-shadow:0 18px 60px #0000008c}.result-card.result-timeout{background:#e9e4da}@keyframes result-in{0%{opacity:0;transform:scale(.8)translateY(30px)}to{opacity:1;transform:scale(1)translateY(0)}}.result-stars{letter-spacing:6px;color:#cdbfa8;margin:6px 0;font-size:44px}.result-star.lit{color:var(--gold);text-shadow:0 2px #b98a2a}.result-star.pop{animation:.4s cubic-bezier(.2,1.6,.4,1) star-pop;display:inline-block}@keyframes star-pop{0%{transform:scale(.2)rotate(-30deg)}to{transform:scale(1)rotate(0)}}.result-stats{color:#6b574a;flex-wrap:wrap;justify-content:center;gap:14px;margin:8px 0;font-size:13px;font-weight:800;display:flex}.result-record{color:var(--terracotta);margin:4px 0;font-size:16px;font-weight:900}.result-gap{color:#7a6558;margin-bottom:6px;font-size:13px;font-weight:700}.result-restart-hint{font-size:13px}.result-actions{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:10px;display:flex}.modal-overlay{z-index:25;background:#1e1613c7;justify-content:center;align-items:center;padding:24px;display:flex;position:absolute;inset:0}.modal-card{background:var(--cream);text-align:center;border-radius:22px;width:min(86vw,360px);padding:24px 22px;box-shadow:0 16px 50px #00000080}.modal-title{margin-bottom:10px;font-size:21px;font-weight:900}.modal-body{color:#6b574a;margin-bottom:8px;font-size:14px;line-height:1.5}.modal-note{color:#8a7466;font-size:12.5px}.modal-actions{justify-content:center;gap:10px;margin-top:12px;display:flex}.modal-actions .btn:disabled{opacity:.5}@media (height<=480px){.title-screen{justify-content:flex-start;gap:8px;padding:12px;overflow-y:auto}.title-mascot{width:70px}.title-logo{font-size:26px}.title-tagline{margin-bottom:2px;font-size:13px}.title-enter-hint{display:none}.btn-big{width:min(60vw,260px);min-height:40px;padding:8px 20px;font-size:16px}}.ad-blocker{z-index:24;touch-action:none;background:0 0;position:absolute;inset:0}