/* ЦРЕ. Цвета и шрифт из логобука: красный #E31E25, синий #393186, серый #B2B3B3, PT Sans.
   Язык «плакат»: прямые углы, волосяные линии вместо карточек с тенями, один акцент на экран. */

@font-face { font-family: "PT Sans"; font-weight: 400; font-display: swap;
  src: url("../fonts/pt-sans-cyrillic-400.f2664d403038.woff2") format("woff2"); unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "PT Sans"; font-weight: 400; font-display: swap;
  src: url("../fonts/pt-sans-latin-400.3f66ddcf744f.woff2") format("woff2"); unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+2212; }
@font-face { font-family: "PT Sans"; font-weight: 700; font-display: swap;
  src: url("../fonts/pt-sans-cyrillic-700.5e1ae1c98141.woff2") format("woff2"); unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "PT Sans"; font-weight: 700; font-display: swap;
  src: url("../fonts/pt-sans-latin-700.35e5705c45cf.woff2") format("woff2"); unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+2212; }
@font-face { font-family: "PT Sans Narrow"; font-weight: 700; font-display: swap;
  src: url("../fonts/pt-sans-narrow-cyrillic-700.44a1f884316e.woff2") format("woff2"); unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "PT Sans Narrow"; font-weight: 700; font-display: swap;
  src: url("../fonts/pt-sans-narrow-latin-700.a2c7aa6e8718.woff2") format("woff2"); unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+2212; }

:root {
  --red: #e31e25; --red-dark: #b8161c;
  --blue: #393186; --blue-dark: #262062; --blue-tint: #f0eff8;
  --grey: #b2b3b3; --ink: #1b1a2e; --muted: #626272; --line: #dcdce3; --line-strong: #1b1a2e;
  --paper: #fff; --ok: #177a43; --warn: #9a5b00;
  --font: "PT Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --head: "PT Sans Narrow", "PT Sans", system-ui, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; }
/* Рамка фокуса — только с клавиатуры: на телефоне после нажатия не остаётся синего квадрата */
:focus:not(:focus-visible) { outline: none; }
/* Атрибут hidden сильнее любых display у компонентов */
[hidden] { display: none !important; }
body { margin: 0; font: 16px/1.5 var(--font); color: var(--ink); background: var(--paper); min-height: 100vh; display: flex; flex-direction: column; }
main { flex: 1; }
img { max-width: 100%; display: block; }
a { color: var(--blue); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--red); }
h1, h2, h3 { font-family: var(--head); font-weight: 700; line-height: 1.05; margin: 0 0 .4em; text-transform: uppercase; }
h1 { font-size: clamp(30px, 5.2vw, 52px); }
h2 { font-size: clamp(22px, 3vw, 30px); }
h3 { font-size: 19px; }
p { margin: 0 0 1em; }
.muted { color: var(--muted); }
.name-hidden { color: var(--muted); font-weight: 400; }
.small { font-size: 14px; }
.num { font-variant-numeric: tabular-nums; }
.container { width: 100%; max-width: 1180px; margin: 0 auto; padding-left: 16px; padding-right: 16px; }
.section { padding-top: 40px; padding-bottom: 40px; }
.row { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.spacer { flex: 1; }
.stack > * + * { margin-top: 24px; }

/* Шапка: логотип в полном цвете на белом — так требует логобук */
.topbar { background: var(--paper); position: sticky; top: 0; z-index: 50; border-bottom: 1px solid var(--line); }
.topbar .container { display: flex; align-items: center; gap: 28px; min-height: 68px; }
.brand { display: flex; align-items: center; flex: none; }
.brand img { height: 56px; width: auto; }
.nav { display: flex; gap: 22px; }
.nav a { color: var(--ink); text-decoration: none; font-family: var(--head); font-size: 18px; text-transform: uppercase; padding: 22px 0 19px; border-bottom: 3px solid transparent; }
.nav a:hover { color: var(--blue); }
.nav a.active { color: var(--blue); border-bottom-color: var(--red); }
.auth { margin-left: auto; display: flex; align-items: center; gap: 14px; }
.auth .user { color: var(--ink); font-weight: 700; text-decoration: none; }
.menu-toggle { display: none; margin-left: auto; background: none; border: 0; cursor: pointer; padding: 8px 0 8px 8px; }
.menu-toggle span { display: block; width: 24px; height: 2px; background: var(--ink); margin: 5px 0; }
@media (max-width: 900px) {
  .brand img { height: 44px; }
  .menu-toggle { display: block; }
  .topbar .container { flex-wrap: wrap; gap: 0; }
  .nav, .auth { display: none; width: 100%; }
  .topbar.open .nav { display: flex; flex-direction: column; gap: 0; border-top: 1px solid var(--line); }
  .topbar.open .nav a { padding: 12px 0; border-bottom: 1px solid var(--line); }
  .topbar.open .nav a.active { border-bottom-color: var(--line); color: var(--red); }
  .topbar.open .auth { display: flex; margin: 0; padding: 12px 0 16px; }
}

/* Кнопки */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: var(--red); color: #fff; border: 2px solid var(--red);
  padding: 10px 20px; font: 700 15px/1.2 var(--font); text-transform: uppercase; letter-spacing: .03em; text-decoration: none; cursor: pointer; white-space: nowrap; }
