#accountStatus { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.account-dialog { width:min(620px, calc(100vw - 24px)); max-height:calc(100dvh - 32px); overflow:auto; padding:24px; color:var(--ink); background:var(--blue-950); border:1px solid var(--muted); border-radius:12px; }
.account-dialog::backdrop { background:rgba(2,7,13,.8); }
.account-dialog header { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.account-dialog h2 { font-family:'Barlow Condensed',sans-serif; font-size:max(var(--desktop-text-min, 0px), calc(32px * var(--desktop-text-scale, 1))); margin:0; }
.account-dialog h3 { margin:24px 0 8px; font-size:max(var(--desktop-text-min, 0px), calc(21px * var(--desktop-text-scale, 1))); }
.account-dialog h4 { margin:0 0 8px; font-size:max(var(--desktop-text-min, 0px), calc(17px * var(--desktop-text-scale, 1))); }
.account-dialog p { line-height:1.55; color:var(--muted); margin:8px 0 16px; overflow-wrap:anywhere; }
.account-dialog section, .account-dialog details { margin-top:24px; padding-top:20px; border-top:1px solid var(--iron-700); }
.account-dialog summary { min-height:44px; cursor:pointer; font-weight:700; }
.account-dialog form { display:grid; gap:10px; margin:20px 0; }
.account-dialog label { display:block; margin-top:12px; font-weight:600; }
.account-dialog input:not([type=checkbox]) { width:100%; min-height:44px; padding:10px 12px; border:1px solid var(--muted); border-radius:4px; background:var(--blue-900); color:var(--ink); font:inherit; }
.account-dialog input:focus-visible, .account-dialog summary:focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
.account-dialog button { min-height:44px; padding:10px 14px; border:1px solid var(--muted); border-radius:5px; color:var(--ink); background:var(--blue-800); cursor:pointer; font-weight:600; }
.account-dialog button:hover { background:var(--blue-700); }
.account-dialog button[type=submit], .account-dialog #accountSync { background:var(--gold-300); color:var(--blue-950); border-color:var(--gold-300); }
.account-dialog .account-danger[type=submit] { color:var(--ink); background:var(--red-700); border-color:var(--red-400); }
.account-dialog .account-check { display:flex; gap:10px; align-items:center; line-height:1.4; min-height:44px; }
.account-check input { width:20px; height:20px; flex-shrink:0; }
.account-choices { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.account-actions { display:flex; gap:12px; flex-wrap:wrap; }
#accountMessage:not(:empty), #accountPendingWarning { color:var(--gold-300); }
#accountHistory > div { padding:16px 0; border-bottom:1px solid var(--iron-700); }
.account-dialog [hidden] { display:none !important; }
@media(max-width:640px) { .account-button { padding:5px 8px; } .account-button span { display:none; } .account-dialog { padding:18px; } .account-dialog header { align-items:flex-start; } .account-dialog header button { max-width:110px; } .account-choices { grid-template-columns:1fr; gap:20px; } }

.leaderboard-table { width:100%; border-collapse:collapse; margin-top:20px; font-variant-numeric:tabular-nums; }
.leaderboard-table caption { text-align:left; margin-bottom:8px; color:var(--muted); }
.leaderboard-table th,.leaderboard-table td { padding:12px 6px; border-bottom:1px solid var(--iron-700); text-align:left; overflow-wrap:anywhere; }
.leaderboard-table th:first-child { width:52px; }
.leaderboard-table th:last-child,.leaderboard-table td:last-child { text-align:right; width:52px; }
.leaderboard-table small { display:block; margin-top:4px; color:var(--muted); }
.leaderboard-self { color:var(--gold-300); }
#leaderboard button:disabled { opacity:.55; cursor:wait; }
#leaderboardNameHelp { line-height:1.5; color:var(--muted); }
#leaderboardStatus:empty { display:none; }