/* pn-warroom-pitchrow-20260927.css — WAR ROOM: "Add a one-page pitch" row (CEO screenshot,
   2026-09-27, "sloppy design, not fixed"). Loads LAST (after pn-financials-20260927.css) so it
   outranks every earlier layer without touching them.

   ROOT CAUSES, measured with Playwright (getBoundingClientRect + an ancestor overflow walk —
   see qa/pitchrow_check.mjs):

   1 · THE DISCLOSURE. `.wr-more--page > summary` carries ZERO horizontal padding, set by
       pn-pitchflow-20260926.css:459 (`padding:14px 0 2px`) — the heading text sits flush on the
       row's left edge, and the `:focus-visible` ring (style-01.css:10703, `outline-offset:3px`)
       rings that same unpadded box, hugging the text. The collapse control, `.wr-more-cue`, is a
       bare 26x26px border box holding a CSS `content:"+"/"–"` character (style-01.css:10707-
       10711) — never a real chevron, never 44px.

   2 · THE TOOL ROW CLIPPING. `.pn-dice-wrap` (style-01.css:5390-5392) is a FIXED 32px-tall,
       `overflow:hidden` box (`--pn-chiph:32px`). pn-pitch-flow-20260919.css:216-236 later forces
       the "Roll the Dice" and "?" buttons INSIDE that same wrapper to `min-height:44px
       !important` — 12px taller than the parent that clips them. Measured on this section:
       wrapper content box 379–411px (32px) vs. button box 379–423px (44px) — the bottom 12px of
       both buttons falls outside the wrapper's own overflow:hidden and is cut off. That wrapper
       also never picked up the war room's pf-* dark-glass type family, so it stays mono/caps
       while "OPEN THE FILE…" (`.poap-dossier`) is sentence-case sans, one corner clip-cut, at a
       6px different y-offset — the three-way height/baseline/radius/font mismatch in the report.

   Fix strategy: un-clip the actual offender (`.pn-dice-wrap`) instead of shrinking the buttons
   back to 32px, then bring all three controls onto one 44px-minimum row with the same radius,
   font and baseline. Dark only, AA text, reduced-motion respected throughout.
   ═══════════════════════════════════════════════════════════════════════════════════════════ */

/* ── 1 · THE DISCLOSURE ROW — padded heading, a ring that fits it, a real 44px chevron ─────────
   ROUND 2 (coordinator, after first pass): padding still lost. Cause: pn-pitchflow-20260926.css:
   458 uses `html:not(#pn-ds-never) body[data-view="pitch"] .wr-main details.wr-more > summary`
   — the `:not(#id)` gives it ID-tier specificity (1,3,4) with `!important` on padding. My round-1
   selector (`html body[data-view="pitch"] .wr-resp .wr-more--page > summary`, 0,3,3) has ZERO in
   the ID column, so it loses regardless of load order — `!important` vs `!important` falls back
   to specificity, and ID always outranks class count. Fix: mirror their selector shape (same
   `:not(#id)` + `.wr-main` + `details.wr-more`) and add `.wr-more--page` on top, which raises the
   class tier past theirs at equal ID tier → (1,5,4), a clean win, and scope narrowly to `.wr-resp`
   so nothing else under `.wr-main` is touched. */
html:not(#pn-ds-never) body[data-view="pitch"] .wr-main .wr-resp details.wr-more.wr-more--page > summary{
  display:flex !important; align-items:center !important; min-height:60px !important;
  padding:8px 16px !important; border-radius:10px !important; gap:12px !important;
  box-sizing:border-box !important;
}
/* SIDE EFFECT CAUGHT ON RE-VERIFY (phone only — desktop has room and is untouched): the
   `display:flex !important` above (needed to win the specificity fight, and already the case
   before this file existed — pn-pitchflow-20260926.css uses the same trick) beats
   pn-pitch-beats-20260914.css's `.pn-fwin .wr-more > summary{display:grid}`. The grid used to
   give `.wr-more-sub` its OWN full-width row when it didn't fit next to the heading + 44px cue;
   flex with `flex:1 1 auto;min-width:0` instead squeezes it into whatever sliver is left
   (measured: 8.8px on a 390px phone once the 16px padding this fix adds is accounted for), and
   its inherited `word-break:break-word` (pn-touch-20260801.css:856-858) then breaks it one
   letter per line — 508px tall. Below 760px only: `flex-wrap:wrap` on the row + `order`/
   `flex-basis` on the caption recreate the grid's intent without needing grid — heading + chevron
   share the first line, the caption gets the full row width on its own line under them, wrapping
   by WORD like everywhere else. Desktop already laid out on one line correctly; left alone. */
