/* ============================================================================================
   PN FIN RUNWAY B — the hero runway chart on the Financials room's cobalt panel
   (CEO 2026-09-27, third ask: "the chart on this blue panel is STILL too weak").
   Markup is built by pn-fin-charts.js (upgradeRunway) at the panel's real pixel width.
   Owns: .pnrb* and the compact ledger inside .pnrb-host only. White ink on cobalt; no orange
   (orange is for actions); no serif; every text ≥12px and AA on the inset chart surface.

   Specificity: the room's cascade already carries 3-id `html:not(#…)` prefixes with !important
   (pn-tearsheet-modules). This file uses a 4-id prefix so it wins without fighting order.
   ============================================================================================ */

html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb{
  --pnrb-ink: #f8f9ff;
  --pnrb-ink2: rgba(236,241,255,.88);
  --pnrb-cyan: #a5ecff;
  --pnrb-red: #ff6b78;
  --pnrb-red-deep: #c42a3a;
  position: relative;
  margin: 6px 0 12px;
  padding: 14px 14px 10px;
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(5,12,48,.46) 0%, rgba(5,12,48,.30) 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.10), inset 0 1px 0 rgba(255,255,255,.10), 0 10px 30px -18px rgba(0,0,0,.6);
  color: var(--pnrb-ink);
  font-family: 'Inter', 'Instrument Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* ── legend chips ─────────────────────────────────────────────────────────────────────────── */
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-legend{
  display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 4px;
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-chip{
  display: inline-flex; align-items: center; gap: 7px;
  height: 26px; padding: 0 10px; border-radius: 999px;
  background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
  font: 600 12px/1 'Inter', system-ui, sans-serif; letter-spacing: .01em; color: var(--pnrb-ink2);
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-chip i{ display: block; width: 16px; height: 3px; border-radius: 2px; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-chip.is-act i{ background: linear-gradient(90deg, #fff, var(--pnrb-cyan)); height: 4px; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-chip.is-act.is-dot i{ width: 9px; height: 9px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 2px #7fdcff; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-chip.is-proj i{ background: repeating-linear-gradient(90deg, rgba(255,255,255,.85) 0 4px, transparent 4px 7px); height: 2px; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-chip.is-danger i{ width: 10px; height: 10px; border-radius: 3px; background: linear-gradient(180deg, rgba(255,107,120,.25), var(--pnrb-red)); }

/* ── plot ─────────────────────────────────────────────────────────────────────────────────── */
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-plot{
  position: relative; width: 100%; touch-action: pan-y; outline: none; border-radius: 8px;
  -webkit-tap-highlight-color: transparent; cursor: crosshair;
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-plot:focus-visible{ box-shadow: 0 0 0 2px rgba(165,236,255,.7); }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg{
  display: block; width: 100%; height: auto; overflow: visible; margin: 0 !important;
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-gl{ stroke: rgba(255,255,255,.12); stroke-width: 1; shape-rendering: crispEdges; opacity: 1; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-gl-v{ stroke: rgba(255,255,255,.07); }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-gl.is-zero{ stroke: rgba(255,255,255,.42); stroke-dasharray: none; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .c-lbl.pnrb-ax{
  font: 600 12px/1 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace !important;
  letter-spacing: 0 !important; text-transform: none !important;
  fill: rgba(236,241,255,.86) !important; font-variant-numeric: tabular-nums;
}

/* actual: thick gradient stroke (stroke set inline to its per-chart gradient) + glow underlay */
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .c-line.pnrb-line{
  fill: none; stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; opacity: 1;
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-line-glow{
  fill: none; stroke: #bff0ff; stroke-width: 10; stroke-linecap: round; stroke-linejoin: round; opacity: .22;
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-beads circle{ fill: #0f1f63; stroke: #e6f8ff; stroke-width: 2; }
/* projection: dashed, softer */
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .c-line.proj.pnrb-proj{
  fill: none; stroke: rgba(255,255,255,.78); stroke-width: 2.5; stroke-dasharray: 7 7; stroke-linecap: round; opacity: 1;
}

/* today: glow + pulse + dot */
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-now{ transform-box: fill-box; transform-origin: center; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-now-glow{ fill: #a5ecff; opacity: .7; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-now-dot{ fill: #ffffff; stroke: #7fdcff; stroke-width: 3; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-now-pulse{
  fill: none; stroke: #bff0ff; stroke-width: 2; transform-box: fill-box; transform-origin: center;
  animation: pnrb-pulse 2.2s cubic-bezier(.2,.6,.3,1) 1.2s infinite both;
}
@keyframes pnrb-pulse{
  0%   { transform: scale(1);   opacity: .85; }
  80%  { transform: scale(3.1); opacity: 0; }
  100% { transform: scale(3.1); opacity: 0; }
}

/* run-out marker */
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-mark{ transform-box: view-box; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-rule{ stroke: var(--pnrb-red); stroke-width: 2; stroke-dasharray: 3 4; stroke-linecap: round; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-mark-ring{ fill: rgba(255,107,120,.22); stroke: var(--pnrb-red); stroke-width: 2; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-mark-dot{ fill: #ffffff; }

/* crosshair */
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-xh{ opacity: 0; transition: opacity .12s; pointer-events: none; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-xh.is-on{ opacity: 1; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-xh line{ stroke: rgba(255,255,255,.55); stroke-width: 1; stroke-dasharray: 2 3; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-xh circle{ fill: #ffffff; stroke: #0f1f63; stroke-width: 2.5; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-xh.is-proj circle{ fill: #0f1f63; stroke: #ffffff; }

/* ── HTML overlays ────────────────────────────────────────────────────────────────────────── */
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-today{
  position: absolute; pointer-events: none; white-space: nowrap;
  display: flex; flex-direction: column; gap: 4px;
  text-shadow: 0 1px 12px rgba(5,12,48,.55);
  transition: opacity .15s;
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-plot.is-xh .pnrb-today{ opacity: 0 !important; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-now-k{
  font: 700 12px/1 'JetBrains Mono', ui-monospace, monospace !important; letter-spacing: .06em !important; text-transform: uppercase; color: var(--pnrb-cyan) !important;
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-now-v{
  font: 800 30px/1 'Inter', system-ui, sans-serif !important; letter-spacing: -.025em !important; color: #ffffff !important; font-variant-numeric: tabular-nums;
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-pill{
  position: absolute; pointer-events: none; white-space: nowrap;
  display: inline-flex; align-items: center; gap: 7px; height: 26px; padding: 0 11px 0 9px; border-radius: 999px;
  background: var(--pnrb-red-deep); color: #ffffff;
  box-shadow: 0 0 0 1px rgba(255,160,168,.55), 0 6px 18px -6px rgba(196,42,58,.9);
  font: 800 12px/1 'Inter', system-ui, sans-serif !important; letter-spacing: .06em !important; text-transform: uppercase;
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-pill i{ width: 7px; height: 7px; border-radius: 50%; background: #ffffff; box-shadow: 0 0 0 3px rgba(255,255,255,.25); }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-pill.is-safe{ background: rgba(255,255,255,.14); box-shadow: inset 0 0 0 1px rgba(255,255,255,.25); letter-spacing: .03em; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-tip{
  position: absolute; pointer-events: none; opacity: 0; transform: translateY(4px);
  transition: opacity .12s, transform .12s;
  padding: 8px 11px; border-radius: 9px; min-width: 110px;
  background: rgba(9,16,52,.94); box-shadow: 0 0 0 1px rgba(255,255,255,.16), 0 12px 28px -10px rgba(0,0,0,.7);
  display: flex; flex-direction: column; gap: 5px; white-space: nowrap;
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-tip.is-on{ opacity: 1; transform: none; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-tip-k{ font: 700 12px/1 'JetBrains Mono', ui-monospace, monospace !important; letter-spacing: .02em !important; text-transform: uppercase; color: rgba(214,226,255,.9) !important; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-tip-v{ font: 800 18px/1 'Inter', system-ui, sans-serif !important; letter-spacing: -.01em !important; color: #ffffff !important; font-variant-numeric: tabular-nums; }

html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-foot{
  margin: 8px 2px 0; font: 500 12px/1.45 'Inter', system-ui, sans-serif; color: rgba(236,241,255,.82);
}

/* ── the figure table below: compact 2-up tiles instead of a tall list ───────────────────── */
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-host .s1-ledger{
  display: grid !important; grid-template-columns: 1fr 1fr; gap: 0; margin-top: 4px !important;
  border-top: 1px solid rgba(255,255,255,.12);
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-host .s1-lrow{
  display: flex !important; flex-direction: column; align-items: flex-start !important; justify-content: flex-start !important;
  gap: 4px !important; padding: 9px 10px 9px 0 !important; min-width: 0;
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-host .s1-lrow:nth-child(even){ padding-left: 12px !important; border-left: 1px solid rgba(255,255,255,.12); }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-host .s1-lrow:last-child{ border-bottom: 0 !important; }
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-host .s1-lk{
  font: 500 12px/1.3 'Inter', system-ui, sans-serif !important; color: rgba(236,241,255,.84) !important; letter-spacing: 0 !important;
}
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-host .s1-lv{
  font-size: 17px !important; line-height: 1.1 !important; font-weight: 700 !important;
}
/* bible §5h.1: set BOTH color and -webkit-text-fill-color (the latter has hidden text twice) */
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb *,
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-host .s1-lk,
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-host .s1-lv{ -webkit-text-fill-color: currentColor !important; }

/* status inks on cobalt, lifted to AA: the room's shared --s1-bad coral (#ff6a55) measured 3.5:1 on
   this panel; the lighter coral below is 5.4:1. Amber (5.7:1) and green already pass. */
html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-host .s1-lv.s1-bad{ color: #ffa39a !important; }

@media (max-width: 520px){
  html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb{ padding: 12px 10px 8px; margin-left: -4px; margin-right: -4px; }
  html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-now-v{ font-size: 26px !important; }
  html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-host .s1-lv{ font-size: 15px !important; }
}

@media (prefers-reduced-motion: reduce){
  html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-svg .pnrb-now-pulse{ animation: none; opacity: .35; transform: scale(1.8); }
  html:not(#pnrb-a):not(#pnrb-b):not(#pnrb-c):not(#pnrb-d) body .pnrb-tip{ transition: none; }
}
