/* ==========================================================================
   Tyrone v10 — scoreboard pages
   ========================================================================== */
.sb-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:16px 0 0;padding:clamp(24px,4vw,44px);border-radius:var(--r-lg);
  position:relative;overflow:hidden;isolation:isolate;background:var(--panel)}
.sb-head::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,var(--cobalt) 0 6px,transparent 6px) 0 0/34px 100%,linear-gradient(120deg,var(--a2),var(--panel) 70%);opacity:.9}
.sb-head::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,var(--panel) 0%,transparent 70%)}
.sb-kicker{margin:0 0 8px;font:800 13px var(--display);color:var(--token)}
.sb-head h1{font-size:clamp(34px,5vw,64px);color:#fff;max-width:15ch}
.sb-lead{margin:14px 0 0;max-width:60ch;color:#DADDFF;font-size:16px}
.sb-lead a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.sb-tabs{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end;max-width:420px}
.sb-tabs a{height:38px;display:inline-flex;align-items:center;padding:0 15px;border-radius:999px;background:#ffffff14;color:#fff;font:750 13px var(--display)}
.sb-tabs a:hover{background:#ffffff2b}
.sb-tabs a[aria-current="page"]{background:var(--token);color:var(--night)}
.sb-badge{flex:none;padding:6px 12px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font:750 12px var(--display);color:var(--token)}

/* ---- Champions ---- */
.sb-champs{margin:12px 0 0}
.sb-champ-grid{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:14px;height:min(52vw,460px)}
.sb-champ{position:relative;display:block;border-radius:var(--r-lg);overflow:hidden;isolation:isolate;background:var(--surface)}
.sb-champ.is-first{grid-row:1/3}
.sb-champ img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .4s}
.sb-champ:hover img{transform:scale(1.04)}
.sb-champ::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 35%,color-mix(in srgb,var(--night) 95%,transparent) 100%)}
.sb-champ-rank{position:absolute;left:16px;top:6px;font:900 72px/1 var(--display);letter-spacing:-.06em;color:#fff;-webkit-text-stroke:3px var(--night);paint-order:stroke}
.is-first .sb-champ-rank{font-size:120px;color:var(--token)}
.sb-champ-cap{position:absolute;inset:auto 0 0 0;padding:18px 20px;display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.sb-champ-cap small{font:800 12px var(--display);color:var(--token)}
.sb-champ-cap h3{font-size:22px;letter-spacing:-.03em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.is-first .sb-champ-cap{padding:28px}
.is-first .sb-champ-cap h3{font-size:clamp(28px,3.2vw,44px);letter-spacing:-.05em}
.sb-champ-meta{font-size:13px;color:var(--text-2)}
.sb-champ-cap .t-coin{margin-top:12px}

/* ---- Board ---- */
.sb-body{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start;margin-top:40px}
.sb-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px}
.sb-search{display:flex;align-items:center;gap:8px;height:44px;padding:0 16px;border-radius:999px;background:var(--surface);border:1px solid var(--line);color:var(--text-3);flex:1;max-width:360px}
.sb-search:focus-within{border-color:var(--cobalt)}
.sb-search input{flex:1;min-width:0;border:0;outline:0;background:none;color:var(--text)}
.sb-sort{display:inline-flex;padding:4px;border-radius:999px;background:var(--surface);border:1px solid var(--line)}
.sb-sort button{height:36px;padding:0 14px;border-radius:999px;font:750 13px var(--display);color:var(--text-2)}
.sb-sort button[aria-pressed="true"]{background:var(--text);color:var(--night)}
.sb-count{margin-left:auto;font-size:13px;color:var(--text-3)}
.sb-rows{list-style:none;display:grid;gap:6px}
.sb-rows:not(.is-open) .is-more{display:none}
.sb-row a{display:grid;grid-template-columns:44px 64px minmax(0,1fr) minmax(80px,180px) 100px auto 40px;align-items:center;gap:14px;padding:8px 10px 8px 6px;border-radius:var(--r);
  background:var(--surface);border:1px solid transparent;transition:border-color .15s,background .15s}
.sb-row a:hover{border-color:var(--cobalt);background:var(--raised)}
.sb-rank{font:900 24px var(--display);letter-spacing:-.05em;color:var(--text-3);text-align:center}
.sb-row:nth-child(-n+3) .sb-rank{color:var(--token)}
.sb-row img{width:64px;height:64px;border-radius:14px;object-fit:cover}
.sb-name{min-width:0}
.sb-name h3{font:800 16px/1.2 var(--display);letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-name small{font-size:12.5px;color:var(--text-3)}
.sb-bar{height:8px;border-radius:999px;background:var(--night);overflow:hidden}
.sb-bar i{display:block;height:100%;width:var(--w);border-radius:999px;background:linear-gradient(90deg,var(--cobalt),var(--a-alt))}
.sb-stat{text-align:right;font:850 16px var(--display);white-space:nowrap}
.sb-stat small{display:block;font:500 11px var(--text-font);color:var(--text-3)}
.sb-go{width:40px;height:40px;border-radius:50%;background:var(--token);display:grid;place-items:center;opacity:0;transform:scale(.7);transition:opacity .15s,transform .15s}
.sb-go::after{content:"";border-left:11px solid var(--night);border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:3px}
.sb-row a:hover .sb-go,.sb-row a:focus-visible .sb-go{opacity:1;transform:scale(1)}
.sb-chip{font:800 11px var(--display);padding:4px 9px;border-radius:999px;background:var(--raised);color:var(--text-2);white-space:nowrap}
.sb-chip.up{color:var(--fresh)}.sb-chip.down{color:var(--hot)}.sb-chip.new{color:var(--token)}
.sb-empty{padding:28px;text-align:center;color:var(--text-2)}
.sb-more{display:flex;margin:18px auto 0}
.sb-foot{margin:14px 0 0;font-size:13px;color:var(--text-3);text-align:center}

.sb-side{position:sticky;top:calc(var(--top) + 16px);display:grid;grid-template-columns:minmax(0,1fr);gap:16px;min-width:0}
.sb-side .t-ad{margin:0}
.sb-list{padding:16px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line)}
.sb-list h2{font-size:17px;margin-bottom:8px}
.sb-list a{display:flex;align-items:center;gap:10px;padding:6px;border-radius:12px}
.sb-list a:hover{background:var(--raised)}
.sb-list img{width:48px;height:48px;border-radius:11px;object-fit:cover;flex:none}
.sb-list span{min-width:0;display:flex;flex-direction:column}
.sb-list b{font:750 14px var(--display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-list small{font-size:12px;color:var(--text-3)}

.sb-pager{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin:28px 0 0}
.sb-pager a,.sb-pager span{min-width:44px;height:44px;display:grid;place-items:center;padding:0 14px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font:800 14px var(--display)}
.sb-pager a:hover{background:var(--raised)}
.sb-pager [aria-current]{background:var(--text);color:var(--night);border-color:var(--text)}
.sb-pager .gap{background:none;border:0;color:var(--text-3)}

.sb-note{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:40px 0 0;padding:clamp(20px,3vw,32px);border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line)}
.sb-note h2{font-size:24px}
.sb-note p{margin:6px 0 0;color:var(--text-2)}
.sb-note .t-coin{flex:none}

/* monthly page extras */
.sb-stats{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0 0}
.sb-stats li{padding:18px 20px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);font-size:13px;color:var(--text-3)}
.sb-stats b{display:block;font:900 30px/1.1 var(--display);letter-spacing:-.04em;color:var(--text)}
.sb-rising{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.sb-rising a{display:flex;align-items:center;gap:12px;padding:10px;border-radius:var(--r);background:var(--surface)}
.sb-rising a:hover{background:var(--raised)}
.sb-rising img{width:60px;height:60px;border-radius:14px;object-fit:cover;flex:none}
.sb-rising span{min-width:0;display:flex;flex-direction:column;font-size:13px;color:var(--text-3)}
.sb-rising b{font:800 15px var(--display);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.sb-cat{padding:18px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line)}
.sb-cat-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:10px}
.sb-cat-head h3{font-size:18px}
.sb-cat-head a{font:750 13px var(--display);color:var(--token)}
.sb-cat ol{list-style:none;display:grid;gap:4px}
.sb-cat li a{display:flex;align-items:center;gap:10px;padding:5px;border-radius:12px;font:700 14px var(--display)}
.sb-cat li a:hover{background:var(--raised)}
.sb-cat img{width:40px;height:40px;border-radius:10px;object-fit:cover}
.sb-cat .num{margin-left:auto;font-size:12px;color:var(--text-3)}

@media (max-width:1200px){
  .sb-body{grid-template-columns:1fr}
  .sb-side{position:static;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));justify-items:stretch}
  .sb-side .t-ad{justify-self:center}
}
@media (max-width:900px){
  .sb-head{display:block}
  .sb-tabs{justify-content:flex-start;margin-top:18px;max-width:none}
  .sb-champ-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto auto;height:auto}
  .sb-champ{aspect-ratio:1}
  .sb-champ.is-first{grid-column:1/-1;grid-row:auto;aspect-ratio:4/3}
  .sb-row a{grid-template-columns:34px 52px minmax(0,1fr) auto}
  .sb-row img{width:52px;height:52px}
  .sb-bar,.sb-go,.sb-row .sb-chip{display:none}
  .sb-stats{grid-template-columns:1fr}
  .sb-note{display:block}
  .sb-note .t-coin{margin-top:14px}
}
