/* ── Power Checklist (power_checklist.html) ───────────────────────────────
   Loads AFTER product_detail.css + player_cards.css and reuses their tokens
   (--paper/--ink/--accent), the .plc-* filter vocabulary, the .plc-ds
   datasheet, and the .plcb-* pills. Page-specific chrome is namespaced .pchk-*.
   Table rows: .pg-section (product banner) / .pg (base card lead) /
   .pg-sub (expansion panel: header + own parallels table + eBay strip). */

.cardstock .pchk-panel {
  padding: 24px 28px 28px;
  --pchk-field-h: 30px;        /* one height for EVERY control field */
  --pchk-img-w: 150px;         /* SELECTIONS product image ≈ an eBay card */
  --pchk-strip-w: 560px;       /* cap for the expanded per-card eBay strip */
  --pchk-thead-h: 24px;        /* sticky column-header height (section top) */
}

.cardstock .pchk-head h1 {
  margin: 0 0 16px; font-size: 28px; font-weight: 800; letter-spacing: -0.01em;
  color: var(--accent); line-height: 1.05;
  text-align: center; text-transform: uppercase;
}

/* ══ Toolbar box — cascade + players + facet filters all in ONE box ══ */
.cardstock .pchk-toolbar {
  margin: 0 0 16px; padding: 10px 12px;
  border: 1px solid var(--rule-soft); border-radius: 9px;
  background: rgba(255,255,255,0.26);
  display: flex; flex-direction: column; gap: 9px;
}
.cardstock .pchk-controls {
  margin: 0; padding: 0; border: 0; background: transparent;
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: 9px 14px;
}
.cardstock .pchk-facets-host[hidden] { display: none; }
/* Refinement filters now live in #pchkFacets BELOW the product/eBay card (moved
   out of the toolbar). They keep the base .plc-filters card chrome (border+bg
   from player_cards.css) so they read as a distinct "narrow these results"
   band; we only normalize the control height + the narrow card-# field here.
   Own stacking context so the Attributes popover clears the table below. */
.cardstock .pchk-facets-host { position: relative; z-index: 30; }
.cardstock .pchk-facets-host .plc-filters select,
.cardstock .pchk-facets-host .plc-filters input[type="search"],
.cardstock .pchk-facets-host .plc-filters .seg {
  height: var(--pchk-field-h); box-sizing: border-box;
}
.cardstock .pchk-facets-host .plc-filters .seg { align-items: stretch; }
.cardstock .pchk-facets-host .plc-filters .seg button { display: inline-flex; align-items: center; }
/* Card-# field: sized to ~6 characters via the size attribute — drop the
   inherited 180px search width so the narrow control shows. */
.cardstock .pchk-facets-host .plc-filters .fctl-search input[type="search"] { width: auto; }

/* ── Filter state (Part D): a control still on its "Any" default gets a NEUTRAL
   active segment (no accent), so only a genuinely-narrowed filter reads as
   applied; narrowed controls get the accent fill + an accent label. ── */
.cardstock .pchk-facets-host .plc-filters .seg button.on {
  background: var(--paper-hi); color: var(--ink);
}
.cardstock .pchk-facets-host .plc-filters .fctl.narrowed .seg button.on {
  background: var(--accent); color: #fff;
}
.cardstock .pchk-facets-host .plc-filters .fctl.narrowed > label { color: var(--accent); }

.cardstock .pchk-ctl { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cardstock .pchk-ctl-label {
  font-size: 10px; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--ink-3);
}

/* Cascade — compact, matching the facet selects */
.cardstock .pchk-cascade { display: inline-flex; align-items: center; gap: 5px; }
.cardstock .pchk-cascade select {
  height: var(--pchk-field-h); box-sizing: border-box;
  font: inherit; font-size: 12.5px; color: var(--ink);
  padding: 0 7px; border: 1px solid var(--paper-edge); border-radius: 5px;
  background: #fff; max-width: 230px;
}
.cardstock .pchk-cascade select:disabled { color: var(--ink-3); background: var(--paper-hi); }

/* ── Custom compact SEASON dropdown (proxy over the hidden native select) ── */
.cardstock .pchk-year-native { display: none; }
.cardstock .pchk-ycombo { position: relative; flex: none; }
.cardstock .pchk-ycombo-btn {
  height: var(--pchk-field-h); box-sizing: border-box;
  display: inline-flex; align-items: center; gap: 6px;
  min-width: 84px; padding: 0 8px;
  font: inherit; font-size: 12.5px; color: var(--ink-3);
  border: 1px solid var(--paper-edge); border-radius: 5px; background: #fff; cursor: pointer;
}
.cardstock .pchk-ycombo.has-val .pchk-ycombo-btn { color: var(--ink); font-weight: 700; }
.cardstock .pchk-ycombo-btn:hover { border-color: var(--accent); }
.cardstock .pchk-ycombo-val { flex: 1 1 auto; text-align: left; white-space: nowrap; }
.cardstock .pchk-ycombo-caret { flex: none; font-size: 9px; color: var(--ink-3); }
.cardstock .pchk-ycombo-btn[aria-expanded="true"] .pchk-ycombo-caret { color: var(--accent); }
.cardstock .pchk-ycombo-list {
  position: absolute; z-index: 45; top: calc(100% + 4px); left: 0; min-width: 100%;
  margin: 0; padding: 4px; list-style: none;
  background: #fff; border: 1px solid var(--paper-edge); border-radius: 7px;
  box-shadow: 0 12px 30px -10px rgba(15,15,15,0.35);
  max-height: 260px; overflow-y: auto;
}
.cardstock .pchk-ycombo-list[hidden] { display: none; }
.cardstock .pchk-ycombo-opt {
  padding: 5px 9px; border-radius: 5px; cursor: pointer;
  font-size: 12.5px; color: var(--ink); white-space: nowrap;
}
.cardstock .pchk-ycombo-opt:hover { background: var(--paper-hi); }
.cardstock .pchk-ycombo-opt[aria-selected="true"] { color: var(--accent); font-weight: 700; }
.cardstock .pchk-clear-product {
  flex: none; width: var(--pchk-field-h); height: var(--pchk-field-h);
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 5px; border: 1px solid var(--paper-edge);
  background: #fff; color: var(--ink-2); cursor: pointer; font-size: 12px;
}
.cardstock .pchk-clear-product:hover { border-color: var(--accent); color: var(--accent); }

