/* results.css — стили для страницы /results.
   Использует общую дизайн-систему (tokens/base/sky/components/layout).
   Здесь только специфика: список соревнований, таблица результатов,
   подиум-бейджи для топ-3, статусы (ret/disq), мобильный collapse.
*/

/* ====================================================================
   List of competitions
   ==================================================================== */
.comp-list{
  display:flex; flex-direction:column; gap:14px;
}
.comp-card{
  display:flex;
  /* Polish #3: бейдж выравнивается по ВЕРХУ многострочного названия,
     а не по центру (раньше «плавал» рядом с длинным заголовком). */
  align-items:flex-start;
  gap:18px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-radius:var(--r-md);
  padding:18px clamp(18px, 2.5vw, 28px);
  cursor:pointer;
  transition:border-color .25s var(--ease), background .25s var(--ease), transform .25s var(--ease);
  color:var(--ink);
  text-align:left; appearance:none; width:100%; font:inherit;
}
.comp-card .comp-num{ margin-top:2px; /* визуальная коррекция к baseline */ }
.comp-card:hover{
  border-color:rgba(78,164,230,.45);
  background:rgba(255,255,255,.06);
  transform:translateY(-1px);
}
.comp-card .comp-num{
  font-family:"JetBrains Mono", monospace;
  font-size:12px; letter-spacing:.16em; color:var(--blue-2); font-weight:700;
  flex:0 0 auto;
  padding:8px 12px;
  border:1px solid rgba(78,164,230,.35);
  border-radius:var(--r-pill);
  background:rgba(36,119,189,.10);
}
.comp-card .comp-info{ flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.comp-card .comp-disc{
  font-size:15px; font-weight:700; letter-spacing:-.01em;
  overflow-wrap:break-word;
}
.comp-card .comp-meta{
  font-family:"JetBrains Mono", monospace; font-size:11.5px; letter-spacing:.06em;
  color:var(--ink-mute);
  display:flex; flex-wrap:wrap; gap:6px 14px;
}
.comp-card .comp-stages{
  display:flex; gap:8px; flex:0 0 auto;
}
.comp-card .comp-stage{
  font-family:"JetBrains Mono", monospace; font-size:10px;
  letter-spacing:.16em; text-transform:uppercase;
  padding:4px 10px; border-radius:var(--r-pill);
  border:1px solid var(--ink-faint); color:var(--ink-mute);
  background:rgba(255,255,255,.02);
}
.comp-card .comp-stage.is-active{
  color:var(--blue-2); border-color:rgba(78,164,230,.4);
  background:rgba(36,119,189,.12);
}
.comp-card .comp-arrow{
  flex:0 0 auto; color:var(--ink-mute);
  width:32px; height:32px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--ink-faint);
}
.comp-card:hover .comp-arrow{ color:var(--ink); border-color:rgba(78,164,230,.55); }

@media (max-width:640px){
  /* Polish #3 mobile: карточка строится одной вертикальной колонкой —
     бейдж сверху, потом название (полная ширина), потом meta, потом
     стейджи. Никакого «плавающего» бейджа сбоку от длинного заголовка. */
  .comp-card{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
    padding:14px 16px;
  }
  .comp-card .comp-num{
    align-self:flex-start;
    margin-top:0;
  }
  .comp-card .comp-info{ width:100%; }
  .comp-card .comp-disc{ font-size:14.5px; line-height:1.3; }
  .comp-card .comp-stages{ width:100%; }
  .comp-card .comp-arrow{ display:none; }
}

/* ====================================================================
   Competition detail view
   ==================================================================== */
.comp-detail{
  display:none;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--r-lg);
  padding:clamp(20px, 3vw, 32px);
  margin-top:24px;
}
.comp-detail.is-open{ display:block; }

.comp-detail .comp-header{
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:18px; flex-wrap:wrap;
  margin-bottom:18px;
}
.comp-detail .comp-header-text h3{
  font-size:clamp(20px, 2.4vw, 28px); font-weight:700;
  letter-spacing:-.02em; line-height:1.2;
}
.comp-detail .comp-header-text .sub{
  margin-top:6px;
  font-family:"JetBrains Mono", monospace; font-size:12px;
  letter-spacing:.04em; color:var(--ink-mute);
  display:flex; flex-wrap:wrap; gap:4px 14px;
}
.comp-detail .comp-close{
  appearance:none; border:1px solid var(--ink-faint);
  background:rgba(255,255,255,.04);
  color:var(--ink-dim); cursor:pointer;
  font-size:12px; letter-spacing:.12em; font-weight:600;
  text-transform:uppercase;
  padding:8px 16px; border-radius:var(--r-pill);
  transition:background .2s var(--ease), color .2s var(--ease);
}
.comp-detail .comp-close:hover{ background:var(--ink-ghost); color:var(--ink); }

