:root {
  --sport-accent: #ffb01f;
  --sport-accent-dark: #cc8400;
  /* Сине-тёмная гамма как в личном кабинете (было плоское серое #1f/#17/#2a —
     читалось «дёшево»). Поверхности с лёгким верхним хайлайтом + мягкие тени. */
  --sport-panel: #1a1f26;
  --sport-panel-2: #12161b;
  --sport-panel-3: #242a33;
  --sport-border: #303741;
  --sport-muted: #7f8996;
  --sport-card-shadow: 0 6px 20px rgba(0, 0, 0, 0.24);
  /* Градиентные заливки поверхностей (верхний блик как у карточек кабинета). */
  --sport-surf: linear-gradient(158deg, rgba(255,255,255,0.026) 0%, rgba(255,255,255,0.004) 55%), #1a1f26;
  --sport-surf-row: linear-gradient(180deg, rgba(255,255,255,0.018), rgba(255,255,255,0.003)), #171b21;
  --sport-cell: linear-gradient(180deg, rgba(255,255,255,0.045), rgba(255,255,255,0.008)), #242a33;
  --sport-cell-hover: linear-gradient(180deg, rgba(255,255,255,0.075), rgba(255,255,255,0.012)), #2c333d;
  --sport-accent-grad: linear-gradient(180deg, #ffd873, #ffb01f 48%, #f39200);
  --sport-accent-glow: 0 4px 14px rgba(243, 146, 0, 0.30);
}

/* ========================================================================
   WINNERSLOBBY STRUCTURE PASS
   The mobile event list is a separate composition in the source: one white
   league card, white event rows and in-card primary odds. It is deliberately
   not a compressed/recoloured desktop table.
   ======================================================================== */
.content[data-sport-page] .mobile-league-copy,
.content[data-sport-page] .mobile-match-odds {
  display: none;
}

/* Keep the exact source coupon treatment over the earlier BetLab skin. */
.content[data-sport-page] #bet-slip .sports-coupon.card {
  padding: 10px;
  border-radius: 10px;
  background: linear-gradient(135deg, #233358, rgba(20, 27, 46, .6));
  box-shadow: 0 6px 22px rgba(5, 109, 218, .3);
}
.content[data-sport-page] #bet-slip .sports-coupon .tabbar.coupon {
  min-height: 0;
  margin-bottom: 15px;
  padding: 0;
  background: transparent;
}
.content[data-sport-page] #bet-slip .sports-coupon .tabbar .tab {
  min-height: 30px;
  height: 30px;
  border-radius: 8px;
  background: linear-gradient(103deg, #108de7 -30%, #0855c4);
}
.content[data-sport-page] #bet-slip .sports-coupon .coupon-type-radiogroup {
  display: flex;
  gap: 5px;
  margin-bottom: 10px;
  padding: 0 5px;
}
.content[data-sport-page] #bet-slip .sports-coupon .coupon-type-radiogroup .radio {
  display: flex;
  min-height: 17px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff;
}
.content[data-sport-page] #bet-slip .sports-coupon .coupon-card {
  margin-bottom: 10px;
  padding: 11px 0 10px;
}
.content[data-sport-page] #bet-slip .sports-coupon .BaseCouponOdd .odd-text {
  order: initial;
  align-self: stretch;
  min-width: 46px;
  width: 46px;
  margin: 0 8px 0 0;
  padding: 0;
  border-radius: 8px;
}
.content[data-sport-page] #bet-slip .sports-coupon .BaseCouponOdd_name {
  padding: 0;
  color: #096dff;
}
.content[data-sport-page] #bet-slip .sports-coupon .BaseCouponMatch_matchTeam {
  padding-left: 0;
  color: #090f1e;
}
.content[data-sport-page] #bet-slip .sports-coupon .BaseCouponMatch_matchTeam::before { display: none; }
.content[data-sport-page] #bet-slip .sports-coupon .clear-all {
  position: static;
  width: 35px;
  height: 35px;
  margin-left: 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, .1);
  color: #94a6cd;
}
.content[data-sport-page] #bet-slip .sports-coupon .bs-controls { padding: 0; }
.content[data-sport-page] #bet-slip .sports-coupon .total-coefficient {
  padding: 10px;
  background: #fff;
}
.content[data-sport-page] #bet-slip .sports-coupon .CouponTotalCoefficient_root_GnzWG {
  padding: 6px 10px;
  background: #d0daf3;
}
.content[data-sport-page] #bet-slip .sports-coupon .base-coupon-bet-form .bs-stakebox {
  width: 100%;
  min-height: 30px;
  padding: 0 10px;
  border: 0;
  background: #fff;
}
.content[data-sport-page] #bet-slip .sports-coupon .base-coupon-bet-form .amount-input {
  color: #090f1e;
  text-align: left;
}
.content[data-sport-page] #bet-slip .sports-coupon .bs-quick { display: none; }
.content[data-sport-page] #bet-slip .sports-coupon .base-coupon-submit {
  min-height: 40px;
  border-radius: 8px;
  background: linear-gradient(98deg, #ffe036, #ffc600);
  color: #090f1e;
  box-shadow: 0 2px 24px rgba(255, 202, 9, .3);
  text-transform: none;
}

@media (max-width: 900px) {
  .content[data-sport-page] .events-table-section {
    padding: 0 15px 15px;
    background: #03021d;
  }

  .content[data-sport-page] .events-table-section > .line-section-head,
  .content[data-sport-page] .events-table-section > h2,
  .content[data-sport-page] .events-table-section > .live-odds-legend {
    margin-left: 0;
    margin-right: 0;
  }

  .content[data-sport-page] .league-table-block.mobile-sports-match {
    margin: 0 0 10px;
    border: 0;
    border-radius: 12px;
    background: #fff;
    box-shadow: none;
    contain: paint;
    overflow: hidden;
  }

  .content[data-sport-page] .league-table-head.mobile-sports-match-title,
  .content[data-sport-page="line"] .league-table-head.mobile-sports-match-title,
  .content[data-sport-page="live"] .league-table-head.mobile-sports-match-title {
    display: flex;
    align-items: center;
    min-height: 56px;
    padding: 10px 15px;
    border: 0;
    border-radius: 0;
    background: #fff;
    color: #090f1e;
    box-shadow: none;
  }

  .content[data-sport-page] .mobile-sports-match-title .league-table-head-left {
    display: flex;
    align-items: center;
    width: 100%;
    min-width: 0;
    padding: 0;
  }

  .content[data-sport-page] .mobile-sports-match-title .league-table-head-left > svg {
    order: 3;
    flex: 0 0 12px;
    margin-left: auto;
    color: #090f1e;
  }

  .content[data-sport-page] .mobile-sports-match-title .league-table-head-left > svg path { stroke: currentColor; }
  .content[data-sport-page] .mobile-sports-match-title .league-flag-cc,
  .content[data-sport-page] .mobile-sports-match-title .league-icon-small-img,
  .content[data-sport-page] .mobile-sports-match-title .desktop-league-name,
  .content[data-sport-page] .mobile-sports-match-title .league-table-cols-head {
    display: none;
  }

  .content[data-sport-page] .mobile-league-copy {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    margin-right: 12px;
  }

  .content[data-sport-page] .mobile-league-copy .mobile-tournament-category {
    display: block;
    max-width: 100%;
    color: #94a6cd;
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .content[data-sport-page] .mobile-league-copy .mobile-tournament-name {
    display: block;
    max-width: 100%;
    color: #090f1e;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .content[data-sport-page] .mobile-sports-match .league-table-body { background: #fff; }

  .content[data-sport-page] .mobile-sports-match .league-table-row.mobile-sports-match-event,
  .content[data-sport-page] .mobile-sports-match .league-table-row.mobile-sports-match-event.lh-card {
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    border-top: 1px solid rgba(96, 123, 182, .10);
    border-radius: 0;
    background: #fff !important;
    color: #090f1e;
    box-shadow: none;
  }

  .content[data-sport-page] .mobile-sports-match .league-table-row.mobile-sports-match-event:hover {
    background: #fff !important;
    color: #090f1e;
  }

  .content[data-sport-page] .mobile-sports-match .lh-mobile.live-event-main {
    display: flex;
    width: 100%;
    min-height: 145px;
    height: auto;
    padding: 0 0 15px;
    border-radius: 0;
    background: #fff;
    color: #090f1e;
  }

  .content[data-sport-page] .mobile-sports-match .live-event-main .match-header {
    display: flex;
    align-items: flex-start;
    min-height: 20px;
    height: 20px;
    box-sizing: content-box;
    margin: 0 0 4px;
    padding: 15px 15px 0;
  }

  .content[data-sport-page] .mobile-sports-match .live-event-main .top-live-match-info {
    display: flex;
    align-items: center;
    min-height: 30px;
    height: 30px;
    padding: 0 15px;
  }

  .content[data-sport-page] .mobile-sports-match .live-event-main .match-details {
    margin: 0 0 5px;
    padding: 0 15px;
    color: #6c7da3;
    font-size: 11px;
    line-height: 1;
  }

  .content[data-sport-page] .mobile-sports-match .live-event-main .mobile-team-avatars {
    flex-basis: 51px;
    width: 51px;
    margin-right: 8px;
  }

  .content[data-sport-page] .mobile-sports-match .live-event-main .match-teams {
    margin-right: 15px;
    padding: 0 10px;
  }

  .content[data-sport-page] .mobile-match-odds.match-odd-list {
    display: flex;
    gap: 10px;
    margin: 5px 15px 0;
    padding: 0;
    list-style: none;
  }

  .content[data-sport-page] .mobile-match-odds .match-odd-item {
    flex: 1;
    min-width: 0;
    margin: 0;
  }

  .content[data-sport-page] .mobile-match-odds .live-top-odd {
    display: flex;
    align-items: center;
    width: 100%;
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border: 0;
    border-radius: 12px;
    background: rgba(108, 125, 163, .20);
    color: #090f1e;
    font-size: 14px;
    transition: all .3s;
  }

  .content[data-sport-page] .mobile-match-odds .live-top-odd:disabled { opacity: .45; }
  .content[data-sport-page] .mobile-match-odds .live-top-odd.active {
    background: linear-gradient(143.56deg, #0095ff -58.98%, #0855c4 95.86%);
    color: #fff;
    box-shadow: 0 6px 22px rgba(5, 109, 218, .20);
  }

  .content[data-sport-page] .mobile-match-odds .odd-values {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
  }

  .content[data-sport-page] .mobile-match-odds .odd-name {
    margin-right: 5px;
    color: inherit;
    font-size: 12px;
    text-transform: uppercase;
  }

  .content[data-sport-page] .mobile-match-odds .odd-value {
    margin-left: auto;
    color: inherit;
    font-size: 14px;
    font-weight: 700;
    text-align: right;
  }

  /* The source mobile card shows only its primary in-card market buttons. */
  .content[data-sport-page] .mobile-sports-match-event > .league-row-odds--line,
  .content[data-sport-page] .mobile-sports-match-event > .league-row-odds--live {
    display: none;
  }

  .content[data-sport-page="live"] .mobile-sports-match .lh-progress,
  .content[data-sport-page="live"] .mobile-sports-match .lh-mstat {
    margin-left: 15px;
    margin-right: 15px;
  }
}

@media (max-width: 420px) {
  .content[data-sport-page] .events-table-section { padding-right: 10px; padding-left: 10px; }
  .content[data-sport-page] .mobile-sports-match .live-event-main .match-header { padding-right: 12px; padding-left: 12px; }
  .content[data-sport-page] .mobile-sports-match .live-event-main .top-live-match-info,
  .content[data-sport-page] .mobile-sports-match .live-event-main .match-details { padding-right: 12px; padding-left: 12px; }
  .content[data-sport-page] .mobile-match-odds.match-odd-list { margin-right: 12px; margin-left: 12px; gap: 8px; }
}

.sport-shell {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr) 304px;
  gap: 8px;
  padding-bottom: 20px;
}

.sport-sidebar,
.sport-betslip,
.sport-main {
  min-width: 0;
}

.sport-panel {
  background: var(--sport-panel);
  border: 1px solid var(--sport-border);
  border-top: 2px solid var(--sport-accent);
  border-radius: 6px;
  box-shadow: var(--sport-card-shadow);
}

.sport-panel+.sport-panel {
  margin-top: 8px;
}

.sport-hero {
  background: linear-gradient(120deg, #2b2b2b 0%, #1a1a1a 60%);
  border-radius: var(--main_radius);
  padding: 16px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  margin-bottom: 15px;
  border: 1px solid var(--sport-border);
}

.sport-hero h1 {
  margin: 0 0 6px 0;
  font-size: 20px;
}

.sport-hero p {
  margin: 0;
  color: var(--sport-muted);
}

.sport-hero img {
  width: 56px;
  height: 56px;
  opacity: 0.75;
}

.sport-tabs {
  display: flex;
  gap: 8px;
  padding: 10px;
}

.sport-tab {
  flex: 1;
  border-radius: 10px;
  border: 1px solid transparent;
  background: var(--sport-panel-2);
  color: #fff;
  font-weight: 600;
  padding: 8px 10px;
  cursor: pointer;
  transition: 0.2s ease;
  text-align: center;
  text-decoration: none;
}

.sport-tab.is-active {
  background: var(--sport-accent);
  color: #000;
}

.sport-search {
  padding: 0 10px 10px 10px;
}

.sport-search input {
  box-sizing: border-box;
  width: 100%;
  border-radius: 4px;
  border: 1px solid var(--sport-border);
  background: var(--sport-panel-2);
  color: #fff;
  padding: 8px 12px;
}

.sport-range {
  width: 100%;
  margin-top: 8px;
  accent-color: var(--sport-accent);
}

.mobile-search-bar {
  display: none;
  padding: 0 0 12px 0;
}

.mobile-search-bar input {
  box-sizing: border-box;
  width: 100%;
  border-radius: 10px;
  border: 1px solid var(--sport-border);
  background: var(--sport-panel-2);
  color: #fff;
  padding: 9px 14px;
  font-size: 14px;
}

@media (max-width: 900px) {
  .mobile-search-bar {
    display: block;
  }

  /* Hide sidebar search on mobile — mobile-search-bar handles it at the top */
  .sport-sidebar .sport-search {
    display: none;
  }
}

.sport-section {
  padding: 12px 12px 6px 12px;
}

.sport-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.sport-section-head h3 {
  margin: 0;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #fff;
}

.sport-toggle {
  border: 0;
  background: transparent;
  color: var(--sport-muted);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.sport-accordion.is-collapsed .sport-list,
.sport-accordion.is-collapsed .sport-sublist,
.sport-accordion.is-collapsed .sport-event-grid,
.sport-accordion.is-collapsed .sport-league-grid,
.sport-accordion.is-collapsed .live-header,
.sport-accordion.is-collapsed .live-row,
.sport-accordion.is-collapsed .betslip-body {
  display: none;
}

.sport-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
}

.sport-list button,
.sport-list a {
  width: 100%;
  background: var(--sport-panel-2);
  border: 1px solid transparent;
  border-radius: 10px;
  color: #fff;
  padding: 8px 10px;
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  cursor: pointer;
  text-decoration: none;
}

.sport-list-league {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
}

.sport-list-league button,
.sport-list-league a {
  width: 100%;
  background: var(--sport-panel-2);
  border: 1px solid transparent;
  border-radius: 10px;
  color: #fff;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  text-align: left;
  line-height: 1.25;
  cursor: pointer;
  text-decoration: none;
}

/* Иконка лиги — фиксированный столбец слева, чтобы текст у всех строк
   начинался с одной позиции и переносы выглядели одинаково. */
.sport-list-league .league-icon,
.sport-list-league .league-flag-img {
  flex: 0 0 18px;
  width: 18px;
  height: auto;
  margin: 0;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.sport-list button:hover,
.sport-list a:hover {
  border-color: var(--sport-accent);
}

.sport-list .count {
  color: var(--sport-muted);
  font-size: 12px;
}

.sport-categories {
  padding: 10px;
  background: var(--sport-panel);
  border: 1px solid var(--sport-border);
  border-top: 2px solid var(--sport-accent);
  border-radius: var(--main_radius);
  display: flex;
  gap: 10px;
  overflow-x: auto;
  margin-bottom: 15px;
}

.sport-categories::-webkit-scrollbar {
  height: 3px;
}

.sport-categories::-webkit-scrollbar-thumb {
  background: var(--sport-border);
}

.sport-cat {
  min-width: 110px;
  width: 100%;
  background: var(--sport-panel-2);
  border: 1px solid transparent;
  color: #fff;
  border-radius: 12px;
  padding: 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
}


.sport-cat .icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--sport-panel-3);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  color: var(--sport-accent);
}

.sport-cat.is-active {
  background: var(--sport-accent);
  color: #000;
}

.sport-cat.is-active .icon {
  background: rgba(0, 0, 0, 0.15);
  color: #000;
}

.sport-block {
  background: var(--sport-panel);
  border: 1px solid var(--sport-border);
  border-top: 2px solid var(--sport-accent);
  border-radius: var(--main_radius);
  padding: 12px;
  margin-bottom: 15px;
}

.sport-block-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.sport-block-head h2 {
  margin: 0;
  font-size: 16px;
}

.sport-event-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.sport-event-card {
  background: var(--sport-panel-2);
  border-radius: 12px;
  padding: 12px;
  border: 1px solid transparent;
}

.sport-event-card:hover {
  border-color: var(--sport-accent);
}

.sport-event-title {
  color: var(--sport-muted);
  font-size: 12px;
  margin-bottom: 10px;
}

.sport-event-time {
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 4px;
}

.sport-event-date {
  text-align: center;
  font-size: 12px;
  color: var(--sport-muted);
  margin-bottom: 10px;
}

.sport-event-teams {
  display: flex;
  justify-content: space-between;
  font-weight: 600;
  margin-bottom: 12px;
  gap: 10px;
}

.sport-odds {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.odd-btn {
  background: var(--sport-panel-3);
  border: 1px solid var(--sport-border);
  border-radius: 10px;
  color: #fff;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  transition: all 0.15s;
}

.odd-btn:hover {
  border-color: var(--sport-accent);
}

.odd-btn span {
  color: #fff;
  font-weight: 700;
}

.odd-btn.is-active {
  background: var(--sport-accent);
  color: #000;
}

.odd-btn.is-active span {
  color: #000;
}

.sport-event-footer {
  margin-top: 10px;
  background: var(--sport-accent);
  color: #000;
  border-radius: 10px;
  padding: 8px 10px;
  text-align: center;
  font-weight: 700;
}

.sport-league-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
}

.sport-league-card {
  background: var(--sport-panel-2);
  border-radius: 12px;
  padding: 12px;
  text-align: center;
  border: 1px solid transparent;
}

.sport-league-card:hover {
  border-color: var(--sport-accent);
}

.sport-league-logo {
  width: 64px;
  height: 64px;
  margin: 0 auto 10px auto;
  border-radius: 16px;
  background: var(--sport-panel-3);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  color: var(--sport-accent);
}

.sport-betslip {
  position: sticky;
  top: 10px;
  border-top: 2px solid var(--sport-accent);
  border-radius: 10px;
  overflow: hidden;
}

.betslip-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px;
  border-bottom: 1px solid var(--sport-border);
}

.betslip-head span {
  margin-left: 6px;
  background: var(--sport-panel-3);
  border-radius: 999px;
  padding: 2px 6px;
  font-size: 11px;
  color: var(--sport-muted);
}

.betslip-tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  padding: 10px;
}

