/* Step 4 quantitative-risk report — Peraspera/Carbon skin.
   Scoped to assessment_step4_planning.html AND (since Phase 15,
   RESULTS-01/02) assessment_step4_results.html + its
   partials/assessment_step4_results_*.html tab partials — both loaded via
   {% block extra_head %}. Steps 1-3 stay on design-system.css's Carbon G10
   LIGHT theme (correction, Phase 15-04 QA: an earlier version of this
   comment called design-system.css "the old dark" theme — it is not;
   design-system.css is `color-scheme: light` (Carbon Gray 10, `--m-navy:
   #f4f4f4`). Do not reuse that stale claim as a reason to skip verifying
   chrome color in a real browser.) */

/* Wizard shell chrome (.m-wizard-content/.m-wizard-footer, defined in
   design-system.css) is LIGHT by default (`--m-navy: #f4f4f4`) — it is NOT
   overridden by loading this file's --surface-bg/--text-primary tokens,
   since those are different custom properties. Without this override the
   .pa-* cards below render dark on a light backdrop instead of a fully
   dark page (found in Plan 15-04's human-verify checkpoint: "dark theme
   did not apply"). Scoped here (not in design-system.css) so Steps 1-3,
   which never load this file, are untouched. */
.m-wizard-content{background:var(--surface-bg);color:var(--text-primary)}
.m-wizard-footer{background:var(--surface-bg);border-top-color:var(--border-subtle)}
.m-wizard-footer a{color:var(--text-secondary)}
/* Top app bar (logo + logout icon, partials/wizard_header.html) is shared
   across every wizard page and stays light everywhere else — darkened here
   only, so Steps 1-3 (which never load this file) keep the untouched
   Carbon-light header. The logout icon button itself still renders as a
   solid Carbon-blue square (same button:not(.ghost) cascade issue as the
   tabs above) — that bug is app-wide, pre-existing, and out of this plan's
   scope to fix; flagged separately rather than patched here. */
.m-app-header{background:var(--surface-bg);border-bottom-color:var(--border-subtle)}
.m-app-header__name{color:var(--text-primary)}
/* Catch-all: body.m-wizard-shell itself is still var(--m-navy) (light) —
   a flexbox gap between the fixed-height header and the flex:1 main
   content area otherwise lets that light body color peek through as a
   thin strip. */
.m-wizard-shell{background:var(--surface-bg)}

/* Phase 15-04 QA follow-up: design-system.css's Carbon-light theme defines
   several BARE element selectors (button, thead th, thead tr, tbody tr)
   with `!important`. `!important` always outranks a normal declaration
   regardless of selector specificity, so any .pa-* rule below that shares
   an element with one of those bare selectors gets silently clobbered
   unless it also uses `!important` (and, for `button`, also has enough
   specificity — see .pa-results-tab below). This is why the tab bar
   rendered as solid Carbon-blue buttons and table headers kept the light
   theme's muted-gray text despite the dark background already applying:
   only the background properties happened to be set on elements
   design-system.css's !important rules don't target directly (tr, not
   the th/td inside it). */
.pa-table thead th{background:var(--surface-layer-01) !important;font-family:var(--font-mono) !important;font-size:11px !important;font-weight:600 !important;letter-spacing:.08em !important;text-transform:uppercase !important;color:var(--text-secondary) !important;text-align:left !important;padding:var(--spacing-03) var(--spacing-04) !important;border-bottom:1px solid var(--border-subtle) !important}
.pa-heatmap-wrap th,.pa-heatmap-wrap td{padding:var(--spacing-02) var(--spacing-03) !important;border-bottom:1px solid var(--border-subtle) !important;color:var(--text-primary) !important;font-family:inherit !important;font-size:13px !important;font-weight:400 !important;letter-spacing:normal !important;text-transform:none !important}

/* `button:not(.secondary):not(.outline):not(.contrast):not(.ghost)`
   (design-system.css) has specificity (0,4,1) — a plain class like
   `.pa-results-tab` (0,1,0) can never outrank that even with `!important`,
   since specificity is compared before importance breaks ties. Adding the
   `ghost` class (see assessment_step4_results.html) excludes the tab
   buttons from that selector entirely; `button.pa-results-tab` (0,1,1)
   then ties button.ghost's own !important rules and wins on source order
   (this file loads after design-system.css). */
