/* Winter Ball Updates · strip.css · the score strip on phones (operator 2026-10-22: two rows, LIDOM + LVBP on top and
   LMP + LBPRC below, no sideways scroll, each game's status under its tile). On phones the league tile is a narrow
   label (flag + code) at the start of its league's run, tiles are 4 to a line (3 at 320 px) with the clubs'
   abbreviations, and the status is 8 px caps, so a 10-game night stays near 200 px tall. Desktop is unchanged. */
.ls-tile .row .a { display: none; }
@media (max-width: 599px) {
  #lgstrip-wrap { min-height: 0; }
  body .lgstrip .ls-in { padding: 2px var(--gutter) 5px; }
  body .lgstrip .ls-row { min-height: 0; padding: 2px 0; row-gap: 1px; column-gap: 0; align-items: flex-start; }
  body .lgstrip .ls-row > .ls-item { align-self: stretch; }
  body .lgstrip .ls-row > * { margin: 0 !important; }
  /* the league label: flag over code, 40 px wide */
  body .lgstrip .ls-item { --lw: 40px; flex: 0 0 var(--lw); width: var(--lw); min-width: 0; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 4px 0; border-radius: 4px; }
  body .lgstrip .ls-item > span { display: block; text-align: center; }
  body .lgstrip .ls-item .flag3 { width: 20px; height: 13px; }
  body .lgstrip .ls-item b { display: block; font-size: 9.5px; letter-spacing: .02em; line-height: 1; }
  body .lgstrip .ls-item small { display: none; }
  /* a league with no game last night keeps its note (opens tonight / opens on a date) beside its label */
  body .lgstrip .ls-item:has(.st3) { flex: 0 1 auto; width: auto; flex-direction: row; gap: 7px; padding: 4px 8px 4px 6px; }
  body .lgstrip .ls-item .st3 { font-size: 8px; padding: 3px 5px; }
  /* the tiles: four to a line beside the labels */
  body .lgstrip .ls-tile, body .lgstrip .ls-wv { flex: 0 0 calc((100% - 40px) / 4); width: calc((100% - 40px) / 4); min-width: 0; }
  body .lgstrip .ls-wv > .ls-tile { flex: 1 1 auto; width: 100%; }
  body .lgstrip .ls-tile { padding: 2px 4px 2px 5px; }
  body .lgstrip .ls-tile .row { height: 14px; gap: 3px; font-size: 12px; }
  body .lgstrip .ls-tile .row .logo-badge { --ls: 13px; }
  body .lgstrip .ls-tile .row .n { display: none; }
  body .lgstrip .ls-tile .row .a { display: inline; overflow: hidden; white-space: nowrap; min-width: 0; font-stretch: 92%; letter-spacing: .01em; }
  body .lgstrip .ls-tile .row.win .r::after { font-size: 8px; margin-left: 1px; }
  body .lgstrip .ls-tile .meta { display: flex; align-items: center; min-height: 13px; margin: 1px 0 0; font-size: 8px; line-height: 1.15; letter-spacing: .06em; white-space: normal; }
  body .lgstrip .ls-tile .meta span + span { display: none; }
  /* the ▶ watch button sits beside the status, never over the score */
  body .lgstrip .ls-wv > .ls-tile .meta { padding-right: 17px; }
  body .lgstrip .wbtn.wtile { right: 3px; bottom: 2px; width: 14px; min-width: 14px; height: 13px; min-height: 13px; font-size: 6.5px; }
}
@media (max-width: 360px) {
  body .lgstrip .ls-item { --lw: 36px; }
  body .lgstrip .ls-tile, body .lgstrip .ls-wv { flex-basis: calc((100% - 36px) / 3); width: calc((100% - 36px) / 3); }
}

/* =====================================================================================================================
   Score strip, ledger (operator 2026-10-23). From 600 px: direction A (design/strip-redesign/A): one row per league,
   label in a fixed left column with "Final" said once, games in equal cells so scores line up, tonight in the rest of
   the row, a league with no games on one quiet line. Below 600 px: direction B's slim swipe row
   (design/strip-redesign/B): league label = flag over the code in the masthead serif with a rule in the league's ink,
   club codes, a boxed "10 INN". Same markup (app.js lxRow); the rules above (.ls-*) belong to the two-row strip it
   replaced and are kept for that option. No video in the strip (operator: "just the information").
   ===================================================================================================================== */
