/* ======================================================
   GB NFL Optimizer — GameBlazers × SilverReyes Edition
   ====================================================== */

*, *::before, *::after {
  box-sizing: border-box;
}

/* Theme, typography and the compact shared header live in game-day.css. */
body { margin: 0; padding: 0; background: var(--bg); color: var(--text); font-family: var(--font-body); line-height: 1.5; }

.expired-tag {
  display: inline-block;
  margin-left: 0.35em;
  padding: 0.03em 0.32em;
  vertical-align: 0.08em;
  color: var(--danger);
  background: var(--surface);
  border: 3px double var(--danger);
  font-size: 0.7em;
  font-weight: bold;
  line-height: 1.15;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  white-space: nowrap;
}

/* H3 styling for content sections — used by the rendered changelog
   ("### Fixed", "### Added"). h2 styling already covered by .contest-section h2. */
.contest-section h3 {
  margin: 1rem 0 0.4rem;
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-muted);
}

/* ── Main layout ─────────────────────────────────────────── */

main {
  max-width: 1200px;
  margin: 2rem auto;
  padding: 0 1.25rem;
}

/* ── Two-column layout ───────────────────────────────────── */

.content-layout {
  display: block;
}

.content-layout.has-sidebar {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 1.5rem;
  align-items: start;
}

.sidebar {
  position: sticky;
  top: 1.5rem;
}

/* ── Exclusion report (sidebar) ──────────────────────────── */

#exclusion-report {
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: var(--radius);
  box-shadow: var(--shadow-md);
  overflow: hidden;
}

#exclusion-report h2 {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 0.85rem 1.25rem;
  background: var(--surface-2);
  color: var(--text-muted);
  border-bottom: 1px solid var(--border);
}

#exclusion-report ul {
  margin: 0;
  padding: 0.85rem 1.25rem 1rem 1.75rem;
  font-family: var(--font-mono);
  font-size: 0.85rem;
  color: var(--text);
  line-height: 1.6;
}

#exclusion-report ul li {
  margin-bottom: 0.45rem;
}

#exclusion-report ul li:last-child {
  margin-bottom: 0;
}

.excl-reason {
  color: var(--text-muted);
}

/* ── Upload section ──────────────────────────────────────── */

#upload-section {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-md);
  margin-bottom: 1.5rem;
  overflow: hidden;
}

#upload-section summary {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 0.66rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  user-select: none;
  padding: 0.9rem 1.5rem;
  background: var(--surface-2);
  color: var(--text-muted);
  list-style: none;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  border-bottom: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  transition: color 0.2s;
}

#upload-section summary:hover {
  color: var(--text);
}

#upload-section summary::-webkit-details-marker { display: none; }

#upload-section summary::before {
  content: '▸';
  font-size: 0.8rem;
  transition: transform 0.2s ease;
  color: var(--gold);
}

#upload-section[open] summary::before {
  transform: rotate(90deg);
}

#upload-section > form {
  padding: 1.5rem;
}

.form-row {
  display: flex;
  flex-direction: column;
  margin-top: 1rem;
}

.form-row-heading {
  font-family: var(--font-mono);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 0.4rem;
  display: block;
}

.file-upload-zone {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  background: var(--surface-2);
  border: 1.5px dashed var(--accent);
  border-radius: var(--radius);
  padding: 1.2rem 1rem;
  cursor: pointer;
  transition: border-color 0.2s, background 0.2s;
  text-align: center;
}

.file-upload-zone:hover {
  border-color: var(--accent-hover);
  background: var(--accent-dim);
}

.file-upload-zone input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  clip: rect(0,0,0,0);
}

.upload-icon {
  color: var(--accent);
  opacity: 0.75;
  width: 22px;
  height: 22px;
}

.upload-hint {
  font-family: var(--font-mono);
  font-size: 0.70rem;
  color: var(--text-muted);
  letter-spacing: 0.06em;
}

.upload-filename {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  color: var(--accent);
  display: block;
  font-weight: 500;
  max-width: 100%;
  overflow-wrap: anywhere;
}

/* -- Source selector -- */

.source-selector {
  display: flex;
  gap: 16px;
  margin-top: 8px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.csv-only-hint {
  border-left: 1px solid var(--border-2);
  padding-left: 12px;
  font-size: 0.72rem;
  color: var(--text-muted);
  line-height: 1.6;
  font-style: italic;
}

.hybrid-hint {
  border-left: 1px solid var(--border-2);
  padding-left: 12px;
  font-size: 0.72rem;
  color: var(--text-muted);
  line-height: 1.6;
  font-style: italic;
}

.csv-format-hint {
  border-left: 1px solid var(--border-2);
  padding-left: 12px;
  font-size: 0.72rem;
  color: var(--text-muted);
  line-height: 1.7;
}

.csv-format-hint strong {
  color: var(--text);
}

.csv-format-hint code {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  background: var(--surface-3);
  border: 1px solid var(--border);
  border-radius: 3px;
  padding: 0 4px;
  color: var(--accent);
}

.source-radio {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--text);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
}

.source-radio:has(input[disabled]) {
  opacity: 0.35;
  cursor: not-allowed;
}

.csv-hint {
  margin: 0.5rem 0 0.75rem;
  font-size: 0.75rem;
  color: var(--text-muted);
  line-height: 1.7;
}

.csv-hint strong {
  color: var(--text);
}

.csv-hint code {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  background: var(--surface-3);
  border: 1px solid var(--border);
  border-radius: 3px;
  padding: 0 4px;
  color: var(--accent);
}

.csv-hint-note {
  font-size: 0.68rem;
  color: var(--text-muted);
  opacity: 0.75;
}

/* ── Buttons ─────────────────────────────────────────────── */

button[type="submit"] {
  margin-top: 1.5rem;
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: var(--radius);
  padding: 0.65rem 2rem;
  font-family: var(--font-display);
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.18s, box-shadow 0.18s, transform 0.1s;
  box-shadow: none;
}

button[type="submit"]:hover {
  background: var(--accent-hover);
  box-shadow: none;
  transform: translateY(-1px);
}

button[type="submit"]:active {
  transform: translateY(0);
  box-shadow: none;
}

button[type="submit"]:disabled {
  opacity: 0.45;
  cursor: wait;
  transform: none;
  box-shadow: none;
}

.btn-secondary,
.secondary-button {
  background: transparent;
  border: 1px solid var(--border-2);
  border-radius: 5px;
  padding: 0.25rem 0.85rem;
  font-family: var(--font-mono);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}

.btn-secondary:hover,
.secondary-button:hover {
  border-color: var(--accent);
  color: var(--accent);
  background: var(--accent-dim);
}

/* Inside the player-pool summary's flex layout, the Clear All button
   pushes to the right edge — preserves original positioning. */
#player-pool-section summary .btn-secondary {
  margin-left: auto;
  flex-shrink: 0;
}

/* Container for a "← back" link row — used on the changelog page. */
.back-link-row {
  margin: 1.5rem 0;
}

/* ── Alerts & banners ────────────────────────────────────── */

.error {
  background: rgba(220, 38, 38, 0.08);
  border: 1px solid rgba(220, 38, 38, 0.22);
  border-left: 3px solid #dc2626;
  border-radius: var(--radius);
  color: var(--danger);
  font-weight: 600;
  padding: 0.85rem 1.1rem;
  margin: 0.75rem 0 1.25rem;
  font-size: 0.84rem;
  font-family: var(--font-mono);
}

.reset-banner {
  background: var(--gold-dim);
  border: 1px solid rgba(201, 168, 69, 0.22);
  border-left: 3px solid var(--gold);
  color: var(--gold);
  padding: 0.7rem 1.1rem;
  margin-bottom: 1.25rem;
  border-radius: var(--radius);
  font-size: 0.76rem;
  font-family: var(--font-mono);
  font-weight: 500;
}

/* Game-day availability freshness banner (P6.22): a warmer, more urgent cast of
   the reset-banner shell — accent, not gold — since a stale availability feed on a
   game day is actionable now. */
