/* Трансляции — живой счёт и хайлайты. Стили дополняют style.css / cabinet.css */
.liveBody{background:
  radial-gradient(1100px 520px at 50% -10%,rgba(34,197,94,.10),transparent 70%),
  linear-gradient(180deg,#070908,#080c0a 60%,#070908);min-height:100vh}
.liveWrap{max-width:1240px;margin:0 auto;padding:112px 20px 64px}

.liveHead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.liveHead h1{font-size:clamp(1.6rem,3.6vw,2.3rem);letter-spacing:-.02em;line-height:1.15;margin-top:8px}
.liveHead__sub{display:block;font-size:.82rem;font-weight:400;color:var(--muted);letter-spacing:0;margin-top:6px}
.liveHead__meta{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:.76rem;color:var(--muted)}
.liveRefresh{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:10px;
  border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:#cfdcd4;
  font-family:var(--mono);font-size:.72rem;transition:all .16s ease}
.liveRefresh:hover{border-color:rgba(34,197,94,.45);color:#eafff1;background:rgba(34,197,94,.08)}
.liveRefresh svg{transition:transform .5s ease}
.liveRefresh.is-spin svg{transform:rotate(360deg)}

.livePill{display:inline-flex;align-items:center;gap:8px;padding:5px 12px;border-radius:100px;
  border:1px solid rgba(34,197,94,.35);background:rgba(34,197,94,.08);
  font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:#9bf0b4}
.liveDot{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.6);
  animation:pulseDot 1.9s infinite}
.livePill.is-off{border-color:var(--line-2);background:rgba(255,255,255,.03);color:var(--muted)}
.livePill.is-off .liveDot{background:#6b7a72;animation:none;box-shadow:none}
@keyframes pulseDot{
  0%{box-shadow:0 0 0 0 rgba(34,197,94,.55)}
  70%{box-shadow:0 0 0 7px rgba(34,197,94,0)}
  100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}
}

.liveTabs{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.liveTab{padding:8px 14px;border-radius:100px;border:1px solid var(--line);
  background:rgba(255,255,255,.02);color:#b9c8bf;font-size:.8rem;transition:all .16s ease}
.liveTab b{font-family:var(--mono);font-size:.72rem;color:#8ce0a6;margin-left:5px}
.liveTab:hover{border-color:rgba(34,197,94,.35);color:#e6f4ec}
.liveTab.is-on{background:rgba(34,197,94,.14);border-color:rgba(34,197,94,.5);color:#eafff1}
.liveTabs__cnt{margin-left:auto;font-family:var(--mono);font-size:.7rem;color:var(--muted)}

.liveList{display:flex;flex-direction:column;gap:9px}
.liveCard{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;
  padding:14px 16px;border-radius:14px;border:1px solid var(--line);
  background:linear-gradient(165deg,rgba(18,27,23,.75),rgba(11,17,15,.75));
  transition:border-color .16s ease,transform .16s ease}
.liveCard:hover{border-color:rgba(34,197,94,.3)}
.liveCard.is-live{border-color:rgba(34,197,94,.42);
  background:linear-gradient(165deg,rgba(20,42,29,.8),rgba(11,20,15,.8))}
.liveCard.is-soon{opacity:.9}
.liveCard__top{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:7px;
  font-family:var(--mono);font-size:.72rem;color:var(--muted)}
.liveCard__tour{color:#a8e6bb}
.liveBadge{padding:2px 8px;border-radius:100px;font-size:.7rem;letter-spacing:.05em;text-transform:uppercase}
.liveBadge--live{background:rgba(34,197,94,.18);border:1px solid rgba(34,197,94,.5);color:#9bf0b4}
.liveBadge--soon{background:rgba(255,255,255,.04);border:1px solid var(--line-2);color:#a9b8af}
.liveBadge--today{border:1px solid rgba(34,197,94,.3);color:#9bf0b4;background:rgba(34,197,94,.07)}
.liveBadge--tomorrow{border:1px solid rgba(96,165,250,.3);color:#9cc4fb;background:rgba(96,165,250,.07)}
.liveBadge--sets{border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:#cfdcd4;
  font-family:var(--mono)}

.liveCard__players{display:flex;flex-direction:column;gap:4px}
.livePlayer{display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-size:1rem;color:#e8f2ec}
.livePlayer.is-lead{color:#fff;font-weight:600}
.livePlayer.is-lose{color:#93a49a}
.livePlayer__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:56vw}
.livePlayer__score{display:flex;gap:6px;font-family:var(--mono);font-size:.9rem}
.livePlayer__set{min-width:17px;text-align:center;color:#cfdcd4}
.livePlayer__set.is-won{color:#22c55e;font-weight:700}
.livePlayer__games{min-width:34px;padding-left:6px;border-left:1px solid var(--line);
  text-align:center;color:#fff;font-weight:700}
.livePlayer__pts{min-width:30px;text-align:center;color:#22c55e;font-weight:700}
.livePlayer__serve{width:5px;height:5px;border-radius:50%;background:#22c55e;margin-right:6px;flex:none}

.liveCard__act{display:flex;flex-direction:column;gap:6px;align-items:stretch;min-width:132px}
.liveBtn{display:inline-flex;align-items:center;justify-content:center;gap:7px;
  padding:10px 14px;border-radius:10px;font-size:.82rem;font-weight:600;
  background:linear-gradient(180deg,#22c55e,#16a34a);color:#05110a;
  box-shadow:0 6px 18px rgba(34,197,94,.22);transition:transform .14s ease,box-shadow .14s ease}
.liveBtn:hover{transform:translateY(-1px);box-shadow:0 9px 24px rgba(34,197,94,.3)}
.liveBtn--ghost{background:rgba(255,255,255,.04);color:#cfdcd4;box-shadow:none;
  border:1px solid var(--line-2);font-weight:500}
.liveBtn--ghost:hover{border-color:rgba(34,197,94,.4);color:#eafff1}
.liveCard__odds{font-family:var(--mono);font-size:.68rem;color:var(--muted);text-align:center}
.liveCard__odds b{color:#dfeee6}

.hlSec{margin-top:40px}
.hlSec__head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.hlSec__head h2{font-size:1.25rem;letter-spacing:-.01em}
.hlSec__note{font-family:var(--mono);font-size:.72rem;color:var(--muted)}
.hlGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(228px,1fr));gap:12px}
.hlCard{border-radius:13px;overflow:hidden;border:1px solid var(--line);
  background:rgba(14,20,17,.7);cursor:pointer;transition:transform .16s ease,border-color .16s ease}
.hlCard:hover{transform:translateY(-2px);border-color:rgba(34,197,94,.38)}
.hlCard__img{position:relative;aspect-ratio:16/9;overflow:hidden;background:#0d1411}
.hlCard__img img{width:100%;height:100%;object-fit:cover}
.hlCard__play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.45))}
.hlCard__play span{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:rgba(34,197,94,.92);color:#04120a;box-shadow:0 6px 20px rgba(0,0,0,.45)}
.hlCard__txt{padding:10px 12px 12px}
.hlCard__t{font-size:.8rem;line-height:1.4;color:#e2eee8;display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden}
.hlCard__meta{margin-top:6px;font-family:var(--mono);font-size:.7rem;color:var(--muted);
  display:flex;gap:8px;flex-wrap:wrap}
.hlCard__ch{color:#9bf0b4}

.liveWarn{margin-top:26px;font-size:.72rem;color:var(--muted);line-height:1.6}

.hlModal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:18px}
.hlModal[hidden]{display:none}
.hlModal__bg{position:absolute;inset:0;background:rgba(3,6,5,.82);backdrop-filter:blur(6px)}
.hlModal__box{position:relative;width:min(920px,100%);border-radius:16px;overflow:hidden;
  border:1px solid rgba(34,197,94,.3);background:#0a0f0c;box-shadow:0 24px 70px rgba(0,0,0,.6)}
.hlModal__x{position:absolute;top:10px;right:10px;z-index:2;width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.55);color:#e3eae5;
  border:1px solid rgba(255,255,255,.14)}
.hlModal__x:hover{background:rgba(34,197,94,.25)}
.hlModal__frame{aspect-ratio:16/9;background:#000}
.hlModal__frame iframe{width:100%;height:100%;border:0;display:block}
.hlModal__title{padding:12px 16px 4px;font-size:.88rem;color:#e8f2ec}
.hlModal__yt{margin:6px 16px 14px;display:inline-flex;font-size:.76rem;padding:7px 12px}

@media(max-width:720px){
  .liveWrap{padding:98px 14px 48px}
  .liveCard{grid-template-columns:1fr;gap:10px}
  .liveCard__act{flex-direction:row;min-width:0}
  .liveCard__act .liveBtn{flex:1}
  .liveCard__odds{display:none}
  .livePlayer__name{max-width:44vw;font-size:.94rem}
  .liveHead__meta{width:100%;justify-content:space-between}
}

/* ── превью на главной (тизер) ── */
.liveteaser{display:flex;flex-direction:column;gap:7px}
.liveteaser__ph{padding:16px;border-radius:12px;border:1px dashed var(--line-2);
  font-family:var(--mono);font-size:.76rem;color:var(--muted);text-align:center}
.ltRow{display:grid;grid-template-columns:130px 1fr auto 52px;gap:12px;align-items:center;
  padding:11px 14px;border-radius:12px;border:1px solid var(--line);
  background:linear-gradient(165deg,rgba(18,27,23,.7),rgba(11,17,15,.7));
  transition:border-color .16s ease,transform .16s ease}
.ltRow:hover{border-color:rgba(34,197,94,.35);transform:translateX(2px)}
.ltTour{font-family:var(--mono);font-size:.7rem;color:#9bf0b4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ltNames{font-size:.86rem;color:#e6f2ec;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ltNames i{color:#5f6d66;font-style:normal}
.ltLive{padding:2px 8px;border-radius:100px;background:rgba(34,197,94,.16);
  border:1px solid rgba(34,197,94,.45);color:#9bf0b4;font-family:var(--mono);
  font-size:.64rem;letter-spacing:.05em;text-transform:uppercase}
.ltSoon{padding:2px 8px;border-radius:100px;border:1px solid var(--line-2);
  font-family:var(--mono);font-size:.64rem;color:var(--muted)}
.ltTime{font-family:var(--mono);font-size:.82rem;color:#cfdcd4;text-align:right}
.ltScore{font-family:var(--mono);font-size:.9rem;font-weight:700;color:#22c55e;text-align:right}
.liveteaser__foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px}
.liveteaser__note{font-family:var(--mono);font-size:.66rem;color:var(--muted)}
@media(max-width:720px){
  .ltRow{grid-template-columns:1fr auto;grid-template-areas:"names score" "tour live";gap:6px 10px}
  .ltTour{grid-area:tour}
  .ltNames{grid-area:names;white-space:normal}
  .ltLive,.ltSoon{grid-area:live;justify-self:start}
  .ltTime,.ltScore{grid-area:score}
}

/* ===== фоновая картинка секции «Трансляции» на главной ===== */
#live{
  position:relative;isolation:isolate;overflow:hidden;
  background-color:#050907;
  background-image:
    linear-gradient(180deg,rgba(4,8,6,.96) 0%,rgba(4,8,6,.72) 10%,rgba(4,8,6,.52) 42%,rgba(4,8,6,.60) 74%,rgba(4,8,6,.96) 100%),
    url("images/live-bg.jpg");
  background-size:cover,cover;
  background-position:center top,center 58%;
  background-repeat:no-repeat,no-repeat;
}
#live > .wrap{position:relative;z-index:1}
#live .sec__head h2{text-shadow:0 2px 24px rgba(0,0,0,.9),0 1px 3px rgba(0,0,0,.7)}
#live .sec__sub{color:#c8d8ce;text-shadow:0 1px 14px rgba(0,0,0,.92),0 1px 2px rgba(0,0,0,.7)}
#live .liveteaser__ph{
  background:rgba(9,15,12,.62);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
#live .liveCard{
  background:linear-gradient(165deg,rgba(18,27,23,.80),rgba(11,17,15,.86));
  -webkit-backdrop-filter:blur(4px) saturate(1.05);backdrop-filter:blur(4px) saturate(1.05);
}
#live .liveCard.is-live{background:linear-gradient(165deg,rgba(20,42,29,.84),rgba(11,20,15,.88))}
@media (max-width:700px){
  #live{background-position:center top,center 44%}
}