#lgstrip.lx-on { --lx-lab: 104px; --lx-cell: 172px; --lx-line: 16px; --lx-pad: 4px; --lx-rule: rgb(240 226 198 / .085); }
#lgstrip.lx-on [data-lg="LIDOM"] { --lx-ink: #8FA9D9; } #lgstrip.lx-on [data-lg="LVBP"] { --lx-ink: #E0B55A; }
#lgstrip.lx-on [data-lg="LMP"] { --lx-ink: #7FB89A; } #lgstrip.lx-on [data-lg="LBPRC"] { --lx-ink: #E08AA6; }
body #lgstrip-wrap { min-height: 166px; }
body .lgstrip .ls-in.lx-on { display: block; height: auto; min-height: 0; overflow: visible; padding: 5px var(--gutter) 9px; }
.lx-lg { display: grid; grid-template-columns: var(--lx-lab) repeat(auto-fill, minmax(var(--lx-cell), 1fr)); grid-auto-rows: calc(2 * var(--lx-line) + 2px + 2 * var(--lx-pad)); align-items: stretch; }
.lx-lg + .lx-lg { border-top: 1px solid var(--lx-rule); }
.lx-lab { grid-column: 1; grid-row: 1 / span var(--lx-rows, 1); display: grid; grid-template-columns: 20px 1fr; grid-template-rows: var(--lx-line) var(--lx-line); column-gap: 8px; row-gap: 2px; align-content: center; padding: var(--lx-pad) 0; color: var(--on-noche); text-decoration: none; }
.lx-lab .flag3 { grid-row: 1 / span 2; align-self: center; width: 20px; height: 13px; border-radius: 2px; box-shadow: 0 0 0 1px rgb(255 255 255 / .22); }
.lx-lab b { font: 720 12px/var(--lx-line) var(--fd); font-stretch: 108%; letter-spacing: .06em; }
.lx-lab small { font: 600 8.5px/var(--lx-line) var(--fd); font-stretch: 118%; letter-spacing: .16em; text-transform: uppercase; color: var(--on-noche-3); }
.lx-lab:hover b { color: #fff; }
.lx-g { position: relative; min-width: 0; padding: var(--lx-pad) 8px var(--lx-pad) 10px; border-left: 1px solid var(--lx-rule); }
.lx-g > a { position: absolute; inset: 0; z-index: 1; border-radius: 3px; }
.lx-g > a:hover, .lx-g > a:focus-visible { background: rgb(255 255 255 / .05); outline: none; }
.lx-g .t { display: grid; grid-template-columns: 16px minmax(0, 1fr) 24px 16px; column-gap: 6px; align-items: center; height: var(--lx-line); }
.lx-g .t + .t { margin-top: 2px; }
.lx-g .logo-badge { --ls: 16px; width: 16px; height: 16px; padding: 1px; box-shadow: none; }
.lx-g .n, .lx-g .a { font: 500 13.5px/1 var(--fd); font-stretch: 92%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--on-noche-3); }
.lx-g .a { display: none; }
.lx-g .r { font: 600 15px/1 var(--fd); font-stretch: 108%; text-align: right; font-variant-numeric: tabular-nums; color: var(--on-noche-3); }
.lx-g .t.w .n, .lx-g .t.w .a { font-weight: 700; color: var(--on-noche); }
.lx-g .t.w .r { font-weight: 800; color: #fff; }
.lx-g .t:not(.w) .logo-badge { opacity: .62; }
.lx-g .k { justify-self: end; font: 700 8.5px/1 var(--fd); font-stretch: 112%; letter-spacing: .04em; color: var(--on-noche-2); border: 1px solid rgb(240 226 198 / .28); border-radius: 3px; padding: 2px 2px 1px; }
.lx-g.ho .k.d { white-space: nowrap; padding: 2px 3px 1px; }
.lx-g.nf .r { font: 700 8.5px/1 var(--fd); letter-spacing: .08em; color: #F2C38A; }
.lx-tn { min-width: 0; padding: var(--lx-pad) 10px; border-left: 1px solid var(--lx-rule); color: var(--on-noche-3); text-decoration: none; display: grid; grid-template-rows: var(--lx-line) var(--lx-line); row-gap: 2px; }
.lx-tn[hidden] { display: none; }
.lx-tn i { font: 600 8.5px/var(--lx-line) var(--fd); font-style: normal; font-stretch: 118%; letter-spacing: .16em; text-transform: uppercase; color: var(--on-noche-3); white-space: nowrap; overflow: hidden; }
.lx-tn i b { font-weight: 600; text-transform: none; letter-spacing: .06em; color: var(--on-noche-2); }
.lx-tn .k2, .lx-tn.k-short .k1 { display: none; } .lx-tn.k-short .k2 { display: inline; } .lx-tn.k-min i b { display: none; }
.lx-tn .lst { min-width: 0; overflow: hidden; padding-bottom: 3px; margin-bottom: -3px; }
.lx-tn .lst > span { font: 500 12.5px/var(--lx-line) var(--fd); font-stretch: 92%; white-space: nowrap; color: var(--on-noche-2); }
.lx-tn .sum, .lx-tn.short .full { display: none; } .lx-tn.short .sum { display: inline; }
.lx-tn .full em { font-style: normal; color: var(--on-noche-3); margin: 0 7px; }
.lx-tn:hover .lst > span { color: var(--on-noche); }
.lx-lg.off { grid-auto-rows: 22px; }
.lx-lg.off .lx-lab { grid-template-rows: 22px; padding: 0; opacity: .72; }
.lx-lg.off .lx-lab .flag3 { grid-row: 1; width: 18px; height: 12px; }
.lx-lg.off .lx-lab b { line-height: 22px; }
.lx-lg.off .lx-opens { grid-column: 2 / -1; padding-left: 10px; font: 500 11.5px/22px var(--fd); font-stretch: 96%; color: var(--on-noche-3); }
/* narrow desktop / tablet: club codes, narrower cells */
@media (min-width: 600px) and (max-width: 1099px) {
  #lgstrip.lx-on { --lx-lab: 84px; --lx-cell: 118px; }
  .lx-g .n { display: none; } .lx-g .a { display: block; }
}
/* phones: B's slim swipe row (operator 2026-10-23: "B on phones, A on desktop") */
@media (max-width: 599px) {
  body #lgstrip-wrap { min-height: 50px; }
  body .lgstrip .ls-in.lx-on { display: flex; align-items: stretch; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; scroll-snap-type: x proximity; scroll-padding-inline: var(--gutter); padding: 6px var(--gutter) 9px; }
  body .lgstrip .ls-in.lx-on::-webkit-scrollbar { display: none; }
  body .lgstrip .ls-in.lx-on::after { content: ""; flex: 0 0 var(--gutter); }
  .lx-lg, .lx-lg.off { display: contents; }
  .lx-lg + .lx-lg { border: 0; }
  .lx-tn { display: none; }
  .lx-lab, .lx-lg.off .lx-lab { flex: none; display: grid; grid-template-columns: auto; grid-template-rows: 17px 17px; justify-items: center; align-items: center; row-gap: 0; padding: 0 7px 0 6px; border-left: 2px solid var(--lx-ink); color: var(--lx-ink); opacity: 1; scroll-snap-align: start; }
  .lx-g + .lx-lab, .lx-opens + .lx-lab { margin-left: 10px; }
  .lx-lab .flag3, .lx-lg.off .lx-lab .flag3 { grid-row: 1; width: 15px; height: 10px; border-radius: 1px; box-shadow: 0 0 0 1px rgb(255 255 255 / .18); }
  .lx-lab b, .lx-lg.off .lx-lab b { grid-row: 2; font: 600 10px/17px var(--vt-serif, "Source Serif 4", Georgia, serif); letter-spacing: .04em; }
  .lx-lab small { display: none; }
  .lx-lg.off .lx-opens { flex: none; align-self: center; padding: 0 2px 0 8px; font: italic 400 13px/17px var(--vt-serif, "Source Serif 4", Georgia, serif); color: var(--on-noche-2); white-space: nowrap; }
  .lx-g { flex: 0 0 auto; min-width: 80px; padding: 0 7px; border-left: 1px solid rgb(240 226 198 / .13); scroll-snap-align: start; display: grid; align-content: center; }
  .lx-lab + .lx-g { border-left: 0; }
  .lx-g > a { inset: -6px 0 -9px; }
  .lx-g .t { grid-template-columns: 14px auto minmax(2ch, 1fr) auto; column-gap: 5px; height: 17px; }
  .lx-g .t + .t { margin-top: 0; }
  .lx-g .logo-badge { --ls: 14px; width: 14px; height: 14px; }
  .lx-g .n { display: none; }
  .lx-g .a { display: block; font: 450 13.5px/17px var(--fd); font-stretch: 86%; }
  .lx-g .r { font: 450 13.5px/17px var(--fd); }
  .lx-g .t.w .a, .lx-g .t.w .r { font-weight: 720; color: var(--on-noche); }
  .lx-g .k { font: 650 8.5px/1 var(--fd); font-stretch: 92%; letter-spacing: .02em; padding: 2px 2px 1px; border-radius: 2px; border-color: rgb(217 200 166 / .4); white-space: nowrap; }
  .lx-g .k::after { content: " INN"; }
  .lx-g .k.d::after { content: none; }
  .lx-g.nf .r { font-size: 8.5px; }
}
@media (max-width: 599px) {
  .lgstrip.more-r .ls-in.lx-on { -webkit-mask-image: linear-gradient(90deg, #000 86%, transparent) !important; mask-image: linear-gradient(90deg, #000 86%, transparent) !important; }
  .lgstrip.more-l .ls-in.lx-on { -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%) !important; mask-image: linear-gradient(90deg, transparent, #000 12%) !important; }
  .lgstrip.more-l.more-r .ls-in.lx-on { -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 86%, transparent) !important; mask-image: linear-gradient(90deg, transparent, #000 12%, #000 86%, transparent) !important; }
}
/* operator 2026-10-23: (1) a subtle separator between leagues; (2) tonight's games in the finals' cell format */
.lx-lg + .lx-lg { border-top-color: rgb(240 226 198 / .16); }
.lx-g.tn .t { grid-template-columns: 16px minmax(0, 1fr) auto 0; }
.lx-g.tn .n, .lx-g.tn .a { color: var(--on-noche-2); font-weight: 500; }
.lx-g.tn .r { font: 600 11.5px/1 var(--fd); font-stretch: 100%; letter-spacing: .02em; color: #F2C38A; }
.lx-g.tn .t + .t .r { font-size: 8.5px; letter-spacing: .14em; color: var(--on-noche-3); }
.lx-g.tn .logo-badge { opacity: .85; }
/* the first of tonight's cells in a row opens with a dashed rule: last night ends, tonight begins */
.lx-g:not(.tn) + .lx-g.tn, .lx-lab + .lx-g.tn { border-left: 1px dashed rgb(242 195 138 / .38); }
.lx-g.tn.more .n, .lx-g.tn.more .a { color: var(--on-noche-3); }
.lx-g.tn[hidden] { display: none; }
@media (max-width: 599px) {
  .lx-g.tn { display: none; }
  .lx-lab { position: relative; }
  .lx-lg + .lx-lg .lx-lab::before { content: ""; position: absolute; left: -8px; top: 3px; bottom: 3px; width: 1px; background: rgb(240 226 198 / .24); }
  .lx-lg + .lx-lg .lx-lab { margin-left: 15px; }
}
/* team names link to their team page, above the cell's box-score link (operator 2026-10-23) */
.lx-g .t a.lk { position: relative; z-index: 2; text-decoration: none; border-radius: 2px; }
.lx-g .t a.lk:hover, .lx-g .t a.lk:focus-visible { color: #fff; text-decoration: underline; text-underline-offset: 2px; text-decoration-color: rgb(240 226 198 / .5); outline: none; }
/* clean-up (operator 2026-10-25, "this needs a little bit of cleaning up"), desktop and tablet only: the badge column
   is kept only in a cell that went to extra innings (both rows, so its scores still line up); everywhere else the name
   gets that room back (no more "Algodoner…"); tonight's first pitch sits in a fixed column so the times line up */
@media (min-width: 600px) {
  .lx-g .t { grid-template-columns: 16px minmax(0, 1fr) 24px; }
  .lx-g .t > span:empty:last-child { display: none; }
  .lx-g.xi .t { grid-template-columns: 16px minmax(0, 1fr) 24px 24px; }
  .lx-g.ho .t { grid-template-columns: 16px minmax(0, 1fr) 24px 36px; }
  .lx-g.tn .t { grid-template-columns: 16px minmax(0, 1fr) 40px; }
}
/* operator 2026-10-25: "a vertical divider between yesterday's scores and today's matchups": the first of tonight's
   cells in a league row opens with a solid mango rule (was a faint dashed one) and a little air on its right */
@media (min-width: 600px) {
  .lx-g:not(.tn) + .lx-g.tn, .lx-lab + .lx-g.tn { border-left: 2px solid rgb(242 195 138 / .75); padding-left: 14px; }
}
/* tonight-only (operator 2026-10-25: from 2 p.m. ET only tonight's games): no finals to divide from, so the first cell
   gets the ordinary cell rule; on phones tonight's cells show (they are hidden next to the finals the rest of the day) */
@media (min-width: 600px) {
  #lgstrip.lx-tonight .lx-lab + .lx-g.tn { border-left: 1px solid var(--lx-rule); padding-left: 10px; }
}
@media (max-width: 599px) {
  #lgstrip.lx-tonight .lx-g.tn:not(.more) { display: grid; }
}
/* lined up (operator 2026-10-26: "make sure everything is lined up at the top… it looks off right now"): on desktop and
   tablet a league with no games keeps the full row height, its label in the same two lines as the others, and its note
   on the first line, level with the team names of the rows around it */
@media (min-width: 600px) {
  .lx-lg.off { grid-auto-rows: calc(2 * var(--lx-line) + 2px + 2 * var(--lx-pad)); }
  .lx-lg.off .lx-lab { grid-template-rows: var(--lx-line) var(--lx-line); padding: var(--lx-pad) 0; opacity: 1; }
  .lx-lg.off .lx-lab .flag3 { grid-row: 1 / span 2; width: 20px; height: 13px; }
  .lx-lg.off .lx-lab b { line-height: var(--lx-line); }
  .lx-lg.off .lx-opens { align-self: start; padding-top: var(--lx-pad); line-height: var(--lx-line); }
}