/* SIMUL8OR LEADERBOARD v0.1 — requires s8-tokens.css + s8-ui.css.
   Depth from value steps + hairlines. Gold is scoped to rank 1 only;
   silver/bronze are ink steps, not new hues. Green stays semantic (return). */

/* ── page chrome (context only) ─────────────────────── */
.lb-chrome{display:flex;align-items:center;gap:var(--s8-4);height:var(--s8-toolbar);padding:0 var(--s8-4);background:var(--s8-panel);border-bottom:1px solid var(--s8-line)}
.lb-chrome__logo{display:flex;align-items:center;gap:7px;font-size:var(--s8-fs-lg);font-weight:600;color:#fff;letter-spacing:-.02em}
.lb-chrome__mark{display:flex;align-items:flex-end;gap:2px;height:17px}
.lb-chrome__mark i{width:3px;border-radius:1px;background:var(--s8-up)}
.lb-chrome__search{flex:1;max-width:420px}
.lb-chrome__right{margin-left:auto;display:flex;align-items:center;gap:var(--s8-3)}
.lb-chrome__who{text-align:right;line-height:1.25}
.lb-chrome__who b{display:block;font-size:var(--s8-fs-sm);color:var(--s8-fg)}
.lb-av{flex:none;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--s8-panel-2);border:1px solid var(--s8-line-2);color:var(--s8-fg-2);font-weight:600;letter-spacing:.02em}
.lb-av--sm{width:28px;height:28px;font-size:var(--s8-fs-xs)}
.lb-av--md{width:34px;height:34px;font-size:var(--s8-fs-sm)}
.lb-av--lg{width:56px;height:56px;font-size:var(--s8-fs-lg)}
.lb-av--gold{border-color:var(--s8-gold-line);background:var(--s8-gold-tint);color:var(--s8-gold-fg)}
.lb-av--you{border-color:var(--s8-accent-line);background:var(--s8-accent-tint);color:var(--s8-accent-fg)}
.lb-ticker{display:flex;align-items:center;gap:var(--s8-6);height:30px;padding:0 var(--s8-4);overflow:hidden;background:var(--s8-inset);border-bottom:1px solid var(--s8-line);font-size:var(--s8-fs-xs);white-space:nowrap}
.lb-ticker span{color:var(--s8-fg-3)}
.lb-ticker b{color:var(--s8-fg-2);font-weight:600;letter-spacing:.06em;margin-right:6px}
.lb-ticker em{font-style:normal;color:var(--s8-fg)}

/* ── shell ──────────────────────────────────────────── */
.lb{background:var(--s8-bg);min-height:100%}
.lb-wrap{max-width:1080px;margin:0 auto;padding:0 var(--s8-6)}
.lb-wrap--wide{max-width:1240px}

