:root{
  --bg:#0b1020; --panel:#121a31; --panel2:#18213e; --text:#f6f8ff; --muted:#9aa7c7;
  --accent:#56e07a; --accent2:#4da3ff; --danger:#ff647c; --gold:#ffd166; --line:#273253;
}
*{box-sizing:border-box} body{margin:0;background:linear-gradient(180deg,#090e1b,#0d1327 40%,#0a1020);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh}
button,input,select{font:inherit}.app{max-width:430px;margin:0 auto;min-height:100vh;padding:20px 16px 100px}.brand{font-size:34px;font-weight:900;letter-spacing:.08em}.tag{color:var(--muted);margin-top:-4px}.card{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:22px;padding:18px;margin:14px 0;box-shadow:0 18px 40px rgba(0,0,0,.25)}.row{display:flex;align-items:center;justify-content:space-between;gap:12px}.muted{color:var(--muted)}.big{font-size:32px;font-weight:900}.score{font-size:38px;font-weight:900;letter-spacing:-.04em}.label{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-weight:800}.btn{border:0;border-radius:16px;padding:14px 16px;width:100%;font-weight:900;cursor:pointer;margin-top:10px}.btn.primary{background:var(--accent);color:#07110a}.btn.secondary{background:#243055;color:white}.btn.danger{background:var(--danger);color:#180408}.btn.ghost{background:transparent;border:1px solid var(--line);color:white}.pill{display:inline-flex;padding:6px 10px;border-radius:999px;background:#1d294b;color:#cfe0ff;font-size:12px;font-weight:800}.versus{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;text-align:center}.versus .team{padding:12px;border-radius:16px;background:#11192f}.versus .lead{outline:2px solid var(--accent)}.delta{color:var(--danger);font-weight:900}.delta.ahead{color:var(--accent)}.gamebox{height:360px;position:relative;background:radial-gradient(circle at 50% 45%,#26345f 0,#121a31 70%);border-radius:22px;overflow:hidden;border:1px solid var(--line);touch-action:manipulation}.track{position:absolute;left:26px;right:26px;top:50%;height:8px;background:#303d65;border-radius:999px;transform:translateY(-50%)}.centerline{position:absolute;left:50%;top:20%;bottom:20%;width:3px;background:var(--gold);box-shadow:0 0 14px rgba(255,209,102,.8)}.marker{position:absolute;top:calc(50% - 16px);width:32px;height:32px;border-radius:50%;background:var(--accent2);box-shadow:0 0 16px rgba(77,163,255,.75)}.tapzone{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding:24px;color:#dbe5ff;font-weight:900}.nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(430px,100%);background:rgba(9,14,27,.95);backdrop-filter:blur(10px);display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);padding:10px 8px calc(10px + env(safe-area-inset-bottom))}.nav button{background:none;border:0;color:var(--muted);font-size:12px}.nav button.active{color:var(--accent);font-weight:900}.mini{font-size:13px}.rank{display:grid;grid-template-columns:42px 1fr auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}.rank:last-child{border-bottom:0}.hero{padding-top:12px}.spacer{height:8px}.field{width:100%;padding:14px;border-radius:14px;border:1px solid var(--line);background:#0d1428;color:white;margin:8px 0}.center{text-align:center}.hidden{display:none}.notice{padding:10px 12px;background:#1a2648;border-radius:12px;color:#dce8ff;margin:10px 0;font-size:13px}.impact{color:var(--accent);font-size:30px;font-weight:900}.attemptdots{letter-spacing:.2em;color:var(--gold);font-size:20px}.logoMark{display:inline-block;border:2px solid var(--accent);border-radius:10px;padding:4px 8px;margin-right:7px;transform:skew(-8deg)}
.btn:disabled{opacity:.45;cursor:not-allowed}.gamebox{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.btn{-webkit-tap-highlight-color:transparent}
.gameTabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}.gameTab{border:1px solid var(--line);background:#0d1428;color:var(--text);border-radius:14px;padding:10px 6px;display:flex;flex-direction:column;gap:3px;align-items:center}.gameTab span{font-size:26px;color:var(--gold)}.gameTab b{font-size:11px}.gameTab small{font-size:9px;color:var(--muted)}.gameTab.selected{outline:2px solid var(--accent);background:#15233a}.gameIcon{font-size:44px;color:var(--gold);margin-bottom:4px}.featured{border-color:#31533c}.rivalry{overflow:hidden}.timerGame{height:360px;border-radius:22px;background:radial-gradient(circle at 50% 30%,#26345f,#10182d 70%);position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;touch-action:manipulation}.timerTarget{text-align:center;color:var(--muted);font-size:12px;letter-spacing:.12em}.timerTarget b{color:var(--gold);font-size:28px}.timerReadout{font-size:72px;font-weight:900;margin-top:22px}.timerTap{position:absolute}.memoryGame{min-height:300px;padding:24px 8px}.memoryGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:30px}.memoryGrid span,.memoryChoices button{height:76px;border-radius:18px;background:#0f1830;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:38px;color:white}.memoryChoices{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:28px}.memoryChoices button{cursor:pointer}.mega{font-size:64px}.success{background:#183d2a;color:#8dffad}.impactBlock{background:#0e1d19;border:1px solid #28583c;border-radius:18px;padding:16px;margin:14px 0}.statGrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0}.statGrid>div{background:#0d1428;border-radius:14px;padding:12px}.ahead{color:var(--accent);font-weight:900}@media(max-width:360px){.gameTabs{grid-template-columns:1fr}.gameTab{flex-direction:row;justify-content:flex-start;padding:8px 12px}.gameTab span{font-size:20px}.timerReadout{font-size:58px}}
#gameHost{scroll-margin-top:12px;outline:none}
.backendBadge{font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:6px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.16);display:inline-flex;gap:6px;align-items:center}
.backendBadge.live{color:#83f6a8;background:rgba(39,174,96,.12)}
.backendBadge.demo{color:#ffd37a;background:rgba(230,166,48,.12)}
.syncNote{margin-top:9px;font-size:11px;color:var(--muted)}

.backendBadge.connecting{color:#cfe0ff;background:rgba(77,163,255,.12)}
.backendBadge.error{color:#ff9aad;background:rgba(255,100,124,.12)}
.backendBadge.idle{color:#ffd37a;background:rgba(230,166,48,.12)}
.backendDetail{margin-top:7px;color:var(--muted);font-size:11px;line-height:1.4}
.backendDetail.error{color:#ff9aad}
.backendDetail button{background:none;border:0;color:#cfe0ff;text-decoration:underline;padding:0;cursor:pointer;font:inherit}
.heroRow{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.accountPill{border:1px solid var(--line);background:#10182d;color:#cfe0ff;border-radius:999px;padding:7px 10px;font-size:10px;font-weight:900;letter-spacing:.04em;max-width:48%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.accountPill.verified{color:#83f6a8;border-color:#28583c}.accountPill.pending,.accountPill.declared{color:#ffd37a}.accountPill.rejected{color:#ff9aad}.checkRow{display:flex;align-items:center;gap:10px;padding:12px 2px;color:#dce8ff;font-size:14px}.checkRow input{width:20px;height:20px;accent-color:var(--accent)}.formError{min-height:20px;color:#ff9aad;font-size:13px;margin:3px 0}.codeField{font-size:28px;letter-spacing:.22em;text-align:center;font-weight:900}.verifiedNotice{border:1px solid #28583c;background:#0e1d19;color:#83f6a8}.pendingNotice{border:1px solid #6b5529;background:#2b2415;color:#ffd37a}.refreshBtn{width:44px;height:44px;border:1px solid var(--line);border-radius:14px;background:#0d1428;color:#cfe0ff;font-size:24px;cursor:pointer;flex:none}.membershipCard{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:16px;padding:14px;margin-top:14px;background:#0d1428}.membershipCard span{font-size:26px}.membershipCard.verified{border-color:#28583c;color:#83f6a8}.membershipCard.pending,.membershipCard.declared{border-color:#6b5529;color:#ffd37a}.membershipCard.rejected{border-color:#773040;color:#ff9aad}.clanPreview{margin:16px 0 4px;background:#10182d;border-style:dashed}.syncNote button{background:none;border:0;color:#cfe0ff;text-decoration:underline;padding:0;cursor:pointer;font:inherit}
@media(max-width:380px){.app{padding-left:12px;padding-right:12px}.heroRow{align-items:center}.brand{font-size:29px}.accountPill{max-width:44%;padding:6px 8px}.versus{gap:6px}.versus .team{padding:9px 6px}.score{font-size:31px}.row .btn{padding-left:9px;padding-right:9px}.field{font-size:16px}.card{padding:16px;border-radius:19px}}