.betslip-tab {
  border-radius: 10px;
  border: 1px solid transparent;
  background: var(--sport-panel-2);
  color: #fff;
  padding: 6px 8px;
  cursor: pointer;
}

.betslip-tab.is-active {
  background: var(--sport-accent);
  color: #000;
}

.betslip-body {
  padding: 12px;
}

.betslip-placeholder {
  text-align: center;
  color: var(--sport-muted);
  padding: 20px 0;
}

.betslip-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.bet-item {
  background: var(--sport-panel-2);
  border-radius: 10px;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.bet-info {
  min-width: 0;
}

.bet-title {
  font-weight: 600;
  font-size: 13px;
}

.bet-meta {
  font-size: 12px;
  color: var(--sport-muted);
}

.bet-remove {
  border: 0;
  background: transparent;
  color: var(--sport-muted);
  cursor: pointer;
  font-size: 18px;
}

.betslip-total {
  margin-top: 12px;
  padding: 10px;
  background: var(--sport-panel-2);
  border-radius: 10px;
  display: grid;
  gap: 8px;
}

.betslip-total label {
  display: grid;
  gap: 6px;
  font-size: 12px;
  color: var(--sport-muted);
}

.betslip-total input {
  box-sizing: border-box;
  width: 100%;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid var(--sport-border);
  background: #101010;
  color: #fff;
}

.betslip-total .total-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 600;
}

.betslip-switch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--sport-panel-2);
  border-radius: 10px;
  padding: 10px;
  margin-top: 10px;
}

.switch {
  width: 42px;
  height: 24px;
  background: #444;
  border-radius: 999px;
  position: relative;
  cursor: pointer;
}

.switch::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  transition: 0.2s ease;
}

.switch.is-on {
  background: var(--sport-accent);
}

.switch.is-on::after {
  left: 21px;
  background: #000;
}

.betslip-action {
  box-sizing: border-box;
  margin-top: 10px;
  width: 100%;
  border: 0;
  border-radius: 10px;
  padding: 10px;
  background: var(--sport-accent-dark);
  color: #000;
  font-weight: 700;
  cursor: pointer;
}

.betslip-message {
  margin-top: 10px;
  color: var(--sport-muted);
  text-align: center;
  font-size: 12px;
}

.betslip-extra {
  margin-top: 12px;
  background: var(--sport-panel-2);
  border-radius: 10px;
  padding: 12px;
}

.betslip-extra h4 {
  margin: 0 0 6px 0;
  font-size: 13px;
}

.betslip-win {
  margin-top: 8px;
  text-align: center;
  font-weight: 700;
  color: var(--sport-accent);
}

.live-table {
  display: grid;
  gap: 12px;
}

.live-block {
  border-radius: 12px;
  border: 1px solid var(--sport-border);
  overflow: hidden;
}

.live-block-head {
  background: var(--sport-accent);
  color: #000;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 700;
}

.live-row {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: 8px;
  align-items: center;
  background: var(--sport-panel-2);
  color: #fff;
  padding: 10px 12px;
  border-top: 1px solid var(--sport-border);
}

.live-row:nth-child(even) {
  background: var(--sport-panel);
}

.live-team {
  display: grid;
  gap: 4px;
  font-weight: 600;
}

.live-score {
  font-size: 12px;
  color: #ff6b6b;
}

.live-odd {
  background: var(--sport-panel-3);
  border-radius: 8px;
  padding: 6px 8px;
  text-align: center;
  cursor: pointer;
  border: 1px solid var(--sport-border);
  font-weight: 600;
  color: #fff;
  transition: all 0.15s;
}

.live-odd.is-active {
  background: var(--sport-accent);
  color: #000;
  border-color: var(--sport-accent-dark);
}

.live-header {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: 8px;
  padding: 8px 12px;
  background: var(--sport-panel-2);
  color: var(--sport-muted);
  font-weight: 700;
}

@media (max-width: 1300px) {
  .sport-shell {
    grid-template-columns: 230px minmax(0, 1fr);
  }

  .sport-betslip {
    position: static;
    grid-column: 1 / -1;
  }
}

@media (max-width: 1100px) {
  .sport-event-grid {
    grid-template-columns: 1fr;
  }

  .live-row,
  .live-header {
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
  }
}

@media (max-width: 900px) {
  .sport-shell {
    grid-template-columns: 1fr;
  }

  .sport-sidebar {
    order: 1;
  }

  /* Keep the long browse lists compact on mobile so the controls panel
     (tabs / time slider) and the match list stay reachable instead of being
     pushed far down the page. */
  .sport-sidebar .sport-list-league,
  .sport-sidebar .sport-list {
    max-height: 240px;
    overflow-y: auto;
  }

  .sport-main {
    order: 2;
  }

  /* На мобиле виды спорта уже есть в боковом списке (.sport-list, встаёт сверху),
     поэтому сетку категорий в main скрываем, чтобы не дублировать. Выбор спорта
     работает через боковой список (он меняет тот же activeSport). */
  .sport-categories {
    display: none;
  }

  .sport-betslip {
    /* На мобиле in-page купон скрыт — используется выезжающий MobileBetslipDrawer. */
    display: none;
  }

  .sport-hero {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 700px) {
  .sport-categories {
    gap: 6px;
  }

  .sport-cat {
    min-width: 82px;
    padding: 7px;
  }
  .sport-cat .icon {
    width: 24px;
    height: 24px;
  }

  .sport-odds {
    grid-template-columns: 1fr;
  }

  .live-row,
  .live-header {
    grid-template-columns: 1fr;
  }

  .live-row {
    gap: 6px;
  }

  .live-odd {
    text-align: left;
  }
}

/* ===== ENHANCED STYLES ===== */

/* Sport cat count badge */
.sport-cat-count {
  background: rgba(255, 255, 255, 0.15);
  border-radius: 999px;
  padding: 1px 7px;
  font-size: 11px;
  margin-left: 2px;
}

.sport-cat.is-active .sport-cat-count {
  background: rgba(0, 0, 0, 0.2);
}

/* Empty state */
.sport-empty {
  text-align: center;
  padding: 60px 20px;
  background: var(--sport-panel);
  border: 1px solid var(--sport-border);
  border-top: 2px solid var(--sport-accent);
  border-radius: var(--main_radius);
  margin-bottom: 15px;
}

.sport-empty-icon {
  font-size: 48px;
  margin-bottom: 12px;
}

.sport-empty h3 {
  margin: 0 0 8px 0;
  color: #fff;
}

.sport-empty p {
  margin: 0;
  color: var(--sport-muted);
}

/* Selected event card */
.sport-event-card.is-selected {
  border-color: var(--sport-accent);
  box-shadow: 0 0 0 1px var(--sport-accent);
}

/* Active sidebar items */
.sport-list button.is-active,
.sport-list a.is-active {
  border-color: var(--sport-accent);
  background: rgba(255, 176, 31, 0.12);
}

/* Active league card */
.sport-league-card.is-active {
  border-color: var(--sport-accent);
  background: rgba(255, 176, 31, 0.08);
}

/* Betslip count badge */
.betslip-count {
  margin-left: 6px;
  background: var(--sport-accent);
  color: #000;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 12px;
  font-weight: 700;
}

/* Total win highlight */
.total-row.highlight {
  color: var(--sport-accent);
  font-size: 15px;
}

/* ===== LIVE DARK TABLE ===== */
.sport-hero--live {
  background: linear-gradient(120deg, #1a1010 0%, #0e0e0e 60%);
}

.live-pulse {
  width: 14px;
  height: 14px;
  background: #ff3b3b;
  border-radius: 50%;
  animation: pulse-live 1.5s infinite;
}

@keyframes pulse-live {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 59, 59, 0.6);
  }

  70% {
    box-shadow: 0 0 0 12px rgba(255, 59, 59, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(255, 59, 59, 0);
  }
}

.live-count-badge {
  background: var(--sport-accent);
  color: #000;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 12px;
  font-weight: 700;
  margin-left: 8px;
}

.live-block-head--dark {
  background: linear-gradient(90deg, var(--sport-accent) 0%, var(--sport-accent-dark) 100%);
  color: #000;
  padding: 10px 12px;
  border-radius: var(--main_radius) var(--main_radius) 0 0;
  font-weight: 700;
}

.live-table-dark {
  border: 1px solid var(--sport-border);
  border-radius: 0 0 var(--main_radius) var(--main_radius);
  overflow: hidden;
}

.live-header-dark {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: 8px;
  padding: 8px 12px;
  background: var(--sport-panel-2);
  color: var(--sport-muted);
  font-weight: 700;
  font-size: 13px;
}

.live-row-dark {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: 8px;
  align-items: center;
  background: var(--sport-panel-2);
  color: #fff;
  padding: 10px 12px;
  border-top: 1px solid var(--sport-border);
  transition: background 0.15s;
}

.live-row-dark:hover {
  background: var(--sport-panel-3);
}

.live-team-dark {
  display: grid;
  gap: 3px;
  font-weight: 600;
  font-size: 13px;
}

.live-score-dark {
  font-size: 11px;
  color: #ff6b6b;
  font-weight: 400;
}

.live-odd-dark {
  background: var(--sport-panel-3);
  border-radius: 8px;
  padding: 8px;
  text-align: center;
  cursor: pointer;
  border: 1px solid transparent;
  font-weight: 700;
  color: #fff;
  transition: all 0.15s;
}

.live-odd-dark:hover {
  border-color: var(--sport-accent);
}

.live-odd-dark.is-active {
  background: var(--sport-accent);
  color: #000;
  border-color: var(--sport-accent-dark);
}

.live-odd-dark.disabled {
  opacity: 0.3;
  cursor: default;
}

/* ===== RESULT PAGE ===== */
.result-page {
  max-width: 1200px;
  margin: 0 auto;
}

.result-hero-icon {
  font-size: 40px;
}

.result-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 20px;
  align-items: flex-start;
}

.result-filter-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  flex: 1;
}

.result-date-filter {
  display: flex;
  gap: 6px;
}

.result-group {
  margin-bottom: 20px;
  border-top: 2px solid var(--sport-accent);
  border-radius: 10px;
  overflow: hidden;
}

.result-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  background: var(--sport-accent);
  color: #000;
  border-radius: var(--main_radius) var(--main_radius) 0 0;
  font-weight: 700;
}

.result-group-head h3 {
  margin: 0;
  font-size: 15px;
  color: #000;
}

.result-count {
  font-size: 12px;
  opacity: 0.7;
}

.result-table {
  border: 1px solid var(--sport-border);
  border-radius: 0 0 var(--main_radius) var(--main_radius);
  overflow: hidden;
}

.result-header {
  display: grid;
  grid-template-columns: 80px 1fr 80px 1fr 100px;
  gap: 8px;
  padding: 8px 12px;
  background: var(--sport-panel-2);
  color: var(--sport-muted);
  font-weight: 700;
  font-size: 12px;
}

.result-row {
  display: grid;
  grid-template-columns: 80px 1fr 80px 1fr 100px;
  gap: 8px;
  padding: 10px 12px;
  background: var(--sport-panel);
  border-top: 1px solid var(--sport-border);
  align-items: center;
}

.result-row:hover {
  background: var(--sport-panel-3);
}

.result-date {
  color: var(--sport-muted);
  font-size: 13px;
}

.result-team {
  font-weight: 500;
  font-size: 13px;
}

.result-team.winner {
  color: var(--sport-accent);
  font-weight: 700;
}

.result-score {
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #fff;
  background: var(--sport-panel-3);
  border-radius: 8px;
  padding: 4px 0;
}

.result-score-head {
  text-align: center;
}

.result-status {
  text-align: center;
}

.result-badge {
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}

.result-badge.finished {
  background: rgba(8, 158, 78, 0.2);
  color: #31bc69;
}

.result-badge.overtime {
  background: rgba(255, 176, 31, 0.2);
  color: var(--sport-accent);
}

/* ===== HISTORY PAGE ===== */
.history-page {
  max-width: 900px;
  margin: 0 auto;
}

.history-filters {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.tab-count {
  margin-left: 4px;
  background: rgba(255, 255, 255, 0.15);
  border-radius: 999px;
  padding: 1px 6px;
  font-size: 11px;
}

.history-list {
  display: grid;
  gap: 15px;
}

.history-card {
  background: var(--sport-panel);
  border: 1px solid var(--sport-border);
  border-top: 2px solid var(--sport-accent);
  border-radius: var(--main_radius);
  overflow: hidden;
}

.history-card.status-won {
  border-left: 3px solid #31bc69;
}

.history-card.status-lost {
  border-left: 3px solid #ff4949;
}

.history-card.status-pending {
  border-left: 3px solid var(--sport-accent);
}

.history-card.status-returned {
  border-left: 3px solid var(--sport-muted);
}

.history-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid var(--sport-border);
}

.history-card-type {
  display: flex;
  align-items: center;
  gap: 10px;
}

.history-type-badge {
  background: var(--sport-panel-3);
  color: #fff;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
}

.history-date {
  color: var(--sport-muted);
  font-size: 13px;
}

.history-status-badge {
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}

.badge-won {
  background: rgba(8, 158, 78, 0.2);
  color: #31bc69;
}

.badge-lost {
  background: rgba(255, 73, 73, 0.2);
  color: #ff4949;
}

.badge-pending {
  background: rgba(255, 176, 31, 0.2);
  color: var(--sport-accent);
}

.badge-returned {
  background: rgba(164, 164, 164, 0.2);
  color: var(--sport-muted);
}

.history-card-body {
  padding: 12px 14px;
}

.history-selection {
  padding: 8px 0;
  border-bottom: 1px solid var(--sport-border);
}

.history-selection:last-child {
  border-bottom: 0;
}

.history-sel-event {
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 4px;
}

.history-sel-meta {
  display: flex;
  justify-content: space-between;
  color: var(--sport-muted);
  font-size: 13px;
}

.history-sel-odd {
  font-weight: 700;
  color: #fff;
}

.history-card-footer {
  display: flex;
  justify-content: space-between;
  padding: 12px 14px;
  border-top: 1px solid var(--sport-border);
  background: var(--sport-panel-2);
  font-size: 13px;
  flex-wrap: wrap;
  gap: 8px;
}

.history-label {
  color: var(--sport-muted);
}

.history-win {
  color: #31bc69;
  font-weight: 700;
}

.history-win-col {
  display: flex;
  gap: 4px;
}

/* ===== CHECKBET PAGE ===== */
.checkbet-page {
  max-width: 700px;
  margin: 0 auto;
}

.checkbet-form {
  margin-bottom: 20px;
  border-top: 2px solid var(--sport-accent);
  padding-top: 15px;
}

.checkbet-input-group {
  display: flex;
  gap: 10px;
}

.checkbet-input {
  flex: 1;
  padding: 12px 16px;
  border-radius: 10px;
  border: 1px solid var(--sport-border);
  background: var(--sport-panel);
  color: #fff;
  font-size: 15px;
}

.checkbet-input:focus {
  border-color: var(--sport-accent);
  outline: none;
}

.checkbet-error {
  text-align: center;
  padding: 30px;
  background: var(--sport-panel);
  border: 1px solid var(--sport-border);
  border-radius: var(--main_radius);
  margin-bottom: 20px;
}

.checkbet-error p {
  color: var(--sport-muted);
  margin: 0;
}

.checkbet-result {
  margin-bottom: 20px;
}

/* ===== CASINO ENHANCEMENTS ===== */
.casino-no-results {
  text-align: center;
  padding: 60px 20px;
}

.casino-no-results h3 {
  color: #fff;
  margin: 10px 0 5px;
}

.casino-no-results p {
  color: var(--sport-muted);
}

