/* Сайт статистики — дизайн-система «Broadcast Prestige» (этап 53),
   тот же язык, что у капитанского драфта (Worlds 2025 / V. Hatala):
   почти монохром + ОДИН акцент — золото престижа #C8AA6E/#E8DCC0.
   Глубокий чёрный #040507, сценический холодный луч сверху, виньетка,
   деликатный grain (файлом — CSP img-src 'self'), display-типографика
   Oswald (заголовки/цифры) + Inter (тело). Шрифты локально в
   /static/fonts (font-src 'self'). Весь CSS сайта — этот файл +
   /static/bracket.css (сетка, генерируется из bot/bracket_page):
   style-src 'self', инлайн-стилей нет. */

/* ── Шрифты: поднаборы по unicode-range — качается только нужное ── */
@font-face {
  font-family: "Oswald"; font-weight: 500; font-display: swap;
  src: url("/static/fonts/oswald-500-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+2000-206F, U+20AC-20AC;
}
@font-face {
  font-family: "Oswald"; font-weight: 500; font-display: swap;
  src: url("/static/fonts/oswald-500-cyrillic.woff2") format("woff2");
  unicode-range: U+0400-04FF, U+0500-052F;
}
@font-face {
  font-family: "Oswald"; font-weight: 600; font-display: swap;
  src: url("/static/fonts/oswald-600-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+2000-206F, U+20AC-20AC;
}
@font-face {
  font-family: "Oswald"; font-weight: 600; font-display: swap;
  src: url("/static/fonts/oswald-600-cyrillic.woff2") format("woff2");
  unicode-range: U+0400-04FF, U+0500-052F;
}
@font-face {
  font-family: "Oswald"; font-weight: 700; font-display: swap;
  src: url("/static/fonts/oswald-700-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+2000-206F, U+20AC-20AC;
}
@font-face {
  font-family: "Oswald"; font-weight: 700; font-display: swap;
  src: url("/static/fonts/oswald-700-cyrillic.woff2") format("woff2");
  unicode-range: U+0400-04FF, U+0500-052F;
}
@font-face {
  font-family: "Inter"; font-weight: 400; font-display: swap;
  src: url("/static/fonts/inter-400-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+2000-206F, U+20AC-20AC;
}
@font-face {
  font-family: "Inter"; font-weight: 400; font-display: swap;
  src: url("/static/fonts/inter-400-cyrillic.woff2") format("woff2");
  unicode-range: U+0400-04FF, U+0500-052F;
}
@font-face {
  font-family: "Inter"; font-weight: 600; font-display: swap;
  src: url("/static/fonts/inter-600-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+2000-206F, U+20AC-20AC;
}
@font-face {
  font-family: "Inter"; font-weight: 600; font-display: swap;
  src: url("/static/fonts/inter-600-cyrillic.woff2") format("woff2");
  unicode-range: U+0400-04FF, U+0500-052F;
}
@font-face {
  font-family: "Inter"; font-weight: 800; font-display: swap;
  src: url("/static/fonts/inter-800-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+2000-206F, U+20AC-20AC;
}
@font-face {
  font-family: "Inter"; font-weight: 800; font-display: swap;
  src: url("/static/fonts/inter-800-cyrillic.woff2") format("woff2");
  unicode-range: U+0400-04FF, U+0500-052F;
}

:root {
  --bg: #040507;
  --bg2: #07080B;
  --panel: #0A0C10;
  --panel2: #0E1116;
  --line: #1E2126;
  --line-hi: #343842;
  /* Единственный акцент — золото престижа. */
  --gold: #C8AA6E;
  --gold-hi: #E8DCC0;
  --text: #F2F2F2;
  --dim: #8A8F98;
  --muted: #4A4E55;
  /* Красный — только критика: ошибки, поражения. */
  --red: #C83737;
  /* Максимум два шрифта на странице: Oswald — display/заголовки/цифры,
     Inter — тело/таблицы/подписи. */
  --font-head: "Oswald", "Inter", sans-serif;
  --font-body: "Inter", sans-serif;
  --ease: cubic-bezier(.16, 1, .3, 1);
  /* Компонентный язык дэшборда (этап 56): радиусы, фоны, тени, ease —
     единый источник, dash.css берёт те же токены через var(). */
  --r-card: 18px;
  --r-tile: 16px;
  --r-in: 12px;
  --r-ctl: 9px;
  --r-pill: 999px;
  --card-bg: linear-gradient(160deg, #0C0E13, #08090D);
  --tile-bg: linear-gradient(155deg, #0D0F15, #08090D);
  --well: #0B0D12;
  --line-soft: #14171D;
  --faint: #6B7078;
  --text-soft: #C6C9CF;
  --shadow: 0 14px 34px rgba(0, 0, 0, .34);
  --shadow-hi: 0 20px 44px rgba(0, 0, 0, .44);
  --ease-lift: cubic-bezier(.22, .8, .3, 1);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  /* Сцена: глубокий чёрный + холодный луч сверху по центру. */
  background:
    radial-gradient(1300px 520px at 50% -12%, rgba(190, 210, 235, .075), transparent 62%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg2) 100%);
  color: var(--text);
  font-family: var(--font-body);
  font-size: 14px;
}
/* Виньетка по краям — сцена сужается к центру. */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(120% 90% at 50% 40%, transparent 58%, rgba(0, 0, 0, .42) 100%);
  z-index: 90;
}
/* Деликатный grain поверх — «плёнка» кинематографа. */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: url("/static/grain.svg") repeat;
  background-size: 200px 200px;
  opacity: .045;
  z-index: 91;
}

a { color: var(--dim); text-decoration: none; transition: color .15s var(--ease); }
a:hover { color: var(--gold-hi); }

/* ── Золотой display-текст: градиент + тонкий shimmer ─────── */
h1, .err-code, .p-name {
  background: linear-gradient(100deg,
    var(--gold) 20%, var(--gold-hi) 42%,
    var(--gold) 60%, var(--gold) 100%);
  background-size: 220% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: sc-shimmer 7s linear infinite;
}
@keyframes sc-shimmer {
  0% { background-position: 120% 0; }
  100% { background-position: -120% 0; }
}

/* ── Навигация: бренд две строки слева, капс-ссылки справа ── */
.nav {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
  /* Общий вид на всех страницах: высота 55px, контент на ВСЮ ширину
     окна — бренд слева, discord-иконка у правого края, общий паддинг. */
  min-height: 55px;
  box-sizing: border-box;
  padding: 0 22px;
  background: rgba(4, 5, 7, .82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
}
/* Разделитель под навигацией: волослиния с разрывом под ромб ─◆─. */
.nav::after {
  content: "◆";
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 7px;
  color: var(--gold);
}
/* Бренд в одну строку: «vikske ×» — золотой акцент, «Swift Conquer» —
   белый (display-шрифт, капс). Без шиммера — спокойная шапка. */
.nav .brand {
  display: inline-flex;
  align-items: baseline;
  gap: .5em;
  font-family: var(--font-head);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .22em;
  line-height: 1.2;
  text-transform: uppercase;
  white-space: nowrap;
  margin-right: 18px;
  padding-right: 16px;
  border-right: 1px solid var(--line);
}
.nav .brand span.bx { color: var(--gold); }
.nav .brand span.sc { color: var(--text); }
.nav a.tablink {
  color: var(--dim);
  font-family: var(--font-head);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  padding: 7px 13px;
  border: 1px solid transparent;
  border-radius: var(--r-ctl);
  transition: color .15s var(--ease), border-color .15s var(--ease),
              background .15s var(--ease);
}
.nav a.tablink:hover { color: var(--text); border-color: var(--line); }
.nav a.tablink.active {
  color: var(--gold-hi);
  border-color: rgba(200, 170, 110, .45);
  background: rgba(200, 170, 110, .07);
}
.nav .right { margin-left: auto; display: flex; gap: 10px; align-items: center; }

/* Иконка Discord в шапке — тот же паттерн, что на капитанском драфте:
   монохромный квадрат, hover→золото. */
.nav .nav-discord {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px; height: 34px;
  color: var(--muted);
  border: 1px solid var(--line);
  border-radius: var(--r-ctl);
  background: var(--panel);
  transition: color .15s var(--ease), border-color .15s var(--ease),
              background .15s var(--ease);
}
.nav .nav-discord svg { width: 17px; height: 17px; display: block; }
.nav .nav-discord:hover {
  color: var(--gold-hi);
  border-color: var(--line-hi);
  background: rgba(200, 170, 110, .07);
}
/* FunPay — фирменные стрелки PNG КАК ЕСТЬ (этап 75): файл уже
   отредактирован под тёмную тему — никаких mask/фильтров/перекраски. */
.nav .funpay-ico {
  width: 17px; height: 17px; display: block;
  object-fit: contain;
  border-radius: 4px;
}
.nav .btn-admin {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  /* Высота — как у иконок-ссылок .nav-discord (34px), единый ряд нав. */
  height: 34px;
  font-family: var(--font-head);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--gold-hi);
  padding: 8px 14px;
  border-radius: var(--r-ctl);
  border: 1px solid var(--gold);
  background: rgba(200, 170, 110, .06);
  transition: border-color .15s var(--ease), background .15s var(--ease);
  white-space: nowrap;
}
.nav .btn-admin svg { width: 12px; height: 12px; display: block; }
.nav .btn-admin:hover { border-color: var(--gold-hi); background: rgba(200, 170, 110, .12); }

.container { max-width: 1360px; margin: 0 auto; padding: 28px 26px 70px; }

/* Футер — тонкая подпись платформы. */
.foot {
  border-top: 1px solid var(--line);
  margin-top: 28px;
  padding: 14px 26px;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.foot .foot-brand {
  font-family: var(--font-head);
  color: var(--text);
  letter-spacing: .26em;
}
/* «vikske» в словесном бренде — единственный золотой акцент. */
.foot .foot-brand b { color: var(--gold); font-weight: 600; }

/* ── Типографика ─────────────────────────────────────────── */
h1 {
  font-family: var(--font-head);
  font-size: 34px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  margin: 10px 0 6px;
}
h1 a { color: inherit; }
h2 {
  font-family: var(--font-head);
  font-weight: 600;
  font-size: 16px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text);
  margin: 30px 0 12px;
}
/* Разделитель ─◆─ под заголовками зон. */
h2 {
  position: relative;
  padding-bottom: 12px;
}
h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg,
    var(--line) 0%, var(--line) 46%,
    transparent 47%, transparent 53%,
    var(--line) 54%, var(--line) 100%);
}
h2::before {
  content: "◆";
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 8px;
  color: var(--gold);
}
/* Кикер-капс над секциями. */
.kicker {
  display: block;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 4px;
}
.sub { color: var(--dim); font-size: 13px; margin-bottom: 14px; }

/* ── Панели: bento-карточка дэшборда — мягкий радиус, градиентный
   фон, внутренний блик, мягкая тень, hover-lift с золотой рамкой ── */
.card {
  background: var(--card-bg);
  border: 1px solid var(--line);
  border-radius: var(--r-card);
  padding: 20px 22px;
  margin: 16px 0;
  overflow-x: auto;
  box-shadow: var(--shadow), inset 0 1px 0 rgba(255, 255, 255, .05);
  transition: transform .35s var(--ease-lift), border-color .35s,
              box-shadow .35s;
}
.card:hover, .card.lift:hover {
  transform: translateY(-2px);
  border-color: var(--line-hi);
  box-shadow: var(--shadow-hi), inset 0 1px 0 rgba(255, 255, 255, .05);
}
.card h2 { margin-top: 0; }
.card h2::before, .card h2::after { content: none; }
/* Чемпион — единственная золотая панель на странице. */
.card.champion-card {
  border-color: rgba(200, 170, 110, .55);
  background: linear-gradient(135deg, rgba(200, 170, 110, .1), rgba(200, 170, 110, .02));
  box-shadow: 0 0 30px rgba(200, 170, 110, .1),
              inset 0 1px 0 rgba(255, 255, 255, .05);
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-head);
  font-size: 15px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.card.champion-card .winner { color: var(--gold); }
.card.champion-card svg { width: 18px; height: 18px; color: var(--gold); flex: 0 0 18px; }

/* ── Таблицы — стиль таблиц дэшборда: hairline-строки потише,
   капс-шапка 11px/.12em, золотой hover, единый ритм padding ── */
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--line-soft); }
th {
  color: var(--faint);
  font-weight: 600;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
tbody tr { transition: background .12s var(--ease); }
tbody tr:hover td { background: rgba(200, 170, 110, .045); }
tr:last-child td { border-bottom: none; }
td { color: var(--text-soft); font-variant-numeric: tabular-nums; }

/* Ник в лидерборде — строго одна строка (одна строка = один игрок),
   сверхдлинный обрезается троеточием. Ссылка на op.gg — в колонке
   «Ссылки» (родной синий PNG), отдельной колонки нет. */
td.pname { max-width: 320px; white-space: nowrap; }
td.pname a.pname-link {
  color: var(--text); font-weight: 600;
  display: inline-block;
  max-width: 260px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  vertical-align: -4px;
}
td.pname a.pname-link:hover { color: var(--gold-hi); }
.team-card li { overflow-wrap: anywhere; }
.team-card ul { margin: 8px 0 0; padding-left: 18px; }

/* Позиция в лидерборде — крупная display-цифра; топ-3 — золото
   с убывающей насыщенностью. */
td.rank {
  font-family: var(--font-head);
  font-weight: 600;
  font-size: 19px;
  color: var(--dim);
}
td.rank.m1 { color: var(--gold-hi); font-size: 22px; }
td.rank.m2 { color: var(--gold); }
td.rank.m3 { color: rgba(200, 170, 110, .65); }
tr.m1 td { background: rgba(200, 170, 110, .05); }

/* Винрейт-полоска: hairline-бар, заполнение золотом + число. */
.wr { display: flex; align-items: center; gap: 8px; min-width: 110px; }
.wr svg.wr-bar { flex: 1; height: 7px; display: block; }
.wr svg.wr-bar .wr-bg { fill: rgba(255, 255, 255, .07); }
.wr svg.wr-bar .wr-fg { fill: var(--gold); }
.wr .val { font-weight: 600; font-size: 13px; min-width: 42px; font-variant-numeric: tabular-nums; }

/* ── Тэги статусов и чипы: капс, hairline ────────────────── */
.badge {
  display: inline-block;
  padding: 3px 11px;
  border-radius: var(--r-pill, 999px);
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, .02);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--dim);
  white-space: nowrap;
}
.badge.ongoing { color: var(--gold-hi); border-color: rgba(200, 170, 110, .55); background: rgba(200, 170, 110, .08); }
.badge.finished { color: var(--dim); border-color: var(--line-hi); }
.badge.cancelled { color: var(--red); border-color: rgba(200, 55, 55, .4); }
.badge.registration { color: var(--gold); border-color: rgba(200, 170, 110, .4); }
.badge.closed { color: var(--dim); border-color: var(--line-hi); }
/* Тип по учёту статистики: фановые события помечены приглушённо. */
.badge.fun { color: var(--dim); border-color: var(--line-hi); letter-spacing: .18em; }
/* Мод драфта чемпионов (этап 75) — акцентный фиолетовый, как у темы. */
.badge.mod { color: var(--gold-hi); border-color: rgba(200, 170, 110, .55); background: rgba(200, 170, 110, .07); }
/* Партнёрский турнир (этап B): метка tenant-гильдии. */
.badge.partner { color: var(--gold); border-color: rgba(200, 170, 110, .5); background: rgba(200, 170, 110, .07); }
.badge.plat {
  padding: 2px 9px; font-size: 9px;
  color: var(--muted);
  border: 1px solid var(--line);
}
/* KDA-чипы на страницах матчей. */
.chip {
  display: inline-block;
  padding: 3px 10px;
  border-radius: var(--r-pill, 999px);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, .02);
  white-space: nowrap;
  color: var(--dim);
}
.chip.win { color: var(--gold-hi); border-color: rgba(200, 170, 110, .45); }
.chip.lose { color: var(--red); border-color: rgba(200, 55, 55, .4); }
.chip.kda { font-variant-numeric: tabular-nums; letter-spacing: .12em; color: var(--text); }
/* Иконка внутри чипа (op.gg/tracker): без явного размера SVG занимал бы
   всю строку — фиксируем 11px в одну линию с текстом. */
