/* ============================================================
   PivotRisk — Risk Intelligence Map
   Loaded only on pages that render the map.
   ============================================================ */

.prmap {
  --map-ocean:  #0B1628;
  --map-land:   #1E3557;
  --map-coast:  #33578C;
  --map-grid:   rgba(255,255,255,.055);
  --sev-crit:   #F0484A;
  --sev-elev:   #F59E0B;
  --sev-watch:  #38BDF8;
  --c-aws:      #FF9900;
  --c-azure:    #35B8F0;
  --c-gcp:      #5FD08A;

  /* Marker radii in SVG user units. Every rule divides these by --prz (the
     zoom factor) so markers hold a constant on-screen size as you zoom, and
     the breakpoints below only have to override the base numbers. */
  --r-region:     2.6;
  --r-region-hot: 4.6;
  --r-region-hit: 5;
  --r-dot:        3.4;
  --r-dot-hot:    5.2;
  --r-halo:       4.2;
  --r-hit:        9;
  display: block;
}

/* ── Toolbar ─────────────────────────────────────────────── */
.prmap-bar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin-bottom: 14px;
}
.prmap-status {
  display: flex; align-items: center; gap: 9px;
  font-size: .8125rem; color: var(--gray-600); line-height: 1.5;
}
.prmap-dot {
  width: 8px; height: 8px; border-radius: 99px; flex-shrink: 0;
  background: var(--gray-400);
}
.prmap-dot-ok   { background: #10B981; box-shadow: 0 0 0 3px rgba(16,185,129,.16); }
.prmap-dot-warn { background: var(--amber); box-shadow: 0 0 0 3px rgba(245,158,11,.18); }
.prmap-dot-busy { background: var(--navy-light); animation: prmap-blink 1s ease-in-out infinite; }
@keyframes prmap-blink { 0%,100% { opacity: 1; } 50% { opacity: .25; } }

.prmap-load {
  background: var(--amber); color: var(--gray-900);
  border: none; border-radius: var(--radius);
  padding: 11px 22px; font-weight: 700; font-size: .9375rem;
  cursor: pointer; transition: all var(--transition); white-space: nowrap;
}
.prmap-load:hover:not(:disabled) { background: var(--amber-dark); transform: translateY(-1px); box-shadow: var(--shadow-md); }
.prmap-load:disabled { opacity: .55; cursor: progress; }

/* ── Layer chips ─────────────────────────────────────────── */
.prmap-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 14px; }
.prmap-chip {
  background: var(--white); border: 1px solid var(--gray-200);
  color: var(--gray-600); border-radius: 99px;
  padding: 6px 15px; font-size: .8125rem; font-weight: 600;
  cursor: pointer; transition: all var(--transition);
}
.prmap-chip:hover { border-color: var(--navy-light); color: var(--navy); }
.prmap-chip.is-on { background: var(--navy); border-color: var(--navy); color: var(--white); }

/* ── Map stage ───────────────────────────────────────────── */
.prmap-stage {
  position: relative; border-radius: var(--radius-lg); overflow: hidden;
  background: var(--map-ocean); box-shadow: var(--shadow-md);
  border: 1px solid rgba(255,255,255,.08);
}
.prmap-stage:focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; }
.prmap-svg {
  display: block; width: 100%; height: auto;
  --prz: 1;                       /* zoom factor; markers divide by it */
  cursor: grab; touch-action: none;
}
.prmap-stage.is-panning .prmap-svg { cursor: grabbing; }

/* ── Zoom / fullscreen cluster ───────────────────────────── */
.prmap-ctrls {
  position: absolute; top: 12px; right: 12px; z-index: 10;
  display: flex; flex-direction: column; gap: 6px; align-items: stretch;
}
.prmap-ctrl {
  width: 34px; height: 34px; display: flex; align-items: center; justify-content: center;
  background: rgba(9,17,31,.82); color: rgba(255,255,255,.9);
  border: 1px solid rgba(255,255,255,.16); border-radius: 8px;
  font-size: 1rem; font-weight: 700; line-height: 1; cursor: pointer;
  backdrop-filter: blur(6px); transition: all var(--transition);
}
.prmap-ctrl:hover:not(:disabled) { background: rgba(31,56,100,.95); border-color: rgba(255,255,255,.34); }
.prmap-ctrl:disabled { opacity: .34; cursor: default; }
.prmap-ctrl-fs { margin-top: 4px; font-size: .875rem; }
.prmap-zoomlabel {
  text-align: center; font-size: .625rem; font-weight: 700; letter-spacing: .04em;
  color: rgba(255,255,255,.66); font-family: var(--font-mono);
  background: rgba(9,17,31,.72); border-radius: 6px; padding: 3px 0;
  border: 1px solid rgba(255,255,255,.1);
}