.casino_menu_providers a.active>div,
.casino_menu_categoryes_flex a.active>div {
  background: var(--casino_menu_active);
  border-radius: 8px;
}

.casino-game-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.75);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.casino-game-modal-content {
  background: var(--sport-panel);
  border: 1px solid var(--sport-border);
  border-top: 2px solid var(--sport-accent);
  border-radius: 16px;
  max-width: 500px;
  width: 100%;
  overflow: hidden;
}

.casino-game-modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--sport-border);
}

.casino-game-modal-head h3 {
  margin: 0;
  font-size: 18px;
  color: #fff;
}

.casino-game-modal-head button {
  background: transparent;
  border: none;
  color: var(--sport-muted);
  font-size: 20px;
  cursor: pointer;
}

.casino-game-modal-body {
  padding: 20px;
}

.casino-game-modal-img {
  width: 100%;
  height: 200px;
  background-size: cover;
  background-position: center;
  border-radius: 12px;
  margin-bottom: 16px;
}

.casino-game-modal-info {
  margin-bottom: 16px;
}

.casino-game-modal-info p {
  margin: 6px 0;
  color: var(--sport-muted);
  font-size: 14px;
}

.casino-game-modal-info strong {
  color: #fff;
}

.casino-game-modal-actions {
  display: flex;
  gap: 10px;
}

.casino-game-modal-actions .betslip-action {
  flex: 1;
}

.casino-game-modal-actions .demo {
  background: var(--sport-panel-3);
  color: #fff;
}

.casino-launch-error {
  color: #ff4444;
  font-size: 13px;
  margin-top: 10px;
  text-align: center;
}

.casino-game-iframe-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 10000;
  background: #000;
  display: flex;
  flex-direction: column;
}

.casino-game-iframe-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 16px;
  background: var(--sport-panel-2, #1a1a2e);
  color: #fff;
  font-size: 14px;
  min-height: 40px;
}

.casino-game-iframe-header button {
  background: #ff4444;
  color: #fff;
  border: none;
  padding: 6px 16px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
}

.casino-game-iframe-header button:hover {
  background: #cc3333;
}

.casino-game-iframe {
  flex: 1;
  width: 100%;
  border: none;
}

.casino-load-more {
  display: flex;
  justify-content: center;
  padding: 20px 0 40px;
}

.casino-load-more button {
  min-width: 200px;
  padding: 12px 32px;
  font-size: 15px;
}

.casino_provider_icon {
  width: 24px;
  height: 24px;
  border-radius: 4px;
  background: var(--sport-accent, #3861fb);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
  flex-shrink: 0;
}

.casino-no-results {
  text-align: center;
  padding: 60px 20px;
  color: #888;
}

.casino-no-results h3 {
  margin: 10px 0 5px;
  color: #ccc;
}

/* ===== RESPONSIVE FIXES ===== */
@media (max-width: 900px) {

  .result-header,
  .result-row {
    grid-template-columns: 60px 1fr 60px 1fr 80px;
    font-size: 12px;
  }

  .result-score {
    font-size: 14px;
  }

  .history-filters {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 6px;
  }

  .history-filters .betslip-tab {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .history-card-footer {
    flex-direction: column;
    gap: 6px;
  }

  .checkbet-input-group {
    flex-direction: column;
  }

  .live-header-dark,
  .live-row-dark {
    grid-template-columns: 1fr;
    gap: 6px;
  }
}

@media (max-width: 768px) {

  /* Result page: constrain to viewport width */
  .result-page {
    max-width: 100vw !important;
    box-sizing: border-box;
    padding: 0 10px;
  }

  /* Filters stack vertically; sport tabs scroll horizontally */
  .result-filters {
    flex-direction: column !important;
    gap: 10px !important;
    flex-wrap: nowrap !important;
    max-width: 100% !important;
  }

  .result-filter-tabs {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: scroll !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    padding-bottom: 6px;
    scrollbar-width: none;
    flex: unset !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }

  .result-filter-tabs::-webkit-scrollbar {
    display: none;
  }

  .result-filter-tabs .sport-cat {
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    padding: 8px 14px !important;
    font-size: 13px !important;
    min-width: unset !important;
    width: auto !important;
    scroll-snap-align: start;
  }

  .result-date-filter {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    justify-content: stretch;
  }

  .result-date-filter .betslip-tab {
    flex: 1 !important;
    text-align: center;
  }

  .result-header {
    display: none;
  }

  .result-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 10px;
    padding: 12px;
    border-radius: 10px;
    margin: 8px;
    border: 1px solid var(--sport-border);
    background: var(--sport-panel-2);
  }

  .result-cell {
    min-width: 0;
  }

  .result-cell::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 2px;
    color: var(--sport-muted);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
  }

  .result-score {
    grid-column: 1 / -1;
    width: fit-content;
    padding: 4px 12px;
  }

  .result-status {
    grid-column: 1 / -1;
    text-align: left;
  }
}

/* ===== POPULAR EVENTS SLIDER ===== */
.pop-events-section {
  margin-bottom: 15px;
}

.pop-events-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.pop-events-head h2 {
  margin: 0;
  font-size: 16px;
  color: #fff;
}

.pop-events-slider {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 8px;
  scroll-snap-type: x mandatory;
}

.pop-events-slider::-webkit-scrollbar {
  height: 4px;
}

.pop-events-slider::-webkit-scrollbar-thumb {
  background: var(--sport-border);
  border-radius: 4px;
}

.pop-event-card {
  min-width: 260px;
  max-width: 280px;
  flex-shrink: 0;
  background: var(--sport-surf);
  border: 1px solid var(--sport-border);
  border-top: 2px solid var(--sport-accent);
  border-radius: 14px;
  padding: 12px;
  scroll-snap-align: start;
  box-shadow: var(--sport-card-shadow);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.pop-event-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.34);
  border-color: color-mix(in srgb, var(--sport-accent) 45%, var(--sport-border));
}

.pop-event-top {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 12px;
  font-size: 11px;
  color: var(--sport-muted);
}

.pop-live-badge {
  background: #ff3b3b;
  color: #fff;
  font-weight: 700;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 4px;
  text-transform: uppercase;
}

.pop-event-league {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pop-event-fav {
  background: none;
  border: none;
  color: var(--sport-muted);
  cursor: pointer;
  font-size: 16px;
}

.pop-event-teams-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
}

.pop-team {
  text-align: center;
  flex: 1;
}

