/* Atkinson Hyperlegible Next (Braille Institute, SIL OFL 1.1, fonts/OFL-Atkinson-Hyperlegible-Next.txt): the site's
   one sans, self-hosted, Latin subsets only. Georgia stays on the homepage hero (home-scene.css). Experiment, Oct 28, 2026. */
@font-face{font-family:"Atkinson Hyperlegible Next";font-style:normal;font-weight:200 800;font-display:swap;src:url(/fonts/atkinson-next-latin-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Atkinson Hyperlegible Next";font-style:italic;font-weight:200 800;font-display:swap;src:url(/fonts/atkinson-next-latin-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Atkinson Hyperlegible Next";font-style:normal;font-weight:200 800;font-display:swap;src:url(/fonts/atkinson-next-latin-ext-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Atkinson Hyperlegible Next";font-style:italic;font-weight:200 800;font-display:swap;src:url(/fonts/atkinson-next-latin-ext-italic.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* Shared wayfinding across every concept destination. */
body .atlas-header,body.map-page .atlas-header{display:flex!important;position:relative;inset:auto;width:100%;max-width:none;height:104px;min-height:104px;align-items:center;justify-content:space-between;padding:20px 5%;margin:0;background:#f8f8f2;border:0;border-bottom:1px solid #cbd0cb;gap:25px;box-sizing:border-box;z-index:20}
.atlas-header .atlas-brand{display:flex;align-items:center;gap:20px;text-decoration:none;color:#092c46}.atlas-header .atlas-brand img{width:64px!important;height:64px!important;min-width:64px;object-fit:contain}.atlas-header .atlas-brand span{font:400 12px/1.4 "Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif;letter-spacing:0}.atlas-header nav{display:flex!important;gap:25px;font:400 13px/1.5 "Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif}.atlas-header nav a{display:block!important;color:#092c46;text-decoration:none;padding:7px 0;white-space:nowrap}.atlas-header nav a[aria-current=page]{box-shadow:0 2px 0 #c70043}.atlas-header nav a:hover{text-decoration:underline}.atlas-header nav a[aria-current=page]:hover{text-decoration:none}.atlas-header nav a[aria-current=page]:focus-visible{box-shadow:none}.atlas-header a:focus-visible{outline:2px solid #c70043;outline-offset:5px}
.section-head{margin:20px 0!important}.section-head h1,.reference-hero h1{font-size:32px!important;letter-spacing:-.035em!important;font-weight:550!important;line-height:1.2!important;margin:0!important}.screen:not(#home){padding-top:24px}.reference-hero{margin:24px 0 32px!important;align-items:center!important}.reference-search label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.page-tabs{margin-top:20px!important}.overview{margin-top:15px}.chart-note{font-size:12px}.sources{margin-top:20px}.reference-page a.resource-action,.reference-page .agency-website a,.reference-page .contact-line a,.reference-page .source-row a,.reference-page #downloads a,.reference-page .directory li>a,.issue-search~ul a,.question-list a{color:#0759b5!important;text-decoration:underline!important;text-underline-offset:3px}.source-row a:empty:after{content:'Open source'}.source-row h3 a{font-size:13px!important;margin-left:6px}.directory .resource-action{font-size:16px}.agency-website{line-height:1.9}
.issue-search{max-width:780px;margin:28px 0 12px}.issue-search label{font-size:16px}.issue-search>div{display:flex;border-bottom:1px solid #718894}.issue-search input{flex:1;min-width:0;font:inherit;padding:14px 0;border:0;background:none}.issue-search button{background:#092c46;color:white;border:0;padding:8px 20px;cursor:pointer}.issue-prompts{display:flex;flex-wrap:wrap;gap:16px}.issue-prompts button{padding:5px 0;border:0;border-bottom:1px solid #879da9;background:none;font-size:13px;cursor:pointer}#issue-status{font-size:13px}#issue-results{list-style:none;padding:0;max-width:850px;display:grid;grid-template-columns:1fr 1fr;gap:20px 35px}#issue-results:empty{display:none}#issue-results li{font-size:15px}#issue-results small{display:block;color:#53636a;font-size:12px;margin-top:4px}.issue-layout{margin-top:32px}.issue-context .eyebrow{display:none}
body.map-page .graph-controls{height:58px;min-height:58px;max-width:none;padding:7px 5%;justify-content:flex-end;background:#f8f8f2;border:0;position:relative;z-index:19}body.map-page main{height:calc(100dvh - 162px)}.graph-search-dock{display:none!important}.map-page #canvas,.map-page.mapping-focus #canvas{bottom:100px}.graph-orientation{position:absolute;bottom:48px;left:50%;transform:translateX(-50%);width:min(520px,calc(100% - 40px));text-align:center;z-index:6}.graph-orientation p{font-size:13px;margin:0 0 8px}.graph-orientation .graph-tools{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}.graph-tools input{width:165px;font:inherit;font-size:12px;background:transparent;border:0;border-bottom:1px solid #718894;padding:7px 0}.graph-tools button,.graph-tools a{font-size:12px;color:#0759b5;text-decoration:underline;background:none;border:0;padding:5px;cursor:pointer}.graph-demo-note{font-size:13px!important;color:#092c46}#graph .edge.demo-edge{opacity:.85!important;stroke-width:3;pointer-events:none;animation:demo-reveal 700ms ease-out}#graph .demo-node .node-label{opacity:1}#graph .demo-node .node-shape{stroke-width:3}@keyframes demo-reveal{from{opacity:0}to{opacity:.85}}
@media(max-width:1100px){body.map-page main{height:auto}.graph-orientation{position:relative;bottom:auto;left:auto;transform:none;margin:18px auto 25px}.map-page #canvas,.map-page.mapping-focus #canvas{bottom:auto}.map-page .graph-area{display:flex;flex-direction:column}.map-page .graph-toolbar{margin-bottom:15px}}
@media(max-width:650px){body .atlas-header,body.map-page .atlas-header{height:130px;min-height:130px;padding:14px 6%;display:flex!important;flex-wrap:wrap;gap:12px}.atlas-header .atlas-brand img{width:52px!important;height:52px!important;min-width:52px}.atlas-header .atlas-brand{gap:12px}.atlas-header .atlas-brand span{font-size:11px}.atlas-header nav{width:100%;gap:0;justify-content:space-between;font-size:12px}.atlas-header nav a:first-child{display:block!important}.reference-hero{gap:18px!important}.reference-hero h1,.section-head h1{font-size:28px!important}.reference-search{margin-top:15px}.reference-header{padding-bottom:14px}#issue-results{grid-template-columns:1fr}.graph-controls .header-actions{gap:6px}.graph-controls .header-actions button{font-size:11px}.graph-controls #government{font-size:12px;max-width:180px}.map-page .graph-controls{padding:5px 6%;height:auto;min-height:58px}.map-page main{height:auto}.graph-tools{gap:9px!important}}
@media(prefers-reduced-motion:reduce){#graph .edge.demo-edge{animation:none}}

.atlas-header .atlas-brand img{margin:0!important}.atlas-header nav a{font-family:"Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif!important}

body:not(.home-view) main h1{font-size:32px!important;line-height:1.2!important;letter-spacing:-.035em!important}body:not(.home-view) .reference-hero h1{margin:0!important}

/* Seven destinations, shared across every page. */
.atlas-header nav{gap:18px;flex-wrap:wrap}.fact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 48px;margin:32px 0 45px}.fact-grid h2{font-size:24px;font-weight:500;letter-spacing:0;margin:0 0 14px}.fact-grid p{font-size:16px;line-height:1.6;max-width:42ch}.fact-grid a{color:#0759b5;text-decoration:underline;text-underline-offset:4px;font-size:15px}.fact-grid .stat-value{font-size:36px}.fact-meta,.fact-note{font-size:12px!important;color:#53636a}
@media(max-width:1100px){body .atlas-header{height:auto;min-height:104px;flex-wrap:wrap}.atlas-header nav{gap:10px 20px}.fact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){body .atlas-header,body.map-page .atlas-header{height:auto;min-height:130px}.atlas-header nav{justify-content:flex-start;gap:5px 18px}.fact-grid{grid-template-columns:1fr;gap:28px}.fact-grid h2{font-size:22px}}

/* Citizen dashboard: clear purpose, three actions, one shared navigation. */
#home .hero{display:block;padding:42px 0 36px}#home .hero h1{font-size:clamp(30px,4.5vw,70px);line-height:1.14;font-weight:600;letter-spacing:0;white-space:nowrap}#home .dashboard-intro{font-size:18px;line-height:1.5;max-width:65ch;margin:22px 0 0;color:#53636a}#home .entry-links{margin-bottom:40px}#home .entry-links>a{padding-top:34px;padding-bottom:38px}#home .entry-links strong{font-size:clamp(24px,2.5vw,36px);letter-spacing:0}#home .entry-links small{font-size:15px}.entry-links .atlas-primary strong{color:#c70043}
.map-page .graph-search-dock{display:block!important;bottom:46px}.graph-search-cue{display:none}.map-page #canvas,.map-page.mapping-focus #canvas{bottom:250px}.graph-orientation{bottom:215px}.graph-orientation .graph-tools{gap:15px}
@media(max-width:1100px){.map-page .graph-search-dock{position:relative;inset:auto;transform:none;width:min(620px,100%);margin:12px auto 24px;padding:0 20px;box-sizing:border-box}.graph-orientation{position:relative;inset:auto;transform:none;margin:16px auto 8px}.map-page #canvas,.map-page.mapping-focus #canvas{bottom:auto}}
@media(max-width:650px){#home .hero{padding:28px 0}#home .hero h1{font-size:clamp(29px,6vw,39px);white-space:normal}#home .dashboard-intro{font-size:16px}#home .entry-links>a{padding:24px 0}#home .entry-links strong{font-size:27px}}

/* Issue search lives in Get help; the graph retains only its office finder. */
.map-page .graph-search-dock{display:none!important}.map-page #canvas,.map-page.mapping-focus #canvas{bottom:100px}.graph-orientation{bottom:48px}
@media(max-width:1100px){.map-page #canvas,.map-page.mapping-focus #canvas{bottom:auto}.graph-orientation{bottom:auto}}

/* Landing page v2: the promise, the proof, the three starting points, one live example */
#home .home-kicker span{letter-spacing:.18em}
#home .hero h1{white-space:normal!important;font-size:clamp(40px,6.2vw,96px)!important;line-height:1.02!important;max-width:15ch;letter-spacing:-.01em!important}
#home .hero h1 em{font-style:normal;color:#c70043}
#home .dashboard-intro{font-size:clamp(18px,1.8vw,23px)!important;max-width:44ch!important;margin-top:20px!important}
#home .home-proof{list-style:none;display:flex;flex-wrap:wrap;gap:10px 28px;margin:0 0 36px;padding:14px 0;border-top:1px solid #cbd0cb;border-bottom:1px solid #cbd0cb;font-size:15px;color:#53636a}
#home .home-proof strong{font-size:24px;color:#092c46;font-weight:600;margin-right:6px}
#home .home-chain{display:grid;gap:12px;margin:40px 0 20px;padding:22px 24px;border:1.5px solid #092c46;border-radius:16px;background:#fff;text-decoration:none;color:#092c46;transition:box-shadow .2s,transform .2s}
#home .home-chain:hover{transform:translateY(-2px);box-shadow:0 4px 0 #092c46}
#home .home-chain-q{font-size:clamp(20px,2.2vw,28px);font-weight:600}
#home .home-chain-steps{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
#home .home-chain-steps span{border:1.5px solid #092c46;border-radius:99px;padding:7px 13px;font-size:15px;font-weight:500;animation:chain-in .45s ease-out both}
#home .home-chain-steps i{font-style:normal;color:#c70043;font-weight:700;animation:chain-in .45s ease-out both}
#home .home-chain-steps .you{background:#c70043;border-color:#c70043;color:#fff}
#home .home-chain-steps>*:nth-child(1){animation-delay:.2s}#home .home-chain-steps>*:nth-child(2){animation-delay:.35s}#home .home-chain-steps>*:nth-child(3){animation-delay:.5s}#home .home-chain-steps>*:nth-child(4){animation-delay:.65s}#home .home-chain-steps>*:nth-child(5){animation-delay:.8s}#home .home-chain-steps>*:nth-child(6){animation-delay:.95s}#home .home-chain-steps>*:nth-child(7){animation-delay:1.1s}#home .home-chain-steps>*:nth-child(8){animation-delay:1.25s}#home .home-chain-steps>*:nth-child(9){animation-delay:1.4s}
#home .home-chain-cta{font-size:15px;font-weight:600;text-decoration:underline;text-decoration-color:#c70043;text-underline-offset:4px}
@keyframes chain-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){#home .home-chain-steps>*{animation:none}}
@media(max-width:650px){#home .home-proof{gap:6px 18px}#home .home-proof strong{font-size:20px}#home .home-chain{padding:18px}}

/* Keep these handy: phone contact and public-meeting calendar (v2) */
.keep-handy{margin:56px 0 24px}
.keep-handy .kh-kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#c70043;font-weight:600;margin:0 0 8px}
.keep-handy h2{font-size:clamp(30px,3.6vw,52px);line-height:1.05;font-weight:600;margin:0 0 22px;color:#092c46}
.kh-grid{display:grid;gap:18px;grid-template-columns:1fr}
@media(min-width:900px){.kh-grid{grid-template-columns:1fr 1fr}}
.kh-card{background:#fff;border:1.5px solid #092c46;border-radius:16px;padding:22px 24px;display:flex;flex-direction:column;gap:12px}
.kh-card h3{font-size:22px;line-height:1.2;margin:0;color:#092c46}
.kh-card p{margin:0;font-size:16px;line-height:1.5;color:#2c3e4c}
.kh-label{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#53636a;font-weight:600}
#kh-district{font:inherit;font-size:16px;padding:12px;border:1.5px solid #092c46;border-radius:10px;background:#f8f8f2;color:#092c46;min-height:48px}
.kh-primary{font:inherit;font-size:18px;font-weight:600;color:#fff;background:#c70043;border:0;border-radius:12px;padding:15px 18px;min-height:54px;cursor:pointer;box-shadow:0 4px 0 #9a0034;transition:transform .15s,box-shadow .15s}
.kh-primary:hover{transform:translateY(-1px);box-shadow:0 5px 0 #9a0034}.kh-primary:active{transform:translateY(3px);box-shadow:0 1px 0 #9a0034}
.kh-numbers summary{cursor:pointer;font-weight:600;color:#092c46;min-height:40px;display:flex;align-items:center}
.kh-numbers ul{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:10px}
.kh-numbers li{display:grid;grid-template-columns:auto 1fr;column-gap:12px;font-size:15px}
.kh-numbers li a{font-weight:700;color:#092c46;white-space:nowrap}
.kh-numbers li .kh-or{color:#53636a}
.kh-numbers li strong{grid-column:1/-1}.kh-numbers li span:last-child{grid-column:1/-1;color:#53636a}
.kh-numbers li{grid-template-columns:1fr}
.kh-meetings{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.kh-meetings li{display:grid;gap:4px;padding:12px 0;border-top:1px solid #cbd0cb}
.kh-meetings li strong{font-size:18px;color:#092c46}.kh-meetings li>span:not(.kh-cal){color:#53636a;font-size:15px}
.kh-cal{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.kh-btn{display:inline-flex;align-items:center;min-height:42px;padding:9px 14px;border:1.5px solid #092c46;border-radius:99px;font-size:14px;font-weight:600;color:#092c46;text-decoration:none;background:#fff}
.kh-btn:hover{background:#092c46;color:#fff}
.kh-note{font-size:13px!important;color:#53636a!important}
.kh-note a{color:#092c46}
.kh-steps{margin:0;padding:0;list-style:none;counter-reset:kh;display:grid;gap:8px}
.kh-steps li{counter-increment:kh;position:relative;padding-left:38px;font-size:15px;line-height:1.45;color:#2c3e4c}
.kh-steps li::before{content:counter(kh);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;background:#092c46;color:#fff;font-weight:700;font-size:13px;display:grid;place-items:center}
.fast-facts{margin-top:18px;background:#092c46;color:#fff;border-radius:16px;padding:26px 28px 20px}
.fast-facts h3{margin:0 0 20px;font-size:clamp(22px,2.4vw,30px);line-height:1.15;color:#fff}
.fast-facts ol{margin:0;padding:0;list-style:none;counter-reset:ff;display:grid;gap:18px 28px;grid-template-columns:1fr}
@media(min-width:700px){.fast-facts ol{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1100px){.fast-facts ol{grid-template-columns:repeat(5,minmax(0,1fr))}}
.fast-facts li{counter-increment:ff;display:grid;grid-template-columns:auto 1fr;column-gap:10px;row-gap:6px;align-content:start}
.fast-facts li::before{content:counter(ff);grid-row:1;font-size:22px;font-weight:700;line-height:1.1;color:#ff5c8a}
.fast-facts li strong{grid-row:1;align-self:center;font-size:16px;line-height:1.25;color:#fff}
.fast-facts li span{grid-column:1/-1;font-size:15px;line-height:1.45;color:#d6dee6}
.fast-facts a{color:#fff;text-decoration:underline;text-decoration-color:#ff5c8a;text-underline-offset:3px}
.fast-facts .ff-sources{margin:20px 0 0;padding-top:12px;border-top:1px solid rgba(255,255,255,.18);font-size:12px;line-height:1.5;color:#a9b6c3}
.fast-facts .ff-sources a{color:#c9d3dc;text-decoration-color:rgba(255,92,138,.6)}

/* The landing: one question, one hook, three doors. Everything else is one tap deeper (v2). */
#home.landing{min-height:calc(100vh - 220px);display:flex;flex-direction:column;justify-content:center;padding:56px 0 40px!important;max-width:1100px;margin:0 auto}
#home .landing-hero{text-align:center;margin:0 auto 44px;max-width:820px}
#home .landing-hero h1{font-size:clamp(42px,6.4vw,92px)!important;line-height:1.02!important;font-weight:650!important;letter-spacing:-.025em!important;color:#092c46;margin:0!important;white-space:normal!important;max-width:none}
#home .landing-sub{font-size:clamp(18px,2vw,24px);color:#44566b;margin:18px 0 0}
#home .landing-hook{font-size:clamp(16px,1.6vw,19px);font-weight:600;color:#c70043;margin:14px 0 0;letter-spacing:.01em}
#home .landing-doors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media(max-width:820px){#home .landing-doors{grid-template-columns:1fr}}
#home .landing-doors a{display:flex;flex-direction:column;gap:6px;padding:26px 24px;border:1.5px solid #092c46;border-radius:18px;background:#fff;text-decoration:none;color:#092c46;transition:transform .18s cubic-bezier(.2,.7,.2,1),box-shadow .18s}
#home .landing-doors a:hover,#home .landing-doors a:focus-visible{transform:translateY(-3px);box-shadow:0 5px 0 #092c46}
#home .landing-doors a:active{transform:translateY(2px);box-shadow:0 1px 0 #092c46}
#home .landing-doors strong{font-size:clamp(20px,2vw,24px);line-height:1.2}
#home .landing-doors span{font-size:15px;color:#53636a}
#home .landing-more{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 12px;margin-top:28px;font-size:15px;color:#8a97a6}
#home .landing-more a{color:#092c46;text-decoration:underline;text-decoration-color:rgba(199,0,67,.5);text-underline-offset:4px;min-height:36px;display:inline-flex;align-items:center}
@media(prefers-reduced-motion:reduce){#home .landing-doors a{transition:none}}
#act .home-proof{margin-top:8px}

/* Landing, simplified: one bold question, three words. Nothing else competes. */
#home.landing{min-height:calc(100vh - 180px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:48px;padding:40px 0!important;text-align:center}
#home .landing-question{font-size:clamp(52px,9vw,132px)!important;line-height:.98!important;font-weight:700!important;letter-spacing:-.035em!important;color:#092c46;margin:0!important;white-space:normal!important;max-width:11ch}
#home .landing-words{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 44px}
#home .landing-words a{font-size:clamp(22px,2.4vw,30px);font-weight:600;color:#092c46;text-decoration:none;padding:6px 2px;border-bottom:3px solid transparent;transition:border-color .2s,color .2s}
#home .landing-words a:hover,#home .landing-words a:focus-visible{border-bottom-color:#c70043;color:#c70043}
@media(prefers-reduced-motion:reduce){#home .landing-words a{transition:none}}

/* Your LA: one question, one box. Minimal. (v2) */
#home .landing-top{text-align:center}
#home .landing-answer{font-size:clamp(24px,3vw,40px);font-weight:700;letter-spacing:-.02em;color:#092c46;opacity:.55;margin:10px 0 0}
#home .your-la{display:flex;width:min(560px,100%);border:2px solid #092c46;border-radius:999px;background:#fff;overflow:hidden}
#home .your-la input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:19px;padding:16px 22px;color:#092c46;outline:none}
#home .your-la button{border:0;background:#092c46;color:#fff;font-size:22px;width:64px;cursor:pointer}
#home .your-la button:hover{background:#c70043}
#home .your-la button:disabled{opacity:.5}
#home .your-la:focus-within{box-shadow:0 0 0 4px rgba(9,44,70,.12)}
#home .your-la-sub{margin:-30px 0 0;font-size:14px;color:#53636a}
#home .your-la-sub .link-button{font-size:14px;color:#092c46;padding:4px 2px}
#home .your-la-status{margin:-30px 0 0;min-height:1em;font-size:15px;color:#44566b}
#home .your-la-status:empty{display:none}
#home .your-la-result{width:min(560px,100%);text-align:left}
#home .your-place{font-size:18px;color:#44566b;margin:0 0 14px;text-align:center}
#home .your-la-result ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
#home .your-la-result li{display:grid;gap:2px;padding:16px 20px;background:#fff;border:1.5px solid #092c46;border-radius:16px}
#home .your-la-result li span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#53636a;font-weight:600}
#home .your-la-result li strong{font-size:24px;color:#092c46}
#home .your-la-result li em{font-style:normal;color:#53636a}
#home .your-la-result li a{color:#092c46;font-weight:600}
#home .your-next{display:flex;justify-content:space-between;align-items:center;margin:14px 4px 0}
#home .your-next a{color:#c70043;font-weight:700;text-decoration:none}
#home .landing-words a{font-size:clamp(17px,1.8vw,21px)!important}
/* Footer: one item bottom-left, one bottom-right, always on one line. */
footer.site-foot{display:flex!important;flex-direction:row!important;justify-content:space-between;align-items:center;gap:16px;flex-wrap:nowrap}
footer.site-foot a{color:inherit}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* The landing intro: question → what you'll get → your move. Under two seconds, once per visit. */
#home .landing-words{gap:14px 56px!important}
#home .landing-words .lw{display:flex;flex-direction:column;align-items:center;gap:10px}
#home .landing-words svg{width:48px;height:48px;overflow:visible}
#home .landing-words .ic{fill:none;stroke:#092c46;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
#home .landing-words .ic.dot{fill:#092c46}
#home .landing-words .ic.red{stroke:#c70043;stroke-width:2.6}
#home .landing-words .lw:hover .ic:not(.red),#home .landing-words .lw:focus-visible .ic:not(.red){stroke:#c70043}
#home .link-button{font:inherit;background:none;border:0;padding:4px 2px;color:#092c46;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
@media(prefers-reduced-motion:no-preference){
  #home.intro .landing-question{animation:ca-rise .55s cubic-bezier(.2,.7,.2,1) both}
  #home.intro .landing-answer{animation:ca-fade .5s ease-out .45s both}
  #home.intro .lw{animation:ca-rise .45s cubic-bezier(.2,.7,.2,1) both}
  #home.intro .lw-1{animation-delay:.8s}#home.intro .lw-2{animation-delay:.95s}#home.intro .lw-3{animation-delay:1.1s}
  #home.intro .draw{stroke-dasharray:40;stroke-dashoffset:40;animation:ca-draw .5s ease-out forwards}
  #home.intro .lw-1 .draw{animation-delay:1.1s}#home.intro .lw-2 .draw{animation-delay:1.25s}#home.intro .lw-3 .draw{animation-delay:1.4s}
  #home.intro .rise{animation:ca-hand .5s cubic-bezier(.2,.7,.2,1) 1.35s both}
  #home.intro .your-la,#home.intro .your-la-sub{animation:ca-rise .5s cubic-bezier(.2,.7,.2,1) 1.5s both}
  #home.skip-intro *{animation-duration:0s!important;animation-delay:0s!important}
  .lw:hover .draw{animation:ca-draw .45s ease-out both!important}
}
@keyframes ca-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes ca-fade{from{opacity:0}to{opacity:1}}
@keyframes ca-draw{from{stroke-dashoffset:40}to{stroke-dashoffset:0}}
@keyframes ca-hand{from{transform:translateY(8px);opacity:.3}to{transform:none;opacity:1}}

/* Softer: no heavy outlines on the address box or the results. */
#home .your-la{border:0!important;box-shadow:0 1px 2px rgba(9,44,70,.08),0 6px 24px rgba(9,44,70,.08)!important}
#home .your-la:focus-within{box-shadow:0 0 0 3px rgba(9,44,70,.14),0 6px 24px rgba(9,44,70,.08)!important}
#home .your-la button{border-radius:999px;width:52px;height:52px;margin:5px;align-self:center}
#home .your-la-result ul{gap:28px!important}
#home .your-la-result li{border:0!important;background:transparent!important;padding:0!important;gap:4px!important}
#home .your-la-result li .your-role{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#53636a;font-weight:600}
#home .your-la-result li strong{font-size:28px!important}
#home .your-tags{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:8px 0 4px}
#home .your-tags span{font-size:13px;color:#53636a;margin-right:4px}
#home .your-tags b{font-weight:600;font-size:13px;color:#092c46;background:rgba(9,44,70,.07);border-radius:999px;padding:5px 10px}
#home .your-line{margin:4px 0 0;font-size:15px;color:#44566b;line-height:1.45}
#home .your-line span{font-weight:700;color:#092c46;margin-right:6px}
#home .your-line a{color:#092c46;font-weight:600}
#home .landing-words .lw{flex-direction:row!important}

/* Spotify-style packing: filled chips, one pill, a row of face cards. No outlines. (v2) */
#home.landing{gap:26px!important;justify-content:flex-start!important;padding-top:48px!important;max-width:720px;margin:0 auto}
#home .landing-question{max-width:13ch}
#home .topic-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:640px}
#home .topic-chips a{background:rgba(9,44,70,.08);color:#092c46;text-decoration:none;font-weight:700;font-size:16px;padding:12px 18px;border-radius:12px;transition:background .15s,transform .15s}
#home .topic-chips a:hover,#home .topic-chips a:focus-visible{background:rgba(9,44,70,.15)}
#home .topic-chips a:active{transform:scale(.97)}
#home .your-la{width:min(640px,100%)!important;background:rgba(9,44,70,.06)!important;box-shadow:none!important}
#home .your-la:focus-within{background:#fff!important;box-shadow:0 0 0 3px rgba(9,44,70,.14)!important}
#home .your-la-sub{margin:-14px 0 0!important}
#home .people{width:100%;text-align:left}
#home .people h2{font-size:22px;font-weight:700;color:#092c46;margin:6px 0 12px}
#home .people-row{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;-webkit-overflow-scrolling:touch}
#home .person-card{flex:0 0 132px;scroll-snap-align:start;text-align:left;text-decoration:none;color:#092c46;background:none;border:0;padding:0;font:inherit;cursor:pointer;display:flex;flex-direction:column;gap:3px}
#home .pc-photo{position:relative;display:grid;place-items:center;width:132px;height:132px;border-radius:12px;background:#092c46;overflow:hidden}
#home .pc-initials{font-size:40px;font-weight:700;color:#f8f8f2;letter-spacing:.02em}
#home .pc-badge{position:absolute;left:8px;bottom:8px;font-size:11px;font-weight:700;letter-spacing:.04em;color:#092c46;background:#f8f8f2;border-radius:6px;padding:3px 6px}
#home .person-card strong{font-size:15px;line-height:1.2;margin-top:6px}
#home .pc-sub{font-size:13px;color:#53636a;text-decoration:none}
#home a.pc-sub{color:#092c46;font-weight:600}
#home .person-card[aria-pressed="true"] .pc-photo{box-shadow:0 0 0 3px #c70043}
#home .your-detail h3{font-size:18px;color:#092c46;margin:4px 0 6px}
#home .your-place{text-align:left!important;margin:0 0 10px!important;font-size:16px!important}
@media(prefers-reduced-motion:no-preference){
  #home.intro .topic-chips{animation:ca-rise .45s cubic-bezier(.2,.7,.2,1) .8s both}
  #home.intro .your-la,#home.intro .your-la-sub{animation-delay:1.05s!important}
  #home.intro .people{animation:ca-rise .45s cubic-bezier(.2,.7,.2,1) 1.25s both}
}

/* Landing: only the question, the hook, the address. Results arrive as podcast-style rows. */
#home.landing{justify-content:center!important;min-height:calc(100vh - 200px)!important}
#home .your-la-result{width:min(760px,100%)!important;margin-top:8px}
#home .your-people-title{font-size:24px;font-weight:700;color:#092c46;margin:6px 0 14px;text-align:left}
#home .pr{display:grid;grid-template-columns:132px minmax(0,1fr);gap:18px;align-items:start;padding:16px 0;border-top:1px solid rgba(9,44,70,.1)}
#home .pr-tile{position:relative;width:132px;height:132px;border-radius:12px;background:#092c46;overflow:hidden;display:grid;place-items:center}
#home .pr-initials{font-size:44px;font-weight:700;color:rgba(248,248,242,.9)}
#home .pr-overlay{position:absolute;left:0;right:0;bottom:0;padding:8px 10px;background:linear-gradient(to top,rgba(9,44,70,.95),rgba(9,44,70,0));display:grid;line-height:1.15}
#home .pr-overlay small{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#f4b6c8;font-weight:700}
#home .pr-overlay b{font-size:15px;color:#fff}
#home .pr-body h3{margin:0 0 8px;font-size:22px;color:#092c46;line-height:1.15}
#home .pr-pills{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}
#home .pr-pills span{font-size:13px;font-weight:600;color:#092c46;background:rgba(9,44,70,.07);border-radius:999px;padding:5px 11px}
#home .pr-contact{margin:0 0 6px;font-size:15px}
#home .pr-contact a,#home .pr-line a{color:#092c46;font-weight:600}
#home .pr-line{margin:2px 0 0;font-size:14px;color:#53636a;line-height:1.45}
#home .pr-line b{color:#092c46}
@media(max-width:520px){#home .pr{grid-template-columns:96px minmax(0,1fr);gap:14px}#home .pr-tile{width:96px;height:96px}#home .pr-initials{font-size:32px}#home .pr-body h3{font-size:19px}}
#home .pr-tile{place-items:start center!important}
#home .pr-initials{margin-top:16%;line-height:1}
#home .your-la-alt{margin:-18px 0 0;font-size:14px}
#home .your-la-alt .link-button{font-size:14px;color:#53636a}
@media(max-width:520px){#home .pr-initials{margin-top:12%}#home .pr-overlay{padding:6px 8px}#home .pr-overlay small{font-size:9.5px}#home .pr-overlay b{font-size:13px}}
#home .pr-actions{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 0}
#home .pr-btn{display:inline-flex;align-items:center;min-height:40px;padding:8px 16px;border-radius:999px;font-size:14px;font-weight:700;text-decoration:none;color:#092c46;background:rgba(9,44,70,.08)}
#home .pr-btn.primary{background:#092c46;color:#fff}
#home .pr-btn:hover{background:rgba(9,44,70,.16)}#home .pr-btn.primary:hover{background:#c70043}

/* Desktop fit: the question, the hook and the address box all on the first screen, no scroll. */
#home .landing-question{font-size:clamp(44px,5.6vw,88px)!important;max-width:16ch!important;line-height:1!important}
#home .landing-answer{font-size:clamp(20px,2.2vw,32px)!important;margin-top:12px!important}
#home.landing{min-height:calc(100vh - 170px)!important;gap:30px!important;padding:24px 0!important}
@media(max-height:760px) and (min-width:700px){#home .landing-question{font-size:clamp(40px,4.8vw,72px)!important}}
/* The address box is there the moment the page opens; only the headline gets a quick, subtle fade. */
#home.intro .your-la,#home.intro .your-la-sub,#home.intro .your-la-alt{animation:none!important}
@media(prefers-reduced-motion:no-preference){#home.intro .landing-question{animation-duration:.35s!important}#home.intro .landing-answer{animation-delay:.1s!important;animation-duration:.35s!important}}
/* No animation on the landing page for now: it simply appears, like a search page. */
#home,#home *{animation:none!important}
/* Directory tabs on the Organization and Stats screens. */
.root-tabs{display:flex;flex-wrap:wrap;gap:6px 22px;margin:8px 0 18px;font-size:15px}
.root-tabs a{color:#53636a;text-decoration:none;padding:6px 0;border-bottom:2px solid transparent}
.root-tabs a[aria-current="page"]{color:#092c46;border-bottom-color:#c70043}

/* Desktop hero (Sept 30, 2026): "Who actually runs LA?" on one line, the hook on one line.
   Phones keep "Who actually runs Los Angeles?" */
#home .lq-short{display:none}
#home .landing-question span{color:inherit}
@media(min-width:900px){
  #home .lq-long{display:none}
  #home .lq-short{display:inline}
  #home .landing-question{max-width:none!important;white-space:nowrap!important;font-size:clamp(56px,6.4vw,104px)!important}
  #home .landing-answer{white-space:nowrap}
}
/* Side gutter: the address box and result rows never touch the screen edge */
#home #your-la,#home #your-la-result{box-sizing:border-box;max-width:calc(100vw - 32px);margin-left:auto;margin-right:auto}
/* Under the address box: one choice, one treatment (Sept 30, 2026) */
#home .your-la-sub{margin-top:-14px!important;font-size:15px!important}
#home .your-la-sub .link-button{font-size:15px!important;font-weight:500;color:#092c46!important;text-decoration:none!important;padding:8px 6px}
#home .your-la-sub .link-button:hover{text-decoration:underline!important;text-underline-offset:4px}
/* "Use my location" reads as a link that belongs to the box: a location arrow, underlined, tucked close */
#home .your-la-sub{margin-top:-22px!important}
#home .your-la-sub .link-button{display:inline-flex;align-items:center;gap:7px;text-decoration:underline!important;text-decoration-color:rgba(9,44,70,.3)!important;text-underline-offset:4px}
#home .your-la-sub .link-button:hover{text-decoration-color:#c70043!important}
#home .loc-icon{flex:none;color:#c70043}
/* A small official photo in place of the initials tile; the role moves to a quiet line above the name */
#home .pr-photo{width:88px;height:88px;border-radius:12px;object-fit:cover;background:#e9ecee;display:block}
#home .pr-role{margin:0 0 2px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:#53636a}
@media(max-width:520px){#home .pr-photo{width:72px;height:72px}}
#home .pr:has(.pr-photo){grid-template-columns:88px minmax(0,1fr)}
@media(max-width:520px){#home .pr:has(.pr-photo){grid-template-columns:72px minmax(0,1fr)}}
#home .pr{grid-template-columns:88px minmax(0,1fr)!important}
@media(max-width:520px){#home .pr{grid-template-columns:72px minmax(0,1fr)!important}}
#home .pr-initials-tile{background:#092c46;color:rgba(248,248,242,.9);display:grid;place-items:center;font-size:28px;font-weight:700}
@media(max-width:520px){#home .pr-initials-tile{font-size:23px}}
/* Feedback (Oct 2026 test): topics looked like buttons. Topics are now a quiet text line; only real actions look tappable. */
#home .pr-pills{gap:0 10px!important;margin:2px 0 12px!important}
#home .pr-pills span{background:none!important;padding:0!important;border-radius:0!important;font-size:13.5px!important;font-weight:500!important;color:#53636a!important}
#home .pr-pills span+span::before{content:"·";margin-right:10px;color:#b3bcc6}
#home .pr-btn{background:#fff!important;box-shadow:0 1px 2px rgba(9,44,70,.12),0 2px 10px rgba(9,44,70,.08);gap:6px}
#home .pr-btn:hover{background:#f1f3f5!important}
#home .pr-btn.primary{background:#092c46!important;color:#fff;box-shadow:none}
#home .pr-btn.primary:hover{background:#c70043!important}
#home .pr-pills{display:block!important;font-size:13.5px;line-height:1.6;color:#b3bcc6}
#home .pr-pills span+span::before{content:none!important}
/* Hint line under the box: the example runs itself */
#home .your-la-hint{margin:10px 0 0;font-size:14px;color:#53636a}
#home .your-la-hint .link-button{font-size:14px;color:#092c46;padding:2px 0;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(9,44,70,.3)}
/* Roadmaps: numbered steps, one action per step, escalation steps in red */
#home .roadmap{max-width:640px;margin:8px auto 0;text-align:left;padding:18px 0 0;border-top:1px solid rgba(9,44,70,.1)}
#home .rm-kicker{margin:0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:#c70043}
#home .roadmap h2{margin:4px 0 0;font-size:clamp(24px,3.2vw,32px);line-height:1.15;color:#092c46;letter-spacing:-.015em}
#home .rm-lead{margin:8px 0 4px;font-size:16px;line-height:1.5;color:#53636a}
#home .rm-steps{list-style:none;margin:14px 0 0;padding:0;position:relative}
#home .rm-step{display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;padding:0 0 22px;position:relative}
#home .rm-step:not(:last-child)::after{content:"";position:absolute;left:17px;top:38px;bottom:4px;width:2px;background:rgba(9,44,70,.12)}
#home .rm-n{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#092c46;color:#fff;font-weight:700;font-size:15px}
#home .rm-escalate .rm-n{background:#c70043}
#home .rm-when{margin:0;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:#53636a}
#home .rm-step h3{margin:2px 0 0;font-size:18px;color:#092c46}
#home .rm-step p{margin:4px 0 0;font-size:15px;line-height:1.5;color:#33434f}
#home .rm-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px!important}
#home .rm-btn{display:inline-flex;align-items:center;min-height:40px;padding:8px 15px;border-radius:999px;font-size:14px;font-weight:700;text-decoration:none;color:#092c46;background:#fff;box-shadow:0 1px 2px rgba(9,44,70,.12),0 2px 10px rgba(9,44,70,.08)}
#home .rm-btn.primary{background:#092c46;color:#fff;box-shadow:none}
#home .rm-btn:hover{background:#f1f3f5}#home .rm-btn.primary:hover{background:#c70043}
#home .rm-note{font-size:13.5px!important;color:#53636a!important}
#home .rm-notes{margin:0 0 14px;padding:12px 16px 12px 32px;background:rgba(9,44,70,.05);border-radius:12px;font-size:14px;line-height:1.5;color:#33434f}
#home .rm-foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:4px 0 0;font-size:12.5px;color:#53636a;line-height:1.5}
#home .rm-foot a{color:inherit}
#home .rm-save{font:inherit;font-size:14px;font-weight:700;color:#fff;background:#c70043;border:0;border-radius:999px;padding:10px 16px;cursor:pointer}
#home .rm-save:hover{background:#a80039}
#home .rm-tip{margin-top:8px!important;padding:10px 12px;border-radius:10px;background:rgba(199,0,67,.06);font-size:14px!important}
#home .rm-tip b{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#c70043;margin-bottom:2px}
/* Prep helper */
#home .rh{margin-top:12px;padding:14px;border-radius:14px;background:rgba(9,44,70,.05)}
#home .rh-title{margin:0 0 10px!important;font-weight:700;color:#092c46!important;font-size:15px!important}
#home .rh-title span{font-weight:500;color:#53636a;font-size:12px;margin-left:6px}
#home .rh-row{display:flex;flex-wrap:wrap;gap:8px;margin:0!important}
#home .rh-photo{cursor:pointer}
#home .rh-status{min-height:1.2em;font-size:13.5px!important;color:#53636a!important;margin:8px 0!important}
#home .rh-field{display:block;margin:8px 0 0}
#home .rh-field span{display:block;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:#53636a;margin-bottom:4px}
#home .rh-field input,#home .rh-field select{width:100%;box-sizing:border-box;font:inherit;font-size:16px;border:0;border-radius:10px;padding:10px 12px;background:#fff;color:#092c46}
#home .rh-two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media(max-width:520px){#home .rh-two{grid-template-columns:1fr}}
#home .rh-out{margin-top:12px;padding:12px;border-radius:12px;background:#fff}
#home .rh-label{margin:0!important;font-size:11.5px!important;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:#c70043!important}
#home .rh-script{margin:6px 0 10px!important;font-size:16px!important;line-height:1.5;color:#092c46!important}
/* Roadmap, round 2: ask once, tap to choose, one record fills every step */
#home .rm-whose{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0 0}
#home .rm-choice{font:inherit;font-size:16px;font-weight:700;min-height:52px;border:0;border-radius:14px;background:rgba(9,44,70,.06);color:#092c46;cursor:pointer}
#home .rm-choice.on{background:#092c46;color:#fff}
#home .rm-quick{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}
#home .rm-resume{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:rgba(9,44,70,.05);font-size:14px;color:#33434f}
#home .rm-resume .link-button{font-size:14px}
#home .rm-why{font-size:13px!important;color:#53636a!important;margin-top:2px!important}
#home .rh-chips{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 0}
#home .rh-chip{font:inherit;font-size:14px;font-weight:600;min-height:40px;padding:8px 13px;border:0;border-radius:999px;background:#fff;color:#092c46;cursor:pointer;box-shadow:0 1px 2px rgba(9,44,70,.12)}
#home .rh-chip.on{background:#092c46;color:#fff;box-shadow:none}
#home p.rh-field{margin:12px 0 0!important}
#home .rh-private{margin:8px 0 0!important;font-size:12px!important;color:#53636a!important}
#home .rm-sr input{max-width:260px}
#home .rm-hold{margin-top:8px!important;font-size:14px!important;color:#092c46!important;font-weight:600}
/* Wide screens: the graph is pinned in its area, so start it below the "Your LA" bar instead of under it */
@media(min-width:1101px){.map-page #atlas-address{position:relative;z-index:6}.map-page #canvas,.map-page.mapping-focus #canvas{top:60px}}
/* "Made by a neighbor, for the neighborhood": a small human signature in the footer */
.nb-mark{display:inline-flex;align-items:center;gap:6px;color:#53636a}
.nb-house{color:#c70043;flex:none}
@media(max-width:620px){footer.site-foot{flex-wrap:wrap!important;justify-content:center!important;text-align:center;row-gap:6px}footer.site-foot .nb-mark{order:-1;flex-basis:100%;justify-content:center}}
#home .your-la-hint{padding:0 16px;box-sizing:border-box;max-width:100%}
/* The neighbor note: handwriting plus three navy pen doodles (peace, heart hands, raised hands) */
.nb-mark{font-family:"Nothing You Could Do",cursive;font-size:16px;color:#092c46;gap:6px}
.nb-doodles{display:inline-flex;gap:3px}
.nb-doodles svg{fill:none;stroke:#092c46;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
footer.site-foot .nb-mark{display:inline-block!important;white-space:nowrap;text-align:center}
.nb-doodles{vertical-align:-3px;margin-left:5px}
@media(max-width:620px){footer.site-foot .nb-mark{font-size:14.5px;display:block!important}.nb-doodles svg{width:15px;height:15px}}
/* The neighbor note lives with the brand at the top of Home; the footer stays all type */
.atlas-brand .brand-text{display:flex;flex-direction:column;gap:2px;line-height:1.2}
.atlas-brand .nb-mark{display:inline-flex!important;align-items:center;white-space:nowrap;font-size:15px;color:#092c46}
.atlas-brand .nb-doodles{margin-left:6px;vertical-align:0}
.atlas-brand .nb-doodles svg{width:15px;height:15px}
footer.site-foot{justify-content:flex-start!important;gap:10px!important}
footer.site-foot .foot-dot{color:#b3bcc6}
@media(max-width:650px){.atlas-brand .nb-mark{font-size:13.5px}.atlas-brand .nb-doodles svg{width:13px;height:13px}footer.site-foot{justify-content:center!important}}
.atlas-header .atlas-brand .nb-mark,.atlas-header .atlas-brand .nb-mark *{font-family:"Nothing You Could Do",cursive!important;letter-spacing:0!important;text-transform:none!important}
.atlas-header .atlas-brand .nb-mark{font-size:16px!important;font-weight:400!important}
@media(max-width:650px){.atlas-header .atlas-brand .nb-mark{font-size:14.5px!important}}
.atlas-brand .nb-l2{white-space:nowrap;display:inline-flex;align-items:center}
@media(max-width:650px){.atlas-header .atlas-brand .nb-mark{display:block!important;white-space:normal;line-height:1.25}.atlas-brand .nb-l2{display:inline-flex}}
.atlas-header .atlas-brand .nb-mark .nb-l2{font-size:inherit!important;color:inherit!important}
/* Home: the logo and the neighbor note side by side, the note centered on the logo */
.atlas-brand .brand-note{justify-content:center;align-self:center}
/* A touch smaller beside the logo (Oct 1, 2026) */
.atlas-header .atlas-brand .nb-mark{font-size:14.5px!important}
.atlas-brand .nb-doodles svg{width:14px;height:14px}
@media(max-width:650px){.atlas-header .atlas-brand .nb-mark{font-size:13px!important}.atlas-brand .nb-doodles svg{width:12px;height:12px}}
/* Doodles on their own row, right-aligned to the end of "neighborhood" */
.atlas-header .atlas-brand .nb-mark{display:inline-block!important;white-space:normal}
.atlas-brand .nb-l2{display:inline}
.atlas-header .atlas-brand .nb-doodles{display:flex!important;justify-content:flex-end;gap:3px;margin:2px 0 0;vertical-align:0}
/* Three lines like a signed note: line, line, then the doodles as the sign-off at the far right */
.atlas-header .atlas-brand .nb-mark .nb-l2{display:block!important;white-space:nowrap}
.atlas-header .atlas-brand .nb-mark{line-height:1.3!important}
/* Grounded to the logo: the note fills the same height as the logo, first line at its top, sign-off at its bottom */
.atlas-header .atlas-brand .nb-mark{display:flex!important;flex-direction:column;justify-content:space-between;height:64px;line-height:1.05!important;font-size:16.5px!important;padding:1px 0 0}
.atlas-header .atlas-brand .nb-mark .nb-l2{margin-top:-14px}
.atlas-header .atlas-brand .nb-doodles svg{width:16px;height:16px}
@media(max-width:650px){.atlas-header .atlas-brand .nb-mark{height:52px;font-size:14px!important}.atlas-header .atlas-brand .nb-mark .nb-l2{margin-top:-10px}.atlas-header .atlas-brand .nb-doodles svg{width:13px;height:13px}}
/* Three rows that span exactly the logo's height: line one at the top, sign-off at the bottom, right-aligned */
.atlas-header .atlas-brand .nb-mark{display:inline-grid!important;grid-template-rows:auto auto auto;align-content:space-between;justify-items:start;height:64px;line-height:1.15!important;padding:0}
.atlas-header .atlas-brand .nb-mark .nb-l2{margin-top:0!important;display:block!important}
.atlas-header .atlas-brand .nb-doodles{justify-self:end;display:inline-flex!important;margin:0!important}
@media(max-width:650px){.atlas-header .atlas-brand .nb-mark{height:52px}}
.atlas-header .atlas-brand .nb-mark{gap:0!important;row-gap:0!important}
.atlas-header .atlas-brand .nb-mark .nb-l2{line-height:inherit!important}
/* Neighbor note, quieter: smaller, centered on the logo instead of matching its height */
.atlas-header .atlas-brand .nb-mark{height:auto!important;font-size:11.5px!important;line-height:1.25!important;opacity:.85}
.atlas-header .atlas-brand .nb-doodles{margin-top:2px!important}
.atlas-header .atlas-brand .nb-doodles svg{width:11px!important;height:11px!important}
@media(max-width:650px){.atlas-header .atlas-brand .nb-mark{font-size:10.5px!important}.atlas-header .atlas-brand .nb-doodles svg{width:10px!important;height:10px!important}}
/* Neighbor note, lowered: the two written lines center on the logo's middle (between CIVIC and ATLAS) */
.atlas-header .atlas-brand .nb-mark{position:relative;top:8px}
@media(max-width:650px){.atlas-header .atlas-brand .nb-mark{top:6px}}
/* Edition line: its own row at the very bottom left of the page */
footer.site-foot{flex-wrap:wrap!important}
footer.site-foot .foot-edition{flex-basis:100%;text-align:left;font-size:12px;color:#53636a;margin-top:4px}
/* Neighbor note on phones: a bit larger and heavier so it reads (the font has one weight, so a hairline stroke thickens it) */
@media(max-width:650px){.atlas-header .atlas-brand .nb-mark{font-size:12px!important;opacity:1;-webkit-text-stroke:.35px #092c46}.atlas-header .atlas-brand .nb-doodles svg{width:11px!important;height:11px!important;stroke-width:1.9}}
@media(max-width:650px){.atlas-header .atlas-brand .nb-mark{top:5px}}
/* Atlas on wide screens: give the graph back the height of the "Your LA" row by moving that row up into the
   empty middle of the instruction row, and shrink the space reserved at the bottom (the legend fits between
   the corner controls). Only where there's room: narrower screens keep the stacked layout. */
@media(min-width:1500px){
 .map-page .graph-area .atlas-address{position:absolute;top:-58px;left:50%;transform:translateX(-50%);width:max-content!important;max-width:none;right:auto;margin:0;padding:10px 0;z-index:6;white-space:nowrap}
 .map-page #canvas,.map-page.mapping-focus #canvas{top:6px;bottom:64px}
}
/* Home results: "Your corner" (historic district, BID, LAPD) and a visible note when the supervisor didn't load. */
#home .your-missing{margin:0;padding:14px 0;border-top:1px solid rgba(9,44,70,.1);font-size:15px;color:#53636a}
#home .your-corner{padding:18px 0 4px;border-top:1px solid rgba(9,44,70,.1)}
#home .your-corner-h{margin:0 0 8px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#53636a;font-weight:700}
#home .your-corner dl{margin:0}
#home .your-corner dl>div{display:grid;grid-template-columns:132px minmax(0,1fr);gap:18px;padding:10px 0}
#home .your-corner dt{font-size:13px;font-weight:700;color:#53636a;padding-top:2px}
#home .your-corner dd{margin:0;font-size:16px;line-height:1.5;color:#33434f}
#home .your-corner dd b{color:#092c46}
#home .your-corner a,#home .your-corner-note a{color:#092c46;font-weight:600;text-underline-offset:3px;text-decoration-color:rgba(9,44,70,.3);white-space:nowrap}
#home .your-corner-note{margin:6px 0 0;font-size:13px;color:#53636a}
@media(max-width:520px){#home .your-corner dl>div{grid-template-columns:1fr;gap:2px}}
#home .your-corner dl>div{padding:8px 0}#home .your-corner dt{margin:0}#home .your-corner dl>div+div{border-top:1px solid rgba(9,44,70,.06)}
#home .your-corner .yc-line{display:block;margin-top:6px}
/* Atlas usability fixes (Oct 1): nothing opens without a visible way to close it, and nothing covers the buttons. */
/* Tablets and phones: the Atlas header grows when its menu wraps, instead of spilling over the ?, Explore and Menu buttons. */
@media(max-width:1100px){body.map-page .atlas-header{height:auto}}
/* "Two governments" explainer: a close button that stays in reach while scrolling, and a Close button at the end. */
#government-explainer .panel-close{position:sticky;top:0;float:right;margin:-6px -6px 0 8px;width:40px;height:40px;border:0;border-radius:50%;background:#092c46;color:#fff;font-size:24px;line-height:1;cursor:pointer;z-index:2}
#government-explainer .panel-close-wide{font:inherit;font-weight:600;color:#092c46;background:rgba(9,44,70,.08);border:0;border-radius:999px;padding:10px 18px;cursor:pointer}
/* Office profile on phones and tablets: its close button stays visible while scrolling the profile. */
@media(max-width:1100px){#detail .close-detail{position:sticky;top:8px;float:right;z-index:3;width:40px;height:40px;border-radius:50%;background:#092c46;color:#fff;border:0;font-size:24px;line-height:1}#detail{scroll-margin-top:8px}}
.atlas-address .aa-cancel{background:none!important;text-decoration:underline;text-underline-offset:3px;padding:7px 4px!important;width:auto!important;height:auto!important;color:#092c46!important;font-size:14px!important}
/* Atlas: labels that would overlap another are hidden until you hover or focus that office (see declutterLabels). */
#graph .node .node-label.label-crowded{display:none}
#graph .node:hover .node-label.label-crowded,#graph .node:focus .node-label.label-crowded,#graph .node:focus-visible .node-label.label-crowded{display:inline}
/* Home results: send to a neighbor (shares the site, never the address). */
#home .your-share{margin:18px 0 0;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
#home .your-share-btn{font:inherit;font-weight:700;font-size:15px;color:#fff;background:#092c46;border:0;border-radius:999px;padding:11px 18px;cursor:pointer}
#home .your-share-btn:hover{background:#c70043}
#home #your-share-status{font-size:14px;color:#53636a}
/* Home: "A problem inside the place you rent" card. */
#home .home-problem .hp-fork{margin:14px 0 0;padding:14px 16px;border-radius:14px;background:rgba(9,44,70,.05);font-size:16px;line-height:1.55;color:#33434f}
#home .home-problem .hp-steps{margin:18px 0 0;padding-left:22px;font-size:16px;line-height:1.55;color:#33434f}
#home .home-problem .hp-steps li{margin:0 0 12px}
#home .home-problem .hp-steps b,#home .home-problem .hp-note b,#home .home-problem .hp-fork b{color:#092c46}
#home .home-problem .hp-note{margin:10px 0 0;font-size:15px;line-height:1.5;color:#33434f}
#home .home-problem .hp-urgent{padding-top:10px;border-top:1px solid rgba(9,44,70,.1)}
#home .home-problem a{color:#092c46;font-weight:600;text-underline-offset:3px}
#home .home-problem .hp-src{margin:16px 0 0;font-size:12px;line-height:1.6;color:#53636a}
#home .home-problem .hp-src a{font-weight:500;color:#53636a}
#home .home-problem .hp-steps{list-style:decimal!important}
#home .home-problem .hp-steps li{display:list-item!important}
#home .home-problem .hp-steps li>b:first-child{display:block;margin-bottom:2px}
#home .home-problem .hp-steps a,#home .home-problem .hp-note a,#home .home-problem .hp-steps b:not(:first-child){display:inline!important;padding:0!important;margin:0!important;background:none!important;border:0!important;min-height:0!important}
#home .your-clock{margin:12px 0 0;font-size:15px;color:#53636a}
#home .your-clock a{color:#092c46;font-weight:700;text-underline-offset:3px}
/* Atlas: your districts are marked by a navy ring and pale fill (named in the legend), not a "YOURS" text label on the graph.
   Red stays reserved for the path you're tracing. */
#graph .yours-label{display:none}
#graph .council-seat.yours circle:not(.touch-target){fill:#dfe9f2!important;stroke:#092c46!important;stroke-width:2.8!important}
#key-yours b{font-weight:inherit}
/* Atlas on phones and tablets: the credit sits at the end of the page instead of floating over the legend. */
@media(max-width:1100px){.map-page .project-credit{position:static!important;display:block;text-align:right;padding:8px 16px 0;background:none}}
#home .your-corner .yc-seat{padding:10px 12px;margin-top:10px;border-radius:12px;background:rgba(9,44,70,.05)}
#home .your-corner .yc-seat small{color:#53636a;font-size:13px}
/* Home results: State and federal representatives (compact; no portraits, no party labels). */
#home .your-state{padding:18px 0 4px;border-top:1px solid rgba(9,44,70,.1)}
#home .sf-list{list-style:none;margin:0;padding:0}
#home .sf-list li{display:grid;grid-template-columns:200px minmax(0,1fr);column-gap:18px;padding:9px 0;border-top:1px solid rgba(9,44,70,.06);font-size:16px;line-height:1.45;color:#33434f}
#home .sf-list li:first-child{border-top:0}
#home .sf-role{grid-row:span 3;font-size:13px;font-weight:700;color:#53636a;padding-top:2px}
#home .sf-list b{color:#092c46}
#home .sf-note{display:block;font-size:13px;color:#53636a}
#home .sf-act{display:block}
#home .sf-act a{color:#092c46;font-weight:600;text-underline-offset:3px}
#home .sf-act small{color:#53636a}
#home .sf-foot{margin:8px 0 0;font-size:13px;color:#53636a}
@media(max-width:520px){#home .sf-list li{grid-template-columns:1fr}#home .sf-role{grid-row:auto}}
#home .sf-list .sf-note,#home .sf-list .sf-act,#home .sf-list .sf-act *,#home .sf-foot{text-transform:none!important;letter-spacing:normal!important;font-weight:400}
#home .sf-list .sf-act a{font-weight:600}
#home .sf-list .sf-note{font-size:14px;color:#53636a;margin:2px 0}
#home .sf-list .sf-role{text-transform:uppercase;letter-spacing:.08em;font-size:12px}
/* Home headline (Oct 2): "Find your way through local government." Wider measure so it sits in two lines on desktop. */
#home .landing-question{max-width:19ch!important;margin-left:auto!important;margin-right:auto!important;white-space:normal!important}
#home .landing-answer{max-width:34em;margin-left:auto;margin-right:auto}
#home .landing-question{max-width:22ch!important;font-size:clamp(40px,5vw,78px)!important}
/* Home headline (Oct 2, later): one line on desktop, no line underneath. */
@media(min-width:900px){#home .landing-question{max-width:none!important;white-space:nowrap!important;font-size:clamp(36px,3.9vw,72px)!important}}
@media(max-width:899px){#home .landing-question{max-width:14ch!important;font-size:clamp(36px,9vw,56px)!important}}
/* Desktop: the handwritten neighbor note and its doodles, 5% larger (11.5px → 12.1px; 11px → 11.55px). */
@media(min-width:651px){.atlas-header .atlas-brand .nb-mark{font-size:12.1px!important}.atlas-header .atlas-brand .nb-doodles svg{width:11.55px!important;height:11.55px!important}}
@media(max-width:899px){#home .landing-question{max-width:none!important;font-size:clamp(32px,8.6vw,52px)!important}}
/* Home headline, understated (Oct 2): no periods, lighter weight, a quiet reply underneath. */
#home .landing-question{font-weight:600!important;letter-spacing:-.025em!important}
#home .landing-answer{font-weight:400!important;color:#53636a!important;letter-spacing:0!important;margin-top:10px!important}
/* Home: the neighbor note moves from the header to a handwritten sign-off under the search (Oct 2). */
#home .nb-signoff{margin:26px auto 0;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;text-align:center}
#home .nb-signoff .nb-hand{font-family:"Nothing You Could Do",cursive!important;font-size:19px;color:#092c46;letter-spacing:0;line-height:1.3}
#home .nb-signoff-doodles{display:inline-flex;gap:8px;align-items:center}
#home .nb-signoff-doodles svg{width:22px;height:22px;fill:none;stroke:#092c46;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:520px){#home .nb-signoff .nb-hand{font-size:17px}#home .nb-signoff-doodles svg{width:20px;height:20px}}
/* Home footer on one line (Oct 2): About · Something wrong or missing? Tell us. · a torobelly labs project ©2026 */
footer.site-foot{flex-wrap:wrap!important;justify-content:center!important;gap:6px 10px!important;text-align:center}
footer.site-foot .fb-line{flex-basis:auto!important;order:2;padding:0!important;margin:0!important;font-size:inherit}
footer.site-foot>span:not(.foot-dot):not(.fb-line){order:3}
footer.site-foot .fb-line::before{content:"·";color:#b3bcc6;margin-right:10px}
footer.site-foot .fb-line+*{order:3}
footer.site-foot .foot-dot{display:none!important}
footer.site-foot>span:not(.foot-dot):not(.fb-line)::before{content:"·";color:#b3bcc6;margin-right:10px}
/* v2-80 Callout labels: board and department names sit in the open space beside the graph, tied to their shapes by dotted lines */
#graph .node.called-out .node-label{visibility:hidden}
#graph .node.called-out:hover .node-label,#graph .node.called-out:focus-visible .node-label{visibility:hidden}
#graph .callout-line{fill:none;stroke:#cbd0cb;stroke-width:1;stroke-dasharray:.5 3.5;stroke-linecap:round;pointer-events:none}
#graph .callout-dot{fill:#53636a;pointer-events:none}
#graph .callout-name{font-weight:600;font-family:"Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif;fill:#092c46;stroke:#f8f8f2;stroke-width:.35em;paint-order:stroke;stroke-linejoin:round;cursor:pointer}
#graph .callout-name:hover{text-decoration:underline}
#graph .callout-name.selected{fill:#b0233b}
#graph.callouts-moving #callout-lines,#graph.callouts-moving #callout-names{visibility:hidden}
/* v2-81 Home: the two problems the site answers in place, named under the search so people know they can ask */
#home .your-la-try-line{margin:6px 0 0;font-size:15px;color:#53636a;text-align:center}
#home .your-la-try-line .link-button{font-size:15px;font-weight:500;color:#092c46;padding:8px 4px;text-decoration:underline;text-decoration-color:#cbd0cb;text-underline-offset:4px}
#home .your-la-try-line .link-button:hover{text-decoration-color:#092c46}
#home .your-la-try-line .try-dot{margin:0 4px;color:#9aa5b1}
@media(max-width:600px){#home .your-la-try-line{font-size:14px}#home .your-la-try-line .link-button{font-size:14px}}
#home .your-la-try-line{margin-top:-26px}
@media(max-width:600px){#home .your-la-try-line .try-label{display:block;margin-bottom:-4px}}
/* v2-82 Home: the headline stands alone; the handwritten sign-off sits right under it */
#home .landing-top .nb-signoff{margin:14px auto 0}
#home .landing-top .nb-signoff .nb-hand{font-size:22px}
@media(max-width:520px){#home .landing-top .nb-signoff{margin-top:10px}#home .landing-top .nb-signoff .nb-hand{font-size:18px}}
/* v2-83 Home, desktop: the neighbor note goes back beside the logo; About moves into the nav; the footer keeps only the credit, bottom right */
@media(min-width:651px){
  #home .landing-top .nb-signoff{display:none}
  body:has(#home) footer.site-foot .fb-line,body:has(#home) footer.site-foot>a[href$="about.html"]{display:none!important}
  body:has(#home) footer.site-foot{justify-content:flex-end!important;text-align:right}
  body:has(#home) footer.site-foot>span:not(.foot-dot):not(.fb-line)::before{content:none}
}
@media(max-width:650px){.atlas-header .atlas-brand .nb-header,.atlas-header nav .nav-about{display:none!important}}
/* v2-84 Home, phone: the neighbor note goes back beside the logo too; the headline stands alone; the couch example is larger */
#home .landing-top .nb-signoff{display:none!important}
@media(max-width:650px){
  .atlas-header .atlas-brand .nb-header{display:inline-flex!important}
  #home .your-la-try-line,#home .your-la-try-line .link-button{font-size:17px!important}
}
/* v2-85 Home: a quiet lead-in above the headline */
#home .landing-kicker{margin:0 0 10px;font-size:clamp(20px,2.2vw,30px);font-weight:400;color:#53636a;letter-spacing:0;text-align:center}
@media(max-width:650px){#home .landing-kicker{font-size:20px;margin-bottom:6px}}
/* v2-86 Home: call and response. The question and the answer are the same size; the question is gray and lighter */
#home .landing-kicker{font-weight:500;letter-spacing:-.025em;line-height:1.08;margin:0 0 4px;color:#84909e}
@media(min-width:900px){#home .landing-kicker{font-size:clamp(36px,3.9vw,72px);white-space:nowrap}}
@media(max-width:899px){#home .landing-kicker{font-size:clamp(32px,8.6vw,52px)}}
/* v2-87 Home: "Use my location" tucked under the search; suggested problems as tappable chips */
#home .your-la-sub{margin-top:-30px!important}
#home .your-la-sub .link-button{padding:4px 6px!important;font-size:14px!important}
#home .your-la-try-line{margin-top:-18px!important;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;font-size:14px!important;color:#53636a}
#home .your-la-try-line .try-label{font-size:14px;color:#53636a;margin-right:2px}
#home .try-chip{font:500 15px/1 "Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif;color:#092c46;background:#fff;border:1px solid #cbd0cb;border-radius:999px;padding:9px 14px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center}
#home .try-chip:hover,#home .try-chip:focus-visible{border-color:#092c46;background:#eef2f6}
@media(max-width:650px){#home .your-la-try-line .try-label{flex-basis:100%;text-align:center;margin:0 0 -2px}#home .try-chip{font-size:15px!important;padding:10px 14px}}
/* v2-88 Home: the step-by-step guides are their own entry, under the Suggested answers */
#home .guides-line{margin:-14px 0 0;text-align:center}
#home .guides-line .link-button{font-size:15px;font-weight:600;color:#092c46;text-decoration:underline;text-decoration-color:#cbd0cb;text-underline-offset:4px;padding:6px 4px}
#home .guides-line .link-button:hover{text-decoration-color:#092c46}
#home .guide-list{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:8px}
#home .guide-open{font:600 16px/1.3 "Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif;color:#092c46;background:#fff;border:1px solid #cbd0cb;border-radius:10px;padding:14px 16px;width:100%;text-align:left;cursor:pointer}
#home .guide-open:hover{border-color:#092c46;background:#eef2f6}
/* v2-89 Suggested answers: agency, a call button, one line why. Nothing else competes. */
#home .contact-card h2{margin-bottom:14px}
#home .cc-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}
#home .cc-list li{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 14px;background:#fff;border:1px solid #cbd0cb;border-radius:12px;padding:14px 16px}
#home .cc-agency{font-size:18px;color:#092c46}
#home .cc-list .rm-btn{grid-row:span 2;font-size:16px;min-height:46px;padding:10px 18px;white-space:nowrap}
#home .cc-why{margin:0;font-size:15px;color:#33434f;line-height:1.35}
#home .cc-slo{margin:14px 0 0;padding:14px 16px;border-left:3px solid #092c46;background:#eef2f6;border-radius:0 12px 12px 0}
#home .cc-slo b{font-size:16px;color:#092c46}#home .cc-slo p{margin:4px 0 0;font-size:15px;color:#33434f}
#home .cc-more{margin:16px 0 0;font-size:16px;font-weight:600}
#home .cc-more a,#home .cc-more .link-button{color:#092c46;font-weight:600;font-size:16px}
#home .cc-src{font-size:12px;opacity:.8}
@media(max-width:520px){#home .cc-list li{grid-template-columns:1fr}#home .cc-list .rm-btn{grid-row:auto;justify-content:center;margin:6px 0 2px}}
@media(max-width:650px){#home .guides-line .link-button{font-size:14px}}
/* v2-90 Suggested answers, app-style: contact rows (avatar, name, one line, Call / Website), then short steps */
#home .contact-card{max-width:620px;margin-left:auto;margin-right:auto}
#home .contact-card h2{font-size:26px;margin:0 0 6px}
#home .cc-h{margin:18px 0 8px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#53636a}
#home .cc-list{list-style:none;padding:0;margin:0;background:#fff;border:1px solid #cbd0cb;border-radius:16px;overflow:hidden;display:block}
#home .cc-list li.cc-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border:0;border-radius:0;background:none;border-top:1px solid #eef2f6;margin:0}
#home .cc-list li.cc-row:first-child{border-top:0}
#home .cc-avatar{flex:none;width:40px;height:40px;border-radius:50%;background:#eef2f6;display:grid;place-items:center;font-size:19px}
#home .cc-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
#home .cc-text b{font-size:16px;color:#092c46;line-height:1.25}
#home .cc-text span{font-size:14px;color:#53636a;line-height:1.3}
#home .cc-acts{flex:none;display:flex;gap:6px}
#home .cc-act{font:600 14px/1 "Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif;padding:9px 14px;border-radius:999px;background:#eef2f6;color:#092c46;text-decoration:none;white-space:nowrap}
#home .cc-act.primary{background:#092c46;color:#fff}
#home .cc-act:hover{filter:brightness(.95)}#home .cc-act.primary:hover{background:#c70043;filter:none}
#home .cc-slo{background:#eef2f6!important}
#home .cc-steps{list-style:none;counter-reset:s;padding:0;margin:0;display:grid;gap:0}
#home .cc-steps li{counter-increment:s;position:relative;padding:0 0 14px 38px;font-size:15px;line-height:1.4;color:#33434f}
#home .cc-steps li::before{content:counter(s);position:absolute;left:0;top:0;width:24px;height:24px;border-radius:50%;background:#092c46;color:#fff;font:700 12px/24px "Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif;text-align:center}
#home .cc-steps li:not(:last-child)::after{content:"";position:absolute;left:11.5px;top:26px;bottom:2px;width:1px;background:#cbd0cb}
#home .cc-steps b{color:#092c46}
#home .cc-more{margin:4px 0 0;font-size:15px}
#home .cc-src{font-size:12px;opacity:.75;margin-top:14px}
@media(max-width:520px){#home .contact-card h2{font-size:24px}#home .cc-act{padding:9px 12px}#home .cc-text span{font-size:13.5px}}
/* v2-91 contact cards: shield them from the representative-list styles they sit inside */
#home .contact-card{border-top:1px solid #dfe4e9;padding-top:22px;margin-top:28px;text-align:left}
#home .contact-card h2{color:#092c46;letter-spacing:-.015em;line-height:1.15}
#home .contact-card li,#home .contact-card li span,#home .contact-card li b{text-transform:none!important;letter-spacing:0!important;font-weight:inherit}
#home .contact-card .cc-text b{font-weight:700!important}
#home .contact-card .cc-text span{font-size:14px!important;color:#53636a!important;font-weight:400!important}
#home .contact-card .cc-avatar{font-size:19px!important}
#home .contact-card .cc-act{text-transform:none!important;letter-spacing:0!important;font-size:14px!important}
#home .contact-card .cc-steps li{display:block!important;padding:0 0 14px 38px!important;margin:0!important;grid-template-columns:none!important;border:0!important;background:none!important}
#home .contact-card .cc-steps li b{font-weight:700!important;display:inline!important}
#home .contact-card .cc-steps li i{font-style:normal;font-weight:600;display:inline!important}
#home .contact-card .hp-src{margin-top:14px}
@media(max-width:520px){#home .contact-card .cc-row{flex-wrap:wrap}#home .contact-card .cc-text{flex-basis:calc(100% - 52px)}#home .contact-card .cc-acts{margin-left:52px}}
#home .contact-card .cc-list li.cc-row{padding:12px 14px!important;gap:12px!important;display:flex!important}
#home .contact-card .cc-list{display:block!important;gap:0!important}
@media(min-width:651px){body:has(#home) footer.site-foot>a[href="/about"],body:has(#home) footer.site-foot>a[href$="/about"]{display:none!important}}
/* v2-93 Suggested answers: "Fix it now" / "Change it for good" as a two-part toggle, like an app's segmented control */
#home .cc-tabs{display:flex;gap:4px;padding:4px;margin:8px 0 4px;background:#eef2f6;border-radius:999px;width:max-content;max-width:100%}
#home .cc-tab{font:600 15px/1 "Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif;color:#33434f;background:none;border:0;border-radius:999px;padding:10px 16px;cursor:pointer;white-space:nowrap}
#home .cc-tab.on{background:#fff;color:#092c46;box-shadow:0 1px 3px rgba(9,44,70,.15)}
#home .cc-panel[hidden]{display:none!important}
@media(max-width:520px){#home .cc-tabs{width:100%}#home .cc-tab{flex:1;padding:10px 8px;font-size:14px}}
/* v2-94 Answers on the 5 Ws: a label column (Who, What, Where, When, Why) and a short answer beside it */
#home .cc-w{margin:14px 0 0;display:grid;gap:0}
#home .cc-w>div{display:grid;grid-template-columns:72px 1fr;gap:12px;padding:12px 0;border-top:1px solid #cbd0cb}
#home .cc-w>div:first-child{border-top:0;padding-top:4px}
#home .cc-w dt{font:700 12px/1.9 "Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#53636a}
#home .cc-w dd{margin:0;font-size:15.5px;line-height:1.45;color:#33434f}
#home .cc-w dd b{color:#092c46}
@media(max-width:520px){#home .cc-w>div{grid-template-columns:1fr;gap:4px}}
#home .cc-w>div{align-items:start}#home .cc-w dt{padding-top:2px;line-height:1.4}
/* v2-95 Locked answer template: scope line, the bridge to "Change it for good", the outside-the-City notice, wider labels */
#home .cc-w>div{grid-template-columns:118px 1fr}
#home .cc-scope{margin:2px 0 6px;font-size:14px;color:#53636a}
#home .cc-bridge{margin:16px 0 0;padding:12px 14px;background:#eef2f6;border-radius:12px;font-size:15px;color:#092c46;font-weight:600}
#home .cc-bridge .link-button{font-size:15px;font-weight:600;color:#092c46;text-decoration:underline;text-underline-offset:3px;padding:0 0 0 4px}
#home .cc-away{margin:10px 0 0;padding:14px 16px;border-left:3px solid #092c46;background:#eef2f6;border-radius:0 12px 12px 0;font-size:16px;line-height:1.5;color:#33434f}
@media(max-width:520px){#home .cc-w>div{grid-template-columns:1fr}}
#home .contact-card .cc-w dt{margin:0!important;padding-top:3px!important}#home .contact-card .cc-w dd{margin:0!important}

/* v2-97 Color cleanup with Batch 1 (Oct 3, 2026): small labels moved from Label gray (#53636a, 4.3:1) to Slate (#53636a, 5.9:1); one-off grays and navies mapped to the core palette (handoff/BRAND.md). */
/* v2-98 "Send this answer" sits beside Start over */
#home .contact-card .your-next{color:#53636a}
#home .contact-card .cc-share{font-weight:600;color:#092c46}
/* v2-99 Contrast pass (Oct 3, 2026): small gray text on every page moved to Slate; the Directory's link text to Link blue; "Need something done?" darkened just enough (#84909e, 3.05:1) to pass for large text. */
/* v2-100 The search message sits right under the search box, never over the headline (resident test 001). */
#home .your-la-status{margin:8px 0 0!important;text-align:center;color:#33434f}
/* v2-101 Tap targets (resident test 001): every control is at least 44px tall to tap, without changing how it looks. */
#home .try-chip,#home .cc-tab,#home .contact-card .cc-act{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
#home .contact-card .your-next .link-button,#home .cc-bridge .link-button,#home .guides-line .link-button,#home .your-la-sub .link-button{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:650px){
  .atlas-header nav a{min-height:44px;display:inline-flex;align-items:center;padding-left:6px!important;padding-right:6px!important}
  footer.site-foot a,.fb-line a{display:inline-block;padding:14px 4px;margin:-14px 0}
}
#home .cc-indep{margin:14px 0 0;font-size:13px;color:#53636a}
/* v2-103 "Add it to your calendar" in answers, and the Home "Coming up" strip */
#home .cc-cal{margin:16px 0 0;padding:14px 16px;border:1px solid #cbd0cb;border-radius:12px;background:#fff}
#home .cc-cal p{margin:0;font-size:15px;color:#33434f}
#home .cc-cal b{color:#092c46}
#home .cc-cal-btns{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0!important}
#home .cc-cal-note{margin:10px 0 0!important;font-size:13px!important;color:#53636a!important}
#home .coming-up{margin:-10px auto 0;max-width:620px;text-align:center;font-size:15px;color:#33434f}
#home .coming-up p{margin:4px 0}
#home .coming-up a{color:#092c46;font-weight:600;text-underline-offset:3px}
#home .coming-up .cu-cta{font-size:14px;color:#53636a}
@media(max-width:650px){#home .coming-up .cu-sep{display:block;height:0;overflow:hidden}}
#home .contact-card .your-next{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:4px 10px}
/* v2-105 Independence line on Home and in guides */
#home .indep-line{margin:-14px 0 0;text-align:center;font-size:13px;color:#53636a}
#home .rm-indep{margin:10px 0 0;font-size:13px;color:#53636a}
/* v2-106 Main nav: Home · Civic Crew · Civic Atlas Graph · Directory · About. The election link moves to the Home footer, on every screen size. */
footer.site-foot .foot-links{display:inline-flex;gap:18px;flex-wrap:wrap}
body:has(#home) footer.site-foot .foot-links a{display:inline!important}
@media(min-width:651px){body:has(#home) footer.site-foot{justify-content:space-between!important}}
/* Phones: the five links wrap to a second row */
@media(max-width:430px){.atlas-header nav{column-gap:14px!important;row-gap:0!important;justify-content:flex-start!important;width:100%}.atlas-header nav a{padding:7px 4px!important}}

/* ── v2-107 Type tokens (Home first). One typeface, four sizes, two weights, two text colors.
   display: the one promise per page · title: a section, or the name of an answer · body: every fact, address, deadline
   meta: labels, dates, sources, the independent-guide line. Weight 600 is for headings, names and
   standalone links; everything else is 400. Chips and buttons signal action by their shape, so they stay 400. A fifth size or a third weight doesn't go in. ── */
:root{--t-display:40px;--t-title:22px;--t-body:16px;--t-meta:13px;--w-regular:400;--w-strong:600;--c-ink:#092c46;--c-quiet:#53636a}
@media(max-width:600px){:root{--t-display:30px}}
/* First screen */
#home .landing-kicker,#home .landing-question{font-size:var(--t-display)!important;font-weight:var(--w-strong)!important;line-height:1.1!important;letter-spacing:-.02em!important}
#home .landing-kicker{color:var(--c-quiet)!important}
#home .landing-question{color:var(--c-ink)!important}
#home #your-la input{font-size:var(--t-body)!important;font-weight:var(--w-regular)!important}
#home .your-la-sub .link-button{font-size:var(--t-body)!important;font-weight:var(--w-regular)!important;color:var(--c-ink)!important}
#home .try-label{font-size:var(--t-meta)!important;font-weight:var(--w-regular)!important;color:var(--c-quiet)!important}
#home .try-chip{font-size:var(--t-body)!important;font-weight:var(--w-regular)!important;color:var(--c-ink)!important}
#home .guides-line .link-button{font-size:var(--t-body)!important;font-weight:var(--w-strong)!important;color:var(--c-ink)!important}
#home .coming-up p,#home .coming-up b,#home .coming-up a,#home .coming-up span{font-size:var(--t-meta)!important;color:var(--c-quiet)!important;font-weight:var(--w-regular)!important}
#home .coming-up b,#home .coming-up a{font-weight:var(--w-strong)!important}
#home .coming-up a{color:var(--c-ink)!important}
#home .indep-line{font-size:var(--t-meta)!important;font-weight:var(--w-regular)!important;color:var(--c-quiet)!important}
body:has(#home) footer.site-foot,body:has(#home) footer.site-foot *{font-size:var(--t-meta)!important;font-weight:var(--w-regular)!important;color:var(--c-quiet)!important}
/* Answer cards: the answer's name is the title; who, by when and the number are body; sources are meta.
   One filled object: the Call button. */
#home .your-la-result h2{font-size:var(--t-title)!important;font-weight:var(--w-strong)!important;color:var(--c-ink)!important}
#home .cc-scope,#home .cc-indep{font-size:var(--t-meta)!important;font-weight:var(--w-regular)!important;color:var(--c-quiet)!important}
#home .cc-tab{font-size:var(--t-body)!important;font-weight:var(--w-strong)!important;color:var(--c-quiet)!important}
#home .cc-tab.on{color:var(--c-ink)!important}
#home .cc-w dt{font-size:var(--t-meta)!important;font-weight:var(--w-regular)!important;color:var(--c-quiet)!important}
#home .cc-w dd,#home .cc-w dd span,#home .cc-w dd p,#home .cc-w dd li{font-size:var(--t-body)!important;font-weight:var(--w-regular)!important;color:var(--c-ink)!important}
#home .cc-w dd span:not(:first-child){color:var(--c-quiet)!important}
#home .cc-w dd b,#home .cc-w dd strong{font-size:var(--t-body)!important;font-weight:var(--w-strong)!important;color:var(--c-ink)!important}
#home .cc-act{font-size:var(--t-body)!important;font-weight:var(--w-strong)!important}
#home .cc-act:not(.primary){background:transparent!important;border:1px solid #cbd0cb;color:var(--c-ink)!important}
#home .cc-bridge{font-size:var(--t-body)!important;font-weight:var(--w-regular)!important;color:var(--c-ink)!important;background:none!important;padding-left:0!important;padding-right:0!important}
#home .your-la-result .link-button{font-size:var(--t-body)!important;font-weight:var(--w-strong)!important;color:var(--c-ink)!important}
#home .cc-src,#home .cc-src a{font-size:var(--t-meta)!important;font-weight:var(--w-regular)!important;color:var(--c-quiet)!important}
#home .cc-src a{color:var(--c-ink)!important}
#home .your-next{font-size:var(--t-body)!important;color:var(--c-quiet)!important}
#home .contact-card .cc-text b{font-size:var(--t-body)!important;font-weight:var(--w-strong)!important;color:var(--c-ink)!important}
#home .contact-card .cc-text span{font-size:var(--t-body)!important;font-weight:var(--w-regular)!important;color:var(--c-quiet)!important}
#home .contact-card .cc-act{font-size:var(--t-body)!important;font-weight:var(--w-strong)!important}
#home .contact-card .cc-cal p{font-size:var(--t-body)!important;font-weight:var(--w-regular)!important;color:var(--c-ink)!important}
#home .contact-card .cc-cal b{font-weight:var(--w-strong)!important}
/* v2-108 Home headline: one H1 in two lines, the gray call and the navy response (owner, Oct 3, 2026) */
#home .landing-question .landing-kicker{display:block;margin:0!important;color:var(--c-quiet)!important;font:inherit!important;letter-spacing:inherit!important}
/* v2-109 Home headline in capitals (owner, Oct 3, 2026) */
/* (capitals removed with the return of the original headline, Oct 3, 2026) */
/* v2-110 Home, below the chips: one link style, quiet meta links, even spacing (owner, Oct 3, 2026).
   Every link on the first screen gets the same thin gray underline that darkens on hover. Links inside meta text are regular weight. */
#home .guides-line a,#home .guides-line .link-button,#home .coming-up a,#home .your-la-sub .link-button{text-decoration:underline!important;text-decoration-thickness:1px!important;text-decoration-color:#cbd0cb!important;text-underline-offset:4px!important}
#home .guides-line .link-button:hover,#home .coming-up a:hover,#home .your-la-sub .link-button:hover{text-decoration-color:var(--c-ink)!important}
#home .coming-up a{font-weight:var(--w-regular)!important}
#home .coming-up p{margin:0!important;line-height:1.7!important}
#home .guides-line{margin:-6px 0 0!important}
#home .coming-up{margin:10px auto 0!important;padding-top:22px!important;border-top:1px solid #e3e5e0;max-width:560px!important;width:100%}
#home .indep-line{margin:-8px 0 0!important}
/* v2-110 Symmetry: each small label sits centered above its content; every block is centered on one axis. */
#home .your-la-try-line{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:10px!important}
#home .your-la-try-line .try-label{flex-basis:100%!important;text-align:center!important;margin:0 0 2px!important}
#home .coming-up .cu-label{font-size:var(--t-meta)!important;font-weight:var(--w-strong)!important;color:var(--c-quiet)!important;margin:0 0 4px!important}
#home .coming-up .cu-links{margin-top:2px!important}
#home .coming-up{padding-left:16px!important;padding-right:16px!important;box-sizing:border-box}
@media(max-width:650px){#home .coming-up .cu-sep{display:block;height:0;overflow:hidden}}
@media(max-width:650px){#home .coming-up{width:calc(100% - 32px)!important}}
/* v2-111 Graph: the name of the office under the pointer sits in the side column, underlined */
#graph .callout-name.hovered{text-decoration:underline}
/* Phones (no side columns): names that show sit on a paper halo so shapes and lines never cut through them */
#graph .node .node-label{paint-order:stroke;stroke:#f8f8f2;stroke-width:4px;stroke-linejoin:round}

/* ── v2-113 Home, one system (owner, Oct 3, 2026). Four type styles and three spacing steps; no one-offs.
   display 40/600/1.35 · title 22/600/1.35 · body 16/400/1.5 · meta 13/400/1.5 in the quiet gray.
   Weight 600 only on display and title. Spacing: 8 (a helper attached to its control), 24 (between items),
   40 (between groups). The handwritten neighbor note beside the logo stays (owner). ── */
:root{--s-attach:8px;--s-item:24px;--s-group:40px}
#home .landing-question,#home .landing-question .landing-kicker{line-height:1.35!important;letter-spacing:0!important;text-transform:none!important}
html body #home.screen{gap:0!important;row-gap:0!important}
#home>*{margin-top:0!important;margin-bottom:0!important}
#home>form.your-la{margin-top:var(--s-group)!important}
#home>.your-la-sub{margin-top:var(--s-attach)!important}
#home>.your-la-try-line{margin-top:var(--s-item)!important;gap:var(--s-attach)!important}
#home>.guides-line{margin-top:var(--s-item)!important}
#home>.coming-up{margin-top:var(--s-group)!important;padding-top:var(--s-item)!important}
#home>.indep-line{margin-top:var(--s-item)!important}
#home>.your-la-result{margin-top:var(--s-group)!important}
/* body: chips, "Use my location", guides, meeting names; meta: labels, dates, calendar links, the independent-guide line */
#home .your-la-sub .link-button,#home .try-chip,#home .guides-line .link-button{font-size:var(--t-body)!important;font-weight:var(--w-regular)!important;line-height:1.5!important;color:var(--c-ink)!important}
#home .try-label,#home .indep-line,#home .coming-up .cu-label,#home .coming-up p,#home .coming-up span,#home .coming-up .cu-links a{font-size:var(--t-meta)!important;font-weight:var(--w-regular)!important;line-height:1.5!important;color:var(--c-quiet)!important}
#home .coming-up .cu-list a{font-size:var(--t-meta)!important;font-weight:var(--w-regular)!important;color:var(--c-ink)!important}
#home .coming-up .cu-label{margin:0 0 var(--s-attach)!important}
#home .coming-up .cu-links{margin-top:var(--s-attach)!important}
#home .coming-up .cu-links a{color:var(--c-ink)!important}
/* Former second H1s on Home's other screens are titles */
#home ~ * h2[data-was-h1],h2[data-was-h1]{font-size:var(--t-title)!important;font-weight:var(--w-strong)!important;line-height:1.35!important;letter-spacing:0!important;color:var(--c-ink)!important}
/* Nav, every page: meta size and weight */
.atlas-header nav a{font-size:var(--t-meta)!important;font-weight:var(--w-regular)!important}

/* v2-114 Coming up links: a 44px tap area without changing the line (Tester, Oct 4, 2026) */
#home .coming-up a{padding:14px 0!important;margin:-14px 0!important}
/* v2-114 Phones: the headline keeps the page's 16px side margin (owner: it read as bleeding off the screen) */
@media(max-width:650px){#home .landing-top{padding-left:16px!important;padding-right:16px!important;box-sizing:border-box;width:100%}}

/* v2-115 · take an answer with you, October 4, 2026. */
.cc-take { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 4px; }
.cc-take .cc-act { min-height:44px; cursor:pointer; font:inherit; }
.cc-save-status { font-size:.875rem; color:var(--muted, #52616b); margin:4px 0 12px; }
.cc-save-status:empty { display:none; }
.save-preview { box-sizing:border-box; width:min(600px, calc(100vw - 24px)); max-height:90dvh; padding:24px; border:1px solid #a7b7c2; border-radius:12px; color:#092c46; background:#f8f8f2; overflow:auto; }
.save-preview::backdrop { background:rgb(9 44 70 / .55); }
.save-preview h2 { font-size:1.4rem; line-height:1.25; margin:0 0 12px; }
.save-preview p { line-height:1.5; }
.save-preview img { display:block; width:100%; height:auto; margin:16px 0; }
.save-preview textarea { display:block; box-sizing:border-box; width:100%; min-height:200px; padding:12px; margin:16px 0; font:16px/1.5 "Atkinson Hyperlegible Next",system-ui, sans-serif; color:#092c46; background:white; }
.save-preview .cc-act { display:inline-flex; align-items:center; min-height:44px; margin:4px 8px 0 0; cursor:pointer; }
.save-preview :focus-visible, .cc-take :focus-visible { outline:3px solid #1262a5; outline-offset:3px; }

/* The neighbor signature is the shared brand, not a Home-only label. */
.atlas-header .atlas-brand .brand-note.nb-header { display:inline-flex!important; flex:none; }
.atlas-header .atlas-navigation { display:flex; flex-direction:column; align-items:flex-end; gap:8px; min-width:0; }
.atlas-header .atlas-edition { margin:0; color:#53636a; font:400 12px/1.4 "Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif; letter-spacing:.025em; }
@media(max-width:650px) {
 body .atlas-header { height:auto; }
 .atlas-header .atlas-navigation { width:100%; align-items:flex-start; gap:6px; }
 .atlas-header .atlas-navigation nav { flex-wrap:wrap; }
}
@media(min-width:651px) {
 .atlas-header .atlas-brand { display:flex; align-items:center; flex-shrink:0; gap:20px; }
 .atlas-header .atlas-brand img { width:64px!important; height:64px!important; flex:none; }
 .atlas-header .atlas-brand .nb-mark { font-size:12.1px!important; }
}

/* v2-116: public-source notice is static, readable, and shared by every page. */
body footer.civic-site-footer{display:flex!important;position:relative;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;gap:12px!important;clear:both;width:auto;max-width:none;margin:32px 5% 0;padding:20px 0 24px;border-top:1px solid #cbd0cb;box-sizing:border-box;text-align:left!important;color:#53636a;font:400 13px/1.6 "Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif}
body footer.civic-site-footer .civic-notice{display:block;flex:none;order:1;max-width:78ch;width:100%;margin:0;font:inherit;color:inherit;white-space:normal}
body footer.civic-site-footer .civic-notice a{color:#0759b5!important;text-decoration:underline;text-underline-offset:3px;padding:0;margin:0}
body footer.civic-site-footer .fb-line{display:block!important;order:2;margin:0!important;padding:0!important;text-align:left;line-height:1.6}
body footer.civic-site-footer .fb-line::before{content:none}
body footer.civic-site-footer .footer-bottom{display:flex;gap:16px;flex-wrap:wrap}
body.map-page:has(.civic-site-footer){height:auto;min-height:100dvh;overflow:auto}
body.crew-site footer.civic-site-footer{margin:48px 0 0}
@media(max-width:650px){body footer.civic-site-footer{margin:24px 6% 0}body footer.civic-site-footer .civic-notice a{display:inline}}

/* v2-117: calm utility navigation; full legal copy remains on About. */
body footer.civic-site-footer{gap:8px!important;padding:12px 0 16px}
body footer.civic-site-footer .civic-utility-links{display:flex;flex-wrap:wrap;align-items:center;gap:4px 24px;margin:0;padding:0;border:0;height:auto;min-height:0;font:inherit}
body footer.civic-site-footer .civic-utility-links a{display:inline-flex;align-items:center;min-height:44px;margin:0;padding:0;color:#53636a!important;font:inherit;text-decoration:underline;text-decoration-color:#cbd0cb;text-underline-offset:4px;white-space:nowrap}
body footer.civic-site-footer .civic-utility-links a:hover{color:#092c46!important;text-decoration-color:currentColor}
body footer.civic-site-footer .civic-utility-links a:focus-visible{outline:2px solid #0759b5;outline-offset:4px}
body.home-view{display:flex;flex-direction:column;min-height:100dvh}
body.home-view>.atlas-header,body.home-view>footer{flex-shrink:0}
body.home-view>#main{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center}
body.home-view #home.screen{min-height:0!important;padding:clamp(28px,4dvh,48px) 0!important;width:100%}
body.home-view>footer.civic-site-footer{margin-top:0;align-items:center!important}
@media(max-width:650px){body footer.civic-site-footer .civic-utility-links{gap:4px 20px}}

@media(max-width:650px){
 body.home-view #home.screen{--s-group:24px;--s-item:16px;padding:24px 0!important}
}

/* v2-118: practical action first, background available on demand. */
#home .contact-card .cc-details { margin:16px 0 0; border-top:1px solid #cbd0cb; padding-top:8px; }
#home .contact-card .cc-details summary { cursor:pointer; min-height:44px; padding:10px 0; box-sizing:border-box; font-size:14px; line-height:1.5; color:#092c46; }
#home .contact-card .cc-details summary:focus-visible { outline:2px solid #0759b5; outline-offset:4px; }
#home .contact-card .cc-source-details .cc-src { margin:8px 0; opacity:1; }
@media(max-width:520px){#home .contact-card .cc-no-avatar .cc-text{flex-basis:100%}#home .contact-card .cc-no-avatar .cc-acts{margin-left:0}}
/* Calendar choices use the same plain provider names throughout. */
.kh-cal{display:inline-flex;align-items:center;flex-wrap:wrap;gap:8px}
.kh-cal .kh-btn{display:inline-flex;align-items:center;min-height:44px}
#home .cc-cal-btns{align-items:center}
/* Owner's Home meeting layout: one meeting per line, then named calendar choices. */
#home .coming-up .cu-meeting{display:block}
#home .coming-up .cu-links a{font-weight:var(--w-strong)!important}

/* Phone navigation: keep all five destinations together where they fit. */
@media(max-width:650px){.atlas-header nav{gap:4px!important}}
/* Extra confirmed meetings stay available without crowding the first screen. */
#home .coming-up .cu-more summary{cursor:pointer;min-height:44px;display:list-item;list-style-position:inside;padding:10px 4px;box-sizing:border-box;color:var(--c-ink);font-size:var(--t-meta)}
#home .coming-up .cu-more summary:focus-visible{outline:2px solid #165da6;outline-offset:2px}
#home .coming-up .cu-more[open]{margin-bottom:10px}

/* One compact take-away control follows the useful contact on either answer tab. */
.cc-tools{margin:8px 0 20px;text-align:left}
.cc-tools>summary{cursor:pointer;min-height:44px;display:list-item;width:fit-content;padding:10px 0;color:#092c46;font-size:14px}
.cc-tools .cc-take{margin-top:4px}
.cc-tools:has(:focus-visible){outline-offset:4px}

/* Quiet project credit shares the utility row; it never overlays page content. */
body footer.civic-site-footer .civic-footer-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:4px 24px;width:100%}
body footer.civic-site-footer .civic-project-credit,body:has(#home) footer.civic-site-footer .civic-project-credit{display:block;font:400 12px/1.5 "Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif!important;color:#53636a!important;white-space:nowrap;margin-left:auto}
@media(max-width:650px){body footer.civic-site-footer .civic-footer-row{justify-content:center;gap:2px 16px}body footer.civic-site-footer .civic-project-credit{flex-basis:100%;margin-left:0;text-align:center}}
/* Per-meeting actions stay visually small, with separate touch/focus targets. */
#home .coming-up .cu-cal-icons{display:inline-flex;align-items:center;vertical-align:middle;white-space:nowrap;gap:2px}
#home .coming-up a.cu-cal-icon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0!important;margin:0!important;text-decoration:none!important;border-radius:5px}
#home .coming-up .cu-cal-icon svg{width:15px;height:15px;display:block}
#home .coming-up .cu-cal-icon:hover{background:#e9ece7}
#home .coming-up .cu-cal-icon:focus-visible{outline:2px solid #165da6;outline-offset:1px}
@media(pointer:coarse){#home .coming-up a.cu-cal-icon{width:44px;height:44px}}

/* Desktop meetings share one text column and one aligned calendar column. */
@media(min-width:651px){
 #home .coming-up .cu-meeting{display:grid;grid-template-columns:minmax(0,1fr) max-content;align-items:center;column-gap:10px;text-align:left}
 #home .coming-up .cu-meeting-copy{text-align:right}
 #home .coming-up .cu-cal-icons{justify-self:end}
}

#home .coming-up .cu-attendance{display:block;grid-column:1/-1;text-align:right;margin-bottom:8px}
#home .coming-up .cu-attendance a{display:inline-flex;align-items:center;min-height:44px;box-sizing:border-box;padding:8px 6px!important;margin:0!important}

#civic-views{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin:12px 0 20px;font-size:14px}#civic-views a,#civic-views span{padding:8px 0}#civic-views [aria-current]{font-weight:700;border-bottom:2px solid #cf0049}

/* One prominent emergency action within the site's usual cream background. */
.cc-danger{color:inherit;padding:0;margin:20px 0}
.cc-danger p{margin:12px 0}
.cc-danger ul{list-style:disc!important;margin:12px 0;padding-left:22px}
.cc-danger li{display:list-item!important;min-height:0!important;padding:0!important;margin:8px 0!important;line-height:1.5}
#home .cc-danger a.cc-emergency-call{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 24px!important;background:#d6003a!important;color:#fff!important;border:1px solid #092c46;border-radius:999px;font-weight:700;text-decoration:none}
#home .cc-danger a.cc-emergency-call:hover{background:#b80032!important}
#home .cc-danger a.cc-emergency-call:focus-visible{outline:3px solid #092f44;outline-offset:4px}

/* v2-148: Home "What you can do here" as a path (owner, Oct 21, 2026): three steps on a left-to-right red path
   (red = the path you're tracing), resting on "Why you can trust this" (charter: three pillars, supported by trust).
   One step's details show at a time: hover or click on desktop, tap on phones. Core palette and type tokens only.
   Below the first screen; steps aside whenever an answer is showing, like the map. */
body.home-view .home-pillars{width:min(1240px,calc(100% - 112px));margin:0 auto;padding:40px 0;border-top:1px solid #cbd0cb}
body.home-view .home-pillars .pillars-label{margin:0 0 24px;font-size:var(--t-meta);font-weight:var(--w-regular);color:var(--c-quiet);letter-spacing:.02em}
body.home-view .home-pillars .pillars-path{display:flex;flex-wrap:wrap;align-items:flex-start}
body.home-view .home-pillars .pillar-step{display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-height:44px;margin:0;padding:0;border:0;background:none;font:inherit;text-align:left;color:var(--c-ink);cursor:pointer;flex:0 1 auto;order:1}
body.home-view .home-pillars .pillar-dot{display:inline-flex;align-items:center;justify-content:center;flex:none;width:40px;height:40px;border-radius:50%;border:1.5px solid var(--c-ink);background:#fff;font-size:var(--t-body);font-weight:var(--w-strong);color:var(--c-ink);transition:background-color .15s,color .15s}
body.home-view .home-pillars .pillar-step:hover .pillar-dot{background:#eef2f6}
body.home-view .home-pillars .pillar-step[aria-expanded="true"] .pillar-dot{background:var(--c-ink);color:#fff}
body.home-view .home-pillars .pillar-name{display:flex;flex-direction:column;gap:2px}
body.home-view .home-pillars .pillar-title{font-size:var(--t-title);font-weight:var(--w-strong);line-height:1.2;color:var(--c-ink)}
body.home-view .home-pillars .pillar-sub{font-size:var(--t-meta);color:var(--c-quiet)}
body.home-view .home-pillars .pillar-step:focus-visible{outline:3px solid #c70043;outline-offset:4px;border-radius:4px}
body.home-view .home-pillars .pillar-arrow{order:1;flex:1 1 48px;position:relative;height:2px;margin:19px 24px 0;background:#c70043}
body.home-view .home-pillars .pillar-arrow::after{content:"";position:absolute;right:-1px;top:-5px;border-left:9px solid #c70043;border-top:6px solid transparent;border-bottom:6px solid transparent}
body.home-view .home-pillars .pillar-detail{order:2;flex:0 0 100%;margin-top:24px;padding-top:24px;border-top:1px solid #cbd0cb}
body.home-view .home-pillars .pillar-detail[hidden]{display:none}
body.home-view .home-pillars .pillar-detail p,body.home-view .home-pillars .pillars-base p{margin:0 0 8px;max-width:640px;font-size:var(--t-body);font-weight:var(--w-regular);line-height:1.5;color:var(--c-quiet)}
body.home-view .home-pillars .pillar-links{display:flex;flex-wrap:wrap;gap:0 24px;margin:0!important}
body.home-view .home-pillars .pillar-links a{display:inline-flex;align-items:center;min-height:44px;font-size:var(--t-body);color:#0759b5;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
body.home-view .home-pillars .pillar-links a:hover{color:var(--c-ink)}
body.home-view .home-pillars .pillar-links a:focus-visible{outline:3px solid #c70043;outline-offset:2px;border-radius:2px}
body.home-view .home-pillars .pillars-base{margin-top:24px;padding:24px;border-radius:8px;background:#e9ece5}
body.home-view .home-pillars .pillars-base h2{margin:0 0 8px;font-size:var(--t-title);font-weight:var(--w-strong);line-height:1.2;color:var(--c-ink)}
body.home-view:has(.your-la-result:not([hidden])) .home-pillars{display:none}
/* Home landing, tablets and desktops (owner, Oct 21, 2026: "the top and bottom ... look disjointed").
   The search block no longer floats in a reserved 723px band (it left 180-260px empty above and below it).
   It sits a deliberate distance under the header, and "What you can do here" follows at one section gap,
   so the two read as one page. Phones are unchanged. */
@media(min-width:601px){body.home-view:has(.home-pillars):not(:has(.your-la-result:not([hidden])))>#main{min-height:0;flex:none;justify-content:flex-start;padding-top:clamp(88px,12vh,140px)!important;padding-bottom:clamp(64px,8vh,96px)!important}
  body.home-view:has(.home-pillars):not(:has(.your-la-result:not([hidden])))>#main>#home.landing{padding-top:0!important;padding-bottom:0!important;min-height:0!important}
  /* The older 4vh optical lift belonged to the centred band; with fixed spacing it only skews the gaps. */
  body.home-view:has(.home-pillars):not(:has(.your-la-result:not([hidden]))) #home .home-entry{transform:none!important}}
@media(max-width:950px){body.home-view .home-pillars{width:min(560px,calc(100% - 48px))}
body.home-view .home-pillars .pillars-path{flex-direction:column;flex-wrap:nowrap;align-items:stretch}
body.home-view .home-pillars .pillar-step,body.home-view .home-pillars .pillar-arrow,body.home-view .home-pillars .pillar-detail{order:0}
body.home-view .home-pillars .pillar-arrow{flex:none}
body.home-view .home-pillars .pillar-step{flex-direction:row;align-items:center;gap:16px;width:100%}
body.home-view .home-pillars .pillar-detail{margin:8px 0 0 56px;padding-top:0;border-top:0}
body.home-view .home-pillars .pillar-arrow{width:2px;height:24px;margin:8px 0 8px 19px}
body.home-view .home-pillars .pillar-arrow::after{right:auto;left:-5px;top:auto;bottom:-1px;border-left:6px solid transparent;border-right:6px solid transparent;border-top:9px solid #c70043;border-bottom:0}}
@media(max-width:600px){body.home-view .home-pillars{width:calc(100% - 32px);padding:24px 0 40px}body.home-view .home-pillars .pillars-base{padding:24px 16px}}

/* v2-150: Home suggestions inside the search (owner, Oct 21, 2026: "sophisticated and smart"). The three suggestions
   open as a list under the search box while it is focused and empty; typing hands over to the address autocomplete.
   Only the not-the-City line stays under the search. Core palette and type tokens; 44px rows. */
#home .home-tools #type-start{position:relative}
#home .home-tools .search-suggest{display:none;position:absolute;left:0;right:0;top:auto;margin-top:8px;z-index:20;box-sizing:border-box;padding:8px 0;background:#fff;border:1px solid #cbd0cb;border-radius:16px;text-align:left}
#home .home-tools #type-start:focus-within .search-suggest{display:block}
#home .home-tools #type-start:focus-within:has(#your-address:placeholder-shown):not(:has(#your-la.suggest-dismissed)) .your-la-sub{visibility:hidden}
#home .home-tools #type-start:has(#your-address:not(:placeholder-shown)) .search-suggest,#home .home-tools #type-start:has(#your-la.suggest-dismissed) .search-suggest{display:none}
#home .home-tools .search-suggest .search-suggest-location{border-bottom:1px solid #cbd0cb!important;margin-bottom:8px!important}
#home .home-tools .search-suggest .search-suggest-location svg{flex:none;color:#c70043}
#home .home-tools .search-suggest-label{margin:0;padding:4px 20px 4px;font-size:var(--t-meta);font-weight:var(--w-regular);color:var(--c-quiet)}
#home .home-tools .search-suggest :is(.your-la-try,.search-suggest-location){display:flex;gap:8px;align-items:center;width:100%;min-height:44px;margin:0;padding:0 20px;border:0;border-radius:0;background:none;font:inherit;font-size:var(--t-body);font-weight:var(--w-regular);line-height:1.3;color:var(--c-ink);text-align:left;cursor:pointer}
#home .home-tools .search-suggest :is(.your-la-try,.search-suggest-location):is(:hover,:focus-visible){background:#eef2f6;outline:none}
#home .home-tools .search-suggest :is(.your-la-try,.search-suggest-location):focus-visible{box-shadow:inset 3px 0 0 #c70043}
#home .home-tools .not-city-line{margin:24px 0 0!important;padding:0!important;text-align:left}
@media(min-width:601px) and (max-width:950px){#home .home-tools .not-city-line{text-align:center}}
@media(max-width:600px){#home .home-tools .not-city-line{text-align:center}}

/* v2-151: saved location basis on answer cards (W1, Oct 21, 2026): "From your address lookup, Oct 21 · Change · Clear". */
#home .your-la-result .cc-basis{display:block;margin-top:4px;font-size:var(--t-meta);line-height:1.5;color:var(--c-quiet)}
#home .your-la-result .cc-basis .cc-loc{display:inline;min-height:0;padding:0;border:0;background:none;font:inherit;color:#0759b5;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
@media(pointer:coarse){#home .your-la-result .cc-basis .cc-loc{display:inline-flex;align-items:center;min-height:44px}}

/* Phone tap targets only. Nothing in this block applies at desktop widths, so the Civic Atlas Graph and the desktop layout stay as they are. */
/* v2-152 · Interface polish, round 2 (Oct 21, 2026, for owner review): the round-1 rules from Home, shared by every page.
   One round action button (.ca-round) with one drawn arrow (.ca-arrow); the same hover, pressed, keyboard-focus and disabled
   states everywhere; colour-only 0.15s transitions; nothing moves or resizes; reduced motion respected.
   Label convention: short nav and footer labels are Title Case in the HTML; CSS never capitalizes them. */
.ca-arrow{display:block;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
button.ca-round{display:grid!important;place-items:center;flex:0 0 auto;padding:0!important;border:0!important;border-radius:50%!important;background:#092c46!important;color:#fff!important;font-size:0!important;line-height:0!important;cursor:pointer;transition:background-color .15s ease,box-shadow .15s ease!important}
button.ca-round:hover{background:#163e5e!important}
button.ca-round:active{background:#061f33!important}
button.ca-round:focus-visible{outline:2px solid #0759b5!important;outline-offset:3px!important}
button.ca-round:disabled{background:#092c46!important;opacity:.45;cursor:progress}
/* Sizes: the circle never drops below a 44px tap target; the arrow is about 40% of the circle. */
.entry-search button.ca-round,.mt-check button.ca-round{width:48px!important;height:48px!important}
.entry-search button.ca-round .ca-arrow,.mt-check button.ca-round .ca-arrow{width:21px;height:21px}
.atlas-address .aa-form button.ca-round{width:44px!important;height:44px!important;min-height:44px!important}
.atlas-address .aa-form button.ca-round .ca-arrow{width:19px;height:19px}
/* Atlas details search: the same focus treatment as Home (border plus a soft ring), not a separate blue outline. */
.entry-search:focus-within{outline:none!important;border-color:#092c46!important;box-shadow:0 0 0 3px rgba(9,44,70,.14)!important}
/* Placeholders: one readable grey everywhere (5.26:1 on the grey address fields, 6.25:1 on white); the browser default was 3.88:1. */
input::placeholder,textarea::placeholder{color:#53636a!important;opacity:1}

/* Navigation: hover underlines without moving anything; the selected page keeps its red rule; focus is a visible ring. */
.atlas-header nav a{transition:color .15s ease,text-decoration-color .15s ease;text-decoration:underline!important;text-decoration-color:transparent!important;text-decoration-thickness:1px!important;text-underline-offset:6px}
.atlas-header nav a:hover{text-decoration-color:rgba(9,44,70,.45)!important}
.atlas-header nav a[aria-current=page]:hover{text-decoration-color:transparent!important}
.atlas-header nav a:active{color:#c70043!important}
.atlas-header nav a:focus-visible{outline:2px solid #0759b5;outline-offset:3px;border-radius:3px}
.atlas-header nav a[aria-current=page]:focus-visible{box-shadow:0 2px 0 #c70043}
/* Footer: the same states, quieter colour. */
body footer.civic-site-footer .civic-utility-links a{transition:color .15s ease,text-decoration-color .15s ease}
body footer.civic-site-footer .civic-utility-links a:active{color:#c70043!important}
body footer.civic-site-footer .civic-utility-links a:focus-visible{outline:2px solid #0759b5;outline-offset:3px;border-radius:3px}
/* Phones: all five navigation items on one line (375px and wider), spread edge to edge; each keeps a 44px tap target. */
@media (max-width:430px){
  .atlas-header nav{width:100%;justify-content:space-between!important;column-gap:4px!important}
  .atlas-header nav a{padding-left:0!important;padding-right:0!important}
}
@media (prefers-reduced-motion:reduce){
  button.ca-round,.atlas-header nav a,body footer.civic-site-footer .civic-utility-links a,.entry-search{transition:none!important}
}

/* Oct 28, 2026 (owner): the header links speak the homepage actions' vocabulary: 12px caps, tracked .06em, weight
   600, ink. The current-page mark (red rule) and hover underline are unchanged. */
.atlas-header nav a{font-size:12px!important;letter-spacing:.06em;text-transform:uppercase;font-weight:600!important;color:#092c46}

/* Oct 29, 2026 (owner, from his phone): on phones, inner pages' header keeps the mark at Home's 52px, drops the tagline
   (Home keeps it), and stacks the six links toward the right in two columns, three rows. Home's phone header is its own
   (District Map). Nothing changes at 651px and up.
   Oct 29 (later): the nav may grow to its three rows; style.css capped a header nav at 48px under 1200px, which
   clipped the Atlas details page's links on phones. */
@media(max-width:650px){
 body:not(.home-view) .atlas-header,body:not(.home-view).map-page .atlas-header{flex-wrap:nowrap;align-items:center;gap:12px;height:auto;min-height:0;padding:10px 6%}
 body:not(.home-view) .atlas-header .atlas-brand{flex:0 0 auto;gap:0}
 body:not(.home-view) .atlas-header .atlas-brand img{width:52px!important;height:52px!important;min-width:52px}
 body:not(.home-view) .atlas-header .atlas-brand .brand-note.nb-header{display:none!important}
 body:not(.home-view) .atlas-header .atlas-navigation{width:auto;flex:0 1 auto;margin-left:auto;align-items:flex-end;gap:0}
 body:not(.home-view) .atlas-header .atlas-edition{display:none}
 body:not(.home-view) .atlas-header nav{display:grid!important;grid-template-columns:auto auto;justify-content:end;justify-items:end;column-gap:20px!important;row-gap:0!important;width:auto;text-align:right;height:auto!important;max-height:none!important;overflow:visible!important}
 body:not(.home-view) .atlas-header nav a{display:block!important;min-height:36px!important;height:36px;line-height:36px!important;padding:0!important;white-space:nowrap}
 body:not(.home-view) .atlas-header nav[aria-label="Main navigation"]::after{content:none!important}
}

@media (max-width: 850px), (pointer: coarse) and (max-height: 500px) {
  #home .pr-btn,
  #home .rm-btn {
    min-height: 44px;
    min-width: 44px;
  }
  a.resource-action[aria-label*="agenda" i],
  a.resource-action[href*="agenda" i],
  #dir-public-meetings a {
    display: inline-flex;
    align-items: center;
    box-sizing: border-box;
    min-height: 44px;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  input[type="checkbox"] {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
  }

  /* Civic Atlas Graph on a phone: the drawing is first. Intro, City/County/Overview,
     search, and the office panel follow, in that order. A search that opens an
     office moves #details ahead of #phone-atlas and puts it back on the next navigation. */
  main:has(> .layout > section > #graph) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    padding-top: 0;
  }
  main:has(> .layout > section > #graph) > .layout {
    display: contents;
  }
  main:has(> .layout > section > #graph) > :not(.layout),
  main:has(> .layout > section > #graph) > .layout > section,
  main:has(> .layout > section > #graph) > .layout > aside {
    min-width: 0;
    max-width: 100%;
  }
  main:has(> .layout > section > #graph) > .layout > section {
    grid-row: 1;
    order: -1;
    width: 100%;
  }
  main:has(> .layout > section > #graph) > .layout > aside {
    height: auto;
    max-height: none;
    overflow: visible;
    width: 100%;
  }
  main:has(> .layout > section > #graph) > nav[aria-label="Government"] button,
  main:has(> .layout > section > #graph) #search {
    min-height: 44px;
    min-width: 44px;
  }
  .atlas-header nav a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-height: 44px !important;
    min-width: 44px !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }
  input[type="checkbox"] {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
  }
  body footer.civic-site-footer .civic-utility-links a {
    box-sizing: border-box;
    min-width: 44px;
    min-height: 44px;
    justify-content: center;
  }
  .skip-link,
  a.skip,
  #government-help,
  #graph-demo,
  .graph-tools button,
  .graph-tools a,
  .dir-call,
  .dir-contact a,
  a[href^="tel:311"] {
    display: inline-flex;
    align-items: center;
    box-sizing: border-box;
    min-height: 44px;
    min-width: 44px;
  }

  /* D-017: the See Local Government badge sits on the map at top 21% and is shifted up by half
     its own height, so about 42px hangs above the map. Phone padding above the map is 12px,
     and the header (opaque, z-index 20) covers that hang. 56px clears the hang, the shadow,
     and a gap under the nav. The badge stays put on the map. Desktop rules are outside this block. */
  body.home-view #main > #home.screen {
    padding-top: 56px !important;
  }

  /* D-026: Overview clears a selected office. On a phone it is not a third
     government toggle. Hide it in the City/County row. After the phone script
     moves it out of that row, show it only once an office is selected. */
  main:has(> .layout > section > #graph) > nav[aria-label="Government"] > #reset {
    display: none;
  }
  main:has(> .layout > section > #graph) > #reset {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    justify-self: start;
    align-self: center;
    box-sizing: border-box;
    min-height: 44px;
    min-width: 44px;
    margin: 0 0 12px;
    padding: 10px 4px;
    white-space: nowrap;
    appearance: none;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: #0759b5;
    font-weight: 400;
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  main:has(> .layout > section > #graph) > #reset:not(.show-all) {
    display: none;
  }
  /* P2 at c2fff19: padding made a 45px box, but the Optional line underneath covered the
     bottom 12px, so only 33px received the tap. inline-block plus min-height puts the
     whole target in the line box. Words, color, and underline stay. Desktop is outside. */
  #home .contact-card .cc-w dd a[href*="360043691912-Report-a-vehicle-that-needs-to-be-picked-up"] {
    display: inline-block;
    box-sizing: border-box;
    min-height: 44px;
  }

/* D-037: map-first council districts. The drawing is injected only at this width.
     The ring graph stays in the page under the map. #reset is untouched, so the
     phone "Show all offices" control from the open D-026 draft can still move it. */
  main:has(#phone-atlas):has(> .layout > section > #graph) > #phone-atlas {
    grid-row: 1;
    order: -2;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }
  main:has(#phone-atlas):has(> .layout > section > #graph) > .layout > section {
    grid-row: auto;
    order: 0;
  }
  #phone-atlas {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
    max-width: 100%;
    margin: 0 0 12px;
  }
  #phone-atlas .phone-atlas-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
  #phone-atlas .phone-atlas-query {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
  }
  #phone-atlas .phone-atlas-query input {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    min-height: 44px;
    margin: 0;
    font-size: 16px;
  }
  #phone-atlas .phone-atlas-query button,
  #phone-atlas-locate,
  #phone-atlas-change,
  #phone-atlas-chips button,
  #phone-atlas-wrong-open,
  #phone-atlas-works-more,
  #phone-atlas-wrong-form button,
  #phone-atlas-wrong .phone-atlas-pill,
  #phone-atlas .phone-atlas-actions a,
  #phone-atlas .phone-atlas-office {
    box-sizing: border-box;
    min-width: 44px;
    min-height: 44px;
  }
  #phone-atlas .phone-atlas-query button {
    width: auto;
    min-width: 44px;
    height: auto;
    min-height: 44px;
    padding: 0 12px;
    flex: 0 0 auto;
    white-space: nowrap;
  }
  #phone-atlas-wrong {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  #phone-atlas-wrong .phone-atlas-modes {
    order: 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    min-width: 0;
  }
  #phone-atlas-wrong .phone-atlas-modes button {
    width: 100%;
    height: 56px;
    min-height: 56px;
    margin: 0;
    padding: 0 12px;
    border: 1.5px solid #092c46;
    border-radius: 16px;
    background: #fff;
    color: #092c46;
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    text-align: center;
    text-decoration: none;
  }
  #phone-atlas-locate.is-dim { opacity: .55; }
  #phone-atlas-wrong .phone-atlas-modes #phone-atlas-wrong-open[aria-expanded="true"] {
    background: #092c46;
    color: #fff;
  }
  #phone-atlas-status:empty { display: none; }
  #phone-atlas-status { margin: 0; font-size: 14px; }
  #phone-atlas .phone-atlas-banner[hidden] { display: none; }
  #phone-atlas .phone-atlas-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid #d1d8d6;
    border-radius: 12px;
  }
  #phone-atlas-change {
    padding: 8px 12px;
    background: transparent;
  }
  /* Phone order: heading, issue entry, map, address row, then the district chips. */
  #phone-atlas-lead {
    order: 1;
    margin: 0;
    font-size: 17px;
    line-height: 1.3;
    font-weight: 700;
    color: #003563;
  }
  #phone-atlas-wrong { order: 2; min-width: 0; max-width: 100%; }
  #phone-atlas-neighborhood { order: 3; min-width: 0; max-width: 100%; }
  #phone-atlas .phone-atlas-mapwrap { order: 4; min-width: 0; max-width: 100%; }
  #phone-atlas-address-row {
    order: 5;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    min-width: 0;
  }
  #phone-atlas-address-row #phone-atlas-lookup {
    flex: 1 1 100%;
    width: 100%;
    min-width: 0;
    margin: 0;
  }
  #phone-atlas-status,
  #phone-atlas .phone-atlas-banner { order: 6; }
  #phone-atlas .phone-atlas-or { order: 7; margin: 0; }
  #phone-atlas-chips { order: 8; }
  #phone-atlas-address-tip,
  #phone-atlas-city-county { order: 9; }
  #phone-atlas-sheet { order: 10; min-width: 0; max-width: 100%; }
  #phone-atlas-neighborhood-heading,
  #phone-atlas-neighborhood-split {
    margin: 0;
    font-size: 17px;
    line-height: 1.3;
    font-weight: 700;
    color: #003563;
  }
  #phone-atlas-neighborhood-search {
    display: block;
    width: 100%;
    box-sizing: border-box;
    min-height: 44px;
    margin: 8px 0 0;
    padding: 10px 12px;
    border: 1.5px solid #092c46;
    border-radius: 12px;
    background: #fff;
    color: #092c46;
    font-size: 16px;
  }
  #phone-atlas-neighborhood-chips,
  #phone-atlas-neighborhood-rest {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
    min-width: 0;
    max-width: 100%;
  }
  #phone-atlas-neighborhood-rest { flex: 1 0 100%; width: 100%; margin-top: 0; }
  #phone-atlas-neighborhood-rest[hidden] { display: none; }
  #phone-atlas-neighborhood-chips button {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid #cbd0cb;
    border-radius: 999px;
    background: #fff;
    color: #092c46;
    font-size: 14px;
    font-weight: 600;
    white-space: normal;
    overflow-wrap: anywhere;
    text-align: left;
  }
  #phone-atlas-neighborhood-chips button[hidden] { display: none; }
  #phone-atlas-neighborhood-empty,
  #phone-atlas-neighborhood-result { margin: 8px 0 0; min-width: 0; max-width: 100%; }
  #phone-atlas-neighborhood-empty[hidden],
  #phone-atlas-neighborhood-result[hidden],
  #phone-atlas-neighborhood-split[hidden],
  #phone-atlas-neighborhood-sure[hidden] { display: none; }
  #phone-atlas-neighborhood-empty {
    font-size: 15px;
    line-height: 1.4;
    color: #092c46;
  }
  #phone-atlas-neighborhood-cards {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
    min-width: 0;
  }
  #phone-atlas .phone-atlas-rep,
  #phone-atlas-neighborhood-sure {
    box-sizing: border-box;
    width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid #cbd0cb;
    border-radius: 12px;
    background: #fff;
    color: #092c46;
    font-size: 16px;
    font-weight: 600;
    text-align: left;
  }
  #phone-atlas-neighborhood-sure { margin-top: 8px; text-align: center; }
  #phone-atlas-address-tip {
    min-width: 0;
    max-width: 100%;
    background: #fff;
    border: 1px solid #d1d8d6;
    border-radius: 12px;
    padding: 0 12px 8px;
  }
  #phone-atlas-address-tip summary {
    display: flex;
    align-items: center;
    min-height: 44px;
    cursor: pointer;
  }
  #phone-atlas-address-tip p,
  #phone-atlas-city-county {
    margin: 0 0 8px;
    min-width: 0;
    overflow-wrap: anywhere;
  }
  #phone-atlas-city-county { margin: 0; }
  #phone-atlas .phone-atlas-office-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
  }
  #phone-atlas .phone-atlas-badge {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    box-sizing: border-box;
    min-height: 44px;
    min-width: 44px;
    margin: 0;
    padding: 8px 12px;
    background: #fff;
    border: 1px solid #b9c8cc;
    border-radius: 8px;
    overflow-wrap: anywhere;
  }
  #phone-atlas .phone-atlas-badge a,
  #phone-atlas details.phone-atlas-badge summary {
    display: inline-flex;
    align-items: center;
    box-sizing: border-box;
    min-height: 44px;
    min-width: 44px;
    cursor: pointer;
  }
  #phone-atlas details.phone-atlas-badge {
    display: block;
    padding: 0 12px 8px;
  }
  #phone-atlas details.phone-atlas-badge:not([open]) > :not(summary) {
    display: none;
  }
  #phone-atlas details.phone-atlas-badge p {
    margin: 0 0 8px;
  }
  #phone-district-map {
    display: block;
    width: 100%;
    height: min(28vh, 220px);
    max-width: 100%;
  }
  #phone-district-map .phone-district path {
    fill: #e4edf2;
    stroke: #003563;
    stroke-width: 1.4;
    stroke-linejoin: round;
  }
  /* D-078. Invisible hit circle. The district path above keeps its fill and 1.4 stroke. */
  #phone-district-map .phone-district-hit {
    fill: transparent;
    stroke: none;
    pointer-events: fill;
  }
  #phone-district-map .phone-district text {
    fill: #003563;
    font-size: 12px;
    font-weight: 700;
    font-family: "Atkinson Hyperlegible Next",Arial, sans-serif;
    pointer-events: none;
    stroke: #fff;
    stroke-width: 3px;
    paint-order: stroke fill;
  }
  #phone-district-map .phone-district.is-split path {
    fill: #7aa0bd;
    stroke: #003563;
    stroke-width: 1.8;
  }
  #phone-district-map .phone-district.is-split text {
    fill: #092c46;
    stroke: #e4edf2;
  }
  #phone-district-map .phone-district.is-on path {
    fill: #003563;
    stroke: #092c46;
    stroke-width: 2.4;
  }
  #phone-district-map .phone-district.is-on text { fill: #fff; stroke: #003563; }
  #phone-atlas-map-caption {
    margin: 6px 0 0;
    font-size: 14px;
    line-height: 1.3;
    font-weight: 700;
    color: #092c46;
  }
  #phone-atlas-map-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 4px 0 0;
    padding: 0;
    list-style: none;
    font-size: 14px;
    line-height: 1.3;
    color: #092c46;
  }
  #phone-atlas-map-legend li {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
  }
  .phone-atlas-swatch {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 1.5px solid #003563;
    border-radius: 3px;
    flex: none;
  }
  .phone-atlas-swatch.is-highlight { background: #003563; }
  .phone-atlas-swatch.is-split { background: #7aa0bd; }
  #phone-district-map .phone-district:focus { outline: none; }
  #phone-district-map .phone-district:focus path {
    stroke: #c70043;
    stroke-width: 3;
  }
  #phone-neighborhood-hook text {
    font-size: 11px;
    fill: #53636a;
    pointer-events: none;
  }
  #phone-atlas-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  #phone-atlas-chips li { margin: 0; padding: 0; }
  #phone-atlas-chips button {
    box-sizing: border-box;
    width: auto;
    min-width: 44px;
    height: auto;
    min-height: 44px;
    padding: 0 8px;
    border-radius: 8px;
    font-size: 14px;
    white-space: nowrap;
  }
  #phone-atlas-chips button.is-split {
    background: #7aa0bd;
    color: #092c46;
    border-color: #003563;
  }
  #phone-atlas-chips button.is-on {
    background: #003563;
    color: #fff;
    border-color: #003563;
  }
  #phone-atlas .phone-atlas-member,
  #phone-atlas .phone-atlas-works {
    min-width: 0;
    max-width: 100%;
    background: #fff;
    border: 1px solid #d1d8d6;
    border-radius: 12px;
    padding: 12px;
  }
  #phone-atlas .phone-atlas-member { margin-top: 8px; }
  #phone-atlas .phone-atlas-works { margin-top: 8px; }
  #phone-atlas .phone-atlas-member img {
    width: 64px;
    height: 64px;
    object-fit: cover;
    border-radius: 8px;
  }
  #phone-atlas .phone-atlas-kicker,
  #phone-atlas .phone-atlas-role,
  #phone-atlas .phone-atlas-note {
    margin: 0 0 6px;
    color: #53636a;
    font-size: 14px;
  }
  #phone-atlas .phone-atlas-member h2 { margin: 0 0 4px; font-size: 24px; }
  #phone-atlas .phone-atlas-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 8px 0 0;
  }
  #phone-atlas .phone-atlas-actions a,
  #phone-atlas .phone-atlas-office {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    padding: 8px 12px;
    text-align: left;
    overflow-wrap: anywhere;
  }
  #phone-atlas .phone-atlas-actions a {
    width: auto;
    flex-direction: row;
    align-items: center;
    text-decoration: none;
    background: #fff;
    border: 1px solid #b9c8cc;
    border-radius: 7px;
  }
  #phone-atlas .phone-atlas-works > h3 { margin: 0 0 6px; }
  #phone-atlas .phone-atlas-gov {
    margin: 12px 0 8px;
    font-size: 16px;
    font-weight: 700;
    color: #003563;
  }
  #phone-atlas .phone-atlas-offices {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  #phone-atlas .phone-atlas-office-name { font-weight: 700; }
  #phone-atlas .phone-atlas-office-relation {
    font-size: 13px;
    font-weight: 400;
    color: #53636a;
  }
  #phone-atlas .phone-atlas-office.is-on {
    background: #003563;
    color: #fff;
    border-color: #003563;
  }
  #phone-atlas .phone-atlas-office.is-on .phone-atlas-office-relation { color: #e4edf2; }
  #phone-atlas-works-more {
    width: 100%;
    margin-top: 8px;
    text-align: left;
  }
  #phone-atlas-works-rest[hidden],
  #phone-atlas-wrong-panel[hidden] { display: none; }
  #phone-atlas-wrong-panel:not([hidden]) { display: contents; }
  #phone-atlas-wrong-form {
    order: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    min-height: 48px;
    margin: 0;
    padding: 0 8px 0 16px;
    background: #fff;
    border: 1px solid #cbd0cb;
    border-radius: 12px;
    box-sizing: border-box;
  }
  #phone-atlas-wrong-form input {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    min-height: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    font-size: 16px;
    box-shadow: none;
  }
  #phone-atlas-wrong-form button {
    flex: 0 0 auto;
    margin: 0;
  }
  #phone-atlas-wrong-pills {
    order: 3;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
  }
  #phone-atlas-wrong .phone-atlas-pill {
    display: inline-flex;
    align-items: center;
    height: 44px;
    min-height: 44px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid #cbd0cb;
    border-radius: 999px;
    background: #fff;
    color: #092c46;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
  }
  #phone-atlas-wrong .phone-atlas-pill[aria-pressed="true"] {
    background: #092c46;
    color: #fff;
    border-color: #092c46;
  }
  main:has(#phone-atlas) > .layout > section > #graph,
  main:has(#phone-atlas) > .layout > section > .hint { display: none; }
  main:has(#phone-atlas) #details[data-phone-hide] { display: none; }

  /* A map tap still selects the seat. Address and location lookups still save the
     district. On a phone these controls are not shown. */
  [data-home-district],
  [data-clear-home] {
    display: none;
  }

  /* Dated meeting listings are paused. Hide that strip on phones only. */
  #participate .coming-up,
  #participate #coming-up {
    display: none;
  }

  /* The older graph intro repeats the phone picker, including on the first screen. */
  main:has(#phone-atlas) > h1,
  main:has(#phone-atlas) > nav[aria-label="Government"],
  main:has(#phone-atlas) label[for="search"],
  main:has(#phone-atlas) #search {
    display: none;
  }

  /* D-096. Panel-first is a DOM move: #details is inserted before #phone-atlas.
     The map-first rule above pins #phone-atlas to row 1 with order -2. This only
     releases that pin so DOM order is the visual order. The panel gets no order
     of its own. Desktop is outside this block. */
  main.phone-office-first:has(#phone-atlas):has(> .layout > section > #graph) > #phone-atlas {
    order: 0;
    grid-row: auto;
  }
  #phone-office-map-link {
    display: inline-flex;
    align-items: center;
    box-sizing: border-box;
    min-height: 44px;
    min-width: 44px;
    margin-top: 12px;
    color: #0759b5;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  #details h2[tabindex="-1"]:focus {
    outline: none;
  }
  #details h2[tabindex="-1"]:focus-visible {
    outline: 3px solid #003563;
    outline-offset: 3px;
  }
  /* Oct 24, 2026: six header destinations (District map added). Screens narrower than 520px get two even rows of
     three: the empty ::after takes a whole line only there. From 640px the spacing widens to 12px, so from 720px
     the six fit on one row beside the logo. Both switch on the screen width (vw), not the row's own width. */
  .atlas-header nav[aria-label="Main navigation"] {
    column-gap: clamp(4px, calc((100vw - 640px) * 999), 12px) !important;
  }
  .atlas-header nav[aria-label="Main navigation"]::after {
    content: "";
    order: 1;
    height: 0;
    max-width: 100%;
    margin-inline-start: calc(-1 * clamp(4px, calc((100vw - 640px) * 999), 12px));
    flex: 0 0 max(0px, calc((520px - 100vw) * 999));
  }
  .atlas-header nav[aria-label="Main navigation"] a:nth-of-type(n+4) {
    order: 2;
  }
.phone-atlas-neighborhood-group{flex-basis:100%;margin:8px 0 2px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#53636a}}