/* Top10 — one deliberate look, dark ground, works on any host theme. */
:root{
  --bg:#101014; --panel:#17171d; --line:#26262e;
  --text:#e8e8ec; --muted:#8b8b96; --gold:#e7b84c; --star:#e7b84c;
}
*{box-sizing:border-box} html,body{margin:0}
body{background:var(--bg);color:var(--text);
  font:16px/1.55 -apple-system,"Inter",system-ui,sans-serif;
  min-height:100vh;display:flex;flex-direction:column}
a{color:inherit}
header.site{display:flex;align-items:baseline;gap:.75rem;
  padding:1.1rem 1.25rem;border-bottom:1px solid var(--line)}
.brand{font-weight:800;font-size:1.35rem;letter-spacing:-.02em;text-decoration:none}
.brand span{color:var(--gold)}
.by{color:var(--muted);font-size:.8rem}
main{flex:1;width:100%;max-width:680px;margin:0 auto;padding:1.5rem 1.25rem 3rem}
footer.site{padding:1rem 1.25rem;border-top:1px solid var(--line);
  color:var(--muted);font-size:.78rem}
.muted{color:var(--muted)}
h1{font-size:1.6rem;letter-spacing:-.02em;margin:.2rem 0 .3rem;text-wrap:balance}
.basis{font-size:.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.basis.unranked{color:var(--gold)}
ol.rank{list-style:none;margin:1.2rem 0 0;padding:0}
ol.rank li{display:flex;align-items:baseline;gap:.9rem;
  padding:.7rem .35rem;border-bottom:1px solid var(--line)}
.n{font-variant-numeric:tabular-nums;color:var(--muted);min-width:1.6rem;text-align:right}
li.topten .n{color:var(--gold);font-weight:700}
.name{flex:1;font-weight:600}
.score{font-variant-numeric:tabular-nums;color:var(--muted);font-size:.85rem;white-space:nowrap}
.score b{color:var(--star);font-weight:700}
.cut{margin:1rem 0 .4rem;color:var(--muted);font-size:.72rem;
  text-transform:uppercase;letter-spacing:.12em;text-align:center}
ul.lists{list-style:none;margin:1rem 0 0;padding:0}
ul.lists li{border-bottom:1px solid var(--line)}
ul.lists a{display:block;padding: .85rem .35rem;text-decoration:none;font-weight:600}
ul.lists a:hover{color:var(--gold)}
ul.lists .muted{font-weight:400;font-size:.82rem}