:root{--ink: #090d13;--surface: #111826;--hair: #1f2b3b;--mint: #5cf2c7;--cyan: #4ad6e8;--gold: #ffc24b;--violet: #6e5ce0;--tx-hi: #e9f2ef;--tx-lo: #8593a3;--ff: "SF Pro Display", "Helvetica Neue", "Segoe UI", system-ui, -apple-system, Roboto, sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{font-family:var(--ff);color:var(--tx-hi);background:radial-gradient(900px 620px at 50% -12%,rgba(92,242,199,.12),transparent 60%),radial-gradient(700px 560px at 88% 8%,rgba(110,92,224,.12),transparent 55%),var(--ink);background-attachment:fixed;-webkit-font-smoothing:antialiased}.app{max-width:520px;margin:0 auto;padding:14px 16px 32px;min-height:100vh;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;gap:10px;margin-bottom:18px}.brand{font-weight:800;letter-spacing:.12em;font-size:1.15rem;background:linear-gradient(180deg,#fff,var(--mint));-webkit-background-clip:text;background-clip:text;color:transparent}.spacer{flex:1}.pill{display:inline-flex;align-items:center;gap:6px;font-size:.82rem;font-weight:600;padding:6px 11px;border-radius:999px;border:1px solid var(--hair);font-variant-numeric:tabular-nums}.pill.coin{color:var(--gold);border-color:#ffc24b59;background:#ffc24b0f}.pill.en{color:var(--mint);border-color:#5cf2c74d;background:#5cf2c70f}.card{background:linear-gradient(180deg,#18202eb8,#0e141eb8);border:1px solid var(--hair);border-radius:20px;padding:20px}.card.feature{background:linear-gradient(125deg,#5cf2c724,#6e5ce01f);border-color:#5cf2c74d}.h1{font-size:1.5rem;font-weight:800;margin:4px 0}.sub{color:var(--tx-lo);font-size:.95rem}.center{text-align:center}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;font-family:var(--ff);font-weight:700;font-size:1rem;color:var(--ink);background:linear-gradient(180deg,var(--mint),#34d9ab);border-radius:14px;padding:15px 22px;width:100%;transition:transform .12s,box-shadow .2s,opacity .2s;box-shadow:0 6px 22px #5cf2c740}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:default;box-shadow:none}.btn.ghost{background:transparent;color:var(--tx-hi);border:1px solid var(--hair);box-shadow:none}.optbtn{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;font-family:var(--ff);font-size:1.05rem;font-weight:600;color:var(--tx-hi);text-align:left;width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;background:#ffffff08;border:1.5px solid var(--hair);border-radius:14px;padding:16px 18px;transition:border-color .15s,background .15s,transform .1s,opacity .15s}.optbtn:active{transform:translateY(1px)}.optbtn.correct{border-color:var(--mint);background:#5cf2c729;color:var(--mint)}.optbtn.wrong{border-color:#ff6b6b;background:#ff6b6b24;color:#ff8f8f}.optbtn.dim{opacity:.45}.optbtn .mark{font-weight:800;font-size:1.1rem}.optbtn:disabled{cursor:default}.stack{display:flex;flex-direction:column;gap:12px}.grow{flex:1}.bignum{font-size:3rem;font-weight:800;line-height:1;background:linear-gradient(180deg,#fff,var(--mint));-webkit-background-clip:text;background-clip:text;color:transparent}.rewardrow{display:flex;gap:12px;justify-content:center}.chip{padding:10px 16px;border-radius:12px;border:1px solid var(--hair);font-weight:700;font-variant-numeric:tabular-nums}.chip.gold{color:var(--gold);border-color:#ffc24b59}.progress{height:6px;background:var(--hair);border-radius:999px;overflow:hidden}.progress>span{display:block;height:100%;background:linear-gradient(90deg,var(--mint),var(--cyan))}.langtoggle{cursor:pointer;font-size:.78rem;font-weight:700;color:var(--tx-lo);border:1px solid var(--hair);background:transparent;border-radius:999px;padding:6px 10px}.muted{color:var(--tx-lo)}.section-h{font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--tx-hi);margin-top:6px}.gamegrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.gcard{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;text-align:left;font-family:var(--ff);color:var(--tx-hi);background:linear-gradient(160deg,#5cf2c71a,#6e5ce014);border:1px solid var(--hair);border-radius:16px;padding:15px 14px;min-height:92px;display:flex;flex-direction:column;gap:5px;justify-content:center;transition:transform .1s,border-color .15s,box-shadow .2s}.gcard:active{transform:translateY(1px)}.gcard:hover{border-color:#5cf2c780;box-shadow:0 4px 18px #5cf2c724}.gtitle{font-size:1.02rem;font-weight:700}.gsub{font-size:.76rem;color:var(--tx-lo)}.bs-status{text-align:center;font-weight:700;font-size:1.05rem}.bs-prog{display:flex;justify-content:center;gap:18px;font-variant-numeric:tabular-nums}.bs-label{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tx-lo);margin-top:4px}.bsboard{display:grid;gap:3px;width:100%;max-width:360px;margin:0 auto}.bscell{aspect-ratio:1 / 1;border:1px solid var(--hair);border-radius:4px;background:#ffffff08;font-size:.72rem;display:flex;align-items:center;justify-content:center;padding:0;color:var(--tx-hi);cursor:default}.bscell.ship{background:#5cf2c740;border-color:#5cf2c780}.bscell.hit{background:#ff6b6b4d;border-color:#ff6b6b}.bscell.miss{background:#8593a326;color:var(--tx-lo)}.bscell.fireable{cursor:pointer}.bscell.fireable:hover{border-color:var(--mint);background:#5cf2c71f}