:root{--ink:#12354a;--orange:#ff6b35;--gold:#ffc857;--teal:#0d9488;--shadow:0 20px 60px rgba(2,24,43,.3)}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#072c43;color:var(--ink)}button,a{font:inherit}.hide{display:none!important}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#stage{position:fixed;inset:0;overflow:hidden;touch-action:none;background:linear-gradient(155deg,#0c8190 0%,#087082 48%,#07556f 100%);outline:none}.arena,#targets,#effects{position:absolute;inset:0}.arena{display:none}
.target{position:absolute;width:82px;height:82px;display:grid;place-items:center;will-change:transform;filter:drop-shadow(0 8px 8px #001c);user-select:none}.target img{width:100%;height:100%;object-fit:contain;pointer-events:none}.target.golden{filter:drop-shadow(0 0 18px #ffd447) drop-shadow(0 6px 7px #0019)}.target.golden::after{content:"BONUS";position:absolute;top:-14px;padding:2px 7px;border-radius:999px;background:#ffc857;color:#583600;font:900 10px Poppins,sans-serif;letter-spacing:.08em}.bomb-art{position:relative;width:58px;height:58px;border-radius:50%;background:radial-gradient(circle at 34% 29%,#64748b 0 8%,#17202c 28%,#020617 70%);box-shadow:inset -7px -8px 12px #0008,0 8px 13px #0008}.bomb-art::before{content:"";position:absolute;left:40px;top:-14px;width:24px;height:28px;border:6px solid #926639;border-left:0;border-bottom:0;border-radius:0 20px 0 0}.bomb-art::after{content:"✦";position:absolute;right:-18px;top:-25px;color:#ffd257;font-size:28px;text-shadow:0 0 12px #ff6b35;animation:spark .45s alternate infinite}
.blade{position:absolute;left:50%;top:55%;width:54px;height:54px;transform:translate(-50%,-50%);pointer-events:none;z-index:35;opacity:0}.blade.on,.blade.keyboard{opacity:1}.blade span{position:absolute;left:2px;top:25px;width:50px;height:5px;border-radius:99px;background:#fff;box-shadow:0 0 5px #fff,0 0 14px #6ee7ff,0 0 28px #38bdf8;transform:rotate(-34deg)}.trail{position:absolute;width:14px;height:14px;border-radius:50%;transform:translate(-50%,-50%);background:#fff;box-shadow:0 0 12px 4px #7dd3fcaa;animation:trailOut .32s ease-out forwards}.fruit-half{position:absolute;width:66px;height:66px;background-size:contain;background-repeat:no-repeat;background-position:center;z-index:12;animation:halfLeft .62s ease-in forwards}.fruit-half.right{animation-name:halfRight}.fruit-half.left{clip-path:polygon(0 0,52% 0,43% 100%,0 100%)}.fruit-half.right{clip-path:polygon(52% 0,100% 0,100% 100%,43% 100%)}.juice{position:absolute;width:10px;height:10px;border-radius:50%;background:var(--juice,#ff825f);animation:juice .55s ease-out forwards}.score-pop{position:absolute;z-index:20;color:#fff;font-weight:1000;font-size:1.35rem;text-shadow:0 2px 2px #000,0 0 12px #0ff;animation:popUp .65s ease-out forwards}.score-pop.perfect{color:#ffe27a}.screen-hit{animation:screenHit .25s ease}
.hud{position:fixed;top:64px;left:0;right:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px clamp(12px,3vw,38px);pointer-events:none}.hud__left,.hud__right{display:flex;gap:8px}.hud-chip,.icon-btn{min-height:52px;border:1px solid #ffffff80;border-radius:16px;background:#f8fdffeb;color:#123b55;box-shadow:0 9px 22px #0015;backdrop-filter:blur(10px)}.hud-chip{display:flex;align-items:center;gap:8px;padding:7px 14px}.hud-chip small,.hud-chip strong{display:block;line-height:1}.hud-chip small{font-size:.64rem;text-transform:uppercase;letter-spacing:.08em;opacity:.72}.hud-chip strong{font-size:1.25rem;margin-top:4px}.combo-chip{color:#9a3412;background:#fff3d9ed}.lives-chip{color:#b91c1c}.icon-btn{width:52px;border:1px solid #fff;pointer-events:auto;font-weight:1000;font-size:1.2rem;cursor:pointer}.icon-btn:focus-visible,.mode-card:focus-visible,.primary-btn:focus-visible,.secondary-btn:focus-visible,.text-btn:focus-visible{outline:4px solid #ffe17b;outline-offset:3px}.wave-meter{position:absolute;left:50%;top:10px;transform:translateX(-50%);width:min(260px,28vw);height:32px;border:2px solid #ffffffaa;border-radius:999px;background:#062d45aa;overflow:hidden;color:#fff;text-align:center}.wave-meter span{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,#0cc5b8,#f7c948)}.wave-meter b{position:relative;font-size:.76rem;line-height:27px;text-shadow:0 1px 2px #000}
.start-screen,.panel-overlay{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:82px 18px 20px;background:#031c2ea6;backdrop-filter:blur(7px);overflow:auto}.start-card,.panel-card{width:min(760px,100%);border:1px solid #ffffffc7;border-radius:30px;background:linear-gradient(145deg,#fffdf7,#eefbfa);box-shadow:var(--shadow);text-align:center;padding:clamp(22px,4vw,42px)}.brand-mark{display:flex;align-items:center;justify-content:center;height:56px;font-size:3rem}.blade-mark{font-size:4.4rem;color:#38bdf8;line-height:1;text-shadow:0 0 12px #7dd3fc}.eyebrow{margin:8px 0;color:#087e79;font-weight:900;font-size:.72rem;letter-spacing:.18em}.start-card h1,.panel-card h2{font-family:'Playfair Display',serif;color:#103f57;margin:4px 0 8px;font-size:clamp(2.2rem,7vw,4rem)}.lede{max-width:600px;margin:0 auto 22px;font-size:1.05rem;line-height:1.55;color:#496774}.mode-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.mode-card{display:flex;align-items:center;gap:10px;min-height:112px;padding:16px;border:0;border-radius:20px;color:#fff;text-align:left;cursor:pointer;box-shadow:0 10px 20px #1234;transition:transform .17s}.mode-card:hover{transform:translateY(-4px)}.mode-card.gentle{background:linear-gradient(145deg,#15a985,#087d75)}.mode-card.arcade{background:linear-gradient(145deg,#ff8847,#e84b33)}.mode-card.survival{background:linear-gradient(145deg,#8b5cf6,#5b21b6)}.mode-icon{font-size:2rem}.mode-card b,.mode-card small{display:block}.mode-card b{font-size:1.35rem}.mode-card small{font-size:.75rem;line-height:1.35;margin-top:4px}.start-actions{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:20px}.keyboard-tip{margin:14px 0 0;font-size:.76rem;color:#58707c}.keyboard-tip kbd{padding:2px 5px;border:1px solid #b5c7cc;border-bottom-width:3px;border-radius:5px;background:#fff}
.panel-overlay{z-index:90}.panel-card{width:min(460px,100%)}.panel-icon{font-size:3rem;margin:0}.panel-card h2{font-size:2.5rem}.primary-btn,.secondary-btn,.text-btn{display:block;width:100%;min-height:50px;border-radius:14px;margin:10px 0 0;border:0;font-weight:900;cursor:pointer;text-decoration:none}.primary-btn{background:linear-gradient(135deg,#ff753d,#e84335);color:#fff;box-shadow:0 8px 18px #d9443344}.secondary-btn{background:#dff4f1;color:#075f5b}.text-btn{background:transparent;color:#155e75;text-decoration:underline;text-underline-offset:3px}.start-actions .text-btn,.start-actions #speakSlot{width:auto}.how-card{text-align:left}.how-card h2,.how-card .panel-icon{text-align:center}.how-card li{margin:.55rem 0;line-height:1.4}.result-score{margin:0;color:#123f57}.result-score span{display:block;font:900 clamp(3rem,12vw,5rem)/1 Poppins,sans-serif}.result-score small{text-transform:uppercase;letter-spacing:.15em}.rank-medal{font-size:4rem}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:22px 0}.stat-grid div{padding:12px 8px;border-radius:13px;background:#e7f5f3}.stat-grid strong,.stat-grid span{display:block}.stat-grid strong{font-size:1.45rem;color:#0d706d}.stat-grid span{font-size:.72rem}.reward-line{font-weight:800}.best-line{display:inline-block;padding:6px 12px;border-radius:999px;background:#fff0ad;color:#725100;font-weight:900}.back-link{line-height:50px}.countdown{position:fixed;inset:0;z-index:85;display:grid;place-items:center;color:#fff;font:1000 clamp(7rem,24vw,14rem)/1 Poppins,sans-serif;text-shadow:0 8px 0 #0a4d62,0 0 50px #55e7ff;pointer-events:none;animation:countPulse .7s ease}
@keyframes trailOut{to{opacity:0;transform:translate(-50%,-50%) scale(.15)}}@keyframes halfLeft{to{transform:translate(-55px,80px) rotate(-80deg);opacity:0}}@keyframes halfRight{to{transform:translate(55px,82px) rotate(85deg);opacity:0}}@keyframes juice{to{transform:translate(var(--dx),var(--dy)) scale(.15);opacity:0}}@keyframes popUp{to{transform:translateY(-55px) scale(1.16);opacity:0}}@keyframes spark{to{transform:scale(1.3) rotate(20deg)}}@keyframes screenHit{50%{box-shadow:inset 0 0 0 14px #ef4444aa}}@keyframes countPulse{from{transform:scale(.6);opacity:.2}to{transform:scale(1);opacity:1}}
@media(max-width:720px){.start-screen{padding:70px 14px 14px}.start-card{padding:20px 16px}.brand-mark{height:42px;font-size:2.3rem}.blade-mark{font-size:3.5rem}.start-card h1{font-size:2.5rem}.lede{font-size:.93rem;margin-bottom:14px}.mode-grid{grid-template-columns:1fr}.mode-card{min-height:68px;padding:10px 14px}.mode-icon{font-size:1.65rem}.mode-card b{font-size:1.1rem}.keyboard-tip{display:none}.hud{top:58px;padding:8px}.hud-chip{min-height:46px;padding:6px 9px}.hud-chip small{font-size:.52rem}.hud-chip strong{font-size:1rem}.combo-chip{position:fixed;top:118px;left:50%;transform:translateX(-50%)}.wave-meter{top:62px;width:56vw}.icon-btn{width:46px;min-height:46px}.target{width:72px;height:72px}.panel-overlay{padding:70px 12px 12px}.panel-card{padding:22px 18px}.start-actions{margin-top:12px}}@media(max-height:700px){.start-screen{align-items:start}.brand-mark{display:none}.start-card h1{font-size:2.25rem}.lede{margin-bottom:12px}.mode-card{min-height:68px}.keyboard-tip{display:none}}@media(prefers-reduced-motion:reduce){.mist,.bomb-art::after{animation:none}.mode-card{transition:none}.trail{display:none}}