.map-help{font-size:.875rem;color:var(--muted);margin:0 0 12px;line-height:1.65}
.map-quick-areas{display:flex;justify-content:flex-end;margin-bottom:12px}
.map-quick-areas button{min-height:44px;padding:9px 14px;border:1px solid var(--line);border-radius:8px;background:#fff;font:500 .875rem/1.4 'DM Sans',sans-serif;color:var(--ink)}
.map-quick-areas button[aria-pressed=true]{background:var(--navy);border-color:var(--navy);color:#fff}
.map-frame{border:1px solid #d8d3e3;border-radius:14px;background:#f8f7fc;overflow:hidden}
#ncr-map{width:100%;max-width:540px;margin:auto}
.ncr-area-image{display:block;width:100%;height:auto;touch-action:pan-y}
.ncr-section{cursor:pointer;outline:none}
.section-shape{stroke:#fff;stroke-width:2;fill:#ded5ec;stroke-linejoin:round;transition:fill .15s,stroke .15s}
.ncr-section.quebec .section-shape{fill:#dddfe9}
.ncr-section.no-samples .section-shape{fill:#eeecf3;stroke:#ddd7e7;stroke-dasharray:4 3}
.section-label{fill:#263956;font:600 18px/1.4 'DM Sans',sans-serif;pointer-events:none}
.section-count{fill:#5b5970;font:500 14px/1.4 'DM Sans',sans-serif;pointer-events:none}
.ncr-section:hover .section-shape{fill:#c6b3df}
.ncr-section[aria-pressed=true] .section-shape{fill:#6e4b8d;stroke:#4e316b;stroke-width:3;stroke-dasharray:none}
.ncr-section[aria-pressed=true] .section-label,.ncr-section[aria-pressed=true] .section-count{fill:#fff}
.ncr-section:focus-visible .section-shape{stroke:#203553;stroke-width:4;stroke-dasharray:5 3}
.schematic-river{stroke:#aecbdc;stroke-width:12;stroke-linecap:round;pointer-events:none}
.river-label{fill:#304c66;font:500 12px 'DM Sans',sans-serif;paint-order:stroke;stroke:#f8f7fc;stroke-width:3;pointer-events:none}
.north-label{fill:#59677b;font:500 13px 'DM Sans',sans-serif;pointer-events:none}
.map-selection{font-size:.875rem;font-weight:600;line-height:1.6;margin:12px 0 6px;overflow-wrap:anywhere}
.map-detail-note{font-size:.75rem;line-height:1.6;color:var(--muted);margin:6px 0}
#map-list{margin:12px 0 0}
#map-list>summary{display:list-item;font-size:.875rem;min-height:44px;padding:10px 0;cursor:pointer}
#map-list .chips{margin-top:10px}
@media(max-width:640px){.map-quick-areas{justify-content:stretch}.map-quick-areas button{width:100%;min-height:48px}.map-frame{margin-left:-8px;margin-right:-8px}.section-label{font-size:19px}.section-count{font-size:15px}#map-list>summary{min-height:48px}}
@media(prefers-reduced-motion:reduce){.section-shape{transition:none}}

/* Detached area choices keep the core diagram at a readable phone size. */
.outer-areas{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:4px 14px 18px}
.outer-area{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0;min-height:96px;padding:10px 6px;border:1px dashed #c4b8d5;border-radius:12px;background:#eeecf3;color:#263956;font:500 14px/1.4 'DM Sans',sans-serif}
.outer-area strong{font-size:19px;font-weight:600}
.outer-direction{font-size:12px;color:#627085}
.outer-count{font-size:13px;color:#5b5970}
.outer-area:hover{background:#c6b3df}
.outer-area[aria-pressed=true]{background:#6e4b8d;border:1px solid #4e316b;color:#fff}
.outer-area[aria-pressed=true] span{color:#fff}
.outer-area:focus-visible{outline:3px solid #203553;outline-offset:3px}