/* Players box — chips + typeahead, same height as the other fields */
.cardstock .pchk-players-box {
  display: flex; flex-wrap: wrap; align-items: center; gap: 5px;
  padding: 2px 6px; min-height: var(--pchk-field-h); box-sizing: border-box;
  border: 1px solid var(--paper-edge); border-radius: 5px; background: #fff;
}
.cardstock .pchk-players-box:focus-within { border-color: var(--accent); }
.cardstock .pchk-chips { display: contents; }
.cardstock .pchk-pchip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 2px 4px 2px 8px; border-radius: 999px;
  font-size: 11px; font-weight: 700; color: #fff; background: var(--accent);
  white-space: nowrap;
}
.cardstock .pchk-pchip button {
  display: inline-flex; align-items: center; justify-content: center;
  width: 14px; height: 14px; border-radius: 50%; border: 0; cursor: pointer;
  background: rgba(255,255,255,0.28); color: #fff; font-size: 11px; line-height: 1; padding: 0;
}
.cardstock .pchk-pchip button:hover { background: rgba(255,255,255,0.5); }
/* Selected PLAYER — once one is chosen the input box is removed entirely (its
   chrome stripped + the typeahead wrapper hidden) and the name shows STACKED
   like the info card (a light given name over a bold surname), with a ✕ to
   clear it (restores the input). */
.cardstock .pchk-ctl-players .pchk-players-box.is-selected {
  border-color: transparent; background: transparent; padding: 0; min-height: var(--pchk-field-h);
}
.cardstock .pchk-players-box.is-selected .pchk-typeahead { display: none; }
.cardstock .pchk-pname {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--ink); white-space: nowrap;
}
.cardstock .pchk-pname-id { display: flex; flex-direction: column; line-height: 1.02; }
.cardstock .pchk-pname-first {
  font-size: 10px; font-weight: 400; letter-spacing: 0.06em; color: var(--ink-3);
}
.cardstock .pchk-pname-last {
  font-size: 16px; font-weight: 800; letter-spacing: 0.01em; color: var(--ink);
}
.cardstock .pchk-pname-x {
  display: inline-flex; align-items: center; justify-content: center;
  width: 17px; height: 17px; border-radius: 50%; border: 0; cursor: pointer;
  background: rgba(0,0,0,0.08); color: var(--ink-2); font-size: 11px; line-height: 1; padding: 0;
}
.cardstock .pchk-pname-x:hover { background: var(--accent); color: #fff; }
.cardstock .pchk-typeahead { position: relative; flex: 1 1 130px; min-width: 120px; }
.cardstock .pchk-typeahead input[type="search"] {
  width: 100%; font: inherit; font-size: 12.5px; color: var(--ink);
  border: 0; outline: none; background: transparent; padding: 2px 2px;
}
/* Autocomplete dropdown */
/* Autocomplete popout — sized to its widest option (single row per option, no
   wrapping) rather than pinned to the narrow input; capped so it can't run off
   screen. Applies to every typeahead (player / set / product). */
.cardstock .pchk-ac {
  position: absolute; z-index: 30; top: calc(100% + 5px); left: -6px; right: auto;
  width: max-content; min-width: calc(100% + 12px); max-width: min(560px, 92vw);
  margin: 0; padding: 4px; list-style: none;
  background: #fff; border: 1px solid var(--paper-edge); border-radius: 8px;
  box-shadow: 0 12px 30px -10px rgba(15,15,15,0.35);
  max-height: 320px; overflow-y: auto; overflow-x: hidden;
}
.cardstock .pchk-ac li {
  display: flex; align-items: center; gap: 9px; padding: 6px 8px;
  border-radius: 6px; cursor: pointer; white-space: nowrap;
}
.cardstock .pchk-ac .pchk-ac-name { white-space: nowrap; }
.cardstock .pchk-ac .pchk-ac-meta { flex: none; }
.cardstock .pchk-ac li[aria-selected="true"], .cardstock .pchk-ac li:hover { background: var(--paper-hi); }
.cardstock .pchk-ac .pchk-ac-img {
  flex: none; width: 30px; height: 30px; border-radius: 5px; object-fit: cover;
  object-position: top center; background: var(--paper-edge);
}
.cardstock .pchk-ac .pchk-ac-img.is-blank {
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 800; color: var(--ink-3);
}
.cardstock .pchk-ac .pchk-ac-name { font-size: 13px; font-weight: 700; color: var(--ink); }
.cardstock .pchk-ac .pchk-ac-meta { font-size: 11px; color: var(--ink-3); margin-left: auto; }
.cardstock .pchk-ac .pchk-ac-empty { padding: 8px; color: var(--ink-3); font-size: 12.5px; cursor: default; }

/* ══ SELECTIONS header — player sub-card + product sub-card on one row ══ */
.cardstock .pchk-product-ebay[hidden] { display: none; }
.cardstock .pchk-selections { margin: 0 0 12px; }
.cardstock .pchk-sel-title {
  font-size: 10px; font-weight: 800; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--ink-3); margin-bottom: 7px;
}
.cardstock .pchk-sel-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: stretch; }
.cardstock .pchk-sel-card {
  padding: 10px 12px; border-radius: 9px;
  background: rgba(255,255,255,0.55); border: 1px solid var(--rule-soft);
}
.cardstock .pchk-sel-card:empty { display: none; }