/* Tabs: Start List / Results */
.comp-tabs{
  display:flex; gap:8px; flex-wrap:wrap;
  margin-bottom:18px;
  border-bottom:1px solid var(--ink-faint);
  padding-bottom:0;
}
.comp-tab{
  appearance:none; border:0; background:transparent;
  color:var(--ink-mute); cursor:pointer;
  font:inherit; font-weight:600; font-size:13px;
  padding:10px 16px;
  border-bottom:2px solid transparent;
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.comp-tab:hover{ color:var(--ink); }
.comp-tab.is-active{ color:var(--blue-2); border-bottom-color:var(--blue-2); }
.comp-tab[disabled]{ opacity:.4; cursor:not-allowed; }

/* ====================================================================
   Results table
   ==================================================================== */
.res-table-wrap{
  /* нет горизонтального скролла — на узких экранах коллапс через media */
  overflow:hidden;
}
.res-table{
  width:100%; border-collapse:separate; border-spacing:0;
  font-size:13.5px;
  font-variant-numeric:tabular-nums;
  color:var(--ink);
}
.res-table thead th{
  font-size:10.5px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--ink-mute); font-weight:600;
  text-align:left; padding:10px 12px;
  border-bottom:1px solid var(--ink-faint);
  background:transparent;
  white-space:nowrap;
}
.res-table tbody tr{
  background:transparent;
  transition:background .15s var(--ease);
}
.res-table tbody tr:hover{ background:rgba(255,255,255,.025); }
.res-table tbody td{
  padding:12px;
  border-bottom:1px solid var(--ink-ghost);
  vertical-align:middle;
}
.res-table tbody tr:last-child td{ border-bottom:0; }

