/* Layout: a broadcast listings sheet. One column, 760px measure, picks as big-number rows, slate as a dense table.
   Colours and faces come from the skin tokens below; this block only shapes. */
*, *::before, *::after { box-sizing: border-box; }
body { background: var(--bg); color: var(--ink); font-family: var(--body); font-size: 16px; line-height: 1.45; -webkit-font-smoothing: antialiased; }
.wrap { max-width: 760px; margin: 0 auto; padding-block: 20px 56px; padding-inline: 16px; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--ink); color: var(--bg); padding: 8px 12px; z-index: 10; }
.skip:focus { left: 8px; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
header.brand { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; border-bottom: 3px solid var(--ink); padding-bottom: 10px; position: relative; }
header.brand h1 { font-family: var(--display); font-weight: 800; font-size: 44px; letter-spacing: .5px; margin: 0; text-transform: uppercase; line-height: 1; }
header.brand h1 a { color: inherit; text-decoration: none; }
header.brand h1 span { color: var(--accent); }
header.brand .meta { color: var(--muted); font-size: 14px; }
.skins { margin-left: auto; display: flex; gap: 4px; align-items: center; }
.skins button { font: 600 12px/1 var(--body); letter-spacing: .8px; text-transform: uppercase; padding: 9px 12px; min-height: 36px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); cursor: pointer; }
.skins button[aria-pressed="true"] { background: var(--ink); color: var(--bg); border-color: var(--ink); }
nav.site { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 10px; font-size: 14px; }
nav.site a { color: var(--muted); text-decoration: none; font-weight: 600; padding: 6px 0; min-height: 32px; display: inline-flex; align-items: center; } nav.site a:hover, nav.site a.on { color: var(--accent); }
.intro { margin: 18px 0 0; padding: 14px 16px; background: var(--surface); border: 1px solid var(--line); border-left: 6px solid var(--accent); display: flex; gap: 14px; align-items: flex-start; }
.intro p { margin: 0; font-size: 17px; max-width: 62ch; }
.intro button { margin-left: auto; flex: none; font: 600 12px/1 var(--body); text-transform: uppercase; letter-spacing: .8px; padding: 10px 12px; min-height: 36px; border: 1px solid var(--line); background: var(--bg); color: var(--ink); cursor: pointer; }
h2, h3.sec { font-family: var(--display); text-transform: uppercase; letter-spacing: 1px; font-size: 22px; margin: 32px 0 10px; text-wrap: balance; font-weight: 700; }
h2 small, h3.sec small { font-family: var(--body); text-transform: none; letter-spacing: 0; color: var(--muted); font-weight: 400; font-size: 14px; margin-left: 8px; }
.picks { display: grid; gap: 10px; }
.pick { display: grid; grid-template-columns: 72px 1fr; gap: 0 14px; background: var(--surface); border: 1px solid var(--line); padding: 12px 14px; align-items: start; }
.pick .num { font-family: var(--display); font-weight: 800; font-size: 44px; line-height: 1; color: var(--accent); font-variant-numeric: tabular-nums; }
.pick .num small { display: block; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; color: var(--muted); font-family: var(--body); font-weight: 600; margin-top: 2px; }
.pick .game { font-family: var(--display); font-size: 24px; font-weight: 700; line-height: 1.1; min-width: 0; }
.pick .game .at, .hip .game .at, .gamehead .game .at { color: var(--muted); font-weight: 400; }
.rk { color: var(--accent); font-weight: 800; }
.when { color: var(--muted); font-size: 14px; margin-top: 2px; } .when b { color: var(--ink); font-variant-numeric: tabular-nums; }
.why { margin-top: 6px; font-size: 15px; }
.actions { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 8px; }
.btn { font-size: 13px; font-weight: 600; text-decoration: none; color: var(--ink); border: 1px solid var(--line); padding: 9px 12px; min-height: 36px; display: inline-flex; align-items: center; background: var(--bg); }
.btn:hover { border-color: var(--ink); }
.btn.cal { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.pill { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; padding: 2px 7px; border: 1px solid currentColor; }
.pill.disney { color: var(--accent); }
.hip { background: var(--surface); border: 1px solid var(--line); border-left: 6px solid var(--warm); padding: 14px 16px; }
.hip .game { font-family: var(--display); font-size: 26px; font-weight: 700; line-height: 1.1; }
.hip p { margin: 8px 0 0; } .hip .fine { color: var(--muted); font-size: 14px; margin-top: 6px; }
table { border-collapse: collapse; width: 100%; font-size: 14px; }
.tablewrap { overflow-x: auto; }
th { text-align: left; font-size: 12px; letter-spacing: .8px; text-transform: uppercase; color: var(--muted); font-weight: 700; padding: 6px 8px; border-bottom: 2px solid var(--line); }
td { padding: 8px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
td.n { font-family: var(--display); font-weight: 800; font-size: 20px; color: var(--accent); font-variant-numeric: tabular-nums; width: 44px; }
td.t { white-space: nowrap; font-variant-numeric: tabular-nums; }
td.a a { font-size: 13px; color: var(--ink); }
a.gl { color: inherit; text-decoration: none; } a.gl:hover { text-decoration: underline; }
.verdict { font-weight: 800; font-family: var(--display); font-size: 17px; text-transform: uppercase; letter-spacing: .5px; white-space: nowrap; }
.v-worth { color: var(--good); } .v-maybe { color: var(--warm); } .v-skip { color: var(--skip); }
nav.jump { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
nav.jump a { font-family: var(--display); font-weight: 700; text-transform: uppercase; letter-spacing: .8px; font-size: 15px; text-decoration: none; color: var(--ink); border: 1px solid var(--line); padding: 7px 12px; min-height: 36px; display: inline-flex; align-items: center; background: var(--surface); }
nav.jump a:hover { border-color: var(--accent); color: var(--accent); }
section.league { margin-top: 36px; border-top: 3px solid var(--ink); padding-top: 6px; }
section.league h2.league-name { font-size: 32px; margin: 8px 0 0; color: var(--accent); }
details.slate summary { cursor: pointer; list-style: none; } details.slate summary::-webkit-details-marker { display: none; }
details.slate summary h2::after, details.slate summary h3::after { content: " \25BE"; color: var(--muted); font-size: 18px; } details.slate[open] summary h2::after, details.slate[open] summary h3::after { content: " \25B4"; }
nav.crumbs { font-size: 13px; color: var(--muted); margin-top: 12px; } nav.crumbs a { color: var(--muted); } nav.crumbs span { margin: 0 4px; }
p.lead { font-size: 17px; margin: 14px 0 0; max-width: 65ch; }
.gamehead { display: grid; grid-template-columns: 96px 1fr; gap: 0 16px; align-items: start; margin-top: 18px; }
.gamehead .num { font-family: var(--display); font-weight: 800; font-size: 64px; line-height: 1; color: var(--accent); font-variant-numeric: tabular-nums; }
.gamehead .num small { display: block; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; color: var(--muted); font-family: var(--body); font-weight: 600; }
.gamehead .game { font-family: var(--display); font-size: 34px; font-weight: 700; line-height: 1.05; }
.comps { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; margin-top: 14px; }
.comp { border: 1px solid var(--line); background: var(--surface); padding: 8px 10px; }
.comp b { display: block; font-family: var(--display); font-size: 22px; } .comp span { font-size: 12px; letter-spacing: .6px; text-transform: uppercase; color: var(--muted); }
details.spoiler { margin-top: 18px; border: 1px solid var(--line); background: var(--surface); padding: 10px 14px; }
details.spoiler summary { cursor: pointer; font-weight: 700; padding: 6px 0; } details.spoiler summary::after { content: "  (reveals the result)"; color: var(--muted); font-weight: 400; }
.wp { width: 100%; max-width: 100%; height: auto; margin-top: 10px; }
.verdict-big { font-family: var(--display); font-size: 40px; font-weight: 800; text-transform: uppercase; }
.hublist { display: grid; gap: 6px; } .hublist a { color: inherit; padding: 2px 0; }
footer { margin-top: 40px; color: var(--muted); font-size: 14px; border-top: 1px solid var(--line); padding-top: 12px; }
footer p { margin: 4px 0; max-width: 65ch; }
@media (max-width: 480px) { .pick { grid-template-columns: 56px 1fr; } .pick .num { font-size: 36px; } header.brand h1 { font-size: 36px; } .skins { margin-left: 0; } .gamehead { grid-template-columns: 72px 1fr; } .gamehead .num { font-size: 48px; } }
[hidden] { display: none !important; }
.sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
p.nudge { margin: 12px 0 0; padding: 8px 12px; background: var(--surface); border-left: 4px solid var(--warm); font-weight: 600; max-width: 65ch; }
p.tvlink { margin: 14px 0 0; font-weight: 600; } p.tvlink a { color: var(--accent); }
/* TV guide: hour blocks of rows. Grid areas: t time, c league chip, m matchup, l listing, s score bar or verdict, k calendar. */
[data-sport="football"] { --sport: var(--sport-football); } [data-sport="soccer"] { --sport: var(--sport-soccer); } [data-sport="hockey"] { --sport: var(--sport-hockey); }
.tv-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0 6px; }
.tv-chip { font: 600 13px/1 var(--body); padding: 8px 10px; min-height: 36px; display: inline-flex; align-items: center; color: var(--chip-ink); background: var(--chip-bg); border: 1px solid var(--line); border-left: 4px solid var(--sport); }
button.tv-chip { cursor: pointer; } button.tv-chip[aria-pressed="false"] { background: transparent; color: var(--muted); border-left-color: var(--line); text-decoration: line-through; }
.tv-hour { border-top: 1px solid var(--line); margin-top: 12px; padding-top: 6px; }
.tv-h { font-family: var(--display); font-size: 20px; font-weight: 700; line-height: 1.2; color: var(--muted); background: var(--tv-band); margin: 0 0 4px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; font-variant-numeric: tabular-nums; }
.tv-h small { font: 400 13px/1.3 var(--body); color: var(--muted); }
.tv-rows { list-style: none; margin: 0; padding: 0; }
.tv-row { display: grid; grid-template-columns: 44px 58px minmax(0, 1fr) minmax(0, 150px) 124px 64px; grid-template-areas: "t c m l s k"; gap: 4px 10px; align-items: center; padding: 6px; min-height: 48px; background: var(--tv-row); }
.tv-rows .tv-row:nth-child(even) { background: var(--tv-row-alt); }
.tv-row > time { grid-area: t; font-weight: 700; font-size: 15px; font-variant-numeric: tabular-nums; }
.tv-lg { grid-area: c; justify-self: start; font: 700 12px/1 var(--body); letter-spacing: .6px; text-transform: uppercase; text-decoration: none; color: var(--sport); background: var(--chip-bg); border: 1px solid var(--sport); padding: 4px 6px; white-space: nowrap; }
.tv-m { grid-area: m; min-width: 0; font-size: 15px; } .tv-mu { font-weight: 600; } .tv-m .at { color: var(--muted); font-weight: 400; }
.tv-pick { display: inline-block; margin-left: 8px; font-size: 12px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; padding: 2px 6px; color: var(--accent-ink); background: var(--accent); vertical-align: 1px; white-space: nowrap; }
.tv-tv { grid-area: l; color: var(--muted); font-size: 13px; min-width: 0; overflow-wrap: anywhere; }
.tv-s { grid-area: s; display: flex; align-items: center; gap: 8px; justify-content: flex-end; }
.tv-bar { display: inline-flex; gap: 2px; } .tv-bar i { display: block; width: 6px; height: 14px; background: var(--line); }
.tv-row.hot .tv-bar i.on { background: var(--accent); } .tv-row.below .tv-bar i.on { background: var(--muted); }
.tv-n { font-family: var(--display); font-weight: 800; font-size: 20px; line-height: 1; color: var(--accent); min-width: 2ch; text-align: right; font-variant-numeric: tabular-nums; }
.tv-s .verdict { font-size: 15px; } .tv-soon { color: var(--muted); font-size: 13px; }
.tv-cal { grid-area: k; justify-self: end; font-size: 13px; font-weight: 600; color: var(--ink); background: var(--bg); border: 1px solid var(--line); min-height: 36px; padding: 0 10px; display: inline-flex; align-items: center; text-decoration: none; white-space: nowrap; }
.tv-cal:hover { border-color: var(--ink); }
/* below the bar: faded to 70 percent, text in ink so it still reads at AA; started games (script only) at 50 percent */
.tv-row.below:not(.done) { opacity: .7; }
.tv-row.below:not(.done) .tv-n, .tv-row.below:not(.done) .tv-tv, .tv-row.below:not(.done) .at, .tv-row.below:not(.done) .tv-lg, .tv-row.below:not(.done) .rk { color: var(--ink); }
.tv-row.past, .tv-row.below.past { opacity: .62; }   /* .5 failed AA in Sheet light (3.3:1); .62 clears 4.5 */
.tv-now { list-style: none; display: flex; align-items: center; gap: 8px; margin: 6px 0; color: var(--accent); font: 700 13px/1 var(--body); letter-spacing: .8px; text-transform: uppercase; }
.tv-now::after { content: ""; flex: 1; border-top: 2px solid var(--accent); }
@media (max-width: 640px) {
  .tv-row { grid-template-columns: 44px auto minmax(0, 1fr) auto auto; grid-template-areas: "t c m m m" "t l l s k"; }
  .tv-row > time { align-self: start; padding-top: 2px; } .tv-lg { align-self: start; margin-top: 1px; } .tv-m { align-self: start; }
}
/* Masthead controls: the TV market selector and the skin switcher, both groups of real buttons with aria-pressed */
.ctls { margin-left: auto; display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; }
.ctls .skins { margin-left: 0; }
.mkts .lbl { font: 700 12px/1 var(--body); letter-spacing: .8px; text-transform: uppercase; color: var(--muted); margin-right: 2px; }
.mkts button { padding-inline: 9px; }
/* TV listings per market: every market in the markup; with a market chosen (html[data-market], set before first paint)
   only that one shows; without scripts they read as one inline list "FI Viaplay · SE Viaplay · ...". */
.tvm > i { font-style: normal; color: var(--muted); }
.tv-mk[data-mk="other"] { display: none; }
html[data-market] .tvm > i, html[data-market] .tv-mk, html[data-market] .tv-mk > b { display: none; }
html[data-market="fi"] .tv-mk[data-mk="fi"], html[data-market="se"] .tv-mk[data-mk="se"], html[data-market="de"] .tv-mk[data-mk="de"], html[data-market="uk"] .tv-mk[data-mk="uk"], html[data-market="us"] .tv-mk[data-mk="us"], html[data-market="other"] .tv-mk[data-mk="other"] { display: inline; }
a.tv-mk { color: inherit; }
.wtw th[scope="row"] { text-transform: none; letter-spacing: 0; font-size: 14px; font-weight: 600; color: var(--ink); border-bottom: 1px solid var(--line); vertical-align: top; white-space: nowrap; width: 1%; }
.wtw a { color: var(--ink); font-weight: 600; }
.wtw .wtw-e { display: block; } .wtw .wtw-e + .wtw-e { margin-top: 6px; }
.wtw small { display: block; color: var(--muted); font-size: 13px; }
html[data-market="fi"] .wtw tr[data-mk="fi"], html[data-market="se"] .wtw tr[data-mk="se"], html[data-market="de"] .wtw tr[data-mk="de"], html[data-market="uk"] .wtw tr[data-mk="uk"], html[data-market="us"] .wtw tr[data-mk="us"], html[data-market="other"] .wtw tr[data-mk="other"] { background: var(--surface); box-shadow: inset 4px 0 0 var(--accent); }
main > p a { color: var(--accent); }
p.tellline { margin: 8px 0 0; font-size: 14px; } p.tellline a { color: var(--accent); font-weight: 600; }
/* corrections form */
.cform { display: grid; gap: 12px; max-width: 560px; margin-top: 16px; }
.cform label { display: grid; gap: 4px; font-weight: 600; font-size: 14px; }
.cform label small { font-weight: 400; color: var(--muted); }
.cform input, .cform select, .cform textarea { font: 16px/1.4 var(--body); color: var(--ink); background: var(--surface); border: 1px solid var(--line); padding: 8px 10px; min-height: 42px; width: 100%; }
.cform textarea { min-height: 96px; resize: vertical; }
.cform .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cform button, .mailbox button { justify-self: start; font: 600 14px/1 var(--body); padding: 12px 16px; min-height: 44px; background: var(--ink); color: var(--bg); border: 1px solid var(--ink); cursor: pointer; }
.mailbox { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; }
.mailbox code { font: 600 16px/1.2 var(--body); padding: 11px 12px; background: var(--surface); border: 1px solid var(--line); color: var(--ink); user-select: all; }
.mailbox button { background: var(--bg); color: var(--ink); border-color: var(--line); }
@media (max-width: 480px) { .ctls { margin-left: 0; } .cform .row2 { grid-template-columns: 1fr; } }
/* one orchestrated reveal on load; off when the visitor prefers reduced motion */
@media (prefers-reduced-motion: no-preference) {
  .pick, .hip { animation: rise .45s cubic-bezier(.2,.7,.2,1) both; }
  .picks .pick:nth-child(2) { animation-delay: .06s } .picks .pick:nth-child(3) { animation-delay: .12s } .picks .pick:nth-child(4) { animation-delay: .18s } .picks .pick:nth-child(5) { animation-delay: .24s }
  @keyframes rise { from { opacity: .001; transform: translateY(8px) } to { opacity: 1; transform: none } }
  .btn, .skins button, nav.jump a { transition: border-color .15s, background-color .15s, color .15s; }
}

:root, html[data-skin="calm"] {
  --bg: #f5f6f8; --surface: #ffffff; --ink: #121a2b; --muted: #58627a; --line: #d9dde5;
  --accent: #b8102a; --accent-ink: #ffffff; --warm: #8c6200; --good: #1f7a4d; --skip: #626b7e; --focus: #b8102a;
  --sport-football: #8a3a00; --sport-soccer: #0a6150; --sport-hockey: #2142a0;
  --tv-band: transparent; --tv-row: transparent; --tv-row-alt: transparent; --chip-bg: var(--surface); --chip-ink: var(--ink);
  --display: "Barlow Condensed", "Arial Narrow", Impact, sans-serif; --body: "Barlow", "Helvetica Neue", Arial, sans-serif; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):not([data-skin="broadcast"]) {
  --bg: #0f141d; --surface: #171d28; --ink: #eef1f6; --muted: #a3adbe; --line: #2a3340;
  --accent: #ff5c70; --accent-ink: #14060a; --warm: #f2b705; --good: #4ccb86; --skip: #8d97a8; --focus: #ffd166;
  --sport-football: #f5a25d; --sport-soccer: #4fd1b5; --sport-hockey: #8fb4ff;
  --tv-band: transparent; --tv-row: transparent; --tv-row-alt: transparent; --chip-bg: var(--surface); --chip-ink: var(--ink); color-scheme: dark } }
:root[data-theme="dark"]:not([data-skin="broadcast"]) {
  --bg: #0f141d; --surface: #171d28; --ink: #eef1f6; --muted: #a3adbe; --line: #2a3340;
  --accent: #ff5c70; --accent-ink: #14060a; --warm: #f2b705; --good: #4ccb86; --skip: #8d97a8; --focus: #ffd166;
  --sport-football: #f5a25d; --sport-soccer: #4fd1b5; --sport-hockey: #8fb4ff;
  --tv-band: transparent; --tv-row: transparent; --tv-row-alt: transparent; --chip-bg: var(--surface); --chip-ink: var(--ink); color-scheme: dark }

html[data-skin="broadcast"] {
  --bg: #0b1a3a; --surface: #12255a; --ink: #f4f7ff; --muted: #b7c6ee; --line: #2e4a93;
  --accent: #ffd400; --accent-ink: #0b1a3a; --warm: #ffa133; --good: #5dff91; --skip: #9db0dc; --focus: #ffd400; --red: #e0162b;
  --sport-football: #ff9f43; --sport-soccer: #3ee6b0; --sport-hockey: #8fc2ff;
  --tv-band: linear-gradient(90deg, #1b3c9a, #0d2060); --tv-row: #12255a; --tv-row-alt: #0e1e48; --chip-bg: #c8102e; --chip-ink: #ffffff;
  --display: "Oswald", "Arial Narrow", sans-serif; --body: "Barlow", Arial, sans-serif; color-scheme: dark; }
html[data-skin="broadcast"] body { background: var(--bg); background-image: repeating-linear-gradient(135deg, transparent 0 18px, rgba(255,255,255,.03) 18px 20px); }
html[data-skin="broadcast"] header.brand { border: 0; margin-top: 10px; padding: 12px 18px 10px; background: linear-gradient(180deg,#1b3c9a,#0d2060); box-shadow: 0 5px 0 var(--accent), 0 9px 0 var(--red); transform: skew(-8deg); }
html[data-skin="broadcast"] header.brand > * { transform: skew(8deg); }
html[data-skin="broadcast"] header.brand h1 { font-style: italic; font-size: 46px; letter-spacing: 1px; text-shadow: 3px 3px 0 var(--red); font-weight: 700; }
html[data-skin="broadcast"] header.brand .meta { color: var(--accent); font-weight: 700; text-transform: uppercase; font-size: 12px; letter-spacing: 1px; }
html[data-skin="broadcast"] .skins button { background: #0a1430; color: #fff; border-color: #2e4a93; font-style: italic; }
html[data-skin="broadcast"] .skins button[aria-pressed="true"] { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
html[data-skin="broadcast"] nav.site { margin-top: 18px; } html[data-skin="broadcast"] nav.site a { color: var(--ink); text-transform: uppercase; font-family: var(--display); letter-spacing: 1px; font-weight: 500; } html[data-skin="broadcast"] nav.site a.on, html[data-skin="broadcast"] nav.site a:hover { color: var(--accent); }
html[data-skin="broadcast"] .intro { background: linear-gradient(90deg, var(--red) 0, var(--red) 8px, #10224f 8px); border: 0; } html[data-skin="broadcast"] .intro button { background: #0a1430; color: #fff; border-color: #2e4a93; }
html[data-skin="broadcast"] nav.jump a { background: linear-gradient(180deg,#2a52c9,#15317e); color: #fff; border: 0; font-style: italic; box-shadow: 0 3px 0 var(--accent); }
html[data-skin="broadcast"] h2, html[data-skin="broadcast"] h3.sec { font-style: italic; letter-spacing: 2px; background: linear-gradient(90deg, var(--red) 0, var(--red) 6px, transparent 6px); padding-left: 14px; font-weight: 700; }
html[data-skin="broadcast"] section.league { border-top: 4px solid var(--accent); } html[data-skin="broadcast"] section.league h2.league-name { color: var(--accent); font-size: 34px; background: none; padding-left: 0; }
html[data-skin="broadcast"] .pick { background: linear-gradient(180deg,#1a3480,#10224f); border: 0; border-left: 10px solid var(--accent); box-shadow: 0 4px 0 #0a1430, inset 0 1px 0 rgba(255,255,255,.15); }
html[data-skin="broadcast"] .pick .num { color: var(--accent); font-style: italic; text-shadow: 2px 2px 0 var(--red); font-weight: 700; }
html[data-skin="broadcast"] .pick .game, html[data-skin="broadcast"] .hip .game, html[data-skin="broadcast"] .gamehead .game { font-style: italic; text-transform: uppercase; letter-spacing: .5px; font-weight: 700; }
html[data-skin="broadcast"] .when b { color: #fff; }
html[data-skin="broadcast"] .btn { background: #0a1430; color: #fff; border-color: #2e4a93; } html[data-skin="broadcast"] .btn.cal { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); font-style: italic; text-transform: uppercase; }
html[data-skin="broadcast"] .hip { background: linear-gradient(180deg,#5a1030,#3a0a1e); border: 0; border-left: 10px solid var(--warm); }
html[data-skin="broadcast"] table { background: #0e1e48; } html[data-skin="broadcast"] th { background: var(--red); color: #fff; letter-spacing: 1px; } html[data-skin="broadcast"] td { border-color: #1e3570; }
html[data-skin="broadcast"] td.n, html[data-skin="broadcast"] .gamehead .num { color: var(--accent); font-style: italic; }
html[data-skin="broadcast"] .verdict, html[data-skin="broadcast"] .verdict-big { font-style: italic; }
html[data-skin="broadcast"] .comp { background: #10224f; border-color: #1e3570; } html[data-skin="broadcast"] details.spoiler { background: #10224f; border-color: #1e3570; }
html[data-skin="broadcast"] footer { color: var(--muted); border-top-color: var(--line); }
html[data-skin="broadcast"] .tv-hour { border-top: 0; margin-top: 14px; padding-top: 0; }
html[data-skin="broadcast"] .tv-h { color: var(--ink); border-left: 8px solid var(--accent); padding: 6px 12px; margin: 0; font-style: italic; text-transform: uppercase; letter-spacing: 1px; box-shadow: 0 3px 0 var(--red); }
html[data-skin="broadcast"] .tv-h small { color: var(--muted); font-style: normal; text-transform: none; letter-spacing: 0; }
html[data-skin="broadcast"] .tv-rows { margin-top: 3px; }
html[data-skin="broadcast"] .tv-lg { color: var(--chip-ink); border: 0; border-left: 4px solid var(--sport); }
html[data-skin="broadcast"] .tv-row.below:not(.done) .tv-lg { color: var(--chip-ink); }
html[data-skin="broadcast"] .tv-chip { border: 0; border-left: 4px solid var(--sport); font-style: italic; text-transform: uppercase; letter-spacing: .6px; }
html[data-skin="broadcast"] button.tv-chip[aria-pressed="false"] { background: transparent; color: var(--muted); border-left-color: var(--line); }
html[data-skin="broadcast"] .tv-mu { font-family: var(--display); font-style: italic; text-transform: uppercase; letter-spacing: .5px; font-weight: 500; }
html[data-skin="broadcast"] .tv-n { font-style: italic; text-shadow: 1px 1px 0 var(--red); }
html[data-skin="broadcast"] .tv-cal { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); font-style: italic; text-transform: uppercase; }
html[data-skin="broadcast"] .mkts .lbl { color: var(--accent); }
html[data-skin="broadcast"] .wtw th[scope="row"] { background: transparent; color: var(--ink); letter-spacing: 0; }
html[data-skin="broadcast"] .wtw a, html[data-skin="broadcast"] .wtw th[scope="row"] { color: var(--ink); }
html[data-skin="broadcast"] .cform input, html[data-skin="broadcast"] .cform select, html[data-skin="broadcast"] .cform textarea { background: #0a1430; border-color: #2e4a93; }
html[data-skin="broadcast"] .cform button { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); font-style: italic; text-transform: uppercase; }
html[data-skin="broadcast"] .mailbox code { background: #0a1430; border-color: #2e4a93; }
html[data-skin="broadcast"] .mailbox button { background: #0a1430; color: #fff; border-color: #2e4a93; }
html[data-skin="broadcast"] .tv-now { color: var(--accent); } html[data-skin="broadcast"] .tv-now span { background: var(--chip-bg); color: var(--chip-ink); padding: 4px 8px; font-style: italic; }