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