:root{--ink:#1c2a38;--sand:#f7efd8;--sky:#87d4ef;--coral:#e85d3a;--lagoon:#2f9e8f;--gold:#f5ba49;--panel:#1c2a38d1;color:var(--sand);background:var(--sky);font-synthesis:none;text-rendering:optimizelegibility;font-family:PingFang SC,Microsoft YaHei,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{min-width:320px}#app{background:linear-gradient(#87d4ef 0%,#c8ecf8 55%,#f0d8a0 100%);position:relative}#game-canvas{touch-action:none;outline:none;width:100vw;height:100vh;display:block}#flash-overlay{opacity:0;pointer-events:none;z-index:5;background:#fff;position:absolute;inset:0}#hud{top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));left:max(12px, env(safe-area-inset-left));pointer-events:none;z-index:3;flex-wrap:wrap;justify-content:space-between;gap:8px;display:flex;position:absolute}.hud-cluster{align-items:center;gap:8px;display:flex}.hud-metric{background:var(--panel);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);white-space:nowrap;border:1px solid #f7efd847;border-radius:10px;min-width:88px;padding:8px 10px;box-shadow:0 8px 20px #1c2a382e}.hud-metric.combo{border-color:#f5ba498c}.hud-metric span{color:#f7efd8b8;letter-spacing:.04em;font-size:.68rem;display:block}.hud-metric strong{font-variant-numeric:tabular-nums;white-space:nowrap;margin-top:2px;font-size:1.15rem;display:block}.hud-metric small{opacity:.75;font-size:.7rem}#pause-button{background:var(--panel);width:44px;height:44px;color:var(--sand);pointer-events:auto;cursor:pointer;touch-action:none;border:1px solid #f7efd84d;border-radius:12px;font-size:1rem}#status-line{border-left:3px solid var(--gold);background:#1c2a38b3;border-radius:0 8px 8px 0;min-width:140px;max-width:min(280px,70vw);padding:8px 12px;font-size:.82rem;font-weight:700;position:absolute;top:calc(100% + 10px);left:0}.panel{text-align:center;z-index:4;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1c2a38e6;border:1px solid #f7efd859;border-radius:18px;width:min(420px,100vw - 32px);padding:28px 26px 24px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 18px 50px #1c2a3859}.panel[hidden]{display:none!important}.eyebrow{color:var(--gold);letter-spacing:.18em;text-transform:uppercase;margin:0;font-size:.78rem}.panel h1,.panel h2{margin:8px 0 10px;font-size:clamp(1.8rem,5vw,2.4rem);line-height:1.15}.lede{color:#f7efd8d1;margin:0 0 16px;font-size:.95rem}.controls-hint{color:#f7efd8e0;gap:8px;margin:0 0 20px;padding:0;font-size:.9rem;list-style:none;display:grid}.controls-hint kbd{background:#f7efd81a;border:1px solid #f7efd859;border-radius:6px;min-width:22px;margin-right:4px;padding:2px 6px;font-family:inherit;font-size:.78rem;display:inline-block}.reason{color:var(--gold);margin:0 0 16px;font-weight:700}.results{grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px;display:grid}.results div{background:#f7efd814;border-radius:10px;padding:10px 6px}.results span{color:#f7efd8a6;font-size:.7rem;display:block}.results strong{font-variant-numeric:tabular-nums;margin-top:4px;font-size:1.05rem;display:block}button.primary,button.ghost{cursor:pointer;touch-action:manipulation;border-radius:12px;width:100%;min-height:48px;margin-top:10px;font-size:1rem;font-weight:800;display:block}button.primary{background:var(--coral);color:#fff8ef;border:none;box-shadow:0 8px #b43f24}button.primary:active{transform:translateY(3px);box-shadow:0 4px #b43f24}button.ghost{color:var(--sand);background:0 0;border:1px solid #f7efd859}#touch-controls{right:max(14px, env(safe-area-inset-right));bottom:max(14px, env(safe-area-inset-bottom));left:max(14px, env(safe-area-inset-left));pointer-events:none;z-index:3;justify-content:space-between;align-items:flex-end;display:none;position:absolute}.touch-side{pointer-events:none;align-items:flex-end;gap:14px;display:flex}#touch-controls button{width:68px;min-width:48px;height:68px;min-height:48px;color:var(--sand);pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;background:#1c2a38b8;border:1px solid #f7efd859;border-radius:50%;font-size:1.15rem;font-weight:800}#touch-controls button[data-action=duck],#touch-controls button[data-action=jump]{width:68px;height:68px;font-size:1.25rem}#touch-controls button[data-action=duck]{color:#fff8ef;background:#764c35;border-color:#0000}#touch-controls button[data-action=jump]{color:#fff8ef;background:#2b7acb;border-color:#0000}#touch-controls button:active{transform:scale(.94)}@media (pointer:coarse),(width<=760px){.hud-metric{min-width:72px;padding:6px 8px}.hud-metric strong{font-size:1rem}#status-line{font-size:.75rem}#touch-controls{display:flex}.controls-hint{display:none}.panel{padding:22px 18px 18px}}