/* Wrapper для LivePage */
.live-page-wrapper {
  display: flex;
  flex-direction: column;
  /* min-height убран - не нужен лишний скролл когда мало контента */
}

/* Контент не растягивается - избегаем лишний скролл */
.live-page-wrapper .lp-page {
  flex: 0 0 auto;
}

.lp-bets-page {
  color: var(--text-secondary);
  font-family: 'Proxima Nova', sans-serif;
  padding: 10px;
}

/* ========== GOAL ANIMATION - Clean Glow Effect ========== */
/* Row with goal animation - left border glow */
.live-odds-row.goal-row-animation {
  position: relative;
  animation: goal-row-pulse 3s ease-out forwards;
}

.live-odds-row.goal-row-animation::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, #00ff88, #00cc6a);
  box-shadow: 0 0 12px #00ff88, 0 0 24px rgba(0, 255, 136, 0.5);
  animation: goal-border-glow 3s ease-out forwards;
  z-index: 10;
}

/* Subtle row highlight */
@keyframes goal-row-pulse {
  0% {
    background: rgba(0, 255, 136, 0.15);
  }
  30% {
    background: rgba(0, 255, 136, 0.08);
  }
  100% {
    background: transparent;
  }
}

@keyframes goal-border-glow {
  0% {
    opacity: 1;
    box-shadow: 0 0 12px #00ff88, 0 0 24px rgba(0, 255, 136, 0.6);
  }
  70% {
    opacity: 1;
    box-shadow: 0 0 8px #00ff88, 0 0 16px rgba(0, 255, 136, 0.4);
  }
  100% {
    opacity: 0;
    box-shadow: none;
  }
}

/* Goal indicator next to team name */
.goal-indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 4px;
  vertical-align: middle;
  line-height: 1;
  animation: goal-indicator-pop 3s ease-out forwards;
}

.goal-indicator-ball {
  font-size: 11px;
  line-height: 1;
  display: inline-block;
  animation: goal-ball-pulse 0.6s ease-in-out 3;
}

@keyframes goal-indicator-pop {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  15% {
    opacity: 1;
    transform: scale(1.3);
  }
  30% {
    transform: scale(1);
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: scale(0.8);
  }
}

@keyframes goal-ball-pulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.2);
  }
}