.banner-gameday-freshness {
  background: var(--accent-dim);
  border: 1px solid var(--accent-glow);
  border-left: 3px solid var(--accent);
  color: var(--accent);
}

/* Schedule flex-change banner (P6.22, F12 render): the notice-info shell already
   carries the informational blue; the list just tightens spacing. */
.flex-changes-banner {
  margin-bottom: 1.25rem;
}

.flex-changes-list {
  margin: 0.4rem 0 0;
  padding-left: 1.2rem;
  font-family: var(--font-mono);
  font-size: 0.76rem;
  line-height: 1.7;
}

/* Import-staleness badge (P6.22): an eligible import lagging the newest eligible
   API fetch past the 48 h bound, flagged inline on the data-health strip row. */
.stale-import-badge {
  display: inline-block;
  padding: 0 0.45rem;
  border: 1px solid var(--accent-glow);
  border-radius: 3px;
  background: var(--accent-dim);
  font-family: var(--font-mono);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--accent);
}

/* ── Player pool ─────────────────────────────────────────── */

#player-pool-section {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-md);
  margin-bottom: 1.5rem;
  overflow: hidden;
}

#player-pool-section > summary {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 0.66rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  user-select: none;
  padding: 0.9rem 1.5rem;
  background: var(--surface-2);
  color: var(--text-muted);
  list-style: none;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  justify-content: space-between;
  border-bottom: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  transition: color 0.2s;
}

#player-pool-section > summary:hover {
  color: var(--text);
}

#player-pool-section > summary::-webkit-details-marker { display: none; }

#player-pool-section > summary::before {
  content: '▸';
  font-size: 0.8rem;
  transition: transform 0.2s ease;
  color: var(--accent);
}

#player-pool-section[open] > summary::before {
  transform: rotate(90deg);
}

.pool-hint {
  font-weight: 400;
  font-size: 0.62rem;
  color: var(--text-muted);
  margin-left: 4px;
}

.pool-inner {
  padding: 1rem 1.25rem 1.25rem;
  overflow-x: auto;
}

/* ── Tables ──────────────────────────────────────────────── */

table {
  width: 100%;
  border-collapse: collapse;
  background: transparent;
  font-size: 0.86rem;
  font-family: var(--font-body);
}

th, td {
  padding: 0.55rem 0.9rem;
  text-align: left;
  border-bottom: 1px solid var(--border);
  color: var(--text);
}

td:first-child,
th:first-child {
  text-align: center;
}

thead th {
  background: var(--surface-3);
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 0.63rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--border-2);
  white-space: nowrap;
}

thead th[onclick] {
  cursor: pointer;
  user-select: none;
  transition: color 0.15s, background 0.15s;
}

thead th[onclick]:hover {
  color: var(--accent);
  background: var(--surface-2);
}

tfoot td, tfoot th {
  background: var(--surface-3);
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 0.8rem;
  border-top: 1px solid var(--border-2);
  border-bottom: none;
  color: var(--gold);
}

tbody tr:hover {
  background: var(--accent-dim);
}

tbody tr:last-child td {
  border-bottom: none;
}

input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 15px;
  height: 15px;
  border: 1.5px solid #484848;
  border-radius: 3px;
  background: var(--surface-3);
  cursor: pointer;
  position: relative;
  vertical-align: middle;
  flex-shrink: 0;
  transition: border-color 0.15s, background 0.15s;
}

input[type="checkbox"]:hover:not(:disabled) {
  border-color: var(--accent);
}

input[type="checkbox"]:checked {
  background: var(--accent);
  border-color: var(--accent);
}

input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  left: 3.5px;
  top: 0.5px;
  width: 5px;
  height: 9px;
  border: 2px solid #fff;
  border-top: none;
  border-left: none;
  transform: rotate(45deg);
}

input[type="checkbox"]:disabled {
  opacity: 0.28;
  cursor: not-allowed;
}

/* ── Constraint count ────────────────────────────────────── */

#constraint-count {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 0.06em;
  margin-bottom: 0.85rem;
  padding: 0.4rem 0.85rem;
  background: var(--accent-dim);
  border: 1px solid rgba(244, 123, 61, 0.18);
  border-radius: 4px;
  display: inline-block;
}

/* ── Contest sections ────────────────────────────────────── */

.contest-section {
  margin-bottom: 2.5rem;
}

.contest-section h2 {
  font-family: var(--font-display);
  font-size: 1.55rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text);
  margin: 0 0 1rem;
  padding-bottom: 0.65rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.contest-section h2::before {
  content: '';
  display: inline-block;
  width: 4px;
  height: 1.2rem;
  background: var(--accent);
  border-radius: 2px;
  flex-shrink: 0;
}

.lineup-block {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
  margin-bottom: 1rem;
}

.lineup-header {
  padding: 0.65rem 1rem;
  background: var(--surface-2);
  border-bottom: 1px solid var(--border);
  font-family: var(--font-mono);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--text-muted);
  display: flex;
  gap: 1.5rem;
}

.lineup-header span {
  color: var(--gold);
}

.lineup-header strong {
  color: var(--text);
}

.early-game-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding: 0.55rem 1rem;
  border-bottom: 1px solid var(--border);
  background: var(--surface-3);
}

.early-game-badge {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(244, 123, 61, 0.35);
  border-radius: var(--badge-radius);
  padding: 0.25rem 0.55rem;
  background: var(--accent-dim);
  color: var(--accent);
  font-family: var(--font-mono);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.035em;
}

.lineup-card-list {
  display: grid;
}

.lineup-card-row {
  display: grid;
  grid-template-columns: minmax(4rem, 0.55fr) minmax(12rem, 2fr) repeat(5, minmax(4rem, 0.65fr));
  gap: 0.75rem;
  align-items: center;
  padding: 0.6rem 1rem;
  border-bottom: 1px solid var(--border);
  font-size: 0.82rem;
}

.lineup-player-points {
  display: inline-flex;
  align-items: baseline;
  gap: 0.3rem;
  font-variant-numeric: tabular-nums;
}

.points-mark {
  color: var(--text-muted);
  font: inherit;
  font-weight: 400;
  text-decoration: none;
}

.partial-actuals-disclosure {
  margin: 0;
  padding: 0.45rem 1rem;
  border-bottom: 1px solid var(--border);
}

.lineup-slot-label {
  color: var(--accent);
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.06em;
}

.lineup-totals {
  display: flex;
  justify-content: flex-end;
  gap: 1.25rem;
  padding: 0.7rem 1rem;
  background: var(--surface-3);
  color: var(--gold);
  font-family: var(--font-mono);
}

.lineup-block > .notice {
  margin: 0.75rem 1rem;
}

.lineup-unfilled {
  opacity: 0.82;
}

/* P3.5 workbench mutation controls. Every action is its own form because each
   one posts a different endpoint with its own server-derived hidden fields. */
.lineup-actions,
.workbench-bulk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.7rem 1rem;
}

.workbench-bulk-actions {
  padding-left: 0;
  padding-right: 0;
}

.workbench-bulk-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.65rem;
  margin-top: 1rem;
}

.workbench-bulk-bar button[type="submit"],
.workbench-tools-panel button[type="submit"] {
  margin-top: 0;
}

.workbench-tools {
  min-width: min(100%, 20rem);
}

.workbench-tools > summary,
.lineup-item-edit > summary {
  width: fit-content;
  max-width: 100%;
  list-style: none;
  overflow-wrap: anywhere;
}

.lineup-item-edit > summary {
  white-space: nowrap;
}

.workbench-tools > summary::-webkit-details-marker,
.lineup-item-edit > summary::-webkit-details-marker {
  display: none;
}

.workbench-tools-panel {
  display: grid;
  gap: 1rem;
  margin-top: 0.65rem;
  padding: 1rem;
}

.workbench-accept-all-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.accepted-lineups-copy {
  color: var(--text-muted);
}

.disclosure-arrow > summary {
  gap: 0.55rem;
  cursor: pointer;
  list-style: none;
}