/* 2026-08-31 mockup-fidelity audit: `Assessment Results.dc.html`'s tabs are
   plain sans-serif body-compact text with 12px/20px padding — NOT the
   uppercase mono treatment this rule previously applied. */
button.pa-results-tab{font-family:var(--font-sans) !important;font-size:var(--type-body-compact-01) !important;font-weight:400 !important;letter-spacing:normal;text-transform:none;cursor:pointer;height:auto !important;padding:12px 20px !important;color:var(--text-secondary) !important;background:none !important;border:none !important;border-bottom:2px solid transparent !important;border-radius:0 !important}
/* --interactive (blue), not --danger (red): matches the existing
   .pa-tab.is-active precedent above and CLAUDE.md's design rule that red
   is reserved for threat/loss values, never navigation state. Confirmed
   against the canonical Assessment Results mockup (Claude Design project
   db6efb4a-f12c-44b8-a795-46d16ec5a2ad) — its active-tab underline is
   blue, not red. Plan 15-01/15-04 used --danger here; that was a bug. */
button.pa-results-tab.is-active{color:var(--text-primary) !important;border-bottom-color:var(--interactive) !important}
button.pa-results-tab:hover{color:var(--text-primary) !important;background:none !important}
/* Pico gives every clicked button a persistent focus ring, which reads as a
   blue BOX around the tab and hides the mockup's underline-only active state.
   Suppressed for mouse focus; :focus-visible keeps a real ring for keyboard
   users. */
button.pa-results-tab:focus{outline:none !important;box-shadow:none !important}
button.pa-results-tab:focus-visible{outline:2px solid var(--interactive) !important;outline-offset:-2px}

.pa-report{font-family:var(--font-sans);color:var(--text-primary)}
.pa-report *{box-sizing:border-box}

.pa-report__title{font-size:var(--type-heading-04);font-weight:var(--fw-semibold);color:var(--text-primary);margin-bottom:var(--spacing-01)}
.pa-report__subtitle{font-size:var(--type-body-01);color:var(--text-secondary)}

.pa-report__header{display:flex;align-items:baseline;gap:var(--spacing-04);flex-wrap:wrap;margin-bottom:var(--spacing-03)}
.pa-report__section-title{font-size:1rem;font-weight:var(--fw-semibold);color:var(--text-primary)}
.pa-report__meta{font-family:var(--font-mono);font-size:10px;color:var(--text-secondary);letter-spacing:.1em}

/* KPI strip */
.pa-kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-04);margin-bottom:var(--spacing-06)}
@media (max-width:900px){.pa-kpi-grid{grid-template-columns:repeat(2,1fr)}}
.pa-kpi-card{background:var(--surface-layer-02);border:1px solid var(--border-subtle);padding:var(--spacing-05) var(--spacing-06)}
.pa-kpi-card__head{display:flex;align-items:center;gap:var(--spacing-03);margin-bottom:var(--spacing-03)}
.pa-kpi-card__label{font-family:var(--font-mono);font-size:11px;color:var(--text-secondary);letter-spacing:.1em;flex:1}
/* 2026-08-31 audit: sizes/colours below now match `Assessment Results.dc.html`
   exactly — heading-03 value (was an ad-hoc 26px), square chips (was
   radius-lg), and the mockup's own chip fills (gray-100/white for the P90
   tail, blue-10/interactive for the P10 safe side). */
.pa-kpi-card__value{font-family:var(--font-mono);font-size:var(--type-heading-03);font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-03)}
.pa-kpi-card__value--danger{color:var(--support-error)}
.pa-kpi-card__note{font-size:var(--type-caption-01);color:var(--text-secondary);line-height:1.5}
.pa-kpi-card__pct{font-family:var(--font-mono);font-size:var(--type-caption-01);font-weight:700;padding:2px 8px;border-radius:0}
.pa-kpi-card__pct--tail{background:var(--pa-gray-100);color:var(--pa-white)}
.pa-kpi-card__pct--safe{background:var(--pa-blue-10);color:var(--interactive)}

/* Main grid: LEC + side panel */
.pa-report-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:var(--spacing-05);margin-bottom:var(--spacing-05);align-items:start}
@media (max-width:900px){.pa-report-grid{grid-template-columns:1fr}}
.pa-card{background:var(--surface-layer-02);border:1px solid var(--border-subtle);padding:var(--spacing-06)}

