@layer reset, tokens, base, legacy, layout, components, utilities;
/* style.css from the pre-redesign frontend, in the legacy layer: above reset and base,
   below the new core and theme. Generated; edit the source and rebuild. */
@layer legacy {
:root {
  color-scheme: dark;
  --t-copper: #b9743f;
  --t-emerald: #37c26b;
  --t-champion: #e05a6b;
  --t-unranked: #6f7280;
  --atk: #ff8a3c;
  --atk-a12: #ff8a3c1f;
  --def: #4a9bff;
  --def-a12: #4a9bff1f;
  --pc: #ff6600;
  --pc-a20: #ff660033;
  --xbl: #107c10;
  --xbl-a20: #107c1033;
  --psn: #0070d1;
  --psn-a20: #0070d133;
  --net-h: 0px;
  --art-home: url('/assets/img/maps/background-home.avif');
  --art-cover: url('/assets/img/maps/wallpaper.jpg');
  --z-nav: 1000;
  --primary: var(--acc);
  --accent: var(--acc);
  --accent-color: var(--acc);
  --accent-soft: var(--acc-a16);
  --accent-2: var(--acc-hi);
  --card-bg: var(--s1);
  --input-bg: var(--bg-soft);
  --secondary-color: var(--s3);
  --secondary-bg: var(--s2);
  --border-color: var(--line-2);
  --border-soft: var(--line);
  --divider-color: var(--line);
  --info-color: var(--info);
  --radius-xl: var(--r-lg);
  --radius-lg: var(--r-lg);
  --radius: var(--r);
  --radius-sm: var(--r-sm);
  --border-radius: var(--r);
  --nav-height: var(--bar-h);
  --font-family: var(--f-ui);
  --font-display: var(--f-display);
  --font-mono: var(--f-mono);
  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: var(--shadow-pop);
  --site-chrome-bg: var(--s1);
  --nav-bg: #17171d;
  --nav-border: var(--line);
  --footer-bg: #0a0a0d;
  --footer-border: #ffffff0a;
  --footer-text: var(--ink-3);
}
body > main { flex: 1 0 auto; width: 100%; position: relative; isolation: isolate; }
body > main::before {
  content: ''; position: absolute; inset: 0 0 auto; height: 620px; z-index: -1; pointer-events: none;
  background:
    radial-gradient(900px 420px at 18% -8%, #f5a62329, transparent 70%),
    radial-gradient(700px 380px at 92% 0%, #4a9bff10, transparent 70%),
    var(--stripes),
    linear-gradient(180deg, #17130b 0%, transparent 100%);
  -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent); mask-image: linear-gradient(180deg, #000 55%, transparent);
}
body.modal-open, body.nav-open { overflow: hidden; }
.hidden { display: none !important; }
.num, .tnum, td.num, th.num { font-variant-numeric: tabular-nums; }
.muted { color: var(--ink-3); }
.small { font-size: .8125rem; }
.strong { font-weight: 700; color: var(--ink); }
.up, .pos { color: var(--up); }
.down, .neg { color: var(--down); }
.nowrap { white-space: nowrap; }
.icons-loading .material-icons, .icons-loading .msr { max-width: 1em; overflow: hidden; color: transparent; }
.fill { font-variation-settings: 'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24; }
.page { padding-block: 26px 72px; }
.stack > * + * { margin-top: 20px; }
.stack-lg > * + * { margin-top: 32px; }
.row { display: flex; align-items: center; gap: 10px; }
.row-between { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.grid { display: grid; gap: 16px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.split { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; align-items: start; }
.split-l { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 20px; align-items: start; }
.sticky { position: sticky; top: calc(var(--bar-h) + 16px); }
.sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 34px 0 12px; flex-wrap: wrap; }
.sec-head:first-child { margin-top: 0; }
.sec-title {
  display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap;
  font: 800 1.65rem/1 var(--f-display); letter-spacing: .005em; text-transform: uppercase; color: var(--ink);
}
.sec-title::before { content: ''; align-self: center; width: 6px; height: 20px; background: var(--acc); transform: skewX(-18deg); flex-shrink: 0; }
.sec-title small, .sec-meta { font: 500 .85rem var(--f-ui); font-style: normal; letter-spacing: 0; text-transform: none; color: var(--ink-3); }
.sec-sub { margin-top: 6px; color: var(--ink-3); font-size: .8125rem; }
.sec-link {
  display: inline-flex; align-items: center; gap: 4px; color: var(--acc-hi); font-size: .875rem; font-weight: 600;
  transition: color .15s;
}
.sec-link:hover { color: #fff; }
.sec-link .material-icons { font-size: 18px; transition: transform .2s var(--ease); }
.sec-link:hover .material-icons { transform: translateX(2px); }
.label { font-size: .75rem; font-weight: 600; color: var(--ink-3); }
.nav-links { display: flex; align-items: center; gap: 0; list-style: none; height: 100%; min-width: 0; }
.nav-links > li { height: 100%; display: flex; align-items: center; position: relative; }
.nav-link {
  position: relative; display: inline-flex; align-items: center; gap: 2px; height: 100%; padding: 0 13px;
  color: var(--ink-2); font-weight: 600; font-size: .9375rem; white-space: nowrap; transition: color .15s;
}
.nav-link:hover { color: #fff; }
.nav-link.is-active { color: #fff; }
.nav-link.is-active::after {
  content: ''; position: absolute; left: 6px; right: 6px; bottom: 0; height: 4px; background: var(--acc); transform: skewX(-24deg);
}
.nav-brand { display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; }
.brand-mark { width: 32px; height: 32px; border-radius: 7px; }
.brand-name { font: 800 1.3rem/.9 var(--f-display); letter-spacing: .01em; }
.brand-sub { font: 600 .6rem/1 var(--f-ui); letter-spacing: .28em; text-transform: uppercase; color: var(--ink-3); margin-top: 4px; }
.search-pop {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: var(--z-pop);
  max-height: 380px; overflow-y: auto; padding: 6px; min-width: 260px;
  background: #1f1f27; border-radius: var(--r); box-shadow: var(--shadow-pop);
  animation: popIn .16s var(--ease);
}
.search-pop.is-floating { position: fixed; margin: 0; inset: auto; }
.search-item {
  display: flex; align-items: center; gap: 11px; padding: 8px 10px; border-radius: var(--r-sm); cursor: pointer;
  transition: background .1s;
}
.search-item:hover, .search-item.active { background: var(--s3); }
.search-item.muted { cursor: default; justify-content: center; padding: 16px; color: var(--ink-3); }
.s-av {
  width: 34px; height: 34px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%;
  background: var(--s4); font: 700 1rem var(--f-display); color: var(--ink-2);
}
.s-av-rank { background: none; border-radius: 0; }
.s-av-rank .rank-ic { width: 32px; height: 32px; }
.s-main { min-width: 0; flex: 1; display: flex; flex-direction: column; }
.s-name { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.s-sub { font-size: .75rem; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.s-pr { font: 700 1rem var(--f-display); color: var(--gold); font-variant-numeric: tabular-nums; }
.foot-inner {
  max-width: var(--maxw); margin: 0 auto; padding: 44px var(--gut) 36px;
  display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(4, minmax(0, 1fr)); gap: 32px;
}
.foot-links { display: flex; flex-wrap: wrap; gap: 8px; }
.foot-network {
  display: inline-flex; align-items: center; gap: 5px; height: 32px; padding: 0 12px; border-radius: var(--r-sm);
  background: var(--s2); color: var(--ink-3); font-size: .75rem; transition: background .15s, color .15s;
}
.foot-network b { color: var(--ink); }
.foot-network .material-icons { font-size: 14px; }
.foot-network:hover { background: var(--s3); color: var(--ink-2); }
a.chip:hover { border-color: #ffffff4d; color: #fff; }
.chip-acc { background: var(--acc-a08); border-color: var(--acc-a30); color: var(--acc-hi); }
.chip-acc .material-icons { color: var(--acc-hi); }
.chip-down { background: var(--down-a12); border-color: #ff526355; color: var(--down); }
.live-dot { position: relative; display: inline-block; vertical-align: middle; margin-right: 4px; width: 8px; height: 8px; border-radius: 50%; background: var(--up); flex-shrink: 0; }
.live-dot::after { content: ''; position: absolute; inset: -3px; border-radius: 50%; border: 1px solid var(--up); animation: ping 1.8s var(--ease) infinite; }
.badge-live, .live-tag {
  display: inline-flex; align-items: center; gap: 5px; height: 20px; padding: 0 10px; border-radius: 0; clip-path: var(--lean);
  background: var(--acc); color: var(--acc-ink); font: 700 .625rem/1 var(--f-ui); letter-spacing: .08em; text-transform: uppercase;
  vertical-align: middle;
}
.badge-live::before, .live-tag::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; animation: blink 1.4s ease-in-out infinite; }
.badge {
  display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: var(--r-xs);
  background: var(--s3); color: var(--ink-2); font-size: .6875rem; font-weight: 700; vertical-align: middle;
}
.tag-chip, .club-tag {
  display: inline-block; padding: 0 9px; height: 22px; line-height: 22px; border-radius: 0; clip-path: var(--lean);
  background: #ffffff14;
  font: 700 .85rem/22px var(--f-display); letter-spacing: .08em; color: var(--ink-2); white-space: nowrap; vertical-align: middle;
  transition: color .15s, box-shadow .15s, background .15s;
}
a.tag-chip:hover, a.club-tag:hover { color: var(--acc-ink); background: var(--acc); }
.cell-empty { color: var(--ink-4); }
.p-name { display: inline-flex; align-items: baseline; min-width: 0; max-width: 100%; font-weight: 700; color: var(--ink); }
.pn-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: color .15s; }
.pn-tag { color: var(--ink-4); font-weight: 500; font-size: .84em; font-variant-numeric: tabular-nums; flex-shrink: 0; }
a.p-name:hover .pn-name, tr:hover a.p-name .pn-name { color: var(--acc-hi); }
.pn-blank { color: var(--ink-3); font-style: normal; font-weight: 400; }
.rank-ic { display: inline-block; object-fit: contain; vertical-align: middle; flex-shrink: 0; }
.emblem { position: relative; display: grid; place-items: center; flex-shrink: 0; }
.emblem::before {
  content: ''; position: absolute; inset: 12%; border-radius: 50%;
  background: radial-gradient(circle, var(--tier, #ffffff22) 0%, transparent 70%); opacity: .4; filter: blur(8px);
}
.emblem img { position: relative; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 6px 12px #0009); }
.emblem-none .material-icons { position: relative; font-size: 40%; color: var(--ink-4); }
.league { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; color: var(--ink); font-weight: 600; }
.league .rank-ic { width: 24px; height: 24px; }
.rank-pill {
  display: inline-grid; place-items: center; min-width: 34px; height: 26px; padding: 0 9px; border-radius: 0; clip-path: var(--lean);
  font: 800 1.1rem/1 var(--f-display); font-variant-numeric: tabular-nums; color: var(--ink-2);
}
.rank-pill.is-1 { color: #2a1d00; background: linear-gradient(160deg, #ffe38a, #e9aa13); }
.rank-pill.is-2 { color: #101419; background: linear-gradient(160deg, #f4f6f9, #a3adba); }
.rank-pill.is-3 { color: #1e0f04; background: linear-gradient(160deg, #f3b884, #b0632a); }
.delta { display: inline-flex; align-items: center; gap: 1px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.delta .material-icons { font-size: 16px; }
.delta.up { color: var(--up); }
.delta.down { color: var(--down); }
.delta.flat { color: var(--ink-4); }
.handle {
  display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 9px; border-radius: var(--r-xs);
  background: #ffffff0d; color: var(--ink-2); font-size: .78rem; font-weight: 600;
}
.handle svg { opacity: .85; }
.card {
  position: relative; background: var(--s1); border-radius: var(--r-lg);
}
.card-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px;
  padding: 12px 18px; border-bottom: 1px solid var(--line);
}
.card-title {
  display: flex; align-items: baseline; gap: 10px;
  font: 700 1.2rem/1.1 var(--f-display); letter-spacing: .03em; text-transform: uppercase; color: var(--ink);
}
.card-title > .material-icons, .card-title > .msr { display: none; }
.card-meta { color: var(--ink-3); font: 500 .78rem var(--f-ui); letter-spacing: 0; text-transform: none; }
.card-body { padding: 18px; }
.card-body.flush { padding: 0; }
.card-foot { padding: 12px 16px; display: flex; justify-content: center; }
.card-foot a { display: flex; align-items: center; justify-content: center; gap: 4px; width: 100%; height: 38px; border-radius: var(--r-sm); background: #33333d; color: #fff; font-size: .85rem; font-weight: 600; transition: background .15s; }
.card-foot a:hover { background: #3e3e49; }
.card-foot .material-icons { font-size: 18px; }
:where(a.card) { display: block; }
a.card { transition: background .2s, transform .25s var(--ease); }
a.card:hover { background: var(--s2); }
.info-dot, .st-info {
  display: inline-grid; place-items: center; width: 16px; height: 16px; border-radius: 50%;
  color: var(--ink-4); cursor: help; position: relative; vertical-align: middle; transition: color .15s;
}
.info-dot .material-icons, .st-info .material-icons, .st-info .msr { font-size: 15px; }
.info-dot:hover, .st-info:hover, .info-dot:focus-visible, .st-info:focus-visible { color: var(--ink-2); }
[data-tip] { position: relative; }
[data-tip]::after {
  content: attr(data-tip); position: absolute; z-index: var(--z-pop); left: 50%; bottom: calc(100% + 8px);
  width: max-content; max-width: 260px; padding: 8px 10px; border-radius: var(--r-sm);
  background: #2c2c36; color: var(--ink); box-shadow: var(--shadow-pop);
  font: 400 .75rem/1.45 var(--f-ui); letter-spacing: 0; text-transform: none; text-align: left; white-space: normal;
  opacity: 0; visibility: hidden; transform: translate(-50%, 4px); pointer-events: none;
  transition: opacity .14s, transform .18s var(--ease), visibility 0s .18s;
}
[data-tip]:hover::after, [data-tip]:focus-visible::after { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition-delay: .12s, .12s, 0s; }
[data-tip-pos="end"]::after { left: auto; right: -8px; transform: translate(0, 4px); }
[data-tip-pos="end"]:hover::after, [data-tip-pos="end"]:focus-visible::after { transform: none; }
.field input, input.gs-input, textarea.input {
  width: 100%; height: 40px; padding: 0 12px; border-radius: var(--r-sm);
  background: #121217; border: 1px solid var(--line-3); outline: none; font-size: .875rem;
  transition: border-color .15s, box-shadow .15s, background .15s;
}
textarea.input { height: auto; padding: 10px 12px; resize: vertical; font-family: var(--f-mono); font-size: .75rem; line-height: 1.5; }
.input-icon { position: relative; }
.input-icon > .material-icons { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--ink-3); font-size: 19px; pointer-events: none; }
.input-icon .input { padding-left: 38px; }
.field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.field > label, .field-label { font-size: .75rem; font-weight: 600; color: var(--ink-3); }
.field-hint { color: var(--ink-3); font-size: .75rem; }
.table-wrap { position: relative; overflow-x: auto; scrollbar-width: thin; }
.card > :is(.table-wrap, .gs-scope, .gs-feed, .list, .member-list):first-child { border-top-left-radius: var(--r-lg); border-top-right-radius: var(--r-lg); }
.card > :is(.table-wrap, .gs-scope, .gs-feed, .list, .member-list):last-child { border-bottom-left-radius: var(--r-lg); border-bottom-right-radius: var(--r-lg); }
.card > :is(.gs-feed, .list):is(:first-child, :last-child) { overflow: hidden; }
.table-wrap.is-loading, .is-loading > .table-wrap { opacity: .5; transition: opacity .15s; pointer-events: none; }
.is-loading { position: relative; }
.table-scroll-hint { display: none; }
table { width: 100%; border-collapse: collapse; font-size: .875rem; }
th {
  height: 40px; padding: 0 14px; text-align: left; white-space: nowrap;
  font: 700 .85rem var(--f-display); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3);
  background: var(--band);
}
td { height: 54px; padding: 0 14px; white-space: nowrap; color: var(--ink); font-weight: 500; background: var(--row); }
tbody tr:nth-child(even) > td { background: var(--row-alt); }
th:first-child, td:first-child { padding-left: 18px; }
th:last-child, td:last-child { padding-right: 18px; }
td.num, th.num { text-align: right; }
td.num { font-weight: 700; }
td.center, th.center { text-align: center; }
td.strong { font-weight: 700; color: var(--ink); }
td.score { font: 700 1.3rem var(--f-display); color: var(--ink); font-variant-numeric: tabular-nums; letter-spacing: .01em; }
td.rank-cell, th.rank-col { width: 1%; text-align: center; padding-right: 4px; }
td.muted { color: var(--ink-3); font-weight: 500; }
tbody tr > td { transition: background .1s; }
tbody tr:hover > td { background: var(--row-hover); }
tbody tr[data-href] { cursor: pointer; }
tbody tr:focus-visible { outline: none; }
tbody tr:focus-visible > td { background: #33333e; }
tr.is-me > td { background: #3a2c12 !important; }
.player-cell { display: flex; align-items: center; gap: 12px; min-width: 0; }
.player-cell .rank-ic { width: 32px; height: 32px; }
.player-cell .pc-main { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.player-cell .pc-sub, .pc-sub { font-size: .72rem; color: var(--ink-3); font-weight: 500; overflow: hidden; text-overflow: ellipsis; }
.bar-cell { display: inline-flex; align-items: center; justify-content: flex-end; gap: 10px; }
.bar-track { width: 64px; height: 4px; border-radius: 4px; background: #ffffff14; overflow: hidden; }
.bar-fill { display: block; height: 100%; border-radius: inherit; background: var(--acc); transform-origin: left; animation: growX .8s var(--ease) both; }
.list { list-style: none; }
.li {
  position: relative; display: flex; align-items: center; gap: 12px; min-height: 54px; padding: 8px 18px; background: var(--row);
  transition: background .1s;
}
.li:nth-child(even) { background: var(--row-alt); }
a.li:hover, .li[data-href]:hover { background: var(--row-hover); cursor: pointer; }
.li-pos { width: 22px; flex-shrink: 0; text-align: center; font: 700 1.05rem var(--f-display); color: var(--ink-3); font-variant-numeric: tabular-nums; }
.li-main { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.li-title { font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.li-sub { font-size: .75rem; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.li-sub b { color: var(--ink-2); }
.li-end { flex-shrink: 0; text-align: right; display: flex; flex-direction: column; align-items: flex-end; line-height: 1.3; }
.li-value { font: 700 1.3rem var(--f-display); color: var(--ink); font-variant-numeric: tabular-nums; }
.li-note { font-size: .72rem; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.li .rank-ic { width: 32px; height: 32px; }
.li.is-tier, .li[style*="--tier"] { background: linear-gradient(90deg, color-mix(in srgb, var(--tier) 16%, var(--row)) 0%, var(--row) 70%); box-shadow: inset 4px 0 0 var(--tier); }
.meter { height: 6px; border-radius: 6px; background: #ffffff14; overflow: hidden; }
.meter > i { display: block; height: 100%; border-radius: inherit; background: var(--tier, var(--acc)); transform-origin: left; animation: growX 1s var(--ease) both; }
.banner { position: relative; isolation: isolate; overflow: hidden; }
.banner::before {
  content: ''; position: absolute; inset: 0; z-index: -2;
  background: var(--art, none) center 35% / cover no-repeat;
  opacity: .2; filter: saturate(.6); transform: scale(1.04);
  -webkit-mask-image: linear-gradient(180deg, #000 30%, transparent); mask-image: linear-gradient(180deg, #000 30%, transparent);
}
.banner::after {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(90deg, var(--bg) 0%, #0e0e12cc 40%, #0e0e1244 100%);
}
.banner-inner { max-width: var(--maxw); margin: 0 auto; padding: 34px var(--gut) 26px; }
.banner-inner.has-tabs { padding-bottom: 0; }
.banner-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.banner h1 { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.banner-lead { margin-top: 10px; max-width: 72ch; color: var(--ink-2); font-size: .95rem; line-height: 1.6; }
.banner-meta { margin-top: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.banner .tabs { margin-top: 22px; border-bottom: 0; }
.empty-state, .error-state {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  padding: 48px 24px; text-align: center; color: var(--ink-3);
}
.empty-state .icon, .error-state .icon, .empty-state > .material-icons {
  width: 52px; height: 52px; margin-bottom: 8px; display: grid; place-items: center; border-radius: 50%;
  background: var(--s3); color: var(--ink-3); font-size: 26px;
}
.empty-state h3, .error-state h3 { color: var(--ink); font: 700 1.2rem var(--f-display); text-transform: uppercase; }
.empty-state p, .error-state p { max-width: 44ch; font-size: .85rem; }
.empty-state .btn { margin-top: 12px; }
.chart-empty {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-height: 180px;
  border-radius: var(--r); background: #ffffff05; color: var(--ink-3); font-size: .8125rem; text-align: center; padding: 20px;
}
.chart-empty .msr { font-size: 24px; color: var(--ink-4); margin-bottom: 4px; }
.chart-empty b { color: var(--ink-2); }
.skeleton { position: relative; overflow: hidden; border-radius: var(--r-sm); background: var(--s2); }
.skeleton::after {
  content: ''; position: absolute; inset: 0; transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, #ffffff0a, transparent); animation: shimmer 1.3s infinite;
}
.skel-line { height: 14px; margin: 12px 0; }
.skel-line:nth-child(3n) { width: 72%; }
.skel-line:nth-child(3n+2) { width: 88%; }
.skel-block { height: 100%; min-height: 120px; }
.r6-modal { position: fixed; inset: 0; z-index: var(--z-modal); display: grid; place-items: center; padding: 24px; }
.r6-modal-back { position: absolute; inset: 0; background: #000c; animation: fadeIn .2s; }
.r6-modal-panel {
  position: relative; width: min(760px, 100%); max-height: calc(100vh - 48px); display: flex; flex-direction: column;
  background: #1b1b22; border-radius: var(--r-lg); box-shadow: var(--shadow-pop); animation: modalIn .28s var(--ease); outline: none;
  overflow: hidden;
}
.r6-modal.is-wide .r6-modal-panel { width: min(1180px, 100%); }
.r6-modal.is-compact .r6-modal-panel { width: min(680px, 100%); max-height: min(560px, calc(100vh - 120px)); }
.r6-modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 16px 20px; background: #24242d; }
.r6-modal-title h3 { font: 800 1.6rem var(--f-display); text-transform: uppercase; letter-spacing: .02em; }
.r6-modal-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.r6-modal-body { padding: 20px; overflow-y: auto; }
@keyframes popIn { from { opacity: 0; transform: translateY(-4px) scale(.98); } }
@keyframes modalIn { from { opacity: 0; transform: translateY(12px) scale(.98); } }
@keyframes fadeIn { from { opacity: 0; } }
@keyframes tabIn { from { transform: scaleX(.3); opacity: 0; } }
@keyframes growX { from { transform: scaleX(0); } }
@keyframes shimmer { to { transform: translateX(100%); } }
@keyframes ping { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(1.9); opacity: 0; } }
@keyframes blink { 50% { opacity: .35; } }
@keyframes rise { from { opacity: 0; transform: translateY(10px); } }
@keyframes spin { to { transform: rotate(360deg); } }
.rise { animation: rise .5s var(--ease) both; animation-delay: calc(var(--i, 0) * 40ms); }
[data-reveal] { opacity: 0; transform: translateY(14px); transition: opacity .6s var(--ease), transform .6s var(--ease); transition-delay: calc(var(--i, 0) * 60ms); }
[data-reveal].is-in { opacity: 1; transform: none; }
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: .16s ease-out both vtOut; }
::view-transition-new(root) { animation: .28s var(--ease) both vtIn; }
::view-transition-old(site-header), ::view-transition-new(site-header) { animation: none; }
@keyframes vtOut { to { opacity: 0; } }
@keyframes vtIn { from { opacity: 0; transform: translateY(6px); } }
@media (prefers-reduced-motion: reduce) {
[data-reveal] { opacity: 1; transform: none; }
}
@media (max-width: 1440px) {
.nav-link { padding: 0 10px; }
}
@media (max-width: 1240px) {
.nav-link { padding: 0 8px; font-size: .875rem; }
.foot-inner { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
.nav-links { display: none; }
.split, .split-l { grid-template-columns: minmax(0, 1fr); }
.sticky { position: static; }
.grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
.grid-2, .grid-3 { grid-template-columns: minmax(0, 1fr); }
.banner-inner { padding-top: 22px; padding-bottom: 18px; }
.foot-inner { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.col-hide-sm { display: none; }
td { height: 50px; }
th:first-child, td:first-child { padding-left: 12px; }
th:last-child, td:last-child { padding-right: 12px; }
.sec-title { font-size: 1.25rem; }
}
.gh { padding: 46px 0 8px; }
.gh-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; align-items: stretch; }
.gh-left { min-width: 0; display: flex; flex-direction: column; }
.gh-brand { display: flex; align-items: center; gap: 26px; margin-bottom: 30px; }
.gh-logo { width: 104px; height: 104px; flex-shrink: 0; display: grid; place-items: center; }
.gh-logo img { width: 100%; height: 100%; filter: drop-shadow(0 10px 24px #f5a62355); }
.gh-title { font: 800 clamp(3rem, 5.2vw, 4.6rem)/.84 var(--f-display); letter-spacing: -.01em; text-transform: uppercase; }
.gh-title em { display: block; font-style: normal; color: var(--acc); }
.gh-sub { margin-top: 10px; color: var(--ink-2); font-size: 1rem; }
.gh-season { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 12px; color: var(--ink-3); font-size: .85rem; }
.gh-season b { color: #fff; font-variant-numeric: tabular-nums; }
.gsearch {
  position: relative; display: flex; align-items: center; height: 58px; padding: 0 10px; gap: 4px;
  border: 1px solid var(--acc); border-radius: var(--r-sm); background: #1b1b22cc;
  box-shadow: 0 0 0 4px #f5a62312; transition: box-shadow .2s;
}
.gsearch:focus-within { box-shadow: 0 0 0 4px var(--acc-a30); }
.gsearch-plats { display: flex; align-items: center; gap: 2px; padding-right: 10px; margin-right: 6px; border-right: 1px solid var(--line-3); height: 34px; }
.gsearch-plat {
  width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: var(--ink-3);
  transition: background .15s, color .15s;
}
.gsearch-plat svg, .gsearch-plat img { width: 18px; height: 18px; }
.gsearch-plat .material-icons { font-size: 20px; }
.gsearch-plat:hover { color: #fff; }
.gsearch-plat.is-on { color: #fff; background: #ffffff1f; }
.gsearch input { flex: 1; min-width: 0; height: 100%; background: none; border: 0; outline: none; font-size: 1.05rem; font-weight: 500; }
.gsearch input::placeholder { color: var(--ink-2); }
.gsearch input::-webkit-search-cancel-button { display: none; }
.gsearch-go { width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--r-xs); background: var(--acc); color: var(--acc-ink); }
.gsearch-go:hover { background: var(--acc-hi); }
.gsearch-wrap { position: relative; z-index: 30; }
.gsearch-wrap.is-open .gsearch { border-radius: var(--r-sm) var(--r-sm) 0 0; box-shadow: none; }
.rf {
  position: absolute; left: 0; right: 0; top: calc(100% - 1px); display: none;
  background: #1b1b22; border: 1px solid var(--acc); border-top-color: var(--line-2); border-radius: 0 0 var(--r-lg) var(--r-lg);
  box-shadow: 0 30px 60px -16px #000e; overflow: hidden;
}
.gsearch-wrap.is-open .rf { display: block; animation: popIn .16s var(--ease); }
.gh-quick { display: flex; align-items: center; gap: 16px; min-height: 30px; margin-top: 16px; }
.gh-quick-label { flex-shrink: 0; color: var(--ink-3); font-size: .85rem; font-weight: 500; }
.gh-quick-list { flex: 1; min-width: 0; display: flex; align-items: center; gap: 18px; overflow: hidden; }
.gh-chip { display: inline-flex; align-items: center; gap: 7px; min-width: 0; font-weight: 700; font-size: .9rem; white-space: nowrap; transition: color .15s; }
.gh-chip:hover { color: var(--acc-hi); }
.gh-chip-av { width: 20px; height: 20px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: var(--s4); font: 700 .7rem var(--f-display); color: var(--ink-2); }
.gh-quick-none { min-width: 0; color: var(--ink-4); font-size: .85rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gh-quick-fav { flex-shrink: 0; display: inline-flex; align-items: center; gap: 4px; color: var(--cash); font-size: .85rem; font-weight: 600; }
.gh-quick-fav .material-icons { font-size: 17px; }
.gh-quick-fav:hover { color: #fff; }
.gh-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 18px; padding: 12px 4px; border-radius: var(--r-lg); background: var(--s1); }
.gh-stat { display: flex; align-items: center; justify-content: center; gap: 10px; min-width: 0; padding: 2px 10px; }
.gh-stat + .gh-stat { border-left: 1px solid var(--line-2); }
.gh-stat > .material-icons { font-size: 26px; color: var(--ink-3); }
.gh-stat > span:last-child { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.gh-stat small { color: var(--ink-3); font-size: .68rem; font-weight: 600; white-space: nowrap; }
.gh-stat b { font: 700 1.3rem/1.1 var(--f-display); font-variant-numeric: tabular-nums; white-space: nowrap; }
.rf-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; padding: 16px 16px 14px; border-bottom: 1px solid var(--line); }
.rf-tab {
  display: flex; align-items: center; justify-content: center; gap: 8px; height: 36px; border-radius: 0;
  background: #2c2c35; color: var(--ink-2); font: 700 1rem var(--f-display); letter-spacing: .06em; text-transform: uppercase; transition: background .15s, color .15s;
}
.rf-tab:first-child { border-radius: var(--r-xs) 0 0 var(--r-xs); }
.rf-tab:last-child { border-radius: 0 var(--r-xs) var(--r-xs) 0; }
.rf-tab .material-icons { font-size: 19px; }
.rf-tab:hover { background: #3d3d48; }
.rf-tab:hover { color: #fff; }
.rf-tab.is-on { background: var(--acc); color: var(--acc-ink); }
.rf-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px 6px; }
.rf-label { display: flex; align-items: center; gap: 8px; font: 700 .95rem var(--f-display); letter-spacing: .04em; text-transform: uppercase; color: var(--ink-2); }
.rf-count { display: inline-grid; place-items: center; height: 18px; padding: 0 5px; border: 1px solid var(--line-3); border-radius: 3px; font: 700 .65rem var(--f-ui); color: var(--ink-2); }
.rf-list { list-style: none; max-height: 336px; overflow-y: auto; padding: 0 8px 10px; }
.rf-row { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 5px 10px; border-radius: var(--r-sm); cursor: pointer; transition: background .12s; }
.rf-row:hover, .rf-row.is-active { background: #ffffff0f; }
.rf-row.is-active { box-shadow: inset 3px 0 0 var(--acc); }
.rf-main { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.rf-sub { color: var(--ink-3); font-size: .75rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rf-rank { font: 800 1.15rem var(--f-display); color: var(--cash); font-variant-numeric: tabular-nums; white-space: nowrap; }
.rf.is-busy .rf-count { opacity: .4; }
.rf-av { width: 28px; height: 28px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: var(--s4); font: 700 .9rem var(--f-display); color: var(--ink-2); overflow: hidden; }
.rf-av .rank-ic { width: 28px; height: 28px; }
.rf-av.has-icon { background: none; }
.rf-name { min-width: 0; font-weight: 700; font-size: .95rem; }
.rf-name .pn-tag { font-size: .78em; }
.rf-meta { color: var(--ink-3); font-size: .78rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rf-btn { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; color: var(--ink-3); transition: color .15s, background .15s; }
.rf-btn .material-icons { font-size: 20px; }
.rf-btn:hover { color: #fff; background: #ffffff12; }
.rf-star.is-on { color: var(--gold); }
.rf-star.is-on .material-icons { font-variation-settings: 'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24; }
.rf-empty { padding: 26px 18px 30px; color: var(--ink-3); text-align: center; font-size: .875rem; list-style: none; }
.gh-trend { margin-top: 18px; flex: 1 1 0; min-height: 240px; display: flex; flex-direction: column; overflow: hidden; }
.gh-trend > .list { flex: 1; min-height: 0; overflow-y: auto; }
.gh-trend .li-end .bar-track { width: 56px; margin-top: 4px; }
.gh-right { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.promo {
  position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: stretch; min-height: 272px;
  border-radius: var(--r-lg); overflow: hidden;
  background: var(--stripes), linear-gradient(115deg, #9c5a00 0%, #6e4006 36%, #33240f 72%, #1b1b22 100%);
  clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 0 100%); border-radius: var(--r-lg) 0 var(--r-lg) var(--r-lg);
}
.promo-copy { padding: 22px 0 22px 22px; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; position: relative; z-index: 1; }
.promo-badge { height: 28px; padding: 0 8px; display: inline-flex; align-items: center; gap: 6px; border-radius: var(--r-xs); background: #fff; color: #6e4006; font: 700 .8rem var(--f-display); letter-spacing: .06em; text-transform: uppercase; }
.promo-badge img { width: 18px; height: 18px; }
.promo h2 { font: 800 2.6rem/.9 var(--f-display); text-transform: uppercase; letter-spacing: -.005em; }
.promo p { color: #ffffffd9; font-size: .875rem; line-height: 1.55; max-width: 38ch; }
.promo-btns { margin-top: auto; display: flex; gap: 10px; flex-wrap: wrap; }
.promo .btn-primary { background: var(--acc); box-shadow: 0 6px 18px -6px #0008; }
.promo .btn-ghost { background: #ffffff26; color: #fff; }
.promo .btn-ghost:hover { background: #ffffff38; }
.promo-shot { position: relative; margin: 18px 0 0; border-radius: var(--r) 0 0 0; overflow: hidden; box-shadow: -10px 0 30px -10px #000a; align-self: end; height: calc(100% - 18px); }
.promo-shot img { width: 100%; height: 100%; object-fit: cover; object-position: left top; }
.no1-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-radius: var(--r-lg); overflow: hidden; background: #23232b; }
.no1 { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 18px 18px 16px; min-width: 0; transition: background .15s; }
.no1 + .no1 { border-left: 1px solid #ffffff0f; }
.no1:hover { background: #2e2e38; }
.no1-badge {
  position: absolute; top: 14px; right: 0; height: 30px; padding: 0 12px 0 16px; display: grid; place-items: center;
  background: var(--cash); clip-path: polygon(10px 0, 100% 0, 100% 100%, 0 100%); font: 800 1.3rem/1 var(--f-display); color: #1d1400;
}
.no1-badge { grid-auto-flow: column; gap: 1px; align-items: baseline; }
.no1-badge small { font-size: .7em; }
.no1-av { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; background: #ffffff12; margin-bottom: 16px; overflow: hidden; }
.no1-av .rank-ic { width: 40px; height: 40px; }
.no1-av .material-icons { font-size: 26px; color: var(--ink-2); }
.no1-name { font: 800 1.45rem/1.05 var(--f-display); text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.no1-label { color: var(--ink-3); font-size: .78rem; font-weight: 600; }
.no1-val { font: 700 2.4rem/1 var(--f-display); color: var(--cash); font-variant-numeric: tabular-nums; }
.no1.skeleton-ish .no1-name, .no1.skeleton-ish .no1-val { color: var(--ink-4); }
.mini-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.mini {
  position: relative; display: flex; flex-direction: column; justify-content: flex-end; gap: 4px; height: 170px; padding: 18px;
  border-radius: var(--r-lg); overflow: hidden; isolation: isolate; background: #24242c;
}
.mini::before { content: ''; position: absolute; inset: 0; z-index: -2; background: var(--art) center / cover no-repeat; opacity: .55; transition: transform .5s var(--ease), opacity .3s; }
.mini::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, transparent 10%, #0e0e12ee 85%); }
.mini:hover::before { transform: scale(1.05); opacity: .7; }
.mini-kicker { font: 700 .8rem var(--f-display); letter-spacing: .1em; text-transform: uppercase; color: var(--acc-hi); }
.mini-title { font: 800 1.8rem/.95 var(--f-display); text-transform: uppercase; }
.mini-foot { margin-top: 8px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 12px; border-radius: var(--r-sm); background: #1b1b22d9; font-weight: 600; font-size: .85rem; }
.mini-foot .material-icons { font-size: 20px; }
.hh-ends b { color: #fff; font-weight: 600; font-variant-numeric: tabular-nums; }
.omni {
  position: relative; margin-top: 28px; max-width: 680px; height: 56px; display: flex; align-items: center; gap: 10px;
  padding: 0 7px 0 16px; border-radius: var(--r-sm); background: #1b1b22cc; border: 1px solid var(--line-3);
  transition: border-color .2s, box-shadow .2s, background .2s;
}
.omni:hover { border-color: #ffffff40; }
.omni:focus-within { border-color: var(--acc); box-shadow: 0 0 0 4px var(--acc-a16); }
.omni-ic { color: var(--ink-3); font-size: 22px; }
.omni input { flex: 1; min-width: 0; height: 100%; background: none; border: 0; outline: none; font-size: 1rem; font-weight: 500; }
.omni input::placeholder { color: var(--ink-3); }
.omni input::-webkit-search-cancel-button { display: none; }
.omni input:focus, .omni input:focus-visible { outline: none; }
.omni-plats { display: flex; align-items: center; gap: 9px; padding-right: 6px; color: var(--ink-4); }
.omni-go { height: 42px; padding: 0 18px; border-radius: var(--r-xs); }
.omni .search-pop { top: calc(100% + 8px); }
.hh-ladder { overflow: hidden; }
.ladder-body { padding: 0; display: flex; flex-direction: column; min-height: 260px; }
.ladder-row {
  display: grid; grid-template-columns: 34px 120px minmax(0, 1fr) 62px; align-items: center; gap: 14px;
  padding: 9px 18px; background: linear-gradient(90deg, color-mix(in srgb, var(--tier) 14%, var(--row)), var(--row) 60%);
  box-shadow: inset 4px 0 0 var(--tier); transition: filter .12s;
}
.ladder-row:nth-child(even) { background: linear-gradient(90deg, color-mix(in srgb, var(--tier) 14%, var(--row-alt)), var(--row-alt) 60%); }
.ladder-row:hover { filter: brightness(1.18); }
.ladder-name { display: flex; flex-direction: column; font-weight: 700; font-size: .875rem; line-height: 1.2; }
.ladder-name small { font-weight: 600; font-size: .72rem; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.ladder-bar { height: 8px; border-radius: 8px; background: #ffffff10; overflow: hidden; }
.ladder-bar i { display: block; height: 100%; border-radius: inherit; background: var(--tier); transform-origin: left; animation: growX 1s var(--ease) both; animation-delay: .15s; }
.ladder-val { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.15; }
.ladder-val b { font: 700 1.1rem var(--f-display); font-variant-numeric: tabular-nums; }
.ladder-val small { font-size: .7rem; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.ladder-foot { display: flex; justify-content: space-between; gap: 8px; padding: 12px 18px; color: var(--ink-3); font-size: .75rem; }
.ladder-foot b { color: var(--ink); font-variant-numeric: tabular-nums; }
.hh-kpis .p-name { font-size: inherit; }
.home-main { padding-top: 22px; }
.home-grid { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 22px; align-items: start; }
.home-side { display: flex; flex-direction: column; gap: 22px; }
.home-col { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.home-top td { height: 56px; }
.club-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2px; background: var(--s1); border-radius: 0 0 var(--r-lg) var(--r-lg); overflow: hidden; }
.club-tile { display: flex; flex-direction: column; gap: 10px; padding: 18px; background: var(--row); transition: background .15s; }
.club-tile:hover { background: var(--row-hover); }
.club-tile-top { display: flex; align-items: center; justify-content: space-between; }
.club-tile .tag-chip { font-size: .9rem; }
.club-tile-power { display: flex; align-items: baseline; gap: 6px; }
.club-tile-power b { font: 700 2.1rem/1 var(--f-display); font-variant-numeric: tabular-nums; }
.club-tile-power small { color: var(--ink-3); font-size: .72rem; }
.club-tile-meta { color: var(--ink-3); font-size: .75rem; }
.home-top .player-cell .rank-ic { width: 34px; height: 34px; }
.home-side .li-end .bar-track { width: 56px; margin-top: 4px; }
.explore { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.explore-item {
  position: relative; display: flex; flex-direction: column; gap: 2px; padding: 18px; border-radius: var(--r-lg);
  background: var(--s1); overflow: hidden; transition: background .2s, transform .3s var(--ease);
}
.explore-item .material-icons { font-size: 26px; color: var(--acc); margin-bottom: 16px; transition: transform .3s var(--ease); }
.explore-item b { font: 800 1.35rem/1.05 var(--f-display); text-transform: uppercase; letter-spacing: .02em; }
.explore-item small { color: var(--ink-3); font-size: .78rem; }
.explore-item::after {
  content: ''; display: inline-block; width: 1em; height: 1em; margin: auto; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 256 256%22%3E%3Cpath d=%22M224.49,136.49l-72,72a12,12,0,0,1-17-17L187,140H40a12,12,0,0,1,0-24H187L135.51,64.48a12,12,0,0,1,17-17l72,72A12,12,0,0,1,224.49,136.49Z%22/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 256 256%22%3E%3Cpath d=%22M224.49,136.49l-72,72a12,12,0,0,1-17-17L187,140H40a12,12,0,0,1,0-24H187L135.51,64.48a12,12,0,0,1,17-17l72,72A12,12,0,0,1,224.49,136.49Z%22/%3E%3C/svg%3E") center / contain no-repeat;  position: absolute; top: 16px; right: 16px; font-size: 20px; color: var(--ink-4);
  transition: color .2s, transform .3s var(--ease);
}
.explore-item:hover { background: var(--s2); }
.explore-item:hover::after { color: #fff; transform: translateX(3px); }
@media (max-width: 1180px) {
.explore { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.home-grid { grid-template-columns: minmax(0, 1fr) 340px; }
.gh-grid { grid-template-columns: minmax(0, 1fr); }
.gh-trend { flex: none; min-height: 0; }
.gh-trend > .list { overflow: visible; }
}
@media (max-width: 1020px) {
.home-grid { grid-template-columns: minmax(0, 1fr); }
.club-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
.gh { padding-top: 26px; }
.gh-brand { gap: 16px; margin-bottom: 24px; }
.gh-logo { width: 68px; height: 68px; }
.gh-title { font-size: 2.8rem; }
.gh-sub { font-size: .875rem; }
.gsearch { height: 52px; }
.gsearch-plats { display: none; }
.gh-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 12px; }
.gh-stat { justify-content: flex-start; }
.gh-stat:nth-child(3) { border-left: 0; }
.gh-quick-list .gh-chip:nth-child(n+3) { display: none; }
.promo { grid-template-columns: minmax(0, 1fr); min-height: 0; }
.promo-copy { padding: 20px; }
.promo-shot { display: none; }
.promo h2 { font-size: 1.8rem; }
.no1-grid { grid-template-columns: minmax(0, 1fr); }
.no1 + .no1 { border-left: 0; border-top: 1px solid #ffffff0f; }
.mini-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
.omni { height: 52px; padding-left: 14px; }
.omni-plats, .omni-go span:first-child { display: none; }
.omni-go { width: 40px; height: 40px; padding: 0; }
.explore { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ladder-row { grid-template-columns: 30px 96px minmax(0, 1fr) 52px; gap: 10px; padding-inline: 12px; }
.ladder-foot span:last-child { display: none; }
}
.pf-wrap { padding-top: 22px; }
.pf-card { position: relative; border-radius: var(--r-lg); background: #24242c; }
.pf-cover {
  position: relative; height: 264px; isolation: isolate; overflow: hidden;
  background: #1b1b22; border-radius: var(--r-lg) var(--r-lg) 0 0;
}
.pf-cover::before {
  content: ''; position: absolute; inset: 0; z-index: -2;
  background: var(--ph-cover, var(--art-cover)) center 45% / cover no-repeat;
  opacity: .85;
}
.pf-cover::after {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background:
    var(--stripes),
    radial-gradient(520px 260px at 120px 110%, color-mix(in srgb, var(--tier, var(--acc)) 34%, transparent), transparent 70%),
    linear-gradient(90deg, #0e0e12b3 0%, transparent 55%),
    linear-gradient(180deg, #0e0e1200 30%, #0e0e12e6 100%);
}
.profile-banner.has-cover .pf-cover::before { opacity: 1; }
.pf-cover .pf-head { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: flex-end; gap: 22px; padding: 0 22px 14px 168px; }
.pf-avatar {
  --pfc: 18px;
  position: absolute; left: 24px; top: 196px; z-index: 3; width: 128px; height: 128px; display: grid; place-items: center;
  clip-path: polygon(var(--pfc) 0, 100% 0, 100% calc(100% - var(--pfc)), calc(100% - var(--pfc)) 100%, 0 100%, 0 var(--pfc));
  background: linear-gradient(150deg, var(--tier, var(--acc)), color-mix(in srgb, var(--tier, var(--acc)) 35%, #000));
}
.pf-avatar::before {
  content: ''; position: absolute; inset: 4px; clip-path: inherit;
  background: radial-gradient(circle at 50% 30%, #2e2e38, #131318 75%);
}
.pf-avatar > * { position: relative; }
.pf-avatar .emblem { animation: emblemIn .7s var(--ease) both; }
.pf-initial { font: 800 4rem/1 var(--f-display); color: var(--ink-2); }
.pf-avatar.is-avatar { overflow: hidden; }
.pf-avatar .ph-avatar-img { position: absolute; inset: 4px; width: calc(100% - 8px); height: calc(100% - 8px); object-fit: cover; clip-path: polygon(15px 0, 100% 0, 100% calc(100% - 15px), calc(100% - 15px) 100%, 0 100%, 0 15px); }
.pf-flag {
  position: absolute; right: 6px; bottom: 6px; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%;
  background: var(--tier, var(--acc)); box-shadow: 0 0 0 3px #fff; color: #111;
}
.pf-flag .rank-ic { width: 22px; height: 22px; }
.pf-id { min-width: 0; flex: 1; }
.banner .pf-head { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; }
.banner .pf-name { text-shadow: none; }
.banner .pf-meta .chip { background: #ffffff0d; }
.pf-kicker { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 6px; }
.pf-kicker { gap: 16px; margin-bottom: 8px; }
.pf-stat { display: inline-flex; align-items: center; gap: 5px; color: #ffffffcc; font-size: .8rem; font-weight: 600; text-shadow: 0 1px 6px #000a; white-space: nowrap; }
.pf-stat .msr { font-size: 16px; color: #ffffff99; }
.pf-stat b, .pf-stat .tnum { color: #fff; }
.pf-tags { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.pf-tags .chip { height: 24px; background: #0e0e12b3; border-color: #ffffff2e; font-size: .72rem; }
.pf-tags .premium-info { height: 24px; }
.pf-name {
  display: flex; align-items: center; flex-wrap: wrap; gap: 0 12px;
  font: 800 clamp(2.4rem, 4.2vw, 3.5rem)/.95 var(--f-display); letter-spacing: -.005em; text-transform: none; overflow-wrap: anywhere;
  text-shadow: 0 2px 14px #0008;
}
.pf-tag { font: 600 .42em var(--f-ui); color: #ffffffa6; letter-spacing: 0; margin-left: -6px; align-self: flex-end; margin-bottom: .35em; }
.pf-club { font-size: .85rem; height: 26px; line-height: 26px; padding: 0 9px; background: #0e0e1299; }
.pf-meta { margin-top: 10px; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.pf-meta .handle { background: #0e0e1299; }
.pf-meta .chip { background: #0e0e1299; }
.pf-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; flex-shrink: 0; }
.pf-btns { display: flex; gap: 8px; }
.pf-ic {
  width: 42px; height: 42px; display: grid; place-items: center; border-radius: 0; clip-path: var(--cut-shape-2);
  background: #2b2b34e6; color: #fff; transition: background .15s, transform .15s var(--ease);
}
.pf-ic .material-icons { font-size: 22px; }
.pf-ic:hover { background: #3a3a45; }
.pf-ic.is-acc { background: var(--acc); }
.pf-ic.is-acc:hover { background: var(--acc-hi); }
.pf-ic.is-purple { background: #7d3cff; }
.pf-ic.is-done { background: var(--up); color: #062311; }
.pf-ic.pf-fav.is-on .material-icons { font-variation-settings: 'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24; }
.pf-ic.pf-fav:not(.is-on) { background: #2b2b34e6; }
.pf-band { position: relative; display: flex; align-items: center; min-height: 56px; padding-left: 168px; background: #24242c; border-radius: 0 0 var(--r-lg) var(--r-lg); }
.pf-band .tabs { flex: 1; border-bottom: 0; margin: 0; }
.pf-band .tab { height: 56px; }
.claim-chip.is-claimed { cursor: default; }
.premium-info {
  display: inline-flex; align-items: center; gap: 4px; height: 22px; padding: 0 8px 0 6px; border-radius: var(--r-xs);
  color: var(--gold); background: #0e0e12b3; box-shadow: inset 0 0 0 1px #f2c94c4d;
  font-size: .6875rem; font-weight: 700; white-space: nowrap; transition: background .15s, box-shadow .15s;
}
.premium-info .msr { font-size: 14px; }
.premium-info:hover { background: #f2c94c29; box-shadow: inset 0 0 0 1px #f2c94c80; }
.premium-info.is-active { color: #1d1300; background: var(--gold); box-shadow: none; }
.pl-page { padding-top: 22px; }
.pl-layout { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 26px; align-items: start; }
.pl-sidebar { display: flex; flex-direction: column; gap: 0; min-width: 0; }
.pl-side-group { min-width: 0; }
.pl-side-group + .pl-side-group { margin-top: 30px; }
.pl-side-group > .sec-head { margin-top: 0; }
.pl-main { min-width: 0; }
.pl-pane { display: flex; flex-direction: column; gap: 22px; }
.pl-pane > .sec-head { margin: 4px 0 -10px; }
.pl-pane[hidden] { display: none; }
.pl-kpis { overflow: visible; position: relative; z-index: 1; }
.pl-kpis .kpi:last-child [data-tip]::after { left: auto; right: -8px; transform: translateY(4px); }
.pl-kpis .kpi:last-child [data-tip]:hover::after, .pl-kpis .kpi:last-child [data-tip]:focus-visible::after { transform: none; }
.cs-card { border-radius: var(--r-lg); overflow: hidden; background: var(--s1); }
.cs-top {
  display: flex; align-items: center; gap: 14px; padding: 18px;
  background: linear-gradient(100deg, color-mix(in srgb, var(--tier, #888) 32%, #1b1b22) 0%, color-mix(in srgb, var(--tier, #888) 8%, #1b1b22) 100%);
}
.cs-top .emblem { flex-shrink: 0; }
.cs-main { flex: 1; min-width: 0; }
.cs-league { font: 800 1.05rem/1 var(--f-display); letter-spacing: .06em; text-transform: uppercase; color: var(--tier, var(--ink-2)); }
.cs-rs { margin-top: 4px; font: 700 2.3rem/1 var(--f-display); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cs-rs sup { font-size: .45em; margin-left: 2px; color: var(--ink-2); vertical-align: top; position: relative; top: .2em; }
.cs-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; text-align: right; }
.cs-side small { color: var(--ink-2); font-size: .75rem; font-weight: 600; }
.cs-side b { font: 800 1.7rem/1 var(--f-display); font-variant-numeric: tabular-nums; }
.cs-meter { padding: 12px 18px 4px; }
.cs-meter-head { display: flex; justify-content: space-between; margin-bottom: 6px; font-size: .75rem; color: var(--ink-3); font-weight: 600; }
.cs-meter-head b { color: var(--ink); }
.cs-table { width: 100%; padding: 8px 0 10px; }
.cs-table th, .cs-table td { background: none !important; height: 28px; font-size: .8rem; }
.cs-table th { height: 30px; font-size: .7rem; font-weight: 600; color: var(--ink-3); }
.cs-table td { font-weight: 600; }
.cs-table tbody tr[data-href]:hover td { color: var(--acc-hi); }
.cs-empty { padding: 14px 18px 18px; color: var(--ink-3); font-size: .8rem; }
.peaks { border-radius: var(--r-lg); overflow: hidden; background: var(--s1); }
.pk-band {
  display: grid; grid-template-columns: minmax(0, 1fr) 56px 84px; gap: 8px; align-items: center; height: 38px; padding: 0 18px;
  background: var(--band); font-size: .7rem; font-weight: 600; color: var(--ink-3);
}
.pk-band b { font: 800 1.05rem var(--f-display); letter-spacing: .05em; text-transform: uppercase; color: var(--ink-2); }
.pk-band span { text-align: right; }
.pk-row {
  display: grid; grid-template-columns: 34px minmax(0, 1fr) 56px 84px; gap: 8px 10px; align-items: center; min-height: 58px; padding: 8px 18px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--tier, #555) 18%, var(--row)) 0%, var(--row) 75%);
  box-shadow: inset 4px 0 0 var(--tier, #555); cursor: pointer; transition: filter .12s;
}
.pk-row + .pk-row { border-top: 1px solid #0000002e; }
.pk-row:hover { filter: brightness(1.15); }
.pk-row .rank-ic { width: 32px; height: 32px; }
.pk-name { min-width: 0; display: flex; flex-direction: column; line-height: 1.15; }
.pk-name small { display: flex; align-items: center; gap: 6px; color: var(--ink-2); font-size: .78rem; font-weight: 600; white-space: nowrap; }
.pk-name small .badge-live { height: 16px; padding: 0 5px; font-size: .55rem; }
.pk-name b { font: 700 1.35rem var(--f-display); font-variant-numeric: tabular-nums; }
.pk-name b sup { font-size: .55em; color: var(--ink-2); margin-left: 2px; }
.pk-val { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.pk-val.muted { font-weight: 600; }
.pk-more { display: flex; align-items: center; justify-content: center; gap: 4px; height: 42px; color: var(--acc-hi); font-weight: 600; font-size: .85rem; background: var(--s1); width: 100%; }
.pk-more:hover { color: #fff; }
.pk-more .material-icons { font-size: 20px; transition: transform .2s var(--ease); }
.peaks.is-open .pk-more .material-icons { transform: rotate(180deg); }
.peaks:not(.is-open) .pk-row.is-extra { display: none; }
.pk-foot { padding: 12px 16px 16px; background: var(--s1); }
.pk-foot .btn { width: 100%; }
.aliases { border-radius: var(--r-lg); overflow: hidden; background: var(--s1); padding: 12px 18px 14px; }
.aliases table { font-size: .875rem; table-layout: fixed; }
.aliases th, .aliases td { background: none !important; padding: 4px 0; height: 26px; }
.aliases th { height: 24px; font-size: .7rem; color: var(--ink-3); }
.aliases td { font-weight: 700; }
.aliases td.num, .aliases th.num { width: 92px; text-align: right; white-space: nowrap; }
.aliases td:first-child { white-space: normal; overflow-wrap: anywhere; line-height: 1.35; padding-right: 10px; }
.alias-cur { margin-left: 4px; display: inline-flex; align-items: center; height: 16px; padding: 0 5px; border-radius: 3px; background: var(--acc); color: var(--acc-ink); font-size: .6rem; font-weight: 700; letter-spacing: .06em; line-height: 1; text-transform: uppercase; white-space: nowrap; }
.aliases td, .aliases td:first-child { vertical-align: middle; line-height: 18px; }
.aliases .premium-info { margin-top: 10px; }
.pl-seasons .li { min-height: 54px; }
.li-noicon { width: 32px; height: 32px; display: grid; place-items: center; color: var(--ink-4); }
.pl-seasons { max-height: 520px; overflow-y: auto; }
.pl-names .li { gap: 12px; }
.pn-dot { width: 8px; height: 8px; border-radius: 50%; border: 2px solid var(--ink-4); flex-shrink: 0; position: relative; }
.pl-names .is-current .pn-dot { border-color: var(--acc); background: var(--acc); }
.pl-name-hidden { justify-content: flex-start; }
.pl-card-head .premium-info { margin-left: auto; }
.pl-scroll { max-height: 640px; overflow-y: auto; }
.pl-stale { margin-top: 16px; display: flex; align-items: center; gap: 6px; }
.pl-stale .msr { font-size: 16px; }
.ap-under { margin-left: 6px; height: 20px; font-size: .6875rem; }
.pf-former { height: 26px; }
@keyframes emblemIn { from { opacity: 0; transform: scale(.82) rotate(-6deg); } }
@media (max-width: 1100px) {
.pl-layout { grid-template-columns: minmax(0, 1fr); }
.pl-sidebar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; align-items: start; }
.pl-side-group + .pl-side-group { margin-top: 0; }
.pl-side-group:nth-child(n+3) { margin-top: 26px; }
}
@media (max-width: 860px) {
.pf-cover { height: auto; min-height: 250px; }
.pf-cover .pf-head { position: relative; flex-direction: column; align-items: flex-start; padding: 120px 18px 16px 18px; gap: 14px; }
.pf-avatar { --pfc: 13px; left: 18px; top: 22px; width: 88px; height: 88px; }
.pf-avatar .emblem { width: 72px !important; height: 72px !important; }
.pf-flag { width: 24px; height: 24px; right: 0; bottom: 0; }
.pf-flag .rank-ic { width: 18px; height: 18px; }
.pf-actions { align-items: flex-start; width: 100%; }
.pf-tags { justify-content: flex-start; }
.pf-band { padding-left: 0; }
.pf-band .tabs { padding-inline: 6px; }
}
@media (max-width: 720px) {
.pl-sidebar { grid-template-columns: minmax(0, 1fr); }
.pl-side-group + .pl-side-group { margin-top: 26px; }
.pf-name { font-size: 2.4rem; }
}
.chart-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px 16px; flex-wrap: wrap; padding: 16px 18px 6px; }
.cc-title h3 { font: 700 1.3rem/1.1 var(--f-display); text-transform: uppercase; letter-spacing: .03em; }
.cc-meta { margin-top: 6px; display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; color: var(--ink-3); font-size: .78rem; }
.cc-chip { display: inline-flex; align-items: center; gap: 4px; color: var(--ink-2); font-weight: 600; }
.cc-chip .msr { font-size: 14px; color: var(--ink-3); }
.cc-delta { font-weight: 700; font-variant-numeric: tabular-nums; }
.cc-delta.up { color: var(--up); }
.cc-delta.down { color: var(--down); }
.cc-delta.flat { color: var(--ink-3); }
.cc-dim { color: var(--ink-3); }
.cc-live { display: inline-flex; align-items: center; gap: 6px; }
.cc-live i { width: 7px; height: 7px; border-radius: 50%; background: var(--up); box-shadow: 0 0 0 3px var(--up-a12); }
.cc-next { display: inline-flex; align-items: center; gap: 4px; font-variant-numeric: tabular-nums; }
.cc-next:empty { display: none; }
.cc-next .msr { font-size: 14px; }
.cc-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.cc-ranges { display: inline-flex; gap: 0; padding: 0; border-radius: var(--r-sm); border: 1px solid var(--line-3); overflow: hidden; }
.cc-range { height: 32px; min-width: 40px; padding: 0 10px; color: var(--ink-2); font: 700 .9rem var(--f-display); letter-spacing: .04em; font-variant-numeric: tabular-nums; transition: background .15s, color .15s; }
.cc-range + .cc-range { border-left: 1px solid var(--line-2); }
.cc-range:hover { color: #fff; background: #ffffff0a; }
.cc-range.is-on { background: var(--acc); color: var(--acc-ink); }
.cc-btn {
  display: inline-flex; align-items: center; gap: 5px; height: 34px; padding: 0 12px; border-radius: var(--r-sm);
  background: #2e2e38; color: var(--ink); font-weight: 600; font-size: .78rem; transition: background .15s, color .15s;
}
.cc-btn:hover { background: #3a3a45; }
.cc-btn .msr, .cc-btn .material-icons { font-size: 18px; }
.cc-icon { width: 34px; padding: 0; justify-content: center; }
.chart-card-plot { padding: 4px 10px 12px; min-height: 120px; }
.chartz { position: relative; }
.chartz-svg { width: 100%; height: auto; display: block; overflow: visible; outline: none; touch-action: pan-y; }
.chartz-svg text, .chartv-svg text { font-family: var(--f-ui); font-variant-numeric: tabular-nums; }
.chartz-line.is-drawing { stroke-dasharray: 1; stroke-dashoffset: 1; animation: draw 1.2s var(--ease) forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }
.chartz-tip, .chartv-tip {
  position: absolute; z-index: 5; pointer-events: none; min-width: 140px; padding: 9px 11px; border-radius: var(--r-sm);
  background: #2a2a34f2; box-shadow: var(--shadow-pop);
  display: flex; flex-direction: column; gap: 2px; font-size: .75rem; color: var(--ink-2);
}
.chartz-tip-title, .chartv-tip-title { color: var(--ink-3); font-size: .6875rem; font-weight: 600; }
.chartz-val { font: 700 1.3rem var(--f-display); color: var(--ink); font-variant-numeric: tabular-nums; }
.chartz-row { display: flex; gap: 6px; }
.chartz-delta { font-weight: 700; font-variant-numeric: tabular-nums; }
.chartz-delta.up { color: var(--up); }
.chartz-delta.down { color: var(--down); }
.chartz-flat { color: var(--ink-3); }
.chartz-sub, .chartv-sub { display: flex; align-items: center; gap: 5px; color: var(--ink-3); }
.chartz-tip-ic { width: 16px; height: 16px; }
.chartz-reset {
  position: absolute; top: 4px; right: 8px; display: inline-flex; align-items: center; gap: 4px; height: 28px; padding: 0 9px;
  border-radius: var(--r-xs); background: #33333d; font-size: .72rem; font-weight: 700; color: var(--ink);
}
.chartz-reset .material-icons { font-size: 15px; }
.chartz-caption, .chartv-caption { padding: 2px 10px 0; color: var(--ink-4); font-size: .6875rem; }
.chartz-touch-hint { display: none; }
@media (hover: none) {
.chartz-desktop-hint { display: none; }
.chartz-touch-hint { display: inline; }
}
.chartv-scroll { overflow-x: auto; scrollbar-width: thin; }
.chartv { position: relative; }
.chartv-svg { width: 100%; height: auto; display: block; outline: none; }
.chartv-bar { transition: opacity .15s; transform-box: fill-box; transform-origin: bottom; animation: growY .7s var(--ease) both; }
.chartv-bar:nth-child(odd) { animation-delay: .04s; }
@keyframes growY { from { transform: scaleY(0); } }
.ins-flow { display: flex; flex-direction: column; gap: 22px; }
.ins-flow > .section-head, .pl-log-head { display: flex; flex-direction: column; gap: 4px; }
.ins-flow > .section-head h2, .pl-log-head h2 {
  display: flex; align-items: center; gap: 12px; font: 800 1.65rem/1 var(--f-display); text-transform: uppercase;
}
.ins-flow > .section-head h2::before, .pl-log-head h2::before { content: ''; width: 6px; height: 20px; background: var(--acc); transform: skewX(-18deg); }
.ins-flow > .section-head p, .pl-log-head p { max-width: 80ch; line-height: 1.55; }
.ins-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; }
.ins-card { padding: 0; overflow: hidden; }
.ins-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 18px; height: 46px; background: var(--band); }
.ins-card-head h3 { display: flex; align-items: center; gap: 8px; font: 700 1.05rem var(--f-display); text-transform: uppercase; letter-spacing: .03em; }
.ins-card-head h3 .msr { font-size: 18px; color: var(--ink-3); }
.ins-chip { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: var(--r-xs); border: 1px solid var(--line-3); color: var(--ink-2); font-size: .72rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.ins-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ins-card > .ins-grid:only-child { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ins-stat { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 2px; padding: 14px 18px; }
.ins-v { font: 700 1.6rem/1.05 var(--f-display); color: var(--ink); font-variant-numeric: tabular-nums; }
.ins-l { font-size: .85rem; font-weight: 500; color: var(--ink-2); }
.ins-sub { font: 500 .75rem var(--f-ui); color: var(--ink-3); margin-left: 3px; }
.ins-league { display: flex; align-items: center; gap: 8px; padding: 12px 18px 0; font-weight: 700; }
.ins-league .rank-ic { width: 24px; height: 24px; }
.ins-meter { padding: 12px 18px 0; }
.ins-meter-head { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 7px; font-size: .8rem; font-weight: 600; }
.ins-meter-track { height: 6px; border-radius: 6px; background: #ffffff14; overflow: hidden; }
.ins-meter-fill { height: 100%; border-radius: inherit; background: var(--acc); transform-origin: left; animation: growX 1s var(--ease) both; }
.ins-card > p.small { padding: 12px 18px 0; }
.ins-cuts { list-style: none; padding: 12px 18px 14px; display: flex; flex-direction: column; gap: 6px; }
.ins-cuts li { display: flex; align-items: center; gap: 6px; font-size: .8rem; color: var(--ink-2); }
.ins-cuts .msr { font-size: 16px; color: var(--ink-3); }
.ins-cuts .ins-done, .ins-cuts .ins-done .msr { color: var(--up); }
.ins-cuts:empty { display: none; }
.ins-flow .table-wrap { background: var(--s1); border-radius: var(--r-lg); }
.ins-me td, tr.ins-me td { background: #3a2c12 !important; color: var(--ink); font-weight: 700; }
.ins-cross-grid, .ins-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ins-cross { list-style: none; }
.ins-cross li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 12px; padding: 0 18px; height: 46px; background: var(--row); }
.ins-cross li:nth-child(even) { background: var(--row-alt); }
.ins-cross-who { font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ins-cross-who:hover { color: var(--acc-hi); }
.ins-cross-move { display: inline-flex; align-items: center; gap: 2px; font-variant-numeric: tabular-nums; color: var(--ink-2); font-weight: 600; }
.ins-cross-move .msr { font-size: 16px; color: var(--ink-4); }
.is-up .ins-card-head h3 .msr { color: var(--up); }
.is-down .ins-card-head h3 .msr { color: var(--down); }
.ins-note { margin-top: -8px; }
.ins-facts { list-style: none; }
.ins-facts li { display: flex; justify-content: space-between; gap: 12px; padding: 0 18px; height: 44px; align-items: center; background: var(--row); }
.ins-facts li:nth-child(even) { background: var(--row-alt); }
.ins-fact-k { color: var(--ink-2); }
.ins-fact-v { font-weight: 700; font-variant-numeric: tabular-nums; }
.ins-core { list-style: none; }
.ins-core li { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 0 18px; height: 46px; background: var(--row); }
.ins-core li:nth-child(even) { background: var(--row-alt); }
.ins-core li.is-me { background: #3a2c12; }
.ins-core-n { font: 700 1rem var(--f-display); color: var(--ink-3); text-align: center; }
.ins-core-who { font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ins-core-score { font: 700 1.05rem var(--f-display); font-variant-numeric: tabular-nums; }
.ins-chart { padding: 8px; }
.ins-leagues, .ins-miles { list-style: none; }
.ins-leagues li { display: grid; grid-template-columns: 24px 110px minmax(0, 1fr) 44px; align-items: center; gap: 10px; padding: 0 18px; height: 42px; background: var(--row); }
.ins-leagues li:nth-child(even), .ins-miles li:nth-child(even) { background: var(--row-alt); }
.ins-leagues .rank-ic { width: 24px; height: 24px; }
.ins-lg-name { font-weight: 700; font-size: .82rem; }
.ins-lg-bar { height: 6px; border-radius: 6px; background: #ffffff14; overflow: hidden; }
.ins-lg-bar span { display: block; height: 100%; border-radius: inherit; background: var(--acc); transform-origin: left; animation: growX 1s var(--ease) both; }
.ins-lg-n { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.ins-miles li { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 0 18px; height: 46px; background: var(--row); }
.ins-miles .msr { font-size: 18px; color: var(--ink-3); }
.pl-up { color: var(--up) !important; }
.pl-down { color: var(--down) !important; }
.pl-log-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: var(--s1); border-radius: var(--r-lg); overflow: hidden; margin: 12px 0 16px; padding: 6px 4px; }
.pl-log-tile { display: flex; flex-direction: column; gap: 2px; padding: 12px 18px; }
.pll-l { font-size: .85rem; font-weight: 500; color: var(--ink-2); }
.pll-v { font: 700 1.6rem/1.05 var(--f-display); font-variant-numeric: tabular-nums; }
.pll-v.up { color: var(--up); }
.pll-v.down { color: var(--down); }
#logBox > .table-wrap { background: var(--s1); border-radius: var(--r-lg); }
.pl-res { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: var(--r-xs); border: 1px solid; font-size: .6875rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.pl-res.up { color: var(--up); background: var(--up-a12); border-color: #3ddc8455; }
.pl-res.down { color: var(--down); background: var(--down-a12); border-color: #ff526355; }
.pl-rd { display: inline-flex; align-items: center; height: 16px; padding: 0 4px; margin-left: 4px; border: 1px solid currentColor; border-radius: 3px; font-size: .64rem; font-weight: 700; vertical-align: 1px; }
tr.pl-new { animation: rise .35s var(--ease) both; }
.league-cell { white-space: nowrap; }
.league-cell .rank-ic { margin-right: 7px; }
.pl-more { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 16px; color: var(--ink-3); font-size: .8rem; }
.pl-more:not(.is-busy) { visibility: hidden; height: 1px; padding: 0; }
.pl-spinner { width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--line-3); border-top-color: var(--acc); animation: spin .8s linear infinite; }
.ev-section + .ev-section { margin-top: 22px; }
.ev-h { margin-bottom: 8px; font: 700 1rem var(--f-display); letter-spacing: .03em; text-transform: uppercase; color: var(--ink-2); }
.event-list { list-style: none; border-radius: var(--r); overflow: hidden; }
.event-item { display: flex; align-items: center; gap: 12px; padding: 10px 14px; background: var(--row); }
.event-item:nth-child(even) { background: var(--row-alt); }
.ev-ic { width: 34px; height: 34px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: var(--s3); color: var(--ink-2); }
.ev-ic .msr { font-size: 18px; }
.ev-ic.up { color: var(--up); background: var(--up-a12); }
.ev-ic.down { color: var(--down); background: var(--down-a12); }
.ev-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ev-name, .ev-rename { font-weight: 700; color: var(--ink); }
.ev-rename { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ev-old { color: var(--ink-3); text-decoration: line-through; text-decoration-color: var(--ink-4); }
.ev-arrow { font-size: 16px; color: var(--ink-4); }
.ev-text { font-size: .75rem; color: var(--ink-3); }
.ev-side { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; flex-shrink: 0; font-size: .75rem; }
.ev-rank { font-weight: 700; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.ev-day { color: var(--ink-4); }
@media (max-width: 720px) {
.ins-cross-grid, .ins-pair { grid-template-columns: minmax(0, 1fr); }
.ins-card > .ins-grid:only-child { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pl-log-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.lbh-live { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 18px; }
.lbh-feature { padding: 20px; display: flex; flex-direction: column; gap: 18px; overflow: hidden; background: linear-gradient(160deg, #33240f 0%, var(--s1) 60%); }
.lbh-feature-top { display: flex; align-items: center; gap: 12px; }
.lbh-feature-top b { display: block; font: 800 1.9rem/1 var(--f-display); text-transform: uppercase; letter-spacing: .02em; }
.lbh-feature-top small { color: var(--ink-3); font-size: .78rem; }
.lbh-ic { width: 40px; height: 40px; flex-shrink: 0; display: grid; place-items: center; border-radius: var(--r-sm); background: var(--s3); color: var(--ink-2); transition: background .2s, color .2s; }
.lbh-ic .material-icons { font-size: 21px; }
.lbh-feature .lbh-ic { background: var(--acc); color: var(--acc-ink); }
.lbh-go { margin-left: auto; color: var(--ink-4); transition: color .2s, transform .25s var(--ease); }
.lbh-podium { display: grid; grid-template-columns: 1fr 1.15fr 1fr; align-items: end; gap: 10px; }
.lbh-pod {
  display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 16px 8px 14px; border-radius: var(--r);
  background: #ffffff08; text-align: center; min-width: 0; animation: rise .6s var(--ease) both;
}
.lbh-pod.is-1 { padding-top: 24px; background: linear-gradient(180deg, #e9aa1326, #ffffff05); animation-delay: .1s; }
.lbh-pod.is-3 { animation-delay: .2s; }
.lbh-pod-name { max-width: 100%; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lbh-pod-score { font: 700 1.2rem var(--f-display); font-variant-numeric: tabular-nums; }
.lbh-pod-score small { color: var(--ink-3); font: 600 .7rem var(--f-ui); }
.lbh-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-content: start; }
.lbh-mode { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: var(--r-lg); background: var(--s1); transition: background .2s; }
.lbh-mode:hover { background: var(--s2); }
.lbh-mode:hover .lbh-ic { background: var(--acc); color: var(--acc-ink); }
.lbh-mode-name { font: 700 1.1rem var(--f-display); text-transform: uppercase; letter-spacing: .02em; }
.lbh-archive { overflow: hidden; }
.lbh-row { display: grid; grid-template-columns: 200px minmax(0, 1fr); align-items: center; gap: 16px; padding: 12px 18px; background: var(--row); }
.lbh-row:nth-child(even) { background: var(--row-alt); }
.lbh-season { display: flex; flex-direction: column; }
.lbh-season b { font: 800 1.35rem/1.05 var(--f-display); text-transform: uppercase; letter-spacing: .02em; transition: color .15s; }
.lbh-season:hover b { color: var(--acc-hi); }
.lbh-season small { color: var(--ink-3); font-size: .72rem; }
.lbh-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.lbh-chip { height: 28px; }
@media (max-width: 1020px) {
.lbh-live { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
.lbh-modes { grid-template-columns: minmax(0, 1fr); }
.lbh-row { grid-template-columns: minmax(0, 1fr); gap: 8px; }
}
.lb-banner .banner-row { align-items: flex-end; }
.lb-titlebox h1 { gap: 10px 14px; }
.lb-mode { color: var(--acc); }
.lb-filters { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; }
.lb-field { min-width: 190px; }
.lb-field .sel-btn { background: #121217e6; }
.lb-platforms { height: 40px; align-items: stretch; }
.lb-platforms button, .lb-platforms a { height: 38px; }
.lb-page > * + * { margin-top: 22px; }
.lb-chart-panel .chart-card-plot { padding-bottom: 0; }
.lb-legend { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 18px 18px; }
.lb-key {
  display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 10px 0 5px; border-radius: var(--r-xs);
  background: #ffffff0a; font-size: .78rem; color: var(--ink-2); font-weight: 600;
}
.lb-key b { font-variant-numeric: tabular-nums; color: #fff; }
.lb-table-card .card-head { flex-wrap: wrap; }
.lb-table-card .card-meta { margin-left: 6px; font-weight: 500; }
.lb-search { width: min(360px, 100%); }
.lb-table th.chg-col, .lb-table td.chg { width: 1%; text-align: center; padding-inline: 4px 10px; }
.lb-table .player-cell .s-av { width: 32px; height: 32px; font-size: .9rem; }
.pc-plats { display: flex; gap: 10px; }
.pc-plats span { display: inline-flex; align-items: center; gap: 4px; max-width: 140px; overflow: hidden; text-overflow: ellipsis; }
.pc-plats svg { width: 12px; height: 12px; opacity: .6; flex-shrink: 0; }
.lb-table td { height: 56px; }
.lb-modal-tiles { margin-bottom: 20px; }
.lb-modal-head { margin: 24px 0 10px; }
.lb-modal-head h2 { font: 700 1.2rem var(--f-display); text-transform: uppercase; letter-spacing: .03em; }
.lb-table th.num:first-child, .lb-table td.num:first-child { width: 1%; white-space: nowrap; }
@media (max-width: 1020px) {
.lb-filters { width: 100%; }
.lb-field { flex: 1 1 160px; }
}
@media (max-width: 720px) {
.lb-search { width: 100%; }
.pc-plats span:nth-child(n+2) { display: none; }
}
.mv-page > * + * { margin-top: 22px; }
.mv-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; align-items: start; }
.mv-card .mv-ic { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; font-size: 17px; }
.mv-card .card-title > .mv-ic { display: grid; }
.mv-card.is-up .mv-ic { color: var(--up); background: var(--up-a12); }
.mv-card.is-down .mv-ic { color: var(--down); background: var(--down-a12); }
.mv-ranks { white-space: nowrap; }
.mv-ranks .material-icons { font-size: 16px; color: var(--ink-4); margin: 0 2px; }
.mv-ranks b { color: var(--ink); }
.mv-move { display: inline-flex; align-items: center; height: 24px; padding: 0 8px; border-radius: var(--r-xs); border: 1px solid; font: 700 1rem/1 var(--f-display); font-variant-numeric: tabular-nums; }
.mv-move.up { color: var(--up); background: var(--up-a12); border-color: #3ddc8455; }
.mv-move.down { color: var(--down); background: var(--down-a12); border-color: #ff526355; }
.mv-sd { display: block; font-size: .72rem; line-height: 1.1; font-weight: 600; }
td .score { font: 700 1.1rem var(--f-display); color: var(--ink); font-variant-numeric: tabular-nums; }
.mv-league { display: flex; align-items: center; gap: 2px; }
.mv-league .material-icons { font-size: 14px; color: var(--ink-4); }
.mv-league b { color: var(--up); font-weight: 700; }
.mv-card.is-down .mv-league b { color: var(--down); }
.mv-datenav { display: flex; align-items: center; gap: 0; border-radius: var(--r-sm); background: #121217e6; border: 1px solid var(--line-3); overflow: hidden; }
.mv-nav-btn { width: 40px; height: 40px; display: grid; place-items: center; color: var(--ink-2); transition: background .15s, color .15s; }
.mv-nav-btn:hover { background: var(--acc); color: var(--acc-ink); }
.mv-nav-btn.is-disabled { opacity: .25; pointer-events: none; }
.mv-date { display: inline-flex; align-items: center; gap: 8px; padding: 0 14px; height: 40px; font-weight: 700; white-space: nowrap; border-inline: 1px solid var(--line-2); }
.mv-date .material-icons { font-size: 18px; color: var(--ink-3); }
#moversRoot.is-loading .mv-page { opacity: .5; transition: opacity .2s; }
@media (max-width: 1020px) {
.mv-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
.mv-datenav { width: 100%; justify-content: space-between; }
}
.tag-chip.club-big { height: 26px; line-height: 26px; padding: 0 10px; font-size: .9rem; }
.club-note { margin-top: 14px; max-width: 90ch; }
.bar-cell .bar-track { width: 90px; }
.club-banner::after {
  background:
    radial-gradient(460px 240px at 80px 60%, hsl(var(--club-h) 80% 55% / .2), transparent 70%),
    linear-gradient(90deg, var(--bg) 0%, #0e0e12b0 50%, #0e0e1266 100%);
}
.club-crest {
  position: relative; width: 104px; height: 116px; flex-shrink: 0; display: grid; place-items: center;
  clip-path: polygon(50% 0, 100% 14%, 100% 64%, 50% 100%, 0 64%, 0 14%);
  background: linear-gradient(160deg, hsl(var(--club-h) 70% 52%), hsl(calc(var(--club-h) + 40) 70% 30%));
  animation: emblemIn .7s var(--ease) both;
}
.club-crest::after { content: ''; position: absolute; inset: 3px; clip-path: inherit; background: linear-gradient(160deg, #ffffff22, transparent 50%); }
.club-crest span { position: relative; z-index: 1; font: 700 1.7rem/1 var(--f-display); letter-spacing: .04em; color: #fff; text-shadow: 0 2px 10px #0006; max-width: 90px; overflow: hidden; text-overflow: ellipsis; }
.club-page .club-note { margin: 10px 0 20px; }
.member-list { display: flex; flex-direction: column; max-height: 640px; overflow-y: auto; }
.member-chip { display: flex; flex-shrink: 0; align-items: center; gap: 10px; padding: 0 18px; height: 46px; background: var(--row); transition: background .12s; min-width: 0; }
.member-chip:nth-child(even) { background: var(--row-alt); }
.member-chip:hover { background: var(--row-hover); }
.member-chip .s-av { width: 28px; height: 28px; font-size: .85rem; background: hsl(var(--club-h, 340) 40% 22%); color: hsl(var(--club-h, 340) 80% 80%); }
.m-name { display: flex; align-items: baseline; min-width: 0; font-weight: 600; color: var(--ink-2); }
.member-chip:hover .pn-name { color: #fff; }
@media (max-width: 720px) {
.club-crest { width: 76px; height: 86px; }
.club-crest span { font-size: 1.2rem; }
}
.sa-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.sa-card { display: flex; flex-direction: column; gap: 16px; padding: 20px; overflow: hidden; box-shadow: inset 4px 0 0 var(--tier, var(--s4)); }
.sa-card::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(100deg, color-mix(in srgb, var(--tier, #ffffff) 14%, transparent), transparent 60%); }
.sa-card.is-live { grid-column: span 2; box-shadow: inset 4px 0 0 var(--acc); }
.sa-top { display: flex; align-items: center; justify-content: space-between; position: relative; }
.sa-name { font: 800 2rem/.95 var(--f-display); text-transform: uppercase; letter-spacing: .01em; }
.sa-card.is-live .sa-name { font-size: 2.8rem; }
.sa-champ { display: flex; align-items: center; gap: 14px; position: relative; }
.sa-champ-main { display: flex; flex-direction: column; min-width: 0; gap: 2px; }
.sa-champ-n { font-weight: 700; font-size: 1.05rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: color .15s; }
.sa-card:hover .sa-champ-n { color: var(--acc-hi); }
.sa-champ-s { color: var(--ink-3); font-size: .78rem; font-variant-numeric: tabular-nums; }
.sa-stats { display: flex; gap: 0; margin-top: auto; padding-top: 4px; position: relative; }
.sa-stats span { flex: 1; display: flex; flex-direction: column; color: var(--ink-2); font-size: .8rem; font-weight: 500; }
.sa-stats b { font: 700 1.3rem var(--f-display); color: var(--ink); font-variant-numeric: tabular-nums; }
.season-nav { display: flex; gap: 8px; }
.season-page > * + * { margin-top: 22px; }
.champion-card {
  display: flex; align-items: center; gap: 22px; padding: 22px 24px; overflow: hidden;
  background: linear-gradient(100deg, color-mix(in srgb, var(--tier, #e9aa13) 18%, var(--s1)), var(--s1) 55%);
}
.ch-body { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 0; }
.ch-name { display: flex; font: 800 2.8rem/.95 var(--f-display); }
.ch-name .pn-tag { font: 600 .9rem var(--f-ui); align-self: flex-end; margin: 0 0 4px 2px; }
.ch-sub { color: var(--ink-2); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ch-go { margin-left: auto; color: var(--ink-4); transition: color .2s, transform .25s var(--ease); }
.champion-card:hover .ch-go { color: #fff; transform: translateX(3px); }
.season-split { grid-template-columns: minmax(0, 1fr) 380px; }
.mode-card { overflow: hidden; }
.mc-head { display: flex; align-items: center; gap: 8px; padding: 0 18px; height: 46px; background: var(--band); }
.mc-head b { font: 700 1.05rem var(--f-display); text-transform: uppercase; letter-spacing: .03em; }
.mc-head .card-meta { margin-left: auto; }
.mc-head .material-icons { font-size: 18px; color: var(--ink-4); transition: color .15s, transform .2s var(--ease); }
.mc-head:hover .material-icons { color: #fff; transform: translateX(2px); }
.mode-card .li { min-height: 44px; }
.mode-card .li-value { font-size: 1rem; }
.mode-card .li-value small { font: 500 .7rem var(--f-ui); }
@media (max-width: 1020px) {
.sa-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.season-split { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
.sa-grid { grid-template-columns: minmax(0, 1fr); }
.sa-card.is-live { grid-column: auto; }
.champion-card { flex-wrap: wrap; gap: 14px; }
.ch-name { font-size: 1.8rem; }
}
.ranks-page > * + * { margin-top: 22px; }
.rk-strip { display: flex; height: 16px; border-radius: 4px; overflow: hidden; gap: 2px; }
.rk-seg { background: var(--tier); min-width: 4px; transform-origin: left; animation: growX .9s var(--ease) both; transition: filter .15s; }
.rk-seg:hover { filter: brightness(1.25); }
.rk-seg[data-tip]::after { bottom: calc(100% + 10px); }
.rk-strip-keys { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 12px; color: var(--ink-2); font-size: .8rem; font-weight: 600; }
.rk-strip-keys span { display: inline-flex; align-items: center; gap: 6px; }
.rk-strip-keys b { font-variant-numeric: tabular-nums; }
#ranksTiers { display: flex; flex-direction: column; gap: 14px; }
.rk-tier { display: grid; grid-template-columns: 230px minmax(0, 1fr); overflow: hidden; }
.rk-tier-head { display: flex; align-items: center; gap: 14px; padding: 18px; background: linear-gradient(90deg, color-mix(in srgb, var(--tier) 22%, var(--s1)), var(--s1)); box-shadow: inset 4px 0 0 var(--tier); }
.rk-tier-head h2 { font: 800 2rem/1 var(--f-display); text-transform: uppercase; color: var(--tier); }
.rk-tier-head b { color: var(--ink); }
.rk-divs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2px; background: var(--bg); }
.rk-tier:first-child .rk-divs { grid-template-columns: minmax(0, 1fr); }
.rk-div { position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 16px; background: var(--row); }
.rk-div img { width: 44px; height: 44px; object-fit: contain; filter: drop-shadow(0 4px 8px #0008); }
.rk-div.is-empty img { opacity: .45; filter: grayscale(.6); }
.rk-div-main { display: flex; flex-direction: column; min-width: 0; }
.rk-div-main b { font-weight: 700; }
.rk-div-main span { font-size: .72rem; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.rk-div-count { display: flex; flex-direction: column; align-items: flex-end; }
.rk-div-count b { font: 700 1.3rem var(--f-display); font-variant-numeric: tabular-nums; }
.rk-div-count span { font-size: .72rem; color: var(--ink-3); }
.rk-meter { grid-column: 1 / -1; height: 4px; }
@media (max-width: 1020px) {
.rk-tier { grid-template-columns: minmax(0, 1fr); }
.rk-divs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
.rk-divs { grid-template-columns: minmax(0, 1fr); }
}
.dir-search { margin-top: 22px; max-width: 760px; }
.gs-filter-toggle {
  position: relative; width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--r-xs);
  color: var(--ink-2); background: #2a2a33; transition: color .15s, background .15s;
}
.gs-filter-toggle:hover, .gs-filter-toggle[aria-expanded="true"] { color: #fff; background: #363640; }
.gs-filter-toggle.has-filters { color: #fff; background: var(--acc-a30); }
.gs-filter-count {
  position: absolute; top: -5px; right: -5px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px;
  background: var(--acc); color: var(--acc-ink); font-size: .6rem; font-weight: 700; display: grid; place-items: center;
}
.dir-filters {
  margin-top: 12px; max-width: 760px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; align-items: end; gap: 10px;
  padding: 16px; border-radius: var(--r-lg); background: #1b1b22f2; animation: popIn .18s var(--ease);
}
.dir-filters .input, .gs-input, .dir-filters .sel-btn { height: 38px; }
input.input[type="number"] { -moz-appearance: textfield; }
input.input[type="number"]::-webkit-inner-spin-button { opacity: .4; }
.player-cell > .s-av { width: 32px; height: 32px; font-size: .9rem; }
@media (max-width: 720px) {
.dir-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.gs-hero { text-align: left; }
.gs-searchwrap { position: relative; max-width: 760px; margin-top: 22px; }
.gs-searchwrap .omni { margin-top: 0; max-width: none; }
.gs-tabs { margin-top: 20px; }
.gs-pop {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: var(--z-pop); width: min(520px, 100%);
  border-radius: var(--r-lg); background: #1f1f27; box-shadow: var(--shadow-pop); overflow: hidden;
  opacity: 0; transform: translateY(-6px) scale(.98); pointer-events: none; visibility: hidden;
  transition: opacity .16s, transform .2s var(--ease), visibility 0s .2s;
}
.gs-pop.is-open { opacity: 1; transform: none; pointer-events: auto; visibility: visible; transition-delay: 0s; }
.gs-pop-head { display: flex; align-items: center; justify-content: space-between; padding: 0 16px; height: 48px; background: var(--band); }
.gs-pop-title { display: flex; align-items: center; gap: 8px; font: 700 1.05rem var(--f-display); text-transform: uppercase; letter-spacing: .03em; }
.gs-pop-title .material-icons { font-size: 18px; color: var(--ink-3); }
.gs-pop-head-actions { display: flex; gap: 4px; }
.gs-pop-reset, .gs-pop-close { display: inline-flex; align-items: center; gap: 4px; height: 28px; padding: 0 8px; border-radius: var(--r-xs); color: var(--ink-2); font-size: .75rem; font-weight: 700; }
.gs-pop-reset:hover, .gs-pop-close:hover { background: var(--s4); color: #fff; }
.gs-pop-reset .material-icons, .gs-pop-close .material-icons { font-size: 16px; }
.gs-pop-close { display: none; }
.gs-pop-body { padding: 16px; display: flex; flex-direction: column; gap: 16px; }
.gs-pop-foot { display: none; }
.gs-frow { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.gs-flabel { font-size: .75rem; font-weight: 600; color: var(--ink-3); }
.gs-frow-split { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 10px; }
.gs-fnote { display: flex; gap: 10px; color: var(--ink-2); font-size: .8125rem; line-height: 1.5; }
.gs-fnote .material-icons { color: var(--ink-3); }
.gs-leagues, .gs-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.gs-lg {
  width: 46px; height: 46px; display: grid; place-items: center; border-radius: var(--r-sm); background: #121217; border: 1px solid var(--line-3);
  transition: border-color .15s, background .15s, transform .15s var(--ease);
}
.gs-lg:hover { transform: translateY(-1px); border-color: #ffffff4d; }
.gs-lg.is-on { border-color: var(--hex, var(--acc)); background: color-mix(in srgb, var(--hex, var(--acc)) 18%, transparent); }
.gs-lg .rank-ic { width: 30px; height: 30px; }
.gs-lg-any { width: auto; padding: 0 12px; font-weight: 700; font-size: .78rem; color: var(--ink-2); }
.gs-pill {
  display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border-radius: var(--r-sm);
  background: #121217; border: 1px solid var(--line-3); color: var(--ink-2); font-size: .78rem; font-weight: 700;
  transition: border-color .15s, background .15s, color .15s;
}
.gs-pill .material-icons { font-size: 16px; }
.gs-pill svg { width: 14px; height: 14px; }
.gs-pill:hover { color: #fff; border-color: #ffffff4d; }
.gs-pill.is-on { color: #fff; border-color: var(--accent, var(--acc)); background: color-mix(in srgb, var(--accent, var(--acc)) 20%, transparent); }
.gs-pill-accent .material-icons { color: var(--accent); }
.gs-scope { display: flex; align-items: center; gap: 8px; padding: 0 18px; height: 42px; background: var(--band); color: var(--ink-2); font-size: .8rem; font-weight: 600; }
.gs-scope .material-icons { font-size: 16px; }
.gs-scope b { color: var(--ink); margin-left: auto; font-variant-numeric: tabular-nums; }
.gs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; padding: 16px; }
.gs-card {
  position: relative; display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: var(--r);
  background: var(--s3); transition: background .15s;
}
.gs-card:hover { background: var(--s4); }
.gs-card-tag { font: 700 1.6rem/1 var(--f-display); letter-spacing: .04em; }
.gs-card-meta { display: flex; gap: 12px; color: var(--ink-3); font-size: .78rem; }
.gs-card-meta span { display: inline-flex; align-items: center; gap: 4px; font-variant-numeric: tabular-nums; }
.gs-card-meta .material-icons { font-size: 15px; }
.gs-card-go { position: absolute; top: 14px; right: 14px; font-size: 20px; color: var(--ink-4); transition: color .15s, transform .2s var(--ease); }
.gs-card:hover .gs-card-go { color: #fff; transform: translateX(2px); }
.gs-feed { display: flex; flex-direction: column; }
.gs-ev { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 12px 18px; background: var(--row); animation: rise .4s var(--ease) both; }
.gs-ev:nth-child(even) { background: var(--row-alt); }
.gs-ev-ic { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: var(--accent); background: color-mix(in srgb, var(--accent) 16%, transparent); }
.gs-ev-ic .material-icons { font-size: 18px; }
.gs-ev-title { font: 700 .85rem var(--f-display); letter-spacing: .06em; text-transform: uppercase; color: var(--accent); }
.gs-ev-text { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; color: var(--ink-2); }
.gs-ev-player { font-weight: 700; color: var(--ink); }
.gs-ev-player:hover { color: var(--acc-hi); }
.gs-old { color: var(--ink-3); text-decoration: line-through; text-decoration-color: var(--ink-4); }
.gs-arrow { font-size: 16px; color: var(--ink-4); }
.gs-ev-meta { display: flex; align-items: center; gap: 6px; margin-top: 2px; font-size: .72rem; color: var(--ink-3); }
.gs-ev-league { display: inline-flex; align-items: center; gap: 4px; }
.gs-ev-time { font-size: .72rem; color: var(--ink-4); white-space: nowrap; }
.gs-tips { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.gs-tip { padding: 20px; }
.gs-tip .material-icons { font-size: 24px; color: var(--acc); margin-bottom: 12px; }
.gs-tip b { display: block; margin-bottom: 4px; font: 700 1.1rem var(--f-display); text-transform: uppercase; letter-spacing: .02em; }
.gs-tip p { color: var(--ink-3); font-size: .8125rem; line-height: 1.55; }
.gs-section .gs-scope { border-top: 0; }
@media (max-width: 1020px) {
.gs-tips { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
.gs-pop { position: fixed; inset: 0; width: auto; border-radius: 0; display: flex; flex-direction: column; }
.gs-pop-close { display: inline-flex; }
.gs-pop-body { flex: 1; overflow-y: auto; }
.gs-pop-foot { display: block; padding: 12px 14px; border-top: 1px solid var(--line); }
.gs-pop-done { width: 100%; }
.gs-frow-split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.gs-frow-split > :first-child { grid-column: 1 / -1; }
.gs-tips { grid-template-columns: minmax(0, 1fr); }
.gs-filters-open { overflow: hidden; }
}
.cmp-form { margin-top: 22px; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto; align-items: end; gap: 12px; }
.cmp-field { position: relative; display: flex; flex-direction: column; gap: 6px; }
.cmp-field label { font: 700 .9rem var(--f-display); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.cmp-field.is-a label { color: var(--acc-hi); }
.cmp-field.is-b label { color: var(--info); }
.cmp-field .input { height: 46px; background: #121217e6; }
.cmp-field.is-a .input:focus { border-color: var(--acc); }
.cmp-field.is-b .input:focus { border-color: var(--info); box-shadow: 0 0 0 3px #4aa8ff29; }
.cmp-vs {
  width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; position: relative; overflow: hidden;
  background: #2a2a33; font: 700 1.05rem var(--f-display);
}
.cmp-vs .material-icons { position: absolute; font-size: 20px; opacity: 0; transform: rotate(-90deg); transition: opacity .2s, transform .3s var(--ease); }
.cmp-vs span:first-child { transition: opacity .2s; }
.cmp-vs:hover span:first-child { opacity: 0; }
.cmp-vs:hover .material-icons { opacity: 1; transform: none; }
.cmp-heads { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: stretch; gap: 16px; margin-bottom: 16px; }
.cmp-player { display: flex; align-items: center; gap: 16px; padding: 20px; overflow: hidden; box-shadow: inset 4px 0 0 var(--acc); background: linear-gradient(100deg, #f5a6231f, var(--s1) 60%); }
.cmp-player.is-b { flex-direction: row-reverse; text-align: right; box-shadow: inset -4px 0 0 var(--info); background: linear-gradient(260deg, #4aa8ff1f, var(--s1) 60%); }
.cmp-id { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.cmp-player.is-b .cmp-id { align-items: flex-end; }
.cmp-id .chip { align-self: flex-start; }
.cmp-player.is-b .cmp-id .chip { align-self: flex-end; }
.cmp-name { display: flex; font: 800 2.3rem/.95 var(--f-display); min-width: 0; }
.cmp-name .pn-tag { font: 600 .85rem var(--f-ui); align-self: flex-end; margin-bottom: 3px; }
.cmp-sub { color: var(--ink-2); display: flex; align-items: center; gap: 6px; }
.cmp-score { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 0 8px; }
.cmp-score b { font: 700 2.8rem/1 var(--f-display); color: var(--ink-3); font-variant-numeric: tabular-nums; }
.cmp-score b.is-lead { color: var(--gold); }
.cmp-score span { font-size: .75rem; font-weight: 600; color: var(--ink-3); }
.cmp-table { overflow: hidden; }
.cmp-group { padding: 0 18px; height: 40px; display: grid; place-items: center; background: var(--band); font: 700 .95rem var(--f-display); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-2); }
.cmp-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 1.2fr) minmax(0, 1fr); align-items: center; gap: 16px; min-height: 56px; padding: 8px 18px; background: var(--row); }
.cmp-row:nth-child(odd) { background: var(--row-alt); }
.cmp-val { font: 700 1.3rem var(--f-display); font-variant-numeric: tabular-nums; color: var(--ink-2); display: flex; align-items: center; }
.cmp-val.lose { color: var(--ink-4); }
.cmp-val .league { font: 600 .875rem var(--f-ui); }
.cmp-val.is-b { justify-content: flex-end; }
.cmp-val.win { color: var(--ink); }
.cmp-val.is-a.win::before, .cmp-val.is-b.win::after { content: ''; width: 6px; height: 6px; border-radius: 50%; margin: 0 8px; background: var(--gold); box-shadow: 0 0 10px var(--gold); }
.cmp-val.is-b.win::after { order: 2; }
.cmp-mid { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.cmp-label { font-size: .8rem; color: var(--ink-2); font-weight: 600; }
.cmp-bar { display: flex; width: 100%; height: 6px; border-radius: 6px; overflow: hidden; gap: 2px; background: #ffffff0d; }
.cmp-bar i { display: block; height: 100%; transform-origin: center; animation: growX .9s var(--ease) both; }
.cmp-bar i.a { background: var(--acc); border-radius: 6px 0 0 6px; }
.cmp-bar i.b { background: var(--info); border-radius: 0 6px 6px 0; }
.cmp-bar.is-empty { background: repeating-linear-gradient(90deg, #ffffff0d 0 6px, transparent 6px 10px); }
@media (max-width: 1020px) {
.cmp-form { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
.cmp-form .btn { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
.cmp-form { grid-template-columns: minmax(0, 1fr); }
.cmp-vs { justify-self: center; }
.cmp-heads { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.cmp-score { grid-column: 1 / -1; grid-row: 2; flex-direction: row; gap: 12px; }
.cmp-player, .cmp-player.is-b { flex-direction: column; text-align: center; }
.cmp-player .cmp-id, .cmp-player.is-b .cmp-id { align-items: center; }
.cmp-name { font-size: 1.4rem; }
.cmp-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1fr); gap: 8px; padding: 8px 12px; }
.cmp-val { font-size: 1.05rem; }
.cmp-player .pc-plats { display: none; }
}
.wb { display: flex; flex-direction: column; gap: 22px; }
.wb-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr); gap: 22px; align-items: start; }
.wb-panel, .wb-out { background: var(--s1); border-radius: var(--r-lg); overflow: hidden; }
.wb-tabs { display: flex; gap: 0; padding: 0 8px; background: #24242d; overflow-x: auto; scrollbar-width: none; }
.wb-tab {
  position: relative; display: inline-flex; align-items: center; gap: 7px; height: 50px; padding: 0 14px;
  color: var(--ink-2); font-weight: 600; font-size: .875rem; white-space: nowrap; transition: color .15s;
}
.wb-tab .material-icons { font-size: 18px; }
.wb-tab:hover { color: #fff; }
.wb-tab.is-on { color: #fff; }
.wb-tab.is-on::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--acc); animation: tabIn .25s var(--ease); }
.wb-pane, .wb-outpane { display: none; padding: 18px; flex-direction: column; gap: 8px; }
.wb-pane.is-on, .wb-outpane.is-on { display: flex; animation: fadeIn .2s; }
.wb-l { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; font-size: .8rem; font-weight: 700; color: var(--ink-2); }
.wb-l:first-child { margin-top: 0; }
.wb-v { font: 600 .75rem var(--f-mono); color: var(--ink-2); }
.wb-hint { color: var(--ink-3); font-size: .78rem; line-height: 1.55; }
.wb-search { position: relative; }
.wb-choices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.wb-choice {
  display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 12px; border-radius: var(--r-sm);
  background: #121217; border: 1px solid var(--line-3); color: var(--ink-2); font-weight: 700; font-size: .8125rem; text-align: left;
  transition: border-color .15s, background .15s, color .15s;
}
.wb-choice .material-icons { font-size: 22px; margin-bottom: 6px; color: var(--ink-3); }
.wb-choice small { font-weight: 500; font-size: .7rem; color: var(--ink-4); }
.wb-choice:hover { border-color: #ffffff4d; color: #fff; }
.wb-choice.is-on { border-color: var(--acc); background: var(--acc-a16); color: #fff; }
.wb-choice.is-on .material-icons { color: var(--acc); }
.wb-choices-2 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.wb-choices-2 .wb-choice { flex-direction: row; align-items: center; justify-content: center; gap: 6px; padding: 9px; }
.wb-choices-2 .wb-choice .material-icons { margin: 0; }
.wb-checks { display: flex; flex-direction: column; gap: 2px; }
.wb-check { display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: var(--r-xs); cursor: pointer; color: var(--ink-2); font-weight: 500; transition: background .12s; }
.wb-check:hover { background: var(--s3); }
.wb-check input { appearance: none; width: 18px; height: 18px; border-radius: 4px; border: 1.5px solid #ffffff4d; display: grid; place-items: center; transition: background .15s, border-color .15s; }
.wb-check input:checked { background: var(--acc); border-color: var(--acc); }
.wb-check input:checked::after { content: ''; width: 9px; height: 5px; border: 2px solid #fff; border-top: 0; border-right: 0; transform: rotate(-45deg) translate(1px, -1px); }
.wb-swatches { display: flex; flex-wrap: wrap; gap: 8px; }
.wb-swatches button { width: 30px; height: 30px; border-radius: 6px; border: 2px solid transparent; box-shadow: inset 0 0 0 1px #ffffff22; transition: transform .15s var(--ease), border-color .15s; }
.wb-swatches button:hover { transform: translateY(-2px); }
.wb-swatches button.is-on { border-color: #fff; }
.wb-color { display: flex; gap: 8px; }
.wb-color input[type="color"] { width: 46px; height: 40px; padding: 3px; border-radius: var(--r-sm); background: #121217; border: 1px solid var(--line-3); cursor: pointer; }
.wb-color .input { font-family: var(--f-mono); }
.wb-out textarea { min-height: 96px; }
.wb-row { display: flex; gap: 8px; }
.wb-outpane .btn { align-self: flex-start; }
.wb-stagewrap { background: var(--s1); border-radius: var(--r-lg); overflow: hidden; }
.wb-preview-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 18px; min-height: 52px; background: #24242d; }
.wb-zoom { margin-left: 6px; padding: 1px 6px; border-radius: var(--r-xs); background: var(--s4); color: var(--ink-2); font-size: .7rem; }
.wb-canvas-toggle button.is-on { background: var(--acc); color: var(--acc-ink); }
.wb-stage { position: relative; min-height: 320px; display: grid; place-items: center; padding: 32px; overflow: hidden; transition: background .2s; }
.wb-stage[data-canvas="dark"] { background: radial-gradient(circle at 50% 40%, #1b1b22, var(--bg)); }
.wb-stage[data-canvas="light"] { background: #e9eaee; }
.wb-stage[data-canvas="checker"] { background: repeating-conic-gradient(#2a2a31 0 25%, #1d1d23 0 50%) 0 0 / 20px 20px; }
.wb-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--ink-3); }
.wb-empty::before { content: ''; display: inline-block; width: 1em; height: 1em; margin: auto; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 256 256%22%3E%3Cpath d=%22M100,36H56A20,20,0,0,0,36,56v44a20,20,0,0,0,20,20h44a20,20,0,0,0,20-20V56A20,20,0,0,0,100,36ZM96,96H60V60H96ZM200,36H156a20,20,0,0,0-20,20v44a20,20,0,0,0,20,20h44a20,20,0,0,0,20-20V56A20,20,0,0,0,200,36Zm-4,60H160V60h36Zm-96,40H56a20,20,0,0,0-20,20v44a20,20,0,0,0,20,20h44a20,20,0,0,0,20-20V156A20,20,0,0,0,100,136Zm-4,60H60V160H96Zm104-60H156a20,20,0,0,0-20,20v44a20,20,0,0,0,20,20h44a20,20,0,0,0,20-20V156A20,20,0,0,0,200,136Zm-4,60H160V160h36Z%22/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 256 256%22%3E%3Cpath d=%22M100,36H56A20,20,0,0,0,36,56v44a20,20,0,0,0,20,20h44a20,20,0,0,0,20-20V56A20,20,0,0,0,100,36ZM96,96H60V60H96ZM200,36H156a20,20,0,0,0-20,20v44a20,20,0,0,0,20,20h44a20,20,0,0,0,20-20V56A20,20,0,0,0,200,36Zm-4,60H160V60h36Zm-96,40H56a20,20,0,0,0-20,20v44a20,20,0,0,0,20,20h44a20,20,0,0,0,20-20V156A20,20,0,0,0,100,136Zm-4,60H60V160H96Zm104-60H156a20,20,0,0,0-20,20v44a20,20,0,0,0,20,20h44a20,20,0,0,0,20-20V156A20,20,0,0,0,200,136Zm-4,60H160V160h36Z%22/%3E%3C/svg%3E") center / contain no-repeat;  font-size: 36px; color: var(--ink-4); }
.wb-frame iframe { border: 0; display: block; }
.wb-foot { max-width: 100ch; margin-top: 16px; }
.is-disabled { opacity: .4; pointer-events: none; }
@media (max-width: 1020px) {
.wb-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
.wb-choices { grid-template-columns: minmax(0, 1fr); }
.wb-stage { padding: 16px; }
}
.prose { padding: 28px 32px; color: var(--ink-2); font-size: .9375rem; line-height: 1.75; }
.prose-narrow { max-width: 860px; }
.prose > * + * { margin-top: 14px; }
.prose h2 { margin-top: 30px; font: 700 1.5rem var(--f-display); text-transform: uppercase; letter-spacing: .02em; color: var(--ink); scroll-margin-top: calc(var(--bar-h) + 20px); }
.prose a { color: var(--acc-hi); text-decoration: underline; text-decoration-color: var(--acc-a30); text-underline-offset: 3px; }
.prose a:hover { text-decoration-color: currentColor; }
.prose-dl { display: grid; gap: 0; border-radius: var(--r); overflow: hidden; }
.prose-dl > div { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 16px; padding: 12px 16px; background: var(--row); }
.prose-dl > div:nth-child(even) { background: var(--row-alt); }
.prose-dl dt { font-weight: 700; color: var(--ink); }
.prose-dl dd { line-height: 1.6; }
.prose-toc { display: flex; flex-direction: column; padding: 8px; }
.prose-toc a { padding: 9px 10px; border-radius: var(--r-xs); color: var(--ink-2); font-weight: 600; transition: background .12s, color .12s; }
.prose-toc a:hover { background: var(--s3); color: #fff; }
.prose-split { grid-template-columns: minmax(0, 1fr) 300px; }
@media (max-width: 720px) {
.prose { padding: 20px; }
.prose-dl > div { grid-template-columns: minmax(0, 1fr); gap: 4px; }
}
.nf { position: relative; isolation: isolate; overflow: hidden; min-height: calc(100vh - var(--bar-h) - var(--net-h) - 180px); display: grid; align-items: center; }
.nf-art { position: absolute; inset: 0; z-index: -1; background: radial-gradient(600px 300px at 70% 50%, #f5a62326, transparent 70%); }
.nf-inner { padding-block: 64px; }
.nf-code { display: block; font: 800 clamp(7rem, 20vw, 13rem)/.8 var(--f-display); color: transparent; -webkit-text-stroke: 2px var(--acc); opacity: .9; animation: rise .6s var(--ease) both; }
.nf h1 { margin-top: 18px; font-size: clamp(2.4rem, 5vw, 3.6rem); }
.nf p { margin-top: 10px; max-width: 52ch; color: var(--ink-2); font-size: 1rem; }
.nf-actions { margin-top: 26px; display: flex; gap: 10px; flex-wrap: wrap; }
.sticky { position: sticky; }
@media (max-width: 1020px) {
.prose-split { grid-template-columns: minmax(0, 1fr); }
.prose-split > aside { display: none; }
}
@media (max-width: 720px) {
.card-head { flex-wrap: wrap; }
.card-title { flex-wrap: wrap; row-gap: 2px; }
.lb-table-card .card-head .lb-search, .card-head > .lb-search { flex: 1 1 100%; }
}
.search-banner, .it-banner { overflow: visible; z-index: 5; }
.search-banner::before, .it-banner::before { transform: none; }
.page > .panel > h2, .page > .panel > h1 { font: 700 1.8rem/1.05 var(--f-display); text-transform: uppercase; letter-spacing: .01em; margin-bottom: 12px; }
.page > .panel > h3 { margin: 22px 0 10px; font: 700 1rem var(--f-display); letter-spacing: .04em; text-transform: uppercase; color: var(--ink-2); }
.page > .panel > ul { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; }
.page > .panel > ul > li { display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 10px; border-radius: var(--r-xs); background: var(--s3); color: var(--ink-2); font-size: .8125rem; }
.page > .panel > .lb-table, .page > .panel > table { margin-top: 8px; border-radius: var(--r); overflow: hidden; }
.page > .panel td:nth-child(2), #lbGrid > table td:nth-child(2) { color: var(--ink); font-weight: 700; }
.search-pop[popover] { border: 0; color: inherit; overflow-x: hidden; }
.search-pop[popover]::backdrop { display: none; }
.search-pop.is-floating { right: auto; bottom: auto; }
.search-item:focus, .search-item:focus-visible { outline: none; }
.home-grid > .home-side { align-self: stretch; }
.home-side > .card:last-child { flex: 1; display: flex; flex-direction: column; }
.home-side > .card:last-child > .list { flex: 1; display: flex; flex-direction: column; background: var(--row); border-radius: 0 0 var(--r-lg) var(--r-lg); }
.home-side > .card:last-child > .list > .li { flex: 1; }
@media (max-width: 720px) {
td:has(> .player-cell) { width: 100%; max-width: 0; }
.player-cell, .player-cell .pc-main { min-width: 0; }
.player-cell .pc-main { overflow: hidden; }
.player-cell .pc-sub, .pc-plats span { white-space: nowrap; }
.lb-table td, .lb-table th { padding-inline: 8px; }
.lb-table td.rank-cell { padding-right: 2px; }
.no1 { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; grid-template-areas: "av name val" "av label val"; align-items: center; column-gap: 12px; row-gap: 2px; padding: 14px 16px; }
.no1-av { grid-area: av; width: 44px; height: 44px; margin: 0; }
.no1-av .rank-ic { width: 36px; height: 36px; }
.no1-name { grid-area: name; font-size: 1.15rem; }
.no1-label { grid-area: label; }
.no1-val { grid-area: val; font-size: 1.7rem; }
.no1-badge { top: 0; height: 22px; padding: 0 8px 0 12px; font-size: 1rem; }
.cmp-player .cmp-id { width: 100%; min-width: 0; }
.cmp-name { justify-content: center; max-width: 100%; font-size: 1.35rem; }
.cmp-name .pn-name { min-width: 0; }
.cmp-name .pn-tag { display: none; }
}
@media (max-width: 1100px) {
.pl-page[data-pane]:not([data-pane="overview"]) .pl-sidebar { display: none; }
}
@media (max-width: 720px) {
.wb-preview-head { flex-wrap: wrap; padding-block: 12px; gap: 10px; }
.wb-preview-head .seg { width: 100%; }
.wb-preview-head .seg button { flex: 1 1 0; }
}
#app { display: block; width: 100%; }
#content > .banner, #main-content > .banner { margin-inline: 0; }
#content > *:not(.banner):not(.wrap):not(.home-hero):not(.home-main):not(script):not(.site-alert):not(.bleed), #main-content > *:not(.banner):not(.wrap):not(.home-hero):not(.home-main):not(script):not(.site-alert):not(.bleed) {
  width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gut);
}
#navbar { display: block; min-height: var(--nav-h); }
#content:empty, #main-content:empty { display: block; min-height: calc(100vh - var(--nav-h)); }
#footer { display: block; min-height: 300px; }
@media (max-width: 720px) {
#footer { min-height: 520px; }
}
#content > #home-alert-slot, #main-content > #home-alert-slot, #home-alert-slot { max-width: none; padding-inline: 0; }
#nav-notifications { position: relative; }
.foot-links { display: flex; flex-wrap: wrap; gap: 8px; }
.s-av-img { overflow: hidden; }
.s-av-img img { width: 100%; height: 100%; object-fit: cover; }
.plat { display: inline-flex; align-items: center; gap: 6px; color: var(--ink-3); }
.plat .material-icons { font-size: 17px; }
.plat.is-pc { color: var(--pc); }
.plat.is-xbl { color: var(--xbl); }
.plat.is-psn { color: var(--psn); }
.plat.is-steam { color: #66c0f4; }
.plat-pick { display: inline-flex; gap: 4px; padding: 4px; border-radius: var(--r); background: var(--s1); }
.plat-btn {
  position: relative; width: 42px; height: 42px; display: grid; place-items: center; border-radius: var(--r-sm);
  background: #ffffff05; border: 1px solid var(--line); color: var(--ink-3);
  transition: color .15s, background .15s, border-color .15s, box-shadow .15s, transform .15s var(--ease);
}
.plat-btn .material-icons { font-size: 21px; }
.plat-btn svg { width: 21px; height: 21px; }
.plat svg { width: 17px; height: 17px; }
.pop-ic svg { width: 19px; height: 19px; }
.plat-btn:hover { color: var(--ink); transform: translateY(-1px); }
.plat-btn[aria-pressed="true"] { color: #fff; transform: none; }
.plat-btn[data-platform="uplay"]:hover { border-color: var(--pc); color: var(--pc); }
.plat-btn[data-platform="xbl"]:hover { border-color: var(--xbl); color: var(--xbl); }
.plat-btn[data-platform="psn"]:hover { border-color: var(--psn); color: var(--psn); }
.plat-btn[data-platform="uplay"][aria-pressed="true"] { background: var(--pc); border-color: var(--pc); box-shadow: 0 0 0 3px var(--pc-a20); }
.plat-btn[data-platform="xbl"][aria-pressed="true"] { background: var(--xbl); border-color: var(--xbl); box-shadow: 0 0 0 3px var(--xbl-a20); }
.plat-btn[data-platform="psn"][aria-pressed="true"] { background: var(--psn); border-color: var(--psn); box-shadow: 0 0 0 3px var(--psn-a20); }
@media (max-width: 720px) {
.plat-btn { width: 38px; height: 38px; }
}
.banner-ic { display: none !important; }
.banner-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cat-bar {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 12px 16px; border-radius: var(--r-lg); background: var(--s1);
}
.cat-body { margin-top: 20px; }
.page > * + * { margin-top: 20px; }
.page > .cat-bar + .cat-body { margin-top: 20px; }
.cat-bar .input-icon { flex: 1 1 260px; min-width: 200px; }
.cat-bar .sel { min-width: 170px; }
.cat-count { margin-left: auto; color: var(--ink-3); font-size: .75rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cat-count b { color: var(--ink); }
.ent-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.ent-grid.is-wide { grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); }
.ent {
  position: relative; display: flex; flex-direction: column; gap: 14px; padding: 18px; text-align: left;
  background: var(--s1); border-radius: var(--r-lg); overflow: hidden;
  transition: border-color .2s, background .2s, transform .25s var(--ease), box-shadow .25s var(--ease);
}
.ent:hover { transform: translateY(-2px); box-shadow: 0 18px 40px -28px #000; }
.ent::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; background: var(--side, transparent);
  opacity: .8; transition: width .2s var(--ease);
}
.ent:hover { border-color: var(--line-3); background: var(--s2); }
.ent:hover::before { width: 3px; }
.ent:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.ent-head { display: flex; align-items: center; gap: 12px; min-width: 0; }
.ent-ic {
  width: 46px; height: 46px; flex-shrink: 0; object-fit: contain; border-radius: var(--r-sm);
  background: #ffffff06; padding: 4px;
}
.ent-ic-lg { width: 64px; height: 64px; }
.ent-ic-ph { display: grid; place-items: center; color: var(--ink-4); }
.ent-id { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ent-name { font: 700 1.05rem/1.1 var(--f-display); letter-spacing: .01em; text-transform: uppercase; color: var(--ink); overflow-wrap: anywhere; }
.ent-sub { color: var(--ink-3); font-size: .75rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ent-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; }
.ent-stats { display: flex; gap: 0; border-top: 1px solid var(--line); padding-top: 12px; }
.ent-stats > span { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; font: 700 .75rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.ent-stats b { font: 700 1.05rem/1 var(--f-display); color: var(--ink); letter-spacing: 0; font-variant-numeric: tabular-nums; }
.ent-media { margin: -18px -18px 0; aspect-ratio: 16 / 9; overflow: hidden; background: var(--s2); }
.ent-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s var(--ease); }
.ent:hover .ent-media img { transform: scale(1.04); }
.ent-go { position: absolute; top: 14px; right: 14px; font-size: 18px; color: var(--ink-4); transition: color .2s, transform .2s var(--ease); }
.ent:hover .ent-go { color: var(--ink); transform: translate(2px, -2px); }
.ent.is-atk { --side: var(--atk); }
.ent.is-def { --side: var(--def); }
.spec-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border-radius: var(--r); overflow: hidden; background: var(--row); }
.spec-row { display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-bottom: 1px solid var(--line); min-width: 0; }
.spec-row:nth-child(odd) { border-right: 1px solid var(--line); }
.spec-row:nth-last-child(-n+2) { border-bottom: 0; }
.spec-row .material-icons { font-size: 17px; color: var(--ink-4); }
.spec-l { font: 700 .8rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.spec-v { margin-left: auto; font-weight: 600; color: var(--ink); text-align: right; min-width: 0; overflow-wrap: anywhere; }
.spec-v small { color: var(--ink-3); font-weight: 500; }
.spec-block { margin-top: 16px; }
.spec-block-l { display: block; margin-bottom: 8px; font: 700 .8rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.spec-media { margin-bottom: 16px; border-radius: var(--r); overflow: hidden; background: var(--s2); }
.spec-media img { width: 100%; display: block; }
@media (max-width: 620px) {
.spec-grid { grid-template-columns: minmax(0, 1fr); }
.spec-row:nth-child(odd) { border-right: 0; }
.spec-row:nth-last-child(2) { border-bottom: 1px solid var(--line); }
}
.chart-card .card-body { padding: 14px 16px 16px; }
.chart-plot { position: relative; height: 260px; }
.chart-plot.is-tall { height: 340px; }
.chart-plot.is-short { height: 180px; }
.chart-plot canvas { position: absolute; inset: 0; width: 100% !important; height: 100% !important; }
.chart-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 12px; color: var(--ink-3); font-size: .75rem; }
.chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.chart-legend i { width: 9px; height: 9px; border-radius: 2px; background: var(--acc); }
.search-pop-head {
  display: flex; align-items: center; gap: 8px; padding: 9px 10px 7px;
  font: 700 .8rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3);
}
.search-pop-head .material-icons { font-size: 15px; }
.search-item .s-del {
  width: 26px; height: 26px; display: grid; place-items: center; border-radius: var(--r-sm);
  color: var(--ink-4); opacity: 0; transition: opacity .12s, color .12s, background .12s;
}
.search-item .s-del .material-icons { font-size: 16px; }
.search-item:hover .s-del { opacity: 1; }
.search-item .s-del:hover { color: var(--down); background: var(--down-a12); }
.site-alert { border-bottom: 1px solid var(--acc-a16); background: var(--acc-a08); }
.site-alert:not(.is-static) { animation: alertIn .32s var(--ease) both; }
@keyframes alertIn { from { opacity: 0; transform: translateY(-100%); } }
.site-alert-inner { display: flex; align-items: center; gap: 12px; padding-block: 10px; }
.site-alert-inner > .material-icons { font-size: 19px; color: var(--acc-hi); }
.site-alert-text { flex: 1; min-width: 0; color: var(--ink); font-size: .8125rem; }
.site-alert-close { margin-left: auto; }
.notice {
  display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border-radius: var(--r);
  background: var(--s2); color: var(--ink-2); font-size: .8125rem; line-height: 1.5;
}
.notice .material-icons { font-size: 18px; color: var(--ink-3); flex-shrink: 0; }
.notice.is-ok { background: var(--up-a12); border-color: #36d67f33; color: var(--up); }
.notice.is-ok .material-icons { color: var(--up); }
.notice.is-bad { background: var(--down-a12); border-color: #ff6b5733; color: var(--down); }
.notice.is-bad .material-icons { color: var(--down); }
.notice.is-warn { background: var(--gold-a12); border-color: #ffc82e33; color: var(--gold); }
.notice.is-warn .material-icons { color: var(--gold); }
.contact-title { font: 800 1.9rem/1.05 var(--f-display); text-transform: uppercase; margin: 10px 0 10px; }
.r6-status-summary-state { display: flex; align-items: center; gap: 14px; }
.r6-status-summary-icon { font-size: 30px !important; color: var(--ink-3); }
.r6-status-summary-copy { flex: 1; min-width: 0; }
.r6-status-summary-title { font: 700 1.3rem/1.1 var(--f-display); text-transform: uppercase; letter-spacing: .01em; }
.r6-status-summary-subtitle { margin-top: 3px; color: var(--ink-3); font-size: .8125rem; }
.r6-status-summary-state.is-ok .r6-status-summary-icon { color: var(--up); }
.r6-status-summary-state.is-warn .r6-status-summary-icon { color: var(--gold); }
.r6-status-summary-state.is-down .r6-status-summary-icon { color: var(--down); }
.r6-status-report-foot { justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.r6-status-range-btn { display: inline-flex; align-items: center; height: 28px; padding: 0 10px; border-radius: 7px;
  color: var(--ink-3); font-weight: 600; font-size: .75rem; transition: background .15s, color .15s; }
.r6-status-range-btn:hover { color: var(--ink); }
.r6-status-range-btn.active, .r6-status-range-btn.is-on { background: var(--s4); color: var(--ink); box-shadow: 0 1px 0 #ffffff0d inset, 0 1px 2px #0006; }
.r6-status-chart-canvas-wrap { position: relative; height: 280px; }
.r6-status-chart-canvas-wrap canvas { position: absolute; inset: 0; width: 100% !important; height: 100% !important; }
.r6-status-chart-card { position: relative; }
.r6-status-tooltip {
  position: absolute; z-index: var(--z-pop); max-width: 260px; padding: 9px 11px; border-radius: var(--r-sm);
  background: #26262f; box-shadow: var(--shadow-pop); color: var(--ink); font-size: .75rem; line-height: 1.45;
  opacity: 0; visibility: hidden; transition: opacity .12s; pointer-events: none;
}
.r6-status-tooltip.visible { opacity: 1; visibility: visible; }
.r6-status-tooltip-title { font-weight: 600; margin-bottom: 3px; }
.r6-status-tooltip-line { color: var(--ink-2); }
.r6-status-tooltip-body { margin-top: 4px; color: var(--ink-3); }
.r6-status-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.r6-status-card { background: var(--s1); border-radius: var(--r-lg); overflow: hidden; }
.r6-status-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 16px; border-bottom: 1px solid var(--line); }
.r6-status-card-title { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: .875rem; }
.r6-status-card-title .material-icons { font-size: 18px; color: var(--ink-3); }
.r6-status-chip { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 8px; border-radius: var(--r-xs);
  font-size: .6875rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  background: var(--s3); color: var(--ink-2); }
.r6-status-chip.ok, .r6-status-chip.operational { background: var(--up-a12); color: var(--up); }
.r6-status-chip.warn, .r6-status-chip.degraded { background: var(--gold-a12); color: var(--gold); }
.r6-status-chip.down, .r6-status-chip.outage { background: var(--down-a12); color: var(--down); }
.r6-status-services { padding: 4px 0; }
.r6-status-service-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 16px; font-size: .8125rem; }
.r6-status-service-row + .r6-status-service-row { border-top: 1px solid var(--line); }
.r6-status-service-name { color: var(--ink-2); }
.r6-status-service-status, .r6-status-service-value { font-weight: 600; color: var(--ink-3); }
.r6-status-service-status.ok, .r6-status-service-status.operational { color: var(--up); }
.r6-status-service-status.warn, .r6-status-service-status.degraded { color: var(--gold); }
.r6-status-service-status.down, .r6-status-service-status.outage { color: var(--down); }
.r6-status-modal { position: fixed; inset: 0; z-index: var(--z-modal); display: grid; place-items: center; padding: 24px;
  opacity: 0; visibility: hidden; transition: opacity .16s; }
.r6-status-modal.visible { opacity: 1; visibility: visible; }
.r6-status-modal-backdrop { position: absolute; inset: 0; background: #000b; backdrop-filter: blur(4px); }
.r6-status-modal-card { position: relative; width: min(520px, 100%); box-shadow: var(--shadow-pop); }
.r6-status-modal-consent { display: flex; gap: 10px; align-items: flex-start; color: var(--ink-2); font-size: .8125rem; line-height: 1.5; }
.r6-status-modal-consent input { margin-top: 2px; accent-color: var(--acc); }
.r6-status-modal-actions { justify-content: flex-end; gap: 8px; }
.auth-main { display: flex; align-items: center; justify-content: center; padding: 48px 16px 72px; min-height: calc(100vh - 220px); }
.auth-header { max-width: var(--maxw); margin-inline: auto; padding: 20px var(--gut) 0; }
.auth-container { width: 100%; max-width: 420px; }
.auth-card {
  position: relative; padding: 28px; border-radius: var(--r-lg); background: var(--s1);
  box-shadow: 0 30px 80px -50px #000;
}
.auth-card::before {
  content: ''; position: absolute; left: 28px; right: 28px; top: 0; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, transparent, var(--acc), transparent); opacity: .7;
}
.auth-title { margin-bottom: 20px; font: 800 1.9rem/1 var(--f-display); text-transform: uppercase; letter-spacing: .01em; text-align: center; }
.auth-form .form-group + .form-group { margin-top: 16px; }
.form-label { display: block; margin-bottom: 6px; font: 700 .8rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.auth-submit { width: 100%; margin-top: 20px; }
.auth-footer { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); text-align: center; color: var(--ink-3); font-size: .8125rem; }
.auth-link { color: var(--acc-hi); font-weight: 500; }
.auth-link:hover { color: var(--acc); text-decoration: underline; }
.auth-form .notice { margin-bottom: 16px; }
.spinner {
  width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--line-3); border-top-color: var(--acc);
  animation: spin .8s linear infinite; display: inline-block; vertical-align: middle;
}
.forum-shell { width: 100%; max-width: var(--maxw); margin-inline: auto; padding: 24px var(--gut) 72px; }
.forum-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 24px; align-items: start; }
.forum-sidebar { position: sticky; top: calc(var(--nav-h) + 16px); display: flex; flex-direction: column; }
.sidebar-section-title { margin-bottom: 8px; font: 700 .8rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.category-nav { list-style: none; display: flex; flex-direction: column; gap: 1px; }
.category-nav-link {
  display: flex; align-items: center; gap: 9px; padding: 8px 10px; border-radius: var(--r-sm);
  color: var(--ink-2); font-size: .8125rem; font-weight: 500; transition: background .12s, color .12s;
}
.category-nav-link:hover { background: var(--s2); color: var(--ink); }
.category-nav-link.active { background: var(--s2); color: var(--ink); box-shadow: none; }
.category-nav-link svg { width: 14px; height: 14px; color: var(--ink-4); }
.cat-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.cat-count { margin-left: auto; color: var(--ink-4); font-size: .72rem; font-variant-numeric: tabular-nums; }
.btn-new-topic {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 36px; padding: 0 14px;
  border-radius: var(--r); background: var(--acc); color: var(--acc-ink); font-weight: 600; font-size: .8125rem;
  transition: background .15s, box-shadow .15s;
}
.btn-new-topic:hover { background: var(--acc-hi); box-shadow: 0 8px 24px -8px var(--acc-a30); }
.btn-new-topic svg { width: 16px; height: 16px; }
.forum-breadcrumb { display: flex; align-items: center; gap: 6px; margin-bottom: 14px; color: var(--ink-3); font-size: .75rem; font-weight: 500; }
.forum-breadcrumb a:hover { color: var(--ink); }
.forum-breadcrumb .sep { color: var(--ink-4); }
.forum-page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.forum-page-title { font: 800 clamp(1.8rem, 3vw, 2.4rem)/1 var(--f-display); text-transform: uppercase; letter-spacing: -.005em; }
.forum-page-subtitle { margin-top: 8px; color: var(--ink-2); font-size: .875rem; }
.topic-list-header, .topic-row {
  display: grid; grid-template-columns: minmax(0, 1fr) 84px 84px 108px; align-items: center; gap: 12px;
}
.topic-list-header {
  padding: 0 16px 8px; font: 700 .8rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3);
}
#topicList { border-radius: var(--r-lg); background: var(--s1); overflow: hidden; }
.topic-row { padding: 13px 16px; border-bottom: 1px solid var(--line); transition: background .12s; }
.topic-row:last-child { border-bottom: 0; }
.topic-row:hover { background: #ffffff05; }
.topic-row:focus-visible { outline: none; background: #ffffff0d; }
.topic-row-main { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.topic-title-link { font-weight: 600; color: var(--ink); line-height: 1.35; }
.topic-row:hover .topic-title-link { color: var(--acc-hi); }
.topic-meta-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; color: var(--ink-3); font-size: .75rem; }
.topic-author-name { color: var(--ink-3); }
.topic-author-name a:hover { color: var(--ink); }
.avatar-xs, .avatar-sm {
  display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; overflow: hidden;
  font: 700 .62rem var(--f-ui); color: #0d0d10; flex-shrink: 0;
}
.avatar-sm { width: 34px; height: 34px; font-size: .85rem; }
.avatar-xs img, .avatar-sm img { width: 100%; height: 100%; object-fit: cover; }
.category-badge, .support-badge {
  display: inline-flex; align-items: center; gap: 5px; height: 20px; padding: 0 7px; border-radius: var(--r-xs);
  background: var(--s3); color: var(--ink-2); font-size: .6875rem; font-weight: 600;
}
.stat-cell { display: flex; flex-direction: column; align-items: center; gap: 1px; font: 700 1rem var(--f-display); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.stat-cell .stat-label { font: 500 .625rem var(--f-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-4); }
.activity-cell { text-align: center; color: var(--ink-3); font-size: .75rem; }
.skeleton-row { height: 66px; margin: 0; border-bottom: 1px solid var(--line); border-radius: 0; }
.forum-empty { padding: 48px 24px; text-align: center; color: var(--ink-3); }
.forum-pagination { display: flex; justify-content: center; gap: 6px; margin-top: 18px; }
.page-btn {
  display: inline-grid; place-items: center; min-width: 34px; height: 34px; padding: 0 9px; border-radius: var(--r-sm);
  background: var(--s1); color: var(--ink-2); font-size: .8125rem; font-weight: 600;
}
.page-btn:hover { background: var(--s2); color: var(--ink); }
.page-btn.active { background: var(--acc); border-color: transparent; color: var(--acc-ink); }
.post-card { background: var(--s1); border-radius: var(--r-lg); padding: 18px; }
.post-card + .post-card { margin-top: 14px; }
.post-author-name { font-weight: 600; color: var(--ink); }
.post-body { margin-top: 12px; color: var(--ink-2); font-size: .875rem; line-height: 1.65; overflow-wrap: anywhere; }
.post-body a, .auto-link { color: var(--acc-hi); }
.post-body pre, .post-body code { font-family: var(--f-mono); font-size: .8125rem; }
.post-body pre { padding: 12px; border-radius: var(--r); background: var(--s2); overflow-x: auto; }
.section-heading { margin: 26px 0 12px; font: 700 1.05rem/1 var(--f-display); letter-spacing: .04em; text-transform: uppercase; }
.reply-editor { margin-top: 20px; background: var(--s1); border-radius: var(--r-lg); overflow: hidden; }
.reply-editor-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--line); }
.editor-tabs { display: inline-flex; gap: 2px; padding: 3px; border-radius: var(--r); background: var(--s2); }
.editor-tab { height: 26px; padding: 0 10px; border-radius: 7px; color: var(--ink-3); font-size: .75rem; font-weight: 600; }
.editor-tab.active { background: var(--s4); color: var(--ink); }
.reply-textarea {
  width: 100%; min-height: 150px; padding: 14px; background: transparent; border: 0; outline: none; resize: vertical;
  color: var(--ink); font: 400 .875rem/1.6 var(--f-ui);
}
.reply-preview { padding: 14px; color: var(--ink-2); font-size: .875rem; line-height: 1.65; }
.reply-editor-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; border-top: 1px solid var(--line); }
.char-counter, .counter-pill { color: var(--ink-4); font-size: .72rem; font-variant-numeric: tabular-nums; }
.btn-post-reply {
  display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 14px; border-radius: var(--r);
  background: var(--acc); color: var(--acc-ink); font-weight: 600; font-size: .8125rem;
}
.btn-post-reply:hover { background: var(--acc-hi); }
.btn-post-reply:disabled { opacity: .45; pointer-events: none; }
.login-prompt { margin-top: 20px; padding: 18px; text-align: center; border: 1px dashed var(--line-2); border-radius: var(--r-lg); color: var(--ink-3); }
.sidebar-card { background: var(--s1); border-radius: var(--r-lg); padding: 16px; }
.sidebar-card + .sidebar-card { margin-top: 14px; }
.sidebar-card-title { margin-bottom: 12px; font: 700 .8rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.sidebar-stats { display: flex; flex-direction: column; gap: 10px; }
.sidebar-stat { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.sidebar-stat-label { color: var(--ink-3); font-size: .8125rem; }
.sidebar-stat-value { font: 700 1rem var(--f-display); font-variant-numeric: tabular-nums; }
.mention-link { display: inline-flex; align-items: center; gap: 4px; color: var(--acc-hi); }
.new-topic-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; align-items: start; }
.topic-form {
  display: flex; flex-direction: column; gap: 18px;
  padding: 20px; background: var(--s1); border-radius: var(--r-lg);
}
.topic-form .field-label .req { color: var(--acc); }
.topic-form .reply-editor { margin-top: 0; background: var(--s2); }
.topic-form .reply-textarea { min-height: 220px; }
.form-actions { display: flex; justify-content: flex-end; gap: 10px; }
.tips-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.tips-list li { display: flex; gap: 9px; color: var(--ink-2); font-size: .8125rem; line-height: 1.55; }
.tips-list .material-icons { font-size: 16px; color: var(--acc); flex-shrink: 0; margin-top: 2px; }
.tips-list strong { color: var(--ink); font-weight: 600; }
.tips-list a { color: var(--acc-hi); }
@media (max-width: 1020px) {
.new-topic-layout { grid-template-columns: minmax(0, 1fr); }
}
.mention-dropdown {
  list-style: none; margin: 0; padding: 4px; max-height: 232px; overflow-y: auto; scrollbar-width: thin;
  background: var(--s2); border-radius: var(--r);
  box-shadow: var(--shadow-pop); animation: popIn .14s var(--ease);
}
.mention-dropdown[hidden] { display: none; }
.mention-item {
  display: flex; align-items: center; gap: 9px; padding: 7px 9px; border-radius: var(--r-sm);
  cursor: pointer; transition: background .12s;
}
.mention-item:hover, .mention-item.active { background: var(--s4); }
.mention-item .mention-avatar {
  display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; flex-shrink: 0;
  font: 800 .65rem var(--f-ui); color: #0d0d10; object-fit: cover;
}
.mention-name { color: var(--ink); font-size: .8125rem; font-weight: 600; }
@media (max-width: 1020px) {
.forum-layout { grid-template-columns: minmax(0, 1fr); }
.forum-sidebar { position: static; }
}
@media (max-width: 720px) {
.topic-list-header { display: none; }
.topic-row { grid-template-columns: minmax(0, 1fr) auto; row-gap: 8px; }
.topic-row .stat-cell { flex-direction: row; gap: 5px; font-size: .8rem; }
.topic-row .stat-cell, .topic-row .activity-cell { grid-column: span 1; justify-self: start; color: var(--ink-3); }
}
body[data-r6-page="api-docs"] { --docs-nav: var(--bar-h); --docs-top: var(--docs-nav); }
.docs-brand { flex-shrink: 0; display: grid; place-items: center; margin-right: -8px; }
.docs-brand img { width: 34px; height: 34px; border-radius: var(--r-sm); display: block; }
.docs-bar {
  position: fixed; inset: 0 0 auto; z-index: calc(var(--z-nav) - 1); height: var(--docs-nav);
  display: flex; align-items: center; gap: 20px; padding: 0 max(var(--gut), calc((100% - 1500px) / 2 + 24px));
  background: #141419; border-bottom: 1px solid var(--line);
}
.docs-title { flex-shrink: 0; font: 800 1.35rem/1 var(--f-display); text-transform: uppercase; letter-spacing: .01em; color: var(--ink); }
.docs-title span { color: var(--acc); }
.nav-center { flex: 1; display: flex; justify-content: center; min-width: 0; }
.search-trigger {
  display: flex; align-items: center; gap: 10px; width: min(460px, 100%); height: 36px; padding: 0 12px;
  border-radius: var(--r-sm); background: #26262e; color: var(--ink-3);
  font-size: .875rem; font-weight: 500; transition: background .15s, box-shadow .15s;
}
.search-trigger:hover { background: #2c2c35; color: var(--ink-2); box-shadow: 0 0 0 1px var(--acc-a30); }
.search-shortcut {
  margin-left: auto; padding: 1px 6px; border-radius: var(--r-xs); background: var(--s3);
  font: 500 .68rem var(--f-mono); color: var(--ink-3);
}
.docs-bar .nav-links { display: flex; align-items: center; gap: 4px; height: auto; }
.docs-bar .nav-link { height: 32px; padding: 0 10px; border-radius: var(--r-sm); font-size: .875rem; }
.docs-bar .nav-link:hover { background: var(--s2); }
.nav-mobile-toggle { display: none; width: 34px; height: 34px; place-items: center; border-radius: var(--r-sm); color: var(--ink-2); }
.nav-mobile-toggle svg { width: 18px; height: 18px; }
.app-layout {
  display: grid; grid-template-columns: 260px minmax(0, 1fr) 220px; gap: 32px;
  max-width: 1500px; margin-inline: auto; padding: calc(var(--docs-nav) + 28px) 24px 80px;
}
body[data-r6-page="api-docs"] .sidebar {
  position: sticky; top: calc(var(--docs-top) + 24px); align-self: start; max-height: calc(100vh - var(--docs-top) - 48px);
  overflow-y: auto; padding-right: 6px;
}
.sidebar-group + .sidebar-group { margin-top: 18px; }
.sidebar-group-title {
  display: flex; align-items: center; justify-content: space-between; padding: 6px 8px; cursor: pointer;
  font: 700 .8rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3);
}
.sidebar-group-title .chevron { color: var(--ink-4); transition: transform .2s var(--ease); }
.sidebar-group.collapsed .chevron { transform: rotate(-90deg); }
.sidebar-group.collapsed .sidebar-group-content { display: none; }
.sidebar-group-content { display: flex; flex-direction: column; gap: 1px; margin-top: 2px; }
.sidebar-item {
  padding: 7px 10px; border-radius: var(--r-sm); color: var(--ink-2); font-size: .8125rem;
  transition: background .12s, color .12s;
}
.sidebar-item:hover { background: var(--s2); color: var(--ink); }
.sidebar-item.active { background: var(--s2); color: var(--ink); font-weight: 600; box-shadow: none; }
.sidebar-backdrop { display: none; }
.content-area { min-width: 0; }
.content-area .section { scroll-margin-top: calc(var(--docs-top) + 24px); }
.content-area .section + .section { margin-top: 48px; }
.content-area h1 { margin-bottom: 12px; }
.content-area h2 { margin-bottom: 12px; font: 700 1.5rem/1.1 var(--f-display); text-transform: uppercase; letter-spacing: .01em; }
.content-area h3 { margin: 22px 0 10px; font-size: 1rem; }
.content-area p { margin-bottom: 12px; color: var(--ink-2); font-size: .875rem; line-height: 1.7; max-width: 76ch; }
.content-area ul, .content-area ol { margin: 0 0 14px 20px; color: var(--ink-2); font-size: .875rem; line-height: 1.7; }
.content-area a { color: var(--acc-hi); }
.content-area a:hover { text-decoration: underline; }
.endpoint { margin: 16px 0; border-radius: var(--r-lg); background: var(--s1); overflow: hidden; }
.endpoint-header {
  display: flex; align-items: center; gap: 10px; padding: 12px 16px; background: var(--bg-soft);
  border-bottom: 1px solid var(--line); cursor: pointer;
}
.method {
  display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: var(--r-xs);
  font: 700 .625rem/1 var(--f-ui); letter-spacing: .06em; text-transform: uppercase;
  background: var(--s3); color: var(--ink-2);
}
.method.get { background: #36d67f1f; color: var(--up); }
.method.post { background: #56b8ff1f; color: var(--info); }
.method.put, .method.patch { background: var(--gold-a12); color: var(--gold); }
.method.delete { background: var(--down-a12); color: var(--down); }
.endpoint-path { font: 500 .8125rem var(--f-mono); color: var(--ink); overflow-wrap: anywhere; }
.endpoint-content { padding: 16px; }
.endpoint-content > p:first-child { margin-top: 0; }
.code-block {
  position: relative; margin: 12px 0; padding: 14px 16px; border-radius: var(--r); overflow-x: auto;
  background: #0c0c0f; border: 1px solid var(--line-2);
  font: 400 .8125rem/1.6 var(--f-mono); color: #d7d7e0; tab-size: 2;
}
.code-block code { background: none; border: 0; padding: 0; font: inherit; color: inherit; }
.params-table { width: 100%; margin: 12px 0; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.params-table th { background: var(--bg-soft); }
.params-table td, .params-table th { font-size: .8125rem; white-space: normal; }
.params-table td code { font-size: .78rem; }
.info-box, .auth-info, .v1-deprecation-notice {
  margin: 14px 0; padding: 13px 15px; border-radius: var(--r);
  background: var(--s2); color: var(--ink-2); font-size: .8125rem; line-height: 1.6;
}
.info-box strong, .auth-info strong { color: var(--ink); }
.v1-deprecation-notice { border-color: #ff6b5733; background: var(--down-a12); color: var(--ink-2); }
.v1-deprecation-badge {
  display: inline-flex; align-items: center; height: 20px; padding: 0 7px; margin-right: 8px; border-radius: var(--r-xs);
  background: var(--down); color: #1a0705; font: 700 .625rem/1 var(--f-ui); letter-spacing: .06em; text-transform: uppercase;
}
.toc-sidebar { position: sticky; top: calc(var(--docs-top) + 24px); align-self: start; max-height: calc(100vh - var(--docs-top) - 48px); overflow-y: auto; }
.toc-title { margin-bottom: 10px; font: 700 .8rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.toc-list { list-style: none; display: flex; flex-direction: column; gap: 1px; border-left: 1px solid var(--line); }
.toc-link { display: block; padding: 5px 10px; margin-left: -1px; border-left: 1px solid transparent; color: var(--ink-3); font-size: .78rem; }
.toc-link:hover { color: var(--ink-2); }
.toc-link.active { color: var(--ink); border-left-color: var(--acc); }
.search-dialog { position: fixed; inset: 0; z-index: var(--z-modal); display: none; padding: 12vh 16px 16px; background: #000a; backdrop-filter: blur(4px); }
.search-dialog.active, .search-dialog.is-open { display: block; }
.search-dialog-content { max-width: 620px; margin-inline: auto; background: var(--s1); border-radius: var(--r-lg); box-shadow: var(--shadow-pop); overflow: hidden; }
.search-dialog-header { display: flex; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.search-dialog-input { flex: 1; background: none; border: 0; outline: none; font-size: .95rem; color: var(--ink); }
.search-results { max-height: 50vh; overflow-y: auto; padding: 6px; }
.search-placeholder { padding: 24px; text-align: center; color: var(--ink-3); font-size: .8125rem; }
.search-results-list a, .search-results-list .search-result {
  display: flex; align-items: center; gap: 11px; padding: 9px 10px; border-radius: var(--r-sm); color: var(--ink-2); font-size: .8125rem;
}
.search-results-list a:hover, .search-results-list .search-result.active { background: var(--s3); color: var(--ink); }
.docs-pagination { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: center;
  margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--line); }
.docs-pagination-buttons { display: flex; justify-content: space-between; gap: 12px; width: 100%; }
.docs-pagination-button {
  flex: 1; display: flex; flex-direction: column; gap: 3px; padding: 14px 16px; border-radius: var(--r-lg);
  background: var(--s1); transition: border-color .15s, background .15s;
}
.docs-pagination-button:hover { border-color: var(--line-3); background: var(--s2); }
.docs-pagination-next { text-align: right; }
.docs-pagination-label { font: 700 .8rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.docs-pagination-title { font-weight: 600; color: var(--ink); }
.docs-site-footer { margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--line); color: var(--ink-4); font-size: .75rem; }
@media (max-width: 1240px) {
.app-layout { grid-template-columns: 240px minmax(0, 1fr); }
.toc-sidebar { display: none; }
}
@media (max-width: 900px) {
.app-layout { grid-template-columns: minmax(0, 1fr); padding-inline: 16px; }
.nav-mobile-toggle { display: grid; }
.nav-center { display: none; }
body[data-r6-page="api-docs"] .sidebar {
    position: fixed; top: var(--docs-top); bottom: 0; left: 0; width: min(300px, 86vw); z-index: calc(var(--z-nav) + 2);
    padding: 16px; background: var(--s1); border-right: 1px solid var(--line-2);
    transform: translateX(-100%); transition: transform .3s var(--ease); max-height: none;
  }
body[data-r6-page="api-docs"] .sidebar.open, body[data-r6-page="api-docs"] .sidebar.active { transform: none; }
.sidebar-backdrop { display: block; position: fixed; inset: 0; background: #000a; opacity: 0; pointer-events: none; transition: opacity .25s; z-index: calc(var(--z-nav) + 1); }
.sidebar-backdrop.open, .sidebar-backdrop.active { opacity: 1; pointer-events: auto; }
}
.forum-shell svg:not([width]) { width: 15px; height: 15px; flex-shrink: 0; }
.counter-pill, .topic-counters { display: inline-flex; align-items: center; gap: 6px; }
.topic-counters { gap: 14px; margin-left: auto; color: var(--ink-3); font-size: .75rem; }
.counter-pill svg { color: var(--ink-4); }
.section-heading { display: flex; align-items: center; gap: 8px; }
.section-heading svg { color: var(--ink-3); }
.topic-date { color: var(--ink-3); font-size: .75rem; }
.topic-header { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; }
.topic-header-meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.topic-title { font: 800 clamp(1.7rem, 3vw, 2.3rem)/1.05 var(--f-display); text-transform: uppercase; }
.vote-btn { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 8px; border-radius: var(--r-sm);
  background: var(--s2); color: var(--ink-3); font-size: .75rem; font-weight: 600; }
.vote-btn:hover { color: var(--ink); border-color: var(--line-3); }
.vote-btn.is-on { color: var(--acc-hi); border-color: var(--acc-a30); background: var(--acc-a08); }
.trn-reply-card {
  display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 14px; margin: 0;
  padding: 20px 0; background: none; border: 0; border-bottom: 1px solid var(--line); border-radius: 0;
}
.trn-reply-card + .trn-reply-card { margin-top: 0; }
.trn-reply-card:first-child { padding-top: 8px; }
.trn-reply-card:last-child { border-bottom: 0; padding-bottom: 8px; }
.trn-reply-card:target {
  background: var(--acc-a08); border-radius: var(--r);
  margin-inline: -12px; padding-inline: 12px;
}
.trn-reply-avatar-circle {
  display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; overflow: hidden;
  font: 700 .95rem var(--f-ui); color: #0d0d10;
}
.trn-reply-avatar-circle img { width: 100%; height: 100%; object-fit: cover; }
.trn-reply-body { min-width: 0; }
.trn-reply-header { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.trn-reply-author { font-weight: 600; color: var(--ink); }
.trn-reply-author:hover { color: var(--acc-hi); }
.trn-reply-date { margin-left: auto; color: var(--ink-4); font-size: .72rem; }
.trn-reply-content { margin-top: 8px; color: var(--ink-2); font-size: .875rem; line-height: 1.65; white-space: pre-wrap; overflow-wrap: anywhere; }
.trn-reply-content a { color: var(--acc-hi); }
.trn-reply-footer { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.vote-controls { display: inline-flex; gap: 6px; }
.trn-vote-btn, .trn-share-btn, .trn-delete-btn {
  display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 9px; border-radius: var(--r-sm);
  background: var(--s2); color: var(--ink-3);
  font-size: .75rem; font-weight: 600; font-variant-numeric: tabular-nums;
  transition: color .12s, border-color .12s, background .12s;
}
.trn-vote-btn:hover, .trn-share-btn:hover { color: var(--ink); border-color: var(--line-3); }
.trn-vote-btn.voted { color: var(--up); border-color: #36d67f44; background: var(--up-a12); }
.trn-vote-btn.voted-down { color: var(--down); border-color: #ff6b5744; background: var(--down-a12); }
.trn-delete-btn { margin-left: auto; }
.trn-delete-btn:hover { color: var(--down); border-color: #ff6b5744; }
.dlg-split { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, 1fr); gap: 18px; align-items: start; }
.dlg-split .spec-media { margin: 0; }
.dlg-split .spec-media img { width: 100%; max-height: 380px; object-fit: cover; }
.dlg-split .spec-grid { grid-template-columns: minmax(0, 1fr); }
.dlg-split .spec-row:nth-child(odd) { border-right: 0; }
.dlg-split .spec-row:nth-last-child(2) { border-bottom: 1px solid var(--line); }
@media (max-width: 860px) {
.dlg-split { grid-template-columns: minmax(0, 1fr); }
}
.section-hidden { display: none !important; }
.code-block-container { margin: 12px 0; border: 1px solid var(--line-2); border-radius: var(--r); overflow: hidden; background: #0c0c0f; }
.code-block-container .code-block { margin: 0; border: 0; border-radius: 0; }
.code-header {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 12px;
  background: var(--bg-soft); border-bottom: 1px solid var(--line);
}
.code-lang { font: 600 .625rem/1 var(--f-ui); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); }
.copy-button {
  display: grid; place-items: center; width: 26px; height: 26px; border-radius: var(--r-sm);
  color: var(--ink-3); transition: color .12s, background .12s;
}
.copy-button:hover { color: var(--ink); background: var(--s3); }
.search-category-header {
  padding: 10px 10px 6px; font: 700 .75rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3);
}
.search-result { display: flex; align-items: center; gap: 11px; padding: 9px 10px; border-radius: var(--r-sm); color: var(--ink-2); }
.search-result:hover, .search-result.active { background: var(--s3); color: var(--ink); }
.search-result-icon { flex-shrink: 0; display: grid; place-items: center; width: 30px; height: 30px; border-radius: var(--r-sm); background: var(--s3); color: var(--ink-3); }
.search-result-icon svg { width: 16px; height: 16px; }
.search-result-info { flex: 1; min-width: 0; }
.search-result-title { font-weight: 600; font-size: .8125rem; color: var(--ink); }
.search-result-description { font-size: .72rem; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-result-meta { flex-shrink: 0; font-size: .68rem; color: var(--ink-4); text-transform: uppercase; letter-spacing: .06em; }
.search-results mark { background: var(--acc-a16); color: var(--acc-hi); border-radius: 2px; }
.docs-pagination-button.disabled, .docs-pagination-button:disabled { opacity: .35; pointer-events: none; }
.docs-pagination-info { display: flex; flex-direction: column; gap: 3px; min-width: 150px; }
.docs-pagination-info .docs-pagination-title { font: 700 1rem/1 var(--f-display); text-transform: uppercase; letter-spacing: .02em; }
.docs-pagination-prev { align-items: flex-start; text-align: left; }
.docs-pagination-next { align-items: flex-end; text-align: right; }
@media (max-width: 720px) {
.docs-pagination { grid-template-columns: minmax(0, 1fr); }
.docs-pagination-buttons { flex-direction: column; }
}
@media (max-width: 900px) {
body[data-r6-page="api-docs"] .sidebar.sidebar-open { transform: none; }
.sidebar-backdrop.active { opacity: 1; pointer-events: auto; }
}
.opd { padding-block: 20px 72px; }
.opd-kpis { margin-bottom: 20px; }
.opd-kpis .kpi-value small { margin-left: 2px; }
.opd-meter-pips { display: flex; gap: 4px; margin-top: 8px; }
.opd-pip { width: 20px; height: 4px; border-radius: 4px; background: #ffffff14; }
.opd-pip.is-on { background: var(--acc); }
.opd-body > * + * { margin-top: 32px; }
.opd-layout { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 20px; align-items: start; }
.opd-aside { display: flex; flex-direction: column; gap: 20px; position: sticky; top: calc(var(--nav-h) + 16px); }
.opd-h3 { margin-bottom: 12px; }
.opd-h3-gap { margin-top: 24px; }
.opd-weapon-grid { margin-bottom: 4px; }
.opd-lead { color: var(--ink-2); font-size: .875rem; line-height: 1.7; }
.opd-lead strong { color: var(--ink); }
.opd-figure img { object-fit: cover; }
@media (max-width: 1020px) {
.opd-layout { grid-template-columns: minmax(0, 1fr); }
.opd-aside { position: static; }
}
.opd-aside .spec-grid { grid-template-columns: minmax(0, 1fr); }
.opd-aside .spec-row:nth-child(odd) { border-right: 0; }
.opd-aside .spec-row:nth-last-child(2) { border-bottom: 1px solid var(--line); }
.opd-aside .spec-row:last-child { border-bottom: 0; }
.opd-aside .spec-v { text-align: right; }
.cat-bar.is-left .cat-count { margin-left: 0; }
.cat-bar.is-left { align-items: flex-end; }
.ban-refresh { margin-left: 4px; height: 40px; padding-inline: 14px; }
.cat-bar.is-left .cat-count { height: 40px; display: inline-flex; align-items: center; }
.bans-card { overflow: hidden; margin-top: 20px; }
.table-wrap.is-scroll { max-height: 620px; overflow-y: auto; }
.table-wrap.is-scroll thead th { position: sticky; top: 0; z-index: 1; }
@media (max-width: 720px) {
.table-wrap.is-scroll { max-height: 70vh; }
}
.dlg-hero { display: grid; place-items: center; padding: 14px; margin-bottom: 16px; border-radius: var(--r); background: var(--s2); }
.dlg-hero img { max-height: 120px; width: auto; object-fit: contain; }
.dlg-hero.is-wide img { max-height: 92px; max-width: 100%; }
.gs-searchwrap .omni { margin-top: 0; max-width: 820px; }
.plat-btn-sm { width: 34px; height: 34px; border: 0; background: transparent; }
.plat-btn-sm[aria-pressed="true"] { box-shadow: none; }
.omni-plats .plat-btn-sm { color: var(--ink-4); }
.omni-plats .plat-btn-sm:hover { color: var(--ink-2); }
.omni-plats .plat-btn-sm[data-platform="uplay"][aria-pressed="true"] { background: transparent; color: var(--pc); }
.omni-plats .plat-btn-sm[data-platform="xbl"][aria-pressed="true"] { background: transparent; color: var(--xbl); }
.omni-plats .plat-btn-sm[data-platform="psn"][aria-pressed="true"] { background: transparent; color: var(--psn); }
.search-results-body { margin-top: 20px; }
.search-results-body > .sec-head:first-child { margin-top: 0; }
.rk-version { min-width: 240px; }
.rk-tier-head .rank-ic { width: 46px; height: 46px; object-fit: contain; }
tr.is-year { cursor: pointer; }
tr.is-year td { height: 48px; vertical-align: middle; }
.year-cell { display: inline-flex; align-items: center; gap: 6px; vertical-align: middle; }
.row-caret { font-size: 18px; color: var(--ink-4); transition: color .15s; }
tr.is-year:hover .row-caret, tr.is-year.is-open .row-caret { color: var(--ink-2); }
tr.is-month td { color: var(--ink-3); background: #ffffff03; }
tr.is-month td:first-child { padding-left: 42px; }
.cat-bar .field { min-width: 150px; }
#content > .bleed, #main-content > .bleed { max-width: none; padding-inline: 0; }
.pl-page { padding-block: 20px 72px; }
.pl-modebar { margin-bottom: 16px; }
.pl-main > * + * { margin-top: 20px; }
.pl-filters { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: none; }
.field-inline { flex-direction: row; align-items: center; gap: 8px; min-width: 190px; }
.chart-container { min-height: 260px; }
@media (max-width: 1020px) {
.pl-layout { grid-template-columns: minmax(0, 1fr); }
.pl-sidebar { position: static; }
}
.stats-page .pl-modebar { margin-bottom: 0; min-width: 0; }
.chart-card + #home-mode-section { margin-top: 24px; }
.stats-page .pl-modes { display: flex; flex-wrap: wrap; }
.stats-page .pl-sidebar { position: static; min-width: 0; }
.stats-page .pl-sidebar > .card { min-width: 0; }
.stats-page .chart-container { position: relative; height: 300px; min-height: 0; }
.stats-page .pl-filters { flex-wrap: wrap; gap: 12px; padding: 16px; }
.stats-page .pf-btns { display: flex; }
.stats-page .kpi-value { overflow-wrap: anywhere; }
@media (max-width: 1020px) {
.stats-page .pl-main { grid-row: 1; }
}
@media (max-width: 720px) {
.stats-page .pl-filters > * { min-width: 0; max-width: 100%; flex: 1 1 180px; }
.stats-page .pf-actions { min-width: 0; }
}
.op-ic { width: 30px; height: 30px; padding: 2px; }
.stats-shell { --maxw: 1520px; }
@media (min-width: 1280px) {
.stats-shell { --gut: 40px; }
.stats-page .pl-layout { grid-template-columns: 340px minmax(0, 1fr); gap: 24px; }
.stats-page .pl-main table { font-size: .875rem; }
.stats-page .pl-main th { height: 40px; font-size: .72rem; }
.stats-page .pl-main td { height: 54px; }
.stats-page .pl-main th:first-child, .stats-page .pl-main td:first-child { padding-left: 20px; }
.stats-page .pl-main th:last-child, .stats-page .pl-main td:last-child { padding-right: 20px; }
.stats-page .pl-main th, .stats-page .pl-main td { padding-inline: 14px; }
.stats-page .pl-main .rank-ic { width: 28px; height: 28px; }
.stats-page .pl-main .op-ic { width: 38px; height: 38px; }
.stats-page .pl-main .player-cell, .stats-page .pl-main .pc-main { gap: 12px; }
.stats-page .pl-main .pc-sub, .stats-page .pl-main .muted.small { font-size: .76rem; }
.stats-page .pl-main .card-title { font-size: .95rem; }
.stats-page .pl-main .chip { height: 24px; }
.stats-page .chart-container { height: 340px; }
.stats-page .outcome-tile { padding: 16px 18px; }
.stats-page .matches-table th:first-child, .stats-page .matches-table td:first-child { width: 110px; }
.stats-page .matches-table th:nth-child(3), .stats-page .matches-table td:nth-child(3) { width: 26%; }
.stats-page .matches-table th:nth-child(4), .stats-page .matches-table td:nth-child(4), .stats-page .matches-table th:last-child, .stats-page .matches-table td:last-child { width: 130px; }
}
.topic-detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 24px; align-items: start; }
.topic-detail-main, .forum-content { min-width: 0; }
.topic-detail-sidebar { position: sticky; top: calc(var(--nav-h) + 20px); }
.topic-detail-header { margin-bottom: 24px; }
.topic-detail-title { margin-block: 12px 16px; font: 800 clamp(1.6rem, 3vw, 2.2rem)/1.15 var(--f-display); overflow-wrap: anywhere; }
.topic-author-row, .post-card-header { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.post-date, .topic-date { font-size: .75rem; color: var(--ink-3); }
.post-date { margin-left: auto; }
.post-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
#originalPost { margin-bottom: 24px; }
.timeline-rail { display: grid; gap: 20px; }
.timeline-point { display: flex; align-items: flex-start; gap: 10px; }
.timeline-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ink-4); margin-top: 5px; flex-shrink: 0; }
.timeline-dot.active { background: var(--acc); }
.timeline-type { display: block; font-size: .6875rem; text-transform: uppercase; color: var(--ink-3); }
.timeline-time { font-size: .8125rem; }
.login-prompt { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 4px; }
@media (max-width: 900px) {
.topic-detail-layout { grid-template-columns: minmax(0, 1fr); }
.topic-detail-sidebar { position: static; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 16px; }
.topic-detail-sidebar .sidebar-card { margin: 0; }
}
body[data-r6-page="api-docs"] .app-layout { width: 100%; }
body[data-r6-page="api-docs"] .content-area { width: 100%; min-width: 0; }
body[data-r6-page="api-docs"] .content-area pre { max-width: 100%; overflow-x: auto; }
.toc-list, .toc-link { border-left: 0; }
.toc-link.active { background: var(--s2); border-radius: var(--r-sm); }
.support-profile-page { max-width: 1100px; margin-inline: auto; }
.user-profile-header { display: flex; align-items: center; gap: 24px; padding: 24px; background: var(--s1); border-radius: var(--r-lg); margin-bottom: 24px; }
.avatar-lg { width: 88px; height: 88px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; overflow: hidden; color: var(--ink); font: 700 2rem var(--f-display); }
.avatar-lg img { width: 100%; height: 100%; object-fit: cover; }
.user-profile-info { flex: 1; min-width: 0; }
.user-profile-name { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font: 800 clamp(1.6rem, 4vw, 2.3rem)/1.15 var(--f-display); overflow-wrap: anywhere; }
.user-profile-joined { margin-top: 8px; color: var(--ink-3); font-size: .8125rem; }
.user-profile-stats-row { display: flex; flex-wrap: wrap; gap: 24px; margin-top: 20px; }
.user-profile-stat { display: flex; flex-direction: column; gap: 2px; }
.user-profile-stat-value { font: 700 1.4rem var(--f-display); font-variant-numeric: tabular-nums; }
.user-profile-stat-label { font-size: .6875rem; color: var(--ink-3); text-transform: uppercase; letter-spacing: .06em; }
.profile-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 20px; overflow-x: auto; }
.profile-tab { flex-shrink: 0; padding: 12px 16px; color: var(--ink-3); font-weight: 600; border-bottom: 2px solid transparent; }
.profile-tab.active { color: var(--ink); border-bottom-color: var(--acc); }
.profile-tab:hover { color: var(--ink); background: var(--s1); }
.profile-tab-panel { display: none; }
.profile-tab-panel.active { display: block; }
.top-content-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.top-content-section-title { margin-bottom: 12px; font: 700 1.1rem var(--f-display); text-transform: uppercase; }
.top-content-item { display: flex; align-items: flex-start; gap: 12px; padding: 16px; background: var(--s1); border-radius: var(--r); margin-bottom: 10px; min-width: 0; }
.top-content-item > div { min-width: 0; }
.top-content-item:hover, .user-reply-item:hover { background: var(--s2); }
.top-content-item-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; color: var(--ink-3); font-size: .6875rem; margin-bottom: 6px; }
.top-content-item-text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; overflow-wrap: anywhere; font-size: .875rem; line-height: 1.6; }
.user-reply-item { padding: 18px; margin-bottom: 12px; background: var(--s1); border-radius: var(--r); }
.user-reply-topic-link { color: var(--ink); font-weight: 600; font-size: .875rem; overflow-wrap: anywhere; }
.user-reply-body { margin-block: 10px; color: var(--ink-2); font-size: .875rem; line-height: 1.65; white-space: pre-wrap; overflow-wrap: anywhere; }
.user-reply-meta { display: flex; gap: 16px; color: var(--ink-3); font-size: .75rem; }
.profile-private-overlay { text-align: center; padding: 40px 20px; border-radius: var(--r-lg); background: var(--s1); }
.profile-private-overlay > .material-icons { font-size: 32px; color: var(--ink-3); margin-bottom: 14px; }
.profile-private-overlay p { margin-top: 10px; color: var(--ink-3); }
@media (max-width: 720px) {
.user-profile-header { padding: 18px; gap: 16px; align-items: flex-start; flex-wrap: wrap; }
.user-profile-header .avatar-lg { width: 64px; height: 64px; }
.user-profile-info { flex-basis: 200px; }
.user-profile-stats-row { gap: 20px; }
.top-content-grid { grid-template-columns: minmax(0, 1fr); }
}
.stats-page .pl-filters { justify-content: flex-start; align-items: flex-end; }
.stats-page .pl-filters > .field { flex: 0 1 200px; }
.stats-page .pl-filters > .input-icon { flex: 0 1 260px; }
.stats-page .card > .kpis { border-radius: 0; border-top: 0; border-left: 0; border-right: 0; }
.stats-page .card > .kpis:last-child { border-bottom: 0; }
@media (max-width: 720px) {
.stats-page .pl-filters > .field, .stats-page .pl-filters > .input-icon { flex: 1 1 180px; }
}
.pf-avatar.is-avatar .pf-initial { position: absolute; inset: 0; display: grid; place-items: center; z-index: -1; }
.pf-flag .rank-ic { width: 22px; height: 22px; }
.pf-rank-chip { color: var(--ink); background: color-mix(in srgb, var(--tier) 22%, #0e0e1299) !important; border-color: color-mix(in srgb, var(--tier) 55%, transparent); }
.pf-rank-chip b { color: var(--ink); font-variant-numeric: tabular-nums; }
.pf-meta .handle .plat svg { width: 15px; height: 15px; }
.pf-meta-item {
  display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 9px; border-radius: var(--r-xs);
  background: #0e0e1299; color: var(--ink-3); font-size: .78rem; font-weight: 600; white-space: nowrap;
}
.pf-meta-item b { color: var(--ink); font-weight: 700; }
.pf-meta-item:empty { display: none; }
.pf-updated.is-warning { color: var(--acc-hi); }
#stats-updated-at.is-warning { color: var(--gold); }
.pf-ic.is-cooling, .pf-ic:disabled { opacity: .45; cursor: not-allowed; }
.pf-ic.is-acc:not(.is-on) { background: #2b2b34e6; color: #fff; }
.pf-ic.is-acc.is-on { color: var(--acc-ink); }
.cs-meter .outcome-bar { height: 6px; }
.cs-table td.up { color: var(--up); }
.cs-table td.down { color: var(--down); }
.pk-row { cursor: default; }
.pk-row.is-empty { opacity: .55; }
.pk-row.is-empty .rank-ic { filter: grayscale(1); }
.alias-plat { display: inline-flex; align-items: center; gap: 8px; }
.alias-plat .plat svg { width: 16px; height: 16px; }
.pl-main > .sec-head:first-child { margin-top: 0; }
#stats-kpis .pl-kpis { margin-bottom: 0; }
.outcome { display: flex; flex-direction: column; gap: 14px; }
.outcome-bar { display: flex; height: 8px; border-radius: 8px; overflow: hidden; background: #ffffff0d; }
.outcome-bar i { display: block; height: 100%; transform-origin: left; animation: growX .9s var(--ease) both; }
.outcome-bar .is-win { background: var(--up); }
.outcome-bar .is-loss { background: var(--down); }
.outcome-bar .is-abandon { background: var(--ink-4); }
.outcome-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 10px; }
.outcome-tile {
  display: flex; flex-direction: column; gap: 3px; padding: 11px 13px; border-radius: var(--r);
  background: var(--s2);
}
.outcome-tile span { font: 700 .75rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.outcome-tile b { font: 700 1.3rem/1 var(--f-display); font-variant-numeric: tabular-nums; }
.outcome-tile.is-win b { color: var(--up); }
.outcome-tile.is-loss b { color: var(--down); }
.outcome-tile.is-abandon b { color: var(--ink-3); }
.rcm-plot { min-height: 300px; }
.rcm-ranges button { min-width: 42px; justify-content: center; }
.matches-sentinel {
  display: flex; align-items: center; justify-content: center; gap: 9px; padding: 16px;
  border-top: 1px solid var(--line); color: var(--ink-3); font-size: .8125rem;
}
.matches-sentinel[hidden] { display: none; }
.gsearch-plat svg { width: 18px; height: 18px; }
.gsearch-plat.is-on.is-pc { color: var(--pc); }
.gsearch-plat.is-on.is-xbl { color: #3fbf3f; }
.gsearch-plat.is-on.is-psn { color: #3d9bff; }
.rf-av img, .gh-chip-av img { width: 100%; height: 100%; object-fit: cover; }
.rf-av.has-img, .gh-chip-av.has-img { overflow: hidden; background: var(--s3); }
.gh-chip-av { overflow: hidden; }
.rf-plat svg { width: 16px; height: 16px; }
.rf-row .p-name { max-width: 100%; }
.gh-right { gap: 18px; }
.gh-right .mini-grid { gap: 18px; }
.no1-grid .no1 {
  display: grid; grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "av av" "name name" "label label" "val share" "bar bar"; row-gap: 4px;
}
.no1-grid .no1-av { grid-area: av; }
.no1-grid .no1-name { grid-area: name; padding-right: 44px; }
.no1-grid .no1-label { grid-area: label; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.no1-grid .no1-val { grid-area: val; margin-top: 6px; font-size: 2.1rem; }
.no1-share { grid-area: share; align-self: end; margin-bottom: 3px; color: var(--ink-2); font: 700 .8rem var(--f-ui); font-variant-numeric: tabular-nums; }
.no1-bar { grid-area: bar; display: block; height: 4px; margin-top: 8px; border-radius: 4px; background: #ffffff12; overflow: hidden; }
.no1-bar i { display: block; height: 100%; width: 0; border-radius: inherit; background: var(--plat, var(--acc)); transition: width .8s var(--ease); }
.no1.is-pc { --plat: var(--pc); }
.no1.is-xbl { --plat: #3fbf3f; }
.no1.is-psn { --plat: #3d9bff; }
.no1-av.plat { display: grid; place-items: center; color: var(--ink-2); }
.no1-av.plat svg { display: block; width: 24px; height: 24px; margin: 0; }
.no1.is-pc .no1-av { color: var(--pc); background: var(--pc-a20); }
.no1.is-xbl .no1-av { color: #3fbf3f; background: var(--xbl-a20); }
.no1.is-psn .no1-av { color: #3d9bff; background: var(--psn-a20); }
.no1[data-pos="2"] .no1-badge { background: linear-gradient(160deg, #f4f6f9, #a3adba); color: #101419; }
.no1[data-pos="3"] .no1-badge { background: linear-gradient(160deg, #f3b884, #b0632a); color: #1e0f04; }
.no1.skeleton-ish .no1-badge { background: var(--s4); color: var(--ink-3); }
.gh-mark { width: 26px; height: 26px; display: grid; place-items: center; flex-shrink: 0; }
.gh-mark svg { width: 24px; height: 24px; display: block; }
.gh-mark.is-steam { color: #66c0f4; }
.gh-mark.is-ubi { color: var(--pc); }
.home-lb .card-head { flex-wrap: nowrap; }
.gh-trend.home-lb { flex: none; min-height: 0; }
.home-lb > .list { overflow: visible; }
.home-lb .li { min-height: 52px; }
.seg-sm button { height: 30px; padding: 0 12px; font-size: .85rem; }
.home-lb .list.is-loading { opacity: .55; transition: opacity .15s; }
.home-lb .li { gap: 12px; }
.home-lb .rank-pill { min-width: 30px; height: 24px; font-size: 1rem; flex-shrink: 0; }
.lb-av { width: 34px; height: 34px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; overflow: hidden; background: var(--s4); font: 700 .95rem var(--f-display); color: var(--ink-2); box-shadow: 0 0 0 2px color-mix(in srgb, var(--tier) 55%, transparent); }
.lb-av img { width: 100%; height: 100%; object-fit: cover; }
.home-lb .li-sub { display: flex; align-items: center; gap: 6px; }
.lb-plat .plat svg { width: 13px; height: 13px; }
.home-lb .li-end { min-width: 64px; }
.home-live-kpis { border-radius: 0 0 var(--r-lg) var(--r-lg); row-gap: 0; }
.home-live-kpis .kpi { padding: 16px 20px; }
.home-live-kpis .kpi:nth-child(-n+3) { border-bottom: 1px solid var(--line); }
.home-live-kpis .kpi-value { font-size: 1.9rem; }
.home-grid { align-items: stretch; }
.home-col > .card:last-child { flex: 1; display: flex; flex-direction: column; }
.home-col > .card:last-child > .tool-strip { flex: 1; grid-auto-rows: 1fr; }
.home-side > .dev-card { display: flex; flex-direction: column; }
.home-side > .dev-card > .card-body { flex: 1; display: flex; flex-direction: column; }
.home-side > .dev-card .dev-actions { margin-top: auto; padding-top: 16px; }
@media (max-width: 720px) {
.no1-grid .no1-val { font-size: 1.7rem; }
.home-live-kpis { --n: 2 !important; }
.home-live-kpis .kpi:nth-child(-n+3) { border-bottom: 0; }
.home-lb .card-head { flex-wrap: wrap; }
.home-lb .seg-sm { width: 100%; }
.home-lb .seg-sm button { flex: 1 1 0; }
.home-lb .li > .rank-ic { display: none; }
}
.tool-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; background: var(--s1); border-radius: 0 0 var(--r-lg) var(--r-lg); overflow: hidden; }
.tool-tile { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 18px; background: var(--row); transition: background .15s; }
.tool-tile:hover { background: var(--row-hover); }
.tool-tile .tool-ic { font-size: 24px; color: var(--acc); margin-bottom: 10px; }
.tool-tile b { font: 800 1.25rem/1.05 var(--f-display); text-transform: uppercase; letter-spacing: .02em; }
.tool-tile small { color: var(--ink-3); font-size: .78rem; line-height: 1.45; }
.tool-tile::after {
  content: ''; display: inline-block; width: 1em; height: 1em; margin: auto; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 256 256%22%3E%3Cpath d=%22M224.49,136.49l-72,72a12,12,0,0,1-17-17L187,140H40a12,12,0,0,1,0-24H187L135.51,64.48a12,12,0,0,1,17-17l72,72A12,12,0,0,1,224.49,136.49Z%22/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 256 256%22%3E%3Cpath d=%22M224.49,136.49l-72,72a12,12,0,0,1-17-17L187,140H40a12,12,0,0,1,0-24H187L135.51,64.48a12,12,0,0,1,17-17l72,72A12,12,0,0,1,224.49,136.49Z%22/%3E%3C/svg%3E") center / contain no-repeat;  position: absolute; top: 16px; right: 16px; font-size: 20px; color: var(--ink-4);
  transition: color .2s, transform .3s var(--ease);
}
.tool-tile:hover::after { color: #fff; transform: translateX(3px); }
.tw-lead { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px; background: var(--s1); }
.tw-lead > div { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; background: var(--row); }
.tw-lead small { color: var(--ink-3); font: 700 .8rem var(--f-display); letter-spacing: .08em; text-transform: uppercase; }
.tw-lead b { font: 700 2.2rem/1 var(--f-display); font-variant-numeric: tabular-nums; }
.tw-lead > div:first-child b { color: var(--acc); }
.tw-list .li { min-height: 50px; }
.dev-card .card-body p { color: var(--ink-2); font-size: .875rem; line-height: 1.6; }
.dev-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
@media (max-width: 1020px) {
.tool-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.banner .pf-avatar { position: relative; left: auto; top: auto; width: 112px; height: 112px; flex-shrink: 0; }
.banner .pf-avatar .ph-avatar-img { object-fit: contain; padding: 8px; background: radial-gradient(circle at 50% 30%, #2e2e38, #131318 75%); }
@media (max-width: 720px) {
.banner .pf-avatar { width: 84px; height: 84px; }
}
.page-auth .auth-stage { position: relative; isolation: isolate; display: grid; place-items: center; min-height: 100vh; padding: 88px var(--gut) 72px; }
.page-auth .auth-stage::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(520px 300px at 50% 0%, #f5a6231c, transparent 70%), repeating-linear-gradient(-58deg, transparent 0 22px, #ffffff04 22px 23px);
  -webkit-mask-image: linear-gradient(180deg, #000 30%, transparent); mask-image: linear-gradient(180deg, #000 30%, transparent);
}
.page-auth .auth-back {
  position: absolute; top: 24px; left: var(--gut); z-index: 1;
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--ink-3); font-size: .8125rem; font-weight: 600; transition: color .15s;
}
.page-auth .auth-back:hover { color: var(--ink); }
.page-auth .auth-back .material-icons { font-size: 18px; }
.page-auth .auth-wrap { width: min(420px, 100%); }
.page-auth .auth-card { padding: 28px; box-shadow: none; }
.page-auth .auth-card::before { content: none; }
.page-auth .auth-head { text-align: center; margin-bottom: 22px; display: flex; flex-direction: column; align-items: center; }
.page-auth .auth-head .auth-mark { width: 44px; height: 44px; margin-bottom: 14px; }
.page-auth .auth-head .auth-mark img { width: 44px; height: 44px; border-radius: 11px; display: block; }
.page-auth .auth-head h1 { font: 800 1.9rem/1 var(--f-display); text-transform: uppercase; letter-spacing: .01em; }
.page-auth .auth-head p { margin-top: 8px; color: var(--ink-3); font-size: .8125rem; line-height: 1.55; max-width: 34ch; }
.page-auth .auth-form { display: flex; flex-direction: column; gap: 14px; }
.page-auth .auth-form > div { display: flex; flex-direction: column; gap: 14px; }
.page-auth .auth-form > div[style*="display:none"] { display: none; }
.page-auth .field input {
  width: 100%; height: 42px; padding: 0 12px; border-radius: var(--r);
  background: var(--bg-soft); border: 1px solid var(--line-2); outline: none; font-size: .875rem; color: var(--ink);
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.page-auth .field input:hover { border-color: var(--line-3); }
.page-auth .field input:focus { border-color: var(--acc-a30); box-shadow: 0 0 0 3px var(--acc-a08); background: var(--s1); }
.page-auth .field input::placeholder { color: var(--ink-4); }
.page-auth .field.invalid input { border-color: #ff6b5780; box-shadow: 0 0 0 3px var(--down-a12); }
.page-auth .auth-field-msg { display: none; margin-top: 4px; color: var(--down); font-size: .72rem; }
.page-auth .field.invalid .auth-field-msg { display: block; }
.page-auth .pw-wrap { position: relative; }
.page-auth .pw-wrap input { padding-right: 42px; }
.page-auth .pw-toggle { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; display: grid; place-items: center; border-radius: 8px; color: var(--ink-3); background: none; border: 0; cursor: pointer; }
.page-auth .pw-toggle:hover { color: var(--ink); background: var(--s3); }
.page-auth .pw-toggle .material-icons { font-size: 18px; }
.page-auth .form-submit {
  width: 100%; height: 44px; margin-top: 6px; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: 0; border-radius: var(--r); background: var(--acc); color: var(--acc-ink); font-weight: 700; font-size: .875rem; cursor: pointer;
  transition: background .15s, box-shadow .15s, transform .15s var(--ease);
}
.page-auth .form-submit:hover { background: var(--acc-hi); box-shadow: 0 10px 28px -10px var(--acc-a30); }
.page-auth .form-submit:active { transform: translateY(1px); }
.page-auth .form-submit:disabled { background: var(--s3); color: var(--ink-4); cursor: not-allowed; box-shadow: none; }
.page-auth .form-submit .material-icons { font-size: 19px; }
.page-auth .auth-mini { align-self: center; color: var(--ink-3); font-size: .78rem; font-weight: 500; }
.page-auth .auth-mini:hover { color: var(--ink); }
.page-auth .auth-2fa-actions { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 4px 0; }
.page-auth .auth-2fa-actions .auth-mini-btn { flex: 1 1 120px; }
.page-auth .auth-mini-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 36px; padding: 0 14px; border-radius: var(--r); cursor: pointer;
  background: transparent; border: 1px solid var(--line-2); color: var(--ink-2);
  font-weight: 600; font-size: .78rem; white-space: nowrap;
  transition: background .15s, border-color .15s, color .15s, transform .15s var(--ease);
}
.page-auth .auth-mini-btn:hover:not(:disabled) { background: var(--s2); border-color: var(--line-3); color: var(--ink); }
.page-auth .auth-mini-btn:active:not(:disabled) { transform: translateY(1px); }
.page-auth .auth-mini-btn:disabled { opacity: .5; cursor: not-allowed; }
.page-auth #twoFactorCode { text-align: center; font-family: var(--f-mono); font-size: 1.15rem; font-weight: 600; letter-spacing: .38em; text-indent: .38em; }
.page-auth #twoFactorCode::placeholder { font-family: var(--f-ui); font-size: .875rem; font-weight: 400; letter-spacing: 0; text-indent: 0; }
.page-auth .auth-note { display: flex; gap: 10px; align-items: flex-start; padding: 11px 12px; border-radius: var(--r); background: var(--bg-soft); border: 1px solid var(--line); color: var(--ink-2); font-size: .78rem; line-height: 1.5; }
.page-auth .auth-note .material-icons { font-size: 18px; color: var(--acc); }
.page-auth .auth-alt { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); text-align: center; color: var(--ink-3); font-size: .8125rem; }
.page-auth .auth-alt a { color: var(--acc); font-weight: 600; }
.page-auth .auth-alt a:hover { color: var(--acc-hi); }
.page-auth .form-status { margin: 0; font-size: .8125rem; color: var(--ink-3); }
.page-auth .form-status:empty { display: none; }
.page-auth .form-status.err, .page-auth .form-status.ok { padding: 10px 12px; border-radius: var(--r); }
.page-auth .form-status.err { color: var(--down); background: var(--down-a12); }
.page-auth .form-status.ok { color: var(--up); background: var(--up-a12); }
.page-auth .auth-card { padding: 30px; border-radius: var(--r-lg); }
.page-auth .auth-head h1 { font: 800 2.2rem/1 var(--f-display); }
.page-auth .field input { border-radius: var(--r-sm); background: #121217; border: 1px solid var(--line-3); }
.page-auth .field input:hover { border-color: #ffffff40; }
.page-auth .field input:focus { border-color: var(--acc); box-shadow: 0 0 0 3px var(--acc-a16); background: #121217; }
.page-auth .form-submit { border-radius: 0; clip-path: var(--cut-shape-2); }
.page-auth .form-submit:hover { box-shadow: none; }
.page-auth .auth-note { border: 0; background: var(--row-alt); border-radius: var(--r-sm); }
.page-auth .auth-alt { border-top: 0; }
.page-auth .auth-mini-btn { border: 0; background: #2a2a33; border-radius: var(--r-sm); }
.page-auth .auth-mini-btn:hover:not(:disabled) { background: #34343e; }
.page-auth .pw-meter { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin-top: 8px; }
.page-auth .pw-meter span { height: 3px; border-radius: 3px; background: var(--s4); transition: background .2s; }
.page-auth .pw-meter.s1 span:nth-child(1) { background: var(--down); }
.page-auth .pw-meter.s2 span:nth-child(-n+2) { background: #ff6b35; }
.page-auth .pw-meter.s3 span:nth-child(-n+3) { background: var(--acc); }
.page-auth .pw-meter.s4 span { background: var(--up); }
.page-auth .pw-hint { margin-top: 6px; color: var(--ink-4); font-size: .72rem; }
.page-auth .auth-check { display: flex; gap: 10px; align-items: flex-start; color: var(--ink-3); font-size: .78rem; line-height: 1.5; cursor: pointer; }
.page-auth .auth-check input { appearance: none; width: 18px; height: 18px; flex-shrink: 0; margin: 1px 0 0; border-radius: 4px; border: 1.5px solid var(--line-3); display: grid; place-items: center; cursor: pointer; transition: background .15s, border-color .15s; }
.page-auth .auth-check input:checked { background: var(--acc); border-color: var(--acc); }
.page-auth .auth-check input:checked::after { content: ''; width: 9px; height: 5px; border: 2px solid var(--acc-ink); border-top: 0; border-right: 0; transform: rotate(-45deg) translate(1px, -1px); }
.page-auth .auth-check a { color: var(--acc); font-weight: 600; }
.page-auth .auth-check a:hover { color: var(--acc-hi); }
.page-auth .auth-head > .material-icons { width: 52px; height: 52px; display: grid; place-items: center; margin-bottom: 14px; border-radius: 50%; background: var(--acc-a16); }
.page-auth .auth-form > .auth-note { flex-direction: row; gap: 10px; }
.page-auth a.form-submit { text-decoration: none; }
.pl-loading-wrap { position: relative; min-height: 70vh; }
.pl-loading-wrap > .pl-loading-skeleton { filter: blur(6px); opacity: .55; pointer-events: none; }
.pl-loading-overlay {
  position: absolute; inset: 0; z-index: 5;
  display: flex; align-items: flex-start; justify-content: center;
  padding: min(22vh, 180px) 16px 16px;
  background: rgba(10, 10, 12, 0.35);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border-radius: var(--r-lg, 16px);
  animation: pl-loading-fade .2s ease-out;
}
.pl-loading-box {
  position: sticky; top: 30vh;
  display: flex; flex-direction: column; align-items: center; gap: 18px;
  text-align: center; max-width: 420px;
}
.pl-loading-logo {
  width: 96px; height: 96px; border-radius: 22px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.45);
  animation: pl-loading-pulse 1.4s ease-in-out infinite;
}
.pl-loading-title { font-size: 1.05rem; font-weight: 600; letter-spacing: .02em; color: var(--text-primary, #f3f2f0); }
.pl-loading-sub { font-size: .9rem; line-height: 1.45; color: var(--text-secondary, #a9a7a2); }
@keyframes pl-loading-pulse {
  0%, 100% { transform: scale(0.88); }
  50% { transform: scale(1.12); }
}
@keyframes pl-loading-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
.pl-loading-logo { animation: pl-loading-breathe 1.6s ease-in-out infinite; }
@keyframes pl-loading-breathe { 0%, 100% { opacity: .6; } 50% { opacity: 1; } }
}
}