.chip svg { width: 11px; height: 11px; display: inline-block; vertical-align: -1px; }
/* Мини-иконки результата в разборах матчей (✓/✕ — inline SVG). */
.res { display: inline-flex; width: 13px; height: 13px; vertical-align: -2px; }
.res svg { width: 13px; height: 13px; display: block; }
.res.win { color: var(--gold); }
.res.lose { color: var(--red); }
/* Галочка прошедшего дальше в лобби. */
.adv { display: inline-flex; width: 12px; height: 12px; color: var(--gold); vertical-align: -1px; }
.adv svg { width: 12px; height: 12px; display: block; }

/* ── Счётчики-плитки: KPI-bento дэшборда — градиент, золотой блик
   на hover, lift -3px; цифры Oswald tabular + data-count ── */
.stat-tiles { display: flex; gap: 14px; flex-wrap: wrap; margin: 18px 0 6px; }
.stat-tile {
  flex: 1; min-width: 150px;
  position: relative; overflow: hidden;
  background: var(--tile-bg);
  border: 1px solid var(--line);
  border-radius: var(--r-tile);
  padding: 20px 22px 16px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
  transition: transform .3s var(--ease-lift), border-color .3s;
  /* Колонка: число прижимает подпись к низу — baseline подписей
     одинаков и при длинном тексте («Калибровка» меньшим кеглем). */
  display: flex; flex-direction: column;
}
.stat-tile::before {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(300px 90px at 20% -30px,
    rgba(200, 170, 110, .10), transparent 70%);
  opacity: 0; transition: opacity .35s;
}
.stat-tile:hover {
  transform: translateY(-3px);
  border-color: rgba(200, 170, 110, .38);
}
.stat-tile:hover::before { opacity: 1; }
.stat-tile .num {
  font-family: var(--font-head);
  font-size: 40px; font-weight: 600; line-height: 1;
  font-variant-numeric: tabular-nums;
  color: var(--text);
  flex: 1;
}
/* Текстовые значения («Калибровка») — меньшим кеглем, не за край плитки. */
.stat-tile .num.long { font-size: 22px; line-height: 1.25; }
.stat-tile .lbl {
  color: var(--muted);
  font-size: 9px; font-weight: 700;
  margin-top: 9px;
  text-transform: uppercase;
  letter-spacing: .24em;
}