/* ── masthead ───────────────────────────────────────── */
.lb-mast{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s8-6);padding:var(--s8-8) 0 var(--s8-5);border-bottom:1px solid var(--s8-line)}
.lb-mast__title{display:grid;gap:6px}
.lb-eyebrow{display:flex;align-items:center;gap:8px;font-family:var(--s8-mono);font-size:var(--s8-fs-micro);font-weight:600;letter-spacing:var(--s8-ls-caps);text-transform:uppercase;color:var(--s8-up)}
.lb-eyebrow i{width:5px;height:5px;border-radius:50%;background:currentColor}
.lb-mast h1{margin:0;font-size:var(--s8-fs-3xl);font-weight:600;letter-spacing:-.02em;line-height:1.1;color:#fff}
.lb-mast__meta{display:flex;align-items:center;gap:var(--s8-3);font-size:var(--s8-fs-sm);color:var(--s8-fg-3)}
.lb-mast__meta b{color:var(--s8-fg);font-weight:600}
.lb-sep{width:1px;height:12px;background:var(--s8-line-2)}

/* challenge stepper */
.lb-step{display:inline-flex;align-items:center;height:var(--s8-h-lg);border:1px solid var(--s8-line-2);border-radius:var(--s8-r);background:var(--s8-panel);overflow:hidden}
.lb-step button{width:34px;height:100%;border:0;background:transparent;color:var(--s8-fg-3);font:inherit;font-size:15px;cursor:pointer;transition:background var(--s8-t-fast) var(--s8-ease),color var(--s8-t-fast) var(--s8-ease)}
.lb-step button:hover{background:var(--s8-hover);color:var(--s8-fg)}
.lb-step__val{display:flex;align-items:baseline;gap:6px;padding:0 var(--s8-4);height:100%;align-items:center;border-left:1px solid var(--s8-line);border-right:1px solid var(--s8-line);font-size:var(--s8-fs-sm);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--s8-fg-2);white-space:nowrap}
.lb-step__val b{color:#fff;font-weight:600;letter-spacing:0}

/* ── list ───────────────────────────────────────────── */
.lb-list{border:1px solid var(--s8-line);border-radius:var(--s8-r-lg);background:var(--s8-panel);overflow:hidden}
.lb-head{display:grid;grid-template-columns:56px minmax(0,1fr) 132px 116px 108px;align-items:center;gap:var(--s8-3);height:32px;padding:0 var(--s8-4);background:var(--s8-panel-2);border-bottom:1px solid var(--s8-line);font-family:var(--s8-mono);font-size:var(--s8-fs-micro);font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--s8-fg-3)}
.lb-head span:nth-child(n+3){text-align:right}
.lb-row{display:grid;grid-template-columns:56px minmax(0,1fr) 132px 116px 108px;align-items:center;gap:var(--s8-3);height:60px;padding:0 var(--s8-4);border-bottom:1px solid var(--s8-line);transition:background var(--s8-t-fast) var(--s8-ease)}
.lb-row:last-child{border-bottom:0}
.lb-row:hover{background:var(--s8-hover)}
.lb-rank{display:flex;align-items:center;gap:var(--s8-2);font-variant-numeric:tabular-nums;font-size:var(--s8-fs-base);font-weight:600;color:var(--s8-fg-4)}
.lb-medal{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:var(--s8-r-sm);border:1px solid var(--s8-line-2);background:var(--s8-panel-2);font-size:var(--s8-fs-sm);font-weight:700;color:var(--s8-fg-2)}
.lb-medal--1{border-color:var(--s8-gold-line);background:var(--s8-gold-tint);color:var(--s8-gold-fg)}
.lb-medal--2{border-color:var(--s8-line-3);background:var(--s8-active);color:var(--s8-fg)}
.lb-medal--3{border-color:var(--s8-line-2);background:var(--s8-panel-2);color:var(--s8-fg-2)}
.lb-who{display:flex;align-items:center;gap:var(--s8-3);min-width:0}
.lb-who__name{font-size:var(--s8-fs-base);font-weight:500;color:var(--s8-fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb-who__sub{font-size:var(--s8-fs-xs);color:var(--s8-fg-4)}
.lb-cell{text-align:right;font-variant-numeric:tabular-nums;font-size:var(--s8-fs-sm);color:var(--s8-fg-2)}
.lb-ret{text-align:right;font-variant-numeric:tabular-nums;font-size:var(--s8-fs-xl);font-weight:600;letter-spacing:-.02em;color:var(--s8-up)}
.lb-ret--down{color:var(--s8-down)}
.lb-row--1{background:linear-gradient(90deg,var(--s8-gold-tint),transparent 42%);box-shadow:inset 2px 0 0 var(--s8-gold)}
.lb-row--you{background:var(--s8-accent-tint);box-shadow:inset 2px 0 0 var(--s8-accent)}
.lb-row--you:hover{background:var(--s8-accent-tint)}
.lb-tag{display:inline-flex;align-items:center;height:18px;padding:0 6px;border-radius:var(--s8-r-xs);background:var(--s8-accent);color:#fff;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.lb-bar{height:3px;border-radius:var(--s8-r-pill);background:var(--s8-active);overflow:hidden}
.lb-bar i{display:block;height:100%;background:var(--s8-up);opacity:.7}
.lb-row--1 .lb-bar i{background:var(--s8-gold);opacity:1}

/* ── pagination ─────────────────────────────────────── */
.lb-pager{display:flex;align-items:center;justify-content:space-between;gap:var(--s8-3);padding:var(--s8-3) var(--s8-4);border-top:1px solid var(--s8-line);background:var(--s8-panel-2)}
.lb-pager__info{font-size:var(--s8-fs-xs);color:var(--s8-fg-4);font-variant-numeric:tabular-nums}
.lb-pager__nums{display:flex;align-items:center;gap:2px}
.lb-pager__nums button{min-width:28px;height:28px;padding:0 8px;border:1px solid transparent;border-radius:var(--s8-r-sm);background:transparent;color:var(--s8-fg-3);font:inherit;font-size:var(--s8-fs-sm);font-variant-numeric:tabular-nums;cursor:pointer;transition:background var(--s8-t-fast) var(--s8-ease),color var(--s8-t-fast) var(--s8-ease)}
.lb-pager__nums button:hover{background:var(--s8-hover);color:var(--s8-fg)}
.lb-pager__nums button[aria-current="page"]{background:var(--s8-panel);border-color:var(--s8-line-2);color:#fff;font-weight:600}
.lb-pager__nums span{padding:0 4px;color:var(--s8-fg-4)}

/* ── your score / gate ──────────────────────────────── */
.lb-you{border:1px solid var(--s8-line-2);border-radius:var(--s8-r-lg);background:var(--s8-panel);overflow:hidden}
.lb-you__top{display:flex;align-items:center;gap:var(--s8-4);padding:var(--s8-4);border-bottom:1px solid var(--s8-line);background:var(--s8-panel-2)}
.lb-you__fig{font-size:var(--s8-fs-2xl);font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:#fff}
.lb-you__body{display:grid;gap:var(--s8-2);padding:var(--s8-4)}
.lb-lock{display:flex;align-items:center;gap:7px;font-size:var(--s8-fs-sm);color:var(--s8-fg-3)}
.lb-lock svg{width:13px;height:13px;flex:none;stroke:var(--s8-fg-4);stroke-width:1.7;fill:none}

/* ── podium (direction B) ───────────────────────────── */
.lb-podium{display:grid;grid-template-columns:1fr 1.16fr 1fr;align-items:end;gap:var(--s8-4);padding:var(--s8-7) 0 var(--s8-6)}
.lb-plinth{display:grid;justify-items:center;gap:var(--s8-2);padding:var(--s8-5) var(--s8-4);border:1px solid var(--s8-line);border-top:2px solid var(--s8-line-3);border-radius:var(--s8-r-lg);background:var(--s8-panel);text-align:center}
.lb-plinth--1{border-color:var(--s8-gold-line);border-top:2px solid var(--s8-gold);background:linear-gradient(180deg,var(--s8-gold-tint),transparent 55%),var(--s8-panel);padding:var(--s8-6) var(--s8-4)}
.lb-plinth__rank{font-family:var(--s8-mono);font-size:var(--s8-fs-micro);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--s8-fg-4)}
.lb-plinth--1 .lb-plinth__rank{color:var(--s8-gold-fg)}
.lb-plinth__ret{font-size:var(--s8-fs-2xl);font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--s8-up)}
.lb-plinth--1 .lb-plinth__ret{font-size:var(--s8-fs-display)}
.lb-plinth__name{font-size:var(--s8-fs-base);font-weight:500;color:var(--s8-fg)}
.lb-plinth__sub{font-size:var(--s8-fs-xs);color:var(--s8-fg-4)}

/* ── split layout (direction C) ─────────────────────── */
.lb-split{display:grid;grid-template-columns:340px minmax(0,1fr);gap:var(--s8-7);padding:var(--s8-7) 0 var(--s8-9);align-items:start}
.lb-aside{display:grid;gap:var(--s8-4)}
.lb-aside__head{display:grid;gap:var(--s8-3)}
.lb-facts{display:grid;border:1px solid var(--s8-line);border-radius:var(--s8-r-lg);background:var(--s8-panel);overflow:hidden}
.lb-facts div{display:flex;align-items:center;justify-content:space-between;gap:var(--s8-3);height:var(--s8-row);padding:0 var(--s8-3);border-bottom:1px solid var(--s8-line);font-size:var(--s8-fs-sm);color:var(--s8-fg-3)}
.lb-facts div:last-child{border-bottom:0}
.lb-facts b{font-weight:600;color:var(--s8-fg);font-variant-numeric:tabular-nums}

/* ── compact variants ───────────────────────────────── */
.lb-list--compact .lb-row,.lb-list--compact .lb-head{grid-template-columns:48px minmax(0,1fr) 96px}
.lb-list--compact .lb-head span:nth-child(n+3){text-align:right}
.lb-list--compact .lb-row{height:54px}
.lb-list--compact .lb-ret{font-size:var(--s8-fs-lg)}

/* Production Stats.aspx composition. Shared terminal chrome comes from
   Terminal.Master; this file owns only the leaderboard surface. */
.lb-page{min-height:0}
.lb-mast.s8c-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:var(--s8-8);padding-top:clamp(40px,6vw,80px);padding-bottom:var(--s8-5)}
.lb-mast__title{display:block}
.lb-mast.s8c-hero h1{margin:var(--s8-4) 0 0;font-size:var(--s8c-fs-hero);line-height:1.02;letter-spacing:-.028em}
.lb-mast__meta{margin-top:var(--s8-3)}
.lb-mast__actions{display:flex;align-items:center;gap:var(--s8-3);flex-wrap:wrap;justify-content:flex-end}
.lb-play:empty{display:none}
.lb-play .s8-btn{white-space:nowrap}
.lb-your-slot:empty{display:none}
.lb-your-slot{margin:var(--s8-5) 0 var(--s8-4)}
.lb-your-slot[hidden],.lb-head[hidden]{display:none}
.lb-list-wrap{padding-top:var(--s8-5)}
.lb-list__head[hidden],.lb-list[hidden]{display:none}
.lb-empty{padding:var(--s8-8) var(--s8-4);text-align:center;color:var(--s8-fg-3);font-size:var(--s8-fs-sm)}
.lb-empty:empty{display:none!important}
.lb-rank__plain{width:26px;text-align:center}
.lb-who__copy{min-width:0}
.lb-who__name a{color:inherit;text-decoration:none}
.lb-who__name a:hover{color:#fff}
.lb-avatar-img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
.lb-avatar-fallback{font-family:var(--s8-mono);font-size:var(--s8-fs-xs);font-weight:600;letter-spacing:.02em}
.lb-row--you .lb-tag{margin-left:var(--s8-2);vertical-align:1px}
.lb-score-card{display:flex;align-items:center;gap:var(--s8-4);min-height:72px;padding:var(--s8-4);border:1px solid var(--s8-line-2);border-radius:var(--s8-r-lg);background:var(--s8-panel-2);box-shadow:inset 2px 0 0 var(--s8-accent)}
.lb-score-card__copy{display:grid;gap:2px}
.lb-score-card__meta{font-size:var(--s8-fs-xs);color:var(--s8-fg-3)}
.lb-score-card__actions{margin-left:auto;display:flex;align-items:center;gap:var(--s8-2)}
.lb-score-card .lb-ret{font-size:var(--s8-fs-2xl)}
.lb-ret.s8-down{color:var(--s8-down)}
.lb-signin{display:flex;align-items:center;gap:var(--s8-4);min-height:76px;padding:var(--s8-4);border:1px solid var(--s8-line-2);border-radius:var(--s8-r-lg);background:var(--s8-panel-2)}
.lb-signin__copy{display:grid;gap:3px;min-width:0}
.lb-signin__title{font-size:var(--s8-fs-lg);font-weight:600;color:#fff}
.lb-signin__sub{font-size:var(--s8-fs-sm);color:var(--s8-fg-3)}
.lb-signin__actions{margin-left:auto;display:flex;align-items:center;gap:var(--s8-2);flex-wrap:wrap;justify-content:flex-end}
.lb-share.copied{border-color:var(--s8-up-line);color:var(--s8-up)}
.lb-meta-positive{color:var(--s8-up);font-weight:600}
.lb-meta-negative{color:var(--s8-down);font-weight:600}

@media (max-width:860px){
  .lb-mast.s8c-hero{grid-template-columns:1fr;align-items:start}
  .lb-mast__actions{width:100%;justify-content:space-between}
  .lb-score-card,.lb-signin{align-items:flex-start;flex-wrap:wrap}
  .lb-score-card__actions,.lb-signin__actions{width:100%;margin-left:0;justify-content:flex-start}
  .lb-head,.lb-row{grid-template-columns:44px minmax(0,1fr) 92px 92px}
  .lb-head span:nth-child(3),.lb-row>.lb-cell:nth-child(3){display:none}
}

@media (max-width:560px){
  .lb-mast__meta{align-items:flex-start;flex-direction:column;gap:4px}
  .lb-sep{display:none}
  .lb-mast__actions{align-items:stretch;flex-direction:column}
  .lb-step{width:100%;justify-content:space-between}
  .lb-step__val{flex:1;justify-content:center}
  .lb-play .s8-btn{width:100%;justify-content:center}
  .lb-head,.lb-row{grid-template-columns:36px minmax(0,1fr) 78px;gap:var(--s8-2);padding-left:var(--s8-3);padding-right:var(--s8-3)}
  .lb-head span:nth-child(4),.lb-row>.lb-cell:nth-child(4){display:none}
  .lb-row{height:58px}
  .lb-av--md{width:30px;height:30px}
  .lb-who{gap:var(--s8-2)}
  .lb-ret{font-size:var(--s8-fs-base)}
  .lb-signin__actions .s8-btn{flex:1;min-width:130px}
}
