/* ==========================================================================
   THE CSF WIRE — shared design system
   Chicago Sports Fans Fantasy Football League
   Aesthetic: sports-desk broadsheet. Dense, ruled, utilitarian.
   ========================================================================== */

/* ---------- self-hosted fonts (no Google Fonts dependency) ---------- */
@font-face{font-family:'Anton';src:url('/assets/fonts/anton.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Bebas Neue';src:url('/assets/fonts/bebas-neue.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/assets/fonts/dm-sans-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/assets/fonts/dm-sans-400i.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/assets/fonts/dm-sans-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Space Mono';src:url('/assets/fonts/space-mono-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}

:root{
  --navy:#0B1B33;
  --navy-2:#122845;
  --navy-3:#1B3A61;
  --ink:#101720;
  --sky:#4FB3E8;
  --orange:#E8551C;
  --orange-hot:#FF6A2B;
  --red:#D6252C;
  --paper:#EFEBE3;
  --card:#FFFFFF;
  --line:#D8D2C6;
  --line-2:#EDE8DE;
  --muted:#6E7686;
  --text:#161C26;
  --text-2:#39424F;

  --shadow:0 1px 0 rgba(16,23,32,.06), 0 8px 24px rgba(16,23,32,.07);
  --wrap:1240px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--paper);
  color:var(--text);
  font-family:'DM Sans',-apple-system,Segoe UI,sans-serif;
  font-size:16px;line-height:1.55;
  overflow-x:hidden;
  background-image:
    radial-gradient(circle at 8% 2%, rgba(232,85,28,.05), transparent 34%),
    radial-gradient(circle at 92% 40%, rgba(11,27,51,.05), transparent 38%);
}
img{max-width:100%;height:auto;display:block}
a{color:var(--orange);text-decoration:none}
a:hover{text-decoration:underline}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px}
.grain{position:fixed;inset:0;pointer-events:none;z-index:200;opacity:.2;mix-blend-mode:multiply}

/* ---------- utility type ---------- */
.eyebrow{
  font-family:'Bebas Neue',sans-serif;font-size:14px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--orange);line-height:1;
}
.label{
  font-size:10px;font-weight:700;letter-spacing:.19em;text-transform:uppercase;
  color:var(--muted);
}
.mono{font-family:'Space Mono',monospace;font-weight:700}

/* ==========================================================================
   CHROME — utility bar / masthead / nav / ticker
   ========================================================================== */

.flagbar{height:9px;display:flex;width:100%}
.flagbar i{flex:1;display:block}
.flagbar i:nth-child(odd){background:var(--sky)}
.flagbar i:nth-child(even){background:var(--paper)}

.utility{
  background:var(--ink);color:#9AA3B2;
  font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
}
.utility .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:34px}
.utility .u-left{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.utility .u-right{color:var(--orange-hot);white-space:nowrap;display:flex;align-items:center;gap:9px}
.utility .dot{width:7px;height:7px;border-radius:50%;background:var(--red);flex:none;animation:pulse 1.9s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.72)}}
@media(max-width:720px){.utility .u-left{display:none}.utility .wrap{justify-content:center}}

