:root{
  --bg:#FAF9F6; --surface:#FFFFFF; --raised:#F3F1EA;
  --ink:#16150F; --ink-2:#3B382C; --muted:#6E6A5C;
  --gold:#8A6E11; --gold-bright:#C9A227; --gold-soft:#F0E4BC;
  --line:#E2DDD0; --line-soft:#EEEAE0;
  --good:#2A6E45; --good-bg:#E4F0E7;
  --warn:#9A5B10; --warn-bg:#FAEEDC;
  --bad:#9E2B2B;  --bad-bg:#F7E3E1;
  --shadow:0 1px 2px rgba(22,21,15,.06), 0 8px 24px -12px rgba(22,21,15,.18);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0E0D09; --surface:#17150E; --raised:#1F1C13;
    --ink:#F4F1E6; --ink-2:#D3CDBA; --muted:#948E7C;
    --gold:#D9B63C; --gold-bright:#EBC84A; --gold-soft:#3A3014;
    --line:#2C2819; --line-soft:#231F15;
    --good:#7FCFA0; --good-bg:#16281D;
    --warn:#E0A855; --warn-bg:#2C2011;
    --bad:#E88B84;  --bad-bg:#2C1615;
    --shadow:0 1px 2px rgba(0,0,0,.5), 0 8px 28px -14px rgba(0,0,0,.8);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0E0D09; --surface:#17150E; --raised:#1F1C13;
  --ink:#F4F1E6; --ink-2:#D3CDBA; --muted:#948E7C;
  --gold:#D9B63C; --gold-bright:#EBC84A; --gold-soft:#3A3014;
  --line:#2C2819; --line-soft:#231F15;
  --good:#7FCFA0; --good-bg:#16281D;
  --warn:#E0A855; --warn-bg:#2C2011;
  --bad:#E88B84;  --bad-bg:#2C1615;
  --shadow:0 1px 2px rgba(0,0,0,.5), 0 8px 28px -14px rgba(0,0,0,.8);
  color-scheme:dark;
}

*{box-sizing:border-box}
.gutter{
  padding-left:max(22px, env(safe-area-inset-left, 0px));
  padding-right:max(22px, env(safe-area-inset-right, 0px));
}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Archivo","Helvetica Neue",Arial,sans-serif;
  font-size:15px; line-height:1.55; -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1120px;margin:0 auto;padding-block:0 80px;
  padding-left:max(22px, env(safe-area-inset-left, 0px));
  padding-right:max(22px, env(safe-area-inset-right, 0px))}
h1,h2,h3{margin:0; text-wrap:balance}
a{color:var(--gold)}
.display{font-family:"Big Shoulders Display","Archivo Narrow",Impact,sans-serif;font-weight:700;letter-spacing:.01em;line-height:.92}
.mono{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-variant-numeric:tabular-nums}
.eyebrow{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold);font-weight:600}

/* ---------- masthead ---------- */
.rafters{
  background:
    repeating-linear-gradient(115deg, transparent 0 38px, rgba(201,162,39,.045) 38px 39px),
    radial-gradient(120% 150% at 50% -30%, rgba(201,162,39,.16), transparent 62%),
    #0E0D09;
  border-bottom:3px solid var(--gold-bright);
  color:#F4F1E6; padding:30px 0 0;
}
.mast{max-width:1120px;margin:0 auto;display:flex;align-items:center;gap:20px;flex-wrap:wrap;
  padding-left:max(22px, env(safe-area-inset-left, 0px));
  padding-right:max(22px, env(safe-area-inset-right, 0px))}
