:root { --ink:#15233b; --muted:#59677d; --paper:#f7f8f5; --panel:#fff; --line:#d7deea; --navy:#16345f; --blue:#1d5e98; --teal:#087e8b; --gold:#e1a83a; --rust:#be5a38; --missing:#c8cbd1; --focus:#111827; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font:400 1rem/1.55 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:#074b8e; text-underline-offset:.16em; }
a:hover { color:#092f5f; }
a:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible, [tabindex="0"]:focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
.page-shell { max-width:1440px; margin:auto; padding:2rem clamp(1rem,4vw,4.5rem) 4rem; }
.masthead { max-width:900px; padding:1.5rem 0 2rem; }
h1,h2,h3,p { margin-top:0; }
h1 { max-width:16ch; margin-bottom:.5rem; color:var(--navy); font-size:clamp(2.2rem,5vw,4.7rem); line-height:1.02; letter-spacing:-.045em; }
h2 { color:var(--navy); font-size:clamp(1.45rem,2.5vw,2.15rem); line-height:1.15; }
h3 { font-size:1.08rem; line-height:1.25; }
.lede { max-width:68ch; font-size:1.2rem; color:#33415a; }
.source-line,.muted { color:var(--muted); font-size:.92rem; }
.eyebrow,.section-kicker { margin-bottom:.35rem; color:var(--blue); font-size:.78rem; font-weight:750; letter-spacing:.1em; text-transform:uppercase; }
.skip-link { position:absolute; left:1rem; top:-5rem; z-index:10; padding:.7rem 1rem; background:var(--focus); color:#fff; }
.skip-link:focus { top:1rem; }
.explorer,.county-data,.downloads,.notes { margin-top:1.5rem; padding:clamp(1rem,3vw,2rem); background:var(--panel); border:1px solid var(--line); border-radius:16px; box-shadow:0 8px 30px rgba(22,52,95,.05); }
.explorer-heading,.section-heading { display:flex; align-items:start; justify-content:space-between; gap:1rem; }
.explorer-heading h2,.section-heading h2 { margin-bottom:0; }
.status { max-width:28rem; margin:.2rem 0 0; color:var(--muted); text-align:right; }
.controls { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem .75rem; margin:1.4rem 0; padding:1rem; background:#f3f6fa; border-radius:10px; }
.controls label { font-weight:700; }
.controls select,.controls input { min-height:2.6rem; padding:.45rem .65rem; color:var(--ink); background:#fff; border:1px solid #9facbd; border-radius:6px; font:inherit; }
.controls input { min-width:min(100%,18rem); }
.map-grid { display:grid; grid-template-columns:minmax(0,1.75fr) minmax(250px,.65fr); gap:1rem; }
.map-panel,.details-panel,.distribution { padding:1rem; border:1px solid var(--line); border-radius:10px; }
.map-heading { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; }
.map-heading p { margin-bottom:1rem; color:var(--muted); font-size:.88rem; text-align:right; }
.county-map { display:block; width:100%; max-height:620px; min-height:320px; background:#eef3f5; border-radius:7px; }
.county { stroke:#fff; stroke-width:.65; vector-effect:non-scaling-stroke; cursor:pointer; transition:opacity .12s,stroke-width .12s; }
.county:hover,.county.is-hovered,.county.is-selected { stroke:#0c1e37; stroke-width:2.2; }
.county.is-filtered { opacity:.22; }
.county.missing { fill:var(--missing); stroke-dasharray:2 1; }
.legend { display:flex; flex-wrap:wrap; gap:.35rem 1rem; padding-top:.8rem; color:#41506a; font-size:.82rem; }
.legend-item { display:flex; align-items:center; gap:.35rem; }
.legend-swatch { width:1.1rem; height:1.1rem; border:1px solid rgba(0,0,0,.16); border-radius:2px; }
.details-panel { min-height:14rem; background:#fcfcfb; }
.details-panel dl { display:grid; grid-template-columns:auto 1fr; gap:.35rem .8rem; margin:1rem 0 0; }
.details-panel dt { color:var(--muted); }
.details-panel dd { margin:0; font-weight:700; text-align:right; }
.county-data { margin-top:1.5rem; }
.distribution { margin:1.2rem 0; }
.distribution h3 { margin-bottom:.65rem; }
.distribution-bars { display:grid; grid-template-columns:repeat(5,1fr); gap:.6rem; }
.distribution-bin { min-height:7rem; display:flex; flex-direction:column; justify-content:end; gap:.3rem; color:#3e4e66; font-size:.78rem; }
.distribution-fill { min-height:4px; background:var(--blue); border-radius:3px 3px 0 0; }
.table-wrap { overflow:auto; max-height:35rem; border:1px solid var(--line); border-radius:8px; }
table { width:100%; min-width:740px; border-collapse:collapse; font-size:.9rem; }
caption { padding:.75rem; color:var(--muted); text-align:left; }
th,td { padding:.65rem .75rem; border-top:1px solid var(--line); text-align:left; white-space:nowrap; }
th { position:sticky; top:0; z-index:1; background:#edf2f8; color:var(--navy); }
th button { padding:0; color:inherit; border:0; background:transparent; font:inherit; font-weight:750; cursor:pointer; }
tbody tr:hover,tbody tr:focus-within { background:#f0f6fb; }
.county-link { color:#073e78; font-weight:700; }
.value-missing { color:#4a4d55; font-style:italic; text-decoration:underline dotted; text-underline-offset:.18em; }
.moe { color:var(--muted); font-size:.8em; }
.downloads ul { display:flex; flex-wrap:wrap; gap:.7rem 1.5rem; padding-left:1.2rem; }
.notes { max-width:980px; }
.notes p:last-child { margin-bottom:0; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:800px) { .page-shell { padding-top:1rem; } .map-grid { grid-template-columns:1fr; } .status { text-align:left; } .explorer-heading,.section-heading,.map-heading { display:block; } .map-heading p { text-align:left; } .county-map { min-height:280px; } }
@media (max-width:480px) { .page-shell { padding-inline:.65rem; } .explorer,.county-data,.downloads,.notes { padding:1rem; border-radius:10px; } .controls { display:grid; grid-template-columns:minmax(0,1fr); } .controls select,.controls input { min-width:0; width:100%; } .distribution-bars { gap:.3rem; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }