/* pn-pnp-one-design-20260914.css — ONE DESIGN ACROSS PITCH & PRESENT.
   =============================================================================================
   CEO Jon, 14 Sep 2026: "your main task is to resolve all the poor design screens and P&P
   feedback" — after five rounds of screenshots, each naming the same two things in a new place:
   it is illegible, and it does not look like one game.

   THIS PASS WAS NOT DESIGNED FROM TASTE. `qa/pnp_journey_audit.js` (new) walks all eight P&P
   surfaces in both themes at both widths and PIXEL-SAMPLES every painted text element — the ink
   and the ground are read off a screenshot, so a gradient, a photograph, a ::before or a scrim
   is measured as the player sees it, which is exactly what the ancestor-walking checks kept
   missing. Every rule below closes a fault that audit named, and the audit is the proof it closed.

   ── 1 · THE ONE HEADLINE FACE, FINISHED ──────────────────────────────────────────────────────
   The 12 Sep type-cabinet ruling ("I like this typography from Dave — apply it for all your
   in-game headlines") was only HALF APPLIED, and this is the root of "so much disconnected".
   `pn-type-cabinet-20260912.css` replaced `pn-final-20260820.css` §26's generic h1/h2/h3 sweep,
   but pn-final ALSO names ~14 specific selectors at (0,3,x) with !important that the cabinet's
   generic (0,2,1) rules could never out-rank. So the journey has been running TWO display faces
   side by side ever since. Measured, on the real game: the verdict's own WORD (`.pn-rz-word`),
   the brief's fee and ask (`.bop-hero-v` 52px, `.bop-ask` 25px), the war-room window title, the
   walk-in headline and the store/coin chip all still paint 'Space Grotesk' while everything
   beside them paints the cabinet face. 30 elements across the journey.
   Every one of those selectors is re-pointed here — same selector, same weight of !important,
   loaded later, so cascade ORDER decides it and nothing has to be edited inside pn-final (that
   file stays as the record of WHY a heading is a heading; this is WHICH face it gets).

   ── 2 · INK IS MEASURED, NOT ASSUMED ─────────────────────────────────────────────────────────
   The pitch window's step rail painted `rgb(143,182,232)` — a pale blue meant for the dark glass
   — on the LIGHT window's cream: 1.79:1 on "Brief", 2.38:1 "Angle", 2.63:1 "Squad & rehearsal",
   2.58:1 "Verdict". The case seal was 3.47:1. The brief hero's brand and fee sit ON a photograph
   with no ground of their own (UX_RULES §1: ink is never assumed over media).

   ── 3 · A CONTROL IS 44px ────────────────────────────────────────────────────────────────────
   SKIP and CLOSE measured 34px (32px under 560), Why? 34px, "Answer their note" 34px, the call
   dock's CAM/SND 38px. The pill can stay visually quiet — quiet is a look, not a reason to ship
   a target a thumb misses. Extra height is taken as transparent padding where the pill's own
   size is the design.
   Loads LAST, after every 13/14 Sep sheet.
   ============================================================================================= */

/* ── 1 · THE ONE HEADLINE FACE ─────────────────────────────────────────────────────────────── */
html body .pitch-wrap .bop-ask,
html body .pn-fwin .bop-ask,
html body .pitch-wrap .bop-hero-v,
html body .pn-fwin .bop-hero-v,
html body .pn-fwin .bop h2,
html body .pn-fwin .bop h3,
html body .pn-fwin .wr-mh-title,
html body .pn-fwin .bop-lvl b,
html body .pn-fwin .bop-lvl strong,
html body .pn-fwin .bop-lvl-k,
html body .mt-title, html body .onb-headline, html body .tm-h,
html body [class*="-title"]:not(p):not(span[class*="sub"]),
html body [class*="headline"]:not(p),
html body .pn-rz-word,
html body .pn-rz-brandrow .bn,
html body .pn-review .rv-fork-h,
html body #pn-walkin .wi-h,
html body .pnp2-seal b, html body .pnp2-seal i,
html body .pn-stgseal-n, html body .pn-stgseal-t i{
  font-family: var(--pn-type-face) !important;
}
/* the cabinet face is upright and tighter than the face it replaces — the old one was set with a
   skew and loose tracking that now reads as a different system, so the tracking comes with it */
html body .pn-rz-word,
html body .pn-fwin .bop-hero-v,
html body .pn-fwin .bop-ask{ letter-spacing:-.03em !important; font-style:normal !important; }
/* CEO 2026-09-19 ("these numbers use old typography"): the brief's two hero figures and its ask
   are in-game HEADLINES and carry the hero weight (§5g, "Performance is Everything" = 900); they
   were sitting at 700/800, which read as a third, older face beside the office hero. */
html body .pn-fwin .bop-hero-v,
html body .pn-fwin .bop-ask{ font-weight:900 !important; }

/* ── 2 · THE PITCH WINDOW READS IN BOTH THEMES ─────────────────────────────────────────────── */
html body #pnp2-beat .pnp2-win{
  --p2w-ink:#EEF3FB; --p2w-dim:#AEB8C7; --p2w-hair:rgba(255,255,255,.16); --p2w-acc:#F97316;
}
html body #pnp2-beat .pnp2-win.lg-light{
  --p2w-ink:#1B1A17; --p2w-dim:#5E574C; --p2w-hair:rgba(27,26,23,.16); --p2w-acc:#B4380D;
}
/* the step rail: the stage you are ON takes the accent, the rest take the window's own dim ink —
   never a pale-glass blue on cream (measured 1.79:1) */
html body #pnp2-beat .pnp2-steps b{ color:var(--p2w-dim) !important; opacity:1 !important; }
html body #pnp2-beat .pnp2-steps b i{ opacity:1 !important; color:inherit !important; }
html body #pnp2-beat .pnp2-steps b::before{ background:currentColor !important; opacity:.3 !important; }
html body #pnp2-beat .pnp2-steps b.done{ opacity:1 !important; color:var(--p2w-dim) !important; }
html body #pnp2-beat .pnp2-steps b.on,
html body #pnp2-beat .pnp2-steps b.on[data-stg]{ color:var(--p2w-acc) !important; }
html body #pnp2-beat .pnp2-steps b.on::before{ opacity:1 !important; }
/* the case seal + strip take the window's ink */
html body #pnp2-beat .pnp2-seal b{ color:var(--p2w-acc) !important; }
html body #pnp2-beat .pnp2-seal i{ color:var(--p2w-dim) !important; }
html body #pnp2-beat .pnp2-casestrip{ color:var(--p2w-dim) !important; }
html body #pnp2-beat .pnp2-casestrip .nm{ color:var(--p2w-ink) !important; }

/* THE BRIEF HERO — type over a photograph gets a real ground (UX_RULES §1: ink is never assumed
   over media). `.pnp2-hero` already carried a ::before wash and a .3 multiply, and the brand still
   rendered as a ghost across a latte highlight in the CEO's own screenshot and in mine. The wash is
   DIRECTIONAL now — heavy where the type sits (left), clear where the photograph earns its place
   (right) — which is the same treatment the call room's name-plate and the verdict's sector plate
   already use, so the three heroes finally read as one system. */
html body #pnp2-beat .pnp2-hero::before{
  background:linear-gradient(90deg, rgba(6,9,14,.92) 0%, rgba(6,9,14,.82) 42%, rgba(6,9,14,.34) 72%, rgba(6,9,14,.12) 100%) !important;
}
html body #pnp2-beat .pnp2-hero .pnp2-hd,
html body #pnp2-beat .pnp2-heroid .mono,
html body #pnp2-beat .pnp2-heroid span{ text-shadow:0 2px 16px rgba(0,0,0,.85), 0 0 3px rgba(0,0,0,.5); }
html body #pnp2-beat .pnp2-hero .pnp2-hd{ color:#FFFFFF !important; }

/* ── 3 · THE 44px FLOOR ────────────────────────────────────────────────────────────────────── */
/* the pills stay the size they look; the TARGET is 44 via transparent padding + a positive
   click area, so nothing about the composition changes and a thumb still lands */
html body #pnp2-beat .pnp2-ctrl{
  min-height:44px !important; padding-top:0 !important; padding-bottom:0 !important;
  display:inline-flex !important; align-items:center !important;
}
@media (max-width:560px){
  html body #pnp2-beat .pnp2-ctrl{ min-height:44px !important; }
}
html body .pn-review .rv-why{ min-height:44px !important; }
html body .pn-review .rv-dock .pn-btn,
html body .pn-review .rv-dock button{ min-height:44px !important; }
html body .pn-callroom .pn-dock-ctrl{ min-height:44px !important; height:44px !important; }
html body .pn-callroom .pn-call-dock .pn-btn{ min-height:44px !important; }
html body #pnfcRankChip.pnfc-board-btn{ min-height:44px !important; }

/* ── 4 · THE FLOOR HERO — the accent word keeps its own ground ─────────────────────────────── */
/* measured at 390 dark: the headline sits over the agency-floor film, and the accent word
   (`rgb(255,138,79)`) landed on a warm highlight at 1.97:1. The headline gets the scrim it was
   always assuming.
   CEO 2026-09-17 ("whats with the weird shadows- is this you fucking up Light/Dark treatment
   again?"): yes — this shadow was measured and tuned against the DARK theme's photo backdrop
   only, and shipped with no theme guard, so it also fired in the light theme, where the
   backdrop is a pale cream photo — a near-black text-shadow there just reads as a dirty halo
   behind the accent word, not a legibility aid. Scoped to dark; the light theme's own headline
   already clears contrast without it (pn-collections.css §3d gives it a deep --p2 there). */
body:not(.mvc-light) .pn-vibe-row .perf-hero-h1{ text-shadow:0 2px 18px rgba(4,7,12,.82), 0 0 42px rgba(4,7,12,.6); }
body:not(.mvc-light) .pn-vibe-row .mvc-hero-accent{ text-shadow:0 2px 18px rgba(4,7,12,.9), 0 0 42px rgba(4,7,12,.7); }

/* ── 5 · THE DISPLAY TOKEN ITSELF — the last place the retired face was hiding ───────────────
   `--pn-disp` (pn-system.css) is `var(--mvc-disp)`, and `mvc-os.css` redeclares
   `--mvc-disp:'Space Grotesk'` NINE TIMES — once inside every palette scope. The 13 Sep numerals
   sheet re-pointed it on `html[data-theme][data-palette]`, which wins on :root — but a custom
   property resolves from the NEAREST ancestor that declares it, so any palette scope lower in the
   tree (or equal-specificity-but-later) hands 'Space Grotesk' straight back to its descendants.
   That is why the coin chip, the week chip and the brief's own h2 were still painting it after
   §1 above re-pointed fourteen selectors by name.
   A custom property accepts `!important`, and the 12 Sep ruling is exactly that absolute: ONE
   headline face, game-wide. Declared on every scope that could carry it. */
html, body,
html[data-theme], html[data-palette], body[data-theme], body[data-palette],
:root[data-theme][data-palette]{
  --mvc-disp: var(--pn-type-face) !important;
  --pn-disp: var(--pn-type-face) !important;
  --pn-display: var(--pn-type-face) !important;
  --display: var(--pn-type-face) !important;
}
/* the brief's own headings live in `.pnp2-win`, not `.pn-fwin` — §1's selector list was lifted
   from pn-final, which only ever named the war-room window */
html body #pnp2-beat .bop h2,
html body #pnp2-beat .bop h3,
html body #pnp2-beat .bop-lvl-name,
html body #pnp2-beat .pnp2-hd{ font-family: var(--pn-type-face) !important; }

/* ── 6 · THE SKIP / CLOSE PILLS STAND ON THEIR OWN GROUND ───────────────────────────────────
   Measured 3.81:1 — `#f2f6ff` over `rgba(6,9,14,.5)`, a half-transparent fill whose real ground
   is whatever the window is showing through it. A control's contrast cannot depend on what it
   happens to be floating over. Opaque per theme, measured. */
html body #pnp2-beat .pnp2-ctrl{
  background:#11151D !important; color:#F4F7FE !important;
  border-color:rgba(255,255,255,.34) !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
html body #pnp2-beat .pnp2-win.lg-light .pnp2-ctrl{
  background:#1B1A17 !important; color:#FFFFFF !important; border-color:rgba(27,26,23,.3) !important;
}
html body #pnp2-beat .pnp2-ctrl:hover{ background:#1B2230 !important; color:#FFB483 !important; border-color:#F97316 !important; }
html body #pnp2-beat .pnp2-win.lg-light .pnp2-ctrl:hover{ background:#2A2723 !important; color:#FFC9A6 !important; }