.btn:hover { background: var(--red-dark); border-color: var(--red-dark); color: #fff; }
.btn-blue { background: var(--blue); border-color: var(--blue); } .btn-blue:hover { background: var(--blue-dark); border-color: var(--blue-dark); }
.btn-outline { background: transparent; color: var(--ink); border-color: var(--ink); }
.btn-outline:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.btn-white { background: #fff; color: var(--blue); border-color: #fff; } .btn-white:hover { background: transparent; color: #fff; }
.btn-vk { background: #005fd1; border-color: #005fd1; } .btn-vk:hover { background: #004aa3; border-color: #004aa3; }
.btn-sm { padding: 6px 12px; font-size: 13px; }
.btn-block { width: 100%; }
.link-btn { background: none; border: 0; padding: 0; color: var(--blue); font: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

/* Переключатели (вид спорта, дисциплина, сезон) — текст с подчёркиванием, без «таблеток» */
.switch { display: flex; gap: 24px; flex-wrap: wrap; border-bottom: 1px solid var(--line); margin-bottom: 24px; }
.switch a { padding: 10px 0; color: var(--muted); text-decoration: none; font-weight: 700; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.switch a:hover { color: var(--ink); }
.switch a.on { color: var(--ink); border-bottom-color: var(--red); }

/* Заголовок раздела: текст + жирная линия */
.head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; border-bottom: 2px solid var(--line-strong); padding-bottom: 8px; flex-wrap: wrap; }
.head h2 { margin: 0; }
.head a { font-weight: 700; }

/* Строки списков: турниры, клубы */
.rows { list-style: none; margin: 0; padding: 0; }
.rows > li { border-bottom: 1px solid var(--line); }
.rowlink { display: grid; grid-template-columns: 96px 1fr auto; gap: 20px; align-items: center; padding: 16px 0; color: inherit; text-decoration: none; }
.rowlink:hover { color: inherit; }
.rowlink:hover .rowtitle { color: var(--red); }
.rowtitle { font-weight: 700; font-size: 18px; line-height: 1.25; }
.rowmeta { color: var(--muted); font-size: 14px; margin-top: 2px; }
.date { font-family: var(--head); text-transform: uppercase; line-height: 1; }
.date b { display: block; font-size: 40px; color: var(--red); }
.date span { font-size: 14px; color: var(--muted); }
.poster-thumb { width: 96px; aspect-ratio: 1; object-fit: cover; background: var(--blue-tint); }
.kind { font-family: var(--head); font-size: 14px; text-transform: uppercase; color: var(--blue); letter-spacing: .04em; }
.kind.kick { color: var(--red); }
.state { font-size: 13px; font-weight: 700; color: var(--ok); white-space: nowrap; }
@media (max-width: 600px) {
  .rowlink { grid-template-columns: 64px 1fr; gap: 14px; }
  .rowlink > .state { grid-column: 2; }
  .poster-thumb { width: 64px; }
  .date b { font-size: 30px; }
  .rowtitle { font-size: 16px; }
}

/* Таблицы */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table.table { width: 100%; border-collapse: collapse; font-size: 15px; }
.table th { text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; padding: 10px 12px 8px 0; border-bottom: 2px solid var(--line-strong); white-space: nowrap; }
.table td { padding: 11px 12px 11px 0; border-bottom: 1px solid var(--line); vertical-align: middle; }
.table td.num, .table th.num { text-align: right; }
.table td:last-child, .table th:last-child { padding-right: 0; }
.table tbody tr:hover { background: var(--blue-tint); }
.table a { font-weight: 700; text-decoration: none; }
.table a:hover { text-decoration: underline; }
/* Таблица .fold на телефоне: строка складывается без прокрутки вбок.
   f-main — имя крупно, f-sub — остальные колонки одной мелкой строкой ниже,
   f-lead — место слева (таблице нужен fold-lead), f-end — баллы справа (fold-end).
   f-pre — подпись, видная только в сложенной строке. */
.table .f-pre { display: none; }
@media (max-width: 600px) {
  .table.fold thead { display: none; }
  .table.fold, .table.fold tbody { display: block; }
  .table.fold tr { position: relative; display: flex; flex-wrap: wrap; align-items: baseline; padding: 10px 0; border-bottom: 1px solid var(--line); }
  .table.fold.fold-lead tr { padding-left: 48px; }
  .table.fold.fold-end tr { padding-right: 72px; }
  .table.fold td { display: block; border: 0; padding: 0; text-align: left; }
  .table.fold .f-main { flex: 1 0 100%; font-size: 16px; }
  .table.fold .f-sub { font-size: 13px; color: var(--muted); }
  .table.fold .f-sub:empty { display: none; }
  .table.fold .f-sub:not(:empty) ~ .f-sub:not(:empty)::before { content: "·"; margin: 0 6px; }
  .table.fold .f-pre { display: inline; }
  .table.fold .f-lead, .table.fold .f-end { position: absolute; top: 0; bottom: 0; display: flex; align-items: center; }
  .table.fold .f-lead { left: 0; width: 40px; }
  .table.fold .f-end { right: 0; justify-content: flex-end; font: 700 20px/1 var(--head); }
  .table.fold .f-end b { font-weight: inherit; }
  .table.fold .f-act { flex: 1 0 100%; margin-top: 8px; }
  .table.fold .f-act:empty { display: none; }
  .table.fold .f-sub .sub { display: inline; margin: 0 0 0 6px; }
}
.place { font-family: var(--head); font-size: 20px; }
.place-1 { color: #9c7300; } .place-2 { color: #6c707a; } .place-3 { color: #9a5427; }
.result { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.result.win { color: var(--ok); } .result.loss { color: var(--red-dark); } .result.draw { color: var(--muted); }

/* Метка статуса без заливки */
.mark { font-size: 13px; font-weight: 700; white-space: nowrap; }
.mark.ok { color: var(--ok); } .mark.warn { color: var(--warn); } .mark.off { color: var(--muted); }

/* Формы */
.form { display: grid; gap: 16px; }
.field label { display: block; font-weight: 700; font-size: 14px; margin-bottom: 4px; }
.field .help { font-size: 13px; color: var(--muted); margin-top: 4px; }
.field .error { font-size: 13px; color: var(--red-dark); margin-top: 4px; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], input[type=search], input[type=tel], input[type=file], select, textarea {
  width: 100%; font: 16px var(--font); padding: 10px 12px; border: 1px solid #b9b9c4; border-radius: 0; background: #fff; color: var(--ink); }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--blue); outline-offset: -1px; }
input:disabled, select:disabled, textarea:disabled { background: var(--blue-tint); color: var(--muted); border-color: var(--line); cursor: not-allowed; }
input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--blue); margin: 2px 0 0; flex: none; }
.searchbar { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 24px; }
.searchbar input, .searchbar select { flex: 1 1 200px; width: auto; }
.panel { border-top: 2px solid var(--line-strong); padding-top: 20px; }
.box { border: 1px solid var(--line); padding: 20px; }

/* Сообщения */
.alert { padding: 12px 16px; margin-bottom: 16px; background: var(--blue-tint); }
.alert-success { background: #eaf5ee; color: var(--ok); }
.alert-error { background: #fcecec; color: var(--red-dark); }
.alert-warning { background: #fdf3e2; color: var(--warn); }

/* Шевроны из логобука */
.chevrons { position: absolute; right: 0; top: 0; width: 240px; height: 240px; pointer-events: none; }
@media (max-width: 700px) { .chevrons { width: 110px; height: 110px; } }

/* Первый экран главной: фото арены из логобука под синим тоном */
.hero { position: relative; overflow: hidden; color: #fff; background: var(--blue-dark) url("../brand/photo-arena.96cd9d60cdc7.jpg") center 30% / cover; }
.hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(38, 32, 98, .94) 0%, rgba(38, 32, 98, .72) 50%, rgba(38, 32, 98, .15) 100%); }
.hero .container { position: relative; padding-top: 72px; padding-bottom: 80px; }
.hero h1 { max-width: 760px; }
.hero p { font-size: 19px; max-width: 580px; color: rgba(255, 255, 255, .9); }
.hero .actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; }
@media (max-width: 700px) {
  .hero::before { background: linear-gradient(180deg, rgba(38, 32, 98, .9), rgba(38, 32, 98, .78)); }
  .hero .container { padding-top: 44px; padding-bottom: 52px; }
  .hero p { font-size: 17px; }
}

/* Шапка внутренних страниц */
.page-head { position: relative; overflow: hidden; background: var(--blue); color: #fff; }
.page-head .container { position: relative; padding-top: 32px; padding-bottom: 32px; }
.page-head h1 { margin: 0; max-width: 900px; }
.page-head p { margin: 8px 0 0; color: rgba(255, 255, 255, .85); max-width: 70ch; }
.page-head a { color: #fff; }

/* Факты: строка «подпись — значение», как на StrikerStat */
.facts { display: flex; flex-wrap: wrap; gap: 14px 32px; }
.facts div span { display: block; font-size: 13px; color: var(--muted); }
.facts div b { font-size: 17px; }
.score { display: flex; border-top: 2px solid var(--line-strong); border-bottom: 1px solid var(--line); }
.score div { flex: 1; padding: 12px 8px; text-align: center; border-left: 1px solid var(--line); }
.score div:first-child { border-left: 0; }
.score b { display: block; font: 700 34px/1 var(--head); }
.score span { font-size: 13px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }

.profile { display: grid; grid-template-columns: 220px 1fr; gap: 32px; align-items: start; }
.profile-photo { width: 100%; aspect-ratio: 1; object-fit: cover; background: var(--blue-tint); display: grid; place-items: center; }
.profile-photo.empty-photo img { width: 46%; opacity: .35; }
@media (max-width: 700px) { .profile { grid-template-columns: 1fr; gap: 20px; } .profile-photo { width: 140px; font-size: 44px; } }

.split { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px; align-items: start; }
@media (max-width: 860px) { .split { grid-template-columns: minmax(0, 1fr); gap: 24px; } }
.poster { width: 100%; }
.docs { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.kv { display: grid; grid-template-columns: max-content 1fr; gap: 8px 20px; margin: 0; }
.kv dt { color: var(--muted); } .kv dd { margin: 0; font-weight: 700; }

/* Карта */
.map { height: 440px; z-index: 0; border: 1px solid var(--line); }
@media (max-width: 600px) { .map { height: 340px; } }

/* Подвал */
.footer { background: var(--ink); color: rgba(255, 255, 255, .72); margin-top: 56px; font-size: 15px; }
.footer .container { display: flex; gap: 32px; justify-content: space-between; align-items: center; flex-wrap: wrap; padding-top: 28px; padding-bottom: 28px; }
.footer a { color: #fff; }
.footer .logo-mark { height: 30px; width: auto; }
.footer .links { display: flex; flex-wrap: wrap; gap: 8px 20px; font-weight: 700; }
.footer .legal { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 13px; border-top: 1px solid rgba(255, 255, 255, .16); padding-top: 16px; }
.footer .legal a { color: rgba(255, 255, 255, .72); font-weight: 400; }
.footer .legal a:hover { color: #fff; }

.empty { padding: 28px 0; color: var(--muted); }
.pagination { display: flex; gap: 16px; justify-content: center; align-items: center; margin-top: 24px; }
.credentials { border: 2px solid var(--red); padding: 20px; }

@media (max-width: 600px) {
  .hide-sm { display: none; }
  .rating-bar { flex-direction: column; align-items: stretch !important; }
  .rating-bar .switch { width: 100%; }
}
.sub { display: block; font-size: 13px; font-weight: 400; margin-top: 2px; }

/* Запросы на привязку: ждут ответа в кабинете */
.request { border: 2px solid var(--ink); padding: 16px 20px; display: flex; gap: 12px 20px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.request + .request { margin-top: 12px; }
.request p { margin: 0; }
.request .row form { margin: 0; }

/* Фотоотчёт турнира и портреты тренеров */
.photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 8px; margin-top: 16px; }
.photo-grid img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; background: var(--blue-tint); }
.photo-grid figure { margin: 0; }
.photo-grid figcaption { margin-top: 4px; }
.photo-grid-all { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
@media (max-width: 520px) { .photo-grid-all { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; } }
.photo-show { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 8px; }
.photo-show .photo-grid { margin-top: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; }
.photo-cover img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; background: var(--blue-tint); }
@media (max-width: 700px) { .photo-show { grid-template-columns: 1fr; } .photo-show .photo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.coach-photo { width: 160px; aspect-ratio: 1; object-fit: cover; background: var(--blue-tint); display: block; }
.coach-avatar { width: 36px; height: 36px; object-fit: cover; vertical-align: middle; margin-right: 8px; background: var(--blue-tint); }