body.sbs-top10-open #archive-view > :not(#sbs-top10){display:none!important}
#sbs-top10{color:var(--text);background:var(--page-bg);padding:clamp(20px,5vw,64px);min-height:75vh}
#sbs-top10[hidden],.top10-dialog [hidden]{display:none}
.top10-kicker{font-size:11px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}
.top10-heading{font-size:clamp(48px,9vw,126px);line-height:.95;font-weight:900;letter-spacing:-.065em;margin:20px 0}
.top10-intro{font-family:'Source Serif 4',serif;font-size:clamp(18px,2.8vw,28px);max-width:680px;margin-bottom:24px}
.top10-bar,.top10-actions,.top10-tabs{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.top10-bar{justify-content:space-between;border-bottom:1px solid var(--border);padding-bottom:20px}
.top10-tabs{margin:24px 0;border-bottom:1px solid var(--border);gap:0}
.top10-btn,.top10-tabs button{border:1px solid var(--border);background:var(--surface);color:var(--text);padding:12px 16px;font-size:11px;font-weight:800;letter-spacing:.04em;min-height:44px;cursor:pointer}
.top10-btn.primary,.top10-tabs button[aria-selected=true]{background:var(--text);color:var(--page-bg);border-color:var(--text)}
.top10-btn:disabled{opacity:.55;cursor:default}.top10-btn:focus-visible,.top10-tabs button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.top10-muted{color:var(--text-muted);font-size:13px;line-height:1.6}.top10-message{min-height:24px;margin:14px 0;font-size:14px}
.top10-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 24px;margin:24px 0}
.top10-entry{min-width:0;border-bottom:1px solid var(--border);padding-bottom:20px;scroll-margin-top:100px}
.top10-image{width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--surface-muted)}
.top10-entry h3{font-size:clamp(22px,3vw,38px);line-height:1.15;font-weight:800;letter-spacing:-.03em;margin:8px 0}
.top10-rank{font-size:clamp(40px,6vw,70px);font-weight:900;letter-spacing:-.06em}
.top10-entry.winner{grid-column:1/-1}.top10-entry.winner .top10-image{max-height:65vh}.top10-entry.winner h3{font-size:clamp(32px,6vw,72px)}
.top10-empty{border:1px solid var(--border);padding:32px;max-width:720px;background:var(--surface);margin:24px 0}
.top10-dialog{max-width:650px;width:calc(100% - 32px);max-height:90dvh;overflow:auto;background:var(--surface);color:var(--text);border:1px solid var(--border);padding:24px}
.top10-dialog::backdrop{background:#0009}.top10-dialog h2{font-size:28px;font-weight:800;margin:16px 0}.top10-dialog label{display:block;margin:14px 0;font-size:12px;font-weight:700}
.top10-dialog input,.top10-dialog textarea{display:block;width:100%;padding:12px;border:1px solid var(--border);background:var(--page-bg);color:var(--text);font:inherit;margin-top:6px}
.top10-dialog input:focus,.top10-dialog textarea:focus{outline:2px solid var(--accent);outline-offset:2px}
#top10-player{position:sticky;top:78px;background:var(--surface);border:1px solid var(--border);z-index:21;max-width:720px;padding:10px;margin:20px 0}
#top10-player iframe{display:block;aspect-ratio:16/9;width:100%;border:0;margin-top:10px}
.top10-reveal{animation:top10-in .7s ease-out}.top10-archive-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.top10-achievements{margin:20px 0;padding:16px;border:1px solid var(--border)}
@keyframes top10-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.top10-reveal{animation:none}}
@media(max-width:640px){.top10-grid{grid-template-columns:1fr;gap:24px}.top10-tabs button{flex:1;padding:12px 8px}.top10-bar{align-items:flex-start}#top10-player{top:64px}.top10-dialog{padding:18px}}