/* ── Hero: баннер события + кикер + display-заголовок ────── */
.hero {
  position: relative;
  border-radius: var(--r-card);
  overflow: hidden;
  border: 1px solid var(--line);
  margin: 16px 0;
  box-shadow: var(--shadow),
              inset 0 1px 0 rgba(255, 255, 255, .05);
}
.hero img {
  display: block;
  width: 100%;
  height: 220px;
  object-fit: cover;
  transform: scale(1.02);
}
.hero-overlay {
  position: absolute;
  inset: 0;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 40px 26px 22px;
  background:
      linear-gradient(180deg, rgba(4, 5, 7, .05) 0%, rgba(4, 5, 7, .55) 55%, rgba(4, 5, 7, .94) 100%);
}
.hero-overlay h1 {
  margin: 0 0 6px;
  font-size: 40px;
  letter-spacing: .12em;
}
.hero-overlay h1 a { color: inherit; transition: color .15s var(--ease); }
/* Название события — само ссылка: hover понятен золотом и подчёрком. */
.hero-overlay h1 a:hover {
  color: var(--gold-hi);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 6px;
  text-decoration-color: rgba(200, 170, 110, .55);
}
.hero-meta {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--dim);
  display: flex; gap: 10px; flex-wrap: wrap; align-items: center;
}
.hero-meta .badge { vertical-align: 1px; }
.hero.plain { background: var(--panel); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05); }
.hero.plain .hero-overlay { position: static; background: none; padding: 22px 22px; }
.hero.plain .hero-reg { position: static; margin: 0 22px 18px; align-self: flex-start; }