.pa-tabs{display:flex;align-items:center;gap:var(--spacing-06);margin-bottom:var(--spacing-05);border-bottom:1px solid var(--border-subtle)}
.pa-tab{font-family:var(--font-mono);font-size:12px;font-weight:700;cursor:pointer;padding-bottom:10px;color:var(--text-secondary);border-bottom:2px solid transparent;background:none;border-left:none;border-right:none;border-top:none;margin:0}
.pa-tab.is-active{color:var(--interactive);border-bottom-color:var(--interactive)}

.pa-lec-note{font-size:14px;color:var(--text-secondary);margin-bottom:var(--spacing-04)}

/* SLE / ROSI bars */
.pa-bar-row{margin-bottom:var(--spacing-04)}
.pa-bar-row:last-child{margin-bottom:0}
.pa-bar-row__head{display:flex;justify-content:space-between;font-size:12px;color:var(--text-primary);font-weight:600;margin-bottom:5px}
.pa-bar-row__head--muted{color:var(--text-secondary);font-weight:400}
.pa-bar-row__value{font-family:var(--font-mono)}
.pa-bar-track{height:6px;background:var(--surface-layer-01)}
.pa-bar-fill{height:100%}

/* Side panel */
.pa-side-label{font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--text-secondary);margin-bottom:var(--spacing-02)}
.pa-side-note{font-size:11px;color:var(--text-secondary);margin-bottom:var(--spacing-05)}
.pa-side-block{margin-top:var(--spacing-06)}
.pa-side-empty{font-size:12px;color:var(--text-secondary);font-style:italic}

.pa-risk-badge{display:inline-flex;align-items:center;font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--pa-white);padding:2px 10px;border-radius:var(--radius-lg)}
.pa-risk-badge--critical{background:var(--risk-critical)}
.pa-risk-badge--high{background:var(--risk-high)}
.pa-risk-badge--medium{background:var(--risk-medium);color:var(--pa-gray-100)}
.pa-risk-badge--low{background:var(--risk-low)}

/* Tables (light Carbon-style — header fill, no row fill, bottom rules) */
.pa-table{width:100%;border-collapse:collapse}
.pa-table thead th{background:var(--surface-layer-01);font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary);text-align:left;padding:var(--spacing-03) var(--spacing-04);border-bottom:1px solid var(--border-subtle)}
.pa-table thead th.num,.pa-table tbody td.num{text-align:right}
.pa-table tbody td{padding:var(--spacing-03) var(--spacing-04);font-size:13px;color:var(--text-primary);background:var(--surface-layer-02);border-bottom:1px solid var(--border-subtle);font-variant-numeric:tabular-nums}
.pa-table tbody tr:last-child td{border-bottom:none}

.pa-table-card{background:var(--surface-layer-02);border:1px solid var(--border-subtle);margin-bottom:var(--spacing-05)}
.pa-table-card__head{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-04) var(--spacing-06);border-bottom:1px solid var(--border-subtle)}
.pa-table-card__title{font-size:14px;font-weight:600;color:var(--text-primary)}
.pa-table-card__body{padding:0 var(--spacing-02) var(--spacing-03)}

.pa-stub-card{border:1px dashed var(--border-strong);padding:var(--spacing-05) var(--spacing-06);color:var(--text-secondary);font-size:12px;line-height:1.5}
.pa-stub-card strong{color:var(--text-primary)}

/* Bottom grid: composition + Gordon-Loeb banner */
.pa-bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-05);margin-bottom:var(--spacing-06)}
@media (max-width:900px){.pa-bottom-grid{grid-template-columns:1fr}}

.pa-composition-row{display:flex;align-items:center;gap:var(--spacing-04)}
.pa-composition-row+.pa-composition-row{margin-top:var(--spacing-03)}
.pa-composition-dot{width:8px;height:8px;flex-shrink:0}
/* Mockup pairs an error-red dot with a warning-amber one, not two risk-band
   colours — the dot marks which scenario dominates the portfolio's median
   loss, so it stays on the support-* semantic scale like the value beside it. */
.pa-composition-dot--high{background:var(--support-error)}
.pa-composition-dot--low{background:var(--support-warning)}
.pa-composition-label{font-size:12px;color:var(--text-secondary);flex:1}
.pa-composition-value{font-family:var(--font-mono);font-size:11px;font-weight:600}
.pa-composition-value--low{color:var(--support-success)}
.pa-composition-value--high{color:var(--support-error)}

