/*
 * Расстановка на странице матча: «Трансляция» (макет F03) и «Бенто» (макет F04).
 * Источник: output/lineup-variants (09.09.2026). Классы макетов сохранены —
 * пересечений с redesign.css нет (проверено 11.10.2026).
 *
 * Шрифты: в Big Shoulders Display нет кириллицы (на макете фамилии рисовал
 * системный шрифт), поэтому плашки «Трансляции» — Oswald, а Big Shoulders
 * остался только для цифр счёта. Unbounded для «Бенто» — как в макете.
 * Все файлы локальные, лицензия OFL.
 */
@font-face{font-family:'Oswald';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/oswald/oswald-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Oswald';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/oswald/oswald-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Unbounded';font-style:normal;font-weight:400 900;font-display:swap;src:url(/fonts/unbounded/unbounded-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Unbounded';font-style:normal;font-weight:400 900;font-display:swap;src:url(/fonts/unbounded/unbounded-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Big Shoulders Display';font-style:normal;font-weight:900;font-display:swap;src:url(/fonts/big-shoulders/big-shoulders-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2212}

/* ---------- обёртка и переключатель ---------- */
.lu-sec{padding:28px 0 8px;background:#f4f4f4}
.lu-wrap{container-type:inline-size;max-width:1440px;margin:0 auto;--font-text:Manrope,system-ui,sans-serif;color:#14142b;font-variant-numeric:tabular-nums}
.lu-wrap *,.lu-wrap *::before,.lu-wrap *::after{box-sizing:border-box}
.lu-wrap__head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 14px;flex-wrap:wrap}
.lu-wrap__head h2{margin:0;font-size:22px}
.lu-switch{display:inline-flex;background:rgba(20,20,43,.08);border-radius:999px;padding:3px}
.lu-switch button{border:0;background:transparent;padding:8px 16px;border-radius:999px;font:700 13px/1 Manrope,system-ui,sans-serif;cursor:pointer;color:inherit;transition:background .15s,box-shadow .15s,transform .16s cubic-bezier(.23,1,.32,1)}
.lu-switch button[aria-selected=true]{background:#fff;box-shadow:0 1px 3px rgba(20,20,43,.15)}
.lu-switch button:active{transform:scale(.97)}
.lu-switch button:focus-visible{outline:2px solid #ff4b55;outline-offset:2px}
.lu-wrap[data-lu-view=broadcast] .lu-view--bento,.lu-wrap[data-lu-view=bento] .lu-view--broadcast{display:none}
.lu-note{font-size:12.5px;opacity:.7;margin:10px 4px 0}
/* На телефоне общий отступ сайта (40 px) съедал поле — у составов 16 px */
@media (max-width:600px){.lu-sec .rd-container{padding:0 16px}}

/* ---------- общее для обеих досок (из макета) ---------- */
.lu-wrap img{max-width:100%;display:block}
.lu-wrap a{color:inherit}
.bd{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:middle}
.bd--yc{background:#f3c623}
.bd--rc{background:#e0332f}
.bd--yr{background:linear-gradient(90deg,#f3c623 50%,#e0332f 50%)}
.bd--goal,.bd--og{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:#14142b;color:#fff}
.bd--og{background:#8a8a99}
.bd--more{font-size:10px;font-weight:800}

.field{position:relative;aspect-ratio:68/105;width:100%;color:var(--pitch-line,rgba(255,255,255,.55))}
.field--h{aspect-ratio:105/68}
.pitch-svg{position:absolute;inset:0;width:100%;height:100%}
.field__layer{position:absolute;inset:0}

.chipwrap{position:absolute;left:var(--x);top:calc(var(--y) + var(--stag,0px));transform:translate(-50%,-50%);z-index:1}
/* Дети сеток не раздувают доску по своему содержимому (иначе поле вылезало за телефон) */
.lu .anim,.bn__side>*,.bc>*,.bn .tile,.lu .bench__group,.bc__benches>*{min-width:0}
.chipwrap:hover,.chipwrap:focus-within{z-index:6}
.chip{display:flex;flex-direction:column;align-items:center;text-decoration:none;position:relative;cursor:pointer;color:inherit}
.chip:focus-visible{outline:2px solid var(--focus,#ff4b55);outline-offset:3px;border-radius:14px}
.ava{display:grid;place-items:center;overflow:hidden;border-radius:50%;background:#fff;flex:none}
.ava img{width:100%;height:100%;object-fit:cover;display:block}
.ava--empty{background:hsl(var(--h) 45% 86%);color:#14142b;font-weight:800;font-variant-numeric:tabular-nums}
.chip__cap{position:absolute;z-index:3;width:18px;height:18px;border-radius:50%;background:#ff4b55;color:#fff;font-size:10px;font-weight:800;display:grid;place-items:center;box-shadow:0 0 0 2px #fff}
.chip__badges{position:absolute;z-index:3;display:flex;gap:2px}
.chip__off{font-size:10.5px;font-weight:700;display:inline-flex;align-items:center;gap:1px;margin-top:3px;opacity:.85}
.chip.is-off .ava{opacity:.62}
.lu{position:relative}
/* Общее правило сайта красит заголовки в navy — на тёмной «студии» они пропадали */
.lu h4{color:inherit}
/* Снимки с Викисклада часто ростовые: лицо — в верхней части кадра */
.lu .ava img,.lu .bench__ava img,.lu .coach__ava img{object-position:50% 18%}

.bench__group h4{margin:12px 0 6px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.6;display:flex;gap:8px;align-items:baseline}
.bench__group h4 small{font-weight:600;opacity:.8}
.bench__row{display:flex;align-items:center;gap:10px;padding:6px 8px;text-decoration:none;font-size:13.5px;border-radius:10px;min-height:44px;transition:background .15s}
.bench__row:hover,.bench__row.is-hot{background:rgba(20,20,43,.06)}
.bench__ava{width:34px;height:34px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#eee;font-size:11px;font-weight:800;flex:none}
.bench__ava img{width:100%;height:100%;object-fit:cover}
.bench__num{width:22px;opacity:.55;font-weight:800;text-align:right;font-variant-numeric:tabular-nums;flex:none}
.bench__name{flex:1;font-weight:600;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bench__pos,.bench__note,.bench__for{font-size:11.5px;opacity:.6;white-space:nowrap}
/* «вместо Лисандро Мартинес» не должна раздвигать строку шире колонки */
.bench__for,.bench__note{min-width:0;flex-shrink:1;overflow:hidden;text-overflow:ellipsis}
.bench__min{font-weight:800;font-size:12px;display:inline-flex;align-items:center;gap:1px;font-variant-numeric:tabular-nums}
.bench__row--unused{opacity:.58}
.bench__row--rest{opacity:.5}
.bench__badges{display:flex;gap:2px}
.bench__empty{font-size:13px;opacity:.6;margin:8px 0 0}
.coach{display:flex;align-items:center;gap:10px;text-decoration:none;padding:10px 12px;border-radius:12px;min-height:44px}
.coach__ava{width:36px;height:36px;border-radius:50%;background:rgba(20,20,43,.08);display:grid;place-items:center;overflow:hidden;flex:none;font-size:12px;font-weight:800}
.coach__ava img{width:100%;height:100%;object-fit:cover}
.coach__t small{display:block;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;opacity:.55}
.coach__t b{font-size:14px}
.evs{display:flex;flex-wrap:wrap;gap:6px}
.evs__ev{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 11px;font-size:12px;background:rgba(20,20,43,.06)}
.evs__min{font-weight:800;opacity:.6;font-variant-numeric:tabular-nums}
.evs__ev i{opacity:.65;font-style:normal}
.evs__ev.is-hot{background:#ff4b55;color:#fff}
.is-hot .ava,.chip.is-hot .ava{box-shadow:0 0 0 3px #ff4b55}

@container (max-width:480px){
  .chip--plate .ava{width:38px;height:38px}
  .chip__plate{max-width:78px;font-size:9px}
  .chip__off{font-size:9.5px}
  .bench__row{font-size:12.5px;gap:8px;padding:6px 4px}
  .bench__pos{display:none}
  .bench__for,.bench__note{white-space:normal;font-size:11px;text-align:right}
  .coach__t b{font-size:13px}
}
@media (prefers-reduced-motion:reduce){
  .lu-wrap *,.lu-wrap *::before,.lu-wrap *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .chipwrap,.chip,.tile{animation:none!important;opacity:1!important}
}

/* ================= «Трансляция» (F03) ================= */
.bc{--bcast-bg:#0d1420;--panel:#14142b;--amber:#ffcf4d;--fg:#f4f4f4;--g1:#1c6b45;--g2:#17593a;--font-display:'Oswald','Arial Narrow',sans-serif;--font-score:'Big Shoulders Display','Oswald',sans-serif;display:grid;grid-template-columns:minmax(0,1fr);gap:14px;background:var(--bcast-bg);color:var(--fg);border-radius:18px;padding:18px;font-family:var(--font-text)}
.bc__bug{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px;background:var(--panel);border-radius:10px;padding:10px 16px}
.bc__bug .t{display:flex;align-items:center;gap:10px;font:600 20px var(--font-display);text-transform:uppercase;letter-spacing:.04em;min-width:0}
.bc__bug .t--away{justify-content:flex-end}
.bc__bug .t img{width:30px;height:21px;object-fit:cover;flex:none}
.bc__bug .t small{font:600 11px Manrope,sans-serif;opacity:.6;letter-spacing:.06em}
.bc__bug .s{font:900 34px/1 var(--font-score);color:var(--amber);letter-spacing:.04em;display:flex;align-items:baseline;gap:8px;font-variant-numeric:tabular-nums}
.bc__bug .s small{font:700 11px Manrope,sans-serif;color:var(--fg);opacity:.7;letter-spacing:0}
.bc__meta{font-size:12px;opacity:.65;text-align:center}
.bc .field{aspect-ratio:21/9;background:repeating-linear-gradient(90deg,var(--g1) 0 64px,var(--g2) 64px 128px);border-radius:8px;color:rgba(255,255,255,.5);overflow:hidden}
.bc .coachtag{position:absolute;bottom:10px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;background:rgba(13,20,32,.7);padding:4px 8px;border-radius:4px;z-index:2}
.bc .coachtag--home{left:10px}
.bc .coachtag--away{right:10px}
/* --fit-ava и --fit-plate ставит match-lineups.js: аватар не крупнее шага рядов,
   плашка не заходит на чужой аватар */
.bc .chip--plate{--sz:min(64px,var(--fit-ava,64px))}
.bc .chip--plate .ava{width:var(--sz);height:var(--sz);box-shadow:0 0 0 2px var(--tc,#ff4b55),0 6px 14px rgba(0,0,0,.45);transition:transform .12s cubic-bezier(.16,1,.3,1),box-shadow .12s}
.bc .chipwrap[data-side=home] .chip{--tc:var(--home-c);--ex:-24px}
.bc .chipwrap[data-side=away] .chip{--tc:var(--away-c);--ex:24px}
.bc .chip:hover .ava,.bc .chip.is-hot .ava{transform:translateY(-2px);box-shadow:0 0 0 3px var(--tc),0 10px 18px rgba(0,0,0,.5)}
.bc .chip__plate{display:flex;align-items:center;gap:6px;margin-top:-6px;background:var(--plate,var(--panel));color:var(--fg);border-left:4px solid var(--tc);padding:4px 10px 4px 8px;font:600 14px/1.2 var(--font-display);text-transform:uppercase;letter-spacing:.03em;white-space:nowrap;max-width:min(156px,var(--fit-plate,156px));min-width:min(96px,var(--fit-plate,96px));position:relative;left:var(--fit-shift,0px);z-index:2;opacity:0;transform:translateX(var(--ex));animation:bcPlate .22s cubic-bezier(.16,1,.3,1) forwards;animation-delay:calc(var(--i)*40ms + .1s)}
@keyframes bcPlate{to{opacity:1;transform:translateX(0)}}
.bc .chip__num{font:600 11px Manrope,sans-serif;opacity:.6;min-width:2ch}
.bc .chip__name{overflow:hidden;text-overflow:ellipsis}
.bc .chip__cap{left:-2px;top:-2px;box-shadow:0 0 0 2px var(--panel)}
.bc .chip__badges{right:-2px;top:-2px}
/* минута ухода — по центру низа аватара, над плашкой: под плашкой и сбоку она задевала соседний ряд */
.bc .chip__off{position:absolute;z-index:3;top:calc(var(--sz) - 22px);left:50%;transform:translateX(-50%);background:var(--panel);border-radius:999px;padding:1px 6px;font-size:10px}
.bc .ava--empty{background:#f4efe1;color:#14142b;font-family:var(--font-display);font-size:calc(var(--sz,64px) * .34)}
.bc__ticker{background:var(--panel);border-radius:8px;overflow:hidden;position:relative;padding:8px 0;scrollbar-width:none}
.bc__ticker::-webkit-scrollbar{display:none}
.bc__ticker::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 1px,transparent 1px 3px);pointer-events:none}
/* Лента из двух одинаковых копий: видна сразу и бежит без шва (сдвиг ровно на одну копию) */
.bc__track{display:inline-flex;white-space:nowrap;animation:bcTick var(--tick,28s) linear infinite;padding-left:0}
.bc__ticker:hover .bc__track,.bc__ticker:focus-within .bc__track{animation-play-state:paused}
.bc__ticker.is-static .bc__track{animation:none}
.bc__ticker.is-static .evs[aria-hidden]{display:none}
@keyframes bcTick{to{transform:translateX(-50%)}}
.bc .evs{flex-wrap:nowrap;display:inline-flex;gap:28px;padding:0 28px 0 16px}
.bc .evs__ev{background:transparent;color:var(--fg);padding:0;font-size:13px}
.bc .evs__min{color:var(--amber);font:600 13px var(--font-display);opacity:1}
.bc .evs__ev.is-hot{color:var(--amber)}
.bc__benches{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.bc__benches>div{display:grid;gap:8px;align-content:start}
.bc__benches .bench{background:var(--panel);border-radius:10px;padding:4px 12px 10px}
.bc .bench__group h4{opacity:.6}
.bc .bench__row:hover,.bc .bench__row.is-hot{background:rgba(255,255,255,.08)}
.bc .bench__ava{background:#22305a;color:#fff}
.bc .coach{background:var(--panel);border-radius:10px}
.bc .coach__ava{background:rgba(255,255,255,.1)}
/* Приглушённые строки скамейки читаются: на тёмной панели прозрачность .5 давала 3:1 */
.bc .bench__row--unused{opacity:.85}
.bc .bench__row--rest{opacity:.78}
.bc .bench__pos,.bc .bench__note,.bc .bench__for{opacity:.8}

/* Игрок матча «Трансляции» — плашка в стиле «нижней трети» */
.bc__motm{display:flex;align-items:center;gap:14px;background:var(--panel);border-radius:10px;padding:10px 16px;text-decoration:none;color:var(--fg);border-left:4px solid var(--amber)}
.bc__motm .ava{width:48px;height:48px;box-shadow:0 0 0 2px var(--amber)}
.bc__motm .ava--empty{background:#f4efe1;color:#14142b;font-family:var(--font-display);font-size:18px}
.bc__motm-t{flex:1;min-width:0;display:grid;gap:1px}
.bc__motm-t small{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;opacity:.65}
.bc__motm-t b{font:600 18px/1.2 var(--font-display);text-transform:uppercase;letter-spacing:.03em}
.bc__motm-t span{font-size:12.5px;opacity:.8}
.bc__motm-r{font:900 36px/1 var(--font-score);color:var(--amber);font-variant-numeric:tabular-nums}
.bc__motm:hover .bc__motm-t b,.bc__motm.is-hot .bc__motm-t b{color:var(--amber)}

/* ретро (до 1992): кремовые плашки и чёрная «студия», как на макете 1982 */
[data-era=retro].bc{--bcast-bg:#101010;--panel:#151515;--plate:#f4efe1;--fg:#f4efe1;--g1:#3d7a4a;--g2:#33683f}
[data-era=retro].bc .chip__plate{color:#101010;border-left-width:6px}
[data-era=retro].bc .bc__bug .s{letter-spacing:.08em}
[data-era=retro].bc .bc__ticker::before{display:none}
[data-era=retro].bc .chip--plate .ava{box-shadow:0 0 0 2px #f4efe1,0 6px 14px rgba(0,0,0,.6)}
/* Заявка и тренер в ретро — кремовая «бумага» с тёмным текстом, в тон плашкам
   на поле (решение владельца 11.10.2026: чёрные панели читались плохо) */
[data-era=retro].bc .bench,[data-era=retro].bc .coach,[data-era=retro].bc .bc__motm{background:#f4efe1;color:#1c1c1c}
[data-era=retro].bc .bench__ava,[data-era=retro].bc .coach__ava{background:#e6dcc3;color:#1c1c1c}
[data-era=retro].bc .bench__row:hover,[data-era=retro].bc .bench__row.is-hot{background:rgba(28,28,28,.07)}
[data-era=retro].bc .bench__group h4{opacity:.7}
[data-era=retro].bc .bench__min{color:#1c1c1c}
[data-era=retro].bc .bc__motm{border-left-color:#d1323c}
[data-era=retro].bc .bc__motm .ava{box-shadow:0 0 0 2px #d1323c}
[data-era=retro].bc .bc__motm-r{color:#d1323c}

/* промежуточные ширины — в макете их не было (только 1328 и 390 px) */
@container (max-width:1180px){
  .bc .field{aspect-ratio:2/1}
  .bc .chip--plate{--sz:min(52px,var(--fit-ava,52px))}
  .bc .chip__plate{font-size:12.5px;max-width:min(128px,var(--fit-plate,128px));min-width:0;padding:3px 8px 3px 6px}
}
@container (max-width:860px){
  .bc__benches{grid-template-columns:minmax(0,1fr)}
  .bc .field{aspect-ratio:16/11}
  .bc .chip--plate{--sz:min(42px,var(--fit-ava,42px))}
  .bc .chip__plate{font-size:11px;max-width:min(96px,var(--fit-plate,96px));border-left-width:3px}
  .bc .chip__num{display:none}
  .bc .coachtag{display:none}
}
@container (max-width:480px){
  .bc{padding:10px;border-radius:12px}
  .bc__bug{padding:8px 10px;gap:8px}
  .bc__bug .t{font-size:13px}
  .bc__bug .t small{display:none}
  .bc__bug .s{font-size:24px}
  .bc .field{aspect-ratio:4/3}
  /* Фишка чуть меньше шага между рядами: ряды от вратаря занимают 31 % длины поля,
     поле ≈ ширина блока − поля; у схем в 5–6 рядов фишка 30 px налезала на соседнюю */
  .bc .chip--plate{--sz:min(30px,calc((100cqw - 24px) * .31 / var(--gaps,4) - 3px),var(--fit-ava,30px))}
  .bc .chip__plate{font-size:9px;padding:1px 5px 1px 4px;min-width:0;max-width:40px;margin-top:-3px;border-left-width:2px}
  .bc .chip__name{display:none}
  .bc .chip__num{display:inline}
  .bc .chip__off,.bc .chip__badges{display:none}
  .bc__motm{padding:10px 12px;gap:10px}
  .bc__motm .ava{width:40px;height:40px}
  .bc__motm-t b{font-size:15px}
  .bc__motm-r{font-size:28px}
  .bc__benches{grid-template-columns:minmax(0,1fr)}
  .bc__track{animation:none;padding-left:0;overflow-x:auto}
  .bc .evs[aria-hidden]{display:none}
  .bc__ticker{overflow-x:auto}
}

/* ================= «Бенто» (F04) ================= */
.bn{--tile-bg:#fff;--tile-line:#e6e6ea;--bg:#f4f4f4;--green:#2f7a4f;--font-display:'Unbounded',sans-serif;display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:auto;gap:16px;font-family:var(--font-text)}
/* Колонка справа от поля — столбиком; «Ход матча» добирает остаток высоты
   и прокручивается (в макете тут растягивался почти пустой «Штаб»). */
.bn__side{grid-column:8/13;grid-row:1;display:flex;flex-direction:column;gap:16px;min-width:0;min-height:0}
.bn .tile{background:var(--tile-bg);border:1px solid var(--tile-line);border-radius:16px;box-shadow:0 1px 2px rgba(20,20,43,.06),0 8px 24px rgba(20,20,43,.05);padding:18px 20px;position:relative;opacity:0;transform:translateY(12px) scale(.98);animation:bnIn .22s cubic-bezier(.22,1,.36,1) forwards;animation-delay:calc(var(--t)*40ms);min-width:0}
@keyframes bnIn{to{opacity:1;transform:none}}
.bn .tile h4{margin:0 0 10px;font:600 12px var(--font-display);letter-spacing:.08em;text-transform:uppercase;opacity:.65;display:flex;align-items:center;gap:8px}
.bn .tile h4 small{margin-left:auto;font:600 11px Manrope,sans-serif;letter-spacing:0;text-transform:none;opacity:.8}
.bn .tile--pitch{grid-column:1/8;grid-row:1;background:var(--green);padding:14px;color:rgba(255,255,255,.55)}
.bn .tile--score{background:#14142b;color:#fff}
.bn .tile--potm{background:color-mix(in srgb,#ff4b55 12%,#fff)}
.bn .field{border-radius:10px;aspect-ratio:68/108;color:rgba(255,255,255,.55)}
.bn .chip--plate{--sz:min(56px,var(--fit-ava,56px))}
.bn .chip--plate .ava{width:var(--sz);height:var(--sz);box-shadow:0 0 0 2px var(--tc,#fff),0 4px 12px rgba(0,0,0,.25);transition:transform .12s ease-out,box-shadow .12s}
.bn .chipwrap[data-side=home] .chip{--tc:var(--home-c)}
.bn .chipwrap[data-side=away] .chip{--tc:var(--away-c)}
.bn .chip:hover .ava,.bn .chip.is-hot .ava{transform:scale(1.05);box-shadow:0 0 0 3px #fff,0 8px 16px rgba(0,0,0,.3)}
.bn .chip__plate{display:flex;gap:4px;align-items:center;margin-top:4px;background:#fff;color:#14142b;border-radius:6px;padding:3px 8px;font-size:11px;font-weight:700;text-transform:uppercase;white-space:nowrap;max-width:min(110px,var(--fit-plate,110px));position:relative;left:var(--fit-shift,0px);box-shadow:0 2px 5px rgba(0,0,0,.2)}
.bn .chip__num{opacity:.5;font-size:10px}
.bn .chip__name{overflow:hidden;text-overflow:ellipsis}
.bn .chip__cap{left:-2px;top:-2px}
.bn .chip__badges{right:-4px;top:-2px}
/* Минута ухода — значок по центру низа аватара, вне потока: иначе фишка заменённого
   выше прочих, центруется целиком и наезжает на соседний ряд; сбоку задевала соседей */
.bn .chip__off{position:absolute;z-index:3;top:calc(var(--sz) - 12px);left:50%;transform:translateX(-50%);margin:0;font-size:9.5px;line-height:14px;white-space:nowrap;color:#fff;background:rgba(0,0,0,.45);border-radius:999px;padding:1px 6px}
.bn .ava--empty{font-size:calc(var(--sz,56px) * .32)}
.bn .sc{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px}
.bn .sc .t{display:flex;align-items:center;gap:8px;font:700 15px var(--font-display);min-width:0}
.bn .sc .t--away{justify-content:flex-end;text-align:right}
.bn .sc img{width:26px;height:18px;object-fit:cover;border-radius:2px;flex:none}
.bn .sc .s{font:900 32px/1 var(--font-display);font-variant-numeric:tabular-nums;text-align:center}
.bn .sc .s small{display:block;font:600 11px Manrope,sans-serif;opacity:.6;margin-top:4px}
.bn .sc .m{grid-column:1/-1;font-size:11.5px;opacity:.6}
.bn .potm{display:flex;align-items:center;gap:14px;text-decoration:none}
.bn .potm .ava{width:72px;height:72px;box-shadow:0 0 0 3px #fff}
.bn .potm>div{flex:1;min-width:0}
.bn .potm b{font:700 16px var(--font-display);display:block}
.bn .potm .r{font:900 32px/1 var(--font-display);font-variant-numeric:tabular-nums;color:#c9313a}
.bn .potm .bar{height:4px;border-radius:2px;background:rgba(20,20,43,.1);margin-top:8px;overflow:hidden}
.bn .potm .bar i{display:block;height:100%;background:#ff4b55;width:var(--w)}
.bn .potm small{font-size:12px;opacity:.7}
.bn .potm small.facts{display:block;margin-top:2px}

/* «Ход матча» по сборным: у каждой своя колонка под флагом, полоса — цвет сборной */
.bn .tile--events{flex:1 1 0;min-height:240px;display:flex;flex-direction:column}
.bn .evcols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;overflow:auto;flex:1 1 0;min-height:0;align-content:start;margin:0 -6px;padding:0 6px}
.bn .evcol{min-width:0}
.bn .evcol--home{--side-c:var(--home-c)}
.bn .evcol--away{--side-c:var(--away-c)}
.bn .evcol__head{display:flex;align-items:center;gap:7px;font:600 12px var(--font-display);text-transform:uppercase;letter-spacing:.04em;padding:0 0 7px;border-bottom:3px solid var(--side-c);margin-bottom:2px;position:sticky;top:0;background:var(--tile-bg);z-index:1}
.bn .evcol__head img{width:20px;height:14px;object-fit:cover;border-radius:2px;flex:none}
.bn .evcol__head span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bn .evcol__empty{font-size:12px;opacity:.55;margin:8px 0 0}
.bn .evlist__row{display:grid;grid-template-columns:44px 20px minmax(0,1fr);gap:6px;align-items:center;font-size:13px;padding:6px 0;border-bottom:1px solid var(--tile-line)}
.bn .evlist__row:last-child{border:0}
.bn .evlist__row .mn{font:700 13px var(--font-display);color:#c9313a;font-variant-numeric:tabular-nums;white-space:nowrap}
.bn .evlist__row .ic{display:grid;place-items:center}
.bn .evlist__row .who{min-width:0;line-height:1.3}
.bn .evlist__row i{opacity:.6;font-style:normal;font-size:12px}
.bn .evlist__row.is-hot{background:rgba(255,75,85,.08)}
.bd--var{width:auto;height:auto;padding:1px 4px;font-size:8.5px;font-weight:800;line-height:1.2;background:#14142b;color:#fff;border-radius:3px;letter-spacing:.02em}

/* Протокол сборной — панель из макета F01 («ретро-протокол») */
.bn .tile--team{grid-row:2;display:grid;gap:8px;align-content:start;padding:14px 16px}
.bn .tile--team-home{grid-column:1/7}
.bn .tile--team-away{grid-column:7/13}
.bn .tile--team h3{margin:0 0 4px;font-size:15px;font-weight:700;display:flex;align-items:center;gap:8px;color:inherit}
.bn .tile--team h3 a{text-decoration:none}
.bn .tile--team h3 a:hover{text-decoration:underline}
.bn .tile--team h3 img{width:24px;height:16px;object-fit:cover;border-radius:2px;flex:none}
.bn .tile--team h3 small{margin-left:auto;font-size:11px;font-weight:600;letter-spacing:.06em;opacity:.55}
.bn .tile--team .coach{padding:8px;background:#f4f4f4;border-radius:10px;min-height:0}
.bn .tile--team .bench__group h4{font:700 11px Manrope,sans-serif;letter-spacing:.08em;margin:12px 0 6px;opacity:.6}
.bn .tile--team .bench__row{padding:4px 8px;min-height:36px;font-size:13px}
.bn .tile--team .bench__row:hover,.bn .tile--team .bench__row.is-hot{background:#fff1f2}
.bn .tile--team .bench__ava{width:28px;height:28px;font-size:11px}

/* ретро (до 1992): «бумага» как у панелей протокола F01.
   Цветные «пятна» в углах плиток из макета убраны: на странице матча
   жёлтое пятно читалось как жёлтая карточка. */
[data-era=retro].bn{--tile-bg:#f6efe1;--tile-line:#d8cdb0;--green:#4f8a5f}
[data-era=retro].bn .tile{box-shadow:none}
[data-era=retro].bn .tile--score{background:#1c1c1c;border-color:#1c1c1c}
[data-era=retro].bn .tile--potm{background:var(--tile-bg)}
[data-era=retro].bn .tile--team .coach{background:rgba(28,28,28,.05)}
[data-era=retro].bn .tile--team .bench__ava{background:#ece3cd}
[data-era=retro].bn .chip__plate{background:#f6efe1;color:#1c1c1c}
[data-era=retro].bn .chip__cap{background:#d1323c}
[data-era=retro].bn .ava--empty{background:#f6efe1;color:#1a4fa0;box-shadow:0 0 0 2px #1a4fa0,0 4px 12px rgba(0,0,0,.25)}

@container (max-width:1000px){
  .bn .tile--pitch{grid-column:1/7}
  .bn__side{grid-column:7/13}
  .bn .chip--plate{--sz:min(46px,var(--fit-ava,46px))}
  .bn .chip__plate{font-size:10px;max-width:min(92px,var(--fit-plate,92px));padding:2px 6px}
  .bn .evcols{grid-template-columns:minmax(0,1fr)}
  .bn .field--deep{aspect-ratio:68/145}
}
@container (max-width:720px){
  .bn{grid-template-columns:1fr;gap:10px}
  .bn__side{display:contents}
  .bn .tile{grid-column:1/-1!important;grid-row:auto!important;padding:14px}
  .bn .tile--score{order:-1}
  .bn .tile--pitch{order:0}
  .bn .tile--potm{order:1}
  .bn .tile--events{order:2;flex:none;min-height:0}
  /* в одну колонку плитка растёт по содержимому: нулевая основа из широкой раскладки схлопывала события */
  .bn .evcols{grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;flex:none}
  .bn .tile--team{order:3}
  .bn .field{aspect-ratio:68/120}
}
@container (max-width:480px){
  .bn .field{aspect-ratio:68/135}
  .bn .field--deep{aspect-ratio:68/158}
  .bn .chip--plate{--sz:min(38px,var(--fit-ava,38px))}
  .bn .chip__plate{font-size:9px;max-width:min(78px,var(--fit-plate,78px));padding:2px 6px}
  .bn .chip__num{display:none}
  .bn .sc .s{font-size:26px}
  .bn .sc .t{font-size:13px}
  .bn .evcols{grid-template-columns:minmax(0,1fr);gap:12px}
  .bn .tile--team .bench__pos{display:none}
}