.disclosure-arrow > summary::-webkit-details-marker {
  display: none;
}

.disclosure-arrow > summary::before {
  content: '▸';
  flex: 0 0 auto;
  transition: transform 0.2s ease;
}

.disclosure-arrow[open] > summary::before {
  transform: rotate(90deg);
}

.accepted-contest-fold,
.accepted-lineup-fold,
.unused-premium-player {
  min-width: 0;
  margin-bottom: 0.75rem;
}

.accepted-contest-fold > summary,
.accepted-lineup-fold > summary,
.unused-premium-player > summary {
  justify-content: space-between;
  min-width: 0;
  padding: 0.5rem 0;
  font-family: var(--font-mono);
  overflow-wrap: anywhere;
}

.accepted-contest-lineups,
.unused-premium-cards {
  min-width: 0;
  padding: 0.25rem 0 0 1.25rem;
}

.accepted-lineup-summary {
  flex-wrap: wrap;
}

.accepted-lineup-summary .lineup-metric {
  display: inline-flex;
  gap: 0.35rem;
  align-items: baseline;
}

.accepted-lineup-fold .lineup-block {
  margin-top: 0.35rem;
}

.accepted-lineups-section .lineup-card-row {
  padding-block: 0.2rem;
}

.lineup-item-edit {
  display: contents;
}

/* A <details> element keeps everything after its <summary> in Chromium's
   generated ::details-content box. Flatten that generated box too, so the
   authored panel -- not its anonymous wrapper -- owns the full-width second
   player-row grid line. Otherwise the wrapper auto-lands in the narrow Edit
   column and the panel's controls wrap and overflow there. */
.lineup-item-edit[open]::details-content {
  display: contents;
}

.lineup-item-edit > summary {
  grid-column: 8;
  grid-row: 1;
  justify-self: end;
  z-index: 1;
}

.lineup-item-edit[open] > .lineup-item-edit-panel {
  grid-column: 1 / -1;
  grid-row: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.5rem;
  min-width: 0;
  padding-top: 0.5rem;
}

.lineup-item-edit-panel > .lineup-item-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.lineup-item-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  padding-top: 0.5rem;
}

.lineup-item-actions button[type="submit"] {
  margin-top: 0;
}

.lineup-lock-action {
  justify-self: end;
  min-width: 0;
  max-width: 100%;
}

.lineup-lock-action button[type="submit"] {
  margin-top: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.lineup-rule-tally {
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 0.25rem 1rem;
  border-bottom: 1px solid var(--border);
  background: var(--surface-3);
}

.lineup-rule-tally .rule-chip-list {
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  min-width: 0;
  margin: 0;
  gap: 0;
}

.lineup-rule-tally .rule-chip {
  min-width: 0;
  padding-block: 0;
}

.lineup-rule-tally button[type="submit"] {
  margin-top: 0;
  margin-block: -8px;
}

.workbench-lineup-section .lineup-header {
  min-width: 0;
  flex-wrap: wrap;
  gap: 0.35rem 0.75rem;
}

.workbench-lineup-section .lineup-header strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.lineup-collection-rule,
.lineup-collection-rule .rule-chip-label {
  min-width: 0;
  max-width: 100%;
}

.workbench-lineup-section .early-game-badges {
  flex: 1 0 100%;
  min-width: 0;
  flex-wrap: nowrap;
  gap: 0.25rem;
  overflow-x: auto;
  padding: 0;
  border: 0;
  background: transparent;
}

.workbench-lineup-section .early-game-badge {
  flex: 0 0 auto;
  padding: 0.2rem 0.45rem;
  color: var(--accent);
}

@media screen and (min-width: 641px) {
  .working-lineup .lineup-card-row {
    grid-template-columns:
      minmax(3.25rem, 0.55fr)
      minmax(8rem, 2fr)
      repeat(5, minmax(2.5rem, 0.65fr))
      minmax(44px, auto);
  }

  .accepted-lineup .lineup-card-row {
    grid-template-columns:
      minmax(3.25rem, 0.55fr)
      minmax(8rem, 2fr)
      repeat(5, minmax(2.5rem, 0.65fr));
  }

  .lineup-item-edit-panel > .lineup-item-actions {
    display: grid;
    grid-template-columns: max-content max-content minmax(44px, 1fr);
    align-items: start;
    width: 100%;
    padding-top: 0.35rem;
  }

  /* The replacement picker lives in the third action form. Keep that form in
     the DOM, but promote its controls into this grid so all three buttons own
     one explicit first row and the two picker fields share the second row. */
  .lineup-item-actions > form:nth-of-type(1) {
    grid-column: 1;
    grid-row: 1;
  }

  .lineup-item-actions > form:nth-of-type(2) {
    grid-column: 2;
    grid-row: 1;
  }

  .lineup-item-actions > .lineup-replace-form {
    display: contents;
  }

  .lineup-item-actions > .lineup-replace-form > button[type="submit"] {
    grid-column: 3;
    grid-row: 1;
    justify-self: start;
  }

  .lineup-item-actions > .lineup-replace-form > label:first-of-type {
    grid-column: 1 / 3;
    grid-row: 2;
  }

  .lineup-item-actions > .lineup-replace-form > label:nth-of-type(2) {
    grid-column: 3;
    grid-row: 2;
  }

  /* D-062: these three controls are authored `.secondary-button` (transparent,
     thin border, small mono glyph), but the global `button[type="submit"]` rule
     (specificity 0,1,1) out-ranks `.secondary-button` (0,1,0) and forces the
     heavy PRIMARY look on them — solid --accent fill, white 0.9rem display font,
     0.65rem 2rem padding, a 16px accent glow.  Three of those per player row read
     far too heavy against the player-name text.  This selector (0,2,1) beats both
     and restores the author's intended light secondary appearance at DESKTOP
     widths only.  The S8.3 44px min-height/min-width floor lives on the bare
     `button` element rules and is NOT set here, so every hit target stays at the
     ruled 44px minimum — this lightens weight, never the target. */
  .lineup-item-actions button[type="submit"] {
    margin-top: 0;
    background: transparent;
    color: var(--text-muted);
    border: 1px solid var(--border-2);
    border-radius: 5px;
    padding: 0.25rem 0.85rem;
    font-family: var(--font-mono);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    box-shadow: none;
  }
  .lineup-item-actions button[type="submit"]:hover {
    background: var(--accent-dim);
    border-color: var(--accent);
    color: var(--accent);
    box-shadow: none;
    transform: none;
  }
}

/* P7.5 AC4: player mutation stays in the row while lineup-level context uses a
   compact side rail. Nine 44px Edit targets have a 396px irreducible height;
   placing the header, kickoff line, totals, notices and lineup actions beside
   that list keeps the compact design honest without shrinking or overlapping
   hit areas. Read-only history renders are deliberately outside this scope. */
@media screen and (min-width: 1101px) {
  .workbench-lineup-section .lineup-block {
    display: grid;
    grid-template-columns: minmax(32.25rem, 0.85fr) minmax(28rem, 1fr);
    align-items: start;
  }

  .workbench-lineup-section .lineup-rule-tally .rule-chip {
    flex-wrap: nowrap;
  }

  .workbench-lineup-section .lineup-rule-tally .rule-chip-label {
    min-width: 0;
  }

  .workbench-lineup-section .lineup-card-list {
    grid-column: 1;
    grid-row: 1 / span 20;
    border-right: 1px solid var(--border);
  }

  .workbench-lineup-section .lineup-header,
  .workbench-lineup-section .lineup-rule-tally,
  .workbench-lineup-section .lineup-totals,
  .workbench-lineup-section .lineup-block > .notice,
  .workbench-lineup-section .partial-actuals-disclosure,
  .workbench-lineup-section .lineup-actions,
  .workbench-lineup-section .infeasible {
    grid-column: 2;
  }

  .workbench-lineup-section .lineup-header {
    padding: 0.5rem 0.75rem;
  }

  .workbench-lineup-section .lineup-card-row {
    grid-template-columns:
      minmax(3.25rem, 0.55fr)
      minmax(8rem, 2fr)
      repeat(5, minmax(2.5rem, 0.65fr))
      minmax(44px, auto);
    gap: 0.5rem;
  }

  .working-lineup .lineup-card-row {
    min-height: 44px;
    padding-block: 0;
  }

  .accepted-lineup .lineup-card-row {
    grid-template-columns:
      minmax(3.25rem, 0.55fr)
      minmax(8rem, 2fr)
      repeat(5, minmax(2.5rem, 0.65fr));
    min-height: 0;
  }

  .workbench-lineup-section .lineup-totals {
    padding: 0.5rem 0.75rem;
  }

  .workbench-lineup-section .lineup-block > .notice {
    margin: 0.5rem 0.75rem;
  }

  .workbench-lineup-section .lineup-actions {
    padding: 0.5rem 0.75rem;
  }
}

@media screen and (max-width: 640px) {
  .working-lineup .lineup-card-row {
    grid-template-columns: minmax(3.5rem, 0.6fr) minmax(0, 2fr) 44px;
  }

  .working-lineup .lineup-card-row > .lineup-slot-label {
    grid-column: 1;
    grid-row: 1;
  }

  .working-lineup .lineup-card-row > span:nth-of-type(1) {
    grid-column: 2;
    grid-row: 1;
  }

  .working-lineup .lineup-card-row > span:nth-of-type(2) {
    grid-column: 1;
    grid-row: 2;
  }

  .working-lineup .lineup-card-row > span:nth-of-type(3) {
    grid-column: 2;
    grid-row: 2;
  }

  .working-lineup .lineup-card-row > span:nth-of-type(4) {
    grid-column: 1;
    grid-row: 3;
  }

  .working-lineup .lineup-card-row > span:nth-of-type(5) {
    grid-column: 2;
    grid-row: 3;
  }

  .working-lineup .lineup-card-row > span:nth-of-type(6) {
    grid-column: 1 / span 2;
    grid-row: 4;
  }

  .working-lineup .lineup-item-edit > summary {
    grid-column: 3;
    grid-row: 1 / span 4;
    align-self: center;
  }

  .working-lineup .lineup-item-edit[open] > .lineup-item-edit-panel {
    grid-row: 5;
  }

  .lineup-item-actions {
    flex-direction: column;
    align-items: stretch;
  }
}

.projection-refresh-form {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.5rem;
}

.projection-refresh-form label {
  display: grid;
  gap: 0.25rem;
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 0.68rem;
}

.projection-refresh-form input[type="file"] {
  max-width: 18rem;
  color: var(--text);
}

.projection-refresh-form select {
  max-width: min(100%, 24rem);
}

.late-swap-surface {
  margin-top: 0.75rem;
}

.late-swap-no-schedule code {
  color: inherit;
}

.late-swap-state-reason {
  display: block;
  margin: 0.5rem 0 0;
  color: var(--text-muted);
  font-size: 0.78rem;
}

.late-swap-control[data-state="disabled"],
.late-swap-control[data-state="unavailable"] {
  opacity: 0.45;
  cursor: not-allowed;
}

.late-swap-modal {
  max-width: 54rem;
  margin-top: 0.75rem;
}

.late-swap-modal > h3 {
  margin-top: 0;
  color: var(--text);
}

.late-swap-policy-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  margin-top: 1rem;
}