/* «Зарегистрироваться» — прямо на баннере карточки, справа внизу;
   оверлею резервируем место справа, чтобы мета под кнопку не заезжала. */
.hero .hero-reg {
  position: absolute; right: 22px; bottom: 20px; z-index: 2;
}
.hero.has-reg .hero-overlay { padding-right: 210px; }
@media (max-width: 640px) {
  .hero .hero-reg { right: 14px; bottom: 14px; }
  .hero.has-reg .hero-overlay { padding-right: 165px; }
}

/* Стеклянная плашка поверх hero (для главного баннера). */
.hero .glass {
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  background: rgba(4, 5, 7, .55);
  border: 1px solid var(--line-hi);
  border-radius: var(--r-pill, 999px);
  padding: 10px 16px;
  display: inline-flex; gap: 16px; align-items: center; flex-wrap: wrap;
}

/* Обратный отсчёт ближайших событий — display-цифры золотом.
   min-width под худший случай «9д 99ч 99м 99с» (~14ch): сегменты
   не двигаются, когда пропадает день/час. */
.countdown {
  font-family: var(--font-head);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  letter-spacing: .08em;
  color: var(--gold-hi);
  display: inline-block;
  white-space: nowrap;
  min-width: 14.5ch;
}
/* Чип «Ближайший старт» — отсчёт в hero главной. */
.cd-chip {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: var(--font-head);
  font-size: 11px; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--muted);
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-ctl);
  background: var(--panel);
  white-space: nowrap;
}
.cd-chip .cd-lbl { color: var(--dim); }
.countdown .cd-seg {
  display: inline-flex;
  white-space: nowrap;
}
.countdown .cd-seg + .cd-seg { margin-left: .6em; }
.countdown .cd-v {
  display: inline-block;
  width: 2ch;
  text-align: right;
}
.countdown .cd-u {
  display: inline-block;
  width: 1ch;
  text-align: left;
  color: var(--dim); margin-left: .15em; font-size: .86em;
}
.countdown .cd-go { letter-spacing: .18em; text-transform: uppercase; }

/* Список матчей страницы турнира — сетка карточек 2 колонки. */
.match-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
.match-grid .match-row { margin: 0; }
.match-row {
  display: flex; align-items: center; gap: 12px;
  padding: 11px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-in);
  margin: 8px 0;
  background: var(--well);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
  transition: border-color .14s var(--ease);
  flex-wrap: wrap;
}
.match-row:hover { border-color: var(--line-hi); }
.match-row .m-num {
  font-family: var(--font-head);
  font-weight: 500; color: var(--muted); font-size: 12px;
  letter-spacing: .14em; text-transform: uppercase;
  min-width: 58px;
}
.match-row .m-team { font-weight: 600; flex: 1; min-width: 110px; }
.match-row .m-team.right { text-align: right; }
.match-row .m-team.won { color: var(--gold-hi); }
.match-row .m-vs {
  color: var(--muted); font-size: 10px; font-weight: 700;
  letter-spacing: .2em; text-transform: uppercase;
}
.match-row.live { border-color: rgba(200, 170, 110, .55); box-shadow: 0 0 18px rgba(200, 170, 110, .1); }

/* Счётчик онлайна: пульсирующая золотая точка + число. */
.live-dot {
  display: inline-block;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--gold);
  margin-right: 6px;
  animation: sc-pulse 1.6s ease-in-out infinite;
}
@keyframes sc-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .3; transform: scale(.82); }
}
.live-big {
  font-family: var(--font-head);
  font-size: 15px; font-weight: 600; color: var(--gold-hi);
  font-variant-numeric: tabular-nums;
}
.live-link { text-decoration: none; }

.winner { color: var(--gold-hi); font-weight: 600; }
.muted { color: var(--dim); }
.gold { color: var(--gold); }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.team-card { border-top: 2px solid rgba(200, 170, 110, .35); }
.team-card ul { margin: 8px 0 0; padding-left: 4px; list-style: none; }
.team-card li { padding: 3px 0; }

/* Панели составов в стиле капитанского драфта: номер + название +
   счёт слотов в шапке, капитан золотом, строки с pos-иконками. */