/* ── Region presets ──────────────────────────────────────── */
.prmap-presets { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.prmap-preset {
  background: transparent; border: 1px dashed var(--gray-200);
  color: var(--gray-600); border-radius: var(--radius);
  padding: 5px 13px; font-size: .75rem; font-weight: 600;
  cursor: pointer; transition: all var(--transition);
}
.prmap-preset:hover { border-style: solid; border-color: var(--navy); color: var(--navy); background: var(--gray-50); }

/* ── Site of interest / radius bar ───────────────────────── */
.prmap-focus-bar {
  background: var(--gray-50); border: 1px solid var(--gray-200);
  border-radius: var(--radius); padding: 14px 16px; margin-bottom: 14px;
}
.prmap-focus-label {
  display: block; font-size: .6875rem; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase;
  color: var(--gray-600); margin-bottom: 8px;
}
.prmap-focus-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: stretch; }
.prmap-addr {
  flex: 1 1 300px; min-width: 200px;
  border: 1px solid var(--gray-200); border-radius: var(--radius);
  padding: 9px 14px; font-size: .875rem; background: var(--white); color: var(--gray-800);
}
.prmap-addr:focus { outline: none; border-color: var(--navy); }
.prmap-radius {
  border: 1px solid var(--gray-200); border-radius: var(--radius);
  padding: 9px 12px; font-size: .875rem; background: var(--white);
  color: var(--gray-800); cursor: pointer;
}
.prmap-focus-go {
  background: var(--navy); color: var(--white); border: none;
  border-radius: var(--radius); padding: 9px 22px;
  font-size: .875rem; font-weight: 600; cursor: pointer; transition: all var(--transition);
}
.prmap-focus-go:hover:not(:disabled) { background: var(--navy-dark); }
.prmap-focus-go:disabled { opacity: .55; cursor: progress; }
.prmap-focus-clear {
  background: transparent; color: var(--gray-600); border: 1px solid var(--gray-200);
  border-radius: var(--radius); padding: 9px 16px; font-size: .875rem;
  font-weight: 600; cursor: pointer; transition: all var(--transition);
}
.prmap-focus-clear:hover { border-color: var(--navy); color: var(--navy); }
.prmap-focus-msg { font-size: .8125rem; color: var(--gray-600); margin-top: 8px; min-height: 0; }
.prmap-focus-msg:empty { margin-top: 0; }
.prmap-focus-msg.is-err { color: #A81719; }

.prmap-focus-summary {
  grid-column: 1 / -1; background: var(--navy); color: var(--white);
  padding: 20px 24px; border-radius: var(--radius-lg);
}
.prmap-focus-sum-h { font-size: 1.25rem; font-weight: 800; letter-spacing: -.02em; }
.prmap-focus-sum-p { color: rgba(255,255,255,.75); font-size: .9375rem; margin-top: 2px; }
.prmap-focus-sum-r {
  color: rgba(255,255,255,.6); font-size: .8125rem; margin-top: 10px;
  padding-top: 10px; border-top: 1px solid rgba(255,255,255,.14);
}
.prmap-summary:has(.prmap-focus-summary) { grid-template-columns: 1fr; background: none; border: none; }

.prmap-card-dist {
  margin-left: auto; font-size: .6875rem; font-weight: 700;
  color: var(--navy); background: var(--gray-100);
  padding: 3px 8px; border-radius: 99px; font-family: var(--font-mono);
}

/* ── Search ──────────────────────────────────────────────── */
.prmap-search {
  flex: 1; min-width: 160px; max-width: 260px;
  border: 1px solid var(--gray-200); border-radius: 99px;
  padding: 6px 15px; font-size: .8125rem; color: var(--gray-800);
  background: var(--white); transition: border-color var(--transition);
}
.prmap-search:focus { outline: none; border-color: var(--navy); }
.prmap-search::placeholder { color: var(--gray-400); }

/* ── Fullscreen ──────────────────────────────────────────── */
.prmap-fs-panel { display: none; }
.prmap-stage:fullscreen {
  border-radius: 0; border: none; width: 100vw; height: 100vh;
  display: flex; align-items: center; justify-content: center;
}
/* preserveAspectRatio="xMidYMid meet" letterboxes inside this box, so giving
   it the full viewport is safe and avoids an auto-sizing collapse. */
.prmap-stage:fullscreen .prmap-svg { width: 100vw; height: 100vh; }
.prmap-stage:fullscreen .prmap-fs-panel {
  display: flex; flex-direction: column; gap: 10px;
  position: absolute; top: 14px; left: 14px; z-index: 10;
  background: rgba(9,17,31,.85); backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.14); border-radius: 10px;
  padding: 12px 14px; max-width: min(460px, 46vw);
}
/* Repaint the relocated controls for a dark background. */
.prmap-stage:fullscreen .prmap-chips,
.prmap-stage:fullscreen .prmap-presets { margin: 0; }
.prmap-stage:fullscreen .prmap-chip {
  background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.18); color: rgba(255,255,255,.82);
}
.prmap-stage:fullscreen .prmap-chip:hover { border-color: rgba(255,255,255,.4); color: #fff; }
.prmap-stage:fullscreen .prmap-chip.is-on { background: var(--amber); border-color: var(--amber); color: #111827; }
.prmap-stage:fullscreen .prmap-preset { border-color: rgba(255,255,255,.24); color: rgba(255,255,255,.7); }
.prmap-stage:fullscreen .prmap-preset:hover { border-color: #fff; color: #fff; background: rgba(255,255,255,.08); }
.prmap-stage:fullscreen .prmap-search {
  background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.2); color: #fff; max-width: none;
}
.prmap-stage:fullscreen .prmap-search::placeholder { color: rgba(255,255,255,.45); }
.prmap-stage:fullscreen .prmap-legend { color: rgba(255,255,255,.7); margin: 0; }

.prmap-ocean     { fill: var(--map-ocean); }
/* non-scaling-stroke keeps coastlines and gridlines hairline at every zoom. */
.prmap-land      { fill: var(--map-land); stroke: var(--map-coast); stroke-width: .9; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.prmap-graticule line { stroke: var(--map-grid); stroke-width: 1; vector-effect: non-scaling-stroke; }
.prmap-graticule .prmap-equator { stroke: rgba(255,255,255,.11); stroke-dasharray: 3 4; }

/* ── State Dept country shading ──────────────────────────── */
.prmap-country {
  cursor: pointer; stroke-width: .8; vector-effect: non-scaling-stroke;
  transition: fill-opacity 140ms ease;
}
.prmap-risk-4 { fill: rgba(240,72,74,.34); stroke: rgba(240,72,74,.75); }
.prmap-risk-3 { fill: rgba(245,158,11,.26); stroke: rgba(245,158,11,.62); }
.prmap-country:hover, .prmap-country.is-hot, .prmap-country:focus { outline: none; }
.prmap-country.prmap-risk-4:hover, .prmap-country.prmap-risk-4:focus { fill: rgba(240,72,74,.55); }
.prmap-country.prmap-risk-3:hover, .prmap-country.prmap-risk-3:focus { fill: rgba(245,158,11,.46); }
.prmap-country-pt { r: calc(4px / var(--prz, 1)); stroke-width: 1.4; }
/* The layer is only meaningful on its own chip and on the combined view. */
.prmap-layer-countries { display: none; }
.prmap-show-countries .prmap-layer-countries { display: block; }

/* ── Focus point + radius ────────────────────────────────── */
.prmap-focus-ring {
  fill: none; stroke: var(--amber); stroke-width: 2;
  stroke-dasharray: 6 5; vector-effect: non-scaling-stroke; opacity: .95;
}
.prmap-focus-dot { fill: var(--amber); stroke: #111827; stroke-width: 1; vector-effect: non-scaling-stroke;
  r: calc(3px / var(--prz, 1)); }
.prmap-focus-cross { stroke: var(--amber); stroke-width: 1.4; vector-effect: non-scaling-stroke; opacity: .9; }
.prmap-region.is-outside { opacity: .18; }
.prmap-region.is-inside  { opacity: 1; }

/* Cloud regions — squares. Infrastructure is a fixed asset and should not
   read like a transient event, so shape carries category and colour carries
   severity. Geometry is driven by per-node --px/--py set once at creation. */
.prmap-region {
  --s: calc(var(--r-region) * 1px / var(--prz, 1));
  x: calc(var(--px) * 1px - var(--s));
  y: calc(var(--py) * 1px - var(--s));
  width:  calc(var(--s) * 2);
  height: calc(var(--s) * 2);
  rx: calc(var(--s) * .28);
  stroke: rgba(11,22,40,.85); stroke-width: 1.1;
  vector-effect: non-scaling-stroke;
  opacity: .78; cursor: pointer;
  transition: opacity 140ms ease;
}
.prmap-region-aws   { fill: var(--c-aws); }
.prmap-region-azure { fill: var(--c-azure); }
.prmap-region-gcp   { fill: var(--c-gcp); }
.prmap-region:hover, .prmap-region.is-hot, .prmap-region:focus {
  opacity: 1; outline: none; --s: calc(var(--r-region-hot) * 1px / var(--prz, 1));
}
/* Host-country advisory ring. Stroke rather than fill, so a region keeps its
   provider colour and the two signals stay independently readable. */
.prmap-region.adv-critical { stroke: var(--sev-crit); stroke-width: 2.6; opacity: 1; }
.prmap-region.adv-elevated { stroke: var(--sev-elev); stroke-width: 2.4; opacity: 1; }
.prmap-region.adv-watch    { stroke: rgba(255,255,255,.72); stroke-width: 1.8; opacity: .95; }

.prmap-region.is-impacted {
  fill: var(--sev-crit); opacity: 1;
  --s: calc(var(--r-region-hit) * 1px / var(--prz, 1));
  stroke: #fff; stroke-width: 1.5;
}
.prmap-regions-only .prmap-region { opacity: .95; }

/* Event markers */
.prmap-marker { cursor: pointer; }
.prmap-marker-hit { fill: transparent; r: calc(var(--r-hit) * 1px / var(--prz, 1)); }

/* Circle glyph — events that happened. */
.prmap-shape-circle .prmap-marker-dot {
  cx: calc(var(--px) * 1px); cy: calc(var(--py) * 1px);
  r: calc(var(--r-dot) * 1px / var(--prz, 1));
}
.prmap-shape-circle .prmap-marker-halo {
  cx: calc(var(--px) * 1px); cy: calc(var(--py) * 1px);
  r: calc(var(--r-halo) * 1px / var(--prz, 1));
}

/* Diamond glyph — standing political conditions rather than discrete events. */
.prmap-shape-diamond .prmap-marker-dot,
.prmap-shape-diamond .prmap-marker-halo {
  transform: rotate(45deg);
  transform-origin: calc(var(--px) * 1px) calc(var(--py) * 1px);
  transform-box: view-box;
}
.prmap-shape-diamond .prmap-marker-dot {
  --s: calc(var(--r-dot) * .88px / var(--prz, 1));
  x: calc(var(--px) * 1px - var(--s)); y: calc(var(--py) * 1px - var(--s));
  width: calc(var(--s) * 2); height: calc(var(--s) * 2);
}
.prmap-shape-diamond .prmap-marker-halo {
  --s: calc(var(--r-halo) * .88px / var(--prz, 1));
  x: calc(var(--px) * 1px - var(--s)); y: calc(var(--py) * 1px - var(--s));
  width: calc(var(--s) * 2); height: calc(var(--s) * 2);
}

.prmap-marker-dot {
  stroke: rgba(11,22,40,.9); stroke-width: 1.2; vector-effect: non-scaling-stroke;
}
.prmap-marker-halo {
  fill: none; stroke-width: 1.6; opacity: .55; vector-effect: non-scaling-stroke;
}

.prmap-sev-critical .prmap-marker-dot  { fill: var(--sev-crit); }
.prmap-sev-critical .prmap-marker-halo { stroke: var(--sev-crit); }
.prmap-sev-elevated .prmap-marker-dot  { fill: var(--sev-elev); }
.prmap-sev-elevated .prmap-marker-halo { stroke: var(--sev-elev); }
.prmap-sev-watch .prmap-marker-dot     { fill: var(--sev-watch); }
.prmap-sev-watch .prmap-marker-halo    { stroke: var(--sev-watch); }
.prmap-sev-advisory .prmap-marker-dot  { fill: var(--sev-watch); }
.prmap-sev-advisory .prmap-marker-halo { stroke: var(--sev-watch); }

.prmap-shape-circle .prmap-marker-halo { transform-box: fill-box; transform-origin: center; }
.prmap-sev-critical.prmap-shape-circle .prmap-marker-halo { animation: prmap-ping 2.4s ease-out infinite; }

@keyframes prmap-ping {
  0%   { transform: scale(1);   opacity: .6; }
  70%  { transform: scale(2.6); opacity: 0; }
  100% { transform: scale(2.6); opacity: 0; }
}

.prmap-marker:hover .prmap-marker-dot,
.prmap-marker.is-hot .prmap-marker-dot,
.prmap-marker:focus .prmap-marker-dot { stroke: #fff; stroke-width: 1.6; }
.prmap-shape-circle:hover .prmap-marker-dot,
.prmap-shape-circle.is-hot .prmap-marker-dot,
.prmap-shape-circle:focus .prmap-marker-dot { r: calc(var(--r-dot-hot) * 1px / var(--prz, 1)); }
.prmap-shape-diamond:hover .prmap-marker-dot,
.prmap-shape-diamond.is-hot .prmap-marker-dot,
.prmap-shape-diamond:focus .prmap-marker-dot { --s: calc(var(--r-dot-hot) * .88px / var(--prz, 1)); }
.prmap-marker:focus { outline: none; }
.prmap-marker.is-hot .prmap-marker-halo { opacity: 1; }
.prmap-marker.is-pulse.prmap-shape-circle .prmap-marker-halo { animation: prmap-ping .9s ease-out 2; }

@media (prefers-reduced-motion: reduce) {
  .prmap-sev-critical.prmap-shape-circle .prmap-marker-halo,
  .prmap-marker.is-pulse.prmap-shape-circle .prmap-marker-halo,
  .prmap-dot-busy { animation: none; }
}

/* ── Tooltip ─────────────────────────────────────────────── */
.prmap-tip {
  position: absolute; z-index: 12; pointer-events: none;
  max-width: 320px; min-width: 200px;
  background: rgba(9,17,31,.97); color: rgba(255,255,255,.92);
  border: 1px solid rgba(255,255,255,.14); border-radius: 10px;
  padding: 12px 14px; font-size: .8125rem; line-height: 1.5;
  box-shadow: 0 12px 34px rgba(0,0,0,.5);
  opacity: 0; transform: translateY(4px); transition: opacity 120ms ease, transform 120ms ease;
}
.prmap-tip.is-on { opacity: 1; transform: translateY(0); }
.prmap-tip-kind {
  font-size: .6875rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  color: rgba(255,255,255,.5); margin-bottom: 5px;
}
.prmap-tip-critical { color: var(--sev-crit); }
.prmap-tip-elevated { color: var(--sev-elev); }
.prmap-tip-watch    { color: var(--sev-watch); }
.prmap-tip-title { font-weight: 700; font-size: .9375rem; color: #fff; margin-bottom: 4px; line-height: 1.3; }
.prmap-tip-meta { color: rgba(255,255,255,.6); font-size: .75rem; margin-bottom: 6px; }
.prmap-tip-meta code { font-family: var(--font-mono); font-size: .72rem; background: rgba(255,255,255,.08); padding: 1px 5px; border-radius: 4px; }
.prmap-tip-adv {
  font-size: .75rem; font-weight: 600; margin-bottom: 6px;
  padding: 4px 8px; border-radius: 5px; background: rgba(255,255,255,.07);
  color: rgba(255,255,255,.72);
}
.prmap-tip-adv.prmap-tip-critical { background: rgba(240,72,74,.16); }
.prmap-tip-adv.prmap-tip-elevated { background: rgba(245,158,11,.16); }
.prmap-tip-adv.prmap-tip-watch    { background: rgba(56,189,248,.14); }
.prmap-tip-adv.prmap-tip-ok       { background: rgba(16,185,129,.14); color: rgba(255,255,255,.8); }
.prmap-tip-body { color: rgba(255,255,255,.78); }
.prmap-tip-src {
  margin-top: 8px; padding-top: 7px; border-top: 1px solid rgba(255,255,255,.1);
  font-size: .6875rem; color: rgba(255,255,255,.45);
}

/* ── Legend ──────────────────────────────────────────────── */
.prmap-legend {
  display: flex; flex-wrap: wrap; gap: 6px 20px;
  margin-top: 12px; font-size: .75rem; color: var(--gray-600);
}
.prmap-legend-item { display: inline-flex; align-items: center; gap: 7px; }
.prmap-key { width: 9px; height: 9px; border-radius: 99px; display: inline-block; }
.prmap-key-critical { background: var(--sev-crit); }
.prmap-key-elevated { background: var(--sev-elev); }
.prmap-key-watch    { background: var(--sev-watch); }
.prmap-key-aws      { background: var(--c-aws); }
.prmap-key-azure    { background: var(--c-azure); }
.prmap-key-gcp      { background: var(--c-gcp); }

/* ── Summary counters ────────────────────────────────────── */
.prmap-summary {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: var(--gray-200); border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg); overflow: hidden; margin-top: 28px;
}
.prmap-summary:empty { display: none; }
.prmap-stat { background: var(--white); padding: 20px 22px; }
.prmap-stat-n { font-size: 1.75rem; font-weight: 800; color: var(--navy); letter-spacing: -.03em; line-height: 1.1; }
.prmap-stat-critical .prmap-stat-n { color: var(--sev-crit); }
.prmap-stat-elevated .prmap-stat-n { color: var(--amber-dark); }
.prmap-stat-l { font-size: .8125rem; color: var(--gray-600); margin-top: 3px; }

/* ── Section headings inside the map block ───────────────── */
.prmap-sub {
  font-size: 1.125rem; color: var(--navy); margin: 40px 0 8px;
  letter-spacing: -.015em;
}
.prmap-note { font-size: .875rem; color: var(--gray-600); margin-bottom: 18px; line-height: 1.65; }
.prmap-note-sm { font-size: .8125rem; margin-top: 18px; margin-bottom: 0; }

/* ── Service health rail ─────────────────────────────────── */
.prmap-svc-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px;
}
.prmap-svc {
  border: 1px solid var(--gray-200); border-radius: var(--radius);
  padding: 13px 15px; background: var(--white);
  transition: all var(--transition); display: block;
}
.prmap-svc:hover { border-color: var(--navy-light); box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.prmap-svc-top { display: flex; align-items: center; gap: 8px; }
.prmap-svc-dot { width: 8px; height: 8px; border-radius: 99px; background: var(--gray-400); flex-shrink: 0; }
.prmap-svc-ok       .prmap-svc-dot { background: #10B981; }
.prmap-svc-degraded .prmap-svc-dot { background: var(--sev-elev); }
.prmap-svc-down     .prmap-svc-dot { background: var(--sev-crit); }
.prmap-svc-unknown  .prmap-svc-dot { background: var(--gray-400); }
.prmap-svc-degraded { border-color: rgba(245,158,11,.45); background: rgba(245,158,11,.05); }
.prmap-svc-down     { border-color: rgba(240,72,74,.4);  background: rgba(240,72,74,.04); }
.prmap-svc-name { font-weight: 700; font-size: .875rem; color: var(--navy); }
.prmap-svc-desc {
  display: block; margin-top: 5px; font-size: .75rem; color: var(--gray-600);
  line-height: 1.45;
}

/* ── Event cards ─────────────────────────────────────────── */
.prmap-cards-wrap { margin-top: 34px; }
.prmap-cards {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px;
}
.prmap-card {
  border: 1px solid var(--gray-200); border-left: 3px solid var(--gray-200);
  border-radius: var(--radius); background: var(--white);
  padding: 18px 20px; transition: all var(--transition);
  display: flex; flex-direction: column;
}
.prmap-card:focus { outline: 2px solid var(--navy-light); outline-offset: 2px; }
.prmap-card.is-locatable { cursor: pointer; }
.prmap-card.is-locatable .prmap-card-src::after {
  content: ' · click to locate'; color: var(--gray-400); opacity: 0; transition: opacity var(--transition);
}
.prmap-card.is-locatable:hover .prmap-card-src::after { opacity: 1; }
.prmap-card.prmap-sev-critical { border-left-color: var(--sev-crit); }
.prmap-card.prmap-sev-elevated { border-left-color: var(--sev-elev); }
.prmap-card.prmap-sev-watch,
.prmap-card.prmap-sev-advisory { border-left-color: var(--sev-watch); }
.prmap-card:hover, .prmap-card.is-hot {
  box-shadow: var(--shadow-md); transform: translateY(-2px); border-color: var(--gray-400);
}
.prmap-card.is-hot { background: var(--gray-50); }

.prmap-card-head { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-bottom: 9px; }
.prmap-pill {
  font-size: .625rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  padding: 3px 9px; border-radius: 99px;
}
.prmap-pill-critical { background: rgba(240,72,74,.13); color: #A81719; }
.prmap-pill-elevated { background: rgba(245,158,11,.16); color: #92400E; }
.prmap-pill-watch,
.prmap-pill-advisory { background: rgba(56,189,248,.15); color: #075985; }
.prmap-card-kind { font-size: .75rem; color: var(--gray-600); font-weight: 600; }
.prmap-card h4 { font-size: 1rem; color: var(--navy); line-height: 1.35; margin-bottom: 6px; }
.prmap-card-where { font-size: .8125rem; color: var(--gray-600); margin-bottom: 8px; }
.prmap-card p { font-size: .875rem; color: var(--gray-600); line-height: 1.6; flex: 1; margin-bottom: 12px; }
.prmap-card-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding-top: 11px; border-top: 1px solid var(--gray-100); font-size: .75rem;
}
.prmap-card-src { color: var(--gray-400); }
.prmap-card-link { color: var(--navy); font-weight: 700; white-space: nowrap; }
.prmap-card-link:hover { text-decoration: underline; }

.prmap-more {
  grid-column: 1 / -1; justify-self: center;
  background: var(--white); border: 1px solid var(--gray-200);
  color: var(--navy); border-radius: var(--radius);
  padding: 12px 26px; font-weight: 600; font-size: .875rem;
  cursor: pointer; transition: all var(--transition); margin-top: 4px;
}
.prmap-more:hover { border-color: var(--navy); background: var(--gray-50); }

.prmap-empty {
  grid-column: 1 / -1; padding: 40px 28px; text-align: center;
  background: var(--gray-50); border: 1px dashed var(--gray-200);
  border-radius: var(--radius-lg); color: var(--gray-600);
  font-size: .9375rem; line-height: 1.7;
}

/* ── Source panel ────────────────────────────────────────── */
.prmap-sources { margin-top: 8px; }
.prmap-src-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px;
}
.prmap-src {
  border: 1px solid var(--gray-200); border-radius: var(--radius);
  padding: 16px 18px; background: var(--white);
}
.prmap-src-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 4px; }
.prmap-src-name { font-weight: 700; font-size: .9375rem; color: var(--navy); }
.prmap-src-tag {
  font-size: .625rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  padding: 3px 8px; border-radius: 99px; white-space: nowrap;
  background: var(--gray-100); color: var(--gray-600);
}
.prmap-src-ok      .prmap-src-tag { background: rgba(16,185,129,.13); color: #065F46; }
.prmap-src-fail    .prmap-src-tag { background: rgba(240,72,74,.13); color: #A81719; }
.prmap-src-blocked .prmap-src-tag { background: rgba(245,158,11,.16); color: #92400E; }
.prmap-src-static  .prmap-src-tag { background: rgba(31,56,100,.1);  color: var(--navy); }
.prmap-src-snapshot .prmap-src-tag { background: rgba(139,92,246,.14); color: #5B21B6; }
.prmap-src-org { font-size: .75rem; color: var(--gray-400); margin-bottom: 8px; }
.prmap-src-cov { font-size: .8125rem; color: var(--gray-600); line-height: 1.55; margin-bottom: 10px; }
.prmap-src-link { font-size: .75rem; color: var(--navy); font-weight: 600; word-break: break-all; }
.prmap-src-link:hover { text-decoration: underline; }

/* ── Compact (homepage embed) ────────────────────────────── */
.prmap-compact .prmap-legend { margin-top: 10px; }
.prmap-compact .prmap-stage { box-shadow: var(--shadow-lg); }

/* ── Responsive ──────────────────────────────────────────── */
/* The SVG scales to its container, so marker radii in user units shrink with
 * it — at phone width the default 3.4 lands near one physical pixel. Radii are
 * scaled back up so dots stay visible and, more importantly, tappable. */
@media (max-width: 900px) {
  .prmap-summary { grid-template-columns: repeat(2, 1fr); }
  .prmap { --r-region: 4.6; --r-region-hot: 7; --r-region-hit: 8;
           --r-dot: 6; --r-dot-hot: 8.5; --r-halo: 7.5; --r-hit: 16; }
}
@media (max-width: 640px) {
  .prmap-bar { flex-direction: column; align-items: stretch; }
  .prmap-load { width: 100%; }
  .prmap-cards { grid-template-columns: 1fr; }
  .prmap-src-grid { grid-template-columns: 1fr; }
  .prmap-tip { max-width: 240px; }
  .prmap-search { max-width: none; }
  /* Phone-sized map: bigger dots and a much bigger invisible hit area. */
  .prmap { --r-region: 6.5; --r-region-hot: 9; --r-region-hit: 11;
           --r-dot: 9; --r-dot-hot: 12; --r-halo: 11; --r-hit: 30; }
  .prmap-ctrls { top: 8px; right: 8px; }
  .prmap-ctrl { width: 38px; height: 38px; }
}

/* ── Tripwires ───────────────────────────────────────────── */
.prmap-trip-list { display: grid; gap: 10px; }
.prmap-trip {
  border: 1px solid var(--gray-200); border-left: 4px solid var(--gray-200);
  border-radius: var(--radius); padding: 14px 18px; background: var(--white);
}
.prmap-trip-ok     { border-left-color: #10B981; }
.prmap-trip-watch  { border-left-color: var(--sev-elev); background: rgba(245,158,11,.035); }
.prmap-trip-breach { border-left-color: var(--sev-crit); background: rgba(240,72,74,.045); }
.prmap-trip-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.prmap-trip-state {
  font-size: .625rem; font-weight: 800; letter-spacing: .09em;
  padding: 3px 9px; border-radius: 4px; font-family: var(--font-mono);
  background: var(--gray-100); color: var(--gray-600);
}
.prmap-trip-ok     .prmap-trip-state { background: rgba(16,185,129,.14); color: #065F46; }
.prmap-trip-watch  .prmap-trip-state { background: rgba(245,158,11,.2);  color: #92400E; }
.prmap-trip-breach .prmap-trip-state { background: rgba(240,72,74,.16);  color: #A81719; }
.prmap-trip-name { font-weight: 700; font-size: .9375rem; color: var(--navy); }
.prmap-trip-vals { display: flex; gap: 14px; flex-wrap: wrap; margin: 7px 0 6px; font-size: .8125rem; }
.prmap-trip-now  { font-weight: 700; color: var(--gray-800); font-family: var(--font-mono); }
.prmap-trip-norm { color: var(--gray-400); }
.prmap-trip-why  { font-size: .8125rem; color: var(--gray-600); line-height: 1.6; }

/* ── Global conditions ───────────────────────────────────── */
.prmap-cond-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; }
.prmap-cond {
  border: 1px solid var(--gray-200); border-radius: var(--radius);
  padding: 16px 18px; background: var(--white);
}
.prmap-cond-l { font-size: .6875rem; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; color: var(--gray-400); }
.prmap-cond-v { font-size: 1.75rem; font-weight: 800; letter-spacing: -.03em;
  color: var(--navy); line-height: 1.15; margin-top: 4px; font-family: var(--font-mono); }
.prmap-cond-s { font-size: .75rem; color: var(--gray-600); margin-top: 2px; }
.prmap-cond-warn { border-color: rgba(245,158,11,.45); background: rgba(245,158,11,.05); }
.prmap-cond-warn .prmap-cond-v { color: var(--amber-dark); }
.prmap-cond-crit { border-color: rgba(240,72,74,.45); background: rgba(240,72,74,.05); }
.prmap-cond-crit .prmap-cond-v { color: #A81719; }
.prmap-cond-stamp { font-size: .75rem; color: var(--gray-400); margin-top: 10px; }

/* ── CVE rail ────────────────────────────────────────────── */
.prmap-cve-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
.prmap-cve {
  border: 1px solid var(--gray-200); border-radius: var(--radius);
  padding: 13px 16px; background: var(--white); display: block;
  transition: all var(--transition);
}
.prmap-cve:hover { border-color: var(--navy-light); box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.prmap-cve-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.prmap-cve-id { font-family: var(--font-mono); font-size: .8125rem; font-weight: 700; color: var(--navy); }
.prmap-cve-score {
  font-size: .625rem; font-weight: 800; padding: 3px 8px; border-radius: 99px;
  background: var(--gray-100); color: var(--gray-600); white-space: nowrap;
}
.prmap-cve-crit .prmap-cve-score { background: rgba(240,72,74,.14); color: #A81719; }
.prmap-cve-warn .prmap-cve-score { background: rgba(245,158,11,.18); color: #92400E; }
.prmap-cve-desc { font-size: .75rem; color: var(--gray-600); line-height: 1.5; margin-top: 7px; }
.prmap-cve-epss {
  font-size: .6875rem; color: var(--gray-400); margin-top: 8px;
  padding-top: 7px; border-top: 1px solid var(--gray-100); font-family: var(--font-mono);
}
.prmap-cve-epss.is-hot { color: #A81719; font-weight: 700; }

/* Legend keys mirror the map glyphs: circle = event, square = infrastructure,
   diamond = standing political condition. */
.prmap-key-sq   { border-radius: 2px; }
.prmap-key-diam { border-radius: 1px; transform: rotate(45deg); }
.prmap-key-geo  { background: var(--sev-elev); }
.prmap-key-grid { width: 14px; height: 0; border-top: 1px solid rgba(120,140,170,.9); border-radius: 0; }

/* ── Hazard glyphs ───────────────────────────────────────── */
.prmap-glyph {
  transform: scale(calc(var(--r-dot) / var(--prz, 1) * 1.05));
  transform-box: fill-box; transform-origin: center;
  vector-effect: non-scaling-stroke;
}
.prmap-gl-fill .prmap-glyph { stroke: rgba(9,17,31,.85); stroke-width: .9; stroke-linejoin: round; }
.prmap-gl-line .prmap-glyph { fill: none; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.prmap-marker:hover .prmap-glyph,
.prmap-marker.is-hot .prmap-glyph,
.prmap-marker:focus .prmap-glyph { transform: scale(calc(var(--r-dot-hot) / var(--prz, 1) * 1.05)); }

.prmap-sev-critical .prmap-glyph { fill: var(--sev-crit); }
.prmap-sev-elevated .prmap-glyph { fill: var(--sev-elev); }
.prmap-sev-watch    .prmap-glyph,
.prmap-sev-advisory .prmap-glyph { fill: var(--sev-watch); }
.prmap-gl-line.prmap-sev-critical .prmap-glyph { stroke: var(--sev-crit); }
.prmap-gl-line.prmap-sev-elevated .prmap-glyph { stroke: var(--sev-elev); }
.prmap-gl-line.prmap-sev-watch    .prmap-glyph,
.prmap-gl-line.prmap-sev-advisory .prmap-glyph { stroke: var(--sev-watch); }

/* Backing disc keeps line glyphs readable over land. */
.prmap-marker-halo { fill: rgba(9,17,31,.55); stroke: none; r: calc(var(--r-halo) * 1.15px / var(--prz, 1)); }
.prmap-marker-hit  { fill: transparent; r: calc(var(--r-hit) * 1px / var(--prz, 1)); }

/* ── Location risk profile ───────────────────────────────── */
.prmap-score {
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
  padding: 22px 26px; border-radius: var(--radius-lg); color: var(--white);
  background: linear-gradient(135deg, var(--navy-dark), var(--navy));
}
.prmap-score-low  { background: linear-gradient(135deg,#065F46,#047857); }
.prmap-score-mod  { background: linear-gradient(135deg,#155E75,#0E7490); }
.prmap-score-elev { background: linear-gradient(135deg,#92400E,#B45309); }
.prmap-score-high { background: linear-gradient(135deg,#9A3412,#C2410C); }
.prmap-score-sev  { background: linear-gradient(135deg,#7F1D1D,#B91C1C); }
.prmap-score-main { text-align: center; min-width: 96px; }
.prmap-score-n { font-size: 3rem; font-weight: 800; line-height: 1; letter-spacing: -.04em; font-family: var(--font-mono); }
.prmap-score-b { font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-top: 4px; opacity: .85; }
.prmap-score-loc { font-size: 1.125rem; font-weight: 700; }
.prmap-score-sub { font-size: .875rem; opacity: .78; margin-top: 4px; }

.prmap-score-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px,1fr)); gap: 10px; margin-top: 12px; }
.prmap-scat { border: 1px solid var(--gray-200); border-left: 4px solid var(--gray-200); border-radius: var(--radius); padding: 13px 16px; background: var(--white); }
.prmap-scat-low  { border-left-color: #10B981; }
.prmap-scat-mod  { border-left-color: #0EA5E9; }
.prmap-scat-elev { border-left-color: var(--sev-elev); }
.prmap-scat-high { border-left-color: #EA580C; }
.prmap-scat-sev  { border-left-color: var(--sev-crit); }
.prmap-scat-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.prmap-scat-name { font-weight: 700; font-size: .875rem; color: var(--navy); }
.prmap-scat-score { font-size: 1.25rem; font-weight: 800; font-family: var(--font-mono); color: var(--navy); }
.prmap-scat-lxi { font-size: .75rem; color: var(--gray-600); margin-top: 3px; font-family: var(--font-mono); }
.prmap-scat-drv { font-size: .75rem; color: var(--gray-400); margin-top: 6px; line-height: 1.45; }

.prmap-score-cta { margin-top: 14px; padding: 22px 26px; border: 1px dashed var(--gray-200); border-radius: var(--radius-lg); background: var(--gray-50); }
.prmap-score-cta h4 { font-size: 1.0625rem; color: var(--navy); margin-bottom: 8px; }
.prmap-score-cta p { font-size: .9375rem; color: var(--gray-600); line-height: 1.7; margin-bottom: 16px; }
.prmap-score-links { display: flex; gap: 10px; flex-wrap: wrap; }

/* Glyph key */
.prmap-glegend {
  display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 8px;
  font-size: .75rem; color: var(--gray-600);
}
.prmap-gkey { display: inline-flex; align-items: center; gap: 6px; }
.prmap-gkey-svg { width: 15px; height: 15px; flex-shrink: 0; }
.prmap-gkey-path { fill: var(--gray-600); stroke: none; }
.prmap-gkey-path.is-line { fill: none; stroke: var(--gray-600); stroke-width: .34; stroke-linecap: round; stroke-linejoin: round; }

/* Focus pin — draggable site of interest */
.prmap-focus-pin { cursor: grab; }
.prmap-stage.is-moving-pin .prmap-focus-pin { cursor: grabbing; }
.prmap-stage.is-picking .prmap-svg { cursor: crosshair; }
.prmap-focus-grab { fill: transparent; r: calc(16px / var(--prz, 1)); }
.prmap-focus-pin:focus { outline: none; }
.prmap-focus-pin:focus .prmap-focus-dot,
.prmap-focus-pin:hover .prmap-focus-dot { stroke: #fff; stroke-width: 2; }
.prmap-focus-cross {
  stroke: var(--amber); stroke-width: 1.6; vector-effect: non-scaling-stroke;
  opacity: .95; transform: scale(calc(1 / var(--prz, 1)));
  transform-box: fill-box; transform-origin: center;
}
.prmap-focus-dot {
  fill: var(--amber); stroke: #111827; stroke-width: 1;
  vector-effect: non-scaling-stroke; r: calc(3.4px / var(--prz, 1));
}
.prmap-focus-pick {
  background: transparent; color: var(--gray-600); border: 1px solid var(--gray-200);
  border-radius: var(--radius); padding: 9px 16px; font-size: .875rem;
  font-weight: 600; cursor: pointer; transition: all var(--transition);
}
.prmap-focus-pick:hover { border-color: var(--navy); color: var(--navy); }
.prmap-focus-pick.is-on { background: var(--amber); border-color: var(--amber); color: var(--gray-900); }
.prmap-focus-hint { font-size: .75rem; color: var(--gray-400); margin-top: 8px; line-height: 1.55; }

/* Compact footer under the score — the full explanation lives at the top of
   the page, not between the score and the map. */
.prmap-score-foot {
  display: flex; gap: 10px 18px; flex-wrap: wrap; align-items: baseline;
  margin-top: 10px; font-size: .8125rem; color: var(--gray-400); line-height: 1.55;
}
.prmap-score-foot a { color: var(--navy); font-weight: 600; white-space: nowrap; }
.prmap-score-foot a:hover { text-decoration: underline; }
.prmap-risk:empty { display: none; }

/* ── Portfolio scoring ───────────────────────────────────── */
.prmap-portfolio { margin: 0 0 18px; }
.prmap-pf-input {
  width: 100%; border: 1px solid var(--gray-200); border-radius: var(--radius);
  padding: 12px 14px; font-size: .875rem; font-family: var(--font-mono);
  color: var(--gray-800); background: var(--white); resize: vertical; line-height: 1.6;
}
.prmap-pf-input:focus { outline: none; border-color: var(--navy); }
.prmap-pf-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.prmap-pf-out { display: grid; gap: 6px; margin-top: 14px; }
.prmap-pf-row-item {
  display: flex; align-items: center; gap: 14px; cursor: pointer;
  border: 1px solid var(--gray-200); border-left: 4px solid var(--gray-200);
  border-radius: var(--radius); padding: 11px 16px; background: var(--white);
  transition: all var(--transition);
}
.prmap-pf-row-item:hover { box-shadow: var(--shadow-sm); transform: translateY(-1px); border-color: var(--gray-400); }
.prmap-pf-row-item.is-err { cursor: default; color: var(--gray-400); font-size: .875rem; }
.prmap-pf-rank { font-family: var(--font-mono); font-size: .8125rem; color: var(--gray-400); min-width: 20px; }
.prmap-pf-mid { flex: 1; min-width: 0; }
.prmap-pf-name { display: block; font-weight: 700; font-size: .9375rem; color: var(--navy); }
.prmap-pf-drv { display: block; font-size: .75rem; color: var(--gray-600); margin-top: 2px; }
.prmap-pf-score { text-align: right; min-width: 76px; }
.prmap-pf-num { display: block; font-size: 1.375rem; font-weight: 800; font-family: var(--font-mono); color: var(--navy); line-height: 1.1; }
.prmap-pf-band { display: block; font-size: .625rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--gray-400); }
.prmap-score-pop { font-size: .8125rem; opacity: .7; margin-top: 6px; }

/* Portfolio sites on the map */
.prmap-site { cursor: pointer; }
.prmap-site-ring { fill: none; stroke-width: 1.6; stroke-dasharray: 5 4; vector-effect: non-scaling-stroke; opacity: .85; }
.prmap-site-dot { r: calc(3.2px / var(--prz, 1)); stroke: #0B1628; stroke-width: 1; vector-effect: non-scaling-stroke; }
.prmap-site-hit { fill: transparent; r: calc(12px / var(--prz, 1)); }
.prmap-site-low  .prmap-site-ring { stroke: #10B981; } .prmap-site-low  .prmap-site-dot { fill: #10B981; }
.prmap-site-mod  .prmap-site-ring { stroke: #38BDF8; } .prmap-site-mod  .prmap-site-dot { fill: #38BDF8; }
.prmap-site-elev .prmap-site-ring { stroke: #F59E0B; } .prmap-site-elev .prmap-site-dot { fill: #F59E0B; }
.prmap-site-high .prmap-site-ring { stroke: #EA580C; } .prmap-site-high .prmap-site-dot { fill: #EA580C; }
.prmap-site-sev  .prmap-site-ring { stroke: #F0484A; } .prmap-site-sev  .prmap-site-dot { fill: #F0484A; }
.prmap-site:hover .prmap-site-dot, .prmap-site.is-hot .prmap-site-dot, .prmap-site:focus .prmap-site-dot { r: calc(5px / var(--prz, 1)); stroke: #fff; stroke-width: 1.4; }
.prmap-site:focus { outline: none; }