.late-swap-form {
  min-width: 0;
  padding: 1rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.late-swap-form h4 {
  margin: 0 0 0.75rem;
  color: var(--text);
}

.weekly-shell .contest-slate-scroll {
  max-width: 100%;
  overflow-x: auto;
}

.late-swap-file {
  color: var(--text);
  font-family: var(--font-mono);
  font-size: 0.68rem;
}

.late-swap-file {
  display: grid;
  gap: 0.4rem;
  margin-top: 1rem;
}

.late-swap-file input[type="file"] {
  width: 100%;
  max-width: 100%;
  color: var(--text);
}

.lineup-actions:empty,
.workbench-bulk-actions:empty {
  display: none;
}

.lineup-actions button[type="submit"],
.workbench-bulk-actions button[type="submit"],
.rule-chip button[type="submit"] {
  padding: 0.35rem 0.8rem;
  font-size: 0.72rem;
}

.working-lineup-actions > form,
.lineup-add-form,
.lineup-move-form,
.lineup-replace-form,
.release-stack-action,
.rule-chip-action {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.5rem;
}

.lineup-add-form,
.lineup-move-form,
.lineup-replace-form,
.lineup-add-form label,
.lineup-move-form label,
.lineup-replace-form label {
  min-width: 0;
  max-width: 100%;
}

.lineup-add-form label,
.lineup-move-form label {
  display: grid;
  gap: 0.25rem;
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 0.68rem;
}

.lineup-replace-form label {
  display: grid;
  gap: 0.25rem;
  font-family: var(--font-mono);
  font-size: 0.68rem;
}

.lineup-add-form input[list],
.lineup-move-form input[list],
.lineup-replace-form input[list] {
  width: min(22rem, 100%);
  max-width: 100%;
}

.lineup-add-form select,
.lineup-move-form select,
.lineup-replace-form select {
  max-width: 100%;
}

.lineup-target-choice,
.lock-target-choice {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.75rem;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
}

.lineup-target-choice legend,
.lock-target-choice legend {
  width: 100%;
}

.lineup-target-choice label,
.lock-target-choice label {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

@media screen and (min-width: 641px) {
  .lineup-target-choice,
  .lock-target-choice {
    flex-wrap: nowrap;
    align-items: center;
  }

  .lineup-target-choice legend,
  .lock-target-choice legend {
    width: auto;
    flex: 0 0 auto;
  }
}

.lineup-action-reason,
.release-stack-note,
.rule-remove-note {
  align-self: center;
  color: var(--text-muted);
  font-size: 0.72rem;
}

.rule-chip-action {
  justify-content: flex-end;
}

.rule-chip-list {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.rule-chip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.5rem 0.75rem;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--badge-radius);
}

.rule-chip-label {
  font-family: var(--font-mono);
  font-size: 0.74rem;
  color: var(--text);
  overflow-wrap: anywhere;
}

.report-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.exposure-disclosure > summary {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0 0 1rem;
  padding-bottom: 0.65rem;
  border-bottom: 1px solid var(--border);
  color: var(--text);
  cursor: pointer;
  font-family: var(--font-display);
  font-size: 1.55rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  list-style: none;
  text-transform: uppercase;
}

.exposure-disclosure > summary::-webkit-details-marker {
  display: none;
}

.exposure-disclosure > summary::before {
  content: '▸';
  flex-shrink: 0;
  color: var(--accent);
  font-size: 1.2rem;
  transition: transform 0.2s ease;
}

.exposure-disclosure[open] > summary::before {
  transform: rotate(90deg);
}

.report-grid h3 {
  margin: 0 0 0.85rem;
  color: var(--text);
  font-family: var(--font-display);
  text-transform: uppercase;
}

.report-wide {
  grid-column: 1 / -1;
  min-width: 0;
}

.report-row {
  display: grid;
  gap: 0.3rem;
  padding: 0.65rem 0;
  border-bottom: 1px solid var(--border);
  font-size: 0.78rem;
}

.report-row:last-child {
  border-bottom: 0;
}

.report-row span {
  color: var(--text-muted);
}

.report-table-wrap {
  overflow-x: auto;
}

.generate-panel form {
  margin-top: 1rem;
}

/* ── Infeasibility notice ────────────────────────────────── */

.infeasible {
  font-style: italic;
  color: var(--text-muted);
  background: var(--surface);
  padding: 0.85rem 1rem;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  border-left: 3px solid var(--border-2);
  font-size: 0.88rem;
}

/* ── Loading overlay ─────────────────────────────────────── */

#loading-overlay {
  position: fixed;
  inset: 0;
  background: var(--surface);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  backdrop-filter: blur(10px);
}