.pa-warning-banner{display:flex;align-items:flex-start;gap:var(--spacing-04);border-left:3px solid var(--support-warning);background:var(--surface-layer-02);padding:var(--spacing-04)}
.pa-warning-banner--ok{border-left-color:var(--support-success);background:var(--surface-layer-02)}
.pa-warning-banner__icon{flex-shrink:0;margin-top:1px}
.pa-warning-banner__title{font-size:var(--type-body-compact-01);font-weight:600;color:var(--text-primary)}
.pa-warning-banner__body{font-size:var(--type-body-compact-01);color:var(--text-secondary)}
/* The "why every number is zero" banner (2026-09-02) sits above the KPI row
   rather than inside the bottom grid, so it needs its own spacing. Informational
   blue, not the warning amber: the report is correct, it just needs explaining. */
.pa-freq-banner{margin-bottom:var(--spacing-05);border-left-color:var(--interactive)}
.pa-freq-banner .pa-warning-banner__body{line-height:1.5;margin-top:2px}
.pa-freq-banner strong{color:var(--text-primary);font-weight:600}

/* M4 extortion cards */
.pa-extortion-card{margin-bottom:var(--spacing-05)}
.pa-extortion-card__agent{font-size:14px;color:var(--text-primary);margin-top:var(--spacing-01)}

/* XPARENT-01 (11-CONTEXT.md D-01..D-04): methodology <details> disclosure
   cards on Step 4's KPI/LEC/per-scenario outputs. Native <details>/<summary>
   only — zero JS (D-02). */
.pa-methodology-card{margin-top:var(--spacing-04)}
.pa-methodology-card summary{font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--text-secondary);cursor:pointer;overflow-wrap:break-word}
.pa-methodology-card summary:hover{background:var(--surface-layer-01)}
.pa-methodology-card__formula{font-size:14px;color:var(--text-primary);line-height:1.5;margin:var(--spacing-03) 0}
.pa-methodology-card__values{display:grid;grid-template-columns:1fr auto;gap:var(--spacing-03);margin:var(--spacing-04) 0}
.pa-methodology-card__value-key{font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary)}
.pa-methodology-card__value-num{font-family:var(--font-mono);font-size:16px;font-weight:700;color:var(--support-error);font-variant-numeric:tabular-nums;text-align:right}
.pa-methodology-card__timestamp{font-size:11px;color:var(--text-helper);margin-top:var(--spacing-04);border-top:1px solid var(--border-subtle);padding-top:var(--spacing-03)}

/* Assessment Results dashboard tab bar — assessment_step4_results.html's
   3-tab nav (Maturity vs ATT&CK / Risk Posture / Improvement Modeler).
   2026-08-31: gap removed and the loading indicator pushed to the far right,
   per the mockup's own flush tab row. */
.pa-results-tabbar{display:flex;align-items:center;border-bottom:1px solid var(--border-subtle);margin-bottom:20px}
.pa-results-tabbar__loading{margin-left:auto;font-family:var(--font-mono);font-size:11px;color:var(--text-secondary)}
/* .pa-results-tab's actual styling lives earlier in this file as
   button.pa-results-tab{...!important} — see the comment there for why
   the plain-class version above the fold couldn't win against
   design-system.css's button selector. */

/* ---------------------------------------------------------------------------
   2026-08-31 mockup-fidelity audit — `Assessment Results.dc.html`.
   Page header, and the two rebuilt tabs (Maturity vs ATT&CK, Risk Posture).
   Every value below is read off that mockup's own inline styles; the design
   tokens referenced are the ones it references.
   --------------------------------------------------------------------------- */

/* `.m-wizard-content__inner` is full-bleed for every wizard page as of the
   2026-08-31 batch review, so this only adjusts the mockup's slightly tighter
   top padding on this one screen. */
