/* Courtside — графика для OBS. Холст 1920×1080, фон прозрачный. */
:root {
  --font: 'Barlow Condensed', 'Arial Narrow', 'Roboto Condensed', sans-serif;
  --bg: rgba(12, 14, 20, 0.92);
  --bg2: rgba(28, 31, 42, 0.95);
  --fg: #ffffff;
  --muted: rgba(255, 255, 255, 0.62);
  --line: rgba(255, 255, 255, 0.10);
  --accent: #ffb020;
  --danger: #ff3b3b;
  --radius: 14px;
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.45), 0 2px 8px rgba(0, 0, 0, 0.35);
  --s: 1;
}
body.theme-light {
  --bg: rgba(255, 255, 255, 0.96);
  --bg2: rgba(240, 242, 247, 0.98);
  --fg: #0d111a;
  --muted: rgba(13, 17, 26, 0.55);
  --line: rgba(13, 17, 26, 0.10);
  --accent: #e8590c;
}
body.theme-classic {
  --bg: #101216;
  --bg2: #1c1f26;
  --radius: 4px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { background: transparent; overflow: hidden; width: 100%; height: 100%; }
body { font-family: var(--font); color: var(--fg); -webkit-font-smoothing: antialiased; }
#stage { position: absolute; left: 0; top: 0; width: 1920px; height: 1080px; transform-origin: 0 0; }
.num { font-variant-numeric: tabular-nums; }

.layer { position: absolute; opacity: 0; pointer-events: none; transition: opacity .35s ease, transform .45s cubic-bezier(.2, .8, .2, 1); }
.layer.show { opacity: 1; }

/* ------------------------------------------------------------ scorebug */
.bug { transform: translateY(20px) scale(var(--s)); }
.bug.show { transform: translateY(0) scale(var(--s)); }
body.pos-bottom-center .bug { left: 0; right: 0; margin: 0 auto; width: max-content; bottom: 44px; transform-origin: 50% 100%; }
body.pos-bottom-left .bug { left: 64px; bottom: 44px; transform-origin: 0 100%; }
body.pos-bottom-right .bug { right: 64px; bottom: 44px; transform-origin: 100% 100%; }
body.pos-top-left .bug { left: 64px; top: 40px; transform-origin: 0 0; }
body.pos-top-center .bug { left: 0; right: 0; margin: 0 auto; width: max-content; top: 40px; transform-origin: 50% 0; }
body.pos-top-right .bug { right: 64px; top: 40px; transform-origin: 100% 0; }

.bug-title {
  display: none; margin: 0 0 6px 4px; font-size: 20px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: #fff; text-shadow: 0 2px 8px rgba(0, 0, 0, .7);
}
.bug-title.on { display: inline-block; }
body.theme-light .bug-title { color: #fff; }

.bug-row {
  display: flex; align-items: stretch; height: 76px;
  background: var(--bg); border-radius: var(--radius); box-shadow: var(--shadow);
  overflow: hidden; backdrop-filter: blur(12px);
}

.team { position: relative; display: flex; align-items: center; min-width: 300px; padding: 0 0 0 16px; border-right: 1px solid var(--line); }
.team::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 7px; background: var(--tc); }
.t-logo { width: 50px; height: 50px; margin-right: 12px; display: none; align-items: center; justify-content: center; }
.t-logo.on { display: flex; }
.t-logo img { max-width: 100%; max-height: 100%; object-fit: contain; filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .3)); }
.t-body { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 5px; }
.t-name { font-size: 34px; line-height: 1; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; white-space: nowrap; }
.t-meta { display: flex; gap: 12px; align-items: center; height: 10px; }
.t-fouls, .t-to { display: flex; gap: 4px; align-items: center; }
.t-fouls i { width: 14px; height: 7px; border-radius: 3px; background: var(--line); }
.t-fouls i.on { background: var(--accent); }
.t-fouls.bonus i.on { background: var(--danger); }
.t-fouls b {
  font-size: 13px; font-weight: 700; letter-spacing: .08em; color: #fff; background: var(--danger);
  border-radius: 3px; padding: 1px 5px 0; line-height: 14px; margin-left: 2px;
}
.t-to i { width: 18px; height: 5px; border-radius: 2px; background: var(--fg); opacity: .85; }
.t-to i.off { opacity: .15; }
.t-score {
  width: 92px; height: 100%; display: flex; align-items: center; justify-content: center;
  font-size: 54px; font-weight: 800; font-variant-numeric: tabular-nums; background: var(--bg2);
  position: relative; overflow: hidden;
}
.t-score span { display: inline-block; }
.t-score.pop span { animation: pop .6s cubic-bezier(.2, .9, .3, 1.4); }
.t-score.pop::after {
  content: ''; position: absolute; inset: 0; background: var(--tc); opacity: 0; animation: flash .9s ease-out;
}
@keyframes pop { 0% { transform: translateY(60%) scale(.6); opacity: 0; } 100% { transform: none; opacity: 1; } }
@keyframes flash { 0% { opacity: .75; } 100% { opacity: 0; } }
.t-poss { position: absolute; right: 94px; top: 50%; margin-top: -8px; width: 0; height: 0; border: 8px solid transparent; border-right-color: var(--accent); opacity: 0; transition: opacity .2s; }
.t-poss.on { opacity: 1; }