.overlay-content {
  background: var(--surface-2);
  border: 1px solid var(--border-2);
  border-radius: 12px;
  padding: 2rem 3rem;
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text);
  box-shadow: var(--shadow-lg), 0 0 60px var(--accent-glow);
  display: flex;
  align-items: center;
  gap: 1rem;
}

.overlay-content::before {
  content: '';
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--accent);
  flex-shrink: 0;
  animation: pulse 1.2s ease-in-out infinite;
}

@keyframes pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
    box-shadow: 0 0 0 0 var(--accent-glow);
  }
  50% {
    opacity: 0.4;
    transform: scale(0.75);
  }
}

/* ── Entry counts ─────────────────────────────────────────── */

.entry-counts {
  margin: 1rem 0;
  padding: 0.75rem 1rem;
  border: 1px solid #444;
  border-radius: 4px;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 1.5rem;
}

.entry-counts legend {
  padding: 0 0.5rem;
  font-weight: 600;
}

.entry-count-row {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.entry-count-row input[type="number"] {
  width: 4rem;
  padding: 0.2rem 0.4rem;
}

.entry-count-row small {
  color: var(--text-muted);
}

/* ── Landing page ────────────────────────────────────────── */

.landing-lede {
  max-width: 66ch;
  margin: 0 0 1.25rem;
  color: var(--text);
}

.landing-note {
  background: var(--gold-dim);
  border: 1px solid rgba(201, 168, 69, 0.22);
  border-left: 3px solid var(--gold);
  border-radius: var(--radius);
  padding: 0.7rem 1.1rem;
  margin: 0;
  font-family: var(--font-mono);
  font-size: 0.76rem;
  font-weight: 500;
  color: var(--gold);
}

/* The shared table rule centers first cells; the slate's is the contest name. */
.contest-slate th:first-child,
.contest-slate td:first-child {
  text-align: left;
}

.slot-chip {
  display: inline-block;
  margin-right: 0.3rem;
  padding: 0 0.4rem;
  border: 1px solid var(--border-2);
  border-radius: 3px;
  background: var(--surface-3);
  font-family: var(--font-mono);
  font-size: 0.68rem;
  color: var(--text-muted);
  white-space: nowrap;
}

.badge-unknown {
  display: inline-block;
  padding: 0 0.45rem;
  border: 1px solid rgba(201, 168, 69, 0.35);
  border-radius: 3px;
  background: var(--gold-dim);
  font-family: var(--font-mono);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--gold);
}

/* NULL salary cap: stored and listed, never optimizable (config-admin §1.3). */
.contest-unavailable td {
  color: var(--text-muted);
}

.table-note {
  margin: 0.75rem 0 0;
  font-size: 0.74rem;
  color: var(--text-muted);
  line-height: 1.6;
}

/* ── P3 workspace flow ─────────────────────────────────────────────── */

.panel,
.onboarding-panel,
.workspace-actions {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.25rem;
  box-shadow: var(--shadow);
}

.onboarding-panel ol {
  margin: 0;
  padding-left: 1.5rem;
}

.onboarding-panel li {
  margin: 0 0 1rem;
  padding-left: 0.35rem;
}

.button-link {
  display: inline-block;
  margin: 0.25rem 0.65rem 0.25rem 0;
  padding: 0.6rem 1rem;
  border-radius: var(--radius);
  background: var(--accent);
  color: #fff;
  font-weight: 700;
  text-decoration: none;
}

.button-link.active-link {
  background: var(--surface-3);
  border: 1px solid var(--accent);
}

/* ── Contest administration ─────────────────────────────── */

.admin-heading-row,
.admin-heading-actions,
.admin-form-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.admin-heading-actions form {
  margin: 0;
}

.admin-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.admin-contest-table th:first-child,
.admin-contest-table td:first-child {
  text-align: left;
}

.admin-contest-table td {
  vertical-align: top;
}

.archived-contests {
  margin-top: 2rem;
}

.admin-badge,
.item-count {
  display: inline-block;
  margin: 0.1rem 0.2rem 0.1rem 0;
  padding: 0.1rem 0.45rem;
  border: 1px solid var(--border-2);
  border-radius: 3px;
  background: var(--surface-3);
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 0.62rem;
  line-height: 1.5;
  text-transform: uppercase;
  white-space: nowrap;
}

.prize-cash {
  border-color: rgba(82, 196, 122, 0.35);
  color: var(--success);
}

.prize-credits,
.archived-badge {
  border-color: rgba(201, 168, 69, 0.35);
  color: var(--gold);
}

.rule-badge {
  text-transform: none;
  white-space: normal;
}

.verification-panel {
  border-left: 3px solid var(--accent);
}

.verification-list {
  display: grid;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.verification-list > li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.verify-badge {
  display: inline-block;
  padding: 0.1rem 0.45rem;
  border: 1px solid var(--border-2);
  border-radius: 3px;
  background: var(--surface-3);
  font-family: var(--font-mono);
  font-size: 0.62rem;
  line-height: 1.5;
  white-space: nowrap;
}

.verify-badge.verified {
  border-color: rgba(82, 196, 122, 0.35);
  color: var(--success);
}

.verify-badge.unverified {
  border-color: rgba(201, 168, 69, 0.35);
  color: var(--gold);
}

.season-complete {
  margin: 0;
  color: var(--text-muted);
}

.muted,
.field-hint {
  color: var(--text-muted);
}

.admin-contest-form form > fieldset,
.admin-form-grid {
  margin-bottom: 1.25rem;
}

.admin-form-grid,
.slot-input-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 1rem;
}

.admin-contest-form label,
.collection-rule-row label {
  display: grid;
  gap: 0.35rem;
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 0.72rem;
}

.admin-contest-form input,
.admin-contest-form select {
  width: 100%;
}

.admin-contest-form fieldset {
  padding: 1rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.admin-contest-form legend {
  padding: 0 0.4rem;
  color: var(--text);
  font-weight: 700;
}

.item-total {
  margin-bottom: 0;
  color: var(--accent);
  font-family: var(--font-mono);
  font-weight: 700;
}

.collection-rule-row {
  display: grid;
  grid-template-columns: minmax(180px, 2fr) repeat(3, minmax(95px, 1fr)) auto;
  align-items: end;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--border);
}

.collection-rule-row .field-errors {
  grid-column: 1 / -1;
}

.field-errors {
  margin: 0.25rem 0 0;
  padding-left: 1.1rem;
  color: var(--danger);
  font-family: var(--font-body);
  font-size: 0.78rem;
}

.field-hint {
  font-family: var(--font-body);
  font-weight: 400;
}

@media (max-width: 760px) {
  .collection-rule-row {
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
  }
}

.upload-form {
  max-width: 38rem;
}

.flash-stack {
  margin-bottom: 1rem;
}

.notice {
  background: var(--gold-dim);
  border: 1px solid rgba(201, 168, 69, 0.25);
  border-left: 3px solid var(--gold);
  border-radius: var(--radius);
  color: var(--gold);
  padding: 0.75rem 1rem;
  margin: 0.5rem 0;
  font-size: 0.84rem;
}

.contest-section.notice {
  margin-bottom: 2.5rem;
}

.notice-info {
  background: rgba(59, 130, 246, 0.10);
  border-left-color: #3b82f6;
  color: var(--info);
}

.lineup-notice {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.lineup-notice form {
  flex: 0 0 auto;
}

.notice-guidance {
  border-left-color: var(--accent);
}

.alert-critical {
  border-left-color: #dc2626;
  color: var(--danger);
}

.late-swap-no-schedule,
.late-swap-unavailable {
  margin-bottom: 0;
}

.notice-projection_upload_error {
  border-left-color: #dc2626;
  color: var(--danger);
}

.draft-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.draft-grid .panel h2,
.draft-settings h2,
#unmatched-cards h2 {
  margin-top: 0;
}

.unmatched-scroll {
  max-height: 24rem;
  overflow: auto;
}

.data-health {
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--border);
}

.data-health h3 {
  margin: 0 0 0.75rem;
  font-size: 0.9rem;
}

.data-health-scroll {
  overflow-x: auto;
}