/* Player info card — headshot + name (light given name over a bold surname) +
   chase-tier pill. Shown in the selection header when ONE player is selected. */
.cardstock .pchk-sel-player[hidden] { display: none; }
.cardstock .pchk-sel-player {
  display: inline-flex; align-items: center; gap: 12px; margin: 0 0 10px;
  padding: 8px 14px 8px 8px; border-radius: 10px;
  background: rgba(255,255,255,0.55); border: 1px solid var(--rule-soft);
}
.cardstock .pchk-plcard-link {
  display: inline-flex; align-items: center; gap: 12px; text-decoration: none;
}
.cardstock .pchk-plcard-img {
  width: 52px; height: 52px; border-radius: 50%; object-fit: cover;
  object-position: top center; background: #fff;
  border: 1px solid var(--paper-edge); flex: 0 0 auto;
}
.cardstock .pchk-plcard-img.is-blank {
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 800; color: var(--ink-3);
}
.cardstock .pchk-plcard-id { display: flex; flex-direction: column; line-height: 1.02; }
.cardstock .pchk-plcard-first {
  font-size: 12px; font-weight: 400; letter-spacing: 0.06em; color: var(--ink-3);
}
.cardstock .pchk-plcard-last {
  font-size: 21px; font-weight: 800; letter-spacing: 0.01em; color: var(--ink);
}
.cardstock .pchk-plcard-link:hover .pchk-plcard-last { color: var(--accent); }
/* Tier pill — superstar reads gold-on-black; hype tiers reuse the team-view
   badge palette. */