.mast img{width:74px;height:auto;flex:none;mix-blend-mode:screen;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.4))}
@media (max-width:560px){ .mast img{width:56px} }
.mast h1{font-family:"Big Shoulders Display",sans-serif;font-weight:700;line-height:.92;
  font-size:clamp(38px,6.6vw,74px);color:#F4F1E6;letter-spacing:.01em}
.mast h1 span{color:var(--gold-bright)}
.mast .tag{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.14em;
  text-transform:uppercase;color:#A79F87;margin-top:7px}

/* ---------- nav ---------- */
nav.tabs{max-width:1120px;margin:22px auto 0;display:flex;gap:2px;flex-wrap:wrap;
  padding-left:max(22px, env(safe-area-inset-left, 0px));
  padding-right:max(22px, env(safe-area-inset-right, 0px))}
nav.tabs a{
  font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.13em;text-transform:uppercase;
  font-weight:600;text-decoration:none;color:#A79F87;padding:11px 16px;
  border:1px solid transparent;border-bottom:none;border-radius:3px 3px 0 0;
}
nav.tabs a:hover{color:#F4F1E6;background:rgba(201,162,39,.09)}
nav.tabs a[aria-current="page"]{
  color:#0E0D09;background:var(--gold-bright);
}
nav.tabs a:focus-visible{outline:2px solid var(--gold-bright);outline-offset:2px}

/* ---------- strip ---------- */
.strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:3px;overflow:hidden;margin:30px 0 38px}
.strip div{background:var(--surface);padding:14px 16px}
.strip .k{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--muted)}
.strip .v{font-family:"Big Shoulders Display",sans-serif;font-weight:700;font-size:31px;
  line-height:1.05;margin-top:3px;font-variant-numeric:tabular-nums}
.strip .v.gold{color:var(--gold)}
.strip .s{font-size:12px;color:var(--muted);margin-top:1px}

section{margin-bottom:46px;scroll-margin-top:20px}
.shead{display:flex;align-items:baseline;gap:14px;border-bottom:2px solid var(--ink);
  padding-bottom:7px;margin-bottom:18px;flex-wrap:wrap}
.shead h2{font-family:"Big Shoulders Display",sans-serif;font-weight:700;font-size:33px;letter-spacing:.01em}
.shead p{margin:0;color:var(--muted);font-size:13.5px}

/* ---------- red alert ---------- */
.redalert{border:1px solid var(--bad);border-left-width:4px;background:var(--bad-bg);
  color:var(--bad);border-radius:4px;padding:13px 15px;margin:0 0 20px;
  font-weight:700;font-size:13.5px;line-height:1.5}

/* ---------- commissioner note ---------- */
.mandate{background:var(--surface);border:1px solid var(--line);
  border-left:5px solid var(--gold-bright);border-radius:3px;padding:20px 24px}
.mandate p{margin:0 0 13px;font-size:14.5px;line-height:1.62;color:var(--ink-2);max-width:74ch}
.mandate p:last-child{margin-bottom:0}
.mandate b{color:var(--ink);font-weight:700}

/* ---------- collapsible ---------- */
details.fold{border:1px solid var(--line);border-radius:4px;background:var(--surface);
  margin-bottom:10px;overflow:hidden}
details.fold>summary{cursor:pointer;list-style:none;padding:11px 14px;display:flex;
  align-items:center;gap:10px;font-family:"IBM Plex Mono",monospace;font-size:10.5px;
  letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--ink);
  background:var(--raised)}
details.fold>summary::-webkit-details-marker{display:none}
details.fold>summary:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
details.fold>summary .caret{margin-left:auto;font-size:11px;color:var(--muted);
  transition:transform .15s ease}
details.fold[open]>summary .caret{transform:rotate(180deg)}
details.fold .body{padding:14px}

/* ---------- dues ---------- */
.dues{display:grid;grid-template-columns:repeat(auto-fill,minmax(236px,1fr));gap:9px}
.gm{display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:var(--surface);border:1px solid var(--line);border-left-width:4px;
  border-radius:3px;padding:9px 12px}
.gm.full{border-left-color:var(--good)}
.gm.part,.gm.dep{border-left-color:var(--warn)}
.gm.plan{border-left-color:var(--gold-bright)}
.gm.none{border-left-color:var(--bad)}
.gm .who{min-width:0}
.gm .n{font-weight:700;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gm .t{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gm .amt{font-family:"IBM Plex Mono",monospace;font-size:12px;font-weight:600;flex:none;text-align:right}
.gm.full .amt{color:var(--good)}
.gm.part .amt,.gm.plan .amt{color:var(--warn)}
.gm.none .amt{color:var(--bad)}

/* ---------- tables ---------- */
table{width:100%;border-collapse:collapse;font-size:13.5px;background:var(--surface)}
caption{text-align:left;font-family:"IBM Plex Mono",monospace;font-size:10.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:0 0 7px}
th,td{text-align:left;padding:8px 11px;border-bottom:1px solid var(--line-soft);vertical-align:top}
thead th{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);font-weight:600;
  border-bottom:1.5px solid var(--line);background:var(--raised);position:sticky;top:0}
tbody tr:last-child td{border-bottom:none}
td.num,th.num{font-family:"IBM Plex Mono",monospace;font-variant-numeric:tabular-nums;white-space:nowrap}
.tbl{border:1px solid var(--line);border-radius:3px;overflow:hidden}

/* ---------- pills ---------- */
.pill{display:inline-block;font-family:"IBM Plex Mono",monospace;font-size:9.5px;
  letter-spacing:.1em;text-transform:uppercase;font-weight:600;
  padding:2px 7px;border-radius:2px;white-space:nowrap}
.pill.pg{background:var(--gold-soft);color:var(--gold)}
.pill.c{background:var(--good-bg);color:var(--good)}
.pill.f{background:var(--warn-bg);color:var(--warn)}
.pill.me{background:var(--gold-bright);color:#0E0D09}

/* ---------- roster cards ---------- */
.teams{display:grid;grid-template-columns:repeat(auto-fill,minmax(286px,1fr));gap:12px}
.team{background:var(--surface);border:1px solid var(--line);border-radius:3px;overflow:hidden}
.team.mine{border-color:var(--gold-bright);border-width:2px}
.team header{background:var(--raised);padding:10px 13px;border-bottom:1px solid var(--line)}
.team header .nm{font-family:"Big Shoulders Display",sans-serif;font-weight:700;font-size:21px;line-height:1.05}
.team header .mg{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted);margin-top:3px}
.team ol{margin:0;padding:6px 0;list-style:none;counter-reset:p}
.team li{display:flex;align-items:baseline;gap:9px;padding:5px 13px;font-size:13px}
.team li .rd{font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--muted);
  flex:none;width:34px;font-variant-numeric:tabular-nums}
.team li .pn{flex:1;min-width:0}
.team li:nth-child(odd){background:var(--raised)}

/* ---------- search ---------- */
.tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
input[type=search]{
  font-family:"Archivo",sans-serif;font-size:14px;padding:9px 13px;
  border:1px solid var(--line);border-radius:3px;background:var(--surface);
  color:var(--ink);min-width:230px;flex:1;max-width:340px}
input[type=search]:focus-visible{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold)}
.count{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--muted)}
.hidden{display:none !important}

/* ---------- empty / dark state ---------- */
.dark-state{background:var(--surface);border:1px dashed var(--line);border-radius:4px;
  padding:34px 28px;text-align:center}
.dark-state .big{font-family:"Big Shoulders Display",sans-serif;font-weight:700;
  font-size:34px;line-height:1;color:var(--muted)}
.dark-state p{color:var(--muted);font-size:14px;max-width:56ch;margin:11px auto 0}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);margin-top:10px;padding:22px 0 0;
  font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.07em;
  color:var(--muted);display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}

@media (max-width:560px){
  .wrap,.mast,nav.tabs{
    padding-left:max(16px, env(safe-area-inset-left, 0px));
    padding-right:max(16px, env(safe-area-inset-right, 0px))}
  .wrap{padding-block:0 60px}
  nav.tabs a{padding:10px 12px;font-size:10px}
  .shead h2{font-size:27px}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
}

/* ===================== BOTTOMLINE TICKER ===================== */
body{padding-bottom:0}
body.has-bl{padding-bottom:62px}
@media (max-width:560px){ body.has-bl{padding-bottom:56px} }