.clockbox { display: flex; flex-direction: column; justify-content: center; align-items: center; min-width: 150px; padding: 0 18px; }
.period { font-size: 17px; font-weight: 700; letter-spacing: .16em; color: var(--muted); line-height: 1; margin-bottom: 3px; }
.clock { font-size: 44px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.clock.low { color: var(--danger); }
.clock.stopped { opacity: .92; }
.shotbox {
  width: 76px; display: flex; align-items: center; justify-content: center; background: var(--accent);
  color: #111; font-size: 42px; font-weight: 800; font-variant-numeric: tabular-nums; transition: width .3s, background .2s;
}
.shotbox.low { background: var(--danger); color: #fff; }
.shotbox.zero { animation: blink .5s steps(2) infinite; }
.shotbox.off { width: 0; overflow: hidden; }
@keyframes blink { 50% { opacity: .35; } }

.bug-sub {
  position: absolute; left: calc(100% + 10px); bottom: 0; height: 76px; opacity: 0; transform: translateX(-12px);
  transition: opacity .3s, transform .3s; font-size: 24px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
}
.bug-sub.on { opacity: 1; transform: none; }
body.pos-bottom-right .bug-sub, body.pos-top-right .bug-sub { left: auto; right: calc(100% + 10px); transform: translateX(12px); }
body.pos-bottom-right .bug-sub.on, body.pos-top-right .bug-sub.on { transform: none; }
.bug-sub span {
  display: inline-flex; align-items: center; gap: 12px; height: 76px; padding: 0 24px; border-radius: var(--radius);
  background: var(--bg); box-shadow: var(--shadow); color: var(--fg); white-space: nowrap;
}
.bug-sub span i { width: 10px; height: 10px; border-radius: 50%; background: var(--tc, var(--accent)); }

/* классическая тема: названия на цвете команды */
body.theme-classic .team { background: var(--tc); color: var(--ttc); border-right: 0; }
body.theme-classic .team::before { display: none; }
body.theme-classic .t-score { background: rgba(0, 0, 0, .28); color: var(--ttc); }
body.theme-classic .t-fouls i { background: rgba(255, 255, 255, .25); }
body.theme-classic .t-fouls i.on { background: #fff; }
body.theme-classic .t-to i { background: var(--ttc); }
body.theme-classic .t-poss { border-right-color: #fff; }
body.theme-classic .bug-row { gap: 2px; background: #0b0c10; }
body.theme-classic .clockbox { background: #0b0c10; color: #fff; }
body.theme-classic .period { color: rgba(255, 255, 255, .6); }

/* ------------------------------------------------------------ player card */
.card {
  left: 80px; bottom: 170px; display: flex; align-items: stretch; height: 150px; min-width: 700px;
  background: var(--bg); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden;
  transform: translateX(-60px); clip-path: inset(0 100% 0 0 round var(--radius));
  transition: opacity .3s, transform .55s cubic-bezier(.2, .8, .2, 1), clip-path .55s cubic-bezier(.2, .8, .2, 1);
}
.card.show { transform: none; clip-path: inset(0 0 0 0 round var(--radius)); }
body.pos-top-left .card, body.pos-top-center .card, body.pos-top-right .card { bottom: 70px; }
body.pos-bottom-left .card { left: 64px; bottom: 190px; }
.card-num {
  position: relative; width: 150px; background: var(--tc); color: var(--ttc); display: flex; align-items: center;
  justify-content: center; font-size: 96px; font-weight: 800; line-height: 1; overflow: hidden;
}
.card-num img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; display: none; }
.card-num.photo img { display: block; }
.card-num.photo span {
  position: absolute; left: 8px; bottom: 6px; font-size: 40px; z-index: 1; text-shadow: 0 2px 10px rgba(0, 0, 0, .6);
}
.card-main { flex: 1; padding: 16px 26px 14px; display: flex; flex-direction: column; justify-content: center; gap: 6px; min-width: 0; }
.card-top { display: flex; gap: 12px; font-size: 20px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.card-team { color: var(--fg); }
.card-name { font-size: 50px; font-weight: 800; line-height: .95; text-transform: uppercase; white-space: nowrap; letter-spacing: .01em; }
.card-chips { display: flex; gap: 22px; margin-top: 4px; }
.card-chips div { display: flex; align-items: baseline; gap: 6px; }
.card-chips b { font-size: 32px; font-weight: 800; font-variant-numeric: tabular-nums; }
.card-chips span { font-size: 18px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.card-season { font-size: 18px; color: var(--muted); letter-spacing: .04em; display: none; }
.card-season.on { display: block; }
.card-head {
  display: flex; align-items: center; justify-content: center; padding: 0 30px; min-width: 150px;
  font-size: 64px; font-weight: 800; background: var(--accent); color: #111; white-space: nowrap;
}
.card-head:empty { display: none; }
.card.tone-info .card-head { font-size: 30px; letter-spacing: .1em; background: var(--bg2); color: var(--fg); text-transform: uppercase; }
.card.tone-foul .card-head { font-size: 40px; background: var(--bg2); color: var(--accent); letter-spacing: .06em; }
.card.tone-out .card-head { font-size: 36px; background: var(--danger); color: #fff; letter-spacing: .06em; }

/* ------------------------------------------------------------ панели */
.panel {
  left: 0; right: 0; top: 0; bottom: 0; margin: auto; height: max-content; transform: scale(.96);
  background: var(--bg); border-radius: calc(var(--radius) + 6px); box-shadow: var(--shadow); overflow: hidden;
}
.panel.show { transform: scale(1); }
.p-head { display: flex; align-items: center; gap: 22px; padding: 26px 40px; position: relative; }
.p-head::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 6px; background: var(--tc); }
.p-head img { height: 80px; max-width: 120px; object-fit: contain; }
.p-head h1 { font-size: 64px; font-weight: 800; line-height: 1; text-transform: uppercase; }
.p-head h2 { font-size: 24px; font-weight: 600; letter-spacing: .2em; color: var(--muted); text-transform: uppercase; }
.p-head .grow { flex: 1; }

/* стартовая пятёрка */
#lineup { width: 1560px; }
.lu-five { display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; padding: 30px 40px 20px; }
.lu-p { background: var(--bg2); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; }
.lu-ph { height: 250px; position: relative; background: linear-gradient(160deg, var(--tc), rgba(0, 0, 0, .35)); display: flex; align-items: center; justify-content: center; }
.lu-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; }
.lu-ph span { font-size: 130px; font-weight: 800; color: var(--ttc); opacity: .9; }
.lu-ph.photo span { position: absolute; left: 12px; bottom: 4px; font-size: 56px; text-shadow: 0 2px 10px rgba(0, 0, 0, .6); }
.lu-info { padding: 14px 16px 16px; }
.lu-name { font-size: 30px; font-weight: 800; line-height: 1; text-transform: uppercase; }
.lu-pos { font-size: 18px; font-weight: 600; color: var(--muted); letter-spacing: .12em; text-transform: uppercase; margin-top: 6px; min-height: 20px; }
.lu-bench { padding: 4px 40px 30px; display: flex; flex-wrap: wrap; gap: 10px 26px; font-size: 24px; font-weight: 600; }
.lu-bench em { font-style: normal; color: var(--muted); letter-spacing: .16em; font-size: 18px; margin-right: 6px; align-self: center; }
.lu-bench b { color: var(--muted); margin-right: 6px; }

/* статистика матча */
#board { width: 1320px; }
.bd-head { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 30px 40px 24px; gap: 30px; }
.bd-team { display: flex; align-items: center; gap: 18px; }
.bd-team.away { flex-direction: row-reverse; text-align: right; }
.bd-team img { height: 74px; max-width: 110px; object-fit: contain; }
.bd-team .n { font-size: 44px; font-weight: 800; text-transform: uppercase; line-height: 1; }
.bd-team .bar { width: 8px; height: 70px; border-radius: 4px; background: var(--tc); }
.bd-score { text-align: center; }
.bd-score .sc { font-size: 96px; font-weight: 800; line-height: .9; font-variant-numeric: tabular-nums; }
.bd-score .lbl { font-size: 20px; font-weight: 700; letter-spacing: .2em; color: var(--muted); text-transform: uppercase; }
.bd-q { margin: 0 40px; border-collapse: collapse; width: calc(100% - 80px); font-size: 28px; font-variant-numeric: tabular-nums; }
.bd-q th { font-size: 18px; color: var(--muted); font-weight: 700; letter-spacing: .14em; padding: 8px; }
.bd-q td { text-align: center; padding: 8px; border-top: 1px solid var(--line); font-weight: 600; }
.bd-q td:first-child, .bd-q th:first-child { text-align: left; width: 34%; }
.bd-q td:last-child { font-weight: 800; }
.bd-q td.w { color: var(--accent); }
.bd-rows { padding: 22px 40px 10px; display: grid; gap: 12px; }
.bd-row { display: grid; grid-template-columns: 100px 1fr 320px 1fr 100px; align-items: center; gap: 14px; font-size: 28px; font-weight: 700; font-variant-numeric: tabular-nums; }
.bd-row .l { text-align: center; font-size: 20px; letter-spacing: .12em; color: var(--muted); text-transform: uppercase; font-weight: 600; }
.bd-row .v2 { text-align: right; }
.bd-row .bh, .bd-row .ba { height: 10px; background: var(--line); border-radius: 5px; overflow: hidden; display: flex; }
.bd-row .bh { justify-content: flex-end; }
.bd-row .bh i { background: var(--hc); } .bd-row .ba i { background: var(--ac); }
.bd-row i { display: block; height: 100%; border-radius: 5px; transition: width .6s; }
.bd-top { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding: 16px 40px 32px; }
.bd-top h3 { font-size: 18px; letter-spacing: .18em; color: var(--muted); font-weight: 700; margin-bottom: 8px; text-transform: uppercase; }
.bd-top .r { display: flex; align-items: baseline; gap: 12px; font-size: 26px; font-weight: 700; padding: 5px 0; border-top: 1px solid var(--line); }
.bd-top .r .nm { flex: 1; text-transform: uppercase; }
.bd-top .r .no { color: var(--muted); width: 40px; }
.bd-top .r .pt { font-size: 30px; font-weight: 800; }
.bd-top .r small { color: var(--muted); font-size: 18px; font-weight: 600; margin-left: 4px; }

/* строка сообщений */
.banner {
  left: 0; right: 0; margin: 0 auto; width: max-content; top: 40px; transform: translateY(-20px);
  background: var(--bg); color: var(--fg); border-radius: 999px; box-shadow: var(--shadow);
  padding: 12px 34px 11px 28px; font-size: 32px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap;
  display: flex; align-items: center; gap: 16px;
}
.banner::before { content: ''; width: 12px; height: 12px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 5px rgba(255, 176, 32, .25); }
.banner.show { transform: none; }
body.pos-top-left .banner, body.pos-top-center .banner, body.pos-top-right .banner { top: auto; bottom: 44px; }

/* ------------------------------------------------------------ виджеты */
#widget { display: none; }
body.widget-mode #stage { position: static; width: auto; height: auto; transform: none !important; }
body.widget-mode .layer { display: none; }
body.widget-mode #widget { display: block; white-space: nowrap; font-variant-numeric: tabular-nums; line-height: 1; }

/* ------------------------------------------------------------ логотип турнира на табло */
.bug-title { align-items: center; gap: 10px; }
.bug-title.on { display: inline-flex; }
.bug-title img { height: 30px; max-width: 90px; object-fit: contain; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .5)); }

/* ------------------------------------------------------------ титр */
.caption {
  left: 80px; bottom: 170px; display: flex; align-items: stretch; background: var(--bg); border-radius: var(--radius);
  box-shadow: var(--shadow); overflow: hidden; transform: translateX(-40px); clip-path: inset(0 100% 0 0 round var(--radius));
  transition: opacity .3s, transform .5s cubic-bezier(.2, .8, .2, 1), clip-path .5s cubic-bezier(.2, .8, .2, 1);
}
.caption.show { transform: none; clip-path: inset(0 0 0 0 round var(--radius)); }
body.pos-top-left .caption, body.pos-top-center .caption, body.pos-top-right .caption { bottom: 70px; }
.cap-bar { width: 10px; background: var(--accent); }
.cap-body { padding: 16px 34px 16px 24px; }
.cap-name { font-size: 46px; font-weight: 800; text-transform: uppercase; line-height: 1; }
.cap-role { font-size: 22px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-top: 8px; }
.cap-role:empty { display: none; }

/* ------------------------------------------------------------ сцены */
.scene {
  inset: 0; overflow: hidden; color: #fff; transform: scale(1.03);
  --hc: #e11d48; --ac: #2563eb;
  background:
    radial-gradient(1200px 900px at -5% 110%, var(--hcA, rgba(225, 29, 72, .55)), transparent 60%),
    radial-gradient(1200px 900px at 105% -10%, var(--acA, rgba(37, 99, 235, .55)), transparent 60%),
    #07090e;
}
.scene.show { transform: none; }
.scene::before {
  content: ''; position: absolute; inset: 0; opacity: .5; pointer-events: none;
  background: repeating-linear-gradient(115deg, rgba(255, 255, 255, .025) 0 2px, transparent 2px 22px);
}
.scene.translucent { background: rgba(6, 8, 12, .78); }
.scene > * { position: relative; }
.sc-top { position: absolute; left: 80px; right: 80px; top: 54px; display: flex; align-items: center; gap: 18px; font-size: 26px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: rgba(255, 255, 255, .75); }
.sc-top img { height: 64px; max-width: 140px; object-fit: contain; }
.sc-top .grow { flex: 1; }
.sc-top .meta { text-align: right; font-weight: 600; letter-spacing: .1em; font-size: 22px; color: rgba(255, 255, 255, .6); }
.sc-kicker { font-size: 30px; font-weight: 700; letter-spacing: .3em; color: var(--accent); text-transform: uppercase; }
.sc-spons { position: absolute; left: 0; right: 0; bottom: 44px; display: flex; justify-content: center; align-items: center; gap: 56px; }
.sc-spons img { height: 58px; max-width: 220px; object-fit: contain; opacity: .9; }
.sc-photo { position: relative; overflow: hidden; background: linear-gradient(170deg, var(--tc), rgba(0, 0, 0, .55)); display: flex; align-items: center; justify-content: center; }
.sc-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.sc-photo .n { font-weight: 800; color: var(--ttc, #fff); opacity: .9; line-height: 1; }
.sc-photo.has .n { position: absolute; left: 14px; bottom: 8px; text-shadow: 0 3px 12px rgba(0, 0, 0, .7); }
.logo-ph { display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--tc); color: var(--ttc); font-weight: 800; }

/* заставка */
.in-wrap { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 34px; }
.in-title { font-size: 120px; font-weight: 800; line-height: .9; text-transform: uppercase; letter-spacing: .02em; text-align: center; }
.in-teams { display: flex; align-items: center; gap: 80px; }
.in-team { display: flex; flex-direction: column; align-items: center; gap: 18px; width: 460px; }
.in-team .lg { width: 220px; height: 220px; display: flex; align-items: center; justify-content: center; }
.in-team .lg img { max-width: 100%; max-height: 100%; object-fit: contain; filter: drop-shadow(0 10px 30px rgba(0, 0, 0, .5)); }
.in-team .lg .logo-ph { width: 200px; height: 200px; font-size: 80px; }
.in-team .nm { font-size: 56px; font-weight: 800; text-transform: uppercase; text-align: center; line-height: 1; }
.in-vs { font-size: 64px; font-weight: 800; color: rgba(255, 255, 255, .45); }
.in-vs.score { font-size: 150px; color: #fff; font-variant-numeric: tabular-nums; }
.in-count { font-size: 110px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1; }
.in-sub { font-size: 30px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .7); }

/* превью */
.pv { position: absolute; left: 80px; right: 80px; top: 160px; bottom: 150px; display: grid; grid-template-columns: 1fr 360px 1fr; gap: 40px; }
.pv-team { background: rgba(255, 255, 255, .05); border-radius: 22px; padding: 30px; display: flex; flex-direction: column; gap: 22px; border-top: 8px solid var(--tc); }
.pv-head { display: flex; align-items: center; gap: 22px; }
.pv-head .lg { width: 110px; height: 110px; display: flex; align-items: center; justify-content: center; }
.pv-head .lg img { max-width: 100%; max-height: 100%; object-fit: contain; }
.pv-head .lg .logo-ph { width: 100px; height: 100px; font-size: 40px; }
.pv-head .nm { font-size: 58px; font-weight: 800; text-transform: uppercase; line-height: .95; }
.pv-rec { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.pv-rec div { background: rgba(0, 0, 0, .3); border-radius: 14px; padding: 12px 16px; }
.pv-rec b { display: block; font-size: 46px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.pv-rec span { font-size: 18px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, .6); }
.pv-star { flex: 1; display: grid; grid-template-columns: 230px 1fr; gap: 22px; background: rgba(0, 0, 0, .3); border-radius: 16px; overflow: hidden; min-height: 0; }
.pv-star .sc-photo { height: 100%; }
.pv-star .sc-photo .n { font-size: 110px; }
.pv-star .sc-photo.has .n { font-size: 54px; }
.pv-star .inf { padding: 22px 22px 22px 0; display: flex; flex-direction: column; justify-content: center; gap: 10px; }
.pv-star .k { font-size: 20px; font-weight: 700; letter-spacing: .2em; color: var(--accent); text-transform: uppercase; }
.pv-star .pn { font-size: 44px; font-weight: 800; text-transform: uppercase; line-height: .95; }
.pv-star .ps { display: flex; gap: 22px; margin-top: 8px; }
.pv-star .ps b { font-size: 44px; font-weight: 800; display: block; line-height: 1; font-variant-numeric: tabular-nums; }
.pv-star .ps span { font-size: 17px; font-weight: 600; color: rgba(255, 255, 255, .6); letter-spacing: .08em; text-transform: uppercase; }
.pv-mid { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 26px; text-align: center; }
.pv-mid .vs { font-size: 120px; font-weight: 800; line-height: 1; color: rgba(255, 255, 255, .9); }
.pv-mid .when { font-size: 30px; font-weight: 700; letter-spacing: .08em; }
.pv-mid h4 { font-size: 20px; letter-spacing: .2em; color: rgba(255, 255, 255, .6); text-transform: uppercase; margin-top: 10px; }
.pv-h2h { width: 100%; display: flex; flex-direction: column; gap: 8px; }
.pv-h2h div { display: flex; justify-content: space-between; background: rgba(255, 255, 255, .06); border-radius: 10px; padding: 8px 14px; font-size: 24px; font-weight: 700; }
.pv-h2h small { color: rgba(255, 255, 255, .55); font-size: 18px; font-weight: 600; }

/* пятёрки обеих команд */
.lu2 { position: absolute; left: 80px; right: 80px; top: 150px; bottom: 140px; display: grid; grid-template-rows: 1fr 1fr; gap: 26px; }
.lu2-row { display: grid; grid-template-columns: 280px repeat(5, 1fr); gap: 16px; }
.lu2-team { display: flex; flex-direction: column; justify-content: center; gap: 16px; border-left: 10px solid var(--tc); padding-left: 24px; }
.lu2-team .lg { width: 110px; height: 110px; display: flex; align-items: center; }
.lu2-team .lg img { max-width: 100%; max-height: 100%; object-fit: contain; }
.lu2-team .lg .logo-ph { width: 100px; height: 100px; font-size: 40px; }
.lu2-team .nm { overflow-wrap: anywhere; hyphens: auto; font-size: 40px; font-weight: 800; text-transform: uppercase; line-height: .95; }
.lu2-p { border-radius: 16px; overflow: hidden; background: rgba(255, 255, 255, .06); display: flex; flex-direction: column; }
.lu2-p .sc-photo { flex: 1; }
.lu2-p .sc-photo .n { font-size: 110px; }
.lu2-p .sc-photo.has .n { font-size: 48px; }
.lu2-p .inf { padding: 12px 16px 14px; }
.lu2-p .pn { font-size: 34px; font-weight: 800; text-transform: uppercase; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lu2-p .pf { font-size: 20px; font-weight: 600; color: rgba(255, 255, 255, .75); text-transform: uppercase; letter-spacing: .06em; min-height: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lu2-p .pp { font-size: 17px; font-weight: 600; letter-spacing: .1em; color: rgba(255, 255, 255, .6); text-transform: uppercase; margin-top: 4px; min-height: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* дуэль лидеров */
.du { position: absolute; left: 80px; right: 80px; top: 150px; bottom: 140px; display: grid; grid-template-columns: 520px 1fr 520px; gap: 40px; }
.du-p { border-radius: 22px; overflow: hidden; display: flex; flex-direction: column; background: rgba(255, 255, 255, .05); }
.du-p .sc-photo { flex: 1; }
.du-p .sc-photo .n { font-size: 240px; }
.du-p .sc-photo.has .n { font-size: 80px; }
.du-p .inf { padding: 20px 26px 24px; border-top: 8px solid var(--tc); }
.du-p .pn { font-size: 50px; font-weight: 800; text-transform: uppercase; line-height: .95; }
.du-p .pt { font-size: 22px; font-weight: 600; letter-spacing: .14em; color: rgba(255, 255, 255, .6); text-transform: uppercase; margin-top: 8px; }
.du-mid { display: flex; flex-direction: column; justify-content: center; gap: 16px; }
.du-mid h2 { text-align: center; font-size: 76px; font-weight: 800; text-transform: uppercase; line-height: 1; margin-bottom: 4px; }
.du-mid h3 { text-align: center; font-size: 22px; letter-spacing: .2em; color: rgba(255, 255, 255, .6); text-transform: uppercase; margin: 14px 0 0; }
.du-row { display: grid; grid-template-columns: 110px 1fr 110px; align-items: center; gap: 12px; }
.du-row b { font-size: 54px; font-weight: 800; font-variant-numeric: tabular-nums; }
.du-row b:last-child { text-align: right; }
.du-row b.w { color: var(--accent); }
.du-row .l { text-align: center; font-size: 22px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, .75); }
.du-row .bars { display: flex; gap: 6px; margin-top: 8px; }
.du-row .bars i { height: 8px; border-radius: 4px; display: block; }

/* большая карточка игрока и лучший игрок */
.pl { position: absolute; left: 80px; right: 80px; top: 150px; bottom: 140px; display: grid; grid-template-columns: 640px 1fr; gap: 60px; }
.pl .sc-photo { border-radius: 24px; }
.pl .sc-photo .n { font-size: 300px; }
.pl .sc-photo.has .n { font-size: 110px; }
.pl-inf { display: flex; flex-direction: column; justify-content: center; gap: 18px; }
.pl-team { display: flex; align-items: center; gap: 14px; font-size: 28px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: rgba(255, 255, 255, .75); }
.pl-team img { height: 56px; max-width: 110px; object-fit: contain; }
.pl-team i { width: 14px; height: 40px; border-radius: 4px; background: var(--tc); }
.pl-name { font-size: 118px; font-weight: 800; text-transform: uppercase; line-height: .9; }
.pl-pos { font-size: 30px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: rgba(255, 255, 255, .65); }
.pl h4 { font-size: 22px; letter-spacing: .22em; color: var(--accent); text-transform: uppercase; margin-top: 16px; }
.pl-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }
.pl-grid div { background: rgba(255, 255, 255, .07); border-radius: 16px; padding: 16px 18px; }
.pl-grid b { display: block; font-size: 64px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.pl-grid span { font-size: 18px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .6); }
.pl-grid.small b { font-size: 46px; }
.scene.mvp .pl .sc-photo { box-shadow: 0 0 0 6px var(--accent), 0 30px 90px var(--accentA, rgba(255, 176, 32, .4)); }
.mvp-badge { display: inline-flex; align-self: flex-start; align-items: center; gap: 14px; background: var(--accent); color: #111; padding: 10px 22px; border-radius: 12px; font-size: 30px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }

/* лидеры матча — панель, табло остаётся */
.scene.panel-scene { inset: auto; left: 0; right: 0; top: 0; bottom: 0; margin: auto; width: 1500px; height: max-content; background: var(--bg); border-radius: calc(var(--radius) + 6px); box-shadow: var(--shadow); color: var(--fg); }
.scene.panel-scene::before { display: none; }
.ld-head { display: flex; align-items: center; gap: 20px; padding: 28px 40px 10px; }
.ld-head h1 { font-size: 60px; font-weight: 800; text-transform: uppercase; line-height: 1; flex: 1; }
.ld-head .sc-kicker { font-size: 22px; }
.ld { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 20px 40px 36px; }
.ld-col h3 { font-size: 22px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
.ld-p { display: grid; grid-template-columns: 96px 1fr auto; gap: 16px; align-items: center; background: var(--bg2); border-radius: 14px; overflow: hidden; margin-bottom: 12px; border-left: 8px solid var(--tc); }
.ld-p .sc-photo { height: 110px; }
.ld-p .sc-photo .n { font-size: 50px; }
.ld-p .sc-photo.has .n { display: none; }
.ld-p .pn { font-size: 30px; font-weight: 800; text-transform: uppercase; line-height: 1; }
.ld-p .pt { font-size: 18px; font-weight: 600; letter-spacing: .12em; color: var(--muted); text-transform: uppercase; margin-top: 6px; }
.ld-p .v { font-size: 64px; font-weight: 800; padding-right: 22px; font-variant-numeric: tabular-nums; }
.ld-p.empty { opacity: .4; }

/* большие панели — по центру свободной области, не залезая на табло */
#lineup, #board { bottom: 140px; }
body.pos-top-left #lineup, body.pos-top-center #lineup, body.pos-top-right #lineup,
body.pos-top-left #board, body.pos-top-center #board, body.pos-top-right #board { top: 140px; bottom: 0; }

/* карточка без фото — без рамки слева */
.card.nophoto .card-num { display: none; }
.card.nophoto .card-main { padding-left: 30px; border-left: 8px solid var(--tc); }
/* тренер в составах */
.coach-chip { display: flex; align-items: center; gap: 12px; margin-top: 4px; }
.coach-chip img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; object-position: top; border: 3px solid var(--tc); }
.coach-chip small { display: block; font-size: 16px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .6); }
.coach-chip b { display: block; font-size: 26px; font-weight: 800; text-transform: uppercase; line-height: 1.05; }
.p-head .coach-chip small { color: var(--muted); }
.card.nophoto { min-width: 480px; }
.lu-p .lu-ph:only-child, .lu2-p .sc-photo:only-child { height: 100%; }