/* Hockey variant - blue glow */
.live-odds-row.goal-row-animation.hockey::before {
  background: linear-gradient(180deg, #00b4ff, #0088cc);
  box-shadow: 0 0 12px #00b4ff, 0 0 24px rgba(0, 180, 255, 0.5);
  animation: goal-border-glow-hockey 3s ease-out forwards;
}

.live-odds-row.goal-row-animation.hockey {
  animation: goal-row-pulse-hockey 3s ease-out forwards;
}

@keyframes goal-row-pulse-hockey {
  0% { background: rgba(0, 180, 255, 0.15); }
  30% { background: rgba(0, 180, 255, 0.08); }
  100% { background: transparent; }
}

@keyframes goal-border-glow-hockey {
  0% { opacity: 1; box-shadow: 0 0 12px #00b4ff, 0 0 24px rgba(0, 180, 255, 0.6); }
  70% { opacity: 1; }
  100% { opacity: 0; box-shadow: none; }
}

/* Basketball variant - orange glow */
.live-odds-row.goal-row-animation.basketball::before {
  background: linear-gradient(180deg, #ff8c00, #ff6600);
  box-shadow: 0 0 12px #ff8c00, 0 0 24px rgba(255, 140, 0, 0.5);
  animation: goal-border-glow-basketball 3s ease-out forwards;
}

.live-odds-row.goal-row-animation.basketball {
  animation: goal-row-pulse-basketball 3s ease-out forwards;
}

@keyframes goal-row-pulse-basketball {
  0% { background: rgba(255, 140, 0, 0.15); }
  30% { background: rgba(255, 140, 0, 0.08); }
  100% { background: transparent; }
}

@keyframes goal-border-glow-basketball {
  0% { opacity: 1; box-shadow: 0 0 12px #ff8c00, 0 0 24px rgba(255, 140, 0, 0.6); }
  70% { opacity: 1; }
  100% { opacity: 0; box-shadow: none; }
}

/* Tennis variant - lime/yellow glow */
.live-odds-row.goal-row-animation.tennis::before {
  background: linear-gradient(180deg, #c4ff00, #a0d800);
  box-shadow: 0 0 12px #c4ff00, 0 0 24px rgba(196, 255, 0, 0.5);
}
.live-odds-row.goal-row-animation.tennis {
  animation: goal-row-pulse-tennis 3s ease-out forwards;
}
@keyframes goal-row-pulse-tennis {
  0% { background: rgba(196, 255, 0, 0.15); }
  30% { background: rgba(196, 255, 0, 0.08); }
  100% { background: transparent; }
}

/* Volleyball variant - blue glow */
.live-odds-row.goal-row-animation.volleyball::before {
  background: linear-gradient(180deg, #ffcc00, #ff9900);
  box-shadow: 0 0 12px #ffcc00, 0 0 24px rgba(255, 204, 0, 0.5);
}
.live-odds-row.goal-row-animation.volleyball {
  animation: goal-row-pulse-volleyball 3s ease-out forwards;
}
@keyframes goal-row-pulse-volleyball {
  0% { background: rgba(255, 204, 0, 0.15); }
  30% { background: rgba(255, 204, 0, 0.08); }
  100% { background: transparent; }
}

/* American Football variant - brown glow */
.live-odds-row.goal-row-animation.football::before {
  background: linear-gradient(180deg, #8b4513, #a0522d);
  box-shadow: 0 0 12px #8b4513, 0 0 24px rgba(139, 69, 19, 0.5);
}
.live-odds-row.goal-row-animation.football {
  animation: goal-row-pulse-football 3s ease-out forwards;
}
@keyframes goal-row-pulse-football {
  0% { background: rgba(139, 69, 19, 0.15); }
  30% { background: rgba(139, 69, 19, 0.08); }
  100% { background: transparent; }
}

/* Baseball variant - red glow */
.live-odds-row.goal-row-animation.baseball::before {
  background: linear-gradient(180deg, #cc0000, #990000);
  box-shadow: 0 0 12px #cc0000, 0 0 24px rgba(204, 0, 0, 0.5);
}
.live-odds-row.goal-row-animation.baseball {
  animation: goal-row-pulse-baseball 3s ease-out forwards;
}
@keyframes goal-row-pulse-baseball {
  0% { background: rgba(204, 0, 0, 0.15); }
  30% { background: rgba(204, 0, 0, 0.08); }
  100% { background: transparent; }
}

/* ========== SCORE DROP ANIMATION ========== */
/* Score drops from above with bounce effect */
@keyframes score-drop {
  0% {
    transform: translateY(-25px) scale(1.3);
    opacity: 0;
  }
  50% {
    transform: translateY(4px) scale(0.9);
    opacity: 1;
  }
  70% {
    transform: translateY(-2px) scale(1.05);
  }
  85% {
    transform: translateY(1px) scale(0.98);
  }
  100% {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
}

/* Score drop animation class - used for all sports */
.score-drop-flash {
  display: inline-block;
  animation: score-drop 0.5s ease-out forwards;
}

/* Fixture needs position relative for overlay */
.lp-fixture {
  position: relative;
  overflow: hidden;
}

.lp-country-flag {
  border-radius: 2px;
  height: 12px;
  object-fit: contain;
  width: 16px;
  margin-right: 3px;
  margin-left: 10px;
}

.period-subscore {
  font-size: 10px;
}

.lp-header {
  display: flex;
  flex-direction: column;
  padding: 10px 15px;
  position: sticky;
  top: 36px;
  z-index: 999;
  background-color: var(--bg-primary);
  transition: padding 0.2s ease, gap 0.2s ease;
  will-change: transform;
  transform: translateZ(0);
  border-bottom: 1px solid var(--bg-elevated);
}

.morebets-load-more-button {
  border: none;
  border-radius: 4px;
  font-family: Proxima Nova Cond,sans-serif;
  background-color: var(--accent-blue);
  font-size: 14px;
  color: var(--text-primary);
  text-shadow: 0 0 1px #000;  cursor: pointer;
  font-weight: 700;
  padding: 5px 20px;
  transition: background-color .3s ease;
}

.lp-header * {
  transition: font-size 0.2s ease, color 0.2s ease, margin 0.2s ease;
}


.lp-header--compact {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 14px;
}

.lp-header--compact img {
  width: 16px !important;
  height: 16px !important;
}

.lp-header--compact .lp-league-info {
  flex-direction: row;
  align-items: end;
  gap: 6px;
}

.lp-header--compact .lp-sport-name {
  font-size: 14px;
}

.lp-header--compact .lp-league-name {
  font-size: 14px;
  color: var(--text-tertiary);
}

.lp-fixture-time {
  text-align: start;
  display: flex;
  align-items: center;
  gap: 6px;
}

.lp-fixture-star {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: transform 0.15s ease;
  margin-right: 7px;
}

.lp-fixture-star:hover {
  transform: scale(1.15);
}

.live-period-info {
  display: flex;
  gap: 5px;
  font-family: Proxima Nova,sans-serif;
  font-size: 11px;
  font-weight: 500;
  line-height: 12px;
}

.live-minute {
  color: var(--text-primary);
  font-weight: 600;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums; /* Equal-width digits - prevents jumping */
  display: inline-block;
  text-align: center;
}

.live-period {
  color: var(--text-primary);
  font-weight: 600;
}

.lp-page {
  color: var(--text-secondary);
  font-family: 'Proxima Nova', sans-serif;
  /* min-height убран - контент не должен лезть под меню */
  overflow-anchor: auto; /* Reduce scroll jumps when content changes */
  position: relative;
  z-index: 1; /* Контент всегда ПОД fixed табами */
  /* Safari iOS - изолируем от меню */
  isolation: isolate;
  padding-bottom: 10px; /* Небольшой отступ перед футером */
}

.lp-bets-header {
  padding-bottom: 12px;
}

.lp-bets-header h2 {
  font-size: 22px;
  margin: 0;
}

.hdp {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 11px;
  font-weight: 600;
  color: var(--accent-blue);
}

.lp-fixture .value {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-secondary);
}

/* ========== FIXTURE CARD - subtle gradient dark to light ========== */
.lp-fixture {
  background: var(--gradient-fixture);
  border-radius: 0;
  margin: 0 0 10px 0;
  overflow: hidden;
}

/* Remove margin from fixture that is followed by a league header */
.lp-fixture:has(+ .lp-league-header) {
  margin-bottom: 0;
}

/* Also remove margin from the very last fixture */
.lp-fixture:last-child {
  margin-bottom: 0;
}


/* ========== ODDS HEADER - Sport colors ========== */
.live-odds-header {
  display: grid;
  grid-gap: 0;
  gap: 0;
  align-items: center;
  color: var(--white-70);
  font-family: 'Proxima Nova', sans-serif;
  font-size: 9px;
  line-height: 1;
  text-align: center;
  padding: 8px 0 8px 12px;
  /* Default */
  background: var(--gradient-odds-header);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  /* Muted bottom line */
  border-bottom: 1px solid var(--white-15);
}

/* Sport-specific gradients - defined in sportColors.css */

/* Grid layouts */
.live-odds-header.layout-3 {
  grid-template-columns: 3fr 1fr 1fr 1fr;
}

.live-odds-header.layout-2 {
  grid-template-columns: 3fr 1fr 1fr;
}

.live-odds-header.layout-1 {
  grid-template-columns: 1fr 1fr;
}

/* ========== ODDS ROWS - subtle gradient ========== */
.live-odds-row {
  display: grid;
  grid-gap: 0;
  gap: 0;
  min-height: 40px;
  align-items: center;
  padding: 0 0 0 10px;
  background: var(--gradient-fixture);
  /* Thin separator line */
  border-bottom: 1px solid var(--black-25);
}

/* Last row before footer - no bottom border */
.live-odds-row:last-of-type {
  border-bottom: none;
}

.live-odds-row.layout-3 {
  grid-template-columns: 3fr 1fr 1fr 1fr;
}

.live-odds-row.layout-2 {
  grid-template-columns: 3fr 1fr 1fr;
}

.live-odds-row.layout-1 {
  grid-template-columns: 1fr 1fr;
}

/* ========== TEAM NAME ========== */
.live-team-name {
  flex-grow: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  color: var(--text-primary);
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  font-weight: 600;
}

/* Team cell wrapper */
.live-team {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 8px;
}

/* ========== FIXTURE FOOTER - subtle gradient ========== */
.lp-fixture-footer {
  color: var(--text-secondary);
  display: flex;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 11px;
  justify-content: space-between;
  align-items: center;
  padding: 6px 14px;
  background: var(--gradient-fixture);
}

.lp-more-bets {
  font-family: Proxima Nova Cond,sans-serif;
  background-color: var(--accent-blue)2e;
  border: 0 solid var(--accent-blue)26;
  border-radius: 2px;
  color: var(--link-blue);
  font-weight: 500;
  padding: 1px 7px;
  width: fit-content;
  cursor: pointer;
}

.lp-more-bets:hover {
  color: var(--link-blue-hover);
}

.lp-skeleton-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.lp-skeleton .lp-shimmer {
  background: linear-gradient(90deg, var(--shimmer-base) 25%, var(--shimmer-highlight) 50%, var(--shimmer-base) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.2s infinite linear;
  border-radius: 6px;
}

.lp-shimmer-header {
  height: 16px;
}

.lp-shimmer-team {
  height: 18px;
  width: 100%;
}

.lp-shimmer-button {
  height: 32px;
}

.lp-shimmer-time {
  height: 14px;
  width: 100px;
}

.lp-shimmer-more {
  height: 14px;
  width: 60px;
}

@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}



.lp-league-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.lp-sport-name {
  font-weight: 900;
  font-style: italic;
  color: var(--text-primary);
  text-transform: uppercase;
  font-size: 18px;
  line-height: 16px;
}

.lp-league-name {
  font-size: 14px;
  font-family: 'Proxima Nova Cond', sans-serif;
  color: var(--text-tertiary);
}

.odds-title {
  color: var(--text-secondary);
  font-family: Proxima Nova,sans-serif;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
}



.lp-no-odds-grid-inner {
  display: contents; /* Используется для сохранения структуры grid, но без обёртки */
}

.lp-no-odds-teams {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
}

.lp-no-odds-teams .live-team-name {
  text-align: left;
  font-weight: 500;
  color: var(--text-primary);
  font-size: 15px;
}

.lp-no-odds-button {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.lp-no-odds-button .lp-bet-button {
  width: 100%;
  height: 64px;
  font-size: 16px;
  font-weight: 600;
  background-color: transparent;
  border: 2px solid var(--accent-blue);
  border-radius: 8px;
  color: var(--text-primary);
}


.lp-no-odds-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 8px;
}

.lp-fixture-footer-line {
  flex-grow: 1;
  height: 1px;
  background-color: var(--bg-quaternary);
  margin-right: 12px;
}

.lp-footer-line-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding-top: 6px;
}

.lp-no-odds-grid {
  grid-gap: 8px;
  align-items: center;
  display: grid;
  gap: 8px;
  margin: 15px 0;
  grid-template-columns: 2fr 1fr;
}

.lp-no-odds-grid .live-team-names {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 25px;
}

.lp-no-odds-grid .lp-big-button {
  background-color: var(--bg-tertiary);
  border: 1px solid var(--bg-quaternary);
  border-radius: 4px;
  color: var(--text-primary);
  cursor: pointer;
  font-size: 1rem;
  height: 100%;
  text-align: center;
}

.lp-no-odds-grid .lp-big-button:hover {
  background-color: var(--bg-quaternary);
}

/* ========== BET BUTTONS - Flat design ========== */
.lp-bet-button {
  align-items: center;
  font-family: 'Proxima Nova', sans-serif;
  background: transparent;
  border: none;
  border-radius: 0;
  color: var(--text-secondary);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  font-size: 14px;
  font-weight: 700;
  height: 38px;
  line-height: 13px;
  justify-content: center;
  min-height: 38px;
  padding: 0;
  text-align: center;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  transition: background 0.15s ease;
}

/* Hover - desktop only */
@media (min-width: 1024px) {
  .lp-bet-button:hover {
    background: var(--hover-bg);
  }

  .lp-bet-button.active:hover {
    background: var(--active-bg);
  }
}

.lp-bet-button.active {
  background: var(--active-bg);
  border: none;
  min-height: 38px;
  height: 38px;
}

.lp-bet-button.active .hdp,
.lp-bet-button.active .value {
  color: var(--text-secondary);
}

/* Handicap label - blue */
.hdp {
  color: var(--accent-blue-hover);
  font-size: 11px;
  font-weight: 600;
  font-family: 'Proxima Nova', sans-serif;
}

/* Odds value - white */
.lp-fixture .value {
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--white-95);
}

.lp-ripple {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(50% + 6px);   /* на 3px в каждую сторону */
  height: calc(50% + 6px);  /* по вертикали тоже чуть больше */
  background: var(--white-20);
  opacity: 0.9;
  border-radius: 4px;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(0);
  animation: ripple 300ms ease-out;
  z-index: 1000;
}

@keyframes ripple {
  0% {
    transform: translate(-50%, -50%) scale(0);
    opacity: 0.4;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.3);
    opacity: 0;
  }
}

.currently-suspended {
  display: flex;
  align-items: end;
  font-weight: 500;
  color: var(--text-tertiary);
  font-size: 14px; /* подгони под стиль */
  margin-top: 4px; /* если надо чуть отступить от кнопок */
}

.lock-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 6px;
}

.lock-icon svg {
  width: 16px;
  height: 16px;
  fill: var(--text-tertiary);
}

.lock-text {
  display: flex;
  align-items: center;
}

/* ============================================
   FLASH АНИМАЦИИ - Подсветка коэффициента
   ============================================ */

/* Анимация роста (зеленый) - на внутреннем .value элементе */
.lp-bet-button .value.flash-up,
.lp-bet-button.active .value.flash-up {
  animation: glowGreen 1.5s ease-out forwards;
}

/* Анимация падения (красный) - на внутреннем .value элементе */
.lp-bet-button .value.flash-down,
.lp-bet-button.active .value.flash-down {
  animation: glowRed 1.5s ease-out forwards;
}

/* Подсветка зеленым (рост) */
@keyframes glowGreen {
  0%, 50% {
    color: var(--accent-green);
    font-weight: 700;
  }
  100% {
    color: var(--white-95);
    font-weight: 700;
  }
}

/* Подсветка красным (падение) */
@keyframes glowRed {
  0%, 50% {
    color: var(--accent-red);
    font-weight: 700;
  }
  100% {
    color: var(--white-95);
    font-weight: 700;
  }
}


.live-team-icon-and-name {
  width: 100%;
  align-items: center;
  display: flex;
  position: relative;
  gap: 10px;
  min-width: 0;
  overflow: hidden;
}
 
.live-icon-reversed-home::after {
  bottom: -19px;
  color: #f09b51;
  font-family: sans-serif;
  content: "@";
  font-size: 12px;
  font-weight: bold;
  left: 3px;
  pointer-events: none;
  position: absolute;
}

.live-team-icon {
  width: 18px;
  min-width: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 1px;
}

.live-team-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain;
  background-size: contain;
  display: block;
}

.lp-placeholder-team {
  align-items: center;
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  grid-gap: 5px;
  justify-content: space-between;
  min-width: 160px;
}

.lp-placeholder-main {
  font-weight: bold;
  color: var(--text-secondary);
}

.lp-placeholder-sub {
  background-color: var(--accent-blue)21;
  border-radius: 10px;
  color: var(--accent-blue);
  font-size: 10px;
  font-weight: 700;
  padding: 0 7px;
  width: fit-content;
}

/* Duplicate removed - see lines 582-590 */

/* League group container for proper sticky behavior */
.lp-league-group {
  /* Container for each league - allows sticky headers to push each other */
}

.lp-league-header {
  color: var(--text-secondary);
  font-size: 12px;
  text-decoration: none;
  font-weight: 600;
  font-family: proxima nova;
  padding: 5px 10px;
  border-radius: 2px;
  /* height: 30px; */
  display: flex;
  align-items: center;
  gap: 10px;
  position: sticky;
  z-index: 10;
  background: var(--bg-primary);
  margin-left: 0;
  text-transform: uppercase;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  overflow: hidden;
  min-width: 0;
}

.lp-league-header > img {
  position: relative;
  /* top: 1px; */
}

.lp-league-header-text {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 1 1;
}

.lp-league-chevron {
  margin-left: auto;
  transition: transform 0.2s ease;
  opacity: 0.6;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
}

.lp-league-chevron.collapsed {
  transform: rotate(-90deg);
}

.lp-league-header.lp-league-collapsed {
  border-bottom: 1px solid var(--separator);
}

.lp-collapse-all-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7px 10px 3px;
}

.lp-collapse-all-sport {
  font-family: 'Proxima Nova', sans-serif;
  font-style: italic;
  font-weight: 700;
  font-size: 20px;
  color: var(--text-primary);
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.lp-collapse-all-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--white-45);
  font-size: 12px;
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
}

.lp-collapse-all-upcoming {
  color: var(--white-45);
  font-size: 12px;
  -webkit-user-select: none;
          user-select: none;
}

.lp-collapse-all-btn:active {
  opacity: 0.7;
}

.lp-fav-sport-header {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px 2px;
  font-size: 11px;
  font-weight: 600;
  color: var(--white-45);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-style: italic;
}

/* LivePage specific top values для sticky league header */
/* На мобиле: header 37px + tabs ~60px = ~97px */
.live-page-wrapper .lp-league-header {
  top: 99px;
}

@media (min-width: 1024px) {
  .live-page-wrapper .lp-league-header {
    top: 62px;
  }
  .lp-league-header.lp-league-collapsed:hover {
    background: var(--hover-bg);
  }
}


.live-fixture-tag {
  background-color: var(--tag-blue-bg);
  border-radius: 2px;
  color: var(--text-primary);
  font-weight: bold;
  font-size: 11px;
  padding: 0 4px;
  text-transform: uppercase;
  border: 1px solid var(--tag-blue-border);
  margin: 0 8px;
  margin-left: 4px;
}

.live-fixture-tag--gameorder {
  background-color: var(--accent-red-muted);
  border-radius: 2px;
  border: 1px solid var(--accent-red);
  color: var(--text-primary);
  font-size: 11px;
  font-weight: bold;
  padding: 0 4px;
  text-transform: uppercase;
  margin: 0 8px;
  margin-left: 4px;
}

.live-fixture-clock {
  background-color: var(--clock-bg);
  border: 1px solid var(--clock-bg);
  border-radius: 2px 0 0 2px;
  border-right: none;
  margin-left: 4px;
}
.live-elapsed, .live-fixture-clock {
  color: var(--text-primary);
  font-size: 11px;
  font-weight: 700;
  padding: 0 5px;
}

.live-elapsed {
  background-color: var(--elapsed-bg);
  border: 1px solid var(--clock-bg);
  border-left: none;
  border-radius: 0 2px 2px 0;
  font-weight: 600;
  margin-right: 4px;
  padding-left: 7px;
}
.live-logo {
  background-color: var(--accent-red);
  border-radius: 2px;
  color: var(--text-primary);
  font-size: 10px;
  font-weight: bold;
  margin-right: 4px;
  padding: 1px 3px;
  line-height: 1;
  text-transform: capitalize;
  font-family: 'Proxima Nova', sans-serif;
  display: flex;
  align-items: center;
}

.finished-logo {
  background-color: var(--white-10);
  color: var(--text-primary);
  border-radius: 2px;
  font-size: 10px;
  font-weight: bold;
  margin-right: 4px;
  padding: 0 3px;
  text-transform: capitalize;
  font-family: 'Proxima Nova', sans-serif;
}

.LiveScore {
  align-items: center;
  border-radius: 4px;
  color: var(--score-color);
  display: flex;
  font-family: Proxima Nova,sans-serif;
  font-size: 14px;
  font-weight: 600;
  padding: 0 3px;
  justify-content: center;
  min-width: 15px;
}
/* Анимация смены счёта как на спортивном табло */
.score-digit-wrapper {
  display: inline-block;
  position: relative;
  overflow: hidden;
  min-width: 1ch;
  vertical-align: top;
  height: 1.2em;
}

.score-digit-current {
  display: inline-block;
  transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.score-digit-new {
  display: inline-block;
  position: absolute;
  left: 0;
  top: -100%;
  animation: scoreSlideDown 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

.score-animating .score-digit-current {
  transform: translateY(100%);
  opacity: 0;
}

.red-card-count {
  display: inline-block;
  padding: 1px 4px;
  border-radius: 2px;
  font-family: Proxima Nova Cond,sans-serif;
  font-size: 10px;
  font-weight: bold;
  color: var(--text-primary);
  background: var(--accent-red);
  margin-left: 10px;
}
.live-score-wrapper {
  display: flex;
  align-items: center;
  gap: 4px;
}

.live-score-wrapper.split-layout {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  flex: 1 1;
  min-width: 0;
  overflow: hidden;
}

.team-name-left {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1 1;
  min-width: 0;
  overflow: hidden;
}

.score-right {
  flex-shrink: 0;
  font-weight: bold;
  display: flex;
  align-items: center;
  gap: 4px;
}

/* VAR indicator - shows when goal is under VAR review */
.var-indicator {
  font-size: 9px;
  font-weight: 700;
  color: var(--text-on-accent);
  background: linear-gradient(135deg, #0066cc 0%, #004499 100%);
  padding: 2px 4px;
  border-radius: 3px;
  letter-spacing: 0.5px;
  animation: var-pulse 1.5s ease-in-out infinite;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 3px rgba(0, 102, 204, 0.4);
}

@keyframes var-pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.7;
    transform: scale(0.95);
  }
}

/* PEN indicator - shows when penalty is being taken */
.pen-indicator {
  font-size: 9px;
  font-weight: 700;
  color: #1C1C1E;
  background: linear-gradient(135deg, #FFB800 0%, #FF8C00 100%);
  padding: 2px 4px;
  border-radius: 3px;
  letter-spacing: 0.5px;
  animation: pen-pulse 1s ease-in-out infinite;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.3);
  box-shadow: 0 1px 3px rgba(255, 140, 0, 0.5);
}

@keyframes pen-pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.85;
    transform: scale(1.05);
  }
}

