*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0f2a1a;--panel: rgba(12, 40, 24, .92);--panel-border: rgba(244, 211, 94, .45);--text: #f6fff8;--muted: #b7d4c2;--accent: #f4d35e;--accent-2: #52b788;--danger: #e76f51;--btn: #2d6a4f;--btn-hover: #40916c;--shadow: 0 10px 30px rgba(0, 0, 0, .35);font-family:Segoe UI,system-ui,-apple-system,sans-serif}html,body{width:100%;height:100%;overflow:hidden;background:radial-gradient(ellipse at 50% 20%,#1b4332 0%,var(--bg) 70%);color:var(--text);touch-action:none;-webkit-tap-highlight-color:transparent;user-select:none}#app{width:100%;height:100%;display:grid;place-items:center;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}#game-shell{position:relative;width:min(100vw,calc(100vh * 16 / 9));height:min(100vh,56.25vw);max-width:100%;max-height:100%;box-shadow:var(--shadow);border-radius:12px;overflow:hidden;background:#123524}#game{display:block;width:100%;height:100%;cursor:pointer}.ui-root{position:absolute;inset:0;pointer-events:none;display:grid;place-items:center}.ui-root>*{pointer-events:auto}.panel{width:min(92%,420px);background:var(--panel);border:1px solid var(--panel-border);border-radius:18px;padding:1.35rem 1.4rem 1.5rem;box-shadow:var(--shadow);text-align:center;backdrop-filter:blur(8px)}.panel h1{font-size:clamp(1.6rem,5vw,2.2rem);letter-spacing:.02em;color:var(--accent);margin-bottom:.35rem}.panel .tagline{color:var(--muted);font-size:.95rem;margin-bottom:1rem;line-height:1.4}.panel .score-big{font-size:clamp(2.2rem,8vw,3.2rem);font-weight:800;color:var(--accent);margin:.4rem 0 .2rem}.panel .meta{color:var(--muted);font-size:.9rem;margin-bottom:1rem}.btn-row{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin-top:.75rem}button.btn{appearance:none;border:none;border-radius:999px;padding:.72rem 1.25rem;min-height:44px;min-width:44px;font:inherit;font-weight:700;letter-spacing:.02em;color:#082015;background:linear-gradient(180deg,#ffe08a,var(--accent));cursor:pointer;box-shadow:0 4px #c9a227;transition:transform .08s ease,filter .15s ease}button.btn:hover{filter:brightness(1.05)}button.btn:active{transform:translateY(2px);box-shadow:0 2px #c9a227}button.btn.secondary{color:var(--text);background:linear-gradient(180deg,#52b788,var(--btn));box-shadow:0 4px #1b4332}button.btn.ghost{color:var(--text);background:transparent;border:1px solid rgba(255,255,255,.25);box-shadow:none}.instructions{text-align:left;color:var(--muted);font-size:.92rem;line-height:1.5;margin:.5rem 0 .25rem}.instructions li{margin-left:1.1rem;margin-bottom:.35rem}.hud-hint{position:absolute;left:50%;bottom:3.5%;transform:translate(-50%);color:#ffffffb8;font-size:clamp(.75rem,2.2vw,.9rem);text-shadow:0 1px 3px rgba(0,0,0,.6);pointer-events:none;white-space:nowrap}.top-controls{position:absolute;top:2.5%;right:2%;display:flex;gap:.4rem;pointer-events:auto}.icon-btn{width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:#0820158c;color:var(--text);font-size:1rem;cursor:pointer;display:grid;place-items:center;backdrop-filter:blur(4px)}.icon-btn:hover{background:#082015cc}.hidden{display:none!important}.hud-3d{position:absolute;top:2.5%;left:3%;z-index:2;pointer-events:none;text-shadow:0 2px 8px rgba(0,0,0,.55)}.hud-3d .hud-score{font-size:clamp(1.8rem,5vw,2.6rem);font-weight:800;color:var(--accent);letter-spacing:.02em;line-height:1}.hud-3d .hud-meta{margin-top:.25rem;font-size:clamp(.75rem,2vw,.9rem);color:#f6fff8e0}.hud-3d .hud-note{margin-top:.2rem;font-size:clamp(.65rem,1.6vw,.78rem);color:#b7d4c2d9;text-transform:uppercase;letter-spacing:.06em}.banner-3d{position:absolute;top:18%;left:50%;transform:translate(-50%);z-index:3;pointer-events:none;font-size:clamp(2.4rem,8vw,4rem);font-weight:900;letter-spacing:.04em;color:var(--accent);text-shadow:0 0 24px rgba(244,211,94,.55),0 4px 0 rgba(0,0,0,.35);animation:banner-pop .35s ease-out}.banner-3d.four{color:#fff;text-shadow:0 0 20px rgba(255,255,255,.45),0 4px 0 rgba(0,0,0,.35)}.banner-3d.out{color:var(--danger);text-shadow:0 0 18px rgba(231,111,81,.5),0 4px 0 rgba(0,0,0,.35)}@keyframes banner-pop{0%{transform:translate(-50%) scale(.6);opacity:0}to{transform:translate(-50%) scale(1);opacity:1}}@media(prefers-reduced-motion:reduce){button.btn{transition:none}}@media(orientation:portrait)and (max-width:700px){#game-shell{width:min(100vw,calc(100vh * 16 / 9));height:min(100vh,56.25vw);border-radius:0}}