.tpanels {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.tpanel {
  border: 1px solid var(--line);
  border-radius: var(--r-in);
  background: var(--tile-bg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
  padding: 10px 12px 6px;
  transition: transform .3s var(--ease-lift), border-color .3s;
}
.tpanel:hover { transform: translateY(-2px); border-color: var(--line-hi); }
.tpanel .tp-head {
  display: flex; align-items: baseline; gap: 8px;
  padding: 0 2px 8px;
  border-bottom: 1px solid var(--line-soft);
  margin-bottom: 4px;
}
.tpanel .tp-num {
  font-family: var(--font-head);
  color: var(--gold); font-size: 15px; font-weight: 600;
}
.tpanel .tp-title {
  flex: 1; font-weight: 600; color: var(--text); font-size: 13px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.tpanel .tp-count {
  color: var(--muted); font-size: 10px; font-weight: 700;
  letter-spacing: .12em; font-variant-numeric: tabular-nums;
}
/* Строка игрока — три фиксированные колонки как в капитанском драфте:
   иконка роли в фикс-слоте, роль фикс-шириной, ник — остаток с ellipsis. */
.tpanel .tp-row {
  display: grid;
  grid-template-columns: 20px 40px minmax(0, 1fr);
  align-items: center; column-gap: 8px;
  padding: 5px 2px;
  border-bottom: 1px solid var(--line-soft);
  min-width: 0;
}
.tpanel .tp-row:last-child { border-bottom: none; }
.tpanel .tp-ico { display: inline-flex; justify-content: center; }
.tpanel .tp-role {
  font-size: 10px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--dim);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.tpanel .tp-pname {
  min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.tpanel .tp-pname a {
  color: var(--text); font-weight: 600; font-size: 13px;
}
.tpanel .tp-pname a:hover { color: var(--gold-hi); }
.tpanel .tp-row.cap .tp-pname a { color: var(--gold); }
.tpanel .tp-row.empty .tp-pname { color: var(--muted); font-size: 12px; }

/* Пустое состояние — тихая заглушка с монохромной иконкой. */
.empty {
  text-align: center;
  padding: 54px 20px;
  color: var(--dim);
}
.empty .e-ico {
  display: inline-flex;
  width: 44px; height: 44px;
  color: var(--muted);
}
.empty .e-ico svg { width: 44px; height: 44px; display: block; }
.empty .e-title {
  font-family: var(--font-head);
  font-size: 15px; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--text); margin: 12px 0 6px;
}

/* Колонка названия турнира — шире остальных, строго одна строка. */
th.tname, td.tname { min-width: 220px; width: 32%; max-width: 340px; }
td.tname a {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Событие в «Последних матчах» профиля — резерв ширины под длинные
   названия, чтобы не сжимало чемпиона/результат/дату. */
th.evt, td.evt { min-width: 200px; width: 34%; }
th.sortable { cursor: pointer; user-select: none; white-space: nowrap; }
th.sortable:hover { color: var(--text); }
/* Стрелка сортировки — CSS-треугольник, золото в активном состоянии. */
.sort-mark {
  display: inline-block;
  width: 0; height: 0;
  margin-left: 6px;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid var(--muted);
  opacity: .4;
  vertical-align: middle;
}
.sort-mark[data-dir="-1"] { border-top-color: var(--gold); opacity: 1; border-top-width: 5px; }
.sort-mark[data-dir="1"] {
  border-top: none;
  border-bottom: 5px solid var(--gold);
  opacity: 1;
}
.search-row { margin: 0 0 10px; }
.search-row input {
  width: 240px; max-width: 100%;
  background: var(--well); border: 1px solid var(--line); color: var(--text);
  border-radius: var(--r-ctl); padding: 8px 12px; font-size: 13px;
  font-family: var(--font-body);
}
.search-row input:focus {
  border-color: rgba(200, 170, 110, .55); outline: none;
  box-shadow: 0 0 0 3px rgba(200, 170, 110, .12);
}

/* Вкладки: монохромные тэги, активная — золото. */
.tabs { display: flex; gap: 8px; margin: 18px 0 8px; flex-wrap: wrap; }
.tab {
  padding: 8px 16px; border-radius: var(--r-ctl); border: 1px solid var(--line);
  background: var(--panel); color: var(--dim);
  font-family: var(--font-head);
  font-size: 12px; font-weight: 500;
  letter-spacing: .16em; text-transform: uppercase;
  cursor: pointer;
  transition: color .14s var(--ease), border-color .14s var(--ease);
}
.tab:hover:not(.active) { color: var(--text); border-color: var(--line-hi); }
.tab.active {
  border-color: rgba(200, 170, 110, .5);
  color: var(--gold-hi);
  background: rgba(200, 170, 110, .07);
}
.tab-pane { display: none; }
.tab-pane.active { display: block; animation: sc-rise .18s var(--ease); }

/* Пагинация лидерборда (?page=N, серверная): ряд номеров под таблицей. */
.pager {
  display: flex; gap: 6px; flex-wrap: wrap;
  margin: 14px 2px 4px;
  font-family: var(--font-head);
}
.pager .pg {
  min-width: 30px; padding: 6px 9px; text-align: center;
  border-radius: var(--r-ctl); border: 1px solid var(--line);
  background: var(--panel); color: var(--dim);
  font-size: 11px; font-weight: 600; letter-spacing: .08em;
  transition: color .14s var(--ease), border-color .14s var(--ease);
}
.pager a.pg:hover { color: var(--gold-hi); border-color: var(--line-hi); }
.pager .pg.cur {
  border-color: rgba(200, 170, 110, .5);
  color: var(--gold-hi);
  background: rgba(200, 170, 110, .07);
}
.tab.disabled {
  opacity: .42;
  cursor: default;
  border-style: dashed;
}
.tab.disabled:hover { color: var(--dim); border-color: var(--line); }
/* Открытая вкладка-ссылка («Сетка»/«Составы» ведут на страницу турнира) —
   внешне обычный таб, без «кнопочного» курсора-акцента. */
a.tab.link { text-decoration: none; }
a.tab.link:hover { color: var(--gold-hi); border-color: rgba(200, 170, 110, .5); }

/* ── Событие как целостная bento-панель: шапка, статусы, кнопки,
   вкладки — тот же gap-ритм и радиус, что у карточек дэшборда ── */
.event-panel {
  border: 1px solid var(--line);
  border-radius: var(--r-card);
  background: var(--card-bg);
  box-shadow: var(--shadow),
              inset 0 1px 0 rgba(255, 255, 255, .05);
  padding: 14px 16px 18px;
  margin: 0 0 18px;
  transition: border-color .35s var(--ease-lift), box-shadow .35s;
}
.event-panel:hover {
  border-color: var(--line-hi);
  box-shadow: var(--shadow-hi), inset 0 1px 0 rgba(255, 255, 255, .05);
}
.event-panel:last-child { margin-bottom: 8px; }
/* Баннер единого стиля (этап 76): внутри карточки тот же .hero —
   радиус --r-card, рамка, тень, высота 220px, как на главной. */
.event-panel .hero { margin: 0 0 8px; }
.event-panel .tabs { margin: 14px 0 8px; }
/* Контент-зона карточки по высоте контента (этап 74): плитки сами
   срезаются peek-маской в 1.5 строки — пустоты под блоком нет. */
.event-panel .tab-pane.active { display: flex; flex-direction: column; }
.event-panel .tab-pane > * { width: 100%; margin-top: auto; margin-bottom: auto; }
.event-panel .tab-pane > .card { overflow-x: hidden; }

/* Карточки трансляций на панели события: ник + канал + зрители.
   4 колонки (этап 74): первый ряд целиком, второй — половинный
   затемнённый peek-срез, как у плитки участников. */
.scards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
/* Второй ряд наполовину виден и уходит в фейд — маской (как .plist.peek):
   карточка ~63px + зазор 10px → clip на ~98px, гасим с ~70px. */
.scards.peek {
  max-height: 98px; overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, #000 0 70px, transparent 98px);
  mask-image: linear-gradient(to bottom, #000 0 70px, transparent 98px);
}
.scard {
  display: flex; flex-direction: column; gap: 3px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-in);
  background: var(--tile-bg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
  transition: transform .3s var(--ease-lift), border-color .3s;
}
.scard:hover { transform: translateY(-2px); border-color: var(--line-hi); }
.scard.dim { opacity: .45; }
.scard .s-top {
  display: flex; justify-content: space-between; gap: 10px;
  align-items: baseline;
}
.scard .s-nick { font-weight: 600; color: var(--text); }
.scard .s-view {
  color: var(--gold-hi); font-weight: 600; font-size: 12px;
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.scard .s-chan {
  font-size: 11px; letter-spacing: .06em;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* «Трансляции» внутри карточки события (этап 76): фикс-окно ~400px
   как у эмбеда стрима — не растягивается по контенту, внутри скролл. */
.event-panel .tab-pane[id$="-streams"] {
  height: 400px;
  overflow-y: auto;
}

/* Партнёры-стримеры на главной: до 3 карточек-ссылок под hero.
   Фон — картинка из ассетов, контент поверх затемнения. */
.partners { margin: 18px 0 8px; }
.partners .sec-head { margin-bottom: 12px; }
.partners .sec-head h2 { margin: 0; font-size: 22px; }
.pcards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.pcard {
  position: relative;
  display: block;
  height: 180px;
  border: 1px solid var(--line);
  border-radius: var(--r-card);
  overflow: hidden;
  color: var(--text); text-decoration: none;
  background: var(--panel);
  box-shadow: var(--shadow), inset 0 1px 0 rgba(255, 255, 255, .05);
  transition: transform .3s var(--ease-lift), border-color .3s;
}
.pcard:hover { transform: translateY(-2px); border-color: var(--line-hi); }
.pcard .pc-bg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transform: scale(1.02);
}
.pcard .pc-body {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 14px 16px;
  background:
    linear-gradient(180deg, rgba(4, 5, 7, .08) 0%, rgba(4, 5, 7, .5) 55%, rgba(4, 5, 7, .92) 100%);
}
.pcard .pc-status {
  align-self: flex-start;
  font-size: 10px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase;
  padding: 3px 9px; margin-bottom: auto;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(4, 5, 7, .55);
  color: var(--dim);
}
.pcard .pc-status.live { color: var(--gold-hi); border-color: rgba(200, 170, 110, .5); }
.pcard .pc-nick {
  font-size: 20px; font-weight: 700; letter-spacing: .02em;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pcard .pc-login {
  font-size: 11px; letter-spacing: .08em; color: var(--dim);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* Плитка участников: 4 колонки (этап 74), вторая строка затемнена.
   Строка однострочная — pos-иконка слева, ник с ellipsis. */
.plist {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.prow {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: var(--r-ctl);
  background: var(--well);
  transition: border-color .15s var(--ease);
  min-width: 0;
}
.prow:hover { border-color: var(--line-hi); }
.prow.dim { opacity: .45; }
/* Карточка на главной: первая строка целиком + вторая видна наполовину
   и уходит в фейд — маской, чтобы срез не был резким.
   Строка ~33px + зазор 8px → clip на 58px (1 + 0.5 строки, этап 74). */
.plist.peek {
  max-height: 58px; overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, #000 0 36px, transparent 58px);
  mask-image: linear-gradient(to bottom, #000 0 36px, transparent 58px);
}
/* Пустой слот-призрак: добивает плитку до 3×4 — зона не проваливается. */
.prow.ghost { border-style: dashed; opacity: .3; cursor: default; }
.prow.ghost:hover { border-color: var(--line); }
/* Teams + RTC: заголовок premade-команды — на всю строку сетки,
   за ним её члены. Агенты — тем же стилем, приглушённее (этап 75). */
.prow.pteam {
  grid-column: 1 / -1;
  border-color: rgba(200, 170, 110, .35);
  background: rgba(200, 170, 110, .06);
}
.prow.pteam .p-nick { color: var(--gold-hi); letter-spacing: .04em; }
.prow.pteam.agents { border-color: var(--line); background: var(--well); }
.prow.pteam.agents .p-nick { color: var(--dim); }
.prow .pos { flex: none; }
.prow .p-nick {
  color: var(--text); font-weight: 600; font-size: 12.5px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* Кнопки события: «Зарегистрироваться» — золотая primary-заливка
   (главный фокус ряда), прочие — hairline-ссылки. */
.ep-actions {
  display: flex; gap: 8px; flex-wrap: wrap;
  padding: 12px 2px 2px;
}
.btn-gold, .btn-line {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-head);
  font-size: 11px; font-weight: 600;
  letter-spacing: .18em; text-transform: uppercase;
  padding: 9px 16px;
  border-radius: var(--r-ctl);
}
.btn-line {
  transition: border-color .15s var(--ease), color .15s var(--ease),
              background .15s var(--ease), box-shadow .15s var(--ease);
}
.btn-gold {
  color: #10141b;
  border: 1px solid var(--gold);
  background: var(--gold);
  box-shadow: 0 2px 14px rgba(200, 170, 110, .28);
  /* Спокойная primary-заливка — без transition/animation/бликов. */
  animation: none;
  transition: none;
}
.btn-gold:hover {
  color: #10141b; /* без этого a:hover красил текст в --gold-hi на золотом */
  border-color: var(--gold-hi);
  background: var(--gold-hi);
  box-shadow: 0 2px 18px rgba(200, 170, 110, .4);
}
/* Нет заданной ссылки-инвайта (этап 74): кнопка на месте, но мёртвая —
   приглушена, без hover, с подсказкой в title. */
.btn-gold.disabled {
  opacity: .45;
  cursor: not-allowed;
  box-shadow: none;
}
.btn-line {
  color: var(--muted);
  border: 1px solid var(--line);
  background: var(--panel);
}
.btn-line:hover { color: var(--text); border-color: var(--line-hi); }
.btn-line.dim { opacity: .5; }



/* Иконки ссылок — родные цвета сервисов, без перекраски в золото. */
.links-cell { display: flex; gap: 8px; align-items: center; }
.link-icon {
  width: 18px; height: 18px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-ctl); flex: 0 0 18px;
  color: var(--dim);
  transition: filter .14s var(--ease);
}
.link-icon:hover { filter: brightness(1.25); }
.link-icon svg { width: 18px; height: 18px; display: block; }
/* Родные цвета сервисов. */
.link-icon.twitch { color: #9146FF; }
.link-icon.tg { color: #2AABEE; }
.link-icon.x { color: #e8e9ec; }
.link-icon.opgg { width: 19px; height: 19px; flex-basis: 19px; }
.link-icon .opgg-img {
  width: 19px; height: 19px; display: block;
  border-radius: 4px;
}
.link-icon.lp {
  width: auto; flex: 0 0 auto;
  padding: 2px 7px;
  border: 1px solid var(--line);
  border-radius: var(--r-pill, 999px);
  font-size: 9px; font-weight: 800; letter-spacing: .18em;
}
.link-icon.lp:hover { border-color: rgba(200, 170, 110, .5); }
.chart { width: 100%; max-width: 760px; display: block; }
.bracket-zone { display: block; overflow-x: auto; padding: 4px 0 8px; }

/* Иконка чемпиона в разборах матчей. */
.champ-ico {
  width: 20px; height: 20px; border-radius: 6px;
  vertical-align: middle; margin-right: 4px;
}

/* Иконка позиции — монохромная mask-иконка pos-SVG + мелкий капс. */
.pos {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  vertical-align: middle;
}
.pos i {
  display: inline-block;
  width: 14px; height: 14px;
  background: var(--dim);
  mask: center / contain no-repeat;
  -webkit-mask: center / contain no-repeat;
}
.pos i.pos-top { mask-image: url("/static/pos/top.svg"); -webkit-mask-image: url("/static/pos/top.svg"); }
.pos i.pos-jng { mask-image: url("/static/pos/jng.svg"); -webkit-mask-image: url("/static/pos/jng.svg"); }
.pos i.pos-mid { mask-image: url("/static/pos/mid.svg"); -webkit-mask-image: url("/static/pos/mid.svg"); }
.pos i.pos-adc { mask-image: url("/static/pos/adc.svg"); -webkit-mask-image: url("/static/pos/adc.svg"); }
.pos i.pos-sup { mask-image: url("/static/pos/sup.svg"); -webkit-mask-image: url("/static/pos/sup.svg"); }
.pos .pos-lbl {
  font-size: 10px; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--dim);
}

/* Ранг аккаунта — крошечный ромб-маркер в цвете тира (как на драфте),
   НЕ цветная плашка. */
.rank-mark {
  display: inline-block;
  width: 7px; height: 7px;
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
  background: var(--muted);
  vertical-align: 1px;
}
.rank-mark.rank-iron { background: #8C8C8C; }
.rank-mark.rank-bronze { background: #A67547; }
.rank-mark.rank-silver { background: #AAB4C3; }
.rank-mark.rank-gold { background: #D6B255; }
.rank-mark.rank-platinum { background: #50B4A0; }
.rank-mark.rank-emerald { background: #3CAA69; }
.rank-mark.rank-diamond { background: #698CEB; }
.rank-mark.rank-ascendant { background: #78C8A0; }
.rank-mark.rank-master { background: #A069D2; }
.rank-mark.rank-grandmaster { background: #C85A64; }
.rank-mark.rank-challenger { background: #EBBE5A; }
.rank-mark.rank-immortal { background: #C8505A; }
.rank-mark.rank-radiant { background: #F0D26E; }

/* Подзаголовки внутри зон («Раунд N» в лобби). */
h3 {
  font-family: var(--font-head);
  font-size: 12px; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--dim);
  margin: 18px 0 8px;
}

/* ── Профиль игрока ─────────────────────────────────────── */
.profile-head {
  display: flex; gap: 20px; align-items: center; flex-wrap: wrap;
}
.avatar {
  width: 72px; height: 72px; border-radius: var(--r-in);
  border: 1px solid rgba(200, 170, 110, .45);
  background: rgba(200, 170, 110, .06);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-head);
  font-size: 34px; font-weight: 600; color: var(--gold-hi);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
  flex: 0 0 72px;
}
/* Крупный аватар профиля — текущая аватарка Discord (или заглушка). */
.avatar-img {
  width: 112px; height: 112px; border-radius: var(--r-tile);
  border: 1px solid rgba(200, 170, 110, .45);
  background: var(--panel2);
  object-fit: cover;
  flex: 0 0 112px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06),
              0 10px 26px rgba(0, 0, 0, .4);
}
.avatar-img.avatar-empty { opacity: .85; }
/* Аккаунты — ровная сетка строк: иконка / ник / платформа / ранг / ссылка. */
.acct-rows { display: grid; gap: 6px; margin-top: 10px; }
.acct-row {
  display: grid;
  grid-template-columns: 22px minmax(140px, 1fr) auto minmax(150px, auto) auto;
  gap: 10px; align-items: center;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: var(--r-in);
  background: var(--well);
}
.acct-row:hover { border-color: var(--line-hi); }
.acct-row .a-ico { width: 16px; height: 16px; color: var(--dim); }
.acct-row .a-ico svg { width: 16px; height: 16px; display: block; }
.acct-row .a-name { font-weight: 600; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.acct-row .a-rank { display: inline-flex; align-items: center; gap: 6px; }
/* Внешняя ссылка аккаунта — компактная строка-чип, не переносится. */
.acct-row .chip { display: inline-flex; align-items: center; gap: 5px; }
/* История турниров: название — гибкая колонка, дата/команда/результат — фикс. */
table.history td.w-name, table.history th:first-child {
  min-width: 220px;
}
table.history td { white-space: nowrap; }
table.history td.w-name { white-space: normal; }
@media (max-width: 720px) {
  .avatar-img { width: 96px; height: 96px; flex-basis: 96px; }
  .acct-row { grid-template-columns: 22px minmax(0, 1fr) auto; }
  .acct-row .a-rank { grid-column: 2; }
}
.p-name { margin: 0; overflow-wrap: anywhere; }
/* Текстовая колонка шапки профиля: длинные никнеймы переносятся,
   а не уходят за экран (min-width нужен flex-ребёнку для переноса). */
.profile-head > div { min-width: 0; }
.profile-head .hero-meta { overflow-wrap: anywhere; }
.game-rates { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.game-rate {
  border: 1px solid var(--line);
  border-radius: var(--r-in);
  padding: 10px 16px;
  background: var(--well);
  min-width: 120px;
}
.game-rate .g-name {
  font-size: 9px; color: var(--muted); text-transform: uppercase;
  letter-spacing: .22em; font-weight: 700;
}
.game-rate .g-val {
  font-family: var(--font-head);
  font-weight: 600; font-size: 17px; margin-top: 3px;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere; line-height: 1.25;
}

/* Блоки внутри карточек (команды матч-статы). Победившая сторона —
   золотое имя команды и тонкая кромка слева у её таблицы. */
.mside { margin-top: 12px; }
.mside:first-of-type { margin-top: 6px; }
.mstats-team { margin: 0 0 6px; }
.mside.won .mstats-team strong { color: var(--gold-hi); }
.mside.won table { border-left: 2px solid rgba(200, 170, 110, .45); }
/* Колонка ника — ограничена, длинный ник не сдвигает таблицу. */
td.ms-name { max-width: 200px; }
td.ms-name a {
  display: block; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap;
}

/* 404/ошибки — большая display-цифра + капс. */
.err-card { text-align: center; padding: 48px 16px; }
.err-code {
  font-family: var(--font-head);
  font-size: 64px; font-weight: 700;
  letter-spacing: .12em;
  line-height: 1;
  margin-bottom: 10px;
}

/* ── Моушн дэшборда: scroll-reveal (fade + translateY 14px,
   staggered по nth-child, только transform/opacity). Скрытое
   состояние — лишь при живом JS (body.js ставит site.js): без
   скрипта контент виден сразу, ничего не зависает прозрачным. ── */
body.js .reveal {
  opacity: 0; transform: translateY(14px);
  transition: opacity .55s var(--ease-lift),
              transform .55s var(--ease-lift);
}
body.js .reveal.in { opacity: 1; transform: none; }
/* Каскад сверху вниз на старте страницы. */
.container > .reveal:nth-child(2) { transition-delay: .05s; }
.container > .reveal:nth-child(3) { transition-delay: .1s; }
.container > .reveal:nth-child(4) { transition-delay: .15s; }
.container > .reveal:nth-child(5) { transition-delay: .2s; }
.container > .reveal:nth-child(n+6) { transition-delay: .25s; }
/* После .in transform зафиксирован — hover-lift возвращаем явно. */
body.js .reveal.in.card:hover { transform: translateY(-2px); }
body.js .reveal.in.stat-tile:hover { transform: translateY(-3px); }
@keyframes sc-rise {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

/* ── Мобильная адаптация ───────────────────────────────── */
@media (max-width: 760px) {
    .container { padding: 14px 12px 50px; }
    /* Навигация — два ровных ряда: бренд+иконки сверху, три вкладки
       строкой снизу (без рваного flex-wrap посреди вкладок). */
    .nav {
        display: grid;
        grid-template-columns: auto 1fr auto;
        column-gap: 8px; row-gap: 8px;
        padding: 8px 12px;
    }
    .nav .brand { font-size: 11px; letter-spacing: .14em; margin-right: 0; padding-right: 0; border-right: none; align-self: center; justify-self: start; grid-column: 1; grid-row: 1; }
    .nav .right { grid-column: 3; grid-row: 1; justify-self: end; align-self: center; }
    .nav a.tablink { grid-row: 2; font-size: 10px; padding: 6px 9px; letter-spacing: .06em; justify-self: stretch; text-align: center; }
    .nav .search input { width: 140px; }
    th, td { padding: 8px 6px; font-size: 13px; }
    .card { padding: 16px 14px; border-radius: 14px; }
    .event-panel { padding: 10px 12px 14px; }
    .grid { grid-template-columns: 1fr; }
    th.tname, td.tname { min-width: 140px; width: auto; }
    h1 { font-size: 24px; }
    .hero img { height: 150px; }
    .hero-overlay { padding: 24px 16px 14px; }
    .hero-overlay h1 { font-size: 26px; }
    .stat-tile .num { font-size: 30px; }
    .match-grid { grid-template-columns: 1fr; }
    .match-row .m-team { min-width: 90px; font-size: 13px; }
    /* Плитка участников/трансляций — две колонки, половинная вторая
       строка и затемнение сохраняются; зона по контенту (этап 74). */
    .plist, .scards { grid-template-columns: repeat(2, 1fr); }
    .tpanels { grid-template-columns: repeat(2, 1fr); }
    /* Партнёрские карточки — колонкой, компактнее по высоте. */
    .pcards { grid-template-columns: 1fr; }
    .pcard { height: 140px; }
    .foot { padding: 12px; }
}

/* ≤480px: широкие таблицы превращаются в карточки-строки:
   у td в разметке есть data-label — подставляем его слева. */
@media (max-width: 480px) {
    table.responsive thead { display: none; }
    table.responsive, table.responsive tbody, table.responsive tr { display: block; }
    table.responsive tr {
        border: 1px solid var(--line);
        border-radius: 10px;
        margin: 10px 0;
        padding: 8px 10px;
        background: rgba(255, 255, 255, .02);
    }
    table.responsive td {
        display: flex; justify-content: space-between; gap: 12px;
        border: none; padding: 5px 2px; text-align: right;
    }
    table.responsive td::before {
        content: attr(data-label);
        color: var(--muted);
        font-size: 10px; font-weight: 700;
        letter-spacing: .16em;
        text-transform: uppercase;
        text-align: left;
    }
    .tpanels { grid-template-columns: 1fr; }
    /* Ник (+op.gg-иконка) в карточке-строке — вправо, одна строка. */
    table.responsive td.pname {
        justify-content: flex-end; gap: 8px;
    }
    table.responsive td.pname a.pname-link {
        max-width: 56%;
        text-align: right;
    }
    /* Одна колонка — зона по контенту, peek-срез не меняется. */
    .plist, .scards { grid-template-columns: 1fr; }
    .nav .search { order: 3; width: 100%; }
    .nav .search input { width: 100%; max-width: 100%; }
}

/* Меньше движения — всё гасим целиком: без reveal-скрытия,
   лифтов, шиммера и счётчиков. */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01s !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01s !important;
    }
    .reveal { opacity: 1 !important; transform: none !important; }
}