@media (max-width:760px){
  html:not(#pn-ds-never) body[data-view="pitch"] .wr-main .wr-resp details.wr-more.wr-more--page > summary{
    flex-wrap:wrap !important; row-gap:4px !important;
  }
  html:not(#pn-ds-never) body[data-view="pitch"] .wr-main .wr-resp details.wr-more.wr-more--page > summary .wr-more-sub{
    order:3 !important; flex:1 1 100% !important; width:100% !important; min-width:0 !important;
  }
}
html:not(#pn-ds-never) body[data-view="pitch"] .wr-main .wr-resp details.wr-more.wr-more--page > summary:focus-visible{
  outline:2px solid #F97316 !important; outline-offset:-2px !important; border-radius:10px !important;
}
html:not(#pn-ds-never) body[data-view="pitch"] .wr-main .wr-resp details.wr-more.wr-more--page > summary:hover{
  background:rgba(255,255,255,.04) !important;
}
/* the "+"/"–" text glyph is retired for a drawn chevron — border-drawn, so it inherits
   currentColor in every theme and is never an emoji glyph (§13 house rule).
   NOTE: pn-touch-20260801.css:515-520 draws the old glyph on `::before` and forces `::after`
   to `display:none !important` — the chevron below is built on `::before` for exactly that
   reason; putting it on `::after` renders nothing (learned by inspecting computed style). */
html body[data-view="pitch"] .wr-resp .wr-more--page > summary .wr-more-cue{
  width:44px !important; height:44px !important; min-width:44px !important; min-height:44px !important;
  border:1px solid rgba(234,241,251,.28) !important; border-radius:999px !important;
  background:rgba(255,255,255,.04) !important; color:#EAF1FB !important; opacity:1 !important;
  transition:transform .18s ease, background .18s ease, border-color .18s ease !important;
}
html body[data-view="pitch"] .wr-resp .wr-more--page > summary .wr-more-cue::after{
  content:"" !important; display:none !important;
}
html body[data-view="pitch"] .wr-resp .wr-more--page > summary .wr-more-cue::before{
  content:"" !important; display:block !important; width:8px !important; height:8px !important;
  border:0 !important; border-right:2px solid currentColor !important; border-bottom:2px solid currentColor !important;
  transform:rotate(45deg) translate(-1px,-1px) !important; margin-top:-4px !important;
}
html body[data-view="pitch"] .wr-resp .wr-more--page[open] > summary .wr-more-cue{
  transform:rotate(180deg) !important; border-color:#F97316 !important; color:#F97316 !important;
}
@media (prefers-reduced-motion:reduce){
  html body[data-view="pitch"] .wr-resp .wr-more--page > summary .wr-more-cue,
  html body[data-view="pitch"] .wr-resp .wr-more--page[open] > summary .wr-more-cue{
    transition:none !important; transform:none !important;
  }
}

/* ── 2 · THE TOOL ROW — un-clip the cause, then align all three controls ─────────────────────── */
html body[data-view="pitch"] .wr-resp .poap-head-tools{
  display:flex !important; align-items:stretch !important; gap:10px !important;
  flex-wrap:wrap !important; row-gap:10px !important;
}
/* the actual defect: give the 32px, overflow:hidden wrapper room for the 44px controls it now
   holds, instead of leaving them to spill past its own bottom edge */
html body[data-view="pitch"] .wr-resp .pn-dice-wrap{
  height:auto !important; min-height:44px !important; overflow:visible !important;
  align-items:stretch !important; border-radius:10px !important;
}
html body[data-view="pitch"] .wr-resp .pn-dice,
html body[data-view="pitch"] .wr-resp .poap-dossier{
  min-height:44px !important; height:44px !important; box-sizing:border-box !important;
  border-radius:10px !important; padding:0 16px !important;
  font:600 14px/1 var(--pn-type-face,IS),IS,sans-serif !important;
  letter-spacing:0 !important; text-transform:none !important;
}
html body[data-view="pitch"] .wr-resp .pn-dice{
  clip-path:none !important; box-shadow:none !important; gap:9px !important;
}
html body[data-view="pitch"] .wr-resp .pn-dice b{ font-weight:600 !important; }
html body[data-view="pitch"] .wr-resp .pn-dice-i{
  width:18px !important; height:18px !important; transform:none !important; filter:none !important;
}
html body[data-view="pitch"] .wr-resp .pn-dice-q{
  width:44px !important; min-width:44px !important; height:44px !important; align-self:stretch !important;
  border-radius:10px !important; padding:0 !important;
  font:700 16px/1 var(--pn-type-face,IS),IS,sans-serif !important;
  border-left:1px solid rgba(234,241,251,.2) !important;
}
html body[data-view="pitch"] .wr-resp .poap-dossier{
  clip-path:none !important; flex:0 0 auto !important; white-space:nowrap !important;
}

/* ── 3 · 8pt RHYTHM — the textarea's clearance from the tool row above ───────────────────────── */
html body[data-view="pitch"] .wr-resp .poap{ gap:16px !important; }