/* ── 7 · THE BEAT'S OWN LABELS ─────────────────────────────────────────────────────────────
   The eyebrow, the rule caption and the term keys measured 3.41–4.01:1 in light (`#746c64`-ish
   on cream) and the seal 3.14:1 in dark. All just under, all fixed by taking the window's own
   ink tokens instead of a hand-picked grey. */
html body #pnp2-beat .pnp2-ey{ color:var(--p2w-acc) !important; }
html body #pnp2-beat .pnp2-rule i,
html body #pnp2-beat .pnp2-term-k,
html body #pnp2-beat .pnp2-terms b,
html body #pnp2-beat .pnp2-note,
html body #pnp2-beat .pnp2-copy{ color:var(--p2w-ink) !important; opacity:1 !important; }
html body #pnp2-beat .pnp2-rule i{ opacity:.78 !important; }
html body #pnp2-beat .pnp2-win.lg-light .pnp2-steps b{ color:#5E574C !important; }
html body #pnp2-beat .pnp2-win.lg-light .pnp2-steps b.on{ color:#B4380D !important; }

/* ── 8 · THE NUMERAL TOKEN — the 13 Sep ruling's own last mile ──────────────────────────────
   CEO, 13 Sep: "replace the numbers with the same font as the new headlines." That pass added the
   numeral TIERS (pn-type-numerals-20260913.css) but `_before.css` also defines `--num: SG,…` —
   the retired face — and the floor chrome's coin and week chips read it. Measured: the masthead's
   `120` and `W1` were still painting SG while the figure beside them painted the cabinet face. */
html, body,
html[data-theme], html[data-palette], body[data-theme], body[data-palette],
:root[data-theme][data-palette]{
  --num: var(--pn-type-face) !important;
}
/* the brief's ask line is `.pnp2-ask-line` — not an h2, not `.bop-ask`, so §1's list (lifted from
   pn-final, which only ever knew the war-room window) never reached it. Probed, not guessed. */
html body #pnp2-beat .pnp2-ask,
html body #pnp2-beat .pnp2-ask-line,
html body #pnp2-beat .bop-ask,
html body #pnp2-beat .bop-hero-v{ font-family: var(--pn-type-face) !important; }

/* ── 9 · "OPEN THE WORK" CTA — pinned ink (CEO 14 Sep: "Button illegible", campaign/pipeline
   board, "Open the work →" reading as a muted orange near-match on its own orange fill).
   `.camp-card .camp-foot button.primary` is the OLDER pre-pn-btn markup (script-01.js
   campaignCard()) — pn-final-20260820.css's `html body button.primary{color:#14060D!important}`
   should already win this, and no sheet between it and here overrides `.camp-foot`/`button.primary`
   by class. Root cause not pinned down in the time available; pinned here at the end of the
   cascade instead of left illegible while that is chased down — same tactic as the arcade tile
   ink fix two shifts ago. Full opacity forced too, in case the true cause is a translucency rather
   than a colour override. */
html body .camp-foot button.primary,
html body .camp-card button.primary{
  background: var(--accent,#f97316) !important;
  color: #14060D !important;
  opacity: 1 !important;
  filter: none !important;
}

/* ── 8 · JUST PITCH IT IN GOLD (CEO 2026-09-26: "colour the Just Pitch It button a different
   palette colour"). §6 above paints every set-piece pill #11151D at this same specificity, so the
   fast pill needs its own class in the selector to win. House gold, near-black ink (12.1:1). */
html body #pnp2-beat .pnp2-ctrl.pnp2-ctrl--fast,
html body #pnp2-beat .pnp2-win.lg-light .pnp2-ctrl.pnp2-ctrl--fast{
  background:#F2C94C !important; color:#1A1102 !important; border-color:#C99A22 !important;
}
html body #pnp2-beat .pnp2-ctrl.pnp2-ctrl--fast:hover{ background:#F7D774 !important; color:#1A1102 !important; border-color:#1A1102 !important; }