/* WAFL site. Colours from the league logo (#110, W-003): navy header, gold highlights, red accents; tables stay light
   for reading. IHOF-style dense tables, modernized.
   W-010 part A (D-105, D-107, look A = the forum's look carried onto the site, so site and forum feel like one site):
   navy section header bars with pale-gold uppercase text and a red rule (the forum's category bars), navy-bordered
   rounded panels with room between them, a table header band, blue-grey zebra rows with row separators, the type a
   little larger (A.1), the helmet strip centred (A.3), disabled buttons greyed (A.5), the test-league band (A.6). */
:root {
  --navy: #03132d;       /* the logo's background */
  --navy-2: #0b2350;     /* logo strip, headings, section bars, the rail */
  --navy-3: #16325f;     /* the rail's hover */
  --gold: #d9a441;       /* the logo's lettering */
  --gold-soft: #f3dfae;
  --red: #a8181a;        /* the badge ring */
  --ink: #1d2330;
  --muted: #667085;
  --line: #d9dee7;
  --bg: #f4f5f8;
  --card: #ffffff;
  --head: var(--navy);
  --head-ink: #ffffff;
  --accent: #1d4f91;     /* links and buttons: a readable navy-blue */
  --hl: #fff1c9;         /* highlighted row: pale gold */
  --grey: #9aa3b2;
  --band: #dfe4ee;       /* table header band, total rows */
  --band-line: #b9c2d4;
  --row-odd: #f4f5f8;    /* zebra rows (the forum's forumbg rows) */
  --row-even: #eceff5;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 15px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color: var(--ink); background: var(--bg); }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

/* Top bar with the banner, and the logo strip (centred like the page body, A.3) */
.top { background: var(--head); color: var(--head-ink); border-bottom: 3px solid var(--gold); }
.topbar { display: flex; align-items: center; gap: 10px; padding: 4px 14px; }
.brand { display: flex; align-items: center; gap: 14px; color: var(--gold-soft); font-weight: 700; font-size: 17px; letter-spacing: .4px; }
.brand:hover { text-decoration: none; color: #fff; }
.brand .banner { display: block; width: 192px; height: auto; }
.menu-button { display: none; cursor: pointer; font-size: 20px; line-height: 1; padding: 2px 6px; color: var(--gold-soft); border: 1px solid rgba(217,164,65,.5); border-radius: 4px; }
.strip { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px; padding: 4px 10px 6px; background: var(--navy-2); border-top: 1px solid var(--red); }
.strip a { display: flex; flex-direction: column; align-items: center; width: 40px; color: #d6dcea; font-size: 10px; padding: 2px 0; border-radius: 3px; }
.strip a:hover { background: rgba(217,164,65,.22); color: #fff; text-decoration: none; }
.strip img { display: block; }
/* W-012b B2 (D-159): the strip as two rows of four division blocks, the AC conference's divisions on the left half and
   the NC's on the right (a gold rule between the halves), a small label per division and per conference. The names and
   the grouping come from the standings' Division column. The icons stay 28 px (the custom helmets later, D-108). */
.strip.strip-divs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 18px; max-width: 1400px; margin: 0 auto; padding: 3px 10px 5px; }
.strip-divs .conf { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); padding-left: 22px; align-items: center; }   /* W-018 G: the label sits in the left padding */
.strip-divs .conf + .conf { border-left: 1px solid rgba(217,164,65,.55); padding-left: 40px; }
.strip-divs .conf-label { position: absolute; left: 0; top: 0; bottom: 0; width: 16px; line-height: 16px; writing-mode: vertical-rl; transform: rotate(180deg); color: var(--gold); font-size: 11px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.strip-divs .conf + .conf .conf-label { left: 18px; }
/* W-034 (N-50): a long conference name ("New World Conference", 20 characters, needs ~150 px at 9 px; the block is ~124 px tall) wraps
   into two vertical lines (10 px each, in the 22 px left padding) instead of being cut with an ellipsis; the lines balanced when the
   browser can. The tooltip keeps the game's name. */
.strip-divs .conf-label.long { font-size: 9px; letter-spacing: .4px; width: 20px; line-height: 10px; white-space: normal; text-overflow: clip; text-wrap: balance; }
.strip-divs .div-label.long { font-size: 8px; letter-spacing: .2px; }    /* W-018 G: a long WAFL division name */
.strip-divs .div-label, .strip-divs .conf-label:not(.long) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ln-set { cursor: help; }
.ln-game { font-weight: normal; text-transform: none; letter-spacing: 0; font-size: 12px; }
.strip-divs .divs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2px 6px; }
.strip-divs .div { background: rgba(3,19,45,.45); border: 1px solid rgba(217,164,65,.3); border-radius: 5px; padding: 1px 4px 1px; }
.strip-divs .div-label { color: var(--gold-soft); font-size: 9px; letter-spacing: .5px; text-transform: uppercase; padding: 0 3px; line-height: 1.3; }
.strip-divs .teams { display: flex; justify-content: space-around; gap: 2px; }
.strip-divs .teams a { width: 44px; padding: 1px 0; }
/* A.6 (D-087): the "Test league — not live yet" band under the header (Admin -> Site settings) */
/* W-014: the ticker in the place of the W-010 band (lib/Ticker.php). The item set repeats --tk-k times in a flex track that
   moves one set width per cycle (seamless loop, --tk-dur from the text length so the pace is steady); hover / focus pause
   it; prefers-reduced-motion stops it and the line scrolls by hand. overflow hidden on the box: never a sideways page scroll. */
.ticker { position: relative; overflow: hidden; max-width: 100%; background: var(--navy-2); color: #dfe6f3; font-size: 13px; line-height: 1.3; padding: 4px 0; border-top: 1px solid rgba(217,164,65,.5); white-space: nowrap; }
.ticker:focus { outline: 2px solid var(--gold); outline-offset: -2px; }
.tk-track { display: inline-flex; width: max-content; animation: tk-scroll var(--tk-dur, 40s) linear infinite; will-change: transform; }
.tk-set { display: inline-flex; align-items: center; }
.tk-item { display: inline-block; padding: 0 14px; color: inherit; }
.tk-item b { color: #fff; font-weight: 600; }
.tk-item:hover { text-decoration: none; color: #fff; }
.tk-g { color: var(--gold); font-weight: 700; text-transform: uppercase; font-size: 11px; letter-spacing: .5px; }
.tk-t { color: #b8c4dc; }
.tk-p { color: var(--gold-soft); font-weight: 700; font-variant-numeric: tabular-nums; }
.tk-custom { color: #fff; }
.tk-sep { color: var(--gold); opacity: .6; font-size: 8px; }
@keyframes tk-scroll { from { transform: translateX(0); } to { transform: translateX(calc(-100% / var(--tk-k, 2))); } }
.ticker:hover .tk-track, .ticker:focus .tk-track, .ticker:focus-within .tk-track { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
  .ticker { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .tk-track { animation: none; }
  .tk-set + .tk-set { display: none; }
}
/* Admin -> Ticker: the message list; a flagged week on the load report */
table.tk-list td.tk-text { white-space: normal; max-width: 36em; }
table.tk-list tr.off td { color: var(--grey); }
.tk-state { font-size: 12px; color: var(--muted); }
.tk-form { display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; gap: 6px 10px; align-items: end; }
.tk-form label { display: block; font-size: 13px; }
.tk-form input[type=text] { width: 100%; }
.fy-flag { color: var(--red); }
button.btn-s { padding: 2px 8px; font-size: 12px; }
.tk-shows-pick { display: inline-flex; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 4px; padding: 2px 8px 4px; margin: 0; }   /* W-018 H */
.tk-shows-pick legend { font-size: 12px; color: var(--muted); padding: 0 4px; }
table.tk-list td.tk-shows { font-variant-numeric: tabular-nums; }
.tk-preview { margin: 0; padding-left: 1.4em; font-size: 13px; }
.tk-preview .tk-state { margin-right: 4px; }
.fy-title { font-size: 17px; margin: 4px 0 10px; }
.fy-title small { font-weight: normal; font-size: 13px; }
/* Fantasy Scoring (W-014 T2): the picker row, the group cards in two columns, rank / points columns, the breakdown */
.fy-pick { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; margin: 0 0 10px; }
.fy-pick label { font-size: 13px; }
.fy-groups { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.fy-groups .card { margin: 0; }
table.t td.fy-pts, table.t th.fy-pts { font-weight: 700; color: var(--navy-2); }
table.t td.fy-line { white-space: normal; font-size: 12px; color: var(--muted); max-width: 30em; }
table.t td.fy-bd { white-space: normal; font-size: 12px; max-width: 40em; }
/* W-016 S: Admin -> Self-check (the summary line, one row per check in its colour) */
.sc-summary { padding: 10px 14px; border-radius: 6px; margin: 0 0 10px; font-size: 15px; border: 1px solid var(--line); background: var(--card); }
.sc-summary.sc-PASS { border-color: #1b7a3a; background: #eaf6ee; }
.sc-summary.sc-WARN { border-color: #b35900; background: #fff4e5; }
.sc-summary.sc-FAIL { border-color: var(--red); background: #fdeaea; }
.sc-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 0 0 12px; font-size: 13px; }
.sc-form input { font: inherit; padding: 3px 6px; border: 1px solid var(--line); border-radius: 4px; }
.sc-badge { display: inline-block; min-width: 42px; text-align: center; font-size: 11px; font-weight: 700; letter-spacing: .5px; padding: 1px 6px; border-radius: 9px; color: #fff; background: #667085; }
tr.sc-PASS .sc-badge { background: #1b7a3a; }
tr.sc-WARN .sc-badge { background: #b35900; }
tr.sc-FAIL .sc-badge { background: var(--red); }
tr.sc-FAIL td { background: #fdeaea; }
tr.sc-WARN td { background: #fff8ec; }
table.t td.sc-line { white-space: normal; min-width: 260px; max-width: 46em; }
table.t td.sc-data { white-space: normal; font-size: 11px; color: var(--muted); max-width: 40em; word-break: break-word; }

/* W-016 U1 (D-183): the team dropdown to the right of the Rules tab (the Team view's icon picker is gone) */
.tabs .fy-teamsel { display: flex; align-items: center; gap: 6px; margin-left: 10px; font-size: 13px; }
.fy-teamsel select { font: inherit; font-size: 13px; padding: 3px 6px; max-width: 280px; border: 1px solid var(--line); border-radius: 4px; background: var(--card); }
.fy-rules h3 { margin: 12px 0 4px; font-size: 14px; }
.fy-rules table.t { width: auto; min-width: 60%; }
.fy-rules td.fy-unit { white-space: normal; color: var(--muted); font-size: 12px; }
@media (max-width: 1180px) { .fy-groups { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 700px) { .tk-form { grid-template-columns: minmax(0, 1fr); } .fy-rules table.t { width: 100%; } }

/* Layout (W-012b B1, D-159: Option A "Navy rail"): the side rail is a full-height navy bar (the section bars' navy) with
   a gold right edge, fixed at the left while the page scrolls (sticky; its own scroll when taller than the window), gold
   section labels, small line icons, the current page marked by a gold ring; the Teams section = the divisions as
   collapsible groups of four codes. The icon and the badge sit next to the link inside the row; the row is the click
   target (the link stretches over it). 216 px + a 12 px gutter leave 1,160 px for the page at 1,400 px. */
.menu-toggle { display: none; }
.layout { display: flex; align-items: flex-start; max-width: 1400px; margin: 0 auto; }
.rail { position: sticky; top: 0; flex: 0 0 216px; width: 216px; height: 100vh; overflow-y: auto; background: var(--navy-2); color: #dfe6f3; padding: 12px 8px 24px; border-right: 3px solid var(--gold); font-size: 14px; }
.rail h4 { margin: 14px 10px 5px; font-size: 11px; letter-spacing: 1.2px; text-transform: uppercase; color: var(--gold); }
.rail h4:first-of-type { margin-top: 2px; }
.rail h4 small { color: #c9d3e6; text-transform: none; letter-spacing: 0; font-weight: normal; }
.rail ul { list-style: none; margin: 0; padding: 0; }
.rail .item { position: relative; display: flex; align-items: center; gap: 9px; padding: 5px 10px; border-radius: 6px; color: #dfe6f3; }
.rail .item:hover { background: var(--navy-3); }
.rail .item a { color: inherit; text-decoration: none; flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rail .item a::before { content: ""; position: absolute; inset: 0; border-radius: 6px; }
.rail .item a:focus-visible::before { outline: 2px solid var(--gold); outline-offset: -2px; }
.rail .item.on { background: var(--navy); color: var(--gold-soft); font-weight: 600; box-shadow: inset 0 0 0 1px var(--gold), inset 3px 0 0 var(--gold); }
.rail .ic { width: 16px; height: 16px; flex: 0 0 16px; }
.rail .badge { position: relative; z-index: 1; pointer-events: none; margin-left: auto; font-size: 10px; font-weight: 700; line-height: 1.5; background: var(--red); color: #fff; padding: 0 6px; border-radius: 9px; white-space: nowrap; }
/* W-018 D: the "My team" heading is a button that folds its section (the Teams-by-division groups left the rail, W-018 E / D-189) */
.rail h4.fold { margin-left: 0; margin-right: 0; }
.rail .fold-btn:hover { background: var(--navy-3); }
.rail .fold-btn:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; }
.rail .fold-body[hidden] { display: none; }
.rail-back { display: none; }
main { flex: 1 1 auto; min-width: 0; padding: 12px 12px 24px; }
.page-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.page-head h1 { margin: 0; font-size: 24px; color: var(--navy-2); }
.year select { font: inherit; padding: 2px 4px; }
footer { text-align: center; color: var(--muted); font-size: 12px; padding: 14px; border-top: 3px solid var(--navy-2); background: var(--row-even); }

/* Cards: the forum's framing. Navy header bar with pale gold uppercase text and a red rule under it (the forum's
   category bars), a navy border, rounded corners, room between sections. A panel wider than its column scrolls
   sideways instead of spilling over (wide tables sit in .scroll wrappers anyway). */
.card { background: var(--card); border: 1px solid var(--navy-2); border-radius: 7px; margin: 0 0 16px; box-shadow: 0 1px 2px rgba(3,19,45,.12); overflow-x: auto; }
.card > h2 { margin: 0; padding: 7px 12px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; color: var(--gold-soft); background: var(--navy-2); border-bottom: 2px solid var(--red); border-radius: 6px 6px 0 0; }
.card > h2 small { font-weight: normal; color: #d6dcea; text-transform: none; letter-spacing: 0; font-size: 12px; }
.card > h2 a { color: #ffffff; }
.card .body { padding: 10px 12px; }
.card > .note.body, .card > p.body { margin-top: 0; }
.scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* Tables: a header band, blue-grey zebra rows with separators (the forum's forumbg rows). The zebra rule is kept weak
   (no tbody in the selector) so the marked rows below it - hl, total, fail, hire, vacant, marker, on - win. */
table.t { border-collapse: collapse; width: 100%; font-size: 14px; }
table.t th, table.t td { padding: 4px 7px; white-space: nowrap; }
table.t th { background: var(--band); color: var(--navy-2); font-weight: 600; text-align: right; border-bottom: 1px solid var(--band-line); }
table.t td { text-align: right; font-variant-numeric: tabular-nums; border-bottom: 1px solid var(--line); }
table.t tr:nth-child(odd) td { background: var(--row-odd); }
table.t tr:nth-child(even) td { background: var(--row-even); }
table.t th.l, table.t td.l { text-align: left; }
table.t th.c, table.t td.c { text-align: center; }
table.t tr.hl td { background: var(--hl); font-weight: 600; }
table.t tr.ex td { color: var(--grey); }
table.t tr.ex td a { color: var(--grey); }
table.t caption { text-align: left; font-weight: 700; padding: 6px 10px; background: var(--row-even); color: var(--navy-2); text-transform: uppercase; letter-spacing: .4px; font-size: 12px; border-bottom: 1px solid var(--band-line); }
.logo-s { vertical-align: middle; }
.mark { color: var(--muted); font-size: 11px; margin-left: 3px; }
.muted { color: var(--muted); }
.note { color: var(--muted); font-size: 13px; margin: 6px 0 0; }
.win { color: #1b7a3a; font-weight: 600; }
.loss { color: var(--red); font-weight: 600; }

/* Standings: two conferences side by side */
.conferences { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }

/* Team page */
.team-head { display: flex; gap: 14px; align-items: center; }
.team-head img { width: 96px; height: auto; }
.team-head h2 { margin: 0 0 4px; font-size: 22px; text-transform: uppercase; letter-spacing: .5px; }
.team-head .facts { color: #394356; }
.team-head .facts span + span::before { content: " · "; color: var(--grey); }
.grid2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
/* Tabs as square-ish navy tabs (the forum's) */
.tabs { display: flex; gap: 4px; flex-wrap: wrap; margin: 0 0 10px; }
.tabs span { padding: 4px 12px; border: 1px solid var(--line); border-radius: 4px; background: var(--card); color: var(--muted); font-size: 13px; }
.tabs span.on { background: var(--navy-2); color: var(--gold-soft); border-color: var(--navy-2); }
.switch a, .switch b { margin-right: 8px; }

/* Admin */
form.stack label { display: block; margin: 8px 0; }
input[type=text], input[type=password], input[type=number] { font: inherit; padding: 4px 6px; border: 1px solid var(--line); border-radius: 4px; }
button, .btn { font: inherit; padding: 5px 12px; border: 1px solid var(--accent); background: var(--accent); color: #fff; border-radius: 4px; cursor: pointer; }
button.danger { background: var(--red); border-color: var(--red); }
/* A.5 disabled buttons look disabled */
button:disabled, button[disabled], .btn.disabled { background: #b8c0cf; border-color: #b8c0cf; color: #f4f5f8; cursor: not-allowed; box-shadow: none; }
.msg { padding: 8px 10px; border-radius: 6px; margin: 0 0 10px; background: #e8f1ff; border: 1px solid #bcd3f5; }
.msg.err { background: #fdecea; border-color: #f5c2bc; }
.msg.ok { background: #e9f7ee; border-color: #b7e2c4; }
code, pre { font-family: Consolas, Menlo, monospace; font-size: 12px; }
pre { white-space: pre-wrap; word-break: break-all; background: #f3f5f8; padding: 8px; border-radius: 4px; }

/* Phones (#112, light): grids stack, wide tables scroll sideways. W-012b B1: at 760 px and below the rail folds behind
   the menu button and slides in over the page (the checkbox opens it; the backdrop label and Escape close it). */
@media (max-width: 1180px) {
  .conferences { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1100px) {
  .grid2 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .menu-button { display: inline-block; }
  .layout { display: block; }
  .rail { position: fixed; z-index: 30; left: 0; top: 0; height: 100%; max-height: none; width: 232px; transform: translateX(-105%); transition: transform .2s; box-shadow: 0 0 18px rgba(3,19,45,.5); }
  .menu-toggle:checked ~ .layout .rail { transform: none; }
  .rail-back { position: fixed; z-index: 29; inset: 0; background: rgba(3,19,45,.45); }
  .menu-toggle:checked ~ .layout .rail-back { display: block; }
  .strip.strip-divs { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .strip-divs .conf + .conf { border-left: 0; padding-left: 22px; border-top: 1px solid rgba(217,164,65,.55); padding-top: 4px; }
  .strip-divs .conf + .conf .conf-label { left: 0; top: 5px; }
  .strip-divs .teams a { width: 40px; }
}
@media (prefers-reduced-motion: reduce) { .rail { transition: none; } }
@media (max-width: 700px) {
  .brand .banner { width: 136px; }
  .brand-name { display: none; }
  .strip:not(.strip-divs) { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .strip:not(.strip-divs) a { flex: 0 0 34px; width: 34px; }
  .team-head img { width: 64px; }
  .team-head h2 { font-size: 18px; }
  main { padding: 10px 8px 20px; }
}

/* W-002: tabs as links, roster, player card */
.tabs a { padding: 4px 12px; border: 1px solid var(--line); border-radius: 4px; background: var(--card); font-size: 13px; }
.tabs a:hover { text-decoration: none; background: var(--row-even); border-color: var(--navy-2); }
.facts-row { display: flex; flex-wrap: wrap; gap: 4px 18px; }
table.t th.sort { cursor: pointer; }
table.t th.sort:hover { color: var(--accent); }
/* W-040 (D-614): a server-side sort heading is a link (the whole list, not the page): drawn as the heading itself */
table.t th.sort a { color: inherit; text-decoration: none; }
table.t th.sort a:hover { color: var(--accent); text-decoration: none; }
table.t th[data-dir=asc]::after { content: " \25B2"; font-size: 9px; }
table.t th[data-dir=desc]::after { content: " \25BC"; font-size: 9px; }
table.t caption small { font-weight: normal; text-transform: none; letter-spacing: 0; }
table.t th small { font-weight: normal; color: var(--muted); }
.chem { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px; vertical-align: 0; border: 1px solid rgba(0,0,0,.25); }
.chem-red { background: #d64545; }
.chem-yellow { background: #e8c21c; }
.chem-blue { background: #3b6fd1; }
.chem-green { background: #3a9a4c; }
/* W-018 A: the Chemistry Chart, each row tinted by its colour group (pale, the text stays dark) */
table.chem-chart tr.chem-row-red td { background: #fbe3e3; }
table.chem-chart tr.chem-row-yellow td { background: #fbf3cf; }
table.chem-chart tr.chem-row-blue td { background: #dfe8fa; }
table.chem-chart tr.chem-row-green td { background: #dff3e3; }
table.chem-chart td { color: var(--ink); }
/* W-018 B / C: the DA download line, the import box and its confirm screen */
.da-file { margin: 6px 0 2px; }
.da-file .da-excluded { color: var(--red); }
.da-record { margin: 0 0 8px; }
.da-rows td.wrap { white-space: normal; max-width: 36em; }
table.da-rows tr.da-bad td .da-status { color: var(--red); font-weight: 600; }
table.da-rows tr.da-skip td .da-status { color: var(--muted); }
table.da-rows tr.da-ok td .da-status { color: #1b7a3a; }
.da-confirm-form .btn { padding: 5px 12px; }
table.ln-form input[type=text] { font: inherit; padding: 3px 6px; border: 1px solid var(--line); border-radius: 4px; width: 18em; max-width: 100%; }
.player-head { display: flex; gap: 14px; align-items: center; }
.player-head > a > img { width: 120px; height: auto; display: block; }   /* W-027 (spec §4): 72 -> 120 px */
.player-head h2 { margin: 0 0 2px; font-size: 22px; }
.player-head .pos { color: var(--muted); font-weight: 600; margin-right: 6px; }
.player-head .ovr { margin-left: auto; text-align: center; font-size: 12px; color: var(--muted); }
.player-head .ovr b { display: block; font-size: 24px; color: var(--ink); }
.status { display: inline-block; padding: 1px 8px; border-radius: 10px; background: #eef1f5; color: #394356; font-size: 12px; }
dl.bio { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px 14px; margin: 0; }
dl.bio div { min-width: 0; }
dl.bio dt { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .3px; }
dl.bio dd { margin: 0; font-weight: 600; }
/* Player card scouting (D-052): one overall bar, blue = current, green = current up to future, the rest blank */
.ovrbar { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 10px; }
.ovrbar .track { display: flex; height: 14px; background: #eef1f5; border-radius: 3px; overflow: hidden; }
.ovrbar .cur { display: block; height: 100%; background: #2f5fa7; }
.ovrbar .fut { display: block; height: 100%; background: #3a9a5b; }
.ovrbar .v { font-weight: 700; font-size: 16px; font-variant-numeric: tabular-nums; }
svg.hist { width: 100%; max-width: 520px; height: auto; display: block; }
@media (max-width: 700px) {
  .player-head { flex-wrap: wrap; }
  .player-head > a > img { width: 96px; }   /* W-027: a phone keeps room for the name */
  .player-head .ovr { margin-left: 0; }
}
table.t tr.total td { background: var(--band); border-top: 1px solid var(--band-line); font-weight: 600; }

/* W-003: load checks on the admin load page */
table.checks tr.pass td:nth-child(3) { color: #1b7a3a; }
table.checks tr.fail td { background: #fdecea; }
table.checks tr.fail td:nth-child(3) { color: var(--red); }
table.checks td:last-child { white-space: normal; min-width: 280px; }

/* Upload Status (W-005) */
.flag { display: inline-block; width: 11px; height: 11px; border-radius: 50%; border: 1px solid rgba(0,0,0,.25); background: #d9dde5; vertical-align: -1px; }
.flag-green .flag, .flag.flag-green { background: #2e9d52; }
.flag-yellow .flag, .flag.flag-yellow { background: #e8c21c; }
.flag-red .flag, .flag.flag-red { background: #d64545; }
.flag-cpu .flag { background: transparent; border-style: dashed; }
.hold { color: var(--red); }
input[type=datetime-local], input[type=file] { font: inherit; padding: 3px 6px; border: 1px solid var(--line); border-radius: 4px; }

/* W-006: sign-in area in the top bar, My Scout skill bars with the league-scout marker */
.topbar .user { margin-left: auto; font-size: 12px; color: #d6dcea; text-align: right; }
.topbar .user a { color: var(--gold-soft); margin-left: 8px; white-space: nowrap; }
.topbar .user a.name { font-weight: 700; margin-left: 0; }
.topbar .user .role { color: #9fb0cc; }
.scout-toggle a, .scout-toggle b { margin-left: 8px; }
.scout-toggle b { color: var(--gold); }
table.skills td.l { width: 1%; }
table.skills td.bar { text-align: left; min-width: 200px; }
.skbar { position: relative; display: block; height: 12px; background: #eef1f5; border-radius: 3px; }
.skbar .cur { position: absolute; left: 0; top: 0; bottom: 0; background: #2f5fa7; border-radius: 3px 0 0 3px; }
.skbar .fut { position: absolute; top: 0; bottom: 0; background: #3a9a5b; }
.skbar .ls { position: absolute; top: -3px; bottom: -3px; width: 2px; margin-left: -1px; background: var(--red); }
.skbar .ls::after { content: ""; position: absolute; left: -3px; top: -4px; border: 4px solid transparent; border-top-color: var(--red); }
table.skills td.v { white-space: nowrap; font-variant-numeric: tabular-nums; }
table.skills td.v .lsv { color: var(--red); }
@media (max-width: 700px) {
  .topbar .user { font-size: 11px; }
  .topbar .user .role { display: none; }
}

/* W-007: home page (main column + right column), Upload Status fits its box */
.home { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 12px; align-items: start; }
.home-strip .files-in { margin-left: auto; white-space: nowrap; }
/* W-026 (N-41 g, N-40): the schedule note takes the room between the deadline and the files-in item and wraps inside it, so
   "0 of 31 owners' files in · Upload Status" stays on the first line at 1,400 px whatever the note's length */
.facts-row .sched-note, .facts-row .hold { flex: 1 1 12em; min-width: 0; }
.home .card > h2 .thread { float: right; font-weight: normal; font-size: 12px; }
table.sim td.w { font-weight: 700; }
.stage-name { font-size: 20px; margin: 0 0 6px; color: var(--navy-2); }
.injuries .new { display: inline-block; padding: 0 6px; border-radius: 8px; background: var(--red); color: #fff; font-size: 10px; font-weight: 700; vertical-align: 1px; letter-spacing: .3px; }
.injuries td.fut { font-weight: 700; font-variant-numeric: tabular-nums; }
.injuries .note .all { font-weight: 600; }
.injuries-all .lead { margin: 0; }
.champs { display: flex; flex-wrap: wrap; gap: 14px 28px; }
.champ { display: flex; align-items: center; gap: 10px; }
.champ img { width: 80px; height: auto; }   /* W-027 (spec §4): 64 -> 80 px */
.leaders h3 { margin: 6px 0 2px; font-size: 12px; text-transform: uppercase; letter-spacing: .4px; color: var(--navy-2); }
.leaders ol { margin: 0 0 6px; padding-left: 22px; }
.leaders ol li { border-bottom: 1px solid var(--row-even); padding: 2px 0; }
.leaders li b { float: right; font-variant-numeric: tabular-nums; }
.forum-box ul.topics { list-style: none; margin: 0; padding: 4px 12px 6px; }
.forum-box ul.topics li { padding: 3px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.forum-box ul.topics li:last-child { border-bottom: 0; }
.forum-box ul.topics .muted { font-size: 11px; }
table.uploads th, table.uploads td { padding: 4px 5px; }

/* W-008: Trade Block (public page, My Trade Block, home box) */
.tb-team-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.tb-team-name { font-size: 16px; font-weight: 700; }
.tb-owner { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.btn.small, button.small { padding: 2px 8px; font-size: 12px; }
a.btn:hover { text-decoration: none; background: var(--navy-2); }
.posfilter a, .posfilter b { margin: 0 1px; }
table.tradeblock td.note, table.tradeblock td.note-cell { white-space: normal; min-width: 180px; max-width: 420px; }
table.tradeblock td.note-cell input { width: 100%; min-width: 180px; font: inherit; padding: 2px 5px; border: 1px solid var(--line); border-radius: 4px; }
table.tradeblock tr.on td { background: var(--hl); }
table.tradeblock td form { display: inline; margin: 0; }
table.tradeblock td.tb-save-cell { white-space: nowrap; }
table.tradeblock .tb-flash { font-size: 12px; color: #1b7a3a; font-weight: 600; }
table.tradeblock .tb-flash.tb-err { color: var(--red); }
.owner-actions .body { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; }
.owner-actions .pa-line form { display: inline; margin: 0; }
.owner-actions .pa-on { font-weight: 600; color: var(--navy-2); }
.owner-actions .pa-help { margin-left: auto; font-size: 12px; }
.tx-stagepick .body { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; font-size: 13px; }
.tx-stagepick form.inline { display: inline; margin: 0; }
.tx-stagepick .btn.disabled { pointer-events: none; }
.tradeblock-box ul.topics { list-style: none; margin: 0; padding: 4px 12px 6px; }
.tradeblock-box ul.topics li { padding: 3px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.tradeblock-box ul.topics li:last-child { border-bottom: 0; }
.tradeblock-box ul.topics .muted { font-size: 11px; }
.tradeblock-box .note .all { font-weight: 600; }
/* W-009: Staff Draft (public page, My Staff Draft, Admin -> Staff Draft); the role pills as navy tabs */
.sd-status { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.sd-status .open { color: #1b7a3a; font-weight: 700; }
.sd-status .closed { color: var(--red); font-weight: 700; }
.sd-roles { display: flex; gap: 4px; flex-wrap: wrap; margin: 0 0 10px; }
.sd-roles a, .sd-roles b { padding: 4px 12px; border: 1px solid var(--line); border-radius: 4px; background: var(--card); font-size: 13px; }
.sd-roles a:hover { text-decoration: none; background: var(--row-even); border-color: var(--navy-2); }
.sd-roles b { background: var(--navy-2); color: var(--gold-soft); border-color: var(--navy-2); }
table.sd-list td.pos input, table.sd-pool td input[type=number] { width: 3.2em; text-align: right; font: inherit; padding: 2px 4px; border: 1px solid var(--line); border-radius: 4px; }
table.sd-list tr.marker-row td { background: var(--gold-soft); font-style: italic; }
table.sd-list td.why, table.sd-picks td.why { white-space: normal; min-width: 260px; max-width: 560px; }
table.sd-picks tr.hire td { background: #e9f7ee; }
table.sd-picks tr.vacant td { background: #f1f3f6; }   /* W-023 (G-104): vacant is grey, not red */
table.sd-picks tr.resign td { background: var(--hl); }
.sd-prefs { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 6px 14px; }
.sd-prefs label { display: block; font-size: 13px; }
.sd-prefs select { font: inherit; padding: 2px 4px; max-width: 100%; }
.sd-filter { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: end; }
.sd-filter label { font-size: 12px; color: var(--muted); }
.sd-filter input, .sd-filter select { display: block; font: inherit; padding: 3px 5px; border: 1px solid var(--line); border-radius: 4px; }
table.sd-pool td form { display: inline; margin: 0; }
.sd-current { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.sd-current .yrs0 { color: var(--navy-2); font-weight: 600; }   /* W-023 (D-10.2): a contract up is normal, not red */
pre.sd-file { max-height: 260px; overflow: auto; }
.sd-teams { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.sd-teams ol { margin: 4px 0 0; padding-left: 20px; }
.sd-teams li.below { color: var(--muted); }
.sd-teams .mk { font-style: italic; color: var(--muted); }
@media (max-width: 1100px) {
  .home { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 700px) {
  .home-strip .files-in { margin-left: 0; }
  .home .card > h2 .thread { float: none; display: block; }
}
/* W-009 exec-05 (D-098): the 0-10 weight controls and the live re-sort. */
.sd-w-wrap { display: inline-flex; align-items: center; gap: 6px; }
.sd-w-wrap input[type=range] { width: 150px; max-width: 100%; margin: 0; }
.sd-w-wrap output { min-width: 1.6em; text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.sd-weights label { padding: 2px 0; }
table.sd-pool tr.more, table.sd-list tr.more { display: none; }
table.sd-defaults .sd-w-wrap input[type=range] { width: 90px; }
table.sd-defaults td { white-space: nowrap; }
/* W-010: roster markers (D-103), the penalties card */
.mk-m { display: inline-block; margin-left: 4px; padding: 0 4px; border: 1px solid var(--navy-2); border-radius: 3px; color: var(--navy-2); font-size: 10px; font-weight: 700; line-height: 14px; vertical-align: 1px; }
.mk-red { color: var(--red); font-size: 13px; margin-left: 3px; vertical-align: -1px; }
/* W-036 (N-81, D-468): the roster status marks - IR / S badges in the M badge's shape, the red + with the injury tag (P / Q / D / O-weeks);
   an Injured Reserve row grey and italic, its links still links. The text carries the meaning, the colour only underlines it. */
.mk-ir, .mk-s { display: inline-block; margin-left: 4px; padding: 0 4px; border: 1px solid var(--red); border-radius: 3px; color: var(--red); font-size: 10px; font-weight: 700; line-height: 14px; vertical-align: 1px; font-style: normal; }
.mk-inj { display: inline-block; margin-left: 4px; color: var(--red); font-size: 11px; font-weight: 700; white-space: nowrap; cursor: help; font-style: normal; vertical-align: 1px; }
.mk-inj .mk-plus { font-size: 13px; margin-right: 1px; }
table.t tr.ir td { color: var(--muted); font-style: italic; background: #f3f4f7; }
table.t tr.ir td a { color: var(--accent); }
/* W-036 (N-79, D-466): Upload Status "This stage" - a green check, a red cross, a grey "?"; the column icon-only on a phone */
.ts { display: inline-block; min-width: 18px; font-size: 15px; font-weight: 700; line-height: 1; cursor: help; outline-offset: 2px; }
.ts-yes { color: #2e9d52; }
.ts-no { color: #d64545; }
.ts-unknown { color: #8a7a2a; }
th.ts-col { white-space: nowrap; }
th.ts-col .ts-count { font-weight: 400; color: var(--muted); }
@media (max-width: 700px) { th.ts-col .ts-word { display: none; } th.ts-col, td.ts-cell { padding-left: 3px; padding-right: 3px; } }
.penalties td.muted { color: var(--grey); }
.tradeblock-box > .note { padding: 0 12px 6px; }
b.stale { color: var(--red); }
.uploads .rejected { white-space: normal; }
/* W-010 B.2: the coach pop-up (assets/coach.js, coach.php) */
a.coach { cursor: pointer; }
.coach-back { position: fixed; inset: 0; background: rgba(3,19,45,.45); z-index: 50; display: flex; align-items: flex-start; justify-content: center; padding: 40px 12px; overflow: auto; }
.coach-pop { position: relative; background: var(--card); border: 1px solid var(--navy-2); border-radius: 8px; box-shadow: 0 8px 30px rgba(0,0,0,.35); max-width: 720px; width: 100%; padding: 14px 16px 12px; }
.coach-close { position: absolute; top: 6px; right: 8px; background: none; border: 0; color: var(--muted); font-size: 22px; line-height: 1; padding: 2px 6px; cursor: pointer; }
.coach-close:hover { color: var(--red); background: none; }
.coach-card h2.coach-name { margin: 0 24px 2px 0; font-size: 20px; color: var(--navy-2); }
.coach-line { margin: 0 0 6px; color: #394356; }
.coach-ext { margin: 0 0 6px; color: var(--red); font-size: 12px; }
.coach-cols { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 8px 18px; }
.coach-cols h3 { margin: 4px 0 2px; font-size: 12px; text-transform: uppercase; letter-spacing: .4px; color: var(--navy-2); }
table.coach-skills td.bar { min-width: 120px; }
table.coach-suit td { white-space: normal; }
.coach-page-score { margin: 8px 0 0; font-weight: 600; color: var(--navy-2); }
@media (max-width: 700px) { .coach-cols { grid-template-columns: minmax(0, 1fr); } .coach-back { padding: 10px 6px; } }
table.sd-pool tr.off { display: none; }
/* W-010 D (D-104): the contract line under each Trade Block row */
table.tradeblock tr.contract td { white-space: normal; font-size: 12px; color: #394356; padding: 2px 6px 6px 22px; border-bottom: 1px solid var(--line); }
table.tradeblock tr.contract td > span { display: inline-block; margin-right: 16px; }
table.tradeblock tr.contract.on td { background: var(--hl); }
/* W-010 A: room between a top-level form (e.g. Admin -> Load data's Check) and the panel under it */
main > form.stack { margin: 0 0 14px; }

/* W-011: the rookie draft pages */
.draft-tabs { margin-bottom: 12px; }
.draft-state { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 0 0 8px; }
.draft-state .open { color: #1b7a3a; font-weight: 700; }
.draft-state .closed { color: var(--red); font-weight: 700; }
.draft-state .neutral, .sd-status .neutral { color: var(--navy-2); font-weight: 700; }
.draft-line a { font-weight: 600; }
table.draft-board tr.open-pick td { color: var(--muted); }
table.draft-board .onclock { color: var(--red); margin-left: 6px; }
table.draft-board .via, table.draft-recent .via { font-size: 12px; }
details.draft-round > summary { list-style: none; cursor: pointer; }
details.draft-round > summary::-webkit-details-marker { display: none; }
details.draft-round > summary h2 { margin: 0; }
details.draft-round:not([open]) > summary h2 { border-radius: 6px; }
/* W-023 (D-8.8): the "You're up" card in the site's accent colour, not error red; the accent pick buttons */
.onclock-card { border-color: var(--navy-2); }
.onclock-card > h2 { background: var(--navy-2); color: var(--gold-soft); }
button.accent { background: var(--navy-2); border-color: var(--navy-2); color: #fff; }
button.accent:hover { background: var(--navy-3, #1d2f55); }
table.dnd tbody tr { cursor: grab; }
table.dnd tbody tr.drag td { opacity: .5; background: var(--hl); }
table.dnd td button[data-move] { padding: 1px 6px; font-size: 11px; line-height: 1.4; }
td.nowrap { white-space: nowrap; }
table.draft-class td button, table.draft-list td button { padding: 2px 8px; font-size: 12px; }
.int { color: #1b7a3a; font-weight: 700; }
.skbar .rng { position: absolute; top: 0; bottom: 0; background: #2f5fa7; border-radius: 3px; }
table.draft-bars td.v { white-space: nowrap; }
.draft-powers form { margin: 0 0 10px; }
.draft-actions form { margin: 0; }
.draft-pick-form select { max-width: 100%; }
table.draft-clocks input { text-align: right; }

/* W-013: Team Analysis. The 32-team selector (the helmet strip's look inside a card): the chosen team marked, the
   teams the viewer may not open greyed out (Own team only). The analysis tables keep to 1,400 px: 14 px, wide panels
   scroll sideways. */
.teampick { display: flex; flex-wrap: wrap; gap: 2px; }
.teampick a, .teampick span.off { display: flex; flex-direction: column; align-items: center; width: 42px; font-size: 10px; padding: 2px 0; border-radius: 3px; border: 1px solid transparent; }
.teampick a { color: var(--navy-2); }
.teampick a:hover { background: var(--row-even); text-decoration: none; }
.teampick a.on { background: var(--navy-2); color: #fff; font-weight: 700; border-color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold); }   /* W-016 U2: white code, gold ring (gold text on the tile was hard to read) */
.teampick span.off { color: var(--grey); opacity: .45; cursor: not-allowed; filter: grayscale(1); }
.teampick img { display: block; }
.filters { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 6px; }
.filters select { font: inherit; padding: 2px 4px; max-width: 260px; }
table.t.routes caption, table.t.marks caption { text-align: left; padding: 6px 7px 2px; font-weight: 600; }
table.t.tend td.l { white-space: normal; min-width: 150px; }
.forum-box > .note { margin: 0; padding: 4px 12px 8px; }
.forum-box .note .all { font-weight: 600; }

/* W-012a: the draft pages. A7 (D-129): the Draft Class table keeps to 1,400 px (the college and the birthday wrap, a
   tighter cell padding, the csv column muted). A5 (D-149): the "+ list" result line next to its row. A2: the two e-mail boxes.
   A12: the site version line in the admin footer. */
table.draft-class th, table.draft-class td { padding: 4px 4px; }
table.draft-class td.wrap { white-space: normal; }
table.draft-class td.college { min-width: 90px; max-width: 120px; }
table.t td.csv, table.t th.csv { color: var(--muted); }
.added-note { color: #1b7a3a; font-size: 12px; white-space: normal; }
.added-note.err { color: var(--red); }
.email-boxes { display: flex; flex-direction: column; gap: 6px; }
footer .site-version { color: var(--muted); }
table.t td.wrap { white-space: normal; }

/* W-012b: the GMs page (B3), the second Season selector's row (B4), "Drafted from my list" (B10) */
.gm-confs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 12px; }
table.gms td.gm-icon { width: 1%; padding-right: 2px; }
table.gms td.gm-icon img { display: block; }
table.gms td { vertical-align: middle; }
.gm-open { font-style: italic; }
.gm-staff .btn.small { margin-left: 4px; }
.page-head.sub-head { margin: 4px 0 6px; }
.draft-gone td { white-space: normal; }
@media (max-width: 1100px) { .gm-confs { grid-template-columns: minmax(0, 1fr); } }
/* W-012b B5 (C-030): the roster keeps to 1,400 px: a tighter cell padding and short headers (titles on hover) */
table.roster th, table.roster td { padding: 4px 5px; }

/* W-017 exec-02: My DA (myda.php) and Admin -> My DA. The Players table keeps to 1,400 px (13 px, tight cells); cell colours
   by z (research 7.4: blue = below, green = above, orange = did not test, red = failed the cut line; pale tints, dark text);
   the row details open in a row under the player; the board's buckets; the weights form's sliders; the bar estimates'
   white marker (Phase 3, shown only with body.show-est). */
.myda-privacy { margin: 0 0 10px; }
.myda-lines { margin: 0 0 8px; }
.myda-controls { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; margin: 6px 0; }
.myda-controls select, .myda-controls input[type=search] { font: inherit; padding: 2px 4px; }
.myda-sortform { margin: 4px 0 0; }
form.inline { display: inline; }
table.myda-table { font-size: 13px; }
table.myda-table th, table.myda-table td { padding: 3px 4px; }
table.myda-table td.cp2 { background: #c4efc9; }
table.myda-table td.cp1 { background: #dff3e3; }
table.myda-table td.cneg { background: #e9ecf1; }
table.myda-table td.cm1 { background: #cfdcf6; }
table.myda-table td.cm2 { background: #b4c8f0; }
table.myda-table td.c0 { background: #fde3c4; }
table.myda-table td.cf { background: #f6c3c3; color: #7a0c0e; font-weight: 600; }
.myda-players .note .cp2, .myda-players .note .cp1, .myda-players .note .cneg, .myda-players .note .cm1, .myda-players .note .cm2, .myda-players .note .c0 { padding: 0 4px; border-radius: 3px; }
.myda-players .note .cp2 { background: #c4efc9; } .myda-players .note .cp1 { background: #dff3e3; } .myda-players .note .cneg { background: #e9ecf1; }
.myda-players .note .cm1 { background: #cfdcf6; } .myda-players .note .cm2 { background: #b4c8f0; } .myda-players .note .c0 { background: #fde3c4; }
.myda-players .note .cf { color: var(--red); font-weight: 600; }
table.myda-table tr.drafted td { color: var(--grey); }
table.myda-table tr.drafted td a { color: var(--grey); }
b.aff { color: #1b7a3a; } b.conf { color: var(--red); }
tr.myda-drow > td { white-space: normal; background: #fbfbfd !important; border-left: 3px solid var(--navy-2); }
.myda-detail { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 10px 20px; padding: 4px 0; }
.myda-detail h3 { margin: 6px 0 4px; font-size: 13px; text-transform: uppercase; letter-spacing: .4px; color: var(--navy-2); }
.myda-detail h3 small { font-weight: normal; text-transform: none; letter-spacing: 0; color: var(--muted); }
.myda-detail table.t { font-size: 12px; width: auto; min-width: 60%; }
.myda-detail table.myda-pos tr.rated td { font-weight: 600; background: var(--hl); }
.myda-detail table.myda-tests tr.flagged td { color: var(--red); }
.myda-detail p { font-size: 13px; }
.skbar .rng.int { background: #e08a2e; }
.skbar .est { display: none; position: absolute; top: -3px; bottom: -3px; width: 5px; margin-left: -3px; background: #ffffff; border: 1px solid #1d2330; border-radius: 1px; }
.est-v, .est-note { display: none; }
body.show-est .skbar .est, body.show-est .est-v { display: inline-block; }
body.show-est .est-note { display: block; }
@media (max-width: 900px) { .myda-detail { grid-template-columns: minmax(0, 1fr); } }
/* the board */
.myda-boardtools { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; margin: 6px 0 0; }
.myda-boardtools form.inline span.muted { font-size: 12px; }
.myda-buckets .card { margin-bottom: 10px; }
.myda-bucket.notindraft > h2 { background: #4a5a7a; }
table.myda-btable { font-size: 13px; }
table.myda-btable th, table.myda-btable td { padding: 3px 5px; }
table.myda-btable tr[draggable=true] { cursor: grab; }
table.myda-btable tr.drag td { opacity: .5; }
table.myda-btable tr.unplaced td { color: var(--muted); }
table.myda-btable tr.unplaced td a { color: var(--muted); }
.myda-buckets.hide-drafted tr.drafted { display: none; }
.myda-movepanel { display: inline-block; margin-left: 6px; padding: 2px 6px; background: var(--hl); border-radius: 4px; }
.myda-movepanel select { font: inherit; font-size: 12px; }
.myda-preview { columns: 3; font-size: 13px; }
@media (max-width: 760px) { .myda-preview { columns: 1; } }
/* the weights form */
.myda-grid { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; }
.myda-grid label input[type=number] { width: 5.5em; }
.myda-weights h3, .myda-weights h4 { margin: 10px 0 4px; font-size: 13px; }
.myda-weights h4 small { font-weight: normal; }
.myda-pospick { margin: 10px 0 4px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.myda-posblock { border: 1px solid var(--line); border-radius: 6px; padding: 6px 10px 10px; margin: 0; }
.myda-posblock legend { font-weight: 700; padding: 0 4px; }
table.myda-sliders { width: auto; font-size: 13px; }
table.myda-sliders td.bar { min-width: 180px; }
table.myda-sliders td.bar input[type=range] { width: 170px; vertical-align: middle; }
table.myda-sliders td.v { width: 2.5em; }
table.myda-sliders td.nw { text-align: left; min-width: 6em; }
table.myda-sliders tr.nonorm td { color: var(--muted); }
.myda-buttons { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; }
.myda-saveas input[type=text] { width: 12em; }
.myda-profile-list { margin: 0; padding-left: 18px; }
.myda-profile-list li { margin: 3px 0; }
/* chemistry */
table.myda-leaders td { white-space: normal; vertical-align: top; }
form.myda-leader select { max-width: 320px; font: inherit; }
/* admin: the statistics */
table.myda-stats td.l small { color: var(--muted); }
/* the Team Analysis troubleshooting banner (Amendment 3, D-207) */
.ta-override { background: #fff1c9; border: 1px solid #e0b84a; border-radius: 6px; padding: 8px 12px; margin: 0 0 12px; display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; }
.ta-override form { margin: 0; }
.ta-override .ta-teampick select { font: inherit; font-size: 13px; }

/* W-019: Free Agents, My Free Agency, Transactions, the Draft Board's year picker */
.fa-controls, .tx-filters .body { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; font-size: 13px; }
.fa-controls input[type=number], .fa-controls input[type=search] { font-size: 13px; }
.fa-controls input[type=number] { width: 4.5em; }
.fa-ufa-line { margin: 0 0 6px; }
.fa-watching { color: var(--muted); font-size: 12px; }
.fa-msg { font-size: 12px; }
table.t tr.fa-top td { background: var(--hl); }
.fa-high { color: var(--navy-2); font-size: 12px; }
.fa-block > h2 a { color: #ffffff; }
.fa-empty { font-size: 15px; }
/* W-022 R-6.2: the Pending offers bids pop-up (a <details> anchored at the row's end) */
.fa-bids { position: relative; display: inline-block; }
.fa-bids > summary { list-style: none; display: inline-block; white-space: nowrap; }
.fa-bids > summary::-webkit-details-marker { display: none; }
.fa-bids > summary::marker { content: ""; }
.fa-bids[open] > summary { background: var(--navy-2); border-color: var(--navy-2); }
.fa-pop { position: absolute; right: 0; top: calc(100% + 4px); z-index: 30; min-width: 340px; max-width: 92vw; background: var(--card); border: 1px solid var(--navy-2); border-radius: 7px; box-shadow: 0 6px 24px rgba(3,19,45,.28); padding: 8px 10px 10px; text-align: left; }
.fa-pop-head { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; }
.fa-pop-head .fa-close { all: unset; margin-left: auto; cursor: pointer; width: 32px; height: 32px; line-height: 32px; text-align: center; font-size: 20px; border-radius: 6px; color: var(--ink); }
.fa-pop-head .fa-close:hover { background: var(--row-even); }
.fa-pop-head .fa-close:focus-visible { outline: 2px solid var(--accent); }
.fa-pop table.t { margin: 0; }
.fa-pop .fa-high { font-size: 11px; margin-left: 4px; }
td.fa-bids-cell { overflow: visible; }
table.fa-offers .fa-topline b { color: var(--navy-2); }
.fa-pending .scroll { overflow: visible; }
@media (max-width: 700px) { .fa-pop { position: fixed; left: 8px; right: 8px; top: 20vh; min-width: 0; max-width: none; } }
.myfa-add { margin-top: 6px; }
/* exec-03: My Free Agency never scrolls sideways. The watch list and the search results wrap their cells at any width, and on a
   phone every row stacks into a block (the column name from data-label at the left of each cell); Remove / + Watch stay in view. */
.myfa-list .scroll, .myfa-search .scroll { overflow-x: visible; }
table.myfa-table th, table.myfa-table td, table.myfa-results th, table.myfa-results td { white-space: normal; }
table.myfa-table td.nowrap, table.myfa-results td.nowrap { white-space: normal; }
table.myfa-table td.myfa-remove form, table.myfa-results td.myfa-remove form { margin: 0; }
.myfa-find { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; font-size: 13px; }
.myfa-find input[type=search] { font-size: 13px; }
.myfa-found { margin: 8px 0 0; }
@media (max-width: 700px) {
  table.myfa-table thead, table.myfa-results thead { display: none; }
  table.myfa-table, table.myfa-table tbody, table.myfa-table tr, table.myfa-table td,
  table.myfa-results, table.myfa-results tbody, table.myfa-results tr, table.myfa-results td { display: block; width: 100%; box-sizing: border-box; }
  table.myfa-table tr, table.myfa-results tr { border: 1px solid var(--line); border-radius: 6px; margin: 0 0 8px; padding: 4px 0; }
  table.myfa-table td, table.myfa-results td { display: flex; justify-content: flex-start; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; text-align: right; border-bottom: 0; padding: 2px 8px; }
  table.myfa-table td::before, table.myfa-results td::before { content: attr(data-label); color: var(--muted); font-size: 12px; text-align: left; flex: 0 0 38%; margin-right: auto; }
  table.myfa-table tr.ex td[colspan], table.myfa-results tr.ex td[colspan] { display: block; text-align: left; }
  table.myfa-table tr.ex td[colspan]::before { content: none; }
}
/* exec-03: the My DA Weights switch */
.myda-outside { display: block; margin-top: 6px; }
.myda-outside input[type=checkbox] { vertical-align: middle; }
.tx-tabs small { font-weight: normal; opacity: .8; }
.tx-filters { padding: 0; }
.tx-note { margin: 0 0 10px; }
table.t tr.tx-turned td { font-size: 12px; color: var(--muted); border-top: 0; }
table.t tr.tx-tag td { color: var(--grey); }
.tx-more { display: inline; }
.tx-more summary { display: inline; cursor: pointer; color: var(--accent); }
.tx-showall { margin: 0; }
.draft-years { margin: 0 0 10px; font-size: 13px; }
@media (max-width: 700px) { .fa-controls label { display: inline-flex; gap: 4px; align-items: center; } }

/* W-019 exec-02 (Amendment 1 section 5): the Schedule page - the week picker with previous / next, the games table, the weather
   icon with its hover / tap popup (a focusable span: a tap focuses it on a phone, so :focus shows the popup there too); the home
   page's "Next games" box (a compact grid, the viewer's own game highlighted); the Team page's upcoming games. */
.sched-pick { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 10px; }
.sched-pick label { font-size: 13px; color: var(--muted); display: inline-flex; align-items: center; gap: 6px; }
.sched-pick select { font: inherit; padding: 3px 5px; border: 1px solid var(--line); border-radius: 4px; max-width: 100%; }
.sched-pick .btn { font-size: 13px; padding: 4px 10px; }
.sched-pick .btn:hover { text-decoration: none; background: var(--navy-2); border-color: var(--navy-2); }
.sched-pick .btn.off { background: #b8c0cf; border-color: #b8c0cf; color: #f4f5f8; cursor: default; }
table.sched-t td.wx-cell { padding-top: 2px; padding-bottom: 2px; }
table.sched-t tr.upcoming td { color: var(--muted); }
table.sched-t tr.upcoming td a { color: var(--accent); }
.wx { position: relative; display: inline-flex; align-items: center; gap: 4px; cursor: help; outline-offset: 2px; vertical-align: middle; }
.wx .wxi { width: 22px; height: 22px; display: block; }
.wx-sun { color: #d9a441; }
.wx-rain { color: #3d6fb6; }
.wx-snow { color: #7aa7d8; }
.wx-storm { color: #4a4f7a; }
.wx-other { color: var(--muted); }
.wx-word { font-size: 12px; color: var(--ink); }
.wx-pop { display: none; position: absolute; left: 50%; bottom: calc(100% + 6px); transform: translateX(-50%); white-space: nowrap; background: var(--navy); color: #fff; font-size: 12px; line-height: 1.3; padding: 4px 8px; border-radius: 4px; box-shadow: 0 2px 6px rgba(3,19,45,.3); z-index: 5; pointer-events: none; }
.wx-pop::after { content: ""; position: absolute; left: 50%; top: 100%; margin-left: -5px; border: 5px solid transparent; border-top-color: var(--navy); }
.wx:hover .wx-pop, .wx:focus .wx-pop, .wx:focus-within .wx-pop { display: block; }
/* W-036 (N-80, D-467): the weather pop-up never widens its table (no sideways scrollbar from a tooltip): without scripts it opens
   leftwards from the icon's right edge in a Weather cell; with assets/popfix.js every .wx-pop in a scroll box is pinned to the
   viewport while it shows (no arrow then). */
.wx-cell .wx-pop { left: auto; right: 0; transform: none; }
.wx-cell .wx-pop::after { left: auto; right: 7px; margin-left: 0; }
.wx-pop.pinned { z-index: 60; }
.wx-pop.pinned::after { display: none; }
.next-games ul.ng { list-style: none; margin: 0; padding: 8px 12px 6px; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 4px 10px; }
.next-games ul.ng li { display: flex; align-items: center; gap: 5px; padding: 3px 6px; border-radius: 4px; font-size: 13px; border: 1px solid transparent; }
.next-games ul.ng li a { display: inline-flex; align-items: center; gap: 3px; font-weight: 600; }
.next-games ul.ng li img { display: block; }
.next-games ul.ng li .at { color: var(--muted); }
.next-games ul.ng li .sc { margin-left: auto; font-variant-numeric: tabular-nums; color: var(--muted); }
.next-games ul.ng li.mine { background: var(--hl); border-color: var(--gold); }
.next-games ul.ng li.mine a { color: var(--navy-2); }
@media (max-width: 700px) { .next-games ul.ng { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* W-019 exec-02 (D-243 (2)): Upload Status "Last file used" as a small icon with a hover / tap popup; the rejected note the same. */
.ufile { position: relative; display: inline-flex; align-items: center; cursor: help; vertical-align: middle; color: #2e9d52; outline-offset: 2px; }
.ufile.none { color: var(--grey); cursor: default; }
.ufile.unchecked { color: #8a7a2a; }
.ufile.rejected { color: var(--red); margin-left: 4px; }
.ufile .ufi { width: 20px; height: 20px; display: block; }
.ufile .wx-pop { white-space: normal; min-width: 150px; max-width: 260px; text-align: left; }
.ufile:hover .wx-pop, .ufile:focus .wx-pop { display: block; }
table.uploads td.l.used { white-space: nowrap; }

/* W-019 exec-02 (D-243 (3), (4)): the staff draft editor - the list and the fallback preferences in their own cards; a listed
   coach's remaining contract years in red (readable without colour: "2 yrs left"). */
.sd-yrs { color: var(--red); font-weight: 600; white-space: nowrap; }
table.sd-list tr.hl-add td { background: var(--hl); }
.sd-prefs-card .body { padding-top: 6px; }

/* W-021: the league-start draft rebuilt (Amendment 2) - the finish-mode radios inline, the minimums / mix table, the Entry
   checklist's round links (green = every pick of the round entered, amber = some), the pause after the live rounds. */
.ls-finish label input { display: inline; margin-right: 4px; }
.ls-finish label { font-size: 13px; color: inherit; margin-right: 12px; }
table.ls-rules input { text-align: right; }
table.ls-rules tr.group td { background: var(--hl); }
table.ls-rules tr.total td { border-top: 2px solid var(--line); }
.checklist-rounds a, .checklist-rounds span.on { display: inline-block; min-width: 1.9em; text-align: center; padding: 2px 4px; margin: 1px 0; border: 1px solid var(--line); border-radius: 4px; text-decoration: none; }
.checklist-rounds span.on { background: var(--ink); color: #fff; border-color: var(--ink); }
.checklist-rounds a.done { background: var(--ok-bg, #e6f4ea); }
.checklist-rounds a.part { background: var(--hl); }
.lists-pause { font-weight: 500; }

/* W-022 (R-3.1): the "Commissioner Only" box at the bottom of an owner page (what only the commissioner / assistants see) */
.commish-only { border-color: var(--red); }
.commish-only > h2 { background: var(--red); border-bottom-color: var(--navy-2); }
.commish-only .body p { margin: 0 0 6px; }
.commish-only .body p:last-child { margin-bottom: 0; }
.commish-only form { display: inline; margin: 0; }
/* W-022 (R-3.3): the rail's groups fold on a ▸ / ▾ chevron button (every group, My Team too; the nested Rookie Draft /
   Staff Draft lines on a 32 x 32 px button at their end); the top links sit above the first group */
.rail ul.rail-top { margin: 0 0 4px; }
.rail .fold-btn { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 6px; width: 100%; min-height: 32px; padding: 0 10px 0 6px; cursor: pointer; font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit; border-radius: 6px; justify-content: flex-start; }
.rail .fold-mark { display: inline-block; width: 18px; flex: 0 0 18px; text-align: center; color: inherit; font-size: 16px; font-weight: 700; line-height: 1; }   /* exec-02: at least 14 px, the heading's full text colour (D-305) */
.rail .item .sub-btn .fold-mark { color: inherit; }
.rail .fold-mark::after { content: "\25BE"; }
.rail .fold-btn[aria-expanded="false"] .fold-mark::after { content: "\25B8"; }
.rail h4.fold { margin: 8px 0 2px; }
.rail .item .sub-btn { position: relative; z-index: 1; margin-left: auto; width: 32px; min-height: 32px; height: 32px; padding: 0; justify-content: center; flex: 0 0 32px; border-radius: 6px; }
.rail .item .sub-btn:hover { background: rgba(217,164,65,.22); }
.rail .item .badge + .sub-btn { margin-left: 6px; }
.rail li.sub-wrap { list-style: none; }
.rail ul.sub { margin: 0 0 2px 18px; border-left: 1px solid rgba(217,164,65,.35); padding-left: 2px; }
.rail ul.sub .item { padding-top: 3px; padding-bottom: 3px; font-size: 13px; }
.rail ul.sub[hidden] { display: none; }
/* W-022 (R-5.5): the home page's season leaders in the wide left column, two columns of categories */
.home-main .leaders .body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 24px; }
.home-main .leaders .body h3 { margin-top: 8px; }
/* W-022 (R-5.7): the +/- Grades boxes in a two-column grid */
.grades-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; align-items: start; }
.grades-grid .card { margin: 0; }
/* W-022 (R-5.8): the Schedule page's bigger week arrows on the left, the week dropdown at the right of the row */
.sched-pick { justify-content: space-between; }
.sched-arrows { display: inline-flex; gap: 6px; }
.sched-pick .btn.arrow { font-size: 22px; line-height: 1; padding: 2px 14px 5px; min-width: 44px; text-align: center; }
.sched-pick .sched-week { margin-left: auto; }
table.sched-t tr.mine td { background: var(--hl); font-weight: 600; }
/* W-022 (R-4.6): "Next sim: pending"; (R-5.17) the Export Status dot with its popup, the grey dot, "More about this page" */
.next-sim.pending b { color: var(--muted); }
.flag.flag-grey { background: #b8c0cf; }
.status-dot { position: relative; cursor: help; width: 14px; height: 14px; vertical-align: middle; }
.status-dot .wx-pop { white-space: normal; min-width: 170px; max-width: 280px; text-align: left; }
.status-dot:hover .wx-pop, .status-dot:focus .wx-pop { display: block; }
.uploads-key .flag { vertical-align: -1px; }
details.more-about { padding-top: 0; }
details.more-about summary { cursor: pointer; color: var(--accent); font-size: 13px; }
/* W-022 (R-5.11): the Fantasy rules fold */
details.fy-how { margin: 0 0 10px; }
details.fy-how summary { cursor: pointer; color: var(--accent); }
@media (max-width: 1180px) { .grades-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 700px) { .home-main .leaders .body { grid-template-columns: minmax(0, 1fr); } }
/* W-022 (R-5.19): the Trade Block's positions across the top, the ones with nobody listed greyed out; the remove control */
.posfilter .pos-off { color: var(--grey); margin: 0 1px; }
.tb-remove select { font: inherit; font-size: 13px; max-width: 320px; }
/* W-022 (R-5.21): My Uploads - three calm boxes */
.upload-box .ub-what { margin: 0 0 6px; }
.upload-box .ub-line { margin: 0 0 4px; font-size: 13px; color: #394356; }
.upload-box .ub-form { margin: 8px 0 6px; display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; }
.upload-box .ub-form.ub-replace { font-size: 13px; }
.upload-box .ub-form button { font-size: 15px; padding: 5px 12px; }   /* exec-02: every box's Upload button the same size (D-305) */
.upload-box .ub-status { margin: 4px 0 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; font-size: 13px; }
.upload-box .ub-on { color: #1b7a3a; font-weight: 600; }
.upload-box .ub-links { margin-left: auto; font-size: 12px; color: var(--muted); }
.upload-box .ub-links a { color: var(--accent); }
button.linklike { all: unset; color: var(--accent); cursor: pointer; font: inherit; font-size: 12px; }
button.linklike:hover { text-decoration: underline; }
/* W-022 (R-5.23): My Trade Block's group picker and the dead-money hover */
.tb-grp { margin: 6px 0 0; font-size: 13px; }
.tb-grp select { font: inherit; font-size: 13px; }
.hover-help { cursor: help; border-bottom: 1px dotted var(--muted); }
/* W-022 (R-5.28): the team page's unbuilt tabs marked "coming soon"; the roster key as a list */
.tabs span.soon { color: var(--grey); }
.tabs span.soon small { font-size: 10px; text-transform: uppercase; letter-spacing: .3px; margin-left: 4px; }
ul.roster-key { margin: 0; padding-left: 18px; }
ul.roster-key li { margin: 1px 0; }
/* W-022 (R-4.2): a pick-trade row */
table.t tr.tx-pick td b { color: var(--navy-2); }

/* W-023: the draft pages' folds (the rules, the column key, How it works, the passed-over entries, the round cards), the paging, the
   log chips, the Draft Options labels, the star of a listed coach, the Teams table's "No list" mark */
details.draft-rules, details.column-key, details.sd-how, details.passed-over, details.roster-so-far, details.plain-fold, details.how-these { margin: 4px 0 0; }
details.draft-rules > summary, details.column-key > summary, details.sd-how > summary, details.passed-over > summary, details.roster-so-far > summary, details.plain-fold > summary, details.how-these > summary { list-style: none; cursor: pointer; color: var(--accent); font-size: 13px; display: inline-block; }
details.draft-rules > summary::-webkit-details-marker, details.column-key > summary::-webkit-details-marker, details.sd-how > summary::-webkit-details-marker, details.passed-over > summary::-webkit-details-marker, details.roster-so-far > summary::-webkit-details-marker, details.plain-fold > summary::-webkit-details-marker, details.how-these > summary::-webkit-details-marker { display: none; }
details.draft-rules > summary::before, details.column-key > summary::before, details.sd-how > summary::before, details.passed-over > summary::before, details.roster-so-far > summary::before, details.plain-fold > summary::before, details.how-these > summary::before { content: "\25B8 "; font-weight: 700; }
details.draft-rules[open] > summary::before, details.column-key[open] > summary::before, details.sd-how[open] > summary::before, details.passed-over[open] > summary::before, details.roster-so-far[open] > summary::before, details.plain-fold[open] > summary::before, details.how-these[open] > summary::before { content: "\25BE "; }
details.passed-over { display: inline-block; margin: 0 0 0 6px; }
details.passed-over ul { margin: 4px 0 0; padding-left: 18px; }
details.roster-so-far > summary { font-size: 15px; color: var(--ink); }
.draft-rules-line { margin: 0 0 4px; }
.class-intro { margin: 0 0 4px; }
details.card > summary { list-style: none; cursor: pointer; }
details.card > summary::-webkit-details-marker { display: none; }
details.card > summary h2 { margin: 0; }
details.card:not([open]) > summary h2 { border-radius: 6px; }
details.card > summary h2 .fold-mark { display: inline-block; width: 18px; text-align: center; font-weight: 700; font-size: 16px; line-height: 1; margin-right: 2px; color: inherit; }
details.card > summary h2 .fold-mark::after { content: "\25BE"; }
details.card:not([open]) > summary h2 .fold-mark::after { content: "\25B8"; }
.pager { margin: 8px 12px; font-size: 13px; color: var(--muted); }
.pager a { font-weight: 600; }
.rows-sel select { font: inherit; padding: 3px 5px; border: 1px solid var(--line); border-radius: 4px; }
.log-chips { display: flex; flex-wrap: wrap; gap: 6px 10px; margin: 0; }
.log-chips .chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border: 1px solid var(--line); border-radius: 14px; font-size: 13px; cursor: pointer; background: var(--card); }
.log-chips .chip.on { background: var(--navy-2); color: var(--gold-soft); border-color: var(--navy-2); }
.draft-options label.opt { display: block; margin: 4px 0; cursor: help; }
.draft-options input[type=number] { font: inherit; padding: 2px 4px; border: 1px solid var(--line); border-radius: 4px; }
.sd-star { color: var(--gold, #d9a441); font-weight: 700; }
.nolist { color: var(--muted); font-style: italic; }
.sd-results-bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 6px 14px; }
.sd-kept label { font-size: 13px; }
.sd-teams-table td.sd-cell { white-space: normal; font-size: 12px; min-width: 120px; }
ol.ls-steps { margin: 6px 0 0; padding-left: 22px; }
ol.ls-steps li { margin: 0 0 10px; }
ol.ls-steps .ls-upload { margin: 4px 0 0; font-size: 13px; }
.checklist-jump { margin: 6px 0; }
.run-buttons form { display: inline; }
.quick-add > h2 { cursor: help; }
table.sd-list tr.marker-row td { background: var(--gold-soft); font-style: italic; cursor: grab; }
.sd-current .yrs0::before { content: ""; }
/* W-023 exec-02 (section 4): My DA's Players table - the name opens the rookie card, a small "DA" link the My DA detail */
a.myda-detail { font-size: 10px; font-weight: 700; letter-spacing: .3px; padding: 0 4px; border: 1px solid var(--line); border-radius: 3px; text-decoration: none; vertical-align: 1px; }
/* W-023 exec-02 (D-10.4, G-64): a listed coach the staff draft can't hire into the role today is marked, not refused */
table.sd-list tr.sd-warn td { background: #fff4f4; }
.sd-mark { color: var(--red); font-size: 12px; font-weight: 600; white-space: normal; }
.sd-mark-s { color: var(--red); font-size: 11px; white-space: nowrap; }
.sd-warn-note { color: var(--red); }
/* W-023 exec-02 (section 5): the combine colours - red = best 10 % of the position group, blue = next 20 %, green = worst 25 %,
   black the rest, a grey dash for a drill not run (CombineColors) */
.cb-red { color: #b4151a; font-weight: 600; }
.cb-blue { color: #1d4f91; font-weight: 600; }
.cb-green { color: #1b7a3a; font-weight: 600; }
td.cb, dd.cb { cursor: help; }
.cb-key { margin: 8px 0 0; }
/* exec-02 (section 4): the rookie card */
.rookie-head .status { font-size: 12px; font-weight: 600; color: var(--muted); margin-left: 8px; }
.rookie-drafted { margin-top: 4px; }
.rookie-nav { border-top: 1px solid var(--line); }
.rookie-nav p { margin: 2px 0; }
.rookie-nav .sep { color: var(--muted); margin: 0 4px; }
.rookie-nav form.inline { display: inline; margin: 0; }
dl.combines { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 6px 14px; margin: 0; }
dl.combines dt { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .3px; }
dl.combines dd { margin: 0; font-weight: 600; font-size: 16px; }
@media (max-width: 1100px) { .rookie-grid { grid-template-columns: minmax(0, 1fr); } }
/* exec-02 (D-7.6): the My Priority List tick column of the Draft Class; the result of a tick shows in its cell (no banner: the page stays put) */
td.tick-cell { white-space: nowrap; }
.tick-flash { font-size: 11px; color: var(--muted); margin-left: 4px; }
.tick-flash.err { color: var(--red); }
.tick-save { margin: 6px 0 0; }
/* exec-02 (3.4 fix 3): the board's on-the-clock cell wraps ("due Tue 3:10 PM") */
table.draft-board td.wrap { white-space: normal; }
/* W-034 (addendum 1): the short How label; the full reason in the title and in a pop-up on hover / focus (a tap on a phone) */
.how { position: relative; cursor: help; outline-offset: 2px; border-bottom: 1px dotted rgba(60,70,90,.45); }
.how-pop { display: none; position: absolute; left: 0; top: calc(100% + 4px); max-width: 360px; width: max-content; white-space: normal; background: var(--navy); color: #fff; font-size: 12px; line-height: 1.3; padding: 4px 8px; border-radius: 4px; box-shadow: 0 2px 6px rgba(3,19,45,.3); z-index: 5; text-align: left; }
.how:focus .how-pop, .how:focus-within .how-pop { display: block; }
/* W-034 (addendum 2): the lists' auto-save status by the card title ("Saving…" / "Saved 1:42 PM" / "Not saved — try again") */
.card h2 .autosave { font-size: 12px; font-weight: normal; text-transform: none; letter-spacing: 0; color: var(--gold-soft); margin-left: 10px; }
.card h2 .autosave.err { color: #ffb3a7; }
/* exec-02 (3.4 fix 4): a rail line with a badge wraps its label instead of cutting it ("Rookie Draft" beside LIVE) */
.rail .item.has-badge a { white-space: normal; overflow: visible; text-overflow: clip; }
/* exec-02 (3.4 fix 6): on a phone Your picks and My Priority List (W-033: the Draft schedule too) stack every row into a block (the column name from data-label), the
   way My Watch List does, so nothing runs off the right edge */
@media (max-width: 700px) {
  table.your-picks thead, table.draft-list thead, table.draft-schedule thead { display: none; }
  table.your-picks, table.your-picks tbody, table.your-picks tr, table.your-picks td,
  table.draft-list, table.draft-list tbody, table.draft-list tr, table.draft-list td,
  table.draft-schedule, table.draft-schedule tbody, table.draft-schedule tr, table.draft-schedule td { display: block; width: 100%; box-sizing: border-box; }
  table.your-picks tr, table.draft-list tr, table.draft-schedule tr { border: 1px solid var(--line); border-radius: 6px; margin: 0 0 8px; padding: 4px 0; }
  table.your-picks td, table.draft-list td, table.draft-schedule td { display: flex; justify-content: flex-start; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; text-align: right; border-bottom: 0; padding: 2px 8px; white-space: normal; }
  table.your-picks td::before, table.draft-list td::before, table.draft-schedule td::before { content: attr(data-label); color: var(--muted); font-size: 12px; text-align: left; flex: 0 0 38%; margin-right: auto; }
  table.your-picks td[colspan], table.draft-list td[colspan] { display: block; text-align: left; }
  table.your-picks td[colspan]::before, table.draft-list td[colspan]::before { content: none; }
  table.draft-list tr.hl td, table.your-picks tr.hl td, table.draft-schedule tr.hl td { background: var(--gold-soft); }
}

/* W-024 (admin pages): the admin rail's role line and the set-apart group, the "Technical details" folds, the Load log's live
   badge and the rows that are not done, the report's back link, an old stage file in the archive, the small destructive links
   (Remove, Delete, Pause), the entrance's "Forum down?" fold, the Files page's folded seasons */
.rail .rail-role { color: var(--gold-soft); font-size: 11px; text-transform: uppercase; letter-spacing: .6px; padding: 10px 10px 6px; opacity: .85; border-bottom: 1px solid var(--navy-3); margin: 0 0 6px; }
.rail h4.apart { margin-top: 18px; padding-top: 10px; border-top: 1px solid var(--navy-3); }
details.admin-fold { margin: 6px 0 12px; }
details.admin-fold > .fold-inner { margin-top: 6px; }
details.admin-fold > .fold-inner > .card:first-child { margin-top: 6px; }
details.manual-load > .fold-inner { padding: 0 2px; }
.badge-live { display: inline-block; font-size: 10px; font-weight: 700; line-height: 1.5; background: #1b7a3a; color: #fff; padding: 0 6px; border-radius: 9px; margin-left: 4px; vertical-align: 1px; }
table.load-log tr.ld-held td, table.load-log tr.ld-failed td { background: #fdecea; }
table.load-log tr.ld-running td { background: #fff4e5; }
table.load-log tr.ld-discarded td { color: var(--grey); }
.back-link { margin: 0 0 8px; font-size: 13px; }
table.archive tr.old-file td { color: var(--grey); }
table.archive .old-mark { color: var(--red); font-size: 12px; margin-left: 6px; }
button.linklike.danger-link { color: var(--red); font-size: 13px; }
table.owners .row-remove { font-size: 13px; }
details.break-glass > summary { font-size: 14px; }
details.break-glass > .card { margin-top: 8px; }
details.season-files > summary h2 { margin: 0; }

/* W-024 exec-02: the export deadline's late mark (section 8), the status dot's pinned pop-up (section 9d), the Ticker feed table
   (section 6), the Site log by day (section 7.1), the grouped Self-check (section 7.2), the Helper token page (section 7.3), the
   Reset columns (section 7.4), the Find-coaches filter (section 9a) */
.late-tag { display: inline-block; margin-left: 4px; padding: 0 5px; border-radius: 8px; background: #fdeaea; color: var(--red); font-size: 11px; font-weight: 700; vertical-align: 1px; }
.next-sim.none { color: var(--muted); }
.status-dot .wx-pop { left: calc(100% + 8px); bottom: auto; top: 50%; transform: translateY(-50%); }
.status-dot .wx-pop::after { left: -5px; top: 50%; margin-left: 0; margin-top: -5px; border: 5px solid transparent; border-right-color: var(--navy); }
.status-dot .wx-pop.pinned { z-index: 60; }
.status-dot .wx-pop.pinned::after { display: none; }
table.tk-feeds td.tk-what { white-space: normal; max-width: 26em; font-size: 12px; color: var(--muted); }
table.tk-feeds td.tk-opts { white-space: normal; }
table.tk-feeds td.tk-opts label { display: block; font-size: 12px; margin: 1px 0; }
table.tk-feeds td.tk-opts input[type=number] { width: 4.5em; }
table.tk-feeds tr.off td { color: var(--grey); }
.tk-switch { display: inline; }
button.switch { min-width: 3.2em; border-radius: 12px; }
button.switch.is-on { background: #1b7a3a; color: #fff; border-color: #1b7a3a; }
details.log-day > summary { list-style: none; cursor: pointer; padding: 8px 14px; font-size: 15px; }
details.log-day > summary::-webkit-details-marker { display: none; }
details.log-day > summary::before { content: "\25B8 "; font-weight: 700; color: var(--accent); }
details.log-day[open] > summary::before { content: "\25BE "; }
details.log-day > .scroll { padding: 0 0 6px; }
table.log-table td.nowrap { white-space: nowrap; }
details.log-fold { display: inline; margin-left: 6px; }   /* W-026 (N-41 b): the link stays beside the What text, the detail opens under the line */
details.log-fold > summary { font-size: 12px; display: inline; }
details.log-fold > .fold-inner { display: block; }
.log-detail { font-size: 12px; color: var(--muted); margin: 2px 0 0; white-space: normal; word-break: break-word; }
/* W-026 (N-41 d): the stage-file archive fits at 1,400 px: the long cells wrap, the stamps and the short stage name never; a phone still scrolls it sideways */
table.archive td { white-space: normal; }
table.archive td.stamp, table.archive .stamp { white-space: nowrap; }
@media (max-width: 700px) { table.archive { min-width: 760px; } }
.log-pager { display: flex; gap: 16px; }
.log-more { margin: 2px 14px 10px; font-size: 13px; }   /* W-028 (N-38): "Show all N lines of this day" under a capped day */
.sc-summary .sc-line-exact { font-size: 12px; color: var(--muted); font-weight: normal; margin-top: 2px; }
details.sc-group > summary { list-style: none; cursor: pointer; padding: 8px 14px; font-size: 15px; }
details.sc-group > summary::-webkit-details-marker { display: none; }
details.sc-group > summary::before { content: "\25B8 "; font-weight: 700; color: var(--accent); }
details.sc-group[open] > summary::before { content: "\25BE "; }
.sc-badge-PASS { background: #1b7a3a; } .sc-badge-WARN { background: #b35900; } .sc-badge-FAIL { background: var(--red); }
details.sc-fold { display: inline-block; margin-left: 6px; }
details.sc-fold > summary { font-size: 12px; }
.sc-data { font-size: 11px; color: var(--muted); margin: 2px 0 0; white-space: normal; word-break: break-word; }
.new-address { display: inline-block; margin-left: 4px; padding: 0 5px; border-radius: 8px; background: #fff4e5; color: #b35900; font-size: 11px; font-weight: 700; }
.reset-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 14px; }
.reset-list { margin: 0; padding: 0 0 0 18px; }
.reset-list li { margin: 2px 0; }
.reset-also { display: block; }
.sd-hireable { font-size: 13px; }
.sd-hidden { font-size: 12px; }
@media (max-width: 700px) { .reset-cols { grid-template-columns: minmax(0, 1fr); } }

/* W-027 (SPEC_W-027 §4, N-45): the site's own team art. img.art = the team's helmet (a transparent PNG made at 2x the shown size);
   on the navy strip and the side menu it gets a thin white outline (four 1 px drop shadows follow the helmet's shape; a CSS outline
   would box the picture); on light cards and tables none. The table icons are 26 px, the strip's 30, the menu's 28 (the sizes
   come from the img attributes). The team page shows the banner alone (268 x 164; scaled down on a phone) first in the team-name
   card, at the left where the game's logo sat (W-028, N-46), the text to its right; its box has room for a second banner later (N-14). */
.strip img.art, .rail img.art { filter: drop-shadow(1px 0 0 #fff) drop-shadow(-1px 0 0 #fff) drop-shadow(0 1px 0 #fff) drop-shadow(0 -1px 0 #fff); }
.rail .team-ic { width: 28px; height: 28px; flex: 0 0 28px; display: flex; align-items: center; justify-content: center; }
.rail .team-ic img { display: block; }
td img.logo-s, th img.logo-s { vertical-align: middle; margin: -4px 0; }   /* 26 px shown, 18 px in the flow: the rows keep their height */
.team-head .banners { display: flex; gap: 10px; align-items: center; flex: 0 0 auto; }   /* W-028 (N-46): first in the card, at the left */
.team-head img.team-banner { width: 268px; max-width: 100%; height: auto; }
@media (max-width: 700px) {
  .team-head { flex-wrap: wrap; }
  .team-head .banners { width: 100%; }   /* the banner above the text */
  .team-head img.team-banner { width: 201px; }
  .team-head > div:not(.banners) { flex: 1 1 10em; min-width: 0; }   /* the text stays beside the game's logo (a wrapped row breaks by the text's full width otherwise) */
}
/* Admin -> Team art */
.ta-forms { align-items: start; }
table.teamart td.ta-h img, table.teamart td.ta-b img { vertical-align: middle; margin-right: 4px; }
table.teamart td.ta-act { white-space: nowrap; }
table.ta-plan td:last-child { white-space: normal; min-width: 22em; }   /* a refusal reads whole */
table.ta-plan tr.refused td { color: var(--red); }
table.ta-plan tr.refused td b { color: var(--red); }
form.ta-apply { display: inline-block; margin: 8px 8px 0 0; }
/* W-027 (N-44, C-060 §W): the home strip on one line at a wide window with the download links, a note and the countdown: from
   1,200 px up the items do not wrap; the note (and the Hold item) takes the room that is left and wraps inside it; the fixed
   items stay whole. The strip's type is one size smaller there (13 px) with 10 px gaps: at 1,400 px the four fixed items
   (the stage, the deadline with its countdown, the download links, the files-in item) need ~1,000 px of the card's ~1,130, so a
   short note still gets a line of its own room. Below 1,200 px the strip wraps its items as before (tidy on a phone). */
@media (min-width: 1200px) {
  .home-strip { flex-wrap: nowrap; gap: 4px 10px; font-size: 13px; align-items: flex-start; }
  .home-strip > span { white-space: nowrap; flex: 0 0 auto; }
  .home-strip .sched-note, .home-strip .hold { white-space: normal; flex: 1 1 0; min-width: 3em; }
}
/* W-035 (N-69): the Position filter as tick boxes (QB … LS) with the All / All but K-P-LS shortcuts; wraps on a phone */
.sd-filter .pos-ticks { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; border: 1px solid var(--line); border-radius: 6px; padding: 2px 8px 4px; margin: 0; min-width: 0; }
.sd-filter .pos-ticks legend { font-size: 12px; color: var(--muted); padding: 0 4px; }
.sd-filter .pos-tick { display: inline-flex; align-items: center; gap: 2px; font-size: 13px; white-space: nowrap; }
.sd-filter .pos-tick input { margin: 0; }
.sd-filter .pos-shortcuts { font-size: 12px; margin-left: 6px; white-space: nowrap; }
/* W-035 (N-77): Cur / Fut cells coloured by their value (lib/Ratings.php writes the colours inline; the band class is for the key and tests) */
td.rt { text-align: center; font-variant-numeric: tabular-nums; min-width: 2.4em; }
.rt-key { padding: 0 5px; border-radius: 3px; white-space: nowrap; }
.rt-key.rt-blue { background: hsl(218 60% 66%); color: #10151c; }
.rt-key.rt-green { background: hsl(135 50% 72%); color: #10151c; }
.rt-key.rt-yellow { background: hsl(50 92% 72%); color: #10151c; }
.rt-key.rt-red { background: hsl(350 65% 70%); color: #10151c; }

/* W-035 exec-02 (N-85): the position tick boxes' three buttons (All / All excl. K-P-LS / Clear all; shown by assets/posticks.js) */
.pos-ticks .pos-buttons { display: inline-flex; flex-wrap: wrap; gap: 4px; margin-left: 6px; }
.pos-ticks .pos-btn { padding: 1px 7px; font-size: 12px; background: #fff; color: var(--navy-2); border-color: var(--navy-2); }
.pos-ticks .pos-btn:hover { background: var(--hl); }
/* W-035 exec-02 (N-63): the quick-look control on a row and its panel (a side panel; full width on a phone) */
button.ql-open { padding: 0 6px; font-size: 11px; line-height: 16px; vertical-align: middle; background: #fff; color: var(--navy-2); border: 1px solid var(--line); border-radius: 3px; }
button.ql-open:hover, button.ql-open:focus { border-color: var(--navy-2); background: var(--hl); }
tr.ql-current > td { background: var(--hl) !important; }
.ql-panel { position: fixed; top: 0; right: 0; bottom: 0; width: 460px; max-width: 100%; background: var(--card); border-left: 1px solid var(--navy-2); box-shadow: -2px 0 10px rgba(3,19,45,.25); overflow-y: auto; z-index: 60; padding: 0 12px 16px; box-sizing: border-box; }
.ql-bar { display: flex; gap: 6px; align-items: center; position: sticky; top: 0; z-index: 1; background: var(--card); padding: 8px 0 6px; border-bottom: 1px solid var(--line); }
.ql-bar .ql-pos { font-size: 12px; }
.ql-bar .ql-close { margin-left: auto; }
.ql-card h3 { margin: 10px 0 4px; font-size: 18px; }
.ql-card h3 .pos { color: var(--muted); font-weight: 600; margin-right: 6px; }
.ql-card h3 .status { font-size: 12px; font-weight: normal; color: var(--muted); margin-left: 6px; }
.ql-card h4 { margin: 12px 0 4px; font-size: 12px; text-transform: uppercase; letter-spacing: .4px; color: var(--navy-2); }
.ql-card h4 small { font-weight: normal; text-transform: none; letter-spacing: 0; color: var(--muted); }
.ql-bio { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 0 0 6px; font-size: 13px; }
.ql-bio dt { display: inline; color: var(--muted); }
.ql-bio dd { display: inline; margin: 0 0 0 4px; font-weight: 600; }
.ql-card table.t { font-size: 12px; width: 100%; }
.ql-card table.ql-pair { width: auto; }
.ql-card table.skills td.bar { min-width: 120px; }
.ql-card dl.combines { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ql-card .ql-listform { margin: 10px 0 0; }
.ql-card .ql-whose, .ql-card .ql-barsnote { margin: 4px 0 0; }
.ql-card details.ql-da { margin-top: 10px; }
.ql-card details.ql-da summary { cursor: pointer; font-weight: 600; font-size: 13px; }
.ql-card .myda-detail { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 700px) {
  .ql-panel { width: 100%; left: 0; padding: 0 10px 16px; }
  .ql-card dl.combines { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* W-037 (N-78): the per-game panel behind a season row of the player card (assets/gamelines.js, the quick-look panel's shell) */
tr.gl-row { cursor: pointer; }
tr.gl-row:hover > td, tr.gl-row:focus > td { background: var(--hl) !important; }
tr.gl-row:focus { outline: 2px solid var(--navy-2); outline-offset: -2px; }
.gl-panel { width: 900px; }
.gl-panel .gl-head { font-weight: 600; font-size: 13px; color: var(--navy-2); }
.gl-panel .gl-title { margin: 10px 0 2px; font-size: 14px; }
.gl-panel .gl-title small { font-weight: normal; font-size: 12px; }
.gl-panel .gl-player { margin: 0 0 8px; font-size: 13px; }
.gl-panel table.t { font-size: 12px; }
.gl-panel table.t tfoot td { border-top: 2px solid var(--navy-2); font-weight: 600; }
.gl-panel .gl-note { font-size: 12px; margin: 8px 0 0; }

/* W-038 (N-96): the no-spoilers page (nospoilers/index.php). The table shows no score: visitor @ home, the weather, Log, Box (final score),
   Show score (a button; the score it fetches replaces it). On a phone every row stacks into a block (the column name from data-label),
   as My FA's lists do, so the Show score button stays in view without a sideways scroll. */
.ns-intro { margin: 0 0 10px; font-size: 14px; color: var(--ink); background: var(--hl); border: 1px solid var(--gold); border-radius: 6px; padding: 8px 12px; }
.ns-pick .ns-sched { margin-left: auto; font-size: 13px; }
.ns-pick .sched-week { margin-left: 0; }
.card.ns h3.ns-week { margin: 0; padding: 6px 12px; font-size: 13px; font-weight: 700; color: var(--navy-2); background: var(--row-even); border-bottom: 1px solid var(--band-line); text-transform: uppercase; letter-spacing: .4px; }
.card.ns h3.ns-week small { font-weight: normal; text-transform: none; letter-spacing: 0; color: var(--muted); }
table.ns-t td.at { color: var(--muted); padding-left: 2px; padding-right: 2px; }
table.ns-t td.l { white-space: nowrap; }
table.ns-t .ns-team { vertical-align: middle; }
table.ns-t .btn.small.ns-show { font-size: 12px; padding: 3px 9px; }
table.ns-t .ns-sc { font-weight: 600; color: var(--navy-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
table.ns-t td.ns-score { min-width: 9em; }
.card.ns .ns-wv-week { margin: 4px 12px 10px; font-size: 13px; }   /* W-039: the week's WAFLvision link under its table */
@media (max-width: 700px) {
  .card.ns .scroll { overflow-x: visible; }
  table.ns-t thead { display: none; }
  table.ns-t, table.ns-t tbody, table.ns-t tr, table.ns-t td { display: block; width: 100%; box-sizing: border-box; }
  table.ns-t tr { border: 1px solid var(--line); border-radius: 6px; margin: 6px 8px; padding: 4px 0; width: auto; }
  table.ns-t td { display: flex; justify-content: flex-start; flex-wrap: wrap; align-items: center; gap: 2px 6px; text-align: left; border-bottom: 0; padding: 2px 8px; white-space: normal; }
  table.ns-t td::before { content: attr(data-label); color: var(--muted); font-size: 12px; text-align: left; flex: 0 0 34%; margin-right: auto; }
  table.ns-t td.at { display: none; }
  table.ns-t td.ns-score { min-width: 0; }
  table.ns-t td.wx-cell .wx-pop { left: auto; right: 0; }
}