.cardstock .pchk-plcard-tier {
  flex: 0 0 auto; font-size: 10px; font-weight: 800; text-transform: uppercase;
  letter-spacing: 0.08em; padding: 3px 9px; border-radius: 999px;
  border: 1px solid transparent;
}
.cardstock .pchk-plcard-tier.pchk-tier-s {
  color: #f4cf6b; background: #14110c;
  border-color: #6b551f;
  box-shadow: inset 0 0 0 1px rgba(244,207,107,0.35);
}
.cardstock .pchk-plcard-tier.pchk-tier-4 { color: #a4241a; background: #fdeceb; border-color: #f3c9c4; }
.cardstock .pchk-plcard-tier.pchk-tier-3 { color: #9a5b00; background: #fcf1e0; border-color: #f0d7ab; }
.cardstock .pchk-plcard-tier.pchk-tier-2 { color: #4a5568; background: #eef1f5; border-color: #dbe0e7; }

/* Rookies & Legends rails — collapsed by default under a toggle; horizontal
   faces, click adds to the filter */
.cardstock .pchk-rails-wrap { margin-top: 12px; }
.cardstock .pchk-rails-wrap[hidden] { display: none; }
.cardstock .pchk-rails-toggle {
  display: inline-flex; align-items: center; gap: 6px;
  font: inherit; font-size: 10px; font-weight: 800; letter-spacing: 0.07em;
  text-transform: uppercase; color: var(--ink-3);
  background: transparent; border: 0; padding: 2px 0; cursor: pointer;
}
.cardstock .pchk-rails-toggle:hover { color: var(--accent); }
.cardstock .pchk-rails-caret {
  display: inline-block; font-size: 9px; transform: rotate(-90deg);
  transition: transform 120ms ease;
}
.cardstock .pchk-rails-toggle.is-open .pchk-rails-caret { transform: rotate(0deg); }
.cardstock .pchk-rails-count { font-weight: 700; color: var(--ink-3); }
@media (prefers-reduced-motion: reduce) { .cardstock .pchk-rails-caret { transition: none; } }
.cardstock .pchk-rails { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.cardstock .pchk-rails[hidden] { display: none; }
.cardstock .pchk-rails:empty { display: none; }
.cardstock .pchk-rail { display: flex; align-items: center; gap: 8px; min-width: 0; }
.cardstock .pchk-rail-title {
  flex: none; width: 58px; font-size: 10px; font-weight: 800; letter-spacing: 0.07em;
  text-transform: uppercase; color: var(--ink-3);
}
.cardstock .pchk-rail-chips { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; }
.cardstock .pchk-rail-chip {
  display: inline-flex; align-items: center; gap: 6px; flex: none;
  padding: 3px 10px 3px 3px; border-radius: 999px;
  border: 1px solid var(--paper-edge); background: #fff; cursor: pointer;
  font: inherit; font-size: 11.5px; font-weight: 700; color: var(--ink-2); white-space: nowrap;
}
.cardstock .pchk-rail-chip img, .cardstock .pchk-rail-blank {
  width: 24px; height: 24px; border-radius: 50%; object-fit: cover;
  object-position: top center; background: var(--paper-edge); flex: none;
}
.cardstock .pchk-rail-blank { display: inline-flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 800; color: var(--ink-3); }
.cardstock .pchk-rail-chip:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); }
.cardstock .pchk-rail-chip.is-picked, .cardstock .pchk-rail-chip:disabled { opacity: 0.45; cursor: default; }

/* Product card: TITLE at top, the description's first full paragraph, a link to
   the full product page, then a MAIN ROW of ONE product-image tile (it stands in
   for both shops and eBay) stacking "Best shop price" then the eBay logo +
   "Best eBay price" beneath it, with the "what to expect in a box" panel taking
   the rest of the row. A right-aligned third-party / affiliate disclaimer closes
   the card. */
.cardstock .pchk-sel-product {
  min-width: 0; width: fit-content; max-width: min(940px, 100%);
  display: flex; flex-direction: column; gap: 8px;
}
.cardstock .pchk-sel-prod-name {
  display: block; max-width: 640px; font-size: 15px; font-weight: 800; color: var(--accent);
  line-height: 1.15; text-transform: uppercase; text-decoration: none;
}
.cardstock .pchk-sel-prod-name:hover { text-decoration: underline; }
.cardstock .pchk-sel-prod-desc { margin: 0; max-width: 640px; font-size: 12px; color: var(--ink-2); line-height: 1.45; }
/* Explicit link to the full product page, under the description — paired inline
   with a buyer-side price-trend badge. */
.cardstock .pchk-sel-prod-linkrow {
  display: flex; align-items: center; gap: 10px; margin-top: -2px;
}
.cardstock .pchk-sel-prod-link {
  font-size: 11.5px; font-weight: 700; color: var(--accent); text-decoration: none;
}
.cardstock .pchk-sel-prod-link:hover { text-decoration: underline; }

/* Main row: price tiles (left) + what-to-expect panel (right of the eBay tile). */
.cardstock .pchk-sel-main {
  display: flex; gap: 16px; align-items: flex-start; flex-wrap: wrap; margin-top: 2px;
}

/* Single price column: product-image tile, shop price, then the eBay price
   block. FIXED width (no flex-grow) so the what-to-expect panel takes the
   rest of the row. */
.cardstock .pchk-price-col {
  min-width: 0; display: flex; flex-direction: column;
  align-items: center; gap: 5px; text-align: center;
}
.cardstock .pchk-sel-main .pchk-price-col { flex: 0 0 var(--pchk-img-w); width: var(--pchk-img-w); }

/* eBay price block under the shop price — logo, label, linked price. */
.cardstock .pchk-price-ebay {
  display: flex; flex-direction: column; align-items: center; gap: 5px; margin-top: 7px;
}
.cardstock .pchk-ebay-logo { display: block; height: 18px; width: auto; margin: 0; }

/* "What to expect in a box" — the product page's box-hits view reproduced to the
   RIGHT of the product tile (widened into the space the old eBay tile held). A
   ~20px number margin right-aligns the per-box counts against their descriptions
   (matches product detail's .box-hits grid). */
.cardstock .pchk-whatbox {
  flex: 1 1 300px; min-width: 240px; max-width: 640px; box-sizing: border-box;
  padding: 10px 12px; border-radius: 8px;
  background: rgba(255,255,255,0.5); border: 1px solid var(--rule-soft);
}
.cardstock .pchk-whatbox-title {
  font-size: 10px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--ink-3); margin-bottom: 8px;
}
.cardstock .pchk-whatbox-label {
  font-size: 9.5px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 2px;
}
.cardstock .pchk-whatbox-line,
.cardstock .pchk-whatbox-hits li {
  display: grid; grid-template-columns: 20px 1fr; column-gap: 7px;
  font-size: 12px; color: var(--ink-2); line-height: 1.4;
}
.cardstock .pchk-whatbox-line { margin: 0 0 9px; }
.cardstock .pchk-whatbox-line > strong,
.cardstock .pchk-whatbox-hits li > strong { text-align: right; color: var(--accent); font-weight: 800; }
.cardstock .pchk-whatbox-sub {
  font-size: 9.5px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--ink-3); margin-bottom: 5px;
}
.cardstock ol.pchk-whatbox-hits {
  list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px;
}

/* Disclaimer — bottom of the card, aligned to the right (with the
   what-to-expect side); wraps within a capped width. */
.cardstock .pchk-sel-disclaimer {
  align-self: flex-end; max-width: 640px; margin: 10px 0 0;
  font-size: 9.5px; line-height: 1.45; color: var(--ink-3); text-align: right;
}
.cardstock .pchk-price-card {
  width: 100%; height: 132px; box-sizing: border-box;
  display: flex; align-items: center; justify-content: center; padding: 8px;
  border: 0; border-radius: 8px;
  background: transparent; text-decoration: none;
}
.cardstock .pchk-price-card img { max-height: 100%; max-width: 100%; object-fit: contain; display: block; }
.cardstock .pchk-price-noimg { font-size: 22px; color: var(--ink-3); }
.cardstock .pchk-price-label {
  font-size: 10px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.04em; color: var(--ink-3);
}
/* Terracotta price under each label. The eBay price is an anchor (out to the
   listing) — keep it looking like the shop price, underline on hover only. */
