/**
 * NAM Permitting Cost Map (acf/nam-permitting-map).
 *
 * A full-bleed band (same .nam-sec/.bleed shell as the other NAM section blocks)
 * holding the headline boxes, the View/Show controls, the Mapbox card (map +
 * legend left, state panel + measure note right on wide screens), the "View all
 * states" / "How these figures are built" buttons with their modals, the optional
 * state-notes list, and the source line. Palette per the Analytics and
 * Insights handoff: NAM blue for chrome, a red ramp for the cost view and the
 * blue "relief" ramp for the BAAJA-removes measures. The `:not(#nam-x)` guards out-rank the theme's
 * global button/link rules inside .entry-content.
 */

.nam-sec--pmap {
  --pm-bg: #f6f7fa; --pm-surface: #fff; --pm-fg: #1d2433; --pm-muted: #5b6475; --pm-rule: #d9dee8;
  --pm-accent: var(--wdg-color-primary, #0032a0); --pm-accent-2: var(--wdg-color-secondary, #00a9e0); --pm-focus: #00a9e0;
  --pm-ramp-cost-lo: #fde8ea; --pm-ramp-cost-mid: #d8404f; --pm-ramp-cost-hi: #6e0b1f;
  --pm-ramp-gain-lo: #e3ebf8; --pm-ramp-gain-mid: none; --pm-ramp-gain-hi: #0a2a78;
  /* what BAAJA saves: the theme's blue gradient, secondary wash -> bright blue -> primary navy (the CTA-band colours) */
  --pm-ramp-relief-lo: var(--wdg-color-secondary-xlight, #cceef9); --pm-ramp-relief-mid: var(--wdg-color-secondary, #00a9e0); --pm-ramp-relief-hi: var(--wdg-color-primary, #0032a0);
  --pm-nodata: #e4e7ee;
  --pm-navy: var(--wdg-color-primary, #0032a0);   /* same navy as the site's other navy bands (.ns-band--navy, .tax-proof) */
  background: var(--pm-bg);
  color: var(--pm-fg);
  padding: 0 0 56px;   /* each band carries its own top padding (numbers band + map band) */
  font-size: 16px;
  line-height: 1.5;
}

/* Navy "numbers" band (owner, 5 Nov 2026, flow option B): heading, copy in two columns with the figures in <strong>,
   the four headline tiles on translucent white. Full width like the section itself. */
.nam-pmap__numbers { background: var(--pm-navy, #0b2a6b); color: #fff; padding: 52px 0 48px; margin-bottom: 44px; }
.nam-sec--pmap .nam-pmap__numbers h2.nam-pmap__nh { color: #fff; font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.1rem); font-weight: 700; max-width: 28ch; margin: 0 0 16px; }
.nam-pmap__numbers .nam-pmap__intro { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 8px 40px; max-width: none; margin: 0 0 28px; text-align: left; font-size: 1.05rem; line-height: 1.55; color: rgba(255, 255, 255, 0.92); }
.nam-pmap__numbers .nam-pmap__intro p { margin: 0 0 0.6em; }
.nam-pmap__numbers .nam-pmap__intro strong { color: var(--pm-accent-2); font-weight: 700; }
.nam-pmap__numbers .nam-pmap__intro a:not(#nam-x) { color: #fff; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, 0.5); text-underline-offset: 0.12em; }
.nam-pmap__numbers .nam-pmap__intro a:not(#nam-x):hover { text-decoration-color: #fff; }
.nam-pmap__numbers .nam-pmap__stat { background: rgba(255, 255, 255, 0.07); border-color: rgba(255, 255, 255, 0.18); }
.nam-pmap__numbers .nam-pmap__stat .v, .nam-pmap__numbers .nam-pmap__stat .sub .sv { color: #fff; }
.nam-pmap__numbers .nam-pmap__stat .k, .nam-pmap__numbers .nam-pmap__stat .s, .nam-pmap__numbers .nam-pmap__stat .sub .sk { color: rgba(255, 255, 255, 0.78); }
.nam-pmap__numbers .nam-pmap__stat .s a:not(#nam-x) { color: #fff; text-decoration: underline; }
.nam-pmap__numbers .nam-pmap__stat .sub { border-top-color: rgba(255, 255, 255, 0.25); }
.nam-pmap__numbers .nam-pmap__stat .split .bar { background: rgba(255, 255, 255, 0.12); }
.nam-pmap__numbers .nam-pmap__stat .split .leg { color: rgba(255, 255, 255, 0.78); }
.nam-pmap__numbers .nam-pmap__stat .split .leg b { color: #fff; }
.nam-pmap__numbers .nam-pmap__stat .split .bar--save .g1, .nam-pmap__numbers .nam-pmap__stat .split .leg--save .g1 { background: #fff; }

/* Map band head: heading with the intro stacked under it, CENTERED over the full-width card like the thesis above it
   (a left-capped head looked orphaned in the wide band; the earlier side-by-side layout put the heading's baseline
   against the bottom of a three-line paragraph; owner, 5 Nov 2026) */
.nam-pmap__maphead { max-width: 72ch; margin: 0 auto 28px; text-align: center; }
.nam-sec--pmap .nam-pmap__maphead h2.nam-pmap__mh { margin: 0 0 12px; font-size: clamp(1.5rem, 1.1rem + 1.2vw, 2rem); font-weight: 700; }
.nam-pmap__mapintro { font-size: 1.02rem; line-height: 1.55; color: var(--pm-fg); }
.nam-pmap__mapintro p { margin: 0 0 0.5em; font-size: inherit; line-height: inherit; }
.nam-pmap__mapintro p:last-child { margin-bottom: 0; }
/* Self-contained bleed: on a page with no other nam-sections block (the Permitting Reform issue page is this block + one
   custom-HTML block) nam-sections.css is not enqueued, so the band must carry its own full-width rules. */
.entry-content .nam-sec--pmap { margin-top: 0 !important; margin-bottom: 0 !important; }
.nam-sec--pmap.bleed { max-width: none !important; width: auto !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; }
.nam-sec--pmap[id] { scroll-margin-top: 150px; }
.editor-styles-wrapper .nam-sec--pmap.bleed { margin-left: 0 !important; margin-right: 0 !important; }
.nam-sec--pmap *, .nam-sec--pmap *::before, .nam-sec--pmap *::after { box-sizing: border-box; }
.nam-sec--pmap [hidden] { display: none !important; }
.nam-sec--pmap h2, .nam-sec--pmap h3, .nam-sec--pmap h4, .nam-sec--pmap p, .nam-sec--pmap dl, .nam-sec--pmap dt, .nam-sec--pmap dd, .nam-sec--pmap div, .nam-sec--pmap table, .nam-sec--pmap details { margin-block-start: 0; }
/* Headings take the theme's heading face, weight and sizes; only the colour is pinned to the brand primary. */
.nam-sec--pmap h2, .nam-sec--pmap h3, .nam-sec--pmap h4 { color: var(--pm-accent); font-family: var(--wdg-font-heading, inherit); line-height: 1.15; letter-spacing: normal; text-transform: none; }

/* Full width of the screen (the band is already full-bleed; the content follows it). */
.nam-pmap__wrap { max-width: none; margin: 0; padding: 0 32px; }
.nam-pmap__body { display: grid; gap: 28px; }
.nam-pmap__body > * { min-width: 0; }

/* intro copy (lives in the numbers band since 5 Nov 2026; the rules below are the fallback when the band is not rendered) */
.nam-pmap__intro { max-width: 96ch; margin: 0 auto 28px; font-size: 1.1rem; line-height: 1.55; color: var(--pm-fg); }
.nam-pmap__intro p { margin: 0 0 0.9em; font-size: inherit; line-height: inherit; }
.nam-pmap__intro p:last-child { margin-bottom: 0; }
.nam-pmap__status { color: var(--pm-muted); margin: 0; display: grid; gap: 8px; justify-items: start; }
.nam-pmap__status button:not(#nam-x) { border: 1px solid var(--pm-rule); border-radius: 6px; background: var(--pm-surface); color: var(--pm-accent); font: inherit; font-size: 0.9rem; padding: 6px 12px; cursor: pointer; }

/* headline boxes: each tile is four rows (eyebrow / value / footer / sub-tile) laid on the parent's subgrid so the big
   numbers sit on one line across the row whatever the eyebrow's line count (owner, 4 Nov 2026) */
.nam-pmap__stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; }
.nam-pmap__stat { background: var(--pm-surface); border: 1px solid var(--pm-rule); border-radius: 8px; padding: 16px 20px 18px; min-width: 0; text-align: center; display: grid; grid-template-rows: auto auto auto auto auto; align-content: start; }
.nam-pmap__stat .k { font-size: 0.9rem; color: var(--pm-muted); font-weight: 600; display: flex; align-items: flex-end; justify-content: center; min-height: 2.6em; }
.nam-pmap__stat .v { font-size: 2.1rem; font-weight: 700; color: var(--wdg-color-primary, #0032a0); font-family: var(--wdg-font-heading, inherit); font-variant-numeric: tabular-nums; line-height: 1.1; margin-top: 4px; }
.nam-pmap__stat .s { font-size: 0.9rem; color: var(--pm-muted); margin-top: 4px; }
.nam-pmap__stat .sub { margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--pm-rule); display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 4px 10px; align-self: end; }
.nam-pmap__stat .sub .sk { font-size: 0.82rem; color: var(--pm-muted); font-weight: 600; }
.nam-pmap__stat .sub .sv { font-size: 1.2rem; font-weight: 700; color: var(--wdg-color-primary, #0032a0); font-family: var(--wdg-font-heading, inherit); font-variant-numeric: tabular-nums; }
/* the two-part split bar inside a tile (owner, 5 Nov 2026 "option 2"): reds for the cost, blues for the BAAJA saving */
.nam-pmap__stat .split { margin: 12px auto 0; max-width: 480px; width: 100%; }
.nam-pmap__stat .split .bar { display: flex; height: 10px; border-radius: 5px; overflow: hidden; background: rgba(0, 0, 0, 0.08); }
.nam-pmap__stat .split .bar span { display: block; height: 100%; }
.nam-pmap__stat .split .leg { display: flex; justify-content: space-between; gap: 8px 16px; flex-wrap: wrap; font-size: 0.8rem; color: var(--pm-muted); margin-top: 6px; text-align: left; }
.nam-pmap__stat .split .leg b { color: var(--pm-fg); font-variant-numeric: tabular-nums; }
.nam-pmap__stat .split .leg i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 6px; }
.nam-pmap__stat .split .bar--cost .g0, .nam-pmap__stat .split .leg--cost .g0 { background: var(--pm-ramp-cost-mid); }
.nam-pmap__stat .split .bar--cost .g1, .nam-pmap__stat .split .leg--cost .g1 { background: #f2a3ab; }
.nam-pmap__stat .split .bar--save .g0, .nam-pmap__stat .split .leg--save .g0 { background: var(--pm-accent-2); }
.nam-pmap__stat .split .bar--save .g1, .nam-pmap__stat .split .leg--save .g1 { background: var(--wdg-color-secondary-xlight, #cceef9); }
@supports (grid-template-rows: subgrid) {
  .nam-pmap__stat { grid-row: span 5; grid-template-rows: subgrid; }
  .nam-pmap__stat .k { min-height: 0; }
}

/* controls: pill tabs, same register as the theme's tab block (data-pill) */
.nam-pmap__controls { display: flex; flex-wrap: wrap; gap: 12px 28px; align-items: center; justify-content: center; }
.nam-pmap__controls > span { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.nam-pmap__ctl-label { display: none; }   /* "Show" wrapped onto its own line above the centered pills; the pills explain themselves (5 Nov 2026) */
.nam-pmap__seg { display: inline-flex; flex-wrap: wrap; gap: 6px; align-items: center; }
/* divider between the three cost views and the savings view (owner, 4 Nov 2026) */
.nam-pmap__seg-sep { display: inline-block; width: 1px; height: 1.6em; background: var(--pm-rule); margin: 0 10px; }
/* White pills with a rule so they read against the gray band; primary when active. */
.nam-pmap__seg button:not(#nam-x) { border: 1px solid var(--pm-rule); border-radius: 24px; background: #fff; color: var(--wdg-color-primary, #0032a0); font: inherit; font-size: 0.84em; font-weight: 800; line-height: 1.4; padding: 0.3em 1.4em; cursor: pointer; text-transform: none; letter-spacing: normal; box-shadow: 0 1px 2px rgba(0, 40, 120, 0.06); min-height: 0; transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease; }
.nam-pmap__seg button:not(#nam-x):hover { background: #eef3fb; border-color: var(--wdg-color-primary, #0032a0); color: var(--wdg-color-primary, #0032a0); }
.nam-pmap__seg button[aria-pressed="true"]:not(#nam-x), .nam-pmap__seg button[aria-pressed="true"]:not(#nam-x):hover { background: var(--wdg-color-primary, #0032a0); border-color: var(--wdg-color-primary, #0032a0); color: #fff; }
.nam-pmap__seg button:focus-visible, .nam-pmap__table th button:focus-visible { outline: 2px solid var(--pm-focus); outline-offset: -2px; }

/* map card */
.nam-pmap__card { background: var(--pm-surface); border: 1px solid var(--pm-rule); border-radius: 10px; padding: 16px; display: grid; gap: 12px; min-width: 0; }
.nam-pmap__title { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; align-items: baseline; }
/* map title: bold at the theme's h4 size (one step down from a section h3; owner, 4 Nov 2026) */
.nam-sec--pmap .nam-pmap__t { margin: 0; font-weight: 700; font-size: var(--wdg-font-size-h4, 1.35rem); }
.nam-pmap__u { color: var(--pm-muted); font-size: 0.9rem; }
.nam-pmap__map { width: 100%; aspect-ratio: 16 / 10; min-height: 360px; border-radius: 8px; overflow: hidden; background: var(--pm-bg); position: relative; }
.nam-pmap__map .mapboxgl-canvas { outline: none; }
.nam-pmap__map.is-unavailable { min-height: 120px; aspect-ratio: auto; height: 120px; background: repeating-linear-gradient(135deg, #eef1f6 0 12px, #f6f7fa 12px 24px); }
.nam-pmap__map .mapboxgl-canvas-container.mapboxgl-interactive { cursor: default; }
.nam-pmap__map .mapboxgl-ctrl-logo, .nam-pmap__map .mapboxgl-ctrl-attrib { opacity: 0.6; }
/* The theme styles every button in .entry-content (green pill); Mapbox's zoom control must keep its own look. */
.nam-pmap__map .mapboxgl-ctrl-group button:not(#nam-x) { all: unset; box-sizing: border-box; display: block; width: 29px; height: 29px; padding: 0; margin: 0; background-color: transparent; border: 0; border-radius: 0; cursor: pointer; }
.nam-pmap__map .mapboxgl-ctrl-group button:not(#nam-x) + button { border-top: 1px solid #ddd; }
.nam-pmap__map .mapboxgl-ctrl-group button:not(#nam-x):hover { background-color: rgba(0, 0, 0, 0.05); }
.nam-pmap__map .mapboxgl-ctrl-group button:not(#nam-x) .mapboxgl-ctrl-icon { display: block; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center; }
.nam-pmap__legend { display: grid; gap: 4px; max-width: 360px; }
.nam-pmap__legend-label { font-size: 0.82rem; color: var(--pm-muted); font-weight: 600; }
.nam-pmap__legend-label .nam-pmap__u { font-weight: 400; }
.nam-pmap__legend-bar { height: 10px; border-radius: 3px; border: 1px solid var(--pm-rule); }
.nam-pmap__legend-ticks { display: flex; justify-content: space-between; font-size: 0.8rem; color: var(--pm-muted); font-variant-numeric: tabular-nums; }
/* The measure note sits BELOW the state panel (owner, 4 Nov 2026). */
.nam-pmap__note { font-size: 0.92rem; color: var(--pm-muted); max-width: 72ch; margin: 0; border-top: 1px solid var(--pm-rule); padding-top: 12px; }

/* hover tooltip (positioned by the script, fixed to the viewport) */
/* The tooltip is a list of label/value rows, not a table: the theme's table rules squeezed the label column to one
   word per line and the no-wrap values ran outside the box (owner, 4 Nov 2026). Labels wrap; values keep their
   natural width and wrap only when the label has nothing left to give. */
.nam-pmap__tip { position: fixed; z-index: 20; pointer-events: none; background: var(--pm-surface); color: var(--pm-fg); border: 1px solid var(--pm-rule); border-radius: 8px; padding: 10px 12px; font-size: 0.88rem; line-height: 1.4; box-shadow: 0 6px 24px rgba(0,0,0,0.12); width: max-content; max-width: min(380px, calc(100vw - 32px)); box-sizing: border-box; overflow-wrap: anywhere; }
.nam-pmap__tip .n { font-weight: 700; margin-bottom: 4px; }
/* Each row is a flex line: label, a dotted leader that fills the slack right up to the value (owner, 4 Nov 2026), value.
   The leader is the label's ::after sitting on the first line's baseline; the label text wraps only once the leader
   is at its minimum width. */
.nam-pmap__tip .rows { display: flex; flex-direction: column; gap: 2px; }
.nam-pmap__tip .r { display: flex; align-items: last baseline; gap: 6px; }
.nam-pmap__tip .k { color: var(--pm-muted); flex: 1 1 auto; min-width: 0; display: flex; align-items: last baseline; }
.nam-pmap__tip .k::after { content: ''; flex: 1 1 14px; min-width: 14px; margin-left: 6px; border-bottom: 1px dotted var(--pm-muted); opacity: 0.6; }
.nam-pmap__tip .v { flex: 0 0 auto; text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.nam-pmap__tip .m { color: var(--pm-muted); font-size: 0.8rem; margin-top: 6px; }

/* state panel */
.nam-pmap__detail { display: grid; gap: 10px; }
.nam-pmap__dh { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; align-items: baseline; }
.nam-pmap__detail .nam-pmap__dt { margin: 0; font-weight: 800; }
.nam-pmap__detail .nam-pmap__ds { margin: -4px 0 0; font-size: 1rem; color: var(--pm-fg); font-weight: 600; font-variant-numeric: tabular-nums; }
.nam-pmap__detail .nam-pmap__ds:empty { display: none; }
.nam-pmap__dp { font-size: 0.82rem; color: var(--pm-muted); }
.nam-pmap__dp button:not(#nam-x) { all: unset; cursor: pointer; color: var(--pm-accent); font-weight: 600; }
.nam-pmap__detail p { margin: 0; font-size: 0.95rem; max-width: 80ch; }
/* panel "option B": stacked bar (navy / blue / light blue) + legend, one sentence, saving line */
.nam-pmap__stack { display: flex; height: 22px; border-radius: 6px; overflow: hidden; background: var(--pm-rule); }
.nam-pmap__stack span { display: block; height: 100%; }
.nam-pmap__stack .s0, .nam-pmap__dlegend .s0 { background: var(--pm-accent); }
.nam-pmap__stack .s1, .nam-pmap__dlegend .s1 { background: var(--pm-accent-2); }
.nam-pmap__stack .s2, .nam-pmap__dlegend .s2 { background: var(--wdg-color-secondary-light, #66cbec); }
.nam-pmap__dlegend { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: 0.85rem; color: var(--pm-muted); margin-top: -2px; }
.nam-pmap__dlegend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 6px; vertical-align: baseline; }
.nam-pmap__dlegend b { color: var(--pm-fg); font-variant-numeric: tabular-nums; }
.nam-pmap__dtext { color: var(--pm-fg); }
.nam-pmap__saves { border-top: 1px solid var(--pm-rule); padding-top: 10px; display: flex; gap: 14px; align-items: baseline; }
.nam-pmap__saves .v { font-size: 1.45rem; font-weight: 700; color: var(--pm-accent); font-family: var(--wdg-font-heading, inherit); font-variant-numeric: tabular-nums; white-space: nowrap; }
.nam-pmap__saves .t { font-size: 0.92rem; color: var(--pm-fg); }
.nam-sec--pmap.is-relief .nam-pmap__saves .v { color: var(--pm-accent-2); }
.nam-pmap__detail p .num { font-weight: 700; color: var(--pm-accent); font-variant-numeric: tabular-nums; }
.nam-pmap__bars { display: grid; grid-template-columns: minmax(150px, 220px) 1fr auto; gap: 4px 10px; align-items: center; font-size: 0.85rem; max-width: 720px; }
.nam-pmap__bars .bl { color: var(--pm-muted); line-height: 1.25; }
.nam-pmap__bars .bb { height: 10px; border-radius: 3px; background: var(--pm-rule); overflow: hidden; }
.nam-pmap__bars .bb span { display: block; height: 100%; background: var(--pm-ramp-cost-mid); }
.nam-sec--pmap.is-relief .nam-pmap__bars .bb span { background: var(--pm-ramp-relief-mid); }   /* savings view: the map's blue, not red */
.nam-pmap__bars .bv { font-variant-numeric: tabular-nums; white-space: nowrap; }

/* action buttons under the map card (the table and the method text open in modals; owner, 4 Nov 2026) */
.nam-pmap__actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.nam-pmap__btn:not(#nam-x) { border: 2px solid var(--pm-accent); border-radius: 999px; background: var(--pm-accent); color: #fff; font: inherit; font-size: 0.92rem; font-weight: 800; line-height: 1.3; padding: 0.7em 1.8em; cursor: pointer; text-transform: none; letter-spacing: normal; min-height: 0; transition: background 0.2s ease, color 0.2s ease; }
.nam-pmap__btn:not(#nam-x):hover { background: var(--pm-accent-2); border-color: var(--pm-accent-2); color: #fff; }
.nam-pmap__btn--ghost:not(#nam-x) { background: transparent; color: var(--pm-accent); }
.nam-pmap__btn--ghost:not(#nam-x):hover { background: var(--pm-accent); border-color: var(--pm-accent); color: #fff; }
.nam-pmap__btn:focus-visible { outline: 2px solid var(--pm-focus); outline-offset: 2px; }

/* modals: native <dialog>, full-screen sheet on small screens */
.nam-pmap__dialog { border: 0; padding: 0; background: transparent; max-width: min(1400px, calc(100vw - 32px)); width: 100%; max-height: calc(100vh - 32px); margin: auto; color: var(--pm-fg); }
.nam-pmap__dialog::backdrop { background: rgba(10, 20, 40, 0.55); }
.nam-pmap__dialog-panel { background: var(--pm-surface); border-radius: 12px; padding: 20px 24px 24px; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); display: grid; align-content: start; gap: 12px; max-height: calc(100vh - 32px); overflow: auto; box-sizing: border-box; }
.nam-pmap__dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.nam-pmap__dialog-head h2 { margin: 0; font-size: 1.5rem; }
.nam-pmap__dialog-close:not(#nam-x) { all: unset; box-sizing: border-box; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font-size: 1.8rem; line-height: 1; color: var(--pm-muted); cursor: pointer; flex: 0 0 auto; }
.nam-pmap__dialog-close:not(#nam-x):hover { background: var(--pm-bg); color: var(--pm-accent); }
.nam-pmap__dialog-close:focus-visible { outline: 2px solid var(--pm-focus); }
.nam-pmap__dialog-hint { margin: 0; font-size: 0.88rem; color: var(--pm-muted); }
.nam-pmap__dialog--method { max-width: min(860px, calc(100vw - 32px)); }
.nam-pmap__method h3, .nam-pmap__method h4 { margin: 18px 0 6px; font-size: 1.08rem; }
.nam-pmap__method h3:first-child, .nam-pmap__method h4:first-child { margin-top: 0; }
.nam-pmap__method p { margin: 0 0 10px; font-size: 0.98rem; line-height: 1.55; max-width: 80ch; }
.nam-pmap__method a:not(#nam-x) { color: var(--pm-accent); text-decoration: underline; }
html.nam-pmap-modal-open { overflow: hidden; }

/* table (inside the All States modal) */
.nam-pmap__tablewrap { overflow-x: auto; border: 1px solid var(--pm-rule); border-radius: 10px; background: var(--pm-surface); -webkit-overflow-scrolling: touch; }
.nam-sec--pmap .nam-pmap__table { border-collapse: collapse; width: 100%; font-size: 0.9rem; min-width: 1000px; margin: 0; border: 0; background: transparent; }
.nam-sec--pmap .nam-pmap__table th, .nam-sec--pmap .nam-pmap__table td { padding: 7px 10px; border: 0; border-bottom: 1px solid var(--pm-rule); text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; background: transparent; color: var(--pm-fg); font-size: inherit; line-height: 1.4; }
.nam-sec--pmap .nam-pmap__table th:first-child, .nam-sec--pmap .nam-pmap__table td:first-child { text-align: left; position: sticky; left: 0; background: var(--pm-surface); }
.nam-sec--pmap .nam-pmap__table th { font-size: 0.82rem; color: var(--pm-muted); font-weight: 600; text-transform: none; letter-spacing: normal; }
.nam-sec--pmap .nam-pmap__table thead tr, .nam-sec--pmap .nam-pmap__table tbody tr { background: transparent; }
.nam-pmap__table th button:not(#nam-x) { all: unset; cursor: pointer; font: inherit; color: inherit; }
.nam-pmap__table th button[data-active="true"]:not(#nam-x) { color: var(--pm-accent); }
.nam-sec--pmap .nam-pmap__table tr.us td { font-weight: 700; border-top: 2px solid var(--pm-rule); }

/* notes list + source */
.nam-pmap__all { border: 1px solid var(--pm-rule); border-radius: 10px; background: var(--pm-surface); padding: 12px 16px; }
.nam-pmap__all summary { cursor: pointer; font-weight: 600; color: var(--pm-accent); }
.nam-pmap__all dl { margin: 12px 0 0; display: grid; gap: 10px; }
.nam-pmap__all dt { font-weight: 700; }
.nam-pmap__all dd { margin: 0 0 4px; font-size: 0.92rem; color: var(--pm-fg); max-width: 90ch; }
.nam-pmap__source { font-size: 0.85rem; color: var(--pm-muted); margin: 0; max-width: 90ch; }
.nam-pmap__source a:not(#nam-x) { color: var(--pm-accent); text-decoration: underline; }

/* editor placeholder */
.nam-pmap--editor-preview .nam-pmap__editor-placeholder { border: 2px dashed #00a9e0; border-radius: 10px; padding: 1.5rem; background: #f4f9fd; text-align: center; }
.nam-pmap--editor-preview .nam-pmap__editor-placeholder p { margin: 0.25rem 0; }
.nam-pmap--editor-preview .nam-pmap__editor-hint { color: #5b6475; font-size: 0.9rem; }

/* wide layout: map + legend left, note + state panel right */
@media (min-width: 1100px) {
  .nam-pmap__card { grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr); grid-auto-rows: auto; column-gap: 32px; align-items: start; padding: 20px 24px 22px; }
  .nam-pmap__map { aspect-ratio: 16 / 9.5; }
  .nam-pmap__title { grid-column: 1 / -1; }
  .nam-pmap__map { grid-column: 1; grid-row: 2 / span 2; }
  .nam-pmap__legend { grid-column: 1; grid-row: 4; }
  .nam-pmap__detail { grid-column: 2; grid-row: 2 / span 3; }
  .nam-pmap__note { grid-column: 2; grid-row: 3 / span 2; max-width: none; align-self: start; margin-top: 14px; }
  .nam-pmap__bars { max-width: none; grid-template-columns: minmax(140px, 200px) 1fr auto; }
}
@media (max-width: 560px) {
  .nam-sec--pmap { padding: 0 0 40px; }
  .nam-pmap__numbers { padding: 36px 0 32px; margin-bottom: 28px; }
  .nam-pmap__wrap { padding: 0 16px; }
  .nam-pmap__body { gap: 20px; }
  .nam-pmap__intro { font-size: 1.02rem; text-align: left; }
  .nam-pmap__stats { grid-template-columns: 1fr; }
  .nam-pmap__stat .v { font-size: 1.8rem; }
  .nam-pmap__controls { justify-content: stretch; }
  .nam-pmap__controls > span { display: grid; width: 100%; }
  .nam-pmap__ctl-label { margin: 0 0 4px; }
  .nam-pmap__seg { display: grid; grid-template-columns: 1fr; width: 100%; }
  .nam-pmap__seg button:not(#nam-x) { width: 100%; text-align: center; padding: 0.55em 1em; }
  .nam-pmap__seg-sep { width: 100%; height: 1px; margin: 6px 0; }
  .nam-pmap__card { padding: 12px; }
  .nam-pmap__map { aspect-ratio: 4 / 3; min-height: 280px; }
  .nam-pmap__bars { grid-template-columns: minmax(110px, 160px) 1fr auto; }
  .nam-pmap__actions { flex-direction: column; }
  .nam-pmap__btn:not(#nam-x) { width: 100%; text-align: center; }
  .nam-pmap__dialog, .nam-pmap__dialog--method { max-width: 100vw; width: 100vw; max-height: 100vh; height: 100vh; margin: 0; }
  .nam-pmap__dialog-panel { border-radius: 0; max-height: 100vh; min-height: 100vh; padding: 16px; }
  .nam-pmap__dialog-head h2 { font-size: 1.25rem; }
}