/* ============================================================
   PREVIOUSLY — HYBRID HOMEPAGE (owner decision 2026-10-26:
   "best of both worlds" — Direction B's river flow with
   Direction A's discipline). Producer-level sheet for the
   restructured homepage: hero+lead framed unit, the Tonight
   band, section rhythm, and the Before You Go close.
   Loaded last on the homepage; rules are section-scoped.
   ============================================================ */

/* ---- shared section head (Tonight + Before You Go) ---- */
.hh-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:18px}
.hh-kick{font:800 11px/1 'Inter',Arial,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:#F2BC68;margin:0}
.hh-h2{font-family:'Marathon','Previously Display',Georgia,'Times New Roman',serif;font-weight:400;font-size:34px;line-height:1.05;color:#E9EEF3;margin:8px 0 0}
.hh-more{font-family:'Anton','Arial Narrow',sans-serif;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:#F2BC68;text-decoration:none;white-space:nowrap;padding-bottom:4px}

/* ---- hero + lead: ONE framed unit ----
   The incumbent lead treatment lives in mh-hero.css under the full
   chain html[data-theme=d3] body.pv-home.b-scope.pv3-home-v5
   #hpLeadSlot (specificity 1-ID + 5-class). These overrides carry
   the same chain so the later sheet wins the tie — deliberate,
   scoped to the lead band only; the matchup hero is untouched. */
/* FLUSH FRAME (owner order 2026-10-28 — James, on his Chromebook
   shot of the Abbott slide): the unit's 1px outline and the hero
   zone's page-column inset (pv5 margin/width) left a thin outline
   around the hero with a band of flat ground between the outline
   and the graphic. Both are gone: the unit carries no border, and
   inside the unit the hero zone spans the unit's full width from
   its top edge, so every slide's graphic runs flush to the box's
   edges. Hero composition, size logic, rotation and nav untouched —
   this is frame only. */
.hp-herolead{border:none;background:#0C121B}
.hp-herolead .mh-hero{border:none}
@media (min-width:721px){
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 .hp-herolead .hp-hero{
    width:auto; margin:0;
  }
}
/* phone story slides: the art band (.mh-bg) sat inside the hero's
   14px side padding with a 1px hairline above it (mh-hero.css
   <=720 story block) — the same inset on the small canvas. The art
   now spans the hero's full width, hairlines dropped; the shade
   melt at its bottom edge is unchanged. */
@media (max-width:720px){
  .mh-hero.mh-story .mh-bg{margin:0 -14px;border-top:0;border-bottom:0}
}
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot{margin:0;padding:0;width:auto;min-width:0}
/* SEAM MELT (owner, 2026-10-27): the hero's dark bottom edge butted
   straight into the lead band in one hard line (the band's old 1px
   border-top, removed above). This strip melts the seam: it starts
   at the hero's real bottom edge — the hero's ::after scrim ends at
   rgba(3,6,11,.88) over the hero ground #0C121B, a composite of
   #04070D — and lands exactly on the lead band's own #0E1624, which
   continues unchanged below. Both modules keep their own colors;
   only the seam is bridged. */
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot::before{
  content:""; display:block; height:96px;
  background:linear-gradient(180deg, #04070D 0%, #0A1322 55%, #0E1624 100%);
}
@media (max-width:720px){
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot::before{height:72px}
}
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 /* LEAD PICTURE-FORWARD (owner order 2026-10-28): the lead photo runs the full
   module width on top (16/10 desktop, 3/2 phone, focal 50% 35%); the headline
   block rides under it. Replaces the 230x132 thumbnail band. */
#hpLeadSlot section.hero{display:flex;flex-direction:column;align-items:stretch;gap:0;background:#0E1624;border:none;border-top:none;border-radius:0;padding:0 0 24px;margin:0;max-width:none;box-shadow:none;color:#E9EEF3}
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero .hp-lead-txt{flex:1 1 auto;min-width:0;padding:20px 26px 0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;background:none}
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero figure.hp-lead-art{order:-1;flex:none;width:100%;margin:0;position:relative;min-height:0;height:auto}
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero figure.hp-lead-art img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:50% 35%;display:block;position:static;max-height:none}
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero .kicker{font:800 11px/1 'Inter',Arial,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:#F2BC68;background:none;padding:0;align-self:flex-start}
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero h1{font-family:'Marathon','Previously Display',Georgia,'Times New Roman',serif;font-weight:400;font-size:33px;line-height:1.14;letter-spacing:0;margin:9px 0 0;color:#E9EEF3;max-width:none;text-align:left}
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero h1 a{color:inherit;text-decoration:none}
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero .dek{font-family:'Inter',Arial,sans-serif;font-size:14.5px;font-weight:500;line-height:1.5;color:#9AA7B4;margin:8px 0 0;max-width:72ch;text-align:left;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero .byline{font-size:12px;color:#7C8FA1;margin:10px 0 0;text-align:left}
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero .hp-lead-cta{margin-top:13px;display:flex;align-items:center;gap:14px;align-self:flex-start}
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot .hp-hero-credit{background:#0E1624;margin:0;padding:0 26px 12px;text-align:right;font-size:11px;color:#7C8FA1;position:static}

/* ---- Tonight on Previously ---- */
.hp-tonight{margin-top:56px}
.hp-tn-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.hp-tn-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.hp-tn-card{display:flex;flex-direction:column;gap:12px;border:1px solid rgba(233,238,243,.14);background:#101A29;padding:18px 20px;color:#E9EEF3;text-decoration:none;min-width:0}
.hp-tn-card:hover{border-color:#F2BC68}
.hp-tn-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.hp-tn-kick{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#9AA7B4}
.hp-tn-status{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#F2BC68;white-space:nowrap}
.hp-tn-status--live{color:#F46B62}
/* Face-off (owner order 2026-10-27): the two teams sit SIDE BY SIDE
   at every width — away left, home right — each half washed in its
   own team color behind a big logo, name under the logo, a pure-color
   bar under the name: the head-to-head hero's language at card
   scale. The producer computes the washes into --tn-aw/--tn-aw2
   (away) and --tn-hw/--tn-hw2 (home): 42% team color over the card
   ground at the outer edge, easing to 20% at the center seam, so
   the halves read as one card split by a seam, never two boxes.
   No stacking at any width — the side-by-side IS the design. */
.hp-tn-vs{position:relative;display:flex;align-items:stretch;min-width:0;background:#101A29;border:1px solid rgba(233,238,243,.07)}
.hp-tn-side{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:8px;flex:1 1 0;min-width:0;padding:16px 10px 14px;text-align:center}
.hp-tn-side:first-child{background:linear-gradient(90deg,var(--tn-aw,#182940) 52%,var(--tn-aw2,#131E30) 100%);border-right:1px solid rgba(233,238,243,.09)}
.hp-tn-side--home{background:linear-gradient(270deg,var(--tn-hw,#182940) 52%,var(--tn-hw2,#131E30) 100%)}
.hp-tn-logo{display:flex;align-items:center;justify-content:center;height:88px}
.hp-tn-side img{width:88px;height:88px;object-fit:contain;flex:none;filter:drop-shadow(0 6px 18px rgba(0,0,0,.45))}
.hp-tn-name{font-family:'Anton','Arial Narrow',sans-serif;font-size:19px;letter-spacing:.03em;text-transform:uppercase;line-height:1.12;color:#E9EEF3}
.hp-tn-bar{display:block;width:44px;height:3px;background:var(--tn-a,#3A4B61)}
.hp-tn-side--home .hp-tn-bar{background:var(--tn-h,#3A4B61)}
.hp-tn-score{font-family:'Anton','Arial Narrow',sans-serif;font-size:34px;line-height:1;color:#E9EEF3;font-variant-numeric:tabular-nums}
.hp-tn-side--win .hp-tn-name,.hp-tn-side--win .hp-tn-score{color:#F2BC68}
.hp-tn-side--lose .hp-tn-name,.hp-tn-side--lose .hp-tn-score{color:#8FA3B5}
.hp-tn-at{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;font-family:'Anton','Arial Narrow',sans-serif;font-size:12px;letter-spacing:.12em;color:#F2BC68;background:#101A29;border:1px solid rgba(233,238,243,.16);padding:3px 7px 2px}
/* 3-across grid: same face-off, one step smaller */
.hp-tn-grid--3 .hp-tn-logo{height:72px}
.hp-tn-grid--3 .hp-tn-side img{width:72px;height:72px}
.hp-tn-grid--3 .hp-tn-name{font-size:16px}
.hp-tn-grid--3 .hp-tn-score{font-size:28px}
@media (max-width:1023px){
  .hp-tn-logo{height:84px}
  .hp-tn-side img{width:84px;height:84px}
  .hp-tn-name{font-size:17px}
  .hp-tn-score{font-size:30px}
}
@media (max-width:420px){
  .hp-tn-side{padding:14px 6px 12px;gap:7px}
  .hp-tn-name{font-size:16px}
}
.hp-tn-meta{font-size:12.5px;color:#9AA7B4;line-height:1.4}
.hp-tn-ticket{border-color:rgba(242,188,104,.55);gap:0}
.hp-tn-return{font-family:'Anton','Arial Narrow',sans-serif;font-size:24px;line-height:1;color:#F2BC68}
.hp-tn-leg{display:flex;justify-content:space-between;gap:12px;font-size:14px;font-weight:600;padding:9px 0;border-top:1px solid rgba(233,238,243,.1);margin-top:9px}
.hp-tn-leg-line{color:#F2BC68;font-variant-numeric:tabular-nums;white-space:nowrap}
/* leg sub-line (matchup · start PT) is laptop-only density — the
   phone card never shows it */
.hp-tn-leg-sub{display:none}
.hp-tn-tfoot{font-size:12px;color:#9AA7B4;margin-top:auto;padding-top:10px}
/* The Ticket feature: full-width, gold-framed, first in the band — it
   stands out on purpose (owner order 2026-10-26), never a sibling card */
.hp-tn-ticket--feat{border:1.5px solid #F2BC68;background:linear-gradient(135deg,rgba(242,188,104,.10),rgba(242,188,104,.02) 55%),#101A29;box-shadow:inset 0 3px 0 #F2BC68,0 0 0 1px rgba(242,188,104,.25),0 12px 44px rgba(242,188,104,.13);padding:26px 28px;gap:16px;margin-bottom:14px}
.hp-tn-ticket--feat:hover{border-color:#F2BC68;box-shadow:inset 0 3px 0 #F2BC68,0 0 0 1px rgba(242,188,104,.4),0 14px 52px rgba(242,188,104,.2)}
.hp-tn-thead{display:flex;align-items:center;justify-content:space-between;gap:16px}
.hp-tn-ttitle{font-family:'Anton','Arial Narrow',sans-serif;font-size:16px;letter-spacing:.18em;text-transform:uppercase;color:#F2BC68;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;min-width:0}
.hp-tn-tserial{font-family:'Inter',Arial,sans-serif;font-size:12px;font-weight:600;letter-spacing:.06em;color:#9AA7B4}
.hp-tn-ticket--feat .hp-tn-return{font-size:44px;white-space:nowrap}
.hp-tn-legs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.hp-tn-ticket--feat .hp-tn-leg{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:5px;font-size:15px;margin-top:0;padding:11px 0 0}
.hp-tn-ticket--feat .hp-tn-tfoot{font-size:13px;padding-top:14px}
.hp-tn-tret{color:#F2BC68;font-weight:700}
/* The Daily Ticket deck (owner order 2026-10-27): the gold card
   swipes across the day's combination lengths — 3-leg, 4-leg,
   5-leg. The deck carries the band spacing the card used to carry;
   the nav (active count + dashes + a hint naming the next card) is
   baked hidden and revealed by the home-v2.js controller, so a
   scriptless visit sees exactly the single card it saw before.
   Edge zones are invisible click strips — no arrows, per the
   standing order. Dashes are squared bars, never pills. */
.hp-tn-tdeck{position:relative;margin-bottom:14px;min-width:0}
.hp-tn-tdeck .hp-tn-ticket--feat{margin-bottom:0}
.hp-tn-tview{position:relative;overflow:hidden;touch-action:pan-y;outline:none}
.hp-tn-tview:focus-visible{box-shadow:0 0 0 2px #F2BC68}
.hp-tn-ttrack{display:flex;align-items:stretch;transition:transform .38s cubic-bezier(.22,.8,.28,1);will-change:transform}
.hp-tn-ttrack.hp-drag{transition:none}
.hp-tn-ttrack>.hp-tn-card{flex:0 0 100%;min-width:0}
.hp-tn-tzone{display:none;position:absolute;top:0;bottom:0;width:40px;z-index:2;background:transparent;border:0;padding:0;cursor:pointer}
.hp-tn-tzone--prev{left:0}
.hp-tn-tzone--next{right:0}
.hp-tn-tdeck--js .hp-tn-tzone{display:block}
.hp-tn-tdeck--js .hp-tn-tzone[hidden]{display:none}
.hp-tn-tnav{display:none;align-items:center;gap:14px;margin-top:12px}
.hp-tn-tdeck--js .hp-tn-tnav{display:flex}
.hp-tn-tcount{font-family:'Anton','Arial Narrow',sans-serif;font-size:13px;letter-spacing:.16em;color:#F2BC68;white-space:nowrap}
.hp-tn-tdashes{display:flex;gap:8px}
.hp-tn-tdash{width:26px;height:3px;border:0;padding:0;cursor:pointer;background:rgba(233,238,243,.25)}
.hp-tn-tdash[aria-current="true"]{background:#F2BC68}
.hp-tn-thint{margin-left:auto;font-size:10.5px;font-weight:700;letter-spacing:.14em;color:#9AA7B4;text-transform:uppercase;white-space:nowrap}
@media (prefers-reduced-motion:reduce){
  .hp-tn-ttrack{transition:none}
}

/* ---- Tonight band: deliberate LAPTOP composition (>=1024px) ----
   Owner order 2026-10-27: the band was the phone design stretched —
   the Ticket card ran the full 1328px with its legs stranded, and
   the matchup cards were wide shallow bars with dead middles. At
   laptop the band joins the page's 12-column rhythm: the Ticket is
   a contained 4-column rail (title + return stacked, legs as
   hairline rows with matchup/start sub-lines, foot pinned to the
   bottom), and the featured matchups take the 8-column field.
   (The stacked-side card grammar this block originally carried was
   superseded the same day by the owner's face-off order — see the
   face-off rules inside the block.) */
@media (min-width:1024px){
  .hp-tonight-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px;align-items:stretch}
  .hp-tonight-in>.hh-head{grid-column:1/-1;margin-bottom:2px}
  .hp-tonight-in>.hp-tn-grid{grid-column:1/-1}
  .hp-tonight-in:has(>.hp-tn-tdeck)>.hp-tn-grid{grid-column:span 8}
  .hp-tn-tdeck{grid-column:span 4;margin-bottom:0}
  .hp-tn-ticket--feat{margin-bottom:0;padding:24px 24px 20px}
  .hp-tn-ticket--feat .hp-tn-thead{flex-direction:column;align-items:flex-start;gap:8px}
  .hp-tn-ticket--feat .hp-tn-return{font-size:46px}
  .hp-tn-ticket--feat .hp-tn-legs{display:flex;flex-direction:column;justify-content:space-evenly;flex:1 1 auto;gap:0}
  .hp-tn-ticket--feat .hp-tn-leg{flex-direction:row;align-items:flex-start;justify-content:space-between;gap:10px;padding:12px 0 0}
  .hp-tn-leg-main{display:flex;flex-direction:column;gap:3px;min-width:0}
  .hp-tn-leg-pick{font-size:16.5px;font-weight:650;line-height:1.25}
  .hp-tn-leg-sub{display:block;font-size:12px;font-weight:500;color:#9AA7B4;line-height:1.35}
  .hp-tn-ticket--feat .hp-tn-tfoot{margin-top:auto;padding-top:16px}
  /* game cards beside the rail keep the 2-across grid (3-across
     past four cards) with equal-height rows, so the field and the
     rail end at the same baseline */
  .hp-tonight-in:has(>.hp-tn-tdeck) .hp-tn-grid{grid-auto-rows:1fr}
  /* face-off at laptop (owner order 2026-10-27): the same side-by-
     side halves as the phone — away left, home right, team-color
     washes behind the logos — at the largest logo size of any width */
  .hp-tn-logo{height:96px}
  .hp-tn-side img{width:96px;height:96px}
  .hp-tn-name{font-size:22px}
  .hp-tn-score{font-size:38px}
  .hp-tn-card{gap:14px;padding:20px 22px}
  .hp-tn-meta{font-size:13.5px}
  /* AMEND 2026-10-27 (owner, on the shipped laptop proof): the
     matchup cards lose their boxes at laptop — no panel background,
     no card border; they sit seamless on the page ground with a top
     hairline as the only separation. The Daily Ticket rail keeps its
     gold box: it is a direct child of .hp-tonight-in, NOT inside
     .hp-tn-grid, so this rule never reaches it. */
  .hp-tn-grid .hp-tn-card{background:transparent;border:none;border-top:1px solid rgba(233,238,243,.14);padding:18px 6px 6px}
  .hp-tn-grid .hp-tn-card:hover{border-top-color:rgba(242,188,104,.55)}
}

/* ---- section rhythm in the new order ---- */
.hp-recap{margin-top:56px}
.hp-doors-sec{margin-top:56px}
body.pv-home #hpChart{margin-top:56px}
body.pv-home #hpYours{margin-top:48px}

/* ---- Before You Go: the designed close ---- */
.hp-byg{margin-top:64px}
body.pv-home #hpNews{margin:0 0 14px}
#hpNews .hp-nl-panel{background:#101A29;border:1px solid rgba(233,238,243,.14);border-radius:0;box-shadow:none;padding:22px 26px}
#hpNews .hp-nl-form input[type="email"]{background:#0C121B;border-color:rgba(233,238,243,.25);color:#E9EEF3}
body.pv-home #hpClosing{margin:0}
.hp-byg-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.hp-byg-card{border:1px solid rgba(233,238,243,.14);background:#0E1624;padding:24px 26px;min-width:0}
.hp-byg-h{font-family:'Marathon','Previously Display',Georgia,'Times New Roman',serif;font-weight:400;font-size:24px;line-height:1.1;color:#E9EEF3;margin:0 0 12px}
.hp-byg-p{font-size:14px;line-height:1.55;color:#9AA7B4;margin:0}
.hp-byg-link{display:inline-block;margin-top:12px;font-family:'Anton','Arial Narrow',sans-serif;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:#F2BC68;text-decoration:none}
#hpClosing .hp-byg-card .hp-link-row{display:flex;flex-direction:column;align-items:flex-start;gap:10px;background:none;border:none;border-radius:0;box-shadow:none;padding:0;color:#E9EEF3}
#hpClosing .hp-byg-card .hp-link-k{display:none}
#hpClosing .hp-byg-card .hp-link-t{font-size:16.5px;font-weight:650;line-height:1.35}
#hpClosing .hp-byg-card .hp-link-arw{color:#F2BC68;font-size:15px}
#hpClosing .hp-byg-card .hp-link-row img{width:100%;height:118px;object-fit:cover;display:block;flex:none}
/* Partner Spotlight: one hairline row */
body.pv-home #hpPartner{margin:26px 0 0;border-top:1px solid rgba(233,238,243,.14);padding-top:18px}
#hpPartner .hp-watch-rows{background:none;border:none;border-radius:0;box-shadow:none;padding:0;margin:0}
#hpPartner .hp-wrow{display:flex;align-items:center;gap:16px;padding:0;color:#E9EEF3;text-decoration:none}
#hpPartner .hp-wrow::before{content:"Partner Spotlight";font:800 11px/1 'Inter',Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#F2BC68;flex:none}
#hpPartner .hp-sz-thumb{width:88px;height:58px;object-fit:cover;border-radius:0;flex:none}
#hpPartner .hp-rn-t{font-size:15px;font-weight:600}
#hpPartner .hp-rn-m{margin-left:auto;font-family:'Anton','Arial Narrow',sans-serif;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:#F2BC68;white-space:nowrap}

@media (max-width:700px){
  .hh-h2{font-size:27px}
  .hp-herolead{border:none}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot{width:auto}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero{flex-direction:column;align-items:stretch;gap:0;padding:0 0 18px}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero figure.hp-lead-art{order:-1;width:100%;min-height:0;height:auto}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero figure.hp-lead-art img{width:100%;height:auto;aspect-ratio:3/2;object-position:50% 35%}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero .hp-lead-txt{padding:16px 16px 0}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero h1{font-size:26px}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot section.hero .dek{-webkit-line-clamp:3}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 #hpLeadSlot .hp-hero-credit{padding:0 16px 12px}
  .hp-tonight{margin-top:44px}
  .hp-tn-grid,.hp-tn-grid--3{grid-template-columns:1fr}
  .hp-tn-ticket--feat{padding:22px}
  .hp-tn-ticket--feat .hp-tn-return{font-size:36px}
  .hp-tn-legs{grid-template-columns:1fr;gap:0}
  .hp-tn-ticket--feat .hp-tn-leg{flex-direction:row;align-items:baseline;justify-content:space-between;margin-top:9px;padding:9px 0 0}
  .hp-recap{margin-top:44px}
  .hp-doors-sec{margin-top:44px}
  body.pv-home #hpChart{margin-top:44px}
  body.pv-home #hpYours{margin-top:36px}
  .hp-byg{margin-top:48px}
  .hp-byg-cards{grid-template-columns:1fr}
  #hpPartner .hp-wrow{flex-wrap:wrap}
  #hpPartner .hp-wrow::before{width:100%}
  #hpPartner .hp-rn-m{margin-left:0}
}

/* Ticket leg status symbols (owner order 2026-10-27): green dot =
   the leg is alive (pulsing while its game is in play), green check
   = won, red X + struck red-tinted pick = lost, the leg "redded out".
   Functional status colors only; gold stays the house accent. */
.hp-tn-leg-dot{
  width:8px;height:8px;border-radius:50%;background:#35C26E;
  display:inline-block;margin-right:8px;vertical-align:2px;
}
.hp-tn-leg-dot--live{animation:hpTnLegPulse 1.6s ease-in-out infinite}
@keyframes hpTnLegPulse{0%,100%{opacity:1}50%{opacity:.3}}
.hp-tn-leg-mark{font-weight:800;margin-right:8px}
.hp-tn-leg-mark--won{color:#35C26E}
.hp-tn-leg-mark--lost{color:#F0564A}
.hp-tn-leg-mark--push{color:#9AA7B4}
.hp-tn-leg--lost .hp-tn-leg-picktx{
  color:#F0958F;text-decoration:line-through;text-decoration-thickness:2px;
}
.hp-tn-leg--lost .hp-tn-leg-line{color:#F0958F}

/* ==== TICKET MODULE FIXES (owner order 2026-10-28) ====
   1) LINKS LIGHT INDIVIDUALLY. design-tokens-d3.css underlines EVERY
   anchor's whole text on hover (html[data-theme="d3"] a:hover), and a
   Ticket/game card is ONE anchor — so hovering the card lit every leg
   at once. Out-specify it for tonight cards: no card-wide underline,
   ever; the ONE leg under the pointer lights (gold pick + underline +
   soft wash) and nothing else does. */
html[data-theme="d3"] .hp-tn-card:hover{text-decoration:none}
.hp-tn-card:focus-visible{outline:2px solid #F2BC68;outline-offset:2px}
.hp-tn-ticket .hp-tn-leg{transition:background .15s ease}
.hp-tn-ticket .hp-tn-leg:hover{background:rgba(242,188,104,.08)}
.hp-tn-ticket .hp-tn-leg:hover .hp-tn-leg-picktx{color:#FFD98F;text-decoration:underline;text-decoration-color:rgba(242,188,104,.55);text-underline-offset:3px}
.hp-tn-ticket .hp-tn-leg:hover .hp-tn-leg-line{color:#FFD98F}
/* 2) DESKTOP ARROWS for the combination deck — fine pointers only;
   touch keeps the edge zones, dashes and swipe. */
.hp-tn-tarrow{display:none;align-items:center;justify-content:center;width:32px;height:26px;padding:0;background:transparent;border:0;cursor:pointer;color:#F2BC68;font-family:'Anton','Arial Narrow',sans-serif;font-size:20px;line-height:1}
@media (hover:hover) and (pointer:fine), (min-width:1024px){.hp-tn-tdeck--js .hp-tn-tarrow{display:inline-flex}}
.hp-tn-tarrow:hover{color:#FFD98F}
.hp-tn-tarrow[disabled]{color:rgba(233,238,243,.25);cursor:default}
/* 3) FULL-SLATE LINK under the Tonight field. */
.hp-tn-more{display:block;margin-top:12px;text-align:right;font-family:'Anton','Arial Narrow',sans-serif;font-size:13px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:#F2BC68;text-decoration:none}
@media (min-width:1024px){.hp-tn-more{grid-column:1/-1}}


/* =====================================================================
   DAY IN FULL — DESKTOP FIELD ALIGNMENT (2026-10-28)
   Desktop only. The source order/implicit grid placement could strand
   the 8-column game field BELOW the 4-column Ticket, leaving unused
   right-hand space. Pin each existing child to an explicit two-column
   field: Ticket editorial rail | live matchups. No DOM changes, odds,
   links, scores, ticket grading or swipe-controller modifications.
   <=1023px (including the approved handset layout) is untouched.
   ===================================================================== */
@media (min-width:1024px){
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in:has(>.hp-tn-tdeck){
    display:grid;
    grid-template-columns:minmax(320px, .88fr) minmax(0, 1.32fr);
    column-gap:clamp(20px, 2.6vw, 36px);
    row-gap:14px;
    align-items:stretch;
  }
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in:has(>.hp-tn-tdeck)>.hh-head{
    grid-column:1/-1;grid-row:1;
    margin-bottom:8px;
  }
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in:has(>.hp-tn-tdeck)>.hp-tn-tdeck{
    grid-column:1;grid-row:2;
    align-self:stretch;display:flex;flex-direction:column;
    min-width:0;margin:0;
  }
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in:has(>.hp-tn-tdeck)>.hp-tn-grid{
    grid-column:2;grid-row:2;
    display:grid;grid-template-columns:minmax(0,1fr);
    grid-auto-rows:minmax(0,1fr);
    gap:0;align-self:stretch;min-width:0;
  }
  /* Live scorecards: concise editorial rows with a team-color faceoff
     on the right, rather than shallow full-width bars beneath Ticket. */
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in:has(>.hp-tn-tdeck)>.hp-tn-grid>.hp-tn-card{
    display:grid;
    grid-template-columns:minmax(94px, 112px) minmax(0,1fr);
    grid-template-rows:auto 1fr;
    align-items:center;
    column-gap:clamp(12px, 1.5vw, 22px);
    row-gap:5px;
    padding:13px 0;
    min-width:0;
  }
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-grid>.hp-tn-card .hp-tn-top{
    grid-column:1;grid-row:1;
    display:flex;flex-direction:column;align-items:flex-start;
    justify-content:center;gap:7px;min-width:0;
  }
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-grid>.hp-tn-card .hp-tn-vs{
    grid-column:2;grid-row:1/span 2;min-width:0;
  }
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-grid>.hp-tn-card .hp-tn-meta{
    grid-column:1;grid-row:2;
    align-self:start;min-width:0;
    overflow-wrap:anywhere;font-size:11px;line-height:1.35;
  }
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-grid .hp-tn-side{
    padding:9px 7px;gap:5px;
  }
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-grid .hp-tn-logo{height:56px}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-grid .hp-tn-side img{width:56px;height:56px}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-grid .hp-tn-name{font-size:clamp(14px,1.15vw,17px)}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-grid .hp-tn-score{font-size:clamp(25px,2.2vw,32px)}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-tdeck .hp-tn-tview,
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-tdeck .hp-tn-ttrack{display:flex;flex:1 1 auto}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-tdeck .hp-tn-ticket--feat{
    height:100%;display:flex;flex-direction:column;
    padding:clamp(22px,2.3vw,31px);
    gap:15px;
  }
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-tdeck .hp-tn-return{
    font-size:clamp(44px,4vw,58px);
  }
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-tdeck .hp-tn-legs{
    flex:1 1 auto;justify-content:space-evenly;
  }
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-more{
    grid-column:2;grid-row:3;
    margin:0;text-align:right;
  }
}


/* ==== DAILY TICKET STACK (owner order 2026-10-29) ====
   The combination swipe deck is retired in the Tonight band: the
   3-leg, 4-leg and 5-leg tickets now STACK in the rail, in that
   order, each compact at its natural height - no card stretches to
   fill the column beside the games field (James, 2026-10-29: the
   single stretched card "just looks absolutely hideous"). The
   wrapper keeps the hp-tn-tdeck class because the band's grid
   placement keys on it, and gains hp-tn-tstack; tonight_bake emits
   no track, no nav and no data-tdeck, so the deck controller never
   binds. The stack's gold frame also drops the old inset top
   line - gold top-edge bars are retired house-wide. */
.hp-tn-tstack{display:flex;flex-direction:column;gap:14px;align-self:start}
.hp-tn-tstack>.hp-tn-ticket--feat{flex:none;height:auto;min-height:0;min-width:0;margin:0;
  box-shadow:0 0 0 1px rgba(242,188,104,.25),0 12px 44px rgba(242,188,104,.13)}
.hp-tn-tstack>.hp-tn-ticket--feat:hover{box-shadow:0 0 0 1px rgba(242,188,104,.4),0 14px 52px rgba(242,188,104,.2)}
.hp-tn-tstack .hp-tn-ticket--feat .hp-tn-legs{flex:none;justify-content:flex-start}
@media (min-width:1024px){
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in:has(>.hp-tn-tdeck)>.hp-tn-tstack{align-self:start}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-tstack .hp-tn-ticket--feat{height:auto}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-tstack .hp-tn-legs{flex:none;justify-content:flex-start}
}

/* ==== SLATE VIEW-ALL (owner order 2026-10-29) ====
   James: "I hate a long scrolling list. We supposed to show a few
   and then hide the rest with an option to view all." The Tonight
   games field is capped by tonight_bake.py: the first 6 cards show;
   the rest sit inside the same grid behind a "View all N games"
   toggle that expands in place. The toggle is a visually-hidden
   checkbox + labels (no JS): while it is unchecked the extra cards
   are display:none — they generate no boxes, so the collapsed field
   leaves no invisible tail and the module's neighbours never move.
   The control follows the band's own link grammar (Anton caps,
   gold #F2BC68, right-aligned) — no pill, no gold top-edge bar. On
   laptop the capped grid also drops the equal-height row stretch
   and top-aligns, so the six visible rows keep their natural
   height beside the Ticket rail instead of stretching to fill it. */
.hp-tn-va-tgl{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;opacity:0}
.hp-tn-viewall{display:block;grid-column:1/-1;padding:10px 0 4px;text-align:right;font-family:'Anton','Arial Narrow',sans-serif;font-size:13px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:#F2BC68;cursor:pointer}
.hp-tn-viewall:hover{color:#FFD98F}
.hp-tn-grid--capped>.hp-tn-more{grid-column:1/-1}
html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5 .hp-tonight-in .hp-tn-grid--capped:not(:has(>.hp-tn-va-tgl:checked))>.hp-tn-card--x{display:none}
.hp-tn-grid--capped:not(:has(>.hp-tn-va-tgl:checked))>.hp-tn-viewall--less{display:none}
.hp-tn-grid--capped:has(>.hp-tn-va-tgl:checked)>.hp-tn-viewall--more{display:none}
.hp-tn-va-tgl:focus-visible~.hp-tn-viewall{outline:2px solid #F2BC68;outline-offset:2px}
@media (min-width:1024px){
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in:has(>.hp-tn-tdeck)>.hp-tn-grid--capped{grid-auto-rows:auto;align-self:start}
}

/* ==== TICKET LEG LOGOS + TYPE (owner order 2026-10-29) ====
   James, on the shipped stack: "Where is the pictures, where is
   the graphics, team logos?" Every leg row now leads with BOTH
   teams' logos - the verified ESPN marks tonight_bake joins from
   the odds snapshot, the same source the Odds Board renders -
   and the leg type steps up a size: the compact cards made the
   old sizes read tiny. Scoped to the stack; the deck-era rules
   elsewhere in this file stay untouched. A leg whose teams do
   not both resolve renders name-only (fail-closed in the bake),
   so these rules only ever style marks that exist. */
.hp-tn-tstack .hp-tn-leg-logos{display:inline-flex;align-items:center;gap:5px;flex:none}
.hp-tn-tstack .hp-tn-leg-logos img{width:26px;height:26px;object-fit:contain;display:block}
.hp-tn-tstack .hp-tn-leg-main{flex:1 1 auto;min-width:0}
.hp-tn-tstack .hp-tn-leg-pick{font-size:16.5px}
.hp-tn-tstack .hp-tn-leg-line{font-size:16px;font-weight:700}
@media (min-width:1024px){
  .hp-tn-tstack .hp-tn-leg{align-items:center}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-tstack .hp-tn-leg-pick{font-size:17.5px}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-tstack .hp-tn-leg-sub{font-size:12.5px}
  html[data-theme="d3"] body.pv-home.b-scope.pv3-home-v5
  .hp-tonight-in>.hp-tn-tstack .hp-tn-leg-logos img{width:28px;height:28px}
}

/* ============================================================
   HERO KICKROW — NARROW-WIDTH LABEL/CHIP GUARD (2026-10-29)
   Defect: on phone widths the hero band's kicker line
   ("<LEAGUE> · Featured Matchup") could not shrink — its spans
   are nowrap flex items — so the label painted across the row
   gap and collided with the state chip ("LIVE · Q3 4:19",
   tip times). Measured on the live hero: label overran the
   chip by 33px @320 and 9px @344 (WNBA live frame), 104px
   @320 / 64px @360 / 34px @390 (College Football frames).
   Fix (top area of the band only; composition untouched):
   the league name and separator never shrink; the trailing
   label span becomes the one shrinkable item and ellipsizes
   inside the kicker, and the kicker clips at its own box, so
   the label can never reach the chip. The chip is untouched.
   At <=400px the kicker/chip tracking also tightens a notch
   so typical frames keep the full label. Band geometry is
   unchanged — one line at every width, no wrap, no shift
   between rotating frames.
   ============================================================ */
@media (max-width:640px){
  .mh-band .mh-kicker{overflow:hidden}
  .mh-band .mh-kicker>span:first-child,
  .mh-band .mh-kicker .mh-sep{flex:none}
  .mh-band .mh-kicker>span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis}
}
@media (max-width:400px){
  .mh-band .mh-kicker{letter-spacing:.12em;gap:8px}
  .mh-band .mh-statechip{letter-spacing:.10em}
}


/* Daily Ticket refinement: natural-height single feature, never stretch the
   slip to the score rail. Unenhanced stacks remain fully visible without JS. */
#hpTonight .hp-tn-tstack>.hp-tn-ticket--feat{
  border:none;box-shadow:none;
  background:#14304D;color:#FFFFFF;padding:22px;gap:20px;
  height:auto;min-height:0;flex:none;
}
#hpTonight .hp-tn-tstack>.hp-tn-ticket--feat:hover{box-shadow:none}
#hpTonight .hp-tn-tstack>.hp-tn-ticket--feat[hidden]{display:none}
#hpTonight .hp-tn-tstack .hp-tn-thead{flex-direction:row;align-items:flex-start;gap:14px}
#hpTonight .hp-tn-tstack .hp-tn-ttitle{font-size:15px;line-height:1.35;letter-spacing:.15em;color:#F2BC68}
#hpTonight .hp-tn-tstack .hp-tn-tserial{font-size:11px;line-height:1.5;margin-top:10px;color:#9AA7B4;letter-spacing:.08em}
#hpTonight .hp-tn-tstack .hp-tn-return{font-size:clamp(34px,3.8vw,52px);line-height:1;color:#F2BC68}
#hpTonight .hp-tn-tstack .hp-tn-legs{display:flex;flex-direction:column;gap:0;flex:none}
#hpTonight .hp-tn-tstack .hp-tn-leg{display:flex;flex-direction:row;align-items:center;gap:10px;padding:14px 0;margin:0;font-size:16px}
#hpTonight .hp-tn-tstack .hp-tn-leg-logos{gap:3px;width:55px;flex:none}
#hpTonight .hp-tn-tstack .hp-tn-leg-logos img{width:26px;height:26px}
#hpTonight .hp-tn-tstack .hp-tn-leg-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
#hpTonight .hp-tn-tstack .hp-tn-leg-pick,#hpTonight .hp-tn-tstack .hp-tn-leg-picktx{color:#FFFFFF;font-size:16px;line-height:1.3;overflow-wrap:anywhere;text-decoration:none}
#hpTonight .hp-tn-tstack .hp-tn-leg-line{color:#FFFFFF;font-size:16px;font-weight:650;flex:none;font-variant-numeric:tabular-nums}
#hpTonight .hp-tn-tstack .hp-dt-market{color:#A9B4C0;font-size:11px;line-height:1.3;font-weight:500}
#hpTonight .hp-tn-tstack .hp-tn-leg-sub{display:block;font-size:10px;line-height:1.4;color:#9AA7B4;font-weight:400}
#hpTonight .hp-dt-state{font-size:11px;color:#B9C3CE}
#hpTonight .hp-tn-leg-dot--live{background:#F46B62}
#hpTonight .hp-tn-tstack .hp-tn-tfoot{position:relative;margin:0;padding:17px 0 0;border-top:1px dashed rgba(169,180,192,.3);font-size:12px;color:#A9B4C0;line-height:1.6}
#hpTonight .hp-tn-tstack .hp-tn-tfoot:before,#hpTonight .hp-tn-tstack .hp-tn-tfoot:after{content:'';position:absolute;top:-6px;width:10px;height:10px;border-radius:50%;background:#0C121B;border:1px solid rgba(242,188,104,.45)}
#hpTonight .hp-tn-tstack .hp-tn-tfoot:before{left:-28px}
#hpTonight .hp-tn-tstack .hp-tn-tfoot:after{right:-28px}
#hpTonight .hp-dt-payout{display:block}
#hpTonight .hp-tn-tret{color:#F2BC68;font-weight:700}
#hpTonight .hp-dt-link{display:block;color:#FFFFFF;font-size:12px;margin-top:10px}
#hpTonight .hp-dt-choices{display:flex;flex-wrap:wrap;gap:6px}
#hpTonight .hp-dt-choices button{min-height:44px;padding:9px 14px;border:1px solid #394554;border-radius:2px;background:transparent;color:#A9B4C0;font-family:inherit;font-weight:600;font-size:12px;line-height:1.2;letter-spacing:.08em;cursor:pointer}
#hpTonight .hp-dt-choices button[aria-pressed="true"]{background:#202D3D;color:#FFFFFF;border-color:#8C98A6}
#hpTonight .hp-dt-choices button:focus-visible,#hpTonight .hp-tn-ticket:focus-visible{outline:2px solid #F2BC68;outline-offset:3px}
@media(max-width:360px){
 #hpTonight .hp-tn-tstack>.hp-tn-ticket--feat{padding:18px}
 #hpTonight .hp-tn-tstack .hp-tn-leg{gap:7px}
 #hpTonight .hp-tn-tstack .hp-tn-leg-logos{width:47px}
 #hpTonight .hp-tn-tstack .hp-tn-leg-logos img{width:22px;height:22px}
 #hpTonight .hp-tn-tstack .hp-tn-ttitle{font-size:13px}
 #hpTonight .hp-tn-tstack .hp-tn-tfoot:before{left:-24px}
 #hpTonight .hp-tn-tstack .hp-tn-tfoot:after{right:-24px}
}

#hpTonight .hp-tn-leg-dot[hidden]{display:none}