#bl{
  position:fixed; left:0; right:0; bottom:0; z-index:60;
  display:flex; align-items:stretch;
  height:62px;                 /* fixed: the bar must never grow */
  overflow:hidden;
  background:#0E0D09;
  border-top:2px solid var(--gold-bright);
  box-shadow:0 -6px 22px -10px rgba(0,0,0,.55);
  padding-bottom:env(safe-area-inset-bottom, 0px);
  font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;
}
#bl .brand{
  flex:0 0 auto; display:flex; flex-direction:column; justify-content:center;
  background:var(--gold-bright); color:#0E0D09;
  padding:0 14px 0 max(14px, env(safe-area-inset-left, 0px));
  font-weight:600; letter-spacing:.12em; text-transform:uppercase; white-space:nowrap;
}
#bl .brand .b1{font-size:11px; line-height:1.15}
#bl .brand .b2{font-size:8.5px; opacity:.72; line-height:1.15}

#bl .viewport{flex:1 1 auto; min-width:0; overflow:hidden; position:relative}

/* Nothing in the marquee may shrink or wrap — that is what broke it.
   Flex children default to flex-shrink:1, so the track was being squeezed
   into the viewport width and every item wrapped onto its own lines. */
#bl .track{
  display:flex; flex-wrap:nowrap; align-items:center;
  width:max-content; height:100%;
  animation:bl-scroll linear infinite;
  will-change:transform;
}
#bl .run{display:flex; flex-wrap:nowrap; align-items:center; flex:0 0 auto; height:100%}
#bl .item{
  display:flex; align-items:center; gap:9px; flex:0 0 auto;
  padding:0 20px; height:100%; white-space:nowrap;
  border-right:1px solid rgba(244,241,230,.10);
}
#bl .item > *{flex:0 0 auto; white-space:nowrap}

#bl.paused .track{animation-play-state:paused}
#bl .viewport:hover .track{animation-play-state:paused}
@keyframes bl-scroll{ from{transform:translateX(0)} to{transform:translateX(-50%)} }

#bl .chip{
  font-size:9px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  padding:3px 7px; border-radius:2px;
}
#bl .chip.out{background:#8E2525; color:#FFE8E6}
#bl .chip.dtd{background:#6A4410; color:#FBE6C4}
#bl .nm{color:#F4F1E6; font-size:13px; font-weight:600}
#bl .tm{color:#8E8872; font-size:11px}
#bl .oa{color:var(--gold-bright); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase}
#bl .dur{color:#F0E4BC; font-size:10.5px; font-weight:600; letter-spacing:.04em;
  background:rgba(201,162,39,.16); border:1px solid rgba(201,162,39,.32);
  padding:2px 7px; border-radius:2px}
#bl .note{color:#B8B19B; font-size:11.5px; font-family:"Archivo",sans-serif}

#bl .ctl{
  flex:0 0 auto; display:flex; align-items:stretch;
  border-left:1px solid rgba(244,241,230,.14);
  padding-right:env(safe-area-inset-right, 0px);
}
#bl .ctl button,#bl .ctl a{
  background:none; border:none; cursor:pointer; color:#A79F87;
  font-family:inherit; font-size:12px; padding:0 13px;
  display:flex; align-items:center; white-space:nowrap; text-decoration:none;
}
#bl .ctl button:hover,#bl .ctl a:hover{color:#F4F1E6; background:rgba(201,162,39,.12)}
#bl .ctl button:focus-visible,#bl .ctl a:focus-visible{
  outline:2px solid var(--gold-bright); outline-offset:-3px}

@media (max-width:560px){
  #bl{height:56px}
  #bl .brand .b2{display:none}
  #bl .brand .b1{font-size:10px}
  #bl .item{padding:0 15px; gap:7px}
  #bl .ctl button,#bl .ctl a{padding:0 11px}
  #bl .note{display:none}
}
@media (prefers-reduced-motion: reduce){
  #bl .track{animation:none; width:auto}
  #bl .viewport{overflow-x:auto}
  #bl .dupe{display:none}
}

/* injury page bits */
.sev{display:inline-block;font-family:"IBM Plex Mono",monospace;font-size:9.5px;
  letter-spacing:.1em;text-transform:uppercase;font-weight:600;padding:3px 8px;border-radius:2px}
.sev.out{background:var(--bad-bg);color:var(--bad)}
.sev.dtd{background:var(--warn-bg);color:var(--warn)}
tr.mine td{background:var(--gold-soft)}