.pa-results-page{padding:20px 32px 32px}
.pa-results-breadcrumb{display:block;font-size:var(--type-caption-01);color:var(--text-secondary);margin-bottom:10px;text-decoration:none}
.pa-results-breadcrumb:hover{color:var(--text-primary)}
.pa-results-titlebar{display:flex;align-items:baseline;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.pa-results-titlebar__name{font-size:var(--type-heading-03);font-weight:600;color:var(--text-primary)}
.pa-results-titlebar__meta{font-family:var(--font-mono);font-size:var(--type-caption-01);color:var(--text-helper)}
.pa-results-titlebar__action{font-size:var(--type-body-compact-01);color:var(--link-primary);text-decoration:none}

/* RiskBadge (dot + label) — the design system's own component, rebuilt with
   the same dot-plus-label anatomy Section Home's `.m-risk-badge` already uses,
   in this page's peraspera token vocabulary. */
.pa-risk-dot-badge{display:inline-flex;align-items:center;gap:8px}
.pa-risk-dot{width:8px;height:8px;border-radius:50% !important;flex:none}
.pa-risk-dot-badge__label{font-size:var(--type-body-compact-01);font-weight:600;color:var(--text-primary)}
.pa-risk-dot--critical{background:var(--risk-critical)}
.pa-risk-dot--high{background:var(--risk-high)}
.pa-risk-dot--medium{background:var(--risk-medium)}
.pa-risk-dot--low{background:var(--risk-low)}
.pa-risk-dot--minimal{background:var(--risk-minimal)}
.pa-risk-dot--draft{background:var(--text-helper)}

/* Shared 4-tier coverage banding (frac >= .66/.45/.30, ported from the
   mockup's own `riskColor` JS) — used by both the kill-chain heat rows and
   the tactic/technique accordion. */
.pa-risk-fill--minimal{background:var(--risk-minimal)}
.pa-risk-fill--low{background:var(--risk-low)}
.pa-risk-fill--medium{background:var(--risk-medium)}
.pa-risk-fill--high{background:var(--risk-high)}
.pa-risk-fg--minimal{color:var(--risk-minimal)}
.pa-risk-fg--low{color:var(--risk-low)}
.pa-risk-fg--medium{color:var(--risk-medium)}
.pa-risk-fg--high{color:var(--risk-high)}

.pa-mono-note{font-family:var(--font-mono);font-size:var(--type-caption-01);color:var(--text-helper)}
.pa-mono-note--wide{letter-spacing:.1em}
.pa-panel-title{font-family:var(--font-mono);font-size:var(--type-caption-01);font-weight:700;margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid var(--border-subtle);color:var(--text-primary)}

/* --- Maturity vs ATT&CK tab --- */
.pa-attack-top{display:flex;flex-wrap:wrap;gap:24px;align-items:start;margin-bottom:28px}
.pa-heat-card{flex:1 1 460px;min-width:0;border:1px solid var(--border-subtle)}
.pa-heat-card__head{padding:14px 18px;border-bottom:1px solid var(--border-subtle);display:flex;justify-content:space-between;align-items:baseline;gap:var(--spacing-04)}
.pa-heat-card__title{font-size:var(--type-body-01);font-weight:600;color:var(--text-primary)}
.pa-heat-card__body{padding:18px;display:flex;flex-direction:column;gap:10px}
.pa-heat-row{display:grid;grid-template-columns:150px minmax(0,1fr) 70px;gap:14px;align-items:center}
.pa-heat-row__label{font-size:var(--type-caption-01);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text-secondary)}
.pa-heat-row__track{height:20px;border:1px solid var(--border-subtle);background:var(--surface-layer-02)}
.pa-heat-row__fill{height:100%}
.pa-heat-row__pct{font-family:var(--font-mono);font-size:var(--type-caption-01);text-align:right}

.pa-weak-card{flex:1 1 250px;max-width:340px;border:1px solid var(--border-subtle);padding:20px}
.pa-weak-card__title{font-size:var(--type-caption-01);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:14px}
.pa-weak-list{display:flex;flex-direction:column;gap:12px}
.pa-weak-item__label{font-size:var(--type-body-compact-01);color:var(--text-primary)}
.pa-weak-item__note{font-size:var(--type-caption-01);color:var(--text-helper);margin-top:2px}

.pa-attack-heading{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.pa-attack-heading__title{font-size:var(--type-heading-02);font-weight:600;color:var(--text-primary)}
.pa-attack-gaps{font-family:var(--font-mono);font-size:var(--type-caption-01);margin:8px 0 14px}
.pa-attack-gaps--warn{color:var(--support-warning)}
.pa-attack-gaps--ok{color:var(--brand-accent)}

.pa-tactic-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}
@media (max-width:900px){.pa-tactic-grid{grid-template-columns:1fr}}
.pa-tactic{border:1px solid var(--border-subtle)}
/* <details>/<summary> gives the accordion with zero JS (same choice Step 3's
   heatmap made). The default disclosure triangle is suppressed so the
   mockup's own ▼/▲ chevron on the right is the only affordance. */