.data-health-table {
  font-size: 0.78rem;
}

.data-health-reason {
  color: var(--text-muted);
}

.toggle-row {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.save-status {
  position: sticky;
  top: 0.5rem;
  z-index: 20;
  width: max-content;
  margin: 0 0 0.75rem auto;
  padding: 0.35rem 0.75rem;
  border: 1px solid var(--border-2);
  border-radius: var(--badge-radius);
  background: var(--surface);
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.save-status-not-saved {
  border-color: rgba(220, 38, 38, 0.7);
  color: var(--danger);
  box-shadow: none;
}

.save-status-saving,
.save-status-editing {
  border-color: rgba(201, 168, 69, 0.5);
  color: var(--gold);
}

#draft-reload,
#draft-retry {
  display: block;
  margin: -2.75rem 0 1rem auto;
}

#draft-reload[hidden],
#draft-retry[hidden],
.validation-errors[hidden] {
  display: none;
}

.validation-errors {
  list-style-position: inside;
}

.config-panel h3 {
  margin: 1.25rem 0 0.6rem;
  color: var(--text);
  font-family: var(--font-display);
  font-size: 0.92rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.config-rows,
#lock-rows,
#exclude-rows {
  display: grid;
  gap: 0.65rem;
  margin: 0.85rem 0;
}

.config-row,
.rule-scalars {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.65rem;
  padding: 0.8rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.config-row label,
.rule-scalars label {
  display: grid;
  gap: 0.3rem;
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 0.64rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.config-row input:not([type="checkbox"]),
.config-row select,
.rule-scalars input:not([type="checkbox"]),
.rule-scalars select {
  min-height: 2rem;
  max-width: 19rem;
  padding: 0.3rem 0.45rem;
  border: 1px solid var(--border-2);
  border-radius: 4px;
  background: var(--surface-3);
  color: var(--text);
  font-family: var(--font-mono);
  font-size: 0.74rem;
}

.config-row input[type="number"],
.rule-scalars input[type="number"] {
  width: 5.5rem;
}

.config-row input:disabled,
.config-row select:disabled,
.rule-scalars input:disabled {
  opacity: 0.45;
}

.supply-note,
.pool-summary {
  color: var(--gold);
  font-family: var(--font-mono);
  font-size: 0.7rem;
}

.rule-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 1rem;
}

.rule-chip {
  padding: 0.35rem 0.6rem;
  border: 1px solid rgba(244, 123, 61, 0.3);
  border-radius: var(--badge-radius);
  background: var(--accent-dim);
  color: var(--accent-hover);
  font-family: var(--font-mono);
  font-size: 0.64rem;
}

.pool-editor-search {
  display: grid;
  gap: 0.75rem;
  padding: 0.8rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.pool-editor-filters,
.pool-editor-actions,
.pool-editor-selection {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
}

/* P9.6 draft hierarchy. Every color comes from the established theme tokens. */
.draft-roster-row,
.projection-source-form,
.build-block,
.advanced-group-heading,
.contest-filter summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
}

.draft-roster-row h2,
.projection-source-row h2,
.build-block h2 {
  margin: 0;
}

.draft-roster-row .upload-form,
.projection-source-form {
  max-width: none;
}

.draft-roster-row .upload-form {
  display: flex;
  flex: 1 1 24rem;
  align-items: center;
  gap: 0.75rem;
}

.draft-roster-row .file-upload-zone {
  flex: 1 1 16rem;
  padding: 0.65rem;
}

.draft-roster-row .upload-filename,
.projection-source-row .upload-filename {
  display: block;
}

.projection-source-form label {
  flex: 1 1 18rem;
}

.source-details {
  margin-bottom: 0;
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 0.7rem;
}

.build-block {
  border-color: var(--accent);
  background: var(--accent-dim);
}

.build-count-summary {
  margin: 0.25rem 0 0;
  color: var(--gold);
  font-family: var(--font-mono);
  font-weight: 700;
}

.generate-primary {
  min-height: 56px;
  padding-inline: 1.5rem;
  font-size: 1rem;
}

.contest-games {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.35rem 1rem;
  min-width: 0;
  padding: 0 0.8rem 0.8rem;
}

.contest-game-line {
  min-width: 0;
  margin: 0;
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 0.66rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.contest-game-line strong {
  color: var(--text);
}

.contest-filter-list,
.advanced-tools > section {
  display: grid;
  gap: 0.65rem;
  margin-top: 1rem;
}

.contest-filter {
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.contest-filter summary {
  min-width: 0;
  padding: 0.65rem 0.8rem;
  cursor: pointer;
}

.contest-filter summary > span {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.contest-summary-facts,
.advanced-defaults {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.roster-chip,
.advanced-defaults span {
  padding: 0.25rem 0.45rem;
  border: 1px solid var(--border-2);
  border-radius: var(--badge-radius);
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 0.62rem;
}

.advanced-tools {
  min-width: 0;
}

.advanced-tools > summary {
  justify-content: space-between;
  gap: 1rem;
  color: var(--text);
  cursor: pointer;
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 700;
}

.advanced-summary {
  color: var(--gold);
  font-family: var(--font-mono);
  font-size: 0.7rem;
  font-weight: 500;
}

.advanced-defaults {
  margin-top: 0.8rem;
}

.advanced-group {
  padding-top: 0.75rem;
  border-top: 1px solid var(--border);
}

.advanced-group-heading h3 {
  margin: 0;
}

@media (max-width: 640px) {
  .contest-games {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .draft-roster-row .upload-form,
  .projection-source-form,
  .build-block {
    align-items: stretch;
    flex-direction: column;
  }

  .draft-roster-row .upload-form,
  .projection-source-form label {
    flex-basis: auto;
    width: 100%;
  }

  .projection-source-form select,
  .generate-primary {
    width: 100%;
  }
}

.pool-editor-filters label {
  display: grid;
  gap: 0.3rem;
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 0.64rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.pool-editor-results-label {
  flex: 1 1 24rem;
}

.pool-editor-search input[type="search"],
.pool-editor-search select {
  min-height: 44px;
  max-width: 100%;
  padding: 0.6rem 0.45rem;
  border: 1px solid var(--border-2);
  border-radius: 4px;
  background: var(--surface-3);
  color: var(--text);
  font-family: var(--font-mono);
  font-size: 0.74rem;
}

.pool-editor-search input[type="search"] {
  min-width: 12rem;
}

.pool-editor-results-label select {
  width: 100%;
}

.pool-editor-selection {
  min-height: 1.5rem;
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 0.7rem;
}

.set-aside-badge {
  padding: 0.2rem 0.45rem;
  border: 1px solid var(--gold);
  border-radius: var(--badge-radius);
  color: var(--gold);
  font-size: 0.64rem;
  text-transform: uppercase;
}

.privacy-footer {
  max-width: 1200px;
  margin: 3rem auto 1.5rem;
  padding: 1.25rem;
  border-top: 1px solid var(--border);
  color: var(--text-muted);
  font-size: 0.72rem;
  line-height: 1.65;
}

.footer-admin-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  margin-left: 0.5rem;
  color: var(--text-muted);
  border-bottom: 1px dotted var(--text-muted);
  font-family: var(--font-mono);
  font-weight: 700;
  text-decoration: none;
}

.footer-admin-link:hover {
  color: var(--accent);
  border-bottom-color: var(--accent);
}

/* ── Entry checklist ───────────────────────────────────────────── */

.checklist-page-actions,
.enter-replace-form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
}

.checklist-page-actions {
  margin-top: 1rem;
}

.checklist-contest {
  margin-bottom: 2.5rem;
}

.checklist-card-table {
  margin: 0;
}

.checklist-warning {
  margin: 0.75rem 1rem;
}

.enter-replace-disclosure {
  margin-bottom: 1rem;
}

.enter-replace-disclosure summary {
  cursor: pointer;
  font-weight: 700;
}

.enter-replace-form {
  margin-top: 0.75rem;
}

.checklist-pull-list {
  margin-top: 1rem;
}

/* ── Responsive ──────────────────────────────────────────── */

@media (max-width: 640px) {
  header { height: 240px; padding-bottom: 1.5rem; }
  .hero-content { width: 100%; padding-inline: 0.75rem; }
  .hero-content h1 { font-size: 2.4rem; }
  .gb-logo { height: 22px; margin-bottom: 0.6rem; }
  main { padding: 0 0.75rem; }
  th, td { padding: 0.4rem 0.55rem; font-size: 0.78rem; }
  .draft-grid { grid-template-columns: 1fr; }
  .privacy-footer { margin-top: 2rem; padding: 1rem 0.75rem; }
  .config-row, .rule-scalars { align-items: stretch; }
  .config-row label, .config-row select, .config-row input:not([type="checkbox"]) {
    width: 100%;
    max-width: none;
  }
  .report-grid { grid-template-columns: 1fr; }
  .report-wide { grid-column: auto; }
  .late-swap-policy-grid { grid-template-columns: 1fr; }
  .lineup-header { flex-wrap: wrap; gap: 0.45rem 1rem; }
  .lineup-card-row {
    grid-template-columns: minmax(3.5rem, 0.6fr) minmax(9rem, 2fr);
  }
  .lineup-card-row span:nth-of-type(n + 2) { color: var(--text-muted); }
}

/* A checklist print is a working kitchen-table artifact: retain cards,
   warnings, pull lists and entered badges; remove only browser chrome. */
@media print {
  @page { size: landscape; margin: 0.5in; }

  body {
    background: #fff;
    color: #000;
    font-size: 10pt;
  }

  header,
  .privacy-footer,
  .flash-stack,
  .checklist-page-actions,
  .enter-replace-disclosure,
  .workbench-export,
  .workbench-bulk-bar,
  .lineup-item-edit,
  .lineup-actions,
  .lineup-notice form,
  .rule-chip-action {
    display: none !important;
  }

  main {
    max-width: none;
    margin: 0;
    padding: 0;
  }

  .panel,
  .lineup-block,
  .lineup-header,
  .early-game-badges,
  .early-game-badge,
  .infeasible,
  .notice {
    background: #fff;
    color: #000;
    border-color: #777;
    box-shadow: none;
  }

  .checklist-contest,
  .checklist-lineup,
  .checklist-pull-list,
  .workbench-lineup-section,
  .workbench-lineup-section .lineup-block,
  tr {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .report-table-wrap {
    overflow: visible;
  }

  th,
  td {
    color: #000;
    border-color: #999;
    padding: 0.3rem 0.4rem;
  }
}

/* ==========================================================================
   S8.3 — P3.5-R21 §3 hit areas: every mutation control/modal button gets a
   44x44 CSS-pixel target.  Owner-ratified 2026-08-22, scoped to ALL measured
   violations on /, /changelog, /workbench and /workbench/checklist.

   MINIMUM SIZES ONLY.  No layout redesign, no flex/grid restructuring, no
   font-size change -- those were outside the authorized repair class.  The
   visible glyph may stay small; R21 asks for the HIT AREA, which is why these
   are min-height plus centring rather than padding rewrites.

   /draft was OUTSIDE the ruled scope and is IMPROVED here as a measured side
   effect: these class-level rules cannot be confined to one page, because
   <body> carries no per-page hook and draft.js mints ~1,457 .secondary-button
   nodes at runtime.  The Owner ruled 2026-08-22 that the remediation may reach
   it.  Measured: /draft 1,739 -> 283 sub-44 controls, width budget intact.
   ========================================================================== */

button,
.btn-secondary,
.secondary-button,
.button-link,
input[type="submit"],
select,
summary {
  min-height: 44px;
}

/* Centre the glyph inside the enlarged target rather than letting it sit at the
   top of a taller box -- this keeps the CONTROL's appearance stable while the
   TARGET grows, which is the whole point of "the visible glyph may be smaller". */
button,
.btn-secondary,
.secondary-button,
.button-link,
input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* <select> height is driven by font-size and padding in several engines, so
   min-height alone does not always lift it; the block padding does. */
select {
  padding-block: 0.6rem;
}

/* <summary> is a flex/list-item box in these templates; min-height needs the
   cross-axis centring to actually present a 44px target. */
summary {
  display: flex;
  align-items: center;
}

/* The scalar row's select carried its own `min-height: 2rem`, which is more
   specific than the blanket rule above and won the cascade at 32px.  Raised in
   place rather than by adding !important. */
.rule-scalars select,
.rule-scalars input[type="number"],
.rule-scalars input[type="text"] {
  min-height: 44px;
}

/* Number/text entry fields are mutation controls too -- they carry the values a
   solve is run from. */
input[type="number"],
input[type="text"] {
  min-height: 44px;
}

/* Checkboxes are mutation controls with a natively tiny box.  The GLYPH stays
   its normal size; the TARGET grows, which is exactly R21's carve-out. */
input[type="checkbox"] {
  min-width: 44px;
  min-height: 44px;
}

/* A few compact buttons are short in the WIDTH axis rather than the height. */
button,
.btn-secondary,
.secondary-button,
input[type="submit"] {
  min-width: 44px;
}

/* File pickers are mutation controls -- they carry the CSV a run is rebuilt
   from.  Scoped OFF the .file-upload-zone pattern, where the real input is
   deliberately shrunk to 1x1 and a styled label stands in for it: enlarging a
   visually-hidden input would put a stray 44px target on the page, which is a
   layout change rather than a hit-area fix. */
input[type="file"] {
  min-height: 44px;
}

.file-upload-zone input[type="file"] {
  min-height: 0;
}

/* `.config-row` sets its own `min-height: 2rem` (32px) on selects and inputs,
   which outranks the bare-element rules above on specificity regardless of
   source order.  Raised at the same specificity rather than with !important. */
.config-row input:not([type="checkbox"]),
.config-row select,
.config-row textarea {
  min-height: 44px;
}

/* The workbench Add radios and their labels expose real 44px boxes; relying on
   transparent padding leaves Chromium reporting only the native 14px control. */
.lineup-target-choice label {
  min-width: 44px;
  min-height: 44px;
}

.lineup-target-choice input[type="radio"] {
  box-sizing: border-box;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  margin: 0;
  padding: 0;
  flex: 0 0 44px;
}

.lock-target-choice input[type="radio"] {
  box-sizing: content-box;
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;
  margin: -16px;
  padding: 15px;
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
}

/* S8.3 / Gate B G2 — S5.7-F3: `table.contest-slate` overflowed the 375 px
   viewport (441 px measured).  R21 permits only bounded REPORT/CHECKLIST tables
   to scroll horizontally, so the slate has to FIT rather than scroll.

   Minimum intervention, in the narrowest possible scope: below 420 px only,
   let the cells wrap and trim their horizontal padding.  No column is dropped,
   no font size is changed, and the table's structure is untouched -- above this
   width nothing changes at all. */
@media (max-width: 420px) {
  .contest-slate {
    table-layout: fixed;
    width: 100%;
  }

  .contest-slate th,
  .contest-slate td {
    padding-inline: 0.25rem;
    overflow-wrap: anywhere;
    word-break: normal;
  }
}

/* P12: player projections share the Roster sign colors on every surface. */
.proj-adjusted-up { color:var(--success, #18723b); }
.proj-adjusted-down { color:var(--danger, #b42318); }

/* 0.17.1 D-267: the lab change summary (table.lab-diff-table, the data-lab-diff macro).
   The number columns take their natural width and the "Changes by slot" column the rest;
   each change line is a fixed grid (slot, outgoing, arrow, incoming) so arrows and cards
   align down the rows. Text wraps by line and never clips; nothing is set below the
   table body size. Below 641 px each lineup stacks: label, changes, then the numbers
   in a labeled grid (the labels repeat the column headers). */
.lab-diff-table th,
.lab-diff-table td { padding: 0.5rem 0.45rem; }
.lab-diff-table thead th { vertical-align: bottom; font-size: 14px; letter-spacing: 0; }   /* the table body size (game-day.css td, th) */
[data-lab-basis] code { overflow-wrap: anywhere; }
.lab-diff-table th:first-child { width: 1%; white-space: nowrap; }
.lab-diff-table thead th:nth-child(n+3),
.lab-diff-table td:nth-child(n+3) { width: 1%; white-space: nowrap; }
.lab-diff-table td:nth-child(n+3):nth-child(-n+8) { text-align: right; font-variant-numeric: tabular-nums; }
.lab-diff-table td:nth-child(n+9) { white-space: normal; }
.lab-diff-table td:nth-child(10) { min-width: 6.5em; }
.lab-change {
  display: grid;
  grid-template-columns: 7em minmax(0, 1fr) 1.5em minmax(0, 1fr);
  column-gap: 0.5rem;
  align-items: baseline;
  padding: 0.3rem 0;
  overflow-wrap: anywhere;
}
.lab-change + .lab-change { border-top: 1px solid var(--border); }
.lab-change-slot { font-weight: 700; }
.lab-change-arrow { text-align: center; color: var(--text-muted); }
.lab-change-moved { grid-column: 2 / -1; }
.lab-change-tag { margin-left: 0.5em; font-style: normal; font-weight: 700; color: var(--accent); }
.lab-change-details { margin-top: 0.4rem; }
.lab-change-details summary { cursor: pointer; color: var(--text-muted); }
.lab-change-detail { padding: 0.15rem 0; overflow-wrap: anywhere; }

@media (max-width: 640px) {
  .lab-diff-table,
  .lab-diff-table tbody { display: block; width: 100%; }
  .lab-diff-table thead { display: none; }
  .lab-diff-table tbody tr {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-bottom: 2px solid var(--border-2);
  }
  .lab-diff-table tbody th:first-child,
  .lab-diff-table tbody td:nth-child(n) { width: auto; padding: 0.35rem 0.4rem; border-bottom: none; text-align: left; white-space: normal; }
  .lab-diff-table td:nth-child(n+3):nth-child(-n+8) { text-align: left; }
  .lab-diff-table tbody th,
  .lab-diff-table td.lab-changes-cell { grid-column: 1 / -1; }
  .lab-diff-table td:nth-child(9) { grid-column: span 2; min-width: 0; }
  .lab-diff-table td:nth-child(10) { grid-column: span 2; min-width: 0; }
  .lab-diff-table td:nth-child(n+3)::before { display: block; color: var(--text-muted); font-weight: 700; }
  .lab-diff-table td:nth-child(3)::before { content: "Prev proj"; }
  .lab-diff-table[data-lab-diff="working"] td:nth-child(3)::before { content: "Working proj"; }
  .lab-diff-table td:nth-child(4)::before { content: "Lab proj"; }
  .lab-diff-table td:nth-child(5)::before { content: "Top proj (V*)"; }
  .lab-diff-table td:nth-child(6)::before { content: "Chosen"; }
  .lab-diff-table td:nth-child(7)::before { content: "Gave up"; }
  .lab-diff-table td:nth-child(8)::before { content: "Novel"; }
  .lab-diff-table td:nth-child(9)::before { content: "Spend"; }
  .lab-diff-table td:nth-child(10)::before { content: "Status"; }
  .lab-change { grid-template-columns: 5.5em minmax(0, 1fr); column-gap: 0.4rem; }
  .lab-change-arrow { text-align: right; }
  .lab-change-moved { grid-column: 2; }
}

/* 0.18.0 B11 (D-268): the shared question-mark tooltip (squared, the badge-radius token, as
   every badge is). Hover and keyboard focus show it;
   draft.js sets data-help="open" (click, tap, Enter/Space) or "dismissed" (Escape), and the
   dismissed state wins over hover and focus. draft.js keeps it inside the viewport.
   0.18.0 B11/B12 (D-268) F-T0: the button is the 44x44 px hit box (R21) and carries no
   border; its visible 1.5rem bordered square is drawn by ::before, centered in that box,
   in currentColor, so hover, focus and open still recolor it through `color`. */
.help-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
}
button.help-badge,
#weekly-workbench button.help-badge,
.weekly-shell button.help-badge {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  box-sizing: border-box;
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--badge-radius);
  background: transparent;
  color: var(--text-muted);
  font: 700 .8rem/1 var(--font-body);
  text-transform: none;
  letter-spacing: 0;
  cursor: help;
}
button.help-badge::before {
  content: "";
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  width: 1.5rem;
  height: 1.5rem;
  margin: auto;
  border: 1px solid currentColor;
  border-radius: var(--badge-radius);
  pointer-events: none;
}
button.help-badge:hover,
button.help-badge:focus-visible,
.help-wrap[data-help="open"] button.help-badge,
#weekly-workbench button.help-badge:hover,
#weekly-workbench button.help-badge:focus-visible,
#weekly-workbench .help-wrap[data-help="open"] button.help-badge {
  background: transparent;
  color: var(--accent);
  border-color: var(--accent);
}
.help-tooltip {
  display: none;
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  left: 0;
  width: min(260px, calc(100vw - 32px));
  padding: 8px;
  border: 1px solid var(--border-2);
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--text);
  font: 400 12px/1.35 var(--font-body);
  text-align: left;
  text-transform: none;
  letter-spacing: 0;
  white-space: normal;
  box-shadow: 0 4px 12px rgb(0 0 0 / 15%);
}
.help-wrap:hover .help-tooltip,
.help-wrap:focus-within .help-tooltip,
.help-wrap[data-help="open"] .help-tooltip { display: block; }
.help-wrap[data-help="dismissed"] .help-tooltip,
.help-wrap[data-help="dismissed"]:hover .help-tooltip,
.help-wrap[data-help="dismissed"]:focus-within .help-tooltip { display: none; }

/* 0.18.0 B10/B12 (D-268): the selected lineup's Variants bar; it wraps naturally and, at the
   editor's 640px breakpoint, its controls go full width. */
.variants-bar {
  display: grid;
  gap: .4rem;
  min-width: 0;
  margin: .75rem 0;
  padding: .75rem;
  border: 1px solid var(--border-2);
  border-radius: var(--radius);
  background: var(--surface-2);
}
.variants-bar p { margin: 0; overflow-wrap: anywhere; }
.variants-bar-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
}
.contest-section .variants-bar-head h3 { margin: 0; }
.variants-bar-effect { font-weight: 600; }
.variants-bar-form,
.variants-bar-custom,
.variants-spend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem .75rem;
  min-width: 0;
}
.variants-bar-custom[hidden] { display: none; }
/* 0.18.0 B11/B12 (D-268) F-T0: each label is a 44 px hit area (R21) -- the radios' (s82
   measures a radio through its label), the bar's Setting select's and its Percent's --
   with its text centered in it. */
.variants-bar-form label { display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; }
.variants-bar-form select { width: auto; max-width: 100%; margin: 0; }
.variants-bar-form input[type="number"] { width: 5.5rem; margin: 0; }
.variants-spend label {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  min-height: 44px;
  white-space: nowrap;
}
@media (max-width: 640px) {
  .variants-bar-form { display: grid; grid-template-columns: minmax(0, 1fr); }
  .variants-bar-mode { flex-wrap: wrap; }
  .variants-bar-form select,
  .variants-bar-form button { width: 100%; }
}
/* At the lineup card's own two-column breakpoint (game-day.css) the bar heads the card
   column, directly above the player table, beside the lineup's overview. */
@media (min-width: 1280px) {
  #weekly-workbench .working-lineup:not(.lineup-unfilled):has(> .variants-bar),
  #weekly-workbench .accepted-lineup:has(> .variants-bar) {
    grid-template-areas: "overview variants" "overview cards" "feedback cards" "actions cards" "played played";
    grid-template-rows: min-content min-content min-content min-content min-content;
  }
  #weekly-workbench .working-lineup > .variants-bar,
  #weekly-workbench .accepted-lineup > .variants-bar { grid-area: variants; margin: 0 0 8px 8px; }
}