.cardstock .pchk-price-amt {
  font-size: 18px; font-weight: 800; color: var(--accent); line-height: 1;
  font-family: "Roboto Mono", monospace;
}
.cardstock a.pchk-price-amt { text-decoration: none; }
.cardstock a.pchk-price-amt:hover { text-decoration: underline; }
.cardstock .pchk-price-amt.pchk-price-none,
.cardstock .pchk-price-amt.pchk-price-loading {
  font-family: var(--font-sans, inherit); font-size: 12.5px; font-weight: 600; color: var(--ink-3);
}

/* ══ Grouping & sorting header (CHECKLIST MODE + SORT BY) ══ */
.cardstock .pchk-groupbar {
  display: flex; align-items: flex-end; gap: 16px; margin: 0 0 8px; flex-wrap: wrap;
}
.cardstock .pchk-gsctl { display: flex; flex-direction: column; gap: 3px; }
.cardstock .pchk-gsctl-label {
  font-size: 10px; font-weight: 800; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--ink-3);
}
.cardstock .pchk-sortsel {
  height: 26px; box-sizing: border-box; font: inherit; font-size: 12px; color: var(--ink);
  padding: 0 7px; border: 1px solid var(--paper-edge); border-radius: 5px; background: #fff;
}
.cardstock .pchk-groupbar-label {
  font-size: 11.5px; font-weight: 700; color: var(--ink-3);
  margin-left: auto; padding-bottom: 4px;
}