/* Pico draws its own accordion chevron as `details > summary::after` (an
   empty-content box with a background-image), which paints as a stray "›"
   right-aligned below this card's own header row. Suppressing the UA marker
   alone does not touch it — the `::after` has to be removed explicitly. Same
   class of bare-element collision this codebase keeps hitting (see the
   button/border-radius/topbar-padding cases in the audit notes). */
.pa-tactic>summary{cursor:pointer;display:block;list-style:none;margin:0;padding:0}
.pa-tactic>summary::-webkit-details-marker{display:none}
.pa-tactic>summary::after{display:none !important}
.pa-tactic[open]>summary{margin-bottom:0}
.pa-tactic__summary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;padding:12px 18px}
.pa-tactic__main{min-width:0}
.pa-tactic__label{font-size:var(--type-body-compact-01);color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pa-tactic__meta{font-family:var(--font-mono);font-size:var(--type-caption-01);color:var(--text-helper)}
.pa-tactic__right{display:flex;align-items:center;gap:14px;flex:none}
.pa-tactic__bar{width:72px;height:10px;border:1px solid var(--border-subtle);background:var(--surface-layer-02)}
.pa-tactic__fill{height:100%}
.pa-tactic__pct{width:48px;text-align:right;font-family:var(--font-mono);font-size:var(--type-body-compact-01)}
.pa-tactic__chevron{font-size:var(--type-caption-01);color:var(--text-secondary);width:14px;text-align:center}
.pa-tactic__chevron::before{content:"▼"}
.pa-tactic[open] .pa-tactic__chevron::before{content:"▲"}
.pa-tactic__body{border-top:1px solid var(--border-subtle)}
.pa-technique{display:grid;grid-template-columns:90px minmax(0,1fr) 80px 24px;gap:12px;align-items:center;padding:10px 18px;border-bottom:1px solid var(--border-subtle)}
.pa-technique:last-child{border-bottom:none}
.pa-technique__id{font-family:var(--font-mono);font-size:var(--type-caption-01);color:var(--text-helper)}
.pa-technique__name{font-size:var(--type-caption-01);color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pa-technique__pct{text-align:right;font-family:var(--font-mono);font-size:var(--type-caption-01)}
.pa-technique__gap{text-align:center;font-size:var(--type-caption-01);color:var(--support-warning)}

/* --- Risk Posture tab --- */
.pa-kpi-grid--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){.pa-kpi-grid--3{grid-template-columns:1fr}}
.pa-lec-card{display:flex;gap:24px}
@media (max-width:900px){.pa-lec-card{flex-direction:column}}
.pa-lec-card__chart{flex:6;min-width:0}
.pa-lec-card__modules{flex:4;min-width:0;border-left:1px solid var(--border-subtle);padding-left:24px}
@media (max-width:900px){.pa-lec-card__modules{border-left:none;padding-left:0}}
.pa-lec-card__legend{font-family:var(--font-mono);font-size:var(--type-caption-01);color:var(--text-helper);margin-top:var(--spacing-03)}
.pa-module-list{padding:6px 4px 2px;display:flex;flex-direction:column;gap:16px}
.pa-cvar-head{display:flex;align-items:center;gap:10px;margin-bottom:6px;flex-wrap:wrap}
.pa-table__ellipsis{display:inline-block;max-width:32ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}

/* DEAD as of the 2026-08-31 batch review: this was the dark-theme override
   for Step 3's heatmap partial while the Maturity vs ATT&CK tab embedded it.
   That tab owns its own markup now, and the Финансы tab that also used
   `.pa-heatmap-wrap` was removed. Kept only because `.pa-heatmap-wrap` is a
   scoped selector matching nothing else — delete on the next CSS sweep. */
.pa-heatmap-wrap{color:var(--text-primary)}
.pa-heatmap-wrap h2{color:var(--text-primary);font-size:var(--type-heading-03)}
.pa-heatmap-wrap .m-mono{font-family:var(--font-mono);color:var(--text-secondary)}
.pa-heatmap-wrap details{border:1px solid var(--border-subtle);background:var(--surface-layer-02);margin-bottom:var(--spacing-03);padding:var(--spacing-03) var(--spacing-04)}
.pa-heatmap-wrap summary{color:var(--text-primary);cursor:pointer}
.pa-heatmap-wrap table{width:100%;border-collapse:collapse;margin-top:var(--spacing-03)}
.pa-heatmap-wrap th,.pa-heatmap-wrap td{padding:var(--spacing-02) var(--spacing-03);border-bottom:1px solid var(--border-subtle);color:var(--text-primary)}