/* release 375 (owner: "do you think the Live panel matches the theme, especially results? I feel we need a bold and confident
   design"): Live as a scoreboard in the designer's look.
   - one white card per sport with a soft shadow; each game a roomy row
   - big scores (the team ahead in heavy ink, the one behind in grey); a score that changed flashes once
   - the clock in a dark chip with the pulsing red dot; Final in a grey chip; red is used only for "live now"
   - our pre-game pick as a bar, the sportsbooks' chance of the same team as a marker on it
   - indigo for every selected control (days, sports, the Live filter); the slate note in plain grey
   :not(#lv375a)... outranks the page's own layers (370's two-id rules, b371_p2, b373_r1, the cream themes). */

html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page {
  --lv-ink: #303131; --lv-muted: #4F5252; --lv-faint: #646867; --lv-blue: #4647E5; --lv-live: #D92D20;
  --lv-good: #23662A; --lv-good-soft: #EAF6EB; --lv-bad: #B42318; --lv-bad-soft: #FDECEC;
  --lv-head: Nunito, ui-sans-serif, system-ui, sans-serif; --lv-body: Nunito, ui-sans-serif, system-ui, sans-serif;
  background: #fff;
}

/* ---- the title area: bigger, calmer ---- */
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-head h1 { font: 800 56px/1.05 var(--b-font) !important; letter-spacing: -.02em; color: var(--b-ink) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-livecount { background: #FDECEC !important; color: #B42318 !important; font-weight: 800 !important; }

/* ---- controls: one segmented day switch, indigo pills, a quiet note ---- */
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-days { border: 0 !important; background: var(--b-soft) !important; border-radius: var(--b-radius) !important; padding: 4px !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-day { border-radius: 6px !important; min-height: 44px; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-day[aria-selected="true"] { background: var(--b-primary) !important; color: #fff !important; box-shadow: 0 2px 8px rgba(70, 71, 229, .25); }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-day[aria-selected="true"] :is(b, small) { color: #fff !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-chip { min-height: 40px; border-color: var(--b-line) !important; background: #fff !important; color: var(--b-ink) !important; font-weight: 700 !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-chip:hover { border-color: var(--b-primary) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-chip[aria-pressed="true"],
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-chip--live[aria-pressed="true"] { background: var(--b-primary) !important; border-color: var(--b-primary) !important; color: #fff !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-chip--live[aria-pressed="true"] .lv-dot { background: #fff !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-slate { color: var(--b-muted) !important; font-weight: 600; }

/* ---- the sport cards ---- */
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-board { gap: 24px !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-group { border: 0 !important; border-radius: var(--b-radius-lg, 12px) !important; background: #fff !important; box-shadow: var(--b-shadow) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-group__head { padding: 16px 22px !important; border-bottom: 1px solid var(--b-line) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-group__head h2 { font: 800 20px/1.2 var(--b-font) !important; color: var(--b-ink) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-group__count { font-size: 14px !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-group__link { color: var(--b-primary-600) !important; font-weight: 800 !important; font-size: 14px !important; }

/* ---- each game ---- */
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-game { border-top: 1px solid var(--b-line) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-game:first-child { border-top: 0 !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-game.is-live > .lv-row { box-shadow: none !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-row { grid-template-columns: 104px minmax(0, 1fr) 300px 22px !important; gap: 20px !important; padding: 18px 22px !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-row:hover { background: #FAFAFF !important; }

/* the clock: dark chip with the pulsing dot; Final grey */
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-when { display: flex !important; flex-direction: column; align-items: flex-start; gap: 6px; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-when b.lv-livechip { display: inline-flex !important; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: #18181B !important; color: #fff !important; font: 800 12px/1.2 var(--b-font) !important; letter-spacing: .06em; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-when b.lv-livechip .lv-dot { background: #FF453A !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-when .lv-clock { color: var(--b-ink) !important; font: 800 15px/1.2 var(--b-font) !important; font-variant-numeric: tabular-nums; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-when b.lv-finalchip { display: inline-flex !important; padding: 4px 10px; border-radius: 999px; background: var(--b-soft) !important; color: var(--b-ink) !important; font: 800 12px/1.2 var(--b-font) !important; letter-spacing: .04em; text-transform: uppercase; }

/* teams and big scores */
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-teams { gap: 10px !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-team { gap: 12px !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-kit { width: 30px !important; height: 30px !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-name { font: 700 18px/1.25 var(--b-font) !important; color: var(--b-ink) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-rec { font-size: 13px !important; color: var(--b-muted) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-score { min-width: 48px !important; padding: 0 6px; border-radius: 6px; font: 800 32px/1 var(--b-font) !important; color: var(--b-ink) !important; letter-spacing: -.01em; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-team:is(.is-trail, .is-out) :is(.lv-name, .lv-score) { color: #7F8282 !important; font-weight: 700 !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-team:is(.is-lead, .is-win) .lv-name { font-weight: 900 !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-team.is-win .lv-score::after { content: ""; display: inline-block; width: 0; height: 0; margin-left: 6px; vertical-align: middle; border: 6px solid transparent; border-right-color: var(--b-primary); }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-score.is-flash { animation: lv375flash 1.6s ease-out 1; }
@keyframes lv375flash { 0% { background: #FFE58F; } 100% { background: transparent; } }

/* our pick: label, bold name and %, the bar with the sportsbooks' marker */
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-call { gap: 8px !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-call__pick { flex-wrap: wrap; gap: 2px 8px !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-call__pick > i { flex-basis: 100%; color: var(--b-muted) !important; font-size: 13px !important; font-weight: 600; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-call__pick > b { font: 800 18px/1.2 var(--b-font) !important; color: var(--b-ink) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-call__pick > em { font: 900 20px/1.2 var(--b-font) !important; color: var(--b-primary-600) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-call.is-pre .lv-call__pick > b { color: var(--b-ink) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-call.is-pre .lv-call__pick > em { color: var(--b-primary-600) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-cbar { position: relative; display: block; height: 8px; border-radius: 999px; background: var(--b-line); overflow: visible; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-cbar i { display: block; height: 100%; border-radius: 999px; background: var(--b-primary); }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-cbar u { position: absolute; top: -4px; width: 3px; height: 16px; margin-left: -1.5px; border-radius: 2px; background: var(--b-ink); text-decoration: none; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-call__sub { font-size: 13px !important; color: var(--b-muted) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-call__sub b.lv-mkt { color: var(--b-ink) !important; font-weight: 700 !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-call__sub b.lv-mkt::before { content: ""; display: inline-block; width: 3px; height: 12px; margin-right: 6px; vertical-align: -1px; border-radius: 2px; background: var(--b-ink); }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-tag { padding: 4px 10px !important; border-radius: 999px !important; font: 800 13px/1.2 var(--b-font) !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-tag--hit { background: #EAF6EB !important; color: #23662A !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-tag--miss { background: #FDECEC !important; color: #B42318 !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-score-strip { border-radius: var(--b-radius) !important; background: var(--b-primary-50) !important; border: 0 !important; }
html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-score-strip b { color: var(--b-primary-700) !important; font: 900 22px/1.2 var(--b-font) !important; }

/* cards fade in once on load (the page re-renders every 45 s, so only the first paint animates) */
html.b-motion:not(.lv375-seen) body.lv-page .lv-group { animation: lv375in .5s cubic-bezier(.2, .7, .2, 1) both; }
html.b-motion:not(.lv375-seen) body.lv-page .lv-group:nth-child(2) { animation-delay: .08s; }
html.b-motion:not(.lv375-seen) body.lv-page .lv-group:nth-child(3) { animation-delay: .16s; }
@keyframes lv375in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  html body.lv-page .lv-group, html body.lv-page .lv-score.is-flash { animation: none !important; }
}

/* ---- phones ---- */
@media (max-width: 680px) {
  html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-head h1 { font-size: 40px !important; }
  html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-row { grid-template-columns: 66px minmax(0, 1fr) 20px !important; gap: 10px 10px !important; padding: 16px 12px !important; }
  html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-call { grid-column: 1 / 4 !important; flex-direction: column !important; align-items: stretch !important; padding-top: 10px; border-top: 1px dashed var(--b-line); }
  html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-name { font-size: 15px !important; white-space: normal !important; line-height: 1.2 !important; }
  html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-team { gap: 8px !important; }
  html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-when b.lv-livechip { padding: 3px 8px; }
  html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-score { font-size: 26px !important; min-width: 40px !important; }
  html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-kit { width: 24px !important; height: 24px !important; }
  html:not(#lv375a):not(#lv375b):not(#lv375c):not(#lv375d) body.lv-page .lv-group__head { padding: 14px 16px !important; }
}