.pop-team-logo {
  font-size: 32px;
  margin-bottom: 4px;
}
.pop-team-logo .pop-team-glyph {
  display: inline-flex;
  width: 30px;
  height: 30px;
  color: var(--sport-muted, #a4a4a4);
  transition: color 0.18s ease;
}
.pop-event-card:hover .pop-team-glyph { color: var(--sport-accent, #ffb01f); }

.pop-team-name {
  font-size: 11px;
  font-weight: 600;
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pop-event-score {
  font-size: 24px;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
}

.pop-event-time {
  text-align: center;
}

.pop-time-big {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
}

.pop-time-date {
  font-size: 11px;
  color: var(--sport-muted);
}

.pop-event-odds {
  display: flex;
  gap: 4px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}

.pop-odd {
  flex: 1 1 0;
  min-width: 0;
  background: var(--sport-panel-3);
  border: 1px solid var(--sport-border);
  color: #fff;
  border-radius: 8px;
  padding: 8px 6px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 700;
  font-size: 13px;
  cursor: pointer;
  gap: 4px;
  transition: all 0.15s;
}

.pop-odd:hover {
  border-color: var(--sport-accent);
}

.pop-odd.is-active {
  background: var(--sport-accent);
  color: #000;
}

.pop-event-markets {
  text-align: center;
  background: linear-gradient(90deg, #f5b400 0%, #ffb01f 50%, #ffcf2e 100%);
  border: none;
  color: #1a1300;
  border-radius: 8px;
  padding: 8px 10px;
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 0.02em;
  transition: filter 0.15s, transform 0.05s;
  cursor: pointer;
}

.pop-event-markets:hover {
  filter: brightness(1.06);
}
.pop-event-markets:active {
  transform: translateY(1px);
}

/* ===== TOP LEAGUES SECTION ===== */
.top-leagues-section {
  margin-bottom: 15px;
}

.top-leagues-section h2 {
  margin: 0 0 10px;
  font-size: 16px;
  color: #fff;
}

.top-leagues-grid {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 6px;
}

.top-leagues-grid::-webkit-scrollbar {
  height: 3px;
}

.top-leagues-grid::-webkit-scrollbar-thumb {
  background: var(--sport-border);
}

.top-league-card {
  min-width: 160px;
  flex-shrink: 0;
  background: var(--sport-panel);
  border: 1px solid var(--sport-border);
  border-top: 2px solid var(--sport-accent);
  border-radius: 12px;
  padding: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  transition: border-color 0.15s;
}

.top-league-card:hover,
.top-league-card.is-active {
  border-color: var(--sport-accent);
}

.top-league-logo {
  font-size: 32px;
  flex-shrink: 0;
}

.top-league-name {
  font-size: 12px;
  font-weight: 600;
  color: #fff;
}

.top-league-sport {
  font-size: 11px;
  color: var(--sport-muted);
}

/* ===== LEAGUE TABLE (EVENTS) ===== */
.events-table-section {
  margin-bottom: 15px;
}

.events-table-section>h2 {
  margin: 0 0 10px;
  font-size: 16px;
  color: #fff;
}

.league-table-block {
  border: 1px solid var(--sport-border);
  border-top: 2px solid var(--sport-accent);
  border-radius: 12px;
  margin-bottom: 10px;
  overflow: hidden;
  background: var(--sport-surf);
  box-shadow: var(--sport-card-shadow);
}

.league-table-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(90deg, #ff8a00 0%, #ffc01f 100%);
  color: #1a1300;
  /* padding-right = body(6) + row(14) = 20px, чтобы заголовки столбцов
     стояли ровно НАД кэф-ячейками строк (было 12 → колонки «плыли»). */
  padding: 7px 20px 7px 14px;
  font-weight: 700;
  font-size: 13px;
  cursor: pointer;
  user-select: none;
  gap: 12px;
}
.league-table-head svg path { stroke: #1a1300; }
.league-table-head .league-table-cols-head span {
  color: #1a1300;
  opacity: 0.95;
}
.league-table-head .league-table-cols-head .league-table-cols-fav { opacity: 0; }

.league-table-head-left {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.league-table-head-left>span:not(.league-icon-small) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.league-table-head-left svg {
  flex-shrink: 0;
}

.league-icon-small {
  flex-shrink: 0;
}

.league-table-cols-head {
  display: grid;
  gap: 2px;
  flex-shrink: 0;
  align-items: stretch;
}

.league-table-cols-head--live {
  grid-template-columns: repeat(3, 50px) repeat(4, 54px) 46px 24px;
}
.league-table-cols-head--live .lch-wide { grid-column: span 2; }
.league-table-cols-head--live .lch-more { color: var(--sport-accent); }

/* Тёмная шапка лиги в Live (как в макете), без крикливого оранжа */
[data-sport-page="live"] .league-table-head {
  background: #0f1217;
  color: #cfd6e2;
  border: 1px solid var(--sport-border);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}
[data-sport-page="live"] .league-table-head svg path { stroke: #7c8698; }
[data-sport-page="live"] .league-table-head-left > span:not(.league-icon-small) { color: #e7ecf3; }
[data-sport-page="live"] .league-table-head .league-table-cols-head span {
  color: var(--sport-muted);
  opacity: 1;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
[data-sport-page="live"] .league-table-head .lch-more { color: var(--sport-accent); }

.league-table-cols-head--line {
  grid-template-columns: repeat(3, 50px) repeat(4, 54px) 46px 24px;
}
.league-table-cols-head--line .lch-wide { grid-column: span 2; }
.league-table-cols-head--line .lch-more { color: var(--sport-accent); }

/* Тёмная шапка лиги в Линии (как в макете 1win), без крикливого оранжа */
[data-sport-page="line"] .league-table-head {
  background: #0f1217;
  color: #cfd6e2;
  border: 1px solid var(--sport-border);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}
[data-sport-page="line"] .league-table-head svg path { stroke: #7c8698; }
[data-sport-page="line"] .league-table-head-left > span:not(.league-icon-small) { color: #e7ecf3; }
[data-sport-page="line"] .league-table-head .league-table-cols-head span {
  color: var(--sport-muted);
  opacity: 1;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
[data-sport-page="line"] .league-table-head .lch-more { color: var(--sport-accent); }

.league-table-cols-head span {
  min-width: 0;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
}

.league-table-body {
  background: transparent;
  padding: 6px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.league-table-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7px 14px;
  border: 1px solid var(--sport-border);
  border-radius: 10px;
  background: var(--sport-surf-row);
  gap: 12px;
  transition: border-color .15s, background .15s, box-shadow .15s;
}

.league-table-body .league-table-row:nth-child(even) {
  background:
    linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.004)),
    #141920;
}
.league-table-body .league-table-row:nth-child(odd) {
  background:
    linear-gradient(180deg, rgba(255,255,255,.014), rgba(255,255,255,.002)),
    #181d24;
}

.league-table-row:hover {
  background: var(--sport-cell-hover);
  border-color: color-mix(in srgb, var(--sport-accent) 55%, var(--sport-border));
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.22);
}

.league-row-info {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  flex: 1;
}

.league-row-time {
  min-width: 80px;
  font-size: 12px;
  color: var(--sport-muted);
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.league-row-teams {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 13px;
  font-weight: 500;
  color: #eaecef;
  min-width: 0;
  flex: 1;
  overflow: hidden;
}

.league-row-teams>div {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}

.lrt-line {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.lrt-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

.ltl-team {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.pct-left {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.pct-left .pop-card-tname {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.league-flag-cc {
  width: 20px;
  height: 14px;
  object-fit: cover;
  border-radius: 3px;
  flex-shrink: 0;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .06);
}

.league-row-markets {
  color: var(--sport-muted);
  font-size: 12px;
  flex-shrink: 0;
}

.league-row-odds {
  display: grid;
  gap: 2px;
  flex-shrink: 0;
  align-items: center;
}

.league-row-odds--live {
  grid-template-columns: repeat(3, 50px) repeat(4, 54px) 46px 24px;
}
.league-row-odds--live .tbl-more {
  width: 100%;
  min-height: 34px;
  box-sizing: border-box;
  background: none;
  border: 1px solid transparent;
  border-radius: 5px;
  color: var(--sport-accent);
  font-size: 11.5px;
  font-weight: 800;
  cursor: pointer;
  font-variant-numeric: tabular-nums;
  transition: background 0.12s, border-color 0.12s;
}
.league-row-odds--live .tbl-more:hover {
  background: color-mix(in srgb, var(--sport-accent) 10%, transparent);
  border-color: var(--sport-accent);
}
.league-row-odds--live .tbl-label {
  display: block;
  font-size: 8px;
  font-weight: 700;
  line-height: 1;
  color: var(--sport-muted);
  letter-spacing: 0.01em;
}
.league-row-odds--live .tbl-odd { gap: 2px; min-height: 40px; }
.league-row-odds--live .tbl-odd.is-active .tbl-label { color: rgba(0, 0, 0, 0.65); }

.league-row-odds--line {
  grid-template-columns: repeat(3, 50px) repeat(4, 54px) 46px 24px;
}
/* «+N рынков» — кнопка в конце строки, ведёт на карточку матча */
.league-row-odds--line .tbl-more {
  width: 100%;
  min-height: 34px;
  box-sizing: border-box;
  background: none;
  border: 1px solid transparent;
  border-radius: 5px;
  color: var(--sport-accent);
  font-size: 11.5px;
  font-weight: 800;
  cursor: pointer;
  font-variant-numeric: tabular-nums;
  transition: background 0.12s, border-color 0.12s;
}
.league-row-odds--line .tbl-more:hover {
  background: color-mix(in srgb, var(--sport-accent) 10%, transparent);
  border-color: var(--sport-accent);
}
/* В сгруппированной Линии показываем подпись рынка внутри ячейки (П1/Х/П2, Ф1, ТБ N). */
.league-row-odds--line .tbl-label {
  display: block;
  font-size: 8px;
  font-weight: 700;
  line-height: 1;
  color: var(--sport-muted);
  letter-spacing: 0.01em;
}
.league-row-odds--line .tbl-odd { gap: 2px; min-height: 40px; }
.league-row-odds--line .tbl-odd.is-active .tbl-label { color: rgba(0, 0, 0, 0.65); }

.tbl-odd {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 4px 2px;
  text-align: center;
  background: var(--sport-cell);
  border: 1px solid var(--sport-border);
  border-radius: 6px;
  color: #fff;
  font-weight: 700;
  font-size: 12.5px;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  letter-spacing: -0.2px;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s, color 0.12s, box-shadow 0.12s, transform 0.08s;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-height: 34px;
}

/* Подпись рынка дублируется в шапке столбца — в самой ячейке прячем,
   чтобы коэффициент шёл одной строкой и не вылезал за квадрат (как на референсе). */
.tbl-label {
  display: none;
}

.tbl-val {
  font-size: 12px;
  font-weight: 700;
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  letter-spacing: -0.3px;
  max-width: 100%;
}

.tbl-odd:hover {
  border-color: var(--sport-accent);
  background: var(--sport-cell-hover);
  box-shadow: inset 0 0 0 1px rgba(255, 176, 31, 0.25), 0 2px 8px rgba(0, 0, 0, 0.25);
  transform: translateY(-1px);
}

.tbl-odd.is-active {
  background: var(--sport-accent-grad);
  color: #16213c;
  border-color: var(--sport-accent-dark);
  box-shadow: var(--sport-accent-glow);
}

.tbl-odd.is-active .tbl-val { color: #16213c; }
.tbl-odd:active { transform: translateY(0); }

.tbl-odd:disabled {
  opacity: 1;
  cursor: default;
  background: color-mix(in srgb, var(--sport-panel) 70%, transparent);
  border-color: var(--sport-border);
  color: var(--sport-muted);
}
.tbl-odd:disabled:hover {
  background: color-mix(in srgb, var(--sport-panel) 70%, transparent);
  border-color: var(--sport-border);
}
/* «Рынка нет» — аккуратный прочерк вместо пустого квадрата (как на бук-сайтах). */
.tbl-odd:disabled .tbl-val:empty::after {
  content: "—";
  color: var(--sport-muted);
  opacity: 0.4;
  font-weight: 500;
}

.tbl-total {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  color: var(--sport-muted);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-height: 34px;
}

.tbl-fav {
  background: none;
  border: none;
  color: var(--sport-muted);
  cursor: pointer;
  font-size: 15px;
  padding: 0;
  width: 26px;
  min-height: 34px;
  justify-self: center;
}

/* Live-specific in table */
/* ═══ Лайв-индикатор (десктоп) — Гибрид 1 (компактный): янтарная плашка ═══
   LIVE (точка+капс) · золотая минута · период капсом. Уменьшено. */
.league-row-time--live {
  align-items: flex-start;
}
.live-tile {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  padding: 4px 8px;
  border-radius: 7px;
  background: linear-gradient(180deg, #242a1a, #1c2013);
  border: 1px solid rgba(255, 176, 31, 0.32);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
}
.live-tile__live {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 7px;
  font-weight: 900;
  color: #ffbf66;
  letter-spacing: 0.09em;
}
.live-tile__dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #ffb01f;
  box-shadow: 0 0 5px rgba(255, 176, 31, 0.9), 0 0 0 0 rgba(255, 176, 31, 0.5);
  animation: live-amber-pulse 1.6s ease-out infinite;
  flex-shrink: 0;
}
@keyframes live-amber-pulse {
  0% { box-shadow: 0 0 5px rgba(255,176,31,0.9), 0 0 0 0 rgba(255, 176, 31, 0.5); }
  70% { box-shadow: 0 0 5px rgba(255,176,31,0.4), 0 0 0 5px rgba(255, 176, 31, 0); }
  100% { box-shadow: 0 0 5px rgba(255,176,31,0.9), 0 0 0 0 rgba(255, 176, 31, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .live-tile__dot { animation: none; }
}
.live-tile__min {
  font-family: "Onest", Rubik, sans-serif;
  font-size: 13px;
  font-weight: 900;
  color: #ffd27a;
  line-height: 1.05;
  font-variant-numeric: tabular-nums;
}
.live-tile__per {
  font-size: 7px;
  font-weight: 700;
  color: var(--sport-muted);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.live-team-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.live-team-line>span:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #eaecef;
  flex: 1;
  min-width: 0;
}

/* Счёт по таймам/сетам — компактный чип (как на референсе) */
.live-sets {
  flex-shrink: 0;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.06em;
  background: var(--sport-panel-3);
  border-radius: 4px;
  padding: 1px 6px;
  white-space: nowrap;
}

/* Sidebar time */
.sport-time-toggle {
  display: flex;
  align-items: center;
  gap: 6px;
}

.sport-time-label {
  color: var(--sport-muted);
  font-size: 12px;
  min-width: 28px;
}

/* League icon in sidebar */
.league-icon {
  margin-right: 4px;
}

/* ===== TABLE RESPONSIVE ===== */
@media (max-width: 1400px) {

  /* Live: сжимаем сгруппированные колонки (1X2 · Фора · Тотал · +N) */
  .league-table-cols-head--live,
  .league-row-odds--live {
    grid-template-columns: repeat(3, 46px) repeat(4, 48px) 42px 24px;
  }

  /* Line: сжимаем сгруппированные колонки (1X2 · Фора · Тотал · +N) */
  .league-table-cols-head--line,
  .league-row-odds--line {
    grid-template-columns: repeat(3, 46px) repeat(4, 48px) 42px 24px;
  }

  /* Compress time column */
  .league-row-time {
    min-width: 65px;
    font-size: 11px;
  }

  /* Hide market count badge to free more space for team names */
  .league-row-markets {
    display: none;
  }

  .league-table-cols-head span,
  .tbl-odd,
  .tbl-total {
    font-size: 11px;
  }

  .tbl-val {
    font-size: 11px;
  }

  .tbl-label {
    font-size: 7px;
  }
}

@media (max-width: 1100px) {
  .league-table-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  .league-row-odds {
    max-width: 100%;
  }

  .league-table-row {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 700px) {
  .pop-event-card {
    min-width: 220px;
  }

  .top-league-card {
    min-width: 140px;
  }

  .league-table-cols-head {
    display: none;
  }

  /* Шапка столбцов на мобиле скрыта — возвращаем подпись внутрь ячейки,
     иначе коэффициенты были бы безымянными. */
  .tbl-label {
    display: block;
    font-size: 8px;
    font-weight: 500;
    opacity: 0.5;
    line-height: 1;
    letter-spacing: 0.02em;
  }
  .tbl-odd,
  .tbl-total {
    min-height: 38px;
    gap: 1px;
  }
}

@media (max-width: 600px) {
  .league-table-row {
    padding: 8px;
  }

  .league-row-info {
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  .league-row-time {
    min-width: 0;
    flex-direction: row;
    gap: 8px;
  }

  /* Компактный вид матча: в одну строку только основной исход 1/X/2 + звезда.
     Двойной шанс / фора / тотал скрыты — открываются тапом по матчу («+N» рынков). */
  .league-row-odds--live,
  .league-row-odds--line {
    width: 100%;
    display: flex;
    gap: 5px;
    align-items: stretch;
  }
  .league-row-odds--live > *:nth-child(n+4):not(.tbl-fav),
  .league-row-odds--line > *:nth-child(n+4):not(.tbl-fav) {
    display: none;
  }
  .league-row-odds--live > .tbl-odd,
  .league-row-odds--line > .tbl-odd {
    flex: 1 1 0;
    width: auto;
    min-height: 44px;
  }
  .league-row-odds .tbl-fav {
    flex: 0 0 36px;
    align-self: stretch;
    justify-self: auto;
  }
  .league-row-markets {
    display: inline-flex !important;
    align-items: center;
    padding: 2px 9px;
    border-radius: 999px;
    background: rgba(255, 176, 31, 0.12);
    color: var(--sport-accent);
    font-size: 12px;
    font-weight: 700;
  }
}
/* =====================================================================
   ВИЗУАЛЬНАЯ ПОЛИРОВКА (drop-in, только CSS, без правок разметки/логики)
   Топ-3: кэфы / различие лайв-прематч / скелетоны загрузки кэфов.
   Всё аддитивно: если какой-то селектор не сматчится — просто нет эффекта.
   ===================================================================== */

/* --- 1. Кнопки кэфов: иерархия (метка приглушена, значение жирное),
        выровненные цифры (tnum, не «прыгают»), мягкий hover-подъём --- */
.pop-odd > span:first-child {
  color: var(--sport-muted);
  font-weight: 600;
  font-size: 12px;
}
.pop-odd > span:last-child {
  color: #fff;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
.pop-odd:hover:not(:disabled),
.tbl-odd:hover:not(:disabled) {
  transform: translateY(-1px);
  border-color: var(--sport-accent);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}
.pop-odd:active:not(:disabled),
.tbl-odd:active:not(:disabled) {
  transform: translateY(0);
}
.tbl-odd {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
.pop-odd:disabled,
.tbl-odd:disabled {
  opacity: 0.45;
  cursor: default;
}
.pop-odd.is-active > span:last-child,
.pop-odd.is-active > span:first-child {
  color: #000;
}

/* --- 2. Различие лайв / прематч ---
   Лайв-карточка популярных событий: красный акцент слева (без сдвига контента)
   + пульсирующая точка в бейдже Live. */
.pop-event-card.is-live {
  box-shadow: none;
}
.pop-live-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.pop-live-badge::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #fff;
  animation: bl-live-pulse 1.4s ease-in-out infinite;
}
@keyframes bl-live-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.35; transform: scale(0.7); }
}

/* --- 3. Скелетоны загрузки кэфов (только популярные события) ---
   Кэфы подтягиваются постепенно (квота API). Пока значение пустое — вместо
   «пустого места» показываем shimmer, чтобы загрузка выглядела задуманной,
   а не сломанной. В таблице линии НЕ применяем: там пустые ячейки бывают
   легитимно (отсутствующие рынки). */
.pop-events-slide .pop-odd > span:last-child:empty {
  display: inline-block;
  min-width: 36px;
  height: 12px;
  border-radius: 4px;
  background: linear-gradient(
    90deg,
    var(--sport-panel-3) 25%,
    rgba(255, 255, 255, 0.10) 50%,
    var(--sport-panel-3) 75%
  );
  background-size: 200% 100%;
  animation: bl-shimmer 1.2s linear infinite;
}
@keyframes bl-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
@media (prefers-reduced-motion: reduce) {
  .pop-live-badge::before,
  .pop-events-slide .pop-odd > span:last-child:empty {
    animation: none;
  }
}

/* =====================================================================
   ВИЗУАЛ v2 (drop-in, только CSS, без правок разметки/логики)
   ===================================================================== */

/* --- Фикс: крупные кэфы в таблице ЛИНИИ были впритык к краям 40px-ячейки.
        Уменьшаем шрифт/паддинг/трекинг ТОЛЬКО для линии (лайв/популярные шире
        — их не трогаем). "41.00"/"16.99" теперь помещаются с воздухом. --- */
.league-row-odds--line .tbl-odd {
  font-size: 12px;
  padding-left: 2px;
  padding-right: 2px;
  letter-spacing: -0.3px;
}

/* --- Карточка популярных событий: лёгкий hover-подъём (ощущение
        интерактивности). У лайва сохраняем красную грань слева. --- */
.pop-event-card {
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.pop-event-card:hover {
  transform: translateY(-2px);
  border-color: var(--sport-accent);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.40);
}
.pop-event-card.is-live:hover {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.40);
}
@media (prefers-reduced-motion: reduce) {
  .pop-event-card { transition: none; }
  .pop-event-card:hover { transform: none; }
}

/* =====================================================================
   SVG-иконки видов спорта вместо эмодзи (сайдбар + сетка категорий).
   Файлы лежат в /img/leagues/*.svg (cat.svg), все существуют.
   ===================================================================== */
.sport-list__label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.sport-list__ico {
  width: 18px;
  height: 18px;
  object-fit: contain;
  flex-shrink: 0;
}
.sport-cat .icon img.sport-cat__ico {
  width: 22px;
  height: 22px;
  object-fit: contain;
  display: block;
}

/* Маленькая иконка вида спорта в шапке группы лиги (SVG вместо эмодзи) */
.league-icon-small-img {
  width: 16px;
  height: 16px;
  object-fit: contain;
  vertical-align: middle;
  flex-shrink: 0;
}

/* =====================================================================
   Inline-SVG иконки видов спорта (компонент SportIcon, currentColor).
   Цвет управляется через CSS: серый по умолчанию, жёлтый на hover/active.
   ===================================================================== */
/* Сайдбар: серый -> жёлтый на hover/активном */
.sport-list__ico {
  color: var(--sport-muted);
  transition: color 0.15s ease;
}
.sport-list button:hover .sport-list__ico,
.sport-list a:hover .sport-list__ico,
.sport-list button.is-active .sport-list__ico,
.sport-list a.is-active .sport-list__ico {
  color: var(--sport-accent);
}
/* Сетка категорий: размер span (старый img-селектор больше не матчит).
   Цвет наследуется от .sport-cat .icon (accent) и .is-active .icon (#000). */
.sport-cat__ico {
  width: 22px;
  height: 22px;
}
/* Иконка вида в шапке группы лиги — акцентная */
.league-icon-small-img {
  color: var(--sport-accent);
}
/* На оранжевой шапке лиги — белая для контраста */
.league-table-head .league-icon-small-img {
  color: #fff;
}

/* Фолбэк-иконка вида спорта в списке "ТОП ЛИГ" (когда нет флага лиги) */
.league-flag-ico {
  width: 16px;
  height: 14px;
  color: var(--sport-muted);
  flex-shrink: 0;
}

/* Монограммы команд (компонент TeamLogo) вместо эмодзи-мяча в карточках */
.pop-events-slide .pop-team-logo {
  height: 40px;
}
.pop-events-slide .pop-team-logo .bl-team-logo {
  width: 38px;
  height: 38px;
}
/* ============================================================
   CHAMPION-STYLE LIVE/LINE (мобайл) — наши тёмные цвета.
   Каждый матч — отдельная карточка, счёт справа акцентом,
   кэфы ровной сеткой 3 в ряд, аккуратные шапки лиг.
   ============================================================ */
@media (max-width: 760px) {
  .league-table-body {
    padding: 8px;
    gap: 8px;
  }
  .league-table-body .league-table-row {
    background: #1b2231;
    border: 1px solid #2c3a55;
    border-radius: 14px;
    margin: 0;
    padding: 12px 14px;
    gap: 10px;
  }
  .pop-event-card,
  .pop-event-card.is-live {
    background: #1b2231;
    border: 1px solid #2c3a55;
    border-radius: 14px;
  }
  .league-table-body .league-table-row:hover {
    border-color: var(--sport-accent);
  }
  .league-table-body {
    background: #12161f;
  }
  .league-table-row { flex-direction: column; align-items: stretch; }

  .league-row-info { width: 100%; }
  .live-team-line { justify-content: space-between; }
  .live-sets {
    font-size: 15px;
    font-weight: 800;
    color: var(--sport-accent);
    background: transparent;
    padding: 0;
    letter-spacing: 0.02em;
  }

  .league-row-odds--live {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 6px !important;
    width: 100%;
  }
  .league-row-odds--live .tbl-odd,
  .league-row-odds--live .tbl-total {
    width: 100%;
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
  }
  .league-row-odds--live .tbl-fav { grid-column: span 3; justify-self: end; }

  .league-table-head { border-radius: 12px 12px 0 0; }
}

.sport-list-league button,.sport-list-league a{display:flex!important;justify-content:flex-start!important;text-align:left!important;align-items:center!important;gap:8px!important}
.sport-list-league .league-icon,.sport-list-league .league-flag-img{flex:0 0 18px!important;width:18px!important;margin:0!important}

.sport-list-league button,.sport-list-league a{display:flex!important;flex-direction:row!important;justify-content:flex-start!important;gap:8px!important;text-align:left!important}
.sport-list-league button>*,.sport-list-league a>*{margin-left:0!important;margin-right:0!important}
.sport-list-league .league-icon,.sport-list-league .league-flag-img{flex:0 0 18px!important;width:18px!important;order:-1!important}
.sport-list-league button{white-space:normal!important}

/* Фаворит (минимальный кэф 1/X/2) — золотая подсветка */
.tbl-odd.is-fav { border: 1px solid var(--sport-accent); background: rgba(255,176,31,0.08); }
.tbl-odd.is-fav .tbl-val { color: var(--sport-accent); }

/* Направленное мигание кэфов: зелёный вверх / красный вниз (как у топ-БК) */
@keyframes oddFlashUp { 0%{background:rgba(53,196,100,.6);box-shadow:inset 0 0 0 1px #35c464;} 100%{} }
@keyframes oddFlashDown { 0%{background:rgba(224,36,59,.6);box-shadow:inset 0 0 0 1px #e0243b;} 100%{} }
.tbl-odd.odd-up:not(.is-active) { animation: oddFlashUp 1.3s ease-out; }
.tbl-odd.odd-down:not(.is-active) { animation: oddFlashDown 1.3s ease-out; }
.tbl-odd.odd-up:not(.is-active) .tbl-val { color: #4ade80; }
.tbl-odd.odd-down:not(.is-active) .tbl-val { color: #ff6b6b; }
/* Стрелка направления справа от значения */
.tbl-odd.odd-up:not(.is-active) .tbl-val::after { content: "▲"; font-size: 6px; vertical-align: middle; margin-left: 3px; color: #4ade80; }
.tbl-odd.odd-down:not(.is-active) .tbl-val::after { content: "▼"; font-size: 6px; vertical-align: middle; margin-left: 3px; color: #ff6b6b; }

/* Флеш счёта при голе/изменении (анимация в лайв-строке и поп-карточке) */
@keyframes scorePulse {
  0% { transform: scale(1); color: var(--sport-accent); text-shadow: 0 0 0 rgba(255,176,31,0); }
  30% { transform: scale(1.45); color: #4ade80; text-shadow: 0 0 14px rgba(74,222,128,0.7); }
  100% { transform: scale(1); }
}
.lh-score span.score-bump, .lh-kick__time.score-bump { display: inline-block; animation: scorePulse 0.9s ease-out; }

/* Горизонтальные вкладки видов спорта (Champion-style, наши цвета) */
.sport-tabs { display: flex; flex-wrap: nowrap; gap: 8px; overflow-x: auto; padding: 4px 2px 8px; -webkit-overflow-scrolling: touch; scrollbar-width: none; margin: 0; }
.sport-tabs::-webkit-scrollbar { display: none; }
.sport-tabs > li { flex: 0 0 auto; list-style: none; }
.sport-tabs .sport-tab { display: flex; flex-direction: column; align-items: center; gap: 5px; min-width: 60px; padding: 8px 12px; background: var(--sport-panel-2); border: 1px solid var(--sport-border); border-radius: 12px; color: #cfcfcf; cursor: pointer; width: 100%; }
.sport-tabs .sport-tab.is-active { border-color: var(--sport-accent); color: #fff; }
.sport-tabs .sport-tab__ico { position: relative; width: 32px; height: 32px; border-radius: 50%; background: rgba(255,255,255,0.06); display: flex; align-items: center; justify-content: center; }
.sport-tabs .sport-tab.is-active .sport-tab__ico { background: rgba(255,176,31,0.16); color: var(--sport-accent); }
.sport-tabs .sport-tab__ico svg, .sport-tabs .sport-tab__ico img { width: 18px; height: 18px; }
.sport-tabs .sport-tab__ico > .bl-sport-ico {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}
.sport-tabs .sport-tab__badge { position: absolute; top: -5px; right: -7px; background: var(--sport-accent); color: #1a1300; font-size: 9px; font-weight: 800; line-height: 1; border-radius: 9px; padding: 2px 5px; }
.sport-tabs .sport-tab__name { font-size: 11px; white-space: nowrap; }

/* Верхняя лента видов спорта: бейджи-счётчики + скрытие сайдбар-дубля */
.sportcats-sidebar { display: none !important; }
.sport-categories-slide .sport-cat { position: relative; }
.sport-categories-slide .sport-cat .icon { position: relative; }
.sport-cat__badge { position: absolute; top: -6px; right: -8px; background: var(--sport-accent); color: #1a1300; font-size: 9px; }
.sportcats-sidebar { display: none !important; }
.sport-categories-slide .sport-cat { position: relative; }
.sport-categories-slide .sport-cat .icon { position: relative; }
.sport-cat__badge { position: absolute; top: -6px; right: -8px; background: var(--sport-accent); color: #1a1300; font-size: 9px; font-weight: 800; line-height: 1; border-radius: 9px; padding: 2px 5px; z-index: 2; }

/* Адаптив лент видов спорта: ПК → верхняя swiper, мобила → сайдбарная лента */
@media (min-width: 901px) {
  .sportcats-sidebar { display: none !important; }
}
@media (max-width: 900px) {
  .sportcats-sidebar { display: block !important; }
  .sport-sidebar ul.sport-tabs { display: flex !important; }
  .sport-categories.swiper { display: none !important; }
}
/* Бейджи верхней ленты — компактные, в углу иконки */
.sport-cat__badge { top: -5px; right: -6px; left: auto; min-width: 15px; height: 15px; padding: 0 4px; font-size: 8px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; }

/* Полировка: убрать красные полоски live-карточек, жёлтую линию скрытой панели, поправить бейджи ПК */
.pop-event-card.is-live { box-shadow: none !important; }
.pop-event-card.is-live:hover { box-shadow: 0 6px 18px rgba(0, 0, 0, 0.40) !important; }

.sport-panel:has(.sportcats-sidebar) { border-top: none !important; }
@media (min-width: 901px) {
  .sport-panel:has(.sportcats-sidebar) { display: none !important; }
}

.sport-categories-slide .sport-cat { position: relative; overflow: visible; }
.sport-cat__badge { top: -7px; right: -5px; left: auto; min-width: 16px; height: 16px; padding: 0 4px; font-size: 9px; border-radius: 8px; border: 2px solid #0d0d0f; box-sizing: border-box; }

/* Скрыть секцию ТОП ЛИГ (ПК и мобила, обе страницы) */
.topleagues-panel { display: none !important; }

/* ТОП ЛИГ — скрыть жёстко (перебить scoped) */
.sport-sidebar .topleagues-panel,
.sport-panel.topleagues-panel,
div.topleagues-panel { display: none !important; }

/* Переключатель под поиском: Избранное / Ближайшие (как на референсе) */
.side-quickfilter {
  display: flex;
  gap: 6px;
  padding: 0 10px 8px;
}
/* Live навешивает .search-desktop-only (display:block) — на ПК возвращаем flex */
@media (min-width: 901px) {
  .side-quickfilter { display: flex !important; }
  /* мобильный дубль под строкой поиска — скрыт на ПК */
  .side-quickfilter--mob { display: none !important; }
}
/* На мобиле: сайдбарный тумблер прячем, показываем дубль под мобильным поиском */
@media (max-width: 900px) {
  .side-quickfilter--desk { display: none !important; }
}
.side-qf {
  flex: 1;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 8px 4px;
  background: var(--sport-panel-2);
  border: 1px solid var(--sport-border);
  border-radius: 6px;
  color: var(--sport-muted);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: -0.2px;
  white-space: nowrap;
  cursor: pointer;
  transition: color 0.15s, border-color 0.15s, background 0.15s;
}
.side-qf:hover { color: #e7ecf3; border-color: rgba(255, 176, 31, 0.4); }
.side-qf__ic { font-size: 11px; line-height: 1; flex: 0 0 auto; }
.side-qf.is-active {
  color: #fff;
  border-color: rgba(255, 176, 31, 0.55);
  background: rgba(255, 176, 31, 0.1);
}
.side-qf.is-active .side-qf__ic { color: var(--sport-accent); }

/* Мобильный тумблер — под цвет строки поиска */
.side-quickfilter--mob .side-qf {
  background: #1e2330;
  border-color: rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  padding: 10px 6px;
  font-size: 13px;
}
.side-quickfilter--mob .side-qf.is-active {
  background: rgba(255, 176, 31, 0.12);
  border-color: rgba(255, 176, 31, 0.55);
  color: #fff;
}

/* ═══ ПК: виды спорта — В САЙДБАР (вертикальный список), верхнюю ленту убрать ═══ */
@media (min-width: 901px) {
  .sport-panel:has(.sportcats-sidebar) { display: block !important; }
  .sportcats-sidebar { display: block !important; }
  .sport-sidebar ul.sport-tabs { display: flex !important; }
  .sport-categories.swiper { display: none !important; }

  /* Вертикальный список: иконка · название · счётчик справа */
  .sportcats-sidebar ul.sport-tabs {
    flex-direction: column;
    flex-wrap: nowrap;
    overflow: visible;
    gap: 2px;
    padding: 4px;
  }
  .sportcats-sidebar ul.sport-tabs > li { width: 100%; }
  .sportcats-sidebar ul.sport-tabs .sport-tab {
    position: relative;
    flex-direction: row !important;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-width: 0;
    padding: 8px 34px 8px 10px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 6px;
  }
  .sportcats-sidebar ul.sport-tabs .sport-tab__ico { position: static; width: 24px; height: 24px; flex: 0 0 auto; overflow: visible; }
  .sportcats-sidebar ul.sport-tabs .sport-tab__ico svg,
  .sportcats-sidebar ul.sport-tabs .sport-tab__ico img { width: 16px; height: 16px; }
  .sportcats-sidebar ul.sport-tabs .sport-tab__ico > .bl-sport-ico {
    flex-basis: 16px;
    width: 16px;
    height: 16px;
  }
  .sportcats-sidebar ul.sport-tabs .sport-tab__name {
    flex: 1;
    text-align: left;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .sportcats-sidebar ul.sport-tabs .sport-tab__badge {
    position: absolute;
    right: 8px;
    top: 50%;
    left: auto;
    transform: translateY(-50%);
    /* Неактивные счётчики — приглушённая пилюля (было всё кричаще-янтарным). */
    background: rgba(255, 255, 255, 0.07);
    color: var(--sport-muted);
    border: 0;
    min-width: 20px;
    height: 18px;
    padding: 0 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    font-size: 10px;
    font-weight: 700;
  }
  /* Иконка — кружок с лёгким градиентом (объём как у ячеек кабинета). */
  .sportcats-sidebar ul.sport-tabs .sport-tab__ico {
    background: var(--sport-cell);
    border-radius: 50%;
  }
  .sportcats-sidebar ul.sport-tabs .sport-tab:not(.is-active):hover {
    background: var(--sport-panel-2) !important;
    transform: none !important;
    border-color: transparent !important;
  }
  .sportcats-sidebar ul.sport-tabs .sport-tab.is-active {
    background: linear-gradient(90deg, rgba(255,176,31,0.14), rgba(255,176,31,0.02)) !important;
    border-color: transparent !important;
    box-shadow: inset 3px 0 0 var(--sport-accent) !important;
  }
  .sportcats-sidebar ul.sport-tabs .sport-tab.is-active .sport-tab__name { color: #fff; }
  /* Счётчик активного вида — янтарный акцент. */
  .sportcats-sidebar ul.sport-tabs .sport-tab.is-active .sport-tab__badge {
    background: var(--sport-accent);
    color: #16213c;
  }
}

/* ───────────────────────────────────────────────────────────────
   Полировка левой панели и бейджей видов спорта (ПК)
   div.sport-tabs = переключатель Линия/Live (НЕ мобильная лента
   видов спорта, та — ul.sport-tabs).
   ─────────────────────────────────────────────────────────────── */

/* Линия/Live — табы с подчёркиванием и счётчиками событий */
div.sport-tabs {
  display: flex;
  gap: 0;
  padding: 14px 14px 0;
  margin: 0;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--sport-border);
  border-radius: 0;
  overflow: visible;
}
div.sport-tabs > .sport-tab {
  position: relative;
  flex: 1 1 0;
  width: auto;
  min-width: 0;
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: none;
  background: transparent;
  color: #8a93a6;
  font-weight: 700;
  font-size: 17px;
  border-radius: 0;
  padding: 9px 2px 13px;
  transition: color 0.18s ease;
}
div.sport-tabs > .sport-tab::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2.5px;
  border-radius: 2px 2px 0 0;
  background: var(--sport-accent);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.2s ease;
}
div.sport-tabs > .sport-tab:hover { color: #fff; }
div.sport-tabs > .sport-tab.is-active { color: var(--sport-accent); }
div.sport-tabs > .sport-tab.is-active::after { transform: scaleX(1); }

/* Счётчик событий на табе */
.sport-tab__n {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 18px;
  padding: 0 6px;
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.08);
  color: #c9cfda;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}
div.sport-tabs > .sport-tab.is-active .sport-tab__n {
  background: rgba(255, 176, 31, 0.16);
  color: var(--sport-accent);
}
/* Красная точка «эфир» у Live */
.sport-tab__live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ff3b3b;
  box-shadow: 0 0 6px rgba(255, 59, 59, 0.6);
  flex: 0 0 auto;
}

/* Чипы диапазона времени (страница Линии) */
.sport-time-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.sport-time-chip {
  flex: 1 1 40px;
  min-width: 40px;
  padding: 7px 6px;
  border-radius: 9px;
  background: var(--sport-panel-2);
  border: 1px solid var(--sport-border);
  color: #c9cfda;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  cursor: pointer;
  transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}
.sport-time-chip:hover {
  border-color: rgba(255, 176, 31, 0.45);
  color: #fff;
}
.sport-time-chip.is-active {
  background: var(--sport-accent);
  border-color: var(--sport-accent);
  color: #1a1300;
}

/* Переключатель Линия/Live чуть компактнее на мобиле. */
@media (max-width: 700px) {
  div.sport-tabs {
    margin: 0;
    padding: 12px 12px 0;
    gap: 0;
  }
  div.sport-tabs > .sport-tab {
    font-size: 16px;
    padding: 8px 2px 11px;
  }
}

/* Поиск с иконкой лупы внутри поля (Линия и Live) */
.sport-search input {
  padding-left: 36px;
  background-color: var(--sport-panel-2);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a8a96' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 13px center;
  background-size: 15px 15px;
}

/* Бейджи-счётчики верхней ленты видов спорта (ПК) — аккуратный чип
   в верхнем-правом углу кнопки, не наезжает на иконку и текст */
.sport-categories-slide .sport-cat { position: relative; overflow: visible; padding-top: 18px; }
.sport-categories-slide .sport-cat .icon { position: static; }
.sport-categories-slide .sport-cat__badge {
  position: absolute;
  top: 4px;
  right: 7px;
  left: auto;
  min-width: 17px;
  height: 17px;
  padding: 0 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--sport-accent);
  color: #1a1300;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  border-radius: 9px;
  border: 2px solid var(--sport-panel-2);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
  box-sizing: border-box;
  z-index: 3;
}
.sport-categories-slide .sport-cat.is-active .sport-cat__badge {
  background: #1a1300;
  color: var(--sport-accent);
  border-color: var(--sport-accent);
}

/* ── Единая типографика заголовков секций (одна шкала со «Все игры» в Казино) ── */
.pop-events-head h2,
.top-leagues-section h2,
.events-table-section > h2 {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.2px;
}
.pop-events-head h2::before,
.top-leagues-section h2::before,
.events-table-section > h2::before {
  content: "";
  flex: 0 0 auto;
  width: 4px;
  height: 20px;
  border-radius: 3px;
  background: linear-gradient(180deg, #ff8a00, #ffc01f);
  box-shadow: 0 0 10px rgba(255, 176, 31, 0.45);
}

/* ── Единая отдача на нажатие (press) для кликабельных кнопок ── */
.tbl-odd,
.pop-odd,
.sport-cat,
.bl-promo__nav-chip,
.live-show-more,
.line-show-more {
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease;
}
.tbl-odd:active,
.pop-odd:active,
.sport-cat:active,
.bl-promo__nav-chip:active,
.live-show-more:active,
.line-show-more:active {
  transform: translateY(1px) scale(0.99);
}

/* ── Скелетоны загрузки кэфов: серый пульс вместо пустых ячеек ── */
@keyframes oddsSkeletonShimmer {
  0%   { background-position: 130% 0; }
  100% { background-position: -30% 0; }
}
.league-row-odds.is-loading-odds .tbl-odd:disabled {
  position: relative;
  overflow: hidden;
  color: transparent !important;
  border-color: var(--sport-border);
  background: var(--sport-panel-2);
}
.league-row-odds.is-loading-odds .tbl-odd:disabled .tbl-val,
.league-row-odds.is-loading-odds .tbl-odd:disabled .tbl-label {
  visibility: hidden;
}
.league-row-odds.is-loading-odds .tbl-odd:disabled .tbl-val:empty::after {
  content: "" !important;
}
.league-row-odds.is-loading-odds .tbl-odd:disabled::after {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 4px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.05) 25%, rgba(255, 255, 255, 0.12) 50%, rgba(255, 255, 255, 0.05) 75%);
  background-size: 220% 100%;
  animation: oddsSkeletonShimmer 1.15s linear infinite;
}

/* ── Мобайл (≤700px): деликатное уменьшение заголовков и плиток «Виды спорта».
   Размещено в КОНЦЕ файла осознанно — иначе базовые правила ниже по тексту
   перебивали бы его при равной специфичности. ── */
@media (max-width: 700px) {
  .pop-events-head h2,
  .top-leagues-section h2,
  .events-table-section > h2,
  .sport-block-head h2 {
    font-size: 14px;
  }
  .sport-section-head h3 {
    font-size: 12px;
  }
  /* Плитки «Виды спорта» — ещё чуть компактнее. */
  .sport-categories-slide .sport-cat {
    padding: 5px;
    padding-top: 14px;
    gap: 5px;
  }
  .sport-cat .icon {
    width: 20px;
    height: 20px;
  }
  .sport-cat > span:last-child {
    font-size: 10px;
  }
}

/* ============================================================
   Популярные события — редизайн карточки (амбер-акцент, моб+ПК)
   ============================================================ */
.pop-event-card {
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Янтарная шапка: иконка спорта + лига + звезда */
.pop-card-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  background: linear-gradient(90deg, rgba(255, 176, 31, 0.20), rgba(255, 176, 31, 0.03));
  border-bottom: 1px solid var(--sport-border);
}
.pop-card-ico {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--sport-accent);
}
.pop-card-ico svg {
  width: 16px;
  height: 16px;
}
.pop-card-league {
  flex: 1;
  min-width: 0;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pop-card-fav {
  flex: 0 0 auto;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 15px;
  color: var(--sport-muted);
  line-height: 1;
}
.pop-card-fav.is-active {
  color: var(--sport-accent);
}

/* Строка статуса: live = тайм/минута, прематч = дата/время */
.pop-card-status {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px 0;
  font-size: 11px;
  font-weight: 600;
  color: var(--sport-muted);
}
.pop-card-livedot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ff3b3b;
  animation: popLivePulse 1.6s infinite;
}
@keyframes popLivePulse {
  0% { box-shadow: 0 0 0 0 rgba(255, 59, 59, 0.45); }
  70% { box-shadow: 0 0 0 6px rgba(255, 59, 59, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 59, 59, 0); }
}
.pop-card-min {
  color: var(--sport-accent);
  font-weight: 700;
}
.pop-card-time {
  color: #fff;
  font-weight: 700;
}

/* Команды вертикально + счёт в боксе */
.pop-card-teams {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 12px;
  cursor: pointer;
}
.pop-card-team {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.pop-card-tname {
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pop-card-tscore {
  flex: 0 0 auto;
  min-width: 22px;
  text-align: center;
  font-size: 13px;
  font-weight: 800;
  color: #fff;
  background: var(--sport-panel-3);
  border-radius: 6px;
  padding: 1px 7px;
}

/* Пилюля «+N рынков» */
.pop-card-more {
  align-self: flex-start;
  margin: 0 12px 8px;
  font-size: 11px;
  font-weight: 700;
  color: var(--sport-accent);
  background: rgba(255, 176, 31, 0.12);
  border-radius: 999px;
  padding: 3px 10px;
  cursor: pointer;
}

/* Кэфы — стек label/значение, активный = янтарь */
.pop-card-odds {
  display: flex;
  gap: 6px;
  padding: 0 12px 12px;
}
.pop-odd2 {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  background: var(--sport-cell);
  border: 1px solid var(--sport-border);
  border-radius: 8px;
  padding: 6px 4px;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s, transform 0.08s;
}
.pop-odd2-l {
  font-size: 10px;
  font-weight: 600;
  color: var(--sport-muted);
}
.pop-odd2-v {
  font-size: 13px;
  font-weight: 800;
  color: #fff;
}
.pop-odd2:hover:not(:disabled) {
  border-color: var(--sport-accent);
  background: var(--sport-cell-hover);
  box-shadow: inset 0 0 0 1px rgba(255, 176, 31, 0.25), 0 2px 8px rgba(0, 0, 0, 0.25);
  transform: translateY(-1px);
}
.pop-odd2.is-active {
  background: var(--sport-accent-grad);
  border-color: var(--sport-accent-dark);
  box-shadow: var(--sport-accent-glow);
}
.pop-odd2.is-active .pop-odd2-l,
.pop-odd2.is-active .pop-odd2-v {
  color: #16213c;
}
.pop-odd2:disabled {
  opacity: 0.45;
  cursor: default;
}

@media (max-width: 700px) {
  .pop-card-league { font-size: 11px; }
  .pop-card-tname { font-size: 12px; }
  .pop-card-tscore { font-size: 12px; }
  .pop-odd2-v { font-size: 12px; }
}

/* ═══════════════════════════════════════════════════════════════════
   Премиум-вид ВИДОВ СПОРТА (лента .sport-cat на ПК + ul.sport-tabs на
   мобиле). Переключатель Линия/Live (div.sport-tabs) НЕ трогаем.
   ═══════════════════════════════════════════════════════════════════ */

.sport-cat,
ul.sport-tabs .sport-tab {
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

/* Кружки-иконки — мягкое «стекло» + плавные переходы. */
.sport-cat .icon,
ul.sport-tabs .sport-tab__ico {
  background: radial-gradient(circle at 32% 28%, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.02)) !important;
  border: 1px solid rgba(255, 255, 255, 0.09);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
  transition: background 0.18s ease, box-shadow 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}

/* Hover неактивных — лёгкий подъём + янтарный намёк. */
@media (hover: hover) {
  .sport-cat:not(.is-active):hover,
  ul.sport-tabs .sport-tab:not(.is-active):hover {
    transform: translateY(-2px);
    border-color: rgba(255, 176, 31, 0.4) !important;
  }
  .sport-cat:not(.is-active):hover .icon,
  ul.sport-tabs .sport-tab:not(.is-active):hover .sport-tab__ico {
    color: #ffb01f;
    border-color: rgba(255, 176, 31, 0.35);
  }
}

/* Активный вид (ПК + мобила одинаково) — ТЁМНЫЙ пилл/карточка с янтарной
   рамкой и свечением. Круг иконки без сплошной заливки → цветной эмодзи
   ярко смотрится на тёмном (не на янтаре). */
.sport-cat.is-active,
ul.sport-tabs .sport-tab.is-active {
  background: linear-gradient(160deg, rgba(255, 176, 31, 0.13), rgba(255, 255, 255, 0.02)) !important;
  border: 1px solid rgba(255, 176, 31, 0.55) !important;
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(255, 176, 31, 0.2) !important;
}
.sport-cat.is-active .icon,
ul.sport-tabs .sport-tab.is-active .sport-tab__ico {
  background: radial-gradient(circle at 32% 28%, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.02)) !important;
  border: 1px solid rgba(255, 176, 31, 0.45) !important;
  box-shadow: 0 0 12px rgba(255, 176, 31, 0.28) !important;
  color: #ffb01f !important;
}

/* =====================================================================
   РЕДИЗАЙН КАРТОЧЕК МАТЧА (2026-07-04, только CSS, без правок разметки):
   Линия = «чистая компактная» (v1), Лайв = «LIVE-герой» (v3).
   Скоуп через [data-sport-page], логика ставок/избранного не затронута.
   ===================================================================== */

/* ---------- ЛИНИЯ (прематч) — v1: чистая компактная ---------- */
[data-sport-page="line"] .league-table-row {
  background: linear-gradient(180deg, #1a1c21, #131418);
  border-color: rgba(255, 255, 255, 0.07);
}
[data-sport-page="line"] .lrt-name {
  color: #e9edf3;
}
@media (max-width: 600px) {
  /* тонкий разделитель между блоком матча и рядом кэфов */
  [data-sport-page="line"] .league-row-odds--line {
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    margin-top: 4px;
    padding-top: 8px;
  }
  [data-sport-page="line"] .lrt-name {
    font-size: 13.5px;
  }
  [data-sport-page="line"] .league-row-time {
    font-weight: 600;
    color: #8a93a6;
  }
}

/* ---------- ЛАЙВ — v3: LIVE-герой ---------- */
[data-sport-page="live"] .league-table-row {
  position: relative;
  background: linear-gradient(180deg, #191b1f, #121315);
  border-color: rgba(255, 59, 59, 0.2);
  padding-left: 16px;
}
/* красная грань слева (без сдвига контента — только визуальный акцент) */
[data-sport-page="live"] .league-table-row::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: #ff3b3b;
  box-shadow: 0 0 8px rgba(255, 59, 59, 0.5);
}
[data-sport-page="live"] .league-table-row:hover {
  border-color: rgba(255, 59, 59, 0.45);
  background: linear-gradient(180deg, #1d1f24, #141517);
}
/* период / минута — ярче и заметнее */
[data-sport-page="live"] .live-period-tag,
[data-sport-page="live"] .live-minute {
  color: #ff5a5a;
  font-size: 11px;
  font-weight: 800;
}
/* счёт — крупный янтарь, без серой плашки */
[data-sport-page="live"] .live-sets {
  font-size: 15px;
  font-weight: 800;
  color: #ffb01f;
  background: transparent;
  padding: 0;
  letter-spacing: 0;
}
/* имена команд жирнее и белее */
[data-sport-page="live"] .lrt-name {
  font-weight: 700;
  color: #fff;
}
@media (max-width: 600px) {
  /* кэфы-пилюли + разделитель с красным оттенком */
  [data-sport-page="live"] .league-row-odds--live {
    border-top: 1px solid rgba(255, 59, 59, 0.14);
    margin-top: 4px;
    padding-top: 8px;
  }
  [data-sport-page="live"] .league-row-odds--live > .tbl-odd {
    border-radius: 8px;
  }
}

/* ---------- «Популярные события» (pop-event-card) — тот же язык ---------- */
/* База (прематч, v1): чуть богаче фон, аккуратная рамка. */
.pop-event-card {
  background: linear-gradient(180deg, #1a1c21, #131418);
}
/* Лайв (v3): красная грань слева, красная минута, крупный янтарный счёт. */
.pop-event-card.is-live {
  position: relative;
  border-top-color: transparent;
  border-color: rgba(255, 59, 59, 0.22);
  background: linear-gradient(180deg, #191b1f, #121315);
}
/* Красной грани слева больше нет — вместо неё красная полоса-шапка сверху. */
.pop-event-card.is-live::before { display: none; }
.pop-event-card.is-live .pop-card-head {
  background: linear-gradient(90deg, rgba(255, 59, 59, 0.28), rgba(255, 59, 59, 0.06) 60%, rgba(255, 59, 59, 0));
  border-bottom-color: rgba(255, 59, 59, 0.2);
}
.pop-event-card.is-live .pop-card-period,
.pop-event-card.is-live .pop-card-min {
  color: #ff5a5a;
  font-weight: 800;
}
.pop-event-card.is-live .pop-card-tscore {
  background: transparent;
  color: #ffb01f;
  font-size: 16px;
  font-weight: 800;
  padding: 0;
  min-width: 20px;
}

/* ---------- Broadcast-скорборд: общий каркас (только мобилка) ---------- */
/* Десктоп — классическая таблица (.lh-desktop), мобилка — скорборд (.lh-mobile). */
.lh-mobile { display: none; }
@media (max-width: 600px) {
  .lh-mobile { display: block; }
  .lh-desktop { display: none !important; }
  .league-table-row.lh-card {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    padding: 12px 14px;
    overflow: hidden;
  }
  /* Вместо красной грани слева — жирная полоса-шапка сверху (как на главной). */
  [data-sport-page="live"] .league-table-row.lh-card::before { display: none; }
  .lh-mobile .lh-head {
    margin: -12px -14px 8px;
    padding: 8px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  }
  [data-sport-page="live"] .lh-mobile .lh-head {
    background: linear-gradient(90deg, rgba(255, 59, 59, 0.32), rgba(255, 59, 59, 0.08) 55%, rgba(255, 59, 59, 0));
    border-bottom-color: rgba(255, 59, 59, 0.18);
  }
  [data-sport-page="line"] .lh-mobile .lh-head {
    background: linear-gradient(90deg, rgba(255, 176, 31, 0.16), rgba(255, 176, 31, 0.04) 55%, rgba(255, 176, 31, 0));
    border-bottom-color: rgba(255, 176, 31, 0.14);
  }
}
.lh-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
}
.lh-live {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #ff5a5a;
  font-weight: 800;
  letter-spacing: 0.05em;
}
.lh-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #ff3b3b;
  box-shadow: 0 0 6px rgba(255, 59, 59, 0.6);
  animation: bl-live-pulse 1.4s ease-in-out infinite;
}
.lh-period { color: #8a93a6; font-weight: 600; }
/* Минута в шапке моб. карточки — янтарная пилюля (в тон десктопному индикатору). */
.lh-min {
  color: #16213c;
  font-weight: 900;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  padding: 3px 7px;
  border-radius: 6px;
  background: linear-gradient(180deg, #ffd873, #ffb01f 55%, #f39200);
  box-shadow: 0 2px 7px rgba(243, 146, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
.lh-more {
  margin-left: auto;
  color: var(--sport-accent);
  background: rgba(255, 176, 31, 0.12);
  border-radius: 999px;
  padding: 2px 9px;
  font-size: 11px;
  font-weight: 700;
}

.lh-board {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 10px;
}
.lh-team {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  min-width: 0;
}
.lh-board .lh-team .tcrest {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #2b2f37;
}
.lh-board .lh-team .tcrest__stub {
  font-size: 17px;
  color: #c2ccdb;
}
.pop-event-card .lh-board--pop .lh-team .tcrest__stub {
  font-size: 15px;
}
.lh-team__name {
  font-size: 12.5px;
  font-weight: 600;
  color: #eef1f6;
  text-align: center;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.lh-score {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  font-family: "Onest", Rubik, sans-serif;
  font-size: 23px;
  font-weight: 900;
  color: #fff;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  padding: 0 4px;
}
.lh-score i { color: #4a5568; font-style: normal; font-size: 16px; }

.lh-progress {
  height: 4px;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
}
.lh-progress__fill {
  display: block;
  height: 100%;
  border-radius: 2px;
  background: linear-gradient(90deg, #f39200, #ffd873);
  transition: width 0.4s ease;
}

/* Центр прематч-карточки: время начала + «VS» (вместо счёта) */
.lh-date {
  color: #8a93a6;
  font-weight: 600;
}
.lh-kick {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  padding: 0 6px;
}
.lh-kick__vs {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: #5b6779;
}
.lh-kick__time {
  font-family: "Onest", Rubik, sans-serif;
  font-size: 20px;
  font-weight: 800;
  color: #e9edf3;
  font-variant-numeric: tabular-nums;
  line-height: 1.05;
}

/* Broadcast-скорборд внутри «Популярных событий» (компактнее) */
.pop-event-card .lh-head--pop { padding: 8px 12px 0; }
.pop-event-card .lh-board--pop { padding: 8px 12px 10px; }
.pop-event-card .lh-board--pop .lh-team .tcrest { width: 38px; height: 38px; }
.pop-event-card .lh-board--pop .lh-score { font-size: 24px; }
.pop-event-card .lh-board--pop .lh-score i { font-size: 15px; }
.pop-event-card .lh-board--pop .lh-kick__time { font-size: 17px; }
.pop-event-card .lh-team__name { font-size: 11.5px; }

/* Мобилка — светло-синие блоки; десктоп остаётся графитовым (правила выше). */
@media (max-width: 600px) {
  [data-sport-page="line"] .league-table-row.lh-card {
    background: linear-gradient(180deg, #1f2b42, #18202f);
  }
  [data-sport-page="live"] .league-table-row.lh-card {
    background: linear-gradient(180deg, #1e2940, #18202e);
  }
  .pop-event-card {
    background: linear-gradient(180deg, #1f2b42, #18202f);
  }
  .pop-event-card.is-live {
    background: linear-gradient(180deg, #1e2940, #18202e);
  }
}

/* ═══ Мобильная строка матча — компактная (1win-style, а не высокое табло) ═══
   Команды в СТОЛБИК СЛЕВА (мелкий герб + имя в строку), счёт/время справа.
   Раньше был центрированный скорборд с гербами в столбик → 2-3 матча на экран. */
@media (max-width: 600px) {
  .league-table-row.lh-card { padding: 9px 12px; gap: 8px; }
  .lh-mobile .lh-head { margin: -9px -12px 7px; padding: 6px 12px; }

  .lh-board {
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    column-gap: 10px;
    row-gap: 5px;
    align-items: center;
  }
  /* Команда 1 — верхняя строка слева, команда 2 — нижняя. */
  .lh-board > .lh-team:first-of-type { grid-column: 1; grid-row: 1; }
  .lh-board > .lh-team:last-of-type { grid-column: 1; grid-row: 2; }
  /* Счёт (live) или время (прематч) — справа, по центру двух строк. */
  .lh-board > .lh-score,
  .lh-board > .lh-kick { grid-column: 2; grid-row: 1 / span 2; justify-self: end; }

  /* Команда — горизонтально: мелкий герб + имя, слева. */
  .lh-board .lh-team {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 9px;
  }
  .lh-board .lh-team .tcrest { width: 26px; height: 26px; }
  .lh-board .lh-team .tcrest__stub { font-size: 12px; }
  .lh-team__name { text-align: left; font-size: 13.5px; font-weight: 600; }

  /* Счёт компактнее и в правый край. */
  .lh-board .lh-score { font-size: 20px; padding: 0; }
  .lh-board .lh-score i { font-size: 14px; }
  .lh-kick { flex-direction: row; align-items: baseline; gap: 5px; padding: 0; }
  .lh-kick__vs { display: none; }
  .lh-kick__time { font-size: 15px; font-weight: 700; color: #aeb7c6; }
}

/* =====================================================================
   2-исходные виды спорта (теннис/баскет/волейбол и т.п. — без ничьей):
   прячем колонки X / 1X / 12 / 2X, чтобы не было пустых прочерков.
   Индексы детей сохраняются (display:none), адаптив-правила не ломаются.
   ===================================================================== */
.league-row-odds.is-two-way > *:nth-child(2),
.league-row-odds.is-two-way > *:nth-child(4),
.league-row-odds.is-two-way > *:nth-child(5),
.league-row-odds.is-two-way > *:nth-child(6),
.league-table-cols-head.is-two-way > *:nth-child(2),
.league-table-cols-head.is-two-way > *:nth-child(4),
.league-table-cols-head.is-two-way > *:nth-child(5),
.league-table-cols-head.is-two-way > *:nth-child(6) {
  display: none !important;
}
/* Десктоп-сетка под 8 рынков (без колонок ничьей). */
.league-row-odds--line.is-two-way,
.league-row-odds--live.is-two-way,
.league-table-cols-head--line.is-two-way,
.league-table-cols-head--live.is-two-way {
  grid-template-columns: repeat(8, 46px) 26px;
}
@media (max-width: 1100px) {
  .league-row-odds--line.is-two-way,
  .league-row-odds--live.is-two-way,
  .league-table-cols-head--line.is-two-way,
  .league-table-cols-head--live.is-two-way {
    grid-template-columns: repeat(8, 44px) 26px;
  }
}

/* Мини-статы в лайв-карточке (livedatasoccerstats): владение + удары/атаки/угловые. */
.lh-mstat { margin-top: 8px; }
.lh-mstat__poss {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: "Onest", Rubik, sans-serif;
  font-size: 11px;
  font-weight: 800;
  color: #c9d2e0;
}
.lh-mstat__pv { flex: 0 0 auto; min-width: 22px; }
.lh-mstat__pv:last-child { text-align: right; }
.lh-mstat__bar {
  flex: 1;
  height: 4px;
  border-radius: 2px;
  background: #3f6ea8;
  overflow: hidden;
}
.lh-mstat__fill {
  display: block;
  height: 100%;
  border-radius: 2px;
  background: linear-gradient(90deg, #f39200, #ffce54);
}
.lh-mstat__tags {
  display: flex;
  gap: 12px;
  margin-top: 5px;
  font-size: 10.5px;
  font-weight: 700;
  color: #8a93a6;
  font-variant-numeric: tabular-nums;
}

/* =====================================================================
   WINNERSLOBBY SPORTS INTERFACE PORT

   This block ports the actual layout and surface rules from
   screen/winnerslobby/public/frontend/Default/css/sports.css to BetLab's
   Vue markup. Only presentation lives here: events, odds and bet placement
   continue to use BetLab stores and API.
   ===================================================================== */
.content[data-sport-page="line"],
.content[data-sport-page="live"] {
  --sport-accent: #108de7;
  --sport-accent-dark: #0855c4;
  --sport-panel: #141b2e;
  --sport-panel-2: #192137;
  --sport-panel-3: #252f4b;
  --sport-border: #252f4b;
  --sport-muted: #94a6cd;
  --sport-surf: #141b2e;
  --sport-surf-row: #edf2ff;
  --sport-cell: rgba(108, 125, 163, .16);
  --sport-cell-hover: rgba(108, 125, 163, .30);
  --sport-accent-grad: linear-gradient(143.56deg, #0095ff -58.98%, #0855c4 95.86%);
  --sport-accent-glow: 0 6px 22px rgba(5, 109, 218, .20);
  box-sizing: border-box;
  padding-top: 3px;
  background: #090f1e;
  color: #fff;
}

/* The source uses 270px / flexible content / 281px with 20px gutters. */
.content[data-sport-page] .sport-shell {
  display: grid;
  grid-template-columns: 270px minmax(0, 1fr) 281px;
  gap: 20px;
  align-items: start;
  padding: 0 0 20px;
  font-family: Tahoma, Arial, sans-serif;
  font-size: 12px;
}

.content[data-sport-page] .sport-sidebar,
.content[data-sport-page] .sport-betslip {
  position: sticky;
  top: 8px;
  max-height: calc(100dvh - 24px);
  min-width: 0;
  overflow-x: hidden;
  overflow-y: auto;
  border-radius: 8px;
  background: #141b2e;
  scrollbar-width: thin;
  scrollbar-color: rgba(217, 217, 217, .3) transparent;
}

.content[data-sport-page] .sport-sidebar::-webkit-scrollbar,
.content[data-sport-page] .sport-betslip::-webkit-scrollbar {
  width: 8px;
}

.content[data-sport-page] .sport-sidebar::-webkit-scrollbar-thumb,
.content[data-sport-page] .sport-betslip::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background: rgba(217, 217, 217, .3);
}

/* One continuous left navigation, matching .sports-bets-navigation. */
.content[data-sport-page] .sport-sidebar > .sport-panel {
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.content[data-sport-page] .sport-sidebar > .sport-panel:first-child {
  padding-top: 10px;
}

.content[data-sport-page] .sport-sidebar div.sport-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  margin: 0 10px 10px;
  padding: 4px;
  border: 0;
  border-radius: 8px;
  background: #192137;
}

.content[data-sport-page] .sport-sidebar div.sport-tabs .sport-tab {
  min-height: 34px;
  padding: 0 8px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #94a6cd;
  font-size: 12px;
  font-weight: 700;
}

.content[data-sport-page] .sport-sidebar div.sport-tabs .sport-tab::after {
  display: none;
}

.content[data-sport-page] .sport-sidebar div.sport-tabs .sport-tab.is-active {
  background: linear-gradient(103deg, #108de7 -30%, #0855c4);
  color: #fff;
  box-shadow: 0 6px 22px rgba(5, 109, 218, .25);
}

.content[data-sport-page] .sport-tab__n {
  border: 0;
  background: rgba(255, 255, 255, .14);
  color: inherit;
}

.content[data-sport-page] .sport-search {
  position: relative;
  margin: 0 15px;
  padding: 10px 0;
  border-top: 1px solid rgba(37, 47, 75, .7);
  border-bottom: 1px solid rgba(37, 47, 75, .7);
}

.content[data-sport-page] .sport-search input {
  height: 40px;
  padding: 0 13px 0 36px;
  border: 0;
  border-radius: 8px;
  outline: none;
  background:
    linear-gradient(135deg, transparent 0 100%),
    #192137;
  color: #fff;
  font-size: 12px;
}

.content[data-sport-page] .sport-search::before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 13px;
  top: 50%;
  width: 12px;
  height: 12px;
  border: 2px solid #94a6cd;
  border-radius: 50%;
  transform: translateY(-58%);
  pointer-events: none;
}

.content[data-sport-page] .sport-search::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 25px;
  top: calc(50% + 5px);
  width: 6px;
  height: 2px;
  border-radius: 1px;
  background: #94a6cd;
  transform: rotate(45deg);
  pointer-events: none;
}

.content[data-sport-page] .side-quickfilter {
  gap: 5px;
  padding: 0 15px 10px;
}

.content[data-sport-page] .side-qf {
  min-height: 34px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #94a6cd;
  font-size: 11px;
}

.content[data-sport-page] .side-qf:hover,
.content[data-sport-page] .side-qf.is-active {
  border: 0;
  background: linear-gradient(103deg, #108de7 -30%, #0855c4);
  color: #fff;
}

.content[data-sport-page] .sportcats-sidebar {
  padding: 0 10px 10px;
}

.content[data-sport-page] .sportcats-sidebar .sport-section-head {
  min-height: 31px;
  margin: 0 8px;
  color: #616e8c;
}

.content[data-sport-page] .sportcats-sidebar .sport-section-head h3 {
  color: #616e8c;
  font-size: 11px;
  font-weight: 600;
  text-transform: none;
}

.content[data-sport-page] .sportcats-sidebar .sport-section-head::after {
  content: "";
  flex: 1;
  height: 1px;
  margin-left: 8px;
  background: #616e8c;
}

.content[data-sport-page] .sportcats-sidebar ul.sport-tabs {
  gap: 0;
  padding: 0;
}

.content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab {
  min-height: 38px;
  padding: 7px 40px 7px 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  color: #d8dfed;
  font-family: Tahoma, Arial, sans-serif;
}

.content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab:hover,
.content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active {
  border: 0;
  background: linear-gradient(103deg, #108de7 -30%, #0855c4) !important;
  box-shadow: none !important;
  color: #fff;
}

.content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab__ico,
.content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active .sport-tab__ico {
  width: 20px;
  height: 20px;
  border-radius: 0;
  background: transparent;
  color: #fff;
}

.content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab__name {
  font-size: 12px;
  font-weight: 500;
}

.content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab__badge,
.content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active .sport-tab__badge {
  right: 10px;
  min-width: 24px;
  height: 18px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #94a6cd;
  font-size: 11px;
  font-weight: 500;
}

.content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active .sport-tab__badge {
  color: #fff;
}

.content[data-sport-page] .line-topbar {
  display: none;
}

/* Center content uses the source's compact, table-first rhythm. */
.content[data-sport-page] .sport-main {
  min-width: 0;
  overflow: visible;
}

.content[data-sport-page] .pop-events-section,
.content[data-sport-page] .hot-matches-strip,
.content[data-sport-page] .events-table-section {
  min-width: 0;
}

.content[data-sport-page] .pop-events-section {
  margin-bottom: 14px;
  padding: 0 0 12px;
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  background: #edf2ff;
  box-shadow: none;
}

.content[data-sport-page] .pop-events-head {
  min-height: 38px;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0 15px;
  background: linear-gradient(103deg, #108de7 -30%, #0855c4);
}

.content[data-sport-page] .pop-events-head h2 {
  margin: 0;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}

.content[data-sport-page] .pop-events-slider {
  padding: 10px 10px 0;
}

.content[data-sport-page] .pop-event-card {
  border: 0;
  border-radius: 8px;
  background: #fff;
  color: #090f1e;
  box-shadow: 0 2px 8px rgba(9, 15, 30, .08);
}

.content[data-sport-page] .pop-event-card:hover {
  border: 0;
  box-shadow: 0 5px 15px rgba(9, 15, 30, .16);
}

.content[data-sport-page] .pop-card-head,
.content[data-sport-page] .pop-card-league,
.content[data-sport-page] .pop-event-card .lh-team__name,
.content[data-sport-page] .pop-event-card .lh-score,
.content[data-sport-page] .pop-event-card .lh-kick__time {
  color: #090f1e;
}

.content[data-sport-page] .pop-event-card .lh-board .lh-team .tcrest {
  background: #edf2ff;
}

.content[data-sport-page] .pop-card-more {
  color: #6c7da3;
}

.content[data-sport-page] .pop-odd2 {
  min-height: 36px;
  border: 0;
  border-radius: 8px;
  background: rgba(108, 125, 163, .20);
  color: #090f1e;
}

.content[data-sport-page] .pop-odd2:hover {
  background: rgba(108, 125, 163, .34);
}

.content[data-sport-page] .pop-odd2.is-active {
  background: linear-gradient(143.56deg, #0095ff -58.98%, #0855c4 95.86%);
  color: #fff;
  box-shadow: 0 6px 22px rgba(5, 109, 218, .20);
}

.content[data-sport-page] .events-table-section {
  margin-bottom: 15px;
}

.content[data-sport-page] .line-section-head,
.content[data-sport-page] .events-table-section > h2 {
  min-height: 36px;
  margin: 0 0 8px;
  color: #fff;
}

.content[data-sport-page] .line-section-head h2,
.content[data-sport-page] .events-table-section > h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
}

.content[data-sport-page] .league-table-block {
  contain: content;
  margin-bottom: 10px;
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  background: linear-gradient(103deg, #108de7 -30%, #0855c4);
  box-shadow: none;
}

.content[data-sport-page] .league-table-head,
.content[data-sport-page="line"] .league-table-head,
.content[data-sport-page="live"] .league-table-head {
  flex-direction: row;
  align-items: center;
  min-height: 40px;
  box-sizing: border-box;
  padding: 7px 10px 7px 15px;
  border: 0;
  border-radius: 0;
  background: linear-gradient(103deg, #108de7 -30%, #0855c4);
  color: #fff;
  font-size: 12px;
}

.content[data-sport-page] .league-table-head svg path,
.content[data-sport-page="line"] .league-table-head svg path,
.content[data-sport-page="live"] .league-table-head svg path {
  stroke: #fff;
}

.content[data-sport-page] .league-table-head-left > span:not(.league-icon-small),
.content[data-sport-page="line"] .league-table-head-left > span:not(.league-icon-small),
.content[data-sport-page="live"] .league-table-head-left > span:not(.league-icon-small) {
  color: #fff;
  font-size: 12px;
  font-weight: 500;
}

.content[data-sport-page] .league-table-head .league-table-cols-head span,
.content[data-sport-page="line"] .league-table-head .league-table-cols-head span,
.content[data-sport-page="live"] .league-table-head .league-table-cols-head span {
  color: #b1d1ff;
  opacity: 1;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: -.1px;
}

.content[data-sport-page] .league-table-body {
  display: block;
  padding: 0;
  background: #edf2ff;
}

.content[data-sport-page] .league-table-row,
.content[data-sport-page] .league-table-row.lh-card {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 0;
  min-height: 52px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: #edf2ff;
  color: #090f1e;
  box-shadow: none;
}

.content[data-sport-page] .league-table-row + .league-table-row {
  border-top: 1px solid #090f1e;
}

.content[data-sport-page] .league-table-row:hover {
  border-color: #090f1e;
  background: #141b2e;
  color: #fff;
  transform: none;
  box-shadow: none;
}

.content[data-sport-page] .league-row-info {
  align-self: stretch;
  min-width: 190px;
  padding: 5px 7px;
  gap: 6px;
  border: 0;
}

.content[data-sport-page] .league-row-time {
  position: relative;
  min-width: 56px;
  box-sizing: border-box;
  margin-right: 2px;
  padding-right: 10px;
  color: #090f1e;
  font-size: 10px;
  line-height: 1.35;
}

.content[data-sport-page] .league-table-row:hover .league-row-time,
.content[data-sport-page] .league-table-row:hover .league-row-teams,
.content[data-sport-page] .league-table-row:hover .lrt-name,
.content[data-sport-page] .league-table-row:hover .live-desktop-score {
  color: #fff;
}

.content[data-sport-page] .league-row-time::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: 3px;
  height: 32px;
  border-radius: 2px;
  background: linear-gradient(103deg, #108de7 -30%, #0855c4);
  opacity: .8;
  transform: translateY(-50%);
}

.content[data-sport-page] .league-row-teams,
.content[data-sport-page] .lrt-name {
  color: #090f1e;
  font-size: 11px;
  font-weight: 500;
}

.content[data-sport-page] .lrt-line {
  min-height: 20px;
}

.content[data-sport-page] .lrt-line .tcrest,
.content[data-sport-page] .ltl-team .tcrest {
  width: 18px;
  height: 18px;
  background: rgba(108, 125, 163, .16);
}

.content[data-sport-page] .live-desktop-score {
  color: #090f1e;
}

.content[data-sport-page] .league-row-odds--line,
.content[data-sport-page] .league-row-odds--live,
.content[data-sport-page] .league-table-cols-head--line,
.content[data-sport-page] .league-table-cols-head--live {
  grid-template-columns: repeat(3, minmax(38px, 1fr)) repeat(4, minmax(40px, 1fr)) minmax(36px, .75fr) 24px;
  gap: 0;
  width: min(62%, 570px);
  max-width: 570px;
}

.content[data-sport-page] .league-row-odds {
  align-self: stretch;
  flex: 0 1 570px;
}

.content[data-sport-page] .league-row-odds .tbl-odd,
.content[data-sport-page] .league-row-odds .tbl-more {
  min-width: 0;
  min-height: 52px;
  padding: 3px 2px;
  border: 0;
  border-left: 1px solid rgba(108, 125, 163, .18);
  border-radius: 0;
  background: rgba(108, 125, 163, .10);
  color: #090f1e;
  box-shadow: none;
}

.content[data-sport-page] .league-row-odds .tbl-odd:nth-child(even) {
  background: rgba(108, 125, 163, .17);
}

.content[data-sport-page] .league-row-odds .tbl-odd:hover,
.content[data-sport-page] .league-row-odds .tbl-more:hover {
  border-color: rgba(108, 125, 163, .18);
  background: #9ea5b4;
  color: #090f1e;
  transform: none;
  box-shadow: none;
}

.content[data-sport-page] .league-row-odds .tbl-odd.is-active {
  border: 0;
  border-left: 1px solid rgba(108, 125, 163, .18);
  border-radius: 8px;
  background: linear-gradient(143.56deg, #0095ff -58.98%, #0855c4 95.86%);
  color: #fff;
  box-shadow: 0 6px 22px rgba(5, 109, 218, .20);
}

.content[data-sport-page] .league-row-odds .tbl-odd.is-active .tbl-label,
.content[data-sport-page] .league-row-odds .tbl-odd.is-active .tbl-val {
  color: #fff;
}

.content[data-sport-page] .league-row-odds .tbl-odd:disabled {
  background: rgba(20, 27, 46, .18);
  color: rgba(9, 15, 30, .38);
}

.content[data-sport-page] .league-row-odds .tbl-val {
  color: inherit;
  font-size: 11px;
  font-weight: 700;
}

.content[data-sport-page] .league-row-odds .tbl-label {
  color: #6c7da3;
}

.content[data-sport-page] .league-row-odds .tbl-fav {
  align-self: stretch;
  display: grid;
  place-items: center;
  border: 0;
  border-left: 1px solid rgba(108, 125, 163, .18);
  border-radius: 0;
  background: rgba(108, 125, 163, .10);
  color: #87a2da;
}

.content[data-sport-page] .league-row-odds .tbl-fav.is-active {
  color: #ffcf47;
}

.content[data-sport-page] .line-noodds-toggle,
.content[data-sport-page] .line-show-more {
  border-color: rgba(16, 141, 231, .45);
  background: #192137;
  color: #b1d1ff;
}

.content[data-sport-page] .line-noodds-toggle:hover,
.content[data-sport-page] .line-show-more:hover {
  border-color: #108de7;
  background: linear-gradient(103deg, #108de7 -30%, #0855c4);
  color: #fff;
}

/* Betslip: blue tab + white coupon cards from the source interface. */
.content[data-sport-page] #bet-slip {
  border: 0;
  background: linear-gradient(135deg, #233358, rgba(20, 27, 46, .82));
}

.content[data-sport-page] #bet-slip .bs-panel {
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #fff;
  font-family: Tahoma, Arial, sans-serif;
  font-size: 12px;
}

.content[data-sport-page] #bet-slip .bs-head {
  min-height: 40px;
  box-sizing: border-box;
  justify-content: center;
  padding: 0 10px;
  border: 0;
  background: linear-gradient(103deg, #108de7 -30%, #0855c4);
}

.content[data-sport-page] #bet-slip .bs-head__title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.content[data-sport-page] #bet-slip .bs-tik {
  display: none;
}

.content[data-sport-page] #bet-slip .bs-badge {
  min-width: 16px;
  height: 16px;
  padding: 0;
  border-radius: 50%;
  background: #fff;
  color: #0855c4;
  font-size: 10px;
}

.content[data-sport-page] #bet-slip .bs-head__balance {
  display: none;
}

.content[data-sport-page] #bet-slip .bs-clear {
  position: absolute;
  right: 10px;
  width: 28px;
  height: 28px;
  background: rgba(255, 255, 255, .12);
  color: #fff;
}

.content[data-sport-page] #bet-slip .bs-tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  padding: 10px;
  border: 0;
}

.content[data-sport-page] #bet-slip .bs-tab {
  min-height: 30px;
  padding: 5px 3px;
  border: 0;
  border-radius: 8px;
  background: #192137;
  color: #94a6cd;
  font-size: 11px;
}

.content[data-sport-page] #bet-slip .bs-tab.is-active {
  background: linear-gradient(103deg, #108de7 -30%, #0855c4);
  color: #fff;
  box-shadow: 0 6px 22px rgba(5, 109, 218, .20);
}

.content[data-sport-page] #bet-slip .bs-empty {
  padding: 32px 15px;
  color: #94a6cd;
}

.content[data-sport-page] #bet-slip .bs-list {
  gap: 7px;
  padding: 0 10px 6px;
}

.content[data-sport-page] #bet-slip .bs-item {
  display: block;
  padding: 11px 10px 10px;
  border: 0;
  border-radius: 10px;
  background: #fff;
  color: #090f1e;
}

.content[data-sport-page] #bet-slip .bs-item__sport {
  display: none;
}

.content[data-sport-page] #bet-slip .bs-item__event {
  position: relative;
  padding-left: 10px;
  color: #090f1e;
  font-size: 12px;
  font-weight: 600;
}

.content[data-sport-page] #bet-slip .bs-item__event::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1px;
  bottom: 1px;
  width: 3px;
  border-radius: 0 10px 10px 0;
  background: linear-gradient(107.15deg, #0095ff, #0855c4);
  box-shadow: 0 6px 22px rgba(5, 109, 218, .30);
}

.content[data-sport-page] #bet-slip .bs-item__x {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 10px;
  background: rgba(148, 166, 205, .11);
  color: #94a6cd;
}

.content[data-sport-page] #bet-slip .bs-item__bot {
  flex-wrap: wrap;
  padding-left: 10px;
}

.content[data-sport-page] #bet-slip .bs-item__market {
  padding: 0;
  background: transparent;
  color: #096dff;
  font-size: 11px;
}

.content[data-sport-page] #bet-slip .bs-item__date {
  color: #94a6cd;
}

.content[data-sport-page] #bet-slip .bs-item__odd {
  order: -1;
  margin: 0 0 0 auto;
  padding: 7px 10px;
  border-radius: 8px;
  background: linear-gradient(143.56deg, #0095ff -58.98%, #0855c4 95.86%);
  color: #fff;
  font-size: 12px;
  text-align: center;
  box-shadow: 0 6px 22px rgba(5, 109, 218, .20);
}

.content[data-sport-page] #bet-slip .bs-item__stake,
.content[data-sport-page] #bet-slip .bs-stakebox {
  border: 1px solid rgba(108, 125, 163, .35);
  background: #edf2ff;
}

.content[data-sport-page] #bet-slip .bs-item__stake input,
.content[data-sport-page] #bet-slip .bs-stakebox input {
  color: #090f1e;
}

.content[data-sport-page] #bet-slip .bs-controls {
  gap: 10px;
  padding: 10px;
  border: 0;
}

.content[data-sport-page] #bet-slip .bs-summary,
.content[data-sport-page] #bet-slip .bs-winbox {
  border: 0;
  border-radius: 10px;
  background: #fff;
  color: #090f1e;
  box-shadow: none;
}

.content[data-sport-page] #bet-slip .bs-summary {
  padding: 10px;
}

.content[data-sport-page] #bet-slip .bs-summary__row,
.content[data-sport-page] #bet-slip .bs-winbox__l,
.content[data-sport-page] #bet-slip .bs-winbox__coef {
  color: #6c7da3;
}

.content[data-sport-page] #bet-slip .bs-summary__row strong,
.content[data-sport-page] #bet-slip .bs-winbox__v {
  color: #090f1e;
  text-shadow: none;
}

.content[data-sport-page] #bet-slip .bs-quick__btn {
  border: 0;
  border-radius: 8px;
  background: #252f4b;
  color: #fff;
}

.content[data-sport-page] #bet-slip .bs-quick__btn:hover,
.content[data-sport-page] #bet-slip .bs-quick__btn--max {
  background: linear-gradient(103deg, #108de7 -30%, #0855c4);
  color: #fff;
}

.content[data-sport-page] #bet-slip .bs-accept {
  color: #c9d5ea;
}

.content[data-sport-page] #bet-slip .bs-accept input {
  accent-color: #108de7;
}

.content[data-sport-page] #bet-slip .bs-cta {
  min-height: 42px;
  border: 0;
  border-radius: 8px;
  background: linear-gradient(103deg, #108de7 -30%, #0855c4);
  color: #fff;
  box-shadow: 0 6px 22px rgba(5, 109, 218, .30);
  text-transform: uppercase;
}

/* The source switches to a separate mobile interface instead of squeezing
   desktop columns. BetLab keeps its data-rich mobile cards, with source
   colors, dimensions and controls. */
@media (max-width: 1300px) and (min-width: 901px) {
  .content[data-sport-page] .sport-shell {
    grid-template-columns: 230px minmax(0, 1fr) 260px;
    gap: 12px;
  }

  .content[data-sport-page] .league-row-info {
    min-width: 155px;
  }

  .content[data-sport-page] .sport-betslip {
    grid-column: auto;
  }

  .content[data-sport-page] .league-row-odds--line,
  .content[data-sport-page] .league-row-odds--live,
  .content[data-sport-page] .league-table-cols-head--line,
  .content[data-sport-page] .league-table-cols-head--live {
    width: min(64%, 440px);
    max-width: 440px;
    grid-template-columns: repeat(3, minmax(34px, 1fr)) repeat(4, minmax(36px, 1fr)) minmax(32px, .75fr) 22px;
  }
}

@media (max-width: 1050px) and (min-width: 901px) {
  .content[data-sport-page] .sport-shell {
    grid-template-columns: minmax(0, 1fr) 260px;
  }

  .content[data-sport-page] .sport-sidebar {
    display: none;
  }

  .content[data-sport-page] .sport-betslip {
    display: block;
    grid-column: auto;
  }

  .content[data-sport-page] .sport-categories.swiper {
    display: flex !important;
    border: 0;
    border-radius: 8px;
    background: #141b2e;
  }

  .content[data-sport-page] .sport-cat.is-active {
    background: linear-gradient(103deg, #108de7 -30%, #0855c4);
    color: #fff;
  }
}

@media (max-width: 900px) {
  .content[data-sport-page="line"],
  .content[data-sport-page="live"] {
    padding-top: 0;
  }

  .content[data-sport-page] .sport-shell {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .content[data-sport-page] .sport-sidebar {
    position: static;
    order: 1;
    width: 100%;
    max-height: none;
    overflow: visible;
    border-radius: 0;
    background: transparent;
  }

  .content[data-sport-page] .sport-main {
    order: 2;
    width: 100%;
  }

  .content[data-sport-page] .sport-sidebar > .sport-panel {
    padding: 0;
  }

  .content[data-sport-page] .sport-sidebar > .sport-panel:first-child,
  .content[data-sport-page] .sport-sidebar .topleagues-panel {
    display: none;
  }

  .content[data-sport-page] .sport-panel:has(.sportcats-sidebar) {
    display: block !important;
  }

  .content[data-sport-page] .sportcats-sidebar {
    display: block !important;
    padding: 0;
  }

  .content[data-sport-page] .sportcats-sidebar .line-topbar {
    display: block;
    margin: 0 0 10px;
  }

  .content[data-sport-page] .line-topbar__bar {
    background: linear-gradient(103deg, #108de7 -30%, #0855c4);
  }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs {
    display: flex !important;
    gap: 10px !important;
    padding: 0 2px 5px;
  }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab {
    flex-direction: column !important;
    width: 64px;
    min-width: 64px;
    min-height: 76px;
    justify-content: center;
    gap: 5px;
    padding: 7px 4px;
    border: 1px solid #1f2841;
    border-radius: 15px;
    background: #141b2e;
  }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab:hover,
  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active {
    border-color: #0854c3;
    background: linear-gradient(to bottom right, #0095ff, #0855c4) !important;
    box-shadow: 0 6px 22px rgba(5, 109, 218, .30) !important;
  }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab__ico,
  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active .sport-tab__ico {
    width: 32px;
    height: 32px;
  }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab__name {
    width: 55px;
    color: #7388b6;
    font-size: 10px;
    text-align: center;
  }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active .sport-tab__name {
    color: #fff;
  }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab__badge,
  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active .sport-tab__badge {
    right: 3px;
    top: 4px;
    transform: none;
    min-width: 18px;
    height: 18px;
    border-radius: 9px;
    background: #192137;
    color: #b1d1ff;
    font-size: 9px;
  }

  .content[data-sport-page] .search-mobile-only {
    padding-bottom: 10px;
  }

  .content[data-sport-page] .line-mobile-search,
  .content[data-sport-page] .live-mobile-search {
    border: 1px solid #252f4b;
    border-radius: 10px;
    background: #141b2e;
  }

  .content[data-sport-page] .side-quickfilter--mob {
    padding: 8px 0 0;
  }

  .content[data-sport-page] .side-quickfilter--mob .side-qf {
    background: #192137;
  }

  .content[data-sport-page] .pop-events-section {
    border-radius: 10px;
  }

  .content[data-sport-page] .league-table-block {
    border-radius: 10px;
  }

  .content[data-sport-page] .league-table-head,
  .content[data-sport-page="line"] .league-table-head,
  .content[data-sport-page="live"] .league-table-head {
    min-height: 42px;
    padding: 8px 12px;
  }

  .content[data-sport-page] .league-table-row,
  .content[data-sport-page] .league-table-row.lh-card {
    display: block;
    flex-direction: initial;
    margin: 10px;
    padding: 10px;
    border: 0;
    border-radius: 12px;
    background: #fff !important;
    color: #090f1e;
  }

  .content[data-sport-page] .league-table-row + .league-table-row {
    border-top: 0;
  }

  .content[data-sport-page] .league-table-row:hover {
    background: #fff;
    color: #090f1e;
  }

  .content[data-sport-page] .lh-mobile .lh-head {
    color: #6c7da3;
  }

  .content[data-sport-page] .lh-mobile .lh-team__name,
  .content[data-sport-page] .lh-mobile .lh-score,
  .content[data-sport-page] .lh-mobile .lh-kick__time {
    color: #090f1e;
  }

  .content[data-sport-page] .lh-board .lh-team .tcrest {
    background: #edf2ff;
  }

  .content[data-sport-page] .league-row-odds--line,
  .content[data-sport-page] .league-row-odds--live {
    display: flex;
    width: 100%;
    max-width: none;
    margin-top: 9px;
    gap: 8px;
  }

  .content[data-sport-page] .league-row-odds--line > .tbl-odd,
  .content[data-sport-page] .league-row-odds--live > .tbl-odd {
    min-height: 40px;
    border: 0;
    border-radius: 10px;
    background: rgba(108, 125, 163, .20);
    color: #090f1e;
  }

  .content[data-sport-page] .league-row-odds .tbl-fav {
    flex: 0 0 40px;
    border: 0;
    border-radius: 10px;
    background: rgba(108, 125, 163, .12);
  }
}

@media (max-width: 600px) {
  .content[data-sport-page] .pop-events-slider {
    padding: 8px 8px 0;
  }

  .content[data-sport-page] .league-table-row,
  .content[data-sport-page] .league-table-row.lh-card {
    margin: 8px;
    padding: 9px 10px;
  }
}

/* MobileLive / PreLeague card port. The class structure follows the source
   components: match-header, top-live-match-info, match-teams, match-details. */
@media (max-width: 900px) {
  .content[data-sport-page] .lh-mobile.live-event-main {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    padding: 0 0 8px;
    border-radius: 12px;
    background: #fff;
    color: #090f1e;
  }

  .content[data-sport-page] .live-event-main .match-header {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    min-height: 24px;
    box-sizing: content-box;
    margin: 0 0 4px;
    padding: 6px 5px 3px;
  }

  .content[data-sport-page] .live-event-main .top-live-match-score {
    margin-right: 2px;
    color: #090f1e;
    font-size: 20px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .3px;
    font-variant-numeric: tabular-nums;
  }

  .content[data-sport-page] .live-event-main .match-score-period,
  .content[data-sport-page] .mobile-match-date {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    box-sizing: border-box;
    padding: 3px 7px;
    border: .5px solid rgba(108, 125, 163, .4);
    border-radius: 7px;
    color: #6c7da3;
    font-size: 11px;
    line-height: 1;
  }

  .content[data-sport-page] .mobile-match-date {
    color: #090f1e;
    font-weight: 700;
  }

  .content[data-sport-page] .mobile-market-count {
    margin-left: auto;
    color: #096dff;
    font-size: 11px;
    font-weight: 700;
  }

  .content[data-sport-page] .mobile-live-mark {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-left: auto;
    color: #e9240f;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .05em;
  }

  .content[data-sport-page] .mobile-live-mark i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #e9240f;
    box-shadow: 0 0 6px rgba(233, 36, 15, .55);
    animation: bl-live-pulse 1.4s ease-in-out infinite;
  }

  .content[data-sport-page] .live-event-main .top-live-match-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 42px;
    box-sizing: border-box;
    padding: 0 5px;
  }

  .content[data-sport-page] .mobile-team-avatars {
    position: relative;
    display: flex;
    flex: 0 0 51px;
    width: 51px;
    height: 32px;
    margin-right: 8px;
  }

  .content[data-sport-page] .mobile-team-avatars .tcrest {
    position: absolute;
    top: 0;
    width: 30px;
    height: 30px;
    box-sizing: border-box;
    border: 2px solid #0960cb;
    border-radius: 50%;
    background: #edf2ff;
  }

  .content[data-sport-page] .mobile-team-avatars .tcrest:first-child {
    left: 0;
    z-index: 2;
  }

  .content[data-sport-page] .mobile-team-avatars .tcrest:last-child {
    left: 21px;
    z-index: 1;
  }

  .content[data-sport-page] .live-event-main .match-teams {
    position: relative;
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    margin-right: 8px;
    padding: 0 10px;
  }

  .content[data-sport-page] .live-event-main .match-teams::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    border-radius: 999px;
    background: linear-gradient(to bottom right, #0095ff, #0855c4);
    box-shadow: 0 6px 22px rgba(5, 109, 218, .30);
  }

  .content[data-sport-page] .live-event-main .match-team {
    display: flex;
    align-items: center;
    min-width: 0;
    color: #090f1e;
    font-size: 12px;
    font-weight: 600;
    line-height: 17px;
    white-space: nowrap;
  }

  .content[data-sport-page] .live-event-main .helper-line {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .content[data-sport-page] .mobile-match-time {
    flex: 0 0 auto;
    color: #6c7da3;
    font-size: 12px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
  }

  .content[data-sport-page] .mobile-live-center {
    display: grid;
    place-items: center;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: rgba(108, 125, 163, .16);
    color: #0960cb;
  }

  .content[data-sport-page] .mobile-live-center svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .content[data-sport-page] .live-event-main .match-details {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
    padding: 5px 5px 0;
    color: #6c7da3;
    font-size: 10px;
    line-height: 1.2;
  }

  .content[data-sport-page] .live-event-main .match-details span:first-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .content[data-sport-page] .live-event-main .match-details span:last-child {
    flex: 0 0 auto;
    color: #096dff;
    font-weight: 700;
  }

  .content[data-sport-page] .live-event-main .lh-progress {
    height: 3px;
    margin: 7px 5px 0;
    background: rgba(108, 125, 163, .20);
  }

  .content[data-sport-page] .live-event-main .lh-progress__fill {
    background: linear-gradient(90deg, #0095ff, #0855c4);
  }

  .content[data-sport-page] .live-event-main .lh-mstat {
    margin: 7px 5px 0;
    padding-top: 6px;
    border-top: 1px solid rgba(108, 125, 163, .16);
  }

  .content[data-sport-page] .live-event-main .lh-mstat__poss,
  .content[data-sport-page] .live-event-main .lh-mstat__tags {
    color: #6c7da3;
  }

  .content[data-sport-page] .live-event-main .lh-mstat__bar {
    background: #b8c5db;
  }

  .content[data-sport-page] .live-event-main .lh-mstat__fill {
    background: linear-gradient(90deg, #0095ff, #0855c4);
  }
}

/* Final mobile navigation lock: source uses a 55px icon tile with the sport
   name below it, not one large bordered BetLab button. */
@media (max-width: 900px) {
  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs {
    gap: 10px !important;
    padding: 0 15px 5px;
  }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab,
  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab:hover,
  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active {
    display: flex;
    flex: 0 0 55px;
    flex-direction: column;
    justify-content: flex-start;
    gap: 5px;
    width: 55px;
    min-width: 55px;
    min-height: 71px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none !important;
  }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab__ico,
  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active .sport-tab__ico {
    display: grid;
    place-items: center;
    width: 55px;
    height: 55px;
    box-sizing: border-box;
    border: 1px solid #1f2841;
    border-radius: 15px;
    background: transparent;
    color: #fff;
    font-size: 28px;
    transition: background-color .3s ease, border-color .3s ease;
  }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab__ico > .bl-sport-ico {
    width: 27px;
    height: 27px;
  }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active .sport-tab__ico {
    border-color: #0854c3;
    background: linear-gradient(to bottom right, #0095ff, #0855c4);
    box-shadow: 0 6px 22px rgba(5, 109, 218, .3);
  }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab__name,
  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active .sport-tab__name {
    width: 55px;
    color: #7388b6;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.1;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active .sport-tab__name { color: #fff; }

  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab__badge,
  .content[data-sport-page] .sportcats-sidebar ul.sport-tabs .sport-tab.is-active .sport-tab__badge {
    top: 3px;
    right: 3px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 9px;
    background: #192137;
    color: #b1d1ff;
    font-size: 9px;
  }

  .content[data-sport-page] .events-table-section > .line-section-head,
  .content[data-sport-page] .events-table-section > h2,
  .content[data-sport-page] .events-table-section > .live-odds-legend {
    display: none;
  }

  .content[data-sport-page] .mobile-sports-match .mobile-clock {
    display: grid;
    place-items: center;
    flex: 0 0 15px;
    width: 15px;
    height: 15px;
    margin-left: auto;
    color: #6c7da3;
  }

  .content[data-sport-page] .mobile-sports-match .mobile-clock svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.4;
  }

  .content[data-sport-page] .mobile-sports-match .mobile-match-time { margin-left: 4px; }
}