:root{--sky: #dff1f5;--grass: #cfe8dc;--soil: #c9a98a;--ink: #4f6b58;--card: #f4faf6;--accent: #8ec5d6;--accent-dark: #6fa9bd;--warm: #f8e3a1;--target: 96px}html.calm{--sky: #e6f0f2;--grass: #dbeae2;--accent: #a8cfdb;--warm: #f1e6bd}*,*:before,*:after{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;background:var(--sky);touch-action:none;user-select:none;-webkit-user-select:none;overscroll-behavior:none;font-family:system-ui,sans-serif;color:var(--ink)}#app{position:fixed;top:0;right:0;bottom:0;left:0}#stage{position:absolute;top:0;right:0;bottom:0;left:0}img{pointer-events:none;-webkit-user-drag:none}button{font:inherit;color:inherit}.scene{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;background:linear-gradient(var(--sky) 0 62%,var(--grass) 62% 100%)}.bubble{position:absolute;left:0;top:0;will-change:transform,opacity;pointer-events:none}.bubble img{width:100%;height:100%;display:block}.ring{position:absolute;border-radius:50%;border:4px solid #9fcbe6;pointer-events:none;will-change:transform,opacity}.corner-btn{position:absolute;bottom:16px;width:var(--target);height:var(--target);border-radius:50%;border:none;background:var(--card);opacity:.92;display:grid;place-items:center;padding:0}.corner-btn svg{width:56%;height:56%}.say-it{right:16px}.hold-btn{position:fixed;bottom:16px;width:64px;height:64px;border-radius:50%;border:none;background:var(--card);opacity:.6;z-index:30;padding:0}.hold-btn svg{width:100%;height:100%;display:block}.hold-btn .ring-progress{stroke:var(--accent-dark);stroke-width:5;fill:none;stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%}#gate-btn{left:16px}#silence-btn{left:96px}#silence-btn.active{opacity:.95;background:var(--warm)}.word-card{position:absolute;left:50%;top:14%;transform:translate(-50%);display:flex;align-items:center;gap:20px;padding:14px 28px;border-radius:28px;background:var(--card);pointer-events:none;opacity:0}.word-card img{height:96px;width:auto}.word-card span{font-size:56px;font-weight:600}.garden-flower{position:absolute;left:50%;bottom:8%;height:56%;transform:translate(-50%);pointer-events:none}.garden-flower img{height:100%;display:block}.can{position:absolute;bottom:12%;display:grid;place-items:center;border-radius:50%;will-change:transform,opacity}.can img.can-art{width:80%;pointer-events:none}.can .cue{position:absolute;top:-18%;width:34%}.can.child{left:6%;width:30vmin;height:30vmin}.can.adult{right:6%;width:22vmin;height:22vmin}.can.dim{opacity:.35}.can.active:after{content:"";position:absolute;top:-6%;right:-6%;bottom:-6%;left:-6%;border-radius:50%;border:6px solid var(--warm);opacity:.9;pointer-events:none}.drops{position:absolute;pointer-events:none}.replay{position:absolute;left:50%;bottom:14%;transform:translate(-50%);min-width:200px;height:96px;padding:0 36px;border-radius:48px;border:none;background:var(--warm);font-size:32px;font-weight:600;display:none}.sparkle{position:absolute;width:18px;height:18px;border-radius:50%;background:var(--warm);pointer-events:none;will-change:transform,opacity}.menu{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;background:linear-gradient(var(--sky) 0 62%,var(--grass) 62% 100%)}.menu-inner{margin:auto;display:flex;align-items:center;justify-content:center;gap:5vmin;flex-wrap:wrap;padding:4vmin}.tile{width:38vmin;height:38vmin;border-radius:6vmin;background:var(--card);border:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2vmin;padding:2vmin}.tile img{width:60%;height:60%;object-fit:contain}.tile span{font-size:clamp(16px,3.4vmin,28px)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#4f6b5859;display:flex;align-items:center;justify-content:center}.scrollable{overflow-y:auto;touch-action:pan-y;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.panel{width:min(640px,94vw);max-height:92vh;background:var(--card);border-radius:24px;padding:20px 24px}.panel h2{margin:0 0 10px;font-size:24px}.panel h3{margin:18px 0 6px;font-size:18px}.row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0;min-height:56px}.btn{min-height:56px;min-width:56px;padding:0 20px;border-radius:28px;border:none;background:var(--accent);font-size:18px}.btn.on{background:var(--warm)}.panel ul{margin:0;padding-left:20px;line-height:1.5}.panel small{display:block;line-height:1.4}.level{letter-spacing:4px;font-size:22px}