.masthead{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.masthead::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    repeating-linear-gradient(115deg, rgba(255,255,255,.028) 0 2px, transparent 2px 9px);
}
.masthead .wrap{display:flex;align-items:center;gap:20px;padding-top:16px;padding-bottom:16px;position:relative;z-index:1}
.brand{display:flex;align-items:center;gap:15px;text-decoration:none;color:#fff;flex:none}
.brand:hover{text-decoration:none}
.brand img{width:56px;height:auto;flex:none}
.brand .wordmark{line-height:.84}
.brand .wordmark b{
  display:block;font-family:'Anton',sans-serif;font-size:36px;letter-spacing:.01em;
  text-transform:uppercase;color:#fff;
}
.brand .wordmark b em{font-style:normal;color:var(--orange-hot)}
.brand .wordmark span{
  display:block;font-size:9px;font-weight:700;letter-spacing:.21em;text-transform:uppercase;
  color:var(--sky);margin-top:6px;
}
.mast-right{margin-left:auto;text-align:right;flex:none}
.mast-right .kick{font-size:9.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#7F8CA0}
.mast-right .big{font-family:'Anton',sans-serif;font-size:26px;color:var(--orange-hot);letter-spacing:.01em;line-height:1.05}
@media(max-width:780px){
  .brand img{width:44px}
  .brand .wordmark b{font-size:27px}
  .mast-right{display:none}
}

nav.sections{background:var(--navy-2);border-top:1px solid rgba(255,255,255,.08);position:relative;z-index:5}
nav.sections .wrap{display:flex;gap:0;overflow-x:auto;scrollbar-width:none}
nav.sections .wrap::-webkit-scrollbar{display:none}
nav.sections a{
  font-family:'Bebas Neue',sans-serif;font-size:17px;letter-spacing:.13em;
  color:#B9C3D2;padding:12px 17px;white-space:nowrap;text-decoration:none;
  border-bottom:3px solid transparent;transition:color .15s ease,background .15s ease,border-color .15s ease;
}
nav.sections a:hover{color:#fff;background:rgba(255,255,255,.06);text-decoration:none}
nav.sections a.on{color:#fff;border-bottom-color:var(--orange);background:rgba(232,85,28,.12)}

/* primary action, pushed to the right and treated as a button */
nav.sections a.nav-cta{
  margin-left:auto;align-self:center;background:var(--orange);color:#fff;
  border-bottom:0;border-radius:3px;padding:8px 20px;margin-right:2px;
  box-shadow:0 2px 0 rgba(0,0,0,.25);
}
nav.sections a.nav-cta:hover{background:#ff6a2e;color:#fff}
nav.sections a.nav-cta.on{background:#fff;color:var(--navy);box-shadow:0 2px 0 rgba(0,0,0,.25)}

.ticker{
  background:var(--ink);color:#fff;border-bottom:3px solid var(--orange);
  display:flex;align-items:stretch;overflow:hidden;
}
.ticker .tk-tag{
  background:var(--red);color:#fff;flex:none;display:flex;align-items:center;
  font-family:'Bebas Neue',sans-serif;font-size:15px;letter-spacing:.15em;padding:0 14px;
}
.ticker .tk-run{overflow:hidden;flex:1;position:relative}
.ticker .tk-move{
  display:inline-flex;white-space:nowrap;padding:9px 0;
  animation:tick 46s linear infinite;
}
.ticker:hover .tk-move{animation-play-state:paused}
.ticker .tk-move span{
  font-size:12.5px;font-weight:500;letter-spacing:.02em;color:#D7DDE6;padding:0 22px;
  border-right:1px solid rgba(255,255,255,.13);
}
.ticker .tk-move span b{color:var(--orange-hot);font-weight:700;letter-spacing:.06em}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ticker .tk-move{animation:none}}

/* ==========================================================================
   SECTION HEADS
   ========================================================================== */
.sect{margin-top:44px}
.sect-head{
  display:flex;align-items:center;gap:14px;
  border-bottom:3px solid var(--ink);padding-bottom:7px;margin-bottom:22px;
}
.sect-head h2{
  font-family:'Anton',sans-serif;font-size:clamp(22px,3.2vw,30px);
  letter-spacing:.02em;text-transform:uppercase;line-height:1;
}
.sect-head h2 em{font-style:normal;color:var(--orange)}
.sect-head .rule{flex:1;height:1px;background:var(--line)}
.sect-head .more{
  font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);flex:none;
}
.sect-head .more a{color:var(--orange)}

/* ==========================================================================
   FRONT PAGE GRID
   ========================================================================== */
.front{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:34px;margin-top:30px;align-items:start}
@media(max-width:980px){.front{grid-template-columns:minmax(0,1fr);gap:26px}}

/* ---- lead ---- */
.lead{
  background:var(--card);border:1px solid var(--line);border-top:5px solid var(--orange);
  box-shadow:var(--shadow);overflow:hidden;
}
.lead .lead-art{
  position:relative;background:var(--navy);color:#fff;padding:34px 32px 30px;overflow:hidden;
}
.lead .lead-art::before{
  content:"13";position:absolute;right:-14px;bottom:-58px;
  font-family:'Anton',sans-serif;font-size:280px;line-height:.7;
  color:rgba(255,255,255,.055);pointer-events:none;
}
.lead .lead-art::after{
  content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--sky);
}
.lead .tagrow{display:flex;align-items:center;gap:10px;position:relative;margin-bottom:16px;flex-wrap:wrap}
.tag-pill{
  font-family:'Bebas Neue',sans-serif;font-size:14px;letter-spacing:.14em;
  background:var(--orange);color:#fff;padding:3px 11px 2px;
}
.tag-pill.red{background:var(--red)}
.tag-pill.ghost{background:transparent;border:1.5px solid rgba(255,255,255,.3);color:#B9C3D2}
.lead h1{
  font-family:'Anton',sans-serif;
  font-size:clamp(34px,5.6vw,62px);line-height:.96;letter-spacing:.005em;
  text-transform:uppercase;position:relative;
}
.lead h1 em{font-style:normal;color:var(--orange-hot)}
.lead .dek{
  margin-top:18px;font-size:17px;color:#C9D0DB;max-width:640px;position:relative;
  border-left:3px solid var(--orange);padding-left:16px;
}
.lead .lead-foot{
  display:flex;align-items:center;gap:16px;padding:16px 32px;flex-wrap:wrap;
  border-top:1px solid var(--line);background:#FBFAF7;
}
@media(max-width:620px){.lead .lead-art{padding:26px 20px 24px}.lead .lead-foot{padding:14px 20px}}

/* ---- byline ---- */
.byline{display:flex;align-items:center;gap:12px}
.byline img{width:52px;height:52px;border-radius:50%;flex:none;background:transparent}
.byline .who{line-height:1.25}
.byline .who b{display:block;font-size:14.5px;font-weight:700;color:var(--text)}
.byline .who span{display:block;font-size:10.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.byline.big img{width:78px;height:78px}
.byline.big .who b{font-size:18px}

.btn{
  display:inline-block;font-family:'Bebas Neue',sans-serif;font-size:17px;letter-spacing:.13em;
  background:var(--ink);color:#fff;padding:9px 20px 7px;text-decoration:none;
  border:2px solid var(--ink);transition:background .15s ease,color .15s ease,transform .15s ease;
}
.btn:hover{background:var(--orange);border-color:var(--orange);color:#fff;text-decoration:none;transform:translateY(-2px)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:#fff}
.btn.hot{background:var(--orange);border-color:var(--orange)}
.btn.hot:hover{background:var(--ink);border-color:var(--ink)}

/* ---- secondary story cards ---- */
.stories{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin-top:22px}
.card{
  background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);
  display:flex;flex-direction:column;transition:transform .16s ease,box-shadow .16s ease;
  position:relative;overflow:hidden;
}
.card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--navy)}
.card.o::before{background:var(--orange)}
.card.r::before{background:var(--red)}
.card.s::before{background:var(--sky)}
.card:hover{transform:translateY(-4px);box-shadow:0 2px 0 rgba(16,23,32,.08),0 16px 34px rgba(16,23,32,.13)}
.card .card-body{padding:20px 20px 18px;display:flex;flex-direction:column;flex:1}
.card .kick{font-family:'Bebas Neue',sans-serif;font-size:13.5px;letter-spacing:.15em;color:var(--orange);margin-bottom:8px}
.card.r .kick{color:var(--red)}
.card.s .kick{color:var(--navy-3)}
.card h3{
  font-family:'Anton',sans-serif;font-size:20px;line-height:1.08;letter-spacing:.01em;
  text-transform:uppercase;margin-bottom:9px;
}
.card h3 a{color:var(--text)}
.card h3 a:hover{color:var(--orange);text-decoration:none}
.card p{font-size:14.5px;color:var(--text-2);margin-bottom:12px}
.card .card-foot{
  margin-top:auto;padding-top:11px;border-top:1px solid var(--line-2);
  font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);
  display:flex;justify-content:space-between;gap:10px;
}

/* ==========================================================================
   RAIL MODULES
   ========================================================================== */
.rail{display:flex;flex-direction:column;gap:22px;position:sticky;top:14px}
@media(max-width:980px){.rail{position:static}}
.mod{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow)}
.mod-head{
  background:var(--ink);color:#fff;padding:9px 15px;
  font-family:'Bebas Neue',sans-serif;font-size:16px;letter-spacing:.16em;
  display:flex;justify-content:space-between;align-items:center;gap:10px;
}
.mod-head span{font-family:'DM Sans',sans-serif;font-size:9.5px;font-weight:700;letter-spacing:.14em;color:var(--sky)}
.mod-body{padding:16px 15px}

/* countdown */
.cd{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border-bottom:1px solid var(--line)}
.cd div{background:#fff;padding:13px 4px 10px;text-align:center}
.cd b{display:block;font-family:'Anton',sans-serif;font-size:30px;line-height:1;color:var(--navy);letter-spacing:.01em}
.cd span{display:block;font-size:8.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-top:5px}
.cd-when{padding:13px 15px;background:var(--navy);color:#fff;text-align:center}
.cd-when b{display:block;font-family:'Anton',sans-serif;font-size:20px;letter-spacing:.02em;color:var(--orange-hot);line-height:1.12}
.cd-when span{font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#9AA3B2}

/* seat meter */
.seats{display:flex;gap:5px;margin:4px 0 13px}
.seats i{flex:1;height:26px;background:var(--navy);border:1px solid var(--navy)}
.seats i.open{background:transparent;border:1px dashed var(--muted)}
.seat-note{font-size:13.5px;color:var(--text-2)}
.seat-note b{color:var(--text)}

/* mini list */
.mini{list-style:none}
.mini li{display:flex;gap:11px;padding:10px 0;border-bottom:1px solid var(--line-2);align-items:baseline}
.mini li:last-child{border-bottom:0;padding-bottom:0}
.mini li .n{font-family:'Space Mono',monospace;font-weight:700;font-size:14px;color:var(--orange);flex:none;min-width:46px;text-align:right}
.mini li .n.chalk{color:var(--navy-3)}
.mini li p{font-size:13.5px;line-height:1.4;color:var(--text-2)}
.mini li p b{color:var(--text);font-weight:700}

/* ==========================================================================
   ARTICLE
   ========================================================================== */
.article-head{background:var(--navy);color:#fff;position:relative;overflow:hidden;padding:38px 0 32px;margin-bottom:0}
.article-head::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 84% 12%, rgba(232,85,28,.25), transparent 52%);
  pointer-events:none;
}
.article-head .wrap{position:relative;z-index:1;max-width:900px}
.article-head .wrap:has(.head-grid){max-width:1180px}
.article-head h1{
  font-family:'Anton',sans-serif;font-size:clamp(32px,5.6vw,60px);line-height:.98;
  letter-spacing:.005em;text-transform:uppercase;margin:16px 0 0;
}
.article-head h1 em{font-style:normal;color:var(--orange-hot);display:block}
.article-head .dek{margin-top:18px;font-size:18px;color:#C9D0DB;border-left:3px solid var(--orange);padding-left:16px;max-width:700px}
.article-head .byline{margin-top:26px;padding-top:18px;border-top:1px solid rgba(255,255,255,.16)}
.article-head .byline .who b{color:#fff}
.article-head .byline .who span{color:var(--sky)}
.article-head .byline img{filter:drop-shadow(0 4px 14px rgba(0,0,0,.45))}
.dateline{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#8894A6;margin-left:auto;text-align:right;line-height:1.7}
@media(max-width:640px){.dateline{margin-left:0;text-align:left;width:100%;padding-top:8px}}

.article{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:38px;margin-top:34px;align-items:start}
@media(max-width:980px){.article{grid-template-columns:minmax(0,1fr);gap:26px}}

.prose{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);padding:36px 40px 34px;min-width:0}
@media(max-width:620px){.prose{padding:24px 20px 22px}}
.prose > p{font-size:17.5px;line-height:1.62;margin-bottom:17px;color:var(--text)}
.prose > p.stand-first{font-size:20px;line-height:1.5}
.prose > p.stand-first::first-letter{
  float:left;font-family:'Anton',sans-serif;font-size:62px;line-height:.78;
  padding:5px 10px 0 0;color:var(--orange);
}
.prose h2{
  font-family:'Anton',sans-serif;font-size:clamp(24px,3.6vw,32px);text-transform:uppercase;
  letter-spacing:.01em;line-height:1.02;margin:38px 0 6px;padding-top:22px;border-top:3px solid var(--ink);
}
.prose h2 .num{color:var(--orange);margin-right:10px}
.prose h3{
  font-family:'Anton',sans-serif;font-size:21px;text-transform:uppercase;letter-spacing:.015em;
  margin:26px 0 8px;line-height:1.1;
}
.prose h3 .slug{
  display:block;font-family:'Bebas Neue',sans-serif;font-size:13px;letter-spacing:.16em;
  color:var(--orange);margin-bottom:4px;
}
.prose ul{margin:0 0 17px 20px}
.prose li{font-size:16.5px;margin-bottom:7px}
.pull{
  border-left:5px solid var(--orange);background:#FBF7F1;
  padding:16px 20px;margin:22px 0;font-size:17px;font-style:italic;color:var(--text);
}
.pull b{font-style:normal}
.verdict{
  border:2px solid var(--ink);background:var(--navy);color:#D7DDE6;
  padding:14px 18px;margin:18px 0 24px;font-size:15.5px;
}
.verdict b{
  display:block;font-family:'Bebas Neue',sans-serif;font-size:14px;letter-spacing:.17em;
  color:var(--orange-hot);margin-bottom:5px;
}
.kicker-note{
  background:#FBF7F1;border:2px dashed var(--muted);padding:18px 20px;margin:26px 0;font-size:15px;color:var(--text-2);
}
.kicker-note h6{font-family:'Anton',sans-serif;font-size:17px;text-transform:uppercase;letter-spacing:.02em;margin-bottom:7px;color:var(--text)}
.kicker-note b{color:var(--text)}
.signoff{
  margin-top:34px;padding-top:20px;border-top:3px solid var(--ink);
  font-size:15px;color:var(--text-2);font-style:italic;
}
.signoff b{font-style:normal;color:var(--text)}

/* ==========================================================================
   BALLOT / OPTIONS
   ========================================================================== */
.options{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:14px;margin:22px 0 6px}
.opt{
  background:var(--card);border:1px solid var(--line);border-top:4px solid var(--navy);
  padding:20px 18px 16px;display:flex;flex-direction:column;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
.opt:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-top-color:var(--orange)}
.opt .letter{font-family:'Anton',sans-serif;font-size:40px;line-height:.8;color:var(--orange);margin-bottom:9px}
.opt h4{font-family:'Anton',sans-serif;font-size:19px;text-transform:uppercase;letter-spacing:.015em;line-height:1.06;margin-bottom:9px}
.opt p{font-size:14px;color:var(--text-2);margin-bottom:9px}
.opt .cruel{
  margin-top:auto;padding-top:9px;border-top:1px solid var(--line-2);
  font-size:9.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);
}
.opt .cruel b{color:var(--red)}

/* ==========================================================================
   ODDS BOARD
   ========================================================================== */
.board{border:1px solid var(--line);background:var(--ink);overflow-x:auto;box-shadow:var(--shadow)}
.board table{width:100%;border-collapse:collapse;min-width:560px}
.board thead th{
  background:var(--navy);color:var(--sky);
  font-family:'Bebas Neue',sans-serif;font-size:15px;letter-spacing:.16em;
  text-align:left;padding:10px 15px;font-weight:400;
}
.board thead th:last-child{text-align:right}
.board tbody td{padding:12px 15px;border-bottom:1px solid rgba(255,255,255,.09);font-size:15px;color:#C5CCD8;vertical-align:top}
.board tbody tr:nth-child(even){background:rgba(255,255,255,.03)}
.board tbody tr:hover{background:rgba(232,85,28,.11)}
.board tbody tr:last-child td{border-bottom:0}
.board .prop b{color:#fff;display:block;font-size:15px;margin-bottom:2px}
.board .prop span{font-size:13px;color:#8894A6;display:block}
.board .num{
  font-family:'Space Mono',monospace;font-weight:700;font-size:16px;
  text-align:right;white-space:nowrap;color:var(--orange-hot);
}
.board .num.chalk{color:var(--sky)}

/* ==========================================================================
   STANDINGS / DATA TABLE
   ========================================================================== */
.data{border:1px solid var(--line);background:#fff;overflow-x:auto;box-shadow:var(--shadow)}
.data table{width:100%;border-collapse:collapse;min-width:620px}
.data thead th{
  background:var(--ink);color:#fff;font-family:'Bebas Neue',sans-serif;font-size:15px;
  letter-spacing:.14em;text-align:left;padding:10px 14px;font-weight:400;
}
.data tbody td{padding:12px 14px;border-bottom:1px solid var(--line-2);font-size:15px;vertical-align:top}
.data tbody tr:nth-child(even){background:#FBFAF7}
.data tbody tr:first-child{background:rgba(232,85,28,.09)}
.data tbody tr:last-child td{border-bottom:0}
.data .pos{font-family:'Anton',sans-serif;font-size:17px;color:var(--orange)}
.data .tname{font-weight:700}
.data .tname small{display:block;font-weight:400;color:var(--muted);font-size:12.5px}
.data .wl{font-family:'Space Mono',monospace;font-weight:700;font-size:14px}
.data .say{font-size:14px;color:var(--text-2);font-style:italic}

/* ==========================================================================
   TEAM CARDS
   ========================================================================== */
.teams{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:16px}
.team{
  background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);
  display:flex;flex-direction:column;overflow:hidden;
  transition:transform .16s ease,box-shadow .16s ease;
}
.team:hover{transform:translateY(-4px);box-shadow:0 2px 0 rgba(16,23,32,.08),0 16px 34px rgba(16,23,32,.13)}
.team-top{
  background:var(--navy);color:#fff;padding:15px 17px 13px;display:flex;align-items:center;gap:13px;min-height:78px;
  position:relative;overflow:hidden;
}
.team-top::after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--sky)}
.team.champ .team-top::after{background:var(--orange)}
.team.new .team-top::after{background:var(--red)}
.abbr{
  font-family:'Anton',sans-serif;font-size:17px;letter-spacing:.02em;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);
  padding:7px 9px 5px;min-width:54px;text-align:center;flex:none;color:var(--sky);
}
.team.champ .abbr{color:var(--orange-hot);border-color:rgba(255,106,43,.45)}
.team-top h3{font-family:'Anton',sans-serif;font-size:17.5px;text-transform:uppercase;letter-spacing:.015em;line-height:1.06}
.team-top .mgr{font-size:11px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:#94A0B2;margin-top:3px}
.team-body{padding:16px 17px 15px;display:flex;flex-direction:column;flex:1}
.team-body .badge{
  display:inline-block;align-self:flex-start;font-size:9.5px;font-weight:700;letter-spacing:.15em;
  text-transform:uppercase;padding:3px 8px;margin-bottom:10px;
  background:var(--line-2);color:var(--muted);
}
.team.champ .badge{background:var(--orange);color:#fff}
.team.new .badge{background:var(--red);color:#fff}
.team-body p{font-size:14px;color:var(--text-2)}
.team-foot{
  margin-top:auto;padding:11px 17px;border-top:1px solid var(--line-2);background:#FBFAF7;
  display:flex;justify-content:space-between;gap:10px;align-items:center;
}
.team-foot .rec{font-family:'Space Mono',monospace;font-weight:700;font-size:15px;color:var(--navy)}
.team-foot .rec-l{font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.team.open{border-style:dashed;border-color:var(--muted);background:transparent;box-shadow:none}
.team.open .team-top{background:transparent;border-bottom:1px dashed var(--muted)}
.team.open .team-top::after{display:none}
.team.open .team-top h3{color:var(--muted)}
.team.open .abbr{background:transparent;border-style:dashed;border-color:var(--muted);color:var(--muted)}

/* ==========================================================================
   FOOTER
   ========================================================================== */
footer.site{background:var(--ink);color:#8B94A4;margin-top:56px;padding:40px 0 30px;position:relative;overflow:hidden}
footer.site::before{
  content:"CSF";position:absolute;right:-2%;bottom:-46%;
  font-family:'Anton',sans-serif;font-size:clamp(150px,26vw,330px);
  color:rgba(255,255,255,.032);line-height:.8;pointer-events:none;
}
footer.site .wrap{position:relative;z-index:1}
.foot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:28px;margin-bottom:28px}
.foot-grid h6{font-family:'Bebas Neue',sans-serif;font-size:16px;letter-spacing:.16em;color:#fff;margin-bottom:11px}
.foot-grid ul{list-style:none}
.foot-grid li{margin-bottom:7px;font-size:14px}
.foot-grid a{color:#8B94A4}
.foot-grid a:hover{color:var(--orange-hot)}
.foot-grid p{font-size:13.5px;line-height:1.6}
.foot-bar{border-top:1px solid rgba(255,255,255,.12);padding-top:18px;font-size:12px;line-height:1.7}
.foot-bar b{color:#C5CCD8}

/* ==========================================================================
   MOTION
   ========================================================================== */
.rise{opacity:0;transform:translateY(18px);animation:rise .55s cubic-bezier(.2,.7,.3,1) forwards}
@keyframes rise{to{opacity:1;transform:none}}
.d1{animation-delay:.04s}.d2{animation-delay:.11s}.d3{animation-delay:.18s}.d4{animation-delay:.25s}.d5{animation-delay:.32s}
@media (prefers-reduced-motion:reduce){.rise{animation:none;opacity:1;transform:none}}


/* ==========================================================================
   COLUMNIST CARD — the big Felipe module in the story rail
   ========================================================================== */
.columnist{
  background:var(--navy);border:1px solid var(--ink);box-shadow:var(--shadow);
  position:relative;overflow:hidden;
}
.columnist::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(circle at 50% 24%, rgba(79,179,232,.20), transparent 58%),
    repeating-linear-gradient(115deg, rgba(255,255,255,.03) 0 2px, transparent 2px 9px);
}
.columnist .col-head{
  background:var(--red);color:#fff;padding:8px 15px;position:relative;z-index:2;
  font-family:'Bebas Neue',sans-serif;font-size:16px;letter-spacing:.17em;
  display:flex;justify-content:space-between;align-items:center;gap:10px;
}
.columnist .col-head span{
  font-family:'DM Sans',sans-serif;font-size:9.5px;font-weight:700;letter-spacing:.14em;color:#FFD9CB;
}
.columnist .col-art{position:relative;z-index:2;padding:18px 16px 6px}
.columnist .col-art img{
  width:100%;height:auto;max-width:300px;margin:0 auto;display:block;
  filter:drop-shadow(0 12px 30px rgba(0,0,0,.55));
  animation:float 7s ease-in-out infinite;
}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media (prefers-reduced-motion:reduce){.columnist .col-art img{animation:none}}
.columnist .col-body{position:relative;z-index:2;padding:6px 18px 20px;text-align:center}
.columnist .col-body b{
  display:block;font-family:'Anton',sans-serif;font-size:26px;letter-spacing:.02em;
  text-transform:uppercase;color:#fff;line-height:1;
}
.columnist .col-body .title{
  display:block;font-size:10px;font-weight:700;letter-spacing:.19em;text-transform:uppercase;
  color:var(--sky);margin-top:7px;
}
.columnist .col-body q{
  display:block;margin-top:14px;padding-top:13px;border-top:1px solid rgba(255,255,255,.16);
  font-size:14px;font-style:italic;color:#C5CCD8;line-height:1.5;
}
.columnist .col-body .sig{
  display:block;margin-top:9px;font-family:'Bebas Neue',sans-serif;font-size:15px;
  letter-spacing:.18em;color:var(--orange-hot);
}

/* Felipe alongside the article headline, desktop only */
.article-head .head-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:38px;align-items:center}
@media(max-width:900px){
  .article-head .head-grid{grid-template-columns:minmax(0,1fr)}
  .article-head .head-art{display:none}
}
.article-head .head-art img{width:100%;height:auto;filter:drop-shadow(0 14px 34px rgba(0,0,0,.5))}

/* ==========================================================================
   FORMS — registration, ballot, prop picker
   ========================================================================== */
.form-wrap{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);padding:0;overflow:hidden}
.form-head{background:var(--ink);color:#fff;padding:16px 22px}
.form-head h2{font-family:'Anton',sans-serif;font-size:clamp(21px,3.4vw,28px);text-transform:uppercase;letter-spacing:.02em;line-height:1.05}
.form-head p{font-size:14.5px;color:#AEB8C6;margin-top:7px;max-width:640px}
.form-body{padding:26px 24px 24px}
@media(max-width:600px){.form-body{padding:20px 16px 20px}.form-head{padding:14px 16px}}

fieldset{border:0;margin:0 0 30px}
fieldset:last-of-type{margin-bottom:20px}
legend{
  font-family:'Anton',sans-serif;font-size:19px;text-transform:uppercase;letter-spacing:.02em;
  padding:0 0 9px;margin-bottom:16px;width:100%;border-bottom:3px solid var(--ink);
  display:flex;align-items:baseline;gap:10px;
}
legend .step{color:var(--orange)}
legend .hint{
  margin-left:auto;font-family:'DM Sans',sans-serif;font-size:10px;font-weight:700;
  letter-spacing:.15em;color:var(--muted);text-transform:uppercase;
}
legend .hint.warn{color:var(--red)}
legend .hint.done{color:#1F7A46}

.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.field{display:flex;flex-direction:column;min-width:0}
.field.wide{grid-column:1/-1}
.field label{
  font-size:10.5px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  color:var(--text-2);margin-bottom:6px;
}
.field label .req{color:var(--red)}
.field input,.field textarea,.field select{
  font-family:'DM Sans',sans-serif;font-size:16px;color:var(--text);
  background:#FBFAF7;border:2px solid var(--line);padding:11px 13px;width:100%;
  transition:border-color .15s ease,background .15s ease;
}
.field textarea{min-height:92px;resize:vertical;line-height:1.5}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--orange);background:#fff}
.field input::placeholder,.field textarea::placeholder{color:#A3ABB8}
.field .help{font-size:12.5px;color:var(--muted);margin-top:6px;line-height:1.45}
.field.bad input,.field.bad textarea,.field.bad select{border-color:var(--red);background:#FFF6F5}
.field select{
  appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:38px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%23E8551C' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;background-size:12px 8px;
}
.field select:invalid{color:#A3ABB8}
.field[hidden]{display:none}

/* ballot radio cards */
.ballot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(212px,1fr));gap:12px}
.pick{position:relative;display:block;cursor:pointer}
.pick input{position:absolute;opacity:0;width:0;height:0}
.pick .box{
  border:2px solid var(--line);background:#FBFAF7;padding:16px 15px 14px;height:100%;
  display:flex;flex-direction:column;transition:border-color .15s ease,background .15s ease,transform .15s ease;
}
.pick:hover .box{border-color:var(--muted);transform:translateY(-2px)}
.pick input:checked + .box{border-color:var(--orange);background:#FFF4EE;box-shadow:inset 0 0 0 1px var(--orange)}
.pick input:focus-visible + .box{outline:3px solid var(--sky);outline-offset:2px}
.pick .letter{font-family:'Anton',sans-serif;font-size:32px;line-height:.85;color:var(--muted);margin-bottom:7px}
.pick input:checked + .box .letter{color:var(--orange)}
.pick h4{font-family:'Anton',sans-serif;font-size:17px;text-transform:uppercase;letter-spacing:.015em;line-height:1.08;margin-bottom:7px}
.pick p{font-size:13.5px;color:var(--text-2)}
.pick .cruel{margin-top:auto;padding-top:9px;font-size:9.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.pick .cruel b{color:var(--red)}
.pick .tick{
  position:absolute;top:9px;right:9px;width:23px;height:23px;border-radius:50%;
  background:var(--orange);color:#fff;font-size:13px;font-weight:700;
  display:none;align-items:center;justify-content:center;
}
.pick input:checked ~ .tick{display:flex}

/* prop picker */
.picker{border:2px solid var(--ink);background:var(--ink)}
.picker-bar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:11px 15px;background:var(--navy);color:#fff;
  font-family:'Bebas Neue',sans-serif;font-size:16px;letter-spacing:.15em;
}
.picker-bar .count{font-family:'Space Mono',monospace;font-size:15px;color:var(--orange-hot);letter-spacing:0}
.picker-bar .count.full{color:#5FD08A}
.plist{display:block;max-height:none}
.prow{display:block;cursor:pointer;border-bottom:1px solid rgba(255,255,255,.1)}
.prow:last-child{border-bottom:0}
.prow input{position:absolute;opacity:0;width:0;height:0}
.prow .pinner{
  display:grid;grid-template-columns:26px minmax(0,1fr) 74px;gap:13px;align-items:start;
  padding:13px 15px;transition:background .14s ease;
}
.prow:hover .pinner{background:rgba(255,255,255,.05)}
.prow input:checked + .pinner{background:rgba(232,85,28,.16)}
.prow input:focus-visible + .pinner{outline:2px solid var(--sky);outline-offset:-2px}
.prow.locked{cursor:not-allowed}
.prow.locked .pinner{opacity:.36}
.prow.locked:hover .pinner{background:transparent}
.chk{
  width:22px;height:22px;border:2px solid rgba(255,255,255,.4);flex:none;margin-top:1px;
  display:flex;align-items:center;justify-content:center;color:transparent;font-weight:700;font-size:13px;
  transition:background .14s ease,border-color .14s ease,color .14s ease;
}
.prow input:checked + .pinner .chk{background:var(--orange);border-color:var(--orange);color:#fff}
.prow .ptext b{display:block;color:#fff;font-size:15px;line-height:1.3;margin-bottom:3px}
.prow .ptext span{display:block;color:#8894A6;font-size:13px;line-height:1.4}
.prow .pnum{
  font-family:'Space Mono',monospace;font-weight:700;font-size:16px;text-align:right;
  color:var(--orange-hot);white-space:nowrap;padding-top:1px;
}
.prow .pnum.chalk{color:var(--sky)}
@media(max-width:560px){
  .prow .pinner{grid-template-columns:24px minmax(0,1fr);gap:11px}
  .prow .pnum{grid-column:2;text-align:left;font-size:15px;padding-top:5px}
}

/* submit + status */
.submit-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:8px;padding-top:20px;border-top:3px solid var(--ink)}
button.btn-send{
  font-family:'Anton',sans-serif;font-size:21px;letter-spacing:.03em;text-transform:uppercase;
  background:var(--orange);color:#fff;border:3px solid var(--orange);padding:13px 30px 11px;
  cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .15s ease;
}
button.btn-send:hover:not(:disabled){background:var(--ink);border-color:var(--ink);transform:translateY(-2px)}
button.btn-send:disabled{opacity:.5;cursor:not-allowed;transform:none}
.submit-note{font-size:13.5px;color:var(--muted);flex:1;min-width:200px}
.status{display:none;padding:14px 17px;font-size:15px;margin-top:16px;border:2px solid}
.status.show{display:block}
.status.err{background:#FFF3F2;border-color:var(--red);color:#8C1119}
.status.ok{background:#F0FAF3;border-color:#1F7A46;color:#155B33}
.done-panel{display:none;text-align:center;padding:44px 24px}
.done-panel.show{display:block}
.done-panel .big{font-family:'Anton',sans-serif;font-size:clamp(30px,6vw,50px);text-transform:uppercase;line-height:1;color:var(--orange)}
.done-panel p{font-size:16.5px;color:var(--text-2);margin-top:14px;max-width:520px;margin-left:auto;margin-right:auto}
.done-panel .sig{margin-top:20px;font-family:'Bebas Neue',sans-serif;font-size:17px;letter-spacing:.18em;color:var(--muted)}

/* ==========================================================================
   RESULTS
   ========================================================================== */
.tally{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.tbar{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);padding:16px 15px}
.tbar .letter{font-family:'Anton',sans-serif;font-size:30px;line-height:.9;color:var(--orange)}
.tbar h5{font-family:'Anton',sans-serif;font-size:15px;text-transform:uppercase;letter-spacing:.015em;margin:7px 0 10px;line-height:1.1}
.tbar .meter{height:9px;background:var(--line-2);overflow:hidden}
.tbar .meter i{display:block;height:100%;background:var(--orange);width:0;transition:width .7s cubic-bezier(.2,.7,.3,1)}
.tbar .n{font-family:'Space Mono',monospace;font-size:13px;color:var(--muted);margin-top:8px;display:block}
.tbar.lead{border-color:var(--orange);box-shadow:0 0 0 2px rgba(232,85,28,.25),var(--shadow)}
.quotebox{background:var(--navy);color:#D7DDE6;border-left:5px solid var(--orange);padding:16px 20px;margin-bottom:12px}
.quotebox q{font-size:16.5px;font-style:italic;display:block;line-height:1.5}
.quotebox cite{display:block;margin-top:9px;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--sky)}
.empty{padding:34px 22px;text-align:center;color:var(--muted);font-size:15.5px;font-style:italic;background:var(--card);border:2px dashed var(--line)}

/* ==========================================================================
   MOBILE — nothing scrolls sideways but the ticker
   ========================================================================== */

/* stop any stray wide child from pushing the page */
body{overflow-x:clip}
.wrap,.prose,.mod,.card,.team,.opt,.form-wrap{min-width:0}
.prose > p,.prose li,.card p,.team-body p,.opt p{overflow-wrap:break-word;word-break:break-word}

@media(max-width:820px){
  /* masthead: let the wordmark shrink instead of clipping */
  .masthead .wrap{gap:12px}
  .brand{flex:1;min-width:0}
  .brand img{width:40px}
  .brand .wordmark{min-width:0;flex:1}
  .brand .wordmark b{font-size:clamp(19px,6.2vw,30px);white-space:nowrap}
  .brand .wordmark span{
    font-size:8px;letter-spacing:.15em;margin-top:5px;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;
  }
  /* nav wraps into rows — no hidden items, no sideways scroll */
  nav.sections .wrap{flex-wrap:wrap;overflow-x:visible;padding-left:10px;padding-right:10px}
  nav.sections a{font-size:15px;letter-spacing:.1em;padding:9px 12px;flex:0 0 auto}
  nav.sections a.nav-cta{margin-left:0;margin-top:6px;margin-bottom:6px;padding:9px 20px}
}
@media(max-width:430px){
  .brand .wordmark span{display:none}
  .brand .wordmark b{font-size:clamp(20px,7.4vw,28px)}
  .utility .wrap{height:30px}
  .ticker .tk-tag{font-size:13px;padding:0 10px}
}

/* data tables collapse into stacked rows */
@media(max-width:700px){
  .data{overflow-x:visible}
  .data table{min-width:0;display:block}
  .data thead{display:none}
  .data tbody,.data tr{display:block;width:100%}
  .data tr{border-bottom:2px solid var(--line);padding:12px 0}
  .data tr:last-child{border-bottom:0}
  .data tbody td{
    display:grid;grid-template-columns:34% 1fr;gap:10px;align-items:baseline;
    border:0;padding:5px 14px;font-size:14.5px;
  }
  .data tbody td::before{
    content:attr(data-label);font-size:9.5px;font-weight:700;letter-spacing:.13em;
    text-transform:uppercase;color:var(--muted);line-height:1.5;
  }
  .data tbody td:empty{display:none}
  .data .tname small{margin-top:2px}
}

/* prop board table collapses too */
@media(max-width:700px){
  .board{overflow-x:visible}
  .board table{min-width:0;display:block}
  .board thead{display:none}
  .board tbody,.board tr{display:block;width:100%}
  .board tr{border-bottom:1px solid rgba(255,255,255,.11);padding:12px 15px}
  .board tr:last-child{border-bottom:0}
  .board tbody td{display:block;border:0;padding:0}
  .board .num{text-align:left;margin-top:7px}
}

@media(max-width:560px){
  .prose > p.stand-first{font-size:18px}
  .prose > p.stand-first::first-letter{font-size:50px}
  .prose h2{font-size:24px}
  .sect-head{flex-wrap:wrap;gap:8px}
  .sect-head .rule{display:none}
  .sect-head .more{width:100%;text-align:left}
  .cd b{font-size:26px}
  .options,.ballot-grid,.teams,.stories{grid-template-columns:minmax(0,1fr)}
  .lead h1{font-size:clamp(29px,8.2vw,42px)}
  .submit-row{flex-direction:column;align-items:stretch}
  button.btn-send{width:100%}
  .foot-grid{gap:22px}
}

/* ==========================================================================
   BRAND HERO — the crest, given the room it deserves
   ========================================================================== */
.hero{
  background:var(--navy);color:#fff;position:relative;overflow:hidden;
  border-bottom:4px solid var(--orange);
}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(circle at 50% 8%, rgba(79,179,232,.26), transparent 58%),
    radial-gradient(circle at 88% 88%, rgba(232,85,28,.22), transparent 55%),
    repeating-linear-gradient(115deg, rgba(255,255,255,.03) 0 2px, transparent 2px 10px);
}
.hero::after{
  content:"CSF";position:absolute;right:-3%;bottom:-42%;
  font-family:'Anton',sans-serif;font-size:clamp(200px,30vw,420px);
  color:rgba(255,255,255,.035);line-height:.8;letter-spacing:-.03em;pointer-events:none;
}
.hero .wrap{position:relative;z-index:2;padding-top:34px;padding-bottom:30px}
.hero-inner{display:flex;align-items:center;gap:38px;justify-content:center;text-align:left}
.hero-crest{flex:none;width:clamp(150px,20vw,236px)}
.hero-crest img{width:100%;height:auto;filter:drop-shadow(0 14px 40px rgba(0,0,0,.55))}
.hero-words{min-width:0;max-width:640px}
.hero-words h1{
  font-family:'Anton',sans-serif;text-transform:uppercase;
  font-size:clamp(34px,6.4vw,74px);line-height:.9;letter-spacing:.004em;
}
.hero-words h1 em{font-style:normal;color:var(--orange-hot);display:block}
.hero-words .tag{
  margin-top:14px;font-size:11px;font-weight:700;letter-spacing:.24em;
  text-transform:uppercase;color:var(--sky);
}
.hero-words .blurb{
  margin-top:16px;font-size:16.5px;color:#C5CCD8;max-width:520px;
  border-left:3px solid var(--orange);padding-left:15px;
}
.hero-meta{
  display:flex;flex-wrap:wrap;gap:9px;margin-top:20px;
  font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
}
.hero-meta span{border:2px solid rgba(255,255,255,.24);padding:6px 12px;color:#AEB8C6}
.hero-meta span.hi{border-color:var(--orange);color:var(--orange-hot)}
@media(max-width:820px){
  .hero-inner{flex-direction:column;gap:22px;text-align:center}
  .hero-words .blurb{border-left:0;border-top:3px solid var(--orange);padding-left:0;padding-top:13px;margin-left:auto;margin-right:auto}
  .hero-meta{justify-content:center}
  .hero-crest{width:clamp(140px,44vw,210px)}
}

/* ==========================================================================
   CHICAGO SCOREBOARD
   ========================================================================== */
.scorestrip{
  background:var(--ink);border-top:1px solid rgba(255,255,255,.1);
  border-bottom:3px solid var(--sky);
}
.scorestrip .wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;padding-left:0;padding-right:0}
@media(max-width:760px){.scorestrip .wrap{grid-template-columns:1fr}}
.scard{
  background:var(--ink);padding:13px 18px;display:flex;align-items:center;gap:13px;
  border-right:1px solid rgba(255,255,255,.09);min-width:0;
}
.scard:last-child{border-right:0}
.scard img{width:34px;height:34px;object-fit:contain;flex:none}
.scard .sc-body{min-width:0;flex:1}
.scard .sc-top{
  display:flex;align-items:baseline;gap:8px;
  font-family:'Bebas Neue',sans-serif;font-size:16px;letter-spacing:.11em;color:#fff;
}
.scard .sc-top .rec{
  font-family:'Space Mono',monospace;font-size:11.5px;letter-spacing:0;color:var(--sky);
}
.scard .sc-line{
  font-size:12.5px;color:#9AA3B2;margin-top:3px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.scard .sc-line b{color:#fff;font-weight:700}
.scard .sc-line .live{color:var(--red);font-weight:700}
.scard .sc-line .win{color:#5FD08A;font-weight:700}
.scard.err .sc-line{color:#6E7686;font-style:italic}
.sc-skel{color:#6E7686;font-size:12.5px;font-style:italic}

/* ==========================================================================
   CHICAGO NEWS
   ========================================================================== */
.chi-news{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:16px}
.chi-item{
  background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);
  display:flex;flex-direction:column;overflow:hidden;
  transition:transform .16s ease,box-shadow .16s ease;
}
.chi-item:hover{transform:translateY(-4px);box-shadow:0 2px 0 rgba(16,23,32,.08),0 16px 34px rgba(16,23,32,.13)}
.chi-item .shot{aspect-ratio:16/9;background:var(--navy);overflow:hidden}
.chi-item .shot img{width:100%;height:100%;object-fit:cover;display:block}
.chi-item .chi-body{padding:15px 16px 14px;display:flex;flex-direction:column;flex:1}
.chi-item .who{
  font-family:'Bebas Neue',sans-serif;font-size:13.5px;letter-spacing:.15em;
  color:var(--orange);margin-bottom:7px;
}
.chi-item h4{font-family:'Anton',sans-serif;font-size:17px;line-height:1.12;text-transform:uppercase;letter-spacing:.01em;margin-bottom:8px}
.chi-item h4 a{color:var(--text)}
.chi-item h4 a:hover{color:var(--orange);text-decoration:none}
.chi-item p{font-size:14px;color:var(--text-2)}
.chi-item .when{
  margin-top:auto;padding-top:11px;border-top:1px solid var(--line-2);
  font-size:9.5px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);
}

/* full team panels on /chicago */
.teampanels{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:18px}
.tpanel{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden}
.tpanel .tp-head{
  background:var(--navy);color:#fff;padding:17px 18px;display:flex;align-items:center;gap:14px;
  border-bottom:4px solid var(--sky);
}
.tpanel .tp-head img{width:48px;height:48px;object-fit:contain;flex:none}
.tpanel .tp-head h3{font-family:'Anton',sans-serif;font-size:20px;text-transform:uppercase;letter-spacing:.015em;line-height:1.05}
.tpanel .tp-head .sub{font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--sky);margin-top:4px}
.tpanel .tp-body{padding:16px 18px 17px}
.tpanel .tp-row{display:flex;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid var(--line-2);font-size:14.5px}
.tpanel .tp-row:last-child{border-bottom:0}
.tpanel .tp-row span:first-child{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding-top:3px}
.tpanel .tp-row span:last-child{text-align:right;font-weight:700;color:var(--text);min-width:0}
.tpanel .mono{font-family:'Space Mono',monospace}

/* front-page hero sits flush under the ticker */
.hero + .scorestrip{margin-bottom:0}
.scorestrip + .wrap > .front{margin-top:26px}

/* four punishment options read better as a clean 2x2 than 3-plus-orphan */
@media(min-width:900px){ .ballot-grid{grid-template-columns:repeat(2,1fr)} }


/* --------------------------------------------------------------------------
   ORIENTATION STRIP — front page, directly under the hero band.
   Says what this site is versus what CBS Sports Fantasy is.
   -------------------------------------------------------------------------- */
.whatis{background:var(--ink);border-bottom:3px solid var(--orange);color:#DCE3EC}
.whatis .wrap{
  display:flex;align-items:center;gap:22px;
  padding-top:15px;padding-bottom:15px;
}
.whatis p{margin:0;font-size:15px;line-height:1.55;min-width:0}
.whatis p b{color:#fff;font-family:'Bebas Neue',sans-serif;font-size:19px;
  letter-spacing:.06em;margin-right:7px}
.whatis a{
  flex:none;font-family:'Bebas Neue',sans-serif;font-size:15px;letter-spacing:.13em;
  color:#fff;border:1px solid rgba(255,255,255,.35);padding:8px 16px;border-radius:3px;
  text-decoration:none;transition:background .15s ease,border-color .15s ease;
}
.whatis a:hover{background:var(--orange);border-color:var(--orange);text-decoration:none}
@media(max-width:760px){
  .whatis .wrap{flex-direction:column;align-items:flex-start;gap:13px}
  .whatis p{font-size:14.5px}
  .whatis a{align-self:stretch;text-align:center}
}

/* the three-column "what runs when" board on /masthead */
.phases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:22px 0 6px}
.phase{border:1px solid var(--line);background:#fff;padding:17px 17px 15px}
.phase h5{
  font-family:'Bebas Neue',sans-serif;font-size:17px;letter-spacing:.09em;
  color:var(--orange);margin:0 0 4px;
}
.phase .when{
  font-size:10px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;
  color:var(--text-2);margin-bottom:11px;
}
.phase ul{margin:0;padding-left:17px}
.phase li{font-size:14px;line-height:1.5;margin-bottom:7px}
.phase li:last-child{margin-bottom:0}
@media(max-width:860px){ .phases{grid-template-columns:1fr} }