/* Score chance indicator - shows when team has a dangerous moment */
.score-chance-indicator {
  display: flex;
  align-items: center;
  animation: score-chance-pulse 0.8s ease-in-out infinite;
}

.score-chance-indicator svg {
  filter: drop-shadow(0 0 2px rgba(0, 180, 255, 0.5));
}

@keyframes score-chance-pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.7;
    transform: scale(1.15);
  }
}

.live-team-name-wrapper {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  flex: 1 1;
  overflow: hidden;
}

/* Two-line layout for Tennis/MMA with participant info */
.live-team-name-wrapper.has-participant-info {
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}

.live-team-name-wrapper.has-participant-info .live-team-name {
  line-height: 1.3;
  max-width: 100%;
  width: 100%;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.live-team-name-wrapper.has-participant-info .participant-info {
  margin-top: 0;
}

/* ====== Mobile Top Leagues horizontal scroll ====== */
.mobile-top-leagues {
  display: none;
}

@media (max-width: 1023px) {
  .mobile-top-leagues {
    display: block;
    padding: 8px 0;
    background-color: var(--bg-primary);
  }

  .mobile-top-leagues-scroll {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 0 5px;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .mobile-top-leagues-scroll::-webkit-scrollbar {
    display: none;
  }

  .mobile-top-league-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 50px;
    padding: 10px 12px 8px;
    border-radius: 12px;
    background: var(--gradient-top-league);
    text-decoration: none;
    flex-shrink: 0;
  }

  .mobile-top-league-card:active {
    opacity: 0.7;
  }

  .mobile-top-league-icon {
    width: 36px;
    height: 36px;
    object-fit: contain;
    margin-bottom: 6px;
  }

  .mobile-top-league-name {
    font-size: 11px;
    color: var(--text-secondary);
    white-space: nowrap;
    text-align: center;
    line-height: 1.2;
  }
}

/* ====== lp-tabs-wrapper - STICKY меню как было раньше ====== */
.lp-tabs-wrapper {
  position: sticky;
  top: 37px;
  z-index: 999;
  background-color: var(--bg-primary);
  border-top: 1px solid var(--separator);
  border-bottom: 1px solid var(--separator);
}

@media (min-width: 1024px) {
  .lp-tabs-wrapper {
    top: 0;
    border-top: none;
  }
}

/* ====== lp-tabs & lp-tab-button styles ====== */
.lp-tabs {
  background-color: var(--bg-primary);
  padding: 10px 0 3px;
  display: flex;
  overflow-x: auto;
  white-space: nowrap;
  gap: 5px;
}

.lp-tab-button {
  background: transparent;
  cursor: pointer;
  position: relative;
  transition: color .15s ease;
  align-items: center;
  background-color: transparent;
  border: 0;
  border-radius: 4px;
  color: var(--text-secondary);
  display: flex;
  flex-direction: column;
  font-family: Proxima Nova,sans-serif;
  font-size: 13px;
  font-weight: 500;
  gap: 3px;
  line-height: 15px;
  padding: 5px 7px;
  white-space: nowrap;
  /* Safari iOS */
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  user-select: none;
  -webkit-user-select: none;
}

.lp-tab-button.active {
  background: transparent none repeat 0 0 / auto auto padding-box border-box scroll;
  background: initial;
  color: var(--accent-blue);
}
.lp-tab-button.active:hover {
  background: transparent none repeat 0 0 / auto auto padding-box border-box scroll;
  background: initial;
  color: var(--accent-blue);
}



/* Icon wrapper for badge positioning */
.lp-tab-icon-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.lp-tab-icon {
  width: 26px;
  height: 26px;
  vertical-align: middle;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.lp-tab-icon svg {
  width: 100%;
  height: 100%;
  transition: fill .15s ease, color .15s ease; /* Плавная смена цвета иконки */
}

.lp-tab-label {
  font-weight: 500;
  pointer-events: none; /* Клики проходят на родительскую кнопку */
}

.lp-tab-icon {
  pointer-events: none; /* Клики проходят на родительскую кнопку */
}

.lp-tab-count {
  pointer-events: none; /* Клики проходят на родительскую кнопку */
}

.red-card-count {
  flex-shrink: 0;
  z-index: 2;
}
@keyframes scoreSlideDown {
  from {
    transform: translateY(0);
    opacity: 1;
  }
  to {
    transform: translateY(100%);
    opacity: 1;
  }
}

@media (min-width: 1024px) {
  .wrap-sportstab-header {
    top: 0;
  }
  .lp-tabs {
    top: 0;
    padding: 4px 0 3px;
    gap: 5px;
  }
  .lp-tab-button:hover {
    background: transparent none repeat 0 0 / auto auto padding-box border-box scroll;
    background: initial;
  }
  .lp-tab-button {
    flex-direction: column;
    gap: 1px;
    padding: 5px 7px;
  }
  .lp-tab-icon {
    height: 28px;
    width: 28px;
  }
  .lp-tab-count {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

/* ====== Бейдж количества матчей на табе  ====== */
.lp-tab-count {
  background-color: var(--accent-red);
  border-radius: 999px;
  color: var(--text-primary);
  font-size: 10px;
  font-weight: 700;
  min-width: 15px;
  min-height: 15px;
  padding: 1px;
  position: absolute;
  right: -8px;
  text-align: center;
  top: -4px;
  z-index: 2;
}

.lp-shimmer { padding: 8px 12px; }
.lp-shimmer-card {
  height: 72px;
  margin-bottom: 8px;
  border-radius: 8px;
  background: linear-gradient(90deg, var(--shimmer-base) 25%, var(--shimmer-highlight) 37%, var(--shimmer-base) 63%);
  background-size: 400% 100%;
  animation: lp-shimmer-anim 1.2s ease-in-out infinite;
  opacity: 0.9;
}
@keyframes lp-shimmer-anim {
  0% { background-position: 100% 0; }
  100% { background-position: 0 0; }
}

/* ===== Skeleton: matches real FixtureCard structure ===== */
.lp-skel-list { padding: 0; display: flex; flex-direction: column; }
.lp-skel-card {
  background: var(--gradient-fixture);
  border-radius: 5px;
  margin: 1px 3px 10px 3px;
  overflow: hidden;
}
.lp-skel-hdr {
  display: grid;
  grid-template-columns: 4fr 1fr 1fr 1fr;
  align-items: center;
  padding: 8px 0 8px 12px;
  background: var(--gradient-odds-header);
  border-bottom: 1px solid var(--white-15);
}
.lp-skel-hdr-left { display: flex; align-items: center; gap: 6px; }
.lp-skel-star { width: 16px; height: 16px; border-radius: 2px; }
.lp-skel-badge { height: 14px; width: 36px; border-radius: 2px; }
.lp-skel-col { height: 10px; width: 70%; margin: 0 auto; border-radius: 2px; }
.lp-skel-row {
  display: grid;
  grid-template-columns: 4fr 1fr 1fr 1fr;
  min-height: 40px;
  align-items: center;
  padding: 0 0 0 10px;
  border-bottom: 1px solid var(--black-25);
}
.lp-skel-row:last-child { border-bottom: none; }
.lp-skel-team { display: flex; align-items: center; gap: 6px; min-width: 0; overflow: hidden; }
.lp-skel-icon { width: 18px; height: 18px; border-radius: 2px; flex-shrink: 0; }
.lp-skel-name { height: 13px; border-radius: 3px; }
.lp-skel-btn { height: 38px; }
/* League header skeleton */
.lp-skel-league {
  height: 30px;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
}
.lp-skel-flag { width: 18px; height: 14px; border-radius: 2px; }
.lp-skel-league-name { height: 14px; border-radius: 3px; }
/* Sport tabs skeleton */
.lp-skel-tabs {
  display: flex;
  gap: 5px;
  padding: 3px 0;
  overflow: hidden;
}
.lp-skel-tab {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 5px 7px;
  flex-shrink: 0;
}
.lp-skel-tab-icon { width: 26px; height: 26px; border-radius: 6px; }
.lp-skel-tab-label { height: 11px; border-radius: 3px; }
/* Top leagues skeleton (mobile prematch) */
.lp-skel-top-leagues { display: none; }
@media (max-width: 1023px) {
  .lp-skel-top-leagues {
    display: flex;
    gap: 8px;
    padding: 8px 5px;
    overflow: hidden;
  }
  .lp-skel-top-lg {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 50px;
    padding: 10px 12px 8px;
    border-radius: 12px;
    background: var(--gradient-top-league);
    flex-shrink: 0;
  }
  .lp-skel-top-lg-icon { width: 36px; height: 36px; border-radius: 50%; margin-bottom: 6px; }
  .lp-skel-top-lg-name { width: 36px; height: 11px; border-radius: 3px; }
}
@media (max-width: 480px) {
  .lp-skel-hdr { padding: 6px 0 6px 10px; }
  .lp-skel-row { min-height: 36px; padding: 0 0 0 8px; }
  .lp-skel-btn { height: 34px; }
}
/* shimmer paint — subtle, close to card bg (#333338) */
.sk-shimmer {
  background: linear-gradient(90deg, var(--shimmer-base) 25%, var(--shimmer-highlight) 50%, var(--shimmer-base) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite linear;
}

/* No live events message */
.lp-no-fixtures {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 20px;
  text-align: center;
  /* min-height убран - футер прижимается через flex-grow */
  color: var(--text-tertiary);
  font-family: 'Proxima Nova', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
}

/* ========== NO LIVE EVENTS MESSAGE ========== */
.lp-no-events {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px 80px;
  text-align: center;
  color: var(--text-tertiary);
  font-family: 'Proxima Nova', sans-serif;
}

.lp-no-events-icon {
  color: var(--text-tertiary);
  opacity: 0.5;
  margin-bottom: 20px;
}

.lp-no-events-icon svg {
  width: 64px;
  height: 64px;
}

.lp-no-events-title {
  color: var(--text-secondary);
  font-size: 18px;
  font-weight: 600;
  margin: 0 0 8px 0;
}

.lp-no-events-text {
  color: var(--text-tertiary);
  font-size: 14px;
  font-weight: 400;
  margin: 0;
  opacity: 0.8;
}

/* ========== DESKTOP STYLES ========== */
@media (min-width: 1024px) {
  /* Fixture card - rounded corners on desktop */
  .lp-fixture {
    border-radius: 8px;
  }

}
/* Prematch time badge */
.prematch-time {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 6px;
  border-radius: 4px;
  background: #2a2a2e;
  background: var(--bg-tertiary, #2a2a2e);
  color: #a0a0a0;
  color: var(--text-secondary, #a0a0a0);
  font-size: 11px;
  font-weight: 500;
  white-space: nowrap;
}

/* ========== MOBILE - Bottom nav padding ========== */
@media (max-width: 768px) {
  .lp-page {
    padding-bottom: 70px;
  }
}

/* ========== LEAGUE PAGE HEADER (styled like md-header) ========== */
.lp-league-page-header {
  position: sticky;
  top: 36px;
  z-index: 2222;
  background-color: var(--bg-primary);
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 2px 0px 10px;
}

.lp-back-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: #1a1a1a;
  background: var(--bg-secondary, #1a1a1a);
  border: none;
  border-radius: 8px;
  cursor: pointer;
  color: var(--white-80);
  text-decoration: none;
  transition: background 0.15s ease;
}

.lp-back-btn:hover {
  background: #2a2a2a;
  background: var(--bg-quaternary, #2a2a2a);
}

.lp-back-btn svg {
  width: 20px;
  height: 20px;
}

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

.lp-sport-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white-70);
}

.lp-league-icon {
  max-width: 50px;
  height: 33px;
  object-fit: contain;
}

.lp-text-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.lp-sport-name {
  font-weight: 900;
  font-style: italic;
  color: var(--text-primary);
  text-transform: uppercase;
  font-size: 18px;
  line-height: 16px;
}

.lp-league-name {
  color: var(--text-primary);
  font-family: Proxima Nova Cond, sans-serif;
  line-height: 14px;
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.lp-league-name > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Flag specifically inside league page header (not to override the old .lp-country-flag at line 252) */
.lp-league-page-header .lp-country-flag {
  width: 18px;
  height: 13px;
  border-radius: 2px;
  object-fit: cover;
  margin: 0;  /* Reset margins from old rule */
}

@media (min-width: 1024px) {
  .lp-league-page-header {
    top: 0;
    /* border-radius: 8px 8px 0 0; */
  }
}

@media (min-width: 769px) and (max-width: 1023px) {
  .lp-league-page-header {
    padding: 8px 0px 10px;
  }
}

@media (max-width: 768px) {
  .lp-league-page-header {
    top: 37px;
    padding: 8px;
  }
}

/* ========== OUTRIGHT STYLES ========== */

/* Outright button in league header */
.lp-outright-btn {
  background: #2a2a2e;
  background: var(--bg-tertiary, #2a2a2e);
  border: 1px solid var(--accent-blue-muted);
  border-radius: 6px;
  color: var(--link-blue);
  cursor: pointer;
  font-family: 'Proxima Nova', sans-serif;
  font-size: 12px;
  font-weight: 600;
  padding: 6px 14px;
  transition: all 0.15s ease;
  white-space: nowrap;
  margin-left: auto;
}

@media (hover: hover) {
  .lp-outright-btn:hover {
    background: var(--accent-blue-muted);
    border-color: var(--accent-blue-hover);
  }
}

.lp-outright-btn.active {
  background: var(--accent-blue-muted);
  border-color: var(--link-blue);
  color: var(--link-blue-hover);
}

/* Outright view container */
.lp-outright-view {
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Outright category block */
.lp-outright-category {
  background: var(--bg-tertiary);
  border-radius: 8px;
}

/* Sticky header group - contains category + market selector */
.lp-outright-sticky-header {
  position: sticky;
  top: 42px;
  background: var(--bg-elevated);
  z-index: 12;
}

/* Category header */
.lp-outright-category-header {
  color: var(--white-90);
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  font-weight: 600;
  padding: 12px 14px 8px;
}

/* Market selector with arrows */
.lp-outright-market-selector {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 8px 14px 12px;
  height: 20px;
}

.lp-outright-arrow {
  background: none;
  border: none;
  color: var(--text-primary);
  font-size: 22px;
  font-weight: 700;
  cursor: pointer;
  padding: 4px 8px;
  opacity: 0.8;
  transition: opacity 0.15s ease;
}

.lp-outright-arrow:active {
  opacity: 1;
}

.lp-outright-current-market {
  color: var(--text-primary);
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  font-weight: 600;
  text-transform: capitalize;
  min-width: 120px;
  text-align: center;
}

/* Outright table */
.lp-outright-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--bg-secondary);
}

/* Table header - sticky below header group */
.lp-outright-table thead {
  background: var(--bg-elevated);
  position: sticky;
  top: 118px;
  z-index: 10;
}

/* Mobile: adjust sticky tops (+47px) */
@media (max-width: 1023px) {
  .lp-outright-sticky-header {
    top: 89px;
  }
  .lp-outright-table thead {
    top: 165px;
  }
}

.lp-outright-th-team {
  text-align: left;
  padding: 10px 12px;
  color: var(--white-70);
  font-family: 'Proxima Nova', sans-serif;
  font-size: 12px;
  font-weight: 600;
  border-bottom: 1px solid var(--white-15);
}

.lp-outright-th-odds {
  text-align: center;
  padding: 10px 8px;
  color: var(--white-60);
  font-family: 'Proxima Nova', sans-serif;
  font-size: 11px;
  font-weight: 600;
  border-bottom: 1px solid var(--white-15);
  width: 60px;
}

/* Table body rows */
.lp-outright-table tbody .lp-outright-row {
  border-bottom: 1px solid var(--black-25);
}

.lp-outright-table tbody .lp-outright-row:last-child {
  border-bottom: none;
}

@media (hover: hover) {
  .lp-outright-table tbody .lp-outright-row:hover {
    background: var(--white-3);
  }
}

/* Team/participant name cell */
.lp-outright-name {
  padding: 10px 12px;
  color: #fff;
  color: var(--text-primary, #fff);
  font-family: 'Proxima Nova', sans-serif;
  font-size: 13px;
  font-weight: 500;
}

/* Odds cell */
.lp-outright-odds {
  padding: 8px 6px;
  text-align: center;
  color: var(--white-95);
  font-family: 'Proxima Nova', sans-serif;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease;
  border-left: 1px solid var(--white-5);
  min-width: 45px;
}

@media (hover: hover) {
  .lp-outright-odds:hover {
    background: var(--accent-blue-muted);
  }
}