/* A local, source-labelled electoral map. Colours distinguish shapes, not parties. */
.rn-constituency-map { --map-region-blue:#c2d4ed; --map-region-sage:#d5dfcf; --map-region-sand:#eadcb6; --map-region-clay:#e7c8bc; --map-region-lilac:#cbcbe0; --map-region-aqua:#bfdcda; --map-region-hover:#a4bbdb; --map-label-halo:#ffffffa6; margin-top:var(--space-6); padding:var(--space-5); min-width:0; overflow:hidden; }
.rn-map-heading { display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); margin-bottom:var(--space-4); }
.rn-resident .rn-map-heading h2 { margin:0; font-size:var(--text-xl); line-height:1.3; }
.rn-map-eyebrow { display:block; margin:0 0 var(--space-1); color:var(--fg-muted); font-size:var(--text-xs); font-weight:600; letter-spacing:.04em; line-height:1.5; }
.rn-map-heading-icon { display:grid; place-items:center; width:var(--space-10); height:var(--space-10); border-radius:var(--radius-md); background:var(--accent-soft); color:var(--accent); flex-shrink:0; }
.rn-map-layout { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:var(--space-6); align-items:center; }
.rn-map-visual,.rn-map-sidebar { min-width:0; }
.rn-map-canvas { position:relative; padding:var(--space-5) var(--space-2) var(--space-1); border:var(--hairline) solid var(--border); border-radius:var(--radius-md); background-color:var(--surface-subtle); background-image:radial-gradient(var(--neutral-200) .65px,transparent .65px); background-size:12px 12px; isolation:isolate; }
.rn-map-place { position:absolute; left:var(--space-3); top:var(--space-2); color:var(--fg-muted); font-size:.625rem; font-weight:600; letter-spacing:.08em; pointer-events:none; }
.rn-map-north { position:absolute; right:var(--space-3); top:var(--space-2); display:grid; color:var(--fg-muted); font-size:.625rem; font-weight:600; line-height:1.1; text-align:center; pointer-events:none; }
.rn-map-north span { font-size:var(--text-lg); }
.rn-constituency-svg { display:block; width:100%; height:auto; max-height:360px; overflow:visible; }
.rn-map-region { stroke:var(--neutral-0); stroke-width:1.4; stroke-linejoin:round; cursor:pointer; transition:fill var(--dur-fast) var(--ease-out); }
.rn-map-fill-0 { fill:var(--map-region-blue); }
.rn-map-fill-1 { fill:var(--map-region-sage); }
.rn-map-fill-2 { fill:var(--map-region-sand); }
.rn-map-fill-3 { fill:var(--map-region-clay); }
.rn-map-fill-4 { fill:var(--map-region-lilac); }
.rn-map-fill-5 { fill:var(--map-region-aqua); }
.rn-map-region:hover { fill:var(--map-region-hover); stroke:var(--accent); }
.rn-map-region.is-selected { fill:var(--accent); stroke:var(--accent-hover); stroke-width:2; }
.rn-map-outline { fill:none; stroke:var(--navy); stroke-opacity:.55; stroke-width:1.2; pointer-events:none; stroke-linejoin:round; }
.rn-map-code { fill:var(--fg); font-family:var(--font); font-size:30px; font-weight:650; paint-order:stroke; stroke:var(--map-label-halo); stroke-width:4px; stroke-linejoin:round; pointer-events:none; }
.rn-map-code.is-crowded,.rn-map-code.is-near-selected { display:none; }
.rn-map-code.is-selected { display:inline; fill:var(--accent-fg); stroke:var(--accent); stroke-width:8px; }
.rn-map-legend { display:flex; align-items:center; flex-wrap:wrap; column-gap:var(--space-3); row-gap:var(--space-1); padding:var(--space-2) 0 0; color:var(--fg-muted); font-size:.6875rem; line-height:1.5; }
.rn-map-legend>span { display:inline-flex; align-items:center; gap:var(--space-1); }
.rn-map-boundary-key,.rn-map-selected-key { display:block; width:10px; height:10px; flex:0 0 10px; border:1px solid var(--navy); border-radius:2px; background:var(--map-region-sage); }
.rn-map-selected-key { background:var(--accent); border-color:var(--accent); }
.rn-map-legend .rn-map-vintage { margin-left:auto; font-weight:550; }
.rn-map-selection { min-height:120px; }
.rn-resident .rn-map-selection h3 { margin:0 0 var(--space-2); color:var(--fg); font-size:var(--text-2xl); line-height:1.25; letter-spacing:-.025em; overflow-wrap:anywhere; }
.rn-map-selection p { margin:0; font-size:var(--text-sm); line-height:1.55; color:var(--fg-muted); max-width:48ch; }
.rn-map-control { margin-top:var(--space-4); }
.rn-map-control label { display:block; color:var(--fg); font-size:var(--text-xs); font-weight:600; margin-bottom:var(--space-2); }
.rn-map-select-row { display:flex; align-items:center; gap:var(--space-2); }
.rn-map-select-row select { min-width:0; width:100%; min-height:44px; padding:var(--space-2) var(--space-3); border:var(--hairline) solid var(--control-border); border-radius:var(--radius-sm); background:var(--surface); color:var(--fg); font-family:var(--font); font-size:var(--text-sm); box-shadow:var(--control-shadow); cursor:pointer; }
.rn-map-select-row select:hover { border-color:var(--accent); }
.rn-map-clear { display:grid; place-items:center; flex:0 0 44px; width:44px; min-height:44px; padding:0; border:var(--hairline) solid var(--border); border-radius:var(--radius-sm); color:var(--fg-muted); background:var(--surface); transition:background var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out); }
.rn-map-clear:hover:not(:disabled) { color:var(--accent); background:var(--accent-soft); border-color:var(--accent); }
.rn-map-clear:active:not(:disabled) { transform:translateY(1px); }
.rn-map-clear:disabled { opacity:.4; }
.rn-map-actions { display:flex; gap:var(--space-2); margin-top:var(--space-3); }
.rn-resident .rn-map-actions .btn { flex:1; justify-content:center; padding:var(--space-2) var(--space-3); gap:var(--space-2); min-height:44px; font-size:var(--text-xs); white-space:normal; line-height:1.3; }
.rn-map-actions .btn svg { flex-shrink:0; }
.rn-map-about { margin-top:var(--space-3); border-top:var(--hairline) solid var(--border); }
.rn-map-about summary { display:flex; align-items:center; justify-content:space-between; gap:var(--space-2); min-height:44px; padding:var(--space-2) 0; cursor:pointer; color:var(--fg-muted); font-size:var(--text-xs); list-style:none; }
.rn-map-about summary::-webkit-details-marker { display:none; }
.rn-map-about summary:hover { color:var(--accent); }
.rn-map-about summary svg { transition:transform var(--dur-fast) var(--ease-out); }
.rn-map-about[open] summary svg { transform:rotate(180deg); }
.rn-map-about p { color:var(--fg-muted); font-size:var(--text-xs); line-height:1.5; margin:0 0 var(--space-2); }
.rn-map-about a { display:flex; align-items:center; gap:var(--space-2); min-height:44px; max-width:100%; color:var(--accent); font-size:var(--text-xs); text-decoration:underline; text-underline-offset:3px; overflow-wrap:anywhere; }
.rn-map-select-row select:focus-visible,.rn-map-clear:focus-visible,.rn-map-actions .btn:focus-visible,.rn-map-about summary:focus-visible,.rn-map-about a:focus-visible { outline:var(--ring) solid var(--focus); outline-offset:var(--space-1); }
@media (max-width:767px) {
  .rn-constituency-map { margin-top:var(--space-4); padding:var(--space-3); }
  .rn-map-heading { margin-bottom:var(--space-3); }
  .rn-resident .rn-map-heading h2 { font-size:var(--text-lg); }
  .rn-map-heading .rn-map-eyebrow { font-size:.625rem; }
  .rn-map-layout { grid-template-columns:minmax(0,1fr); gap:var(--space-3); }
  .rn-map-canvas { padding-top:var(--space-4); }
  .rn-constituency-svg { max-height:280px; }
  .rn-map-code { display:none; }
  .rn-map-code.is-selected { display:inline; }
  .rn-map-legend { column-gap:var(--space-2); }
  .rn-map-legend .rn-map-vintage { margin-left:auto; }
  .rn-map-selection { min-height:0; }
  .rn-map-selection .rn-map-eyebrow { margin-bottom:var(--space-1); }
  .rn-resident .rn-map-selection h3 { font-size:var(--text-xl); margin-bottom:var(--space-1); }
  .rn-map-selection p { font-size:var(--text-xs); line-height:1.5; }
  .rn-map-control { margin-top:var(--space-3); }
  .rn-map-control label { margin-bottom:var(--space-1); }
  .rn-map-select-row select { font-size:var(--text-base); }
  .rn-map-actions { margin-top:var(--space-2); }
  .rn-map-about { margin-top:var(--space-2); }
}
@media (max-width:359px) {
  .rn-map-legend .rn-map-vintage { flex-basis:100%; margin-left:0; }
  .rn-resident .rn-map-actions .btn { padding-inline:var(--space-2); gap:var(--space-1); }
}
@media (prefers-reduced-motion:reduce) {
  .rn-map-region,.rn-map-clear,.rn-map-about summary svg { transition:none; }
}