/* Sections (class-ows-stacks-sections.php, sections.js).
   The old bar and the per-panel sub-rows stay in the page — sections.js clicks
   them — but out of sight. Hidden by the server-set .has-sections class, so the
   old bar never paints first; sections.js removes that class if it fails. */
.ows-stacks.has-sections #stx-app > .stx-tabs:not(.stx-secbar),
.ows-stacks.has-sections #stx-app-locked > .stx-tabs:not(.stx-secbar),
.ows-stacks.has-sections .stx-panel > .stx-mergednav {
  display: none !important;
}

/* Row 1: the four sections, in the bar's own tab look, then Weather · Injuries
   set apart by a thin rule (Aaron, 2026-10-21: buttons of their own, no row under them). */
.ows-stacks .stx-secbar { flex-wrap: wrap; }
#ows-stacks .stx-secbar .stx-secbar-sep { align-self: center; flex: 0 0 auto; width: 1px; height: 20px; margin: 0 10px; background: var(--rule-2, var(--line)); }
/* Row 2: the open section's tools; then a row for the open tool's own views
   (Stack Builder › Stacks | Heat, Players › DROE › All season | This week).
   The toolkit's rule: tab rows are black when selected. */
#ows-stacks .stx-secnav .stx-sectools { margin: 14px 0 0; flex-wrap: wrap; }
#ows-stacks .stx-secnav .stx-secsub { margin: 8px 0 0; padding-left: 12px; border-left: 2px solid var(--ink); flex-wrap: wrap; }
#ows-stacks .stx-secnav .stx-secsub-2 { margin-left: 14px; }
body.stx-look-jm #ows-stacks .stx-secnav .stx-secsub .stx-mergednav-btn { font-size: 12.5px; padding: 5px 10px; }

/* DFS: "Week 7" named once, quietly, then three rows one above another, one per
   group, each with its small label at the start (Aaron, 2026-10-21, NV5). The
   labels share one width so the three button rows start at the same place. */
#ows-stacks .stx-secnav .stx-secweek { margin: 14px 0 0; padding: 0; font: 700 13px/1.2 var(--sans, inherit); color: var(--muted); }
#ows-stacks .stx-secnav .stx-secgroups { display: flex; flex-direction: column; gap: 8px; margin: 14px 0 0; }
#ows-stacks .stx-secnav .stx-secweek + .stx-secgroups { margin-top: 8px; }
#ows-stacks .stx-secgroup { display: flex; align-items: center; gap: 12px; min-width: 0; }
#ows-stacks .stx-secgroup-name { flex: 0 0 92px; font: 700 10.5px/1.2 var(--sans, inherit); letter-spacing: .1em; text-transform: uppercase; color: var(--jm-ink-3, var(--muted)); }
#ows-stacks .stx-secgroup-btns { flex: 1 1 auto; min-width: 0; display: flex; flex-wrap: wrap; gap: 6px; }
body.stx-look-jm #ows-stacks .stx-secgroups .stx-mergednav-btn { font-size: 13px; padding: 6px 10px; }
/* The week's ownership pages at the end of Projections (the Tools dropdown's rows): set a
   little apart from the tools, a link once published, muted until it's out. */
#ows-stacks .stx-secgroup-btns .stx-seclink { display: inline-block; text-decoration: none; white-space: nowrap; }
#ows-stacks .stx-secgroup-btns .stx-seclink.is-first { margin-left: 8px; }
/* A notch smaller than the tools. The buttons say just Main, Early, Late, TNF, SMF, SNF, MNF
   (Aaron, 2026-10-22); the full name with teams is the hover text. */
body.stx-look-jm #ows-stacks .stx-secgroups .stx-seclink { font-size: 12px; padding: 6px 8px; }
#ows-stacks .stx-secgroup-btns .stx-seclink.is-off { border-color: var(--line); color: var(--jm-ink-3, var(--muted)); cursor: default; }
/* Room between the last row and the tool's card (the Stacks board's card has no top margin of its own). */
#ows-stacks .stx-secnav { margin-bottom: 16px; }
#ows-stacks .stx-secnav + .stx-panel,
#ows-stacks .stx-secnav ~ .stx-panel { margin-top: 0; }
/* A paid tool's lock and "$1 This week" pill ride along inside its button. */
#ows-stacks .stx-sectools .stx-mergednav-btn.is-paid { display: inline-flex; align-items: center; gap: 6px; }
#ows-stacks .stx-sectools .stx-mergednav-btn.is-paid > * { margin: 0; }

/* Every tool on the same cream card (Aaron, 2026-10-22, R4: "Everything should match the
   background so there's cohesiveness"). Most tools already draw it on their own panel, with
   exactly these values (stacks-jm-theme.css, salary-changes.css…), so for them nothing
   changes; this gives it to the ones that were flat (Matchups, Props Board, SGP, Ladder,
   Betting Calculator, Weather, Injuries, Cascading Projections, Bink, the ownership boards,
   NBA's home / Props / Calculator). Left out: panels that already hold a card of their own
   inside: Stat Finder's board (.stx-jm-card) and JM's widgets (Sportsbook Implied, Team EPA,
   EPA Edge, DROE), so none gets a card inside a card. */
body.stx-look-jm #ows-stacks .stx-panel:not(:has(.stx-jm-card, [data-ows-sportsbook], [data-ows-epa], [data-ows-droe])) {
  margin-top: 0; padding: 4px 30px 26px;
  border: 1px solid rgba(22, 19, 15, .10); border-top: 0; border-radius: 0 0 2px 2px;
  background: var(--jm-card-bg); box-shadow: 0 18px 50px -18px rgba(22, 19, 15, .35);
}
@media (max-width: 600px) {
  body.stx-look-jm #ows-stacks .stx-panel:not(:has(.stx-jm-card, [data-ows-sportsbook], [data-ows-epa], [data-ows-droe])) { padding: 4px 14px 18px; }
}

/* The week's ownership board, shown inside the Toolkit (R2). Its own staff toolbar (Draft /
   Published / Edit) stays on its page, not here. */
#ows-stacks .stx-sec-slates .ows-preview-toolbar { display: none; }
#ows-stacks .stx-sec-slates .stx-slates-board > .ows-front-preview { margin: 0; max-width: none; }
/* R2b (Aaron, 2026-10-22: "this weird filtering that looks wrong at the top"): inside the
   Toolkit the board takes the Toolkit's look (docs/TOOLS-DESIGN-GUIDE.md). Only here: its own
   page keeps its own look. Same markup, every control still the board's own. */
#ows-stacks .stx-sec-slates .ows-front-preview {
  --ows-ink: var(--ink); --ows-orange: var(--orange); --ows-line: var(--line); --ows-paper: var(--surface);
  left: auto; transform: none; width: auto; max-width: none; margin: 0; padding: 18px 0 0;
  font-family: var(--sans); color: var(--ink); font-variant-numeric: tabular-nums;
}
#ows-stacks .stx-sec-slates .ows-front-preview * { font-family: var(--sans); }
/* Heading: the Toolkit's eyebrow, question-size headline, quiet stamps. */
#ows-stacks .stx-sec-slates .ows-preview-heading { margin: 0 0 16px; }
#ows-stacks .stx-sec-slates .ows-preview-title-row { align-items: flex-start; gap: 16px; }
#ows-stacks .stx-sec-slates .ows-preview-kicker { margin: 0 0 6px; font: 700 12px/1.2 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--orange); }
#ows-stacks .stx-sec-slates .ows-preview-heading h1 { margin: 0; font-family: var(--display); font-weight: 400; font-size: clamp(24px, 4vw, 34px); line-height: 1.05; letter-spacing: -.01em; text-transform: none; color: var(--ink); }
#ows-stacks .stx-sec-slates .ows-preview-timestamps { margin-top: 8px; gap: 4px 14px; }
#ows-stacks .stx-sec-slates .ows-preview-timestamps small { font: 500 12.5px/1.3 var(--sans); color: var(--muted); opacity: 1; }
#ows-stacks .stx-sec-slates .ows-preview-stamp--check { color: var(--jm-ink-3, var(--muted)); }
#ows-stacks .stx-sec-slates .ows-fresh-pill { border-radius: 4px; background: var(--orange); }
/* The Toolkit already tells phones to turn sideways, above every tool. */
#ows-stacks .stx-sec-slates .ows-mobile-rotate-note { display: none; }
/* CSV: a quiet secondary button, not an orange pill. */
#ows-stacks .stx-sec-slates .ows-download-csv {
  width: auto; min-height: 0; margin: 4px 0 0; padding: 7px 12px; border: 1.5px solid var(--ink); border-radius: 4px;
  background: transparent; color: var(--ink); font: 700 14px/1.2 var(--sans);
}
#ows-stacks .stx-sec-slates .ows-download-csv:hover,
#ows-stacks .stx-sec-slates .ows-download-csv:focus { background: var(--ink); border-color: var(--ink); color: #fff; }
/* DraftKings / FanDuel: the Toolkit's site switch (orange when chosen). */
#ows-stacks .stx-sec-slates .ows-slate-board { margin: 0 0 6px; padding: 0; border: 0; gap: 8px; }
#ows-stacks .stx-sec-slates .ows-slate-group { grid-template-columns: auto 1fr; align-items: center; gap: 12px; }
#ows-stacks .stx-sec-slates .ows-slate-group > strong { padding: 0; font: 700 12px/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--jm-ink-3, var(--muted)); }
#ows-stacks .stx-sec-slates .ows-slate-group > div { gap: 6px; }
#ows-stacks .stx-sec-slates .ows-slate-group a {
  min-width: 0; padding: 6px 11px; border: 1.5px solid rgba(22, 19, 15, .25); border-radius: 4px; box-shadow: none;
  background: #fff; color: var(--ink);
}
#ows-stacks .stx-sec-slates .ows-slate-group a:hover { border-color: var(--ink); box-shadow: none; }
#ows-stacks .stx-sec-slates .ows-slate-group a span { font: 700 13px/1.2 var(--sans); }
#ows-stacks .stx-sec-slates .ows-slate-group a small { display: none; }
#ows-stacks .stx-sec-slates .ows-slate-group a.active { border-color: var(--orange); background: var(--orange); }
#ows-stacks .stx-sec-slates .ows-slate-group a.active,
#ows-stacks .stx-sec-slates .ows-slate-group a.active * { color: #fff; }
/* Basic / Team Ownership: the Toolkit's tab row (black when active). */
#ows-stacks .stx-sec-slates .ows-main-view-tabs { margin: 18px 0 14px; gap: 4px; border-bottom: 2px solid var(--ink); }
#ows-stacks .stx-sec-slates .ows-main-view-tabs button {
  flex: 0 0 auto; min-height: 0; margin: 0; padding: 10px 12px 9px; border: 0; border-radius: 3px 3px 0 0;
  background: transparent; font: 700 12px/1.2 var(--sans); letter-spacing: .05em; text-transform: uppercase; color: var(--jm-ink-3, var(--muted));
}
#ows-stacks .stx-sec-slates .ows-main-view-tabs button:hover { color: var(--ink); }
#ows-stacks .stx-sec-slates .ows-main-view-tabs button[aria-selected="true"] { background: var(--ink); color: #fff; }
/* Position jump links: the Toolkit's chips, no bars. */
#ows-stacks .stx-sec-slates .ows-position-nav { justify-content: flex-start; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; padding: 0; border: 0; overflow: visible; }
#ows-stacks .stx-sec-slates .ows-position-nav--section { margin: 10px 0 26px; }
#ows-stacks .stx-sec-slates .ows-position-nav a {
  padding: 6px 11px; border: 1.5px solid rgba(22, 19, 15, .25); border-radius: 4px; background: #fff;
  font: 700 13px/1.2 var(--sans); white-space: nowrap; text-decoration: none; color: var(--ink);
}
#ows-stacks .stx-sec-slates .ows-position-nav a::before { content: none; }
#ows-stacks .stx-sec-slates .ows-position-nav a:hover { border-color: var(--ink); }
#ows-stacks .stx-sec-slates .ows-position-nav a:active,
#ows-stacks .stx-sec-slates .ows-position-nav a:focus-visible { border-color: var(--orange); background: var(--orange); color: #fff; }
/* The sort note: one plain line. */
#ows-stacks .stx-sec-slates .ows-preview-subone { margin: 0 0 18px; font: 400 13px/1.45 var(--sans); font-style: normal; text-align: left; color: var(--muted); }
/* Section names: the guide's section sub-head, not a big "ALL". */
#ows-stacks .stx-sec-slates .ows-position-section { margin: 0 0 8px; }
#ows-stacks .stx-sec-slates .ows-position-section > h2 { margin: 0 0 8px; font: 800 18px/1.2 var(--sans); letter-spacing: 0; text-transform: lowercase; color: var(--ink); }
/* The board writes "ALL"; the guide's sub-heads are sentence case ("All", "Quarterback").
   (The theme sets every h2 to text-transform:none !important, so this needs its weight.) */
body.stx-look-jm #ows-stacks .stx-sec-slates .ows-position-section > h2 { text-transform: lowercase !important; }
body.stx-look-jm #ows-stacks .stx-sec-slates .ows-position-section > h2::first-letter { text-transform: uppercase !important; }
/* The tables: the Toolkit's table (row lines, cream stripes, peach hover, quiet headings). */
#ows-stacks .stx-sec-slates .ows-preview-table-wrap { border: 1px solid var(--line); border-radius: 2px; }
#ows-stacks .stx-sec-slates .ows-preview-table { font: 400 14px/1.3 var(--sans); }
#ows-stacks .stx-sec-slates .ows-preview-table th,
#ows-stacks .stx-sec-slates .ows-preview-table .ows-points-heading,
#ows-stacks .stx-sec-slates .ows-preview-table .ows-team-ownership-heading {
  padding: 10px 8px 8px; border-bottom: 1px solid var(--rule-2, var(--line)); background: var(--surface);
  font: 700 11px/1.2 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--jm-ink-3, var(--muted));
}
#ows-stacks .stx-sec-slates .ows-preview-table th button { color: inherit; }
#ows-stacks .stx-sec-slates .ows-preview-table th button::after { color: var(--jm-ink-3, var(--muted)); }
#ows-stacks .stx-sec-slates .ows-preview-table th button[data-active-direction]::after { color: var(--orange-dark); }
#ows-stacks .stx-sec-slates .ows-preview-table th button[data-active-direction] { color: var(--ink); }
#ows-stacks .stx-sec-slates .ows-preview-table td { padding: 8px; border-bottom: 1px solid var(--line); background: #fffdfb; }
#ows-stacks .stx-sec-slates .ows-preview-table tbody tr:nth-child(even) td { background: #f8f5f0; }
#ows-stacks .stx-sec-slates .ows-preview-table tbody tr:hover td { background: var(--hit, #fdeee6); }
#ows-stacks .stx-sec-slates .ows-preview-table td strong { font: 700 15px/1.25 var(--sans); }
#ows-stacks .stx-sec-slates .ows-preview-table .ows-points-cell { font: 700 15px/1.25 var(--sans); color: var(--ink); }
#ows-stacks .stx-sec-slates .ows-preview-table .ows-ownership-cell { font: 800 15px/1.25 var(--sans); color: var(--orange-dark); }
#ows-stacks .stx-sec-slates .ows-preview-table .ows-team-ownership-cell { font: 700 14px/1.25 var(--sans); color: var(--muted); }
/* Under 1% and Team Ownership: the same quiet card pieces. */
#ows-stacks .stx-sec-slates .ows-low-owned { border: 1px solid var(--line); border-radius: 2px; background: transparent; }
#ows-stacks .stx-sec-slates .ows-low-owned > summary h2 { font: 800 18px/1.2 var(--sans); text-transform: none; }
#ows-stacks .stx-sec-slates .ows-low-owned__count { border-radius: 4px; background: var(--orange); }
#ows-stacks .stx-sec-slates .ows-low-owned__hint { font: 400 13px/1.45 var(--sans); font-style: normal; color: var(--muted); }
#ows-stacks .stx-sec-slates .ows-low-owned > .ows-preview-table-wrap { border-radius: 0; }
#ows-stacks .stx-sec-slates .ows-team-board { margin: 0 0 20px; border: 1px solid var(--line); border-radius: 2px; background: transparent; }
#ows-stacks .stx-sec-slates .ows-team-board__title span { font: 700 12px/1.2 var(--sans); letter-spacing: .24em; color: var(--orange); }
#ows-stacks .stx-sec-slates .ows-team-board__title h2 { font: 800 18px/1.2 var(--sans); text-transform: none; }
#ows-stacks .stx-sec-slates .ows-team-board__title p { font: 400 13px/1.45 var(--sans); color: var(--muted); }
#ows-stacks .stx-sec-slates .ows-team-board__columns { background: var(--surface); color: var(--jm-ink-3, var(--muted)); border-bottom: 1px solid var(--rule-2, var(--line)); font: 700 11px/1.2 var(--sans); letter-spacing: .08em; }
#ows-stacks .stx-sec-slates .ows-team-card { border-bottom: 1px solid var(--line); background: #fffdfb; }
#ows-stacks .stx-sec-slates .ows-team-card:nth-child(even) { background: #f8f5f0; }
#ows-stacks .stx-sec-slates .ows-team-card summary:hover,
#ows-stacks .stx-sec-slates .ows-team-card summary:focus { background: var(--hit, #fdeee6); }
#ows-stacks .stx-sec-slates .ows-team-card__ownership,
#ows-stacks .stx-sec-slates .ows-team-card__metric--ownership { color: var(--orange-dark); }
#ows-stacks .stx-sec-slates .ows-team-card__players { background: var(--surface); }
#ows-stacks .stx-sec-slates .ows-preview-empty { border: 1px solid var(--line); border-radius: 2px; background: transparent; }
@media (max-width: 780px) {
  /* Phones: the table scrolls inside its card, the name column stays put. */
  #ows-stacks .stx-sec-slates .ows-front-preview { padding: 12px 0 0; }
  #ows-stacks .stx-sec-slates .ows-preview-title-row { display: grid; gap: 10px; }
  #ows-stacks .stx-sec-slates .ows-download-csv { justify-self: start; }
  #ows-stacks .stx-sec-slates .ows-slate-group { grid-template-columns: 1fr; gap: 6px; }
  #ows-stacks .stx-sec-slates .ows-preview-table-wrap { overflow-x: auto; }
  #ows-stacks .stx-sec-slates .ows-preview-table th,
  #ows-stacks .stx-sec-slates .ows-preview-table td { padding: 8px 7px; }
  #ows-stacks .stx-sec-slates .ows-preview-table th:first-child { background: var(--surface); }
  #ows-stacks .stx-sec-slates .ows-preview-table td:first-child { box-shadow: 6px 0 10px -10px rgba(22, 19, 15, .5); }
}

/* Fantasy's Matchups: the Week board without DraftKings salaries. */
.ows-stacks.sec-fantasy .stx-sec-nosal { display: none !important; }

/* The betting tools, brought in from their own pages: their page heading goes
   (this page's hero says what they are) and the theme's 60px <section> padding
   does not apply inside a panel. */
#ows-stacks .stx-sec-embed > .stx-sec-tool,
#ows-stacks .stx-sec-embed > .ows-betcalc { margin: 0 !important; padding: 0 !important; }
#ows-stacks .stx-sec-embed .stx-sec-tool > .stx-hero { display: none; }

/* DFS's three rows end at the same edge (Aaron, 2026-10-22, picked "B" over lined-up
   columns): each row's buttons grow to fill the width, names centred in every button,
   the paid tools' (with their lock) included. Phones keep their two-across rows. */
@media (min-width: 601px) {
  #ows-stacks .stx-secgroup-btns > * { flex: 1 1 auto; text-align: center; }
  #ows-stacks .stx-secgroup-btns > .stx-mergednav-btn.is-paid { justify-content: center; }
}

@media (max-width: 600px) {
  /* Four sections, always one line: equal shares, a long name wraps inside its
     own button ("Sportsbook & Props" on two lines) rather than pushing the
     last section onto a row of its own. Weather · Injuries go on a short line
     of their own under them: the rule between becomes the line break. */
  body #ows-stacks .stx-secnav .stx-secbar { flex-wrap: wrap !important; gap: 4px; }
  body #ows-stacks .stx-secbar .stx-tab { flex: 1 1 0; min-width: min-content; padding: 8px 5px; white-space: normal; overflow-wrap: normal; word-break: normal; hyphens: none; text-align: center; line-height: 1.15; font-size: 11px; }
  body #ows-stacks .stx-secbar .stx-tab.is-direct { flex: 0 0 auto; padding: 8px 12px; }
  #ows-stacks .stx-secbar .stx-secbar-sep { flex: 0 0 100%; width: auto; height: 0; margin: 0; }
  #ows-stacks .stx-secnav .stx-sectools { gap: 6px; }
  /* DFS's group rows: the label goes over its buttons, which go two across like
     every other row of the toolkit on a phone; each row wraps on its own. */
  #ows-stacks .stx-secnav .stx-secgroups { gap: 12px; }
  #ows-stacks .stx-secgroup { flex-direction: column; align-items: stretch; gap: 5px; }
  #ows-stacks .stx-secgroup-name { flex: none; }
  #ows-stacks .stx-secgroup-btns { display: grid; grid-template-columns: 1fr 1fr; }
  #ows-stacks .stx-secgroup-btns .stx-mergednav-btn { text-align: center; }
  #ows-stacks .stx-secgroup-btns .stx-seclink { text-align: center; }
  #ows-stacks .stx-secgroup-btns .stx-seclink.is-first { margin-left: 0; }
  #ows-stacks .stx-secgroup-btns .stx-mergednav-btn:last-child:nth-child(odd) { grid-column: 1 / -1; }
  /* The lock and "$1 This week" pill sit under the tool's name, not beside it. */
  #ows-stacks .stx-sectools .stx-mergednav-btn.is-paid { flex-direction: column; justify-content: center; gap: 2px; }
  #ows-stacks .stx-sectools .stx-mergednav-btn.is-paid > * { font-size: 10.5px; white-space: nowrap; }
  body.stx-look-jm #ows-stacks .stx-secnav .stx-mergednav-btn { font-size: 12.5px; padding: 6px 10px; }
}