/* ══ Table ══ */
.cardstock table.pchk-ds tbody tr.pg:hover td { background: #f2f7fd; }
.cardstock table.pchk-ds tbody tr.pg.pg-expandable { cursor: pointer; }
.cardstock table.pchk-ds tbody tr.pg.pg-open td { background: #eef5ff; }
.cardstock table.pchk-ds td.c-player { font-weight: 700; color: #24292e; max-width: 220px;
  overflow: hidden; text-overflow: ellipsis; }
/* Uniform, aligned Attributes pills — scoped to the checklist table so the
   shared product-detail table keeps its own sizing. Every pill is one fixed
   HEIGHT with equal padding + a 1px border (transparent on the colored pills so
   their box model matches the auto pill's real border); widths stay
   content-driven but all pills sit level on one row. */
.cardstock table.pchk-ds td.c-attrs .plcb,
.cardstock table.pchk-ds .pp-attrs .plcb {
  height: 16px; min-width: 20px; padding: 0 5px; box-sizing: border-box;
  border: 1px solid transparent; line-height: 1; vertical-align: middle;
  margin: 0 3px 0 0;
}
.cardstock table.pchk-ds td.c-attrs .plcb-auto .plc-sq,
.cardstock table.pchk-ds .pp-attrs .plcb-auto .plc-sq { height: 10px; }
.cardstock .pchk-fire { font-size: 12px; }

/* Expand caret column. The base-card rows are one level BELOW the product
   section banner, so their +/− box is indented (padding-left) to sit to the
   RIGHT of the banner's toggle — a proper parent→child nest rather than the
   two boxes reading at the same (or reversed) depth. */
.cardstock table.pchk-ds th.c-exp, .cardstock table.pchk-ds td.c-exp {
  width: 32px; min-width: 32px; text-align: center; padding-left: 18px; padding-right: 0;
}
.cardstock .pchk-exp {
  display: inline-flex; align-items: center; justify-content: center;
  width: 14px; height: 14px; border: 1px solid #c3c9d0; border-radius: 3px;
  background: #fff; cursor: pointer; color: #57606a; padding: 0;
}
.cardstock .pchk-exp:hover { border-color: var(--accent); color: var(--accent); }
/* +/− glyph via ::before so the collapsed/expanded state swaps the sign
   (state = the JS-toggled .is-open class, no rotation). */
.cardstock .pchk-caret { display: inline-block; font-size: 11px; font-weight: 700; line-height: 1; }
.cardstock .pchk-caret::before { content: "+"; }
.cardstock .pchk-caret.is-open { color: var(--accent); }
.cardstock .pchk-caret.is-open::before { content: "\2212"; }  /* − minus */
@media (prefers-reduced-motion: reduce) { .cardstock .pchk-caret, .cardstock .pchk-sec-caret { transition: none; } }

.cardstock .pchk-parcount {
  margin-left: 6px; font-size: 9.5px; font-weight: 800; letter-spacing: 0.02em; color: var(--accent);
}

/* ── Product section banner — sticky below the sticky column header ── */
.cardstock table.pchk-ds tr.pg-section > td {
  position: sticky; top: var(--pchk-thead-h); z-index: 2;
  background: #e9edf2; border-top: 2px solid #cdd3da; border-bottom: 1px solid #cdd3da;
  padding: 5px 10px 5px 8px; white-space: nowrap;
}
.cardstock table.pchk-ds tr.pg-section { cursor: pointer; }
.cardstock .pchk-sec-toggle {
  border: 0; background: transparent; cursor: pointer; color: #57606a;
  padding: 0 5px 0 0; font-size: 11px;
}
/* Rounded-square +/− (expanded = "−", collapsed = "+" via the JS is-closed
   class). Border lives on the caret span so the toggle's right-padding stays
   outside the box. */
.cardstock .pchk-sec-caret {
  display: inline-flex; align-items: center; justify-content: center;
  width: 14px; height: 14px; border: 1px solid #c3c9d0; border-radius: 3px;
  background: #fff; font-size: 10px; font-weight: 700; line-height: 1; color: #57606a;
}
.cardstock .pchk-sec-caret::before { content: "\2212"; }        /* − expanded */
.cardstock .pchk-sec-caret.is-closed::before { content: "+"; }   /* + collapsed */
.cardstock .pchk-sec-toggle:hover .pchk-sec-caret { border-color: var(--accent); color: var(--accent); }
.cardstock .pchk-sec-label { font-weight: 800; color: #24292e; text-decoration: none; font-size: 12px; }
.cardstock .pchk-sec-label:hover { text-decoration: underline; color: var(--accent); }
.cardstock .pchk-sec-arrow { font-weight: 400; color: #9aa1a9; }
.cardstock .pchk-sec-count { color: #6a737d; font-size: 11px; margin-left: 10px; font-weight: 600; }

/* ── Expansion panel: header + own parallels table + eBay ── */
.cardstock table.pchk-ds tr.pg-sub > td {
  padding: 0; background: #fafbfd; border-bottom: 1px solid #e3e7ec; white-space: normal;
}
.cardstock .pchk-exp-panel { padding: 8px 14px 12px 44px; }
.cardstock .pchk-exp-head {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 3px 12px;
  font-size: 11px; color: #4a5158; margin: 8px 0;
}
.cardstock .pchk-exp-title { font-weight: 800; color: #24292e; font-size: 12px; }
.cardstock .pchk-exp-num { font-family: "Roboto Mono", monospace; color: #57606a; font-weight: 600; }
.cardstock .pchk-exp-sep { color: #b0b6bc; }
.cardstock .pchk-exp-player { font-weight: 700; color: #3a4149; }
.cardstock .pchk-exp-odds b {
  text-transform: uppercase; font-size: 9px; letter-spacing: 0.03em; color: #767676; margin-right: 3px; font-weight: 700;
}
.cardstock .pchk-exp-note { color: #8a929b; font-style: italic; }

.cardstock .pchk-partable-wrap { overflow-x: auto; max-width: 100%; margin-bottom: 8px; }
.cardstock table.pchk-partable {
  border-collapse: collapse; width: auto; font-size: 11px; font-variant-numeric: tabular-nums;
}
.cardstock table.pchk-partable th {
  text-align: left; font-size: 9px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.03em; color: #767676; padding: 2px 18px 4px 0;
  border-bottom: 1px solid #dfe3e8; white-space: nowrap;
}
.cardstock table.pchk-partable td {
  padding: 3px 18px 3px 0; border-bottom: 1px solid #eef0f2; vertical-align: middle; white-space: nowrap;
}
.cardstock table.pchk-partable td.num, .cardstock table.pchk-partable th.num {
  text-align: right; font-family: "Roboto Mono", monospace; color: #57606a; padding-right: 22px;
}
.cardstock .pchk-partable .pp-name { font-weight: 700; color: #3a4149; }
/* Base card leads the parallels list — tinted + accent left-edge so it reads as
   the anchor the parallels vary from. */
.cardstock table.pchk-partable tr.pp-baserow td { background: #f4f6f9; }
.cardstock table.pchk-partable tr.pp-baserow td.pp-name {
  box-shadow: inset 3px 0 0 var(--accent); padding-left: 8px; color: #24292e; font-weight: 800;
}
.cardstock .pchk-partable .pp-sub { margin-left: 6px; color: #9aa1a9; font-style: italic; font-weight: 400; }
.cardstock .pchk-partable .pp-attrs .plcb { margin-right: 3px; }
.cardstock .pchk-partable .pp-odds { color: #8a929b; font-size: 10.5px; }

.cardstock .pchk-exp-ebay { max-width: var(--pchk-strip-w); }
.cardstock .pchk-exp-ebay-idle { margin: 4px 0 0; font-size: 11px; font-style: italic; color: #8a929b; }

/* ── Empty states ── */
.cardstock .pchk-empty {
  padding: 40px 18px; text-align: center;
  border: 1px dashed var(--rule); border-radius: 10px; background: rgba(255,255,255,0.2);
}
.cardstock .pchk-empty-lead { margin: 0 0 6px; font-size: 15px; font-weight: 700; color: var(--ink-2); }
.cardstock .pchk-empty-sub { margin: 0; font-size: 12.5px; color: var(--ink-3); }

/* ── Responsive ── */
@media (max-width: 720px) {
  .cardstock .pchk-panel { padding: 18px 10px 20px; }
  .cardstock .pchk-head h1 { font-size: 22px; }
  .cardstock .pchk-controls { gap: 10px 12px; }
  .cardstock .pchk-cascade select { max-width: 46vw; }
  .cardstock .pchk-sel-prod-link { align-items: flex-start; }
  .cardstock table.pchk-ds td.c-player { max-width: 34vw; }
}

/* The toolbar owns every dropdown (autocomplete lists, the attributes
   popover) — give it a stacking context above the table host so an open
   list can never be hit-tested behind the content below it. */
.cardstock .pchk-toolbar { position: relative; z-index: 40; }

/* ── Population token boxes (set / team) — reuse the players-box look ── */
.cardstock .pchk-ctl-set .pchk-typeahead { flex: 1 1 150px; min-width: 140px; }
.cardstock .pchk-ctl-team .pchk-typeahead { flex: 1 1 120px; min-width: 110px; }
.cardstock .pchk-ctl-set .pchk-typeahead input[hidden],
.cardstock .pchk-ctl-team .pchk-typeahead input[hidden] { display: none; }

/* ── Product combobox (searchable dropdown): input + clear × + ▾ caret in one
   row; opens the full season-scoped list on focus. ── */
.cardstock .pchk-product-box { flex-wrap: nowrap; min-width: 200px; cursor: pointer; }
.cardstock .pchk-product-box .pchk-typeahead { flex: 1 1 auto; min-width: 80px; }
.cardstock .pchk-product-box .pchk-typeahead input[type="search"] { cursor: text; }
.cardstock .pchk-dd-caret { flex: none; font-size: 9px; color: var(--ink-3); pointer-events: none; }
.cardstock .pchk-dd-clear {
  flex: none; width: 16px; height: 16px; padding: 0; border-radius: 50%;
  border: 1px solid var(--paper-edge); background: #fff; color: var(--ink-2);
  font-size: 10px; line-height: 1; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
}
.cardstock .pchk-dd-clear[hidden] { display: none; }
.cardstock .pchk-dd-clear:hover { border-color: var(--accent); color: var(--accent); }

/* ── Attributes multi-select (refinement bar) ── */
.cardstock .fctl-ms { position: relative; }
.cardstock .pchk-ms-btn {
  height: var(--pchk-field-h); box-sizing: border-box;
  display: inline-flex; align-items: center; gap: 6px;
  font: inherit; font-size: 12.5px; color: var(--ink);
  padding: 0 8px; border: 1px solid var(--paper-edge); border-radius: 5px;
  background: #fff; cursor: pointer; min-width: 92px;
}
.cardstock .pchk-ms-btn:hover { border-color: var(--accent); }
.cardstock .fctl-ms.narrowed .pchk-ms-btn { border-color: var(--accent); color: var(--accent); }
.cardstock .pchk-ms-value {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 150px;
}
.cardstock .pchk-ms-caret { margin-left: auto; font-size: 9px; color: var(--ink-3); }
.cardstock .pchk-ms-pop {
  position: absolute; z-index: 30; top: calc(100% + 5px); left: 0;
  min-width: 160px; padding: 6px;
  background: #fff; border: 1px solid var(--paper-edge); border-radius: 8px;
  box-shadow: 0 12px 30px -10px rgba(15,15,15,0.35);
}
.cardstock .pchk-ms-pop[hidden] { display: none; }
.cardstock .pchk-ms-opt {
  display: flex; align-items: center; gap: 7px;
  padding: 5px 7px; border-radius: 6px; cursor: pointer;
  font-size: 12.5px; color: var(--ink); white-space: nowrap;
}
.cardstock .pchk-ms-opt:hover { background: var(--paper-hi); }
.cardstock .pchk-ms-opt input { margin: 0; accent-color: var(--accent); }

/* ── Lazy product sections ── */
.cardstock .pchk-sec-hint {
  margin-left: 9px; font-size: 10.5px; font-style: italic; color: var(--ink-3);
}
.cardstock tr.pg-section.pchk-sec-loading .pchk-sec-hint { color: var(--accent); }

/* ══ Group-break TEAM view (?view=teams) ══
   Same card rows, different hierarchy: TEAM banner (sticky, like the product
   banner) → PLAYER banner (indented, collapsible, carries RC / auto / 🔥,
   sticky just below the team banner) → indented card rows. Set headers render
   only on multi-product populations (they carry the owning product; otherwise
   the row's own Insert-set cell already names the set). The Player column is
   redundant under a player banner, so the view hides it. */
.cardstock .pchk-viewseg { display: inline-flex; }
.cardstock .pchk-vs-btn {
  font: inherit; font-size: 11px; font-weight: 700; padding: 4px 10px;
  border: 1px solid var(--paper-edge); background: #fff; cursor: pointer;
  color: var(--ink-2);
}
.cardstock .pchk-vs-btn:first-child { border-radius: 5px 0 0 5px; }
.cardstock .pchk-vs-btn:last-child { border-radius: 0 5px 5px 0; border-left: 0; }
.cardstock .pchk-vs-btn:hover:not(:disabled):not(.on) { background: var(--paper-hi); }
.cardstock .pchk-vs-btn.on { background: var(--accent); border-color: var(--accent); color: #fff; cursor: default; }
.cardstock .pchk-vs-btn:disabled { opacity: 0.45; cursor: not-allowed; }

.cardstock table.pchk-ds.pchk-view-teams th.c-player,
.cardstock table.pchk-ds.pchk-view-teams td.c-player { display: none; }

/* Card rows nest one level in from the player banner: the expand gutter
   widens to carry the indent (the banners' backgrounds do the rest). */
.cardstock table.pchk-ds.pchk-view-teams th.c-exp,
.cardstock table.pchk-ds.pchk-view-teams td.c-exp {
  width: 44px; min-width: 44px; padding-left: 26px;
}

/* Player banner — one level in from the team banner, sticky just below it
   so long card lists keep their player context while scrolling. */
.cardstock .pchk-panel { --pchk-team-h: 31.5px; } /* team banner row height (incl. borders) */
.cardstock table.pchk-ds tr.pg-sec-player > td {
  position: sticky; top: calc(var(--pchk-thead-h) + var(--pchk-team-h)); z-index: 1;
  background: #f3f5f8; border-top: 1px solid #e0e4e9; border-bottom: 1px solid #e6eaef;
  padding: 4px 10px 4px 26px; white-space: nowrap;
}
.cardstock tr.pg-sec-player .pchk-sec-label { font-size: 11.5px; }
.cardstock tr.pg-sec-player .plcb { margin-left: 6px; vertical-align: 1px; }
.cardstock tr.pg-sec-player .pchk-fire { margin-left: 5px; }

/* Player header — the FIRST row of a player's expansion: a compact player
   card (headshot + name + chase tier + capability badges) with the player-page
   link pinned to the right, so opening a player anchors their identity before
   the card list. */
.cardstock table.pchk-ds tr.pchk-player-linkrow > td {
  background: #fafbfd; border-bottom: 1px solid #eef0f2;
  padding: 6px 12px 7px 34px;
}
.cardstock .pchk-player-hdr {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.cardstock .pchk-player-hdr-img {
  width: 30px; height: 30px; border-radius: 50%; object-fit: cover;
  background: #fff; border: 1px solid var(--paper-edge); flex: 0 0 auto;
}
.cardstock .pchk-player-hdr-img.is-blank {
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800; color: #9aa1a9;
}
.cardstock .pchk-player-hdr-name {
  font-size: 12.5px; font-weight: 800; color: #24292e;
}
.cardstock .pchk-player-hdr-tier {
  font-size: 8.5px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.04em; padding: 1px 6px; border-radius: 999px;
  border: 1px solid transparent;
}
.cardstock .pchk-player-hdr-tier.pchk-tier-4 {
  color: #a4241a; background: #fdeceb; border-color: #f3c9c4;
}
.cardstock .pchk-player-hdr-tier.pchk-tier-3 {
  color: #9a5b00; background: #fcf1e0; border-color: #f0d7ab;
}
.cardstock .pchk-player-hdr-tier.pchk-tier-2 {
  color: #4a5568; background: #eef1f5; border-color: #dbe0e7;
}
.cardstock tr.pchk-player-linkrow .plcb { vertical-align: 1px; }
.cardstock .pchk-player-pagelink {
  flex: 0 0 auto; margin-left: 2px;
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 10.5px; font-weight: 700; padding: 2px 10px;
  border: 1px solid var(--paper-edge); border-radius: 999px; background: #fff;
  color: var(--ink-2); text-decoration: none;
}
.cardstock .pchk-player-pagelink .pchk-sec-arrow { font-size: 10px; }
.cardstock .pchk-player-pagelink:hover,
.cardstock .pchk-player-pagelink:focus-visible { border-color: var(--accent); color: var(--accent); }

/* Team banner 🔥 run — one flame per tier-4 player + one half-flame per
   tier-3 (coveted) player */
.cardstock .pchk-team-fires { font-size: 12px; margin-left: 6px; letter-spacing: 1px; }
.cardstock .pchk-team-fires:empty { display: none; }
/* Half fire — no half-flame emoji exists, so clip-path hides the glyph's
   right half. Unlike overflow:hidden (which moves an inline-block's baseline
   to its bottom edge and knocks the flame out of line), clip-path leaves the
   glyph in normal text flow, so full and half flames sit level. The negative
   margin reclaims the invisible half's advance width. */
.cardstock .fire-half {
  display: inline-block;
  clip-path: inset(0 52% 0 0);
  margin-right: -0.55em;
}

/* Set header — multi-product populations only (carries the owning product);
   sits between the player banner (26px) and the card rows (~46px). */
.cardstock table.pchk-ds tr.pchk-setrow > td {
  background: #fafbfd; border-bottom: 1px solid #eef0f2;
  padding: 3px 10px 3px 34px; white-space: nowrap;
}
.cardstock .pchk-setrow-label {
  font-size: 9.5px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.05em; color: #767676;
}
.cardstock .pchk-setrow-prod { margin-left: 8px; font-size: 10px; color: #9aa1a9; }

@media (max-width: 720px) {
  .cardstock .pchk-groupbar { flex-wrap: wrap; }
}

/* ══ Embed mode (?embed=1) ═══════════════════════════════════════════════════
   Mounted inside the product-detail "Power Checklist" tab via an iframe (base
   .html already drops the site nav/footer). Here we strip THIS page's own
   chrome so the tab shows only the refinement facets + the wide table, full
   width: the population toolbar is redundant (the product is pinned via ?pid=)
   and the product/eBay SELECTIONS card duplicates what the detail page already
   shows above the tab. Scoped to `.cardstock.pchk-embed` (the flag rides the
   page root), so the standalone page is untouched. */
.cardstock.pchk-embed .shell { max-width: none; margin: 0; padding: 0; }
.cardstock.pchk-embed .panel.pchk-panel {
  padding: 0; margin: 0; border: 0; background: transparent; box-shadow: none;
}
.cardstock.pchk-embed .panel.pchk-panel::before,
.cardstock.pchk-embed .panel.pchk-panel::after { display: none; content: none; }
.cardstock.pchk-embed .pchk-head,
.cardstock.pchk-embed .pchk-toolbar,
.cardstock.pchk-embed #pchkProductEbay { display: none !important; }
/* The facets host carries a top margin meant to separate it from the (now
   hidden) selections card — reclaim it so the table starts at the tab's top. */
.cardstock.pchk-embed #pchkFacets { margin-top: 0; }