/* Колонки */
.res-table .col-pos      { width:64px; }
.res-table .col-start    { width:64px; text-align:center; }
.res-table .col-horse-no { width:60px; text-align:center; font-family:"JetBrains Mono", monospace; color:var(--ink-dim); font-size:12.5px; }
.res-table .col-rider    { min-width:170px; }
.res-table .col-horse    { min-width:170px; }
.res-table .col-nf       { width:80px; }
.res-table .col-pp       { width:56px; text-align:right; }
.res-table .col-time     { width:78px; text-align:right; font-family:"JetBrains Mono", monospace; }
.res-table .col-total    { width:70px; text-align:right; font-weight:700; }
.res-table .col-points   { width:64px; text-align:right; font-weight:700; color:var(--gold, #C9A35B); }
.res-table .col-points b { color:var(--gold, #C9A35B); }

.res-table .cell-rider .name{ font-weight:600; }
.res-table .cell-horse .name{ font-weight:500; }
/* Polish #1: FEI ID всадника и лошади — ОДИНАКОВЫЙ стиль.
   Селектор покрывает оба <span class="fei"> (под именем и под кличкой). */
.res-table .cell-rider .fei,
.res-table .cell-horse .fei,
.res-table .cell-horse .meta{
  display:block;
  font-family:"JetBrains Mono", monospace;
  font-size:10.5px;
  font-weight:400;
  color:var(--ink-mute);
  letter-spacing:.04em;
  text-transform:none;
  margin-top:2px;
}
.res-table .cell-nf{ display:inline-flex; align-items:center; gap:8px; font-family:"JetBrains Mono", monospace; font-size:11.5px; color:var(--ink-dim); }
.res-table .cell-nf .flag{
  display:inline-block; width:22px; height:16px; object-fit:cover;
  border-radius:2px; border:1px solid rgba(255,255,255,.12);
  vertical-align:middle;
}
.res-table .cell-nf .flag.is-neutral{
  background:repeating-linear-gradient(45deg, rgba(255,255,255,.06) 0 4px, rgba(255,255,255,.02) 4px 8px);
}

/* POS badges (top-3: gold/silver/bronze; others — plain) */
.pos-badge{
  display:inline-flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:50%;
  font-family:"JetBrains Mono", monospace; font-weight:700; font-size:12.5px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--ink-faint);
  color:var(--ink-dim);
}
.pos-badge.is-gold   { background:linear-gradient(180deg, #FFD981, #C99031); color:#241a06; border-color:rgba(255,217,129,.6); box-shadow:0 4px 14px rgba(201,144,49,.35); }
.pos-badge.is-silver { background:linear-gradient(180deg, #E2E6EA, #9BA0A8); color:#1a1d22; border-color:rgba(226,230,234,.55); box-shadow:0 4px 14px rgba(155,160,168,.30); }
.pos-badge.is-bronze { background:linear-gradient(180deg, #E0986B, #8C5326); color:#2a160a; border-color:rgba(224,152,107,.5); box-shadow:0 4px 14px rgba(140,83,38,.30); }
.pos-badge.is-status { background:rgba(255,255,255,.02); color:var(--ink-mute); border-style:dashed; font-size:10px; letter-spacing:.08em; }

/* Status row (ret/disq) */
.res-table tr.is-status{ opacity:.7; }
.res-table tr.is-status td{ border-top:1px dashed var(--ink-faint); }
.res-table tr.is-status .col-time,
.res-table tr.is-status .col-pp,
.res-table tr.is-status .col-total{ color:var(--ink-mute); }

.status-badge{
  display:inline-flex; align-items:center; gap:6px;
  padding:3px 9px; border-radius:var(--r-pill);
  font-family:"JetBrains Mono", monospace; font-size:10px;
  letter-spacing:.14em; text-transform:uppercase; font-weight:600;
  background:rgba(255,255,255,.04);
  border:1px solid var(--ink-faint);
  color:var(--ink-dim);
}
.status-badge.is-ret  { color:var(--gold); border-color:rgba(201,163,91,.5); background:rgba(201,163,91,.10); }
.status-badge.is-disq { color:#ff7a7a; border-color:rgba(255,122,122,.5); background:rgba(255,122,122,.10); }

/* ====================================================================
   Mobile cards — параллельный layout вместо обрезанной таблицы.
   На десктопе .res-cards скрыты, на мобиле .res-table скрыта.
   ==================================================================== */
.res-cards{ display:none; }

@media (max-width:640px){
  .res-table{ display:none; }
  .res-cards{ display:flex; flex-direction:column; gap:10px; }
}

.res-card{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:12px;
  align-items:center;
  padding:12px 14px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.10);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-radius:var(--r-md);
}
.res-card.is-status{ opacity:.75; border-style:dashed; }

.res-card .rc-pos{ flex:0 0 auto; }
.res-card .rc-main{ min-width:0; display:flex; flex-direction:column; gap:2px; }
.res-card .rc-rider{
  font-size:14.5px; font-weight:700; letter-spacing:-.005em;
  color:var(--ink); overflow-wrap:break-word;
}
.res-card .rc-horse{
  font-size:13px; color:var(--ink-dim); overflow-wrap:break-word;
  margin-top:4px;
}
.res-card .rc-sub{
  font-family:"JetBrains Mono", monospace; font-size:10.5px;
  color:var(--ink-mute); letter-spacing:.04em;
}
.res-card .rc-meta{
  display:flex; align-items:center; gap:10px;
  margin-top:5px;
  font-family:"JetBrains Mono", monospace; font-size:10.5px;
  color:var(--ink-mute); letter-spacing:.04em;
  flex-wrap:wrap;
}
.res-card .rc-meta .cell-nf{ font-size:10.5px; }

.res-card .rc-stats{
  flex:0 0 auto;
  display:flex; flex-direction:column; align-items:flex-end; gap:2px;
  font-variant-numeric:tabular-nums;
  min-width:54px;
}
.res-card .rc-total{
  font-size:20px; font-weight:700; color:var(--ink);
  font-family:"JetBrains Mono", monospace;
  line-height:1;
}
.res-card .rc-time{
  font-family:"JetBrains Mono", monospace; font-size:11.5px;
  color:var(--ink-dim); letter-spacing:.02em;
}
.res-card .rc-pp{
  font-family:"JetBrains Mono", monospace; font-size:10px;
  color:var(--ink-mute); letter-spacing:.04em;
}
.res-card .rc-points{
  font-size:11.5px; letter-spacing:.02em; margin-top:2px;
  color:var(--gold, #C9A35B); font-weight:600;
}
.res-card .rc-points b{ color:var(--gold, #C9A35B); }

/* Status-карточки — статус-бейдж занимает rc-stats целиком */
.res-card.is-status .rc-stats{ align-self:center; }

@media (max-width:380px){
  .res-card{ padding:10px 12px; gap:10px; }
  .res-card .rc-rider{ font-size:13.5px; }
  .res-card .rc-total{ font-size:18px; }
}

/* ====================================================================
   Empty state
   ==================================================================== */
.results-empty{
  border:1px dashed var(--ink-faint);
  border-radius:var(--r-lg);
  padding:48px 24px; text-align:center;
  color:var(--ink-mute); font-size:14px;
}

/* Back to landing link */
.results-back{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12.5px; letter-spacing:.06em; color:var(--ink-mute);
  padding:8px 14px; border-radius:var(--r-pill);
  border:1px solid var(--ink-faint);
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.results-back:hover{ color:var(--ink); border-color:rgba(78,164,230,.55); }
.results-back svg{ width:14px; height:14px; }

/* ====================================================================
   DRESSAGE — отдельный набор стилей (kind=dressage в JSON компании).
   Главная таблица + раскрывающаяся панель судей.
   ==================================================================== */
.comp-kind-badge{
  display:inline-block; padding:3px 9px;
  background:rgba(0,188,116,.15); color:var(--green);
  border:1px solid rgba(0,188,116,.4);
  border-radius:var(--r-pill);
  font-size:10px; letter-spacing:.18em; text-transform:uppercase; font-weight:600;
  margin-bottom:8px;
}
.comp-card.is-dressage .comp-stages .comp-stage.is-active{
  background:rgba(0,188,116,.18); border-color:rgba(0,188,116,.55); color:var(--green);
}

/* Шапка с информацией о судьях над таблицей */
.dr-judges-head{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px;
  padding:14px 16px;
  border:1px solid var(--ink-faint); border-radius:var(--r-md);
  background:rgba(255,255,255,.02);
  margin:0 0 14px;
  font-size:12px;
}
.dr-judges-label{
  font-size:10.5px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--ink-mute); font-weight:600;
}
.dr-judge-chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:4px 10px; border-radius:var(--r-pill);
  background:rgba(78,164,230,.10); border:1px solid rgba(78,164,230,.25);
  color:var(--ink-dim); font-size:12px;
}
.dr-judge-chip b{ color:var(--ink); font-weight:700; }

/* Toggle-кнопка раскрытия судей в строке */
.dr-row-toggle{
  appearance:none; border:1px solid var(--ink-faint);
  background:rgba(255,255,255,.04); color:var(--ink-dim);
  width:28px; height:28px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  cursor:pointer;
  transition:transform .25s var(--ease), background .2s var(--ease), border-color .2s var(--ease);
}
.dr-row-toggle:hover{ background:rgba(78,164,230,.18); border-color:rgba(78,164,230,.55); color:var(--ink); }
.dr-row-toggle.is-open{ transform:rotate(180deg); background:rgba(78,164,230,.22); border-color:rgba(78,164,230,.6); }

/* Раскрывающийся ряд с разбивкой по судьям.
   ВАЖНО: max-height на td в таблице игнорируется (CSS spec) — table-cell
   sizing идёт от content. В предыдущей реализации ряд всегда занимал
   ~200px пустоты под закрытой раскрывашкой. Решение: дискретный display
   toggle. Без анимации (для табличной строки — норм). */
.dr-judges-row{ display:none; background:rgba(255,255,255,.02); }
.dr-judges-row.is-open{ display:table-row; }
.dr-judges-row > td{ padding:14px; border:0; }
.dr-judges-grid{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:10px 18px;
}
.dr-jcell{
  border:1px solid var(--ink-faint); border-radius:var(--r-md);
  background:rgba(255,255,255,.02); padding:10px 14px;
}
.dr-jpos{ font-size:12px; color:var(--ink-dim); margin-bottom:6px; }
.dr-jpos b{ color:var(--ink); font-weight:700; letter-spacing:.04em; }
.dr-jvals{
  display:flex; flex-wrap:wrap; gap:6px 14px;
  font-family:"JetBrains Mono", monospace; font-size:12px; color:var(--ink-dim);
}
.dr-jvals i{ font-style:normal; color:var(--ink-mute); margin-right:4px; font-size:10px; letter-spacing:.1em; text-transform:uppercase; }
.dr-jvals b{ color:var(--ink); }
.dr-jvals .dr-jplace{ margin-left:auto; color:var(--blue-2); font-weight:600; }

/* Главная dressage-таблица — Total % крупно */
.dr-table .col-total{ text-align:right; padding-right:18px; font-family:"JetBrains Mono", monospace; }
.dr-table .col-total b{ font-size:15px; color:var(--ink); }
.dr-table .col-judges-toggle{ width:48px; text-align:center; }

/* Мобильная карточка dressage */
.dr-card .dr-total b{ font-size:22px; }
.dr-card .dr-judges-mobile{
  grid-column:1 / -1;
  display:none;
  flex-wrap:wrap; gap:6px 8px;
  margin-top:12px; padding-top:12px;
  border-top:1px dashed var(--ink-faint);
  font-family:"JetBrains Mono", monospace; font-size:11px;
}
.dr-card.is-open .dr-judges-mobile{ display:flex; }
.dr-jcell-m{
  display:inline-flex; align-items:center; gap:6px;
  padding:4px 8px; border-radius:6px;
  background:rgba(78,164,230,.08); border:1px solid rgba(78,164,230,.18);
  color:var(--ink-dim);
}
.dr-jcell-m b{ color:var(--ink); }
.dr-jcell-m .t b{ color:var(--green); }
.dr-jcell-m .p{ color:var(--ink-mute); }

/* Десктоп: показываем таблицу, прячем cards. Мобилка наоборот.
   На малых экранах раскрывашка не нужна — данные сразу в карточке. */
.dr-cards{ display:none; }
@media (max-width:720px){
  .dr-table, .dr-judges-row{ display:none; }
  .dr-cards{ display:flex; flex-direction:column; gap:10px; }
}

/* ========================================================================
   SIX BAR (Art 230.3) — таблица по высотам.
   Десктоп: узкие колонки 135/140/150/160/170; мобила: карточки с чипами.
   ======================================================================== */
.sixbar-table .col-height{
  width:54px;                                /* равная ширина для всех высот */
  text-align:center;
  font-family:"JetBrains Mono", ui-monospace, monospace;
  font-size:14px;
  letter-spacing:.02em;
}
.sixbar-table th.col-height{
  font-size:11px; font-weight:600;
  color:var(--cyan); letter-spacing:.08em;
}
.sixbar-table td.col-height.is-clear{
  color:var(--ink-dim);                      /* 0 = чисто — приглушённо */
}
.sixbar-table td.col-height.is-down b{
  color:var(--gold);                         /* повал — золотым */
  font-weight:700;
}
.sixbar-table td.col-height.is-status{
  background:rgba(255,107,107,.08);
}
.sixbar-table td.col-height.is-status b{
  color:#ff6b6b;
  font-weight:700;
  letter-spacing:.06em;
}
.sixbar-table td.col-height.is-skip{
  color:var(--ink-faint);                    /* не дошёл — почти прозрачно */
}
.sixbar-table .col-prize{
  width:64px; text-align:right;
  font-family:"JetBrains Mono", monospace;
  font-size:12.5px; color:var(--ink-dim);
}

/* Мобильные карточки Six Bar */
.sixbar-cards{ display:none; }
.res-card.sb-card .sb-chips{
  display:flex; flex-wrap:wrap; gap:6px;
  margin-top:8px;
}
.sb-chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:4px 9px;
  font-family:"JetBrains Mono", ui-monospace, monospace;
  font-size:12px; line-height:1;
  background:rgba(255,255,255,.04);
  border:1px solid var(--ink-faint);
  border-radius:999px;
  color:var(--ink-dim);
}
.sb-chip .sb-h{
  font-size:10.5px; font-weight:600;
  color:var(--cyan); letter-spacing:.06em;
}
.sb-chip.is-clear{
  border-color:rgba(0,188,116,.35);
  color:var(--green, #00BC74);
}
.sb-chip.is-down{
  border-color:rgba(201,163,91,.45);
  color:var(--gold);
}
.sb-chip.is-down b{ color:var(--gold); font-weight:700; }
.sb-chip.is-status{
  border-color:rgba(255,107,107,.45);
  background:rgba(255,107,107,.08);
  color:#ff9b9b;
  font-weight:600; letter-spacing:.06em;
}
.sb-chip.is-skip{
  opacity:.45;
}

/* Переключение десктоп/мобила — как у конкура: таблица на широких,
   карточки на узких. */
@media (max-width:720px){
  .sixbar-table{ display:none; }
  .sixbar-cards{ display:flex; flex-direction:column; gap:10px; }
}
