/* Additions to the prototype styles: things production needs that a static
   prototype did not (skip link, preview banner, language links, form states). */
.preview-banner{background:#fff3cd;color:#6b4e00;border-bottom:1px solid #f0d58a;font-size:.9rem;padding:.45rem 0}
[data-bs-theme=dark] .preview-banner{background:#3f2e0c;color:#ffd98a;border-color:#6b4e00}
/* Language menu: a globe and the current language's code; the list opens below. */
.nav-lang{position:relative}
.nav-lang summary{list-style:none;display:flex;align-items:center;gap:.3rem;height:38px;padding:0 .55rem;border:1px solid rgba(255,255,255,.35);border-radius:.5rem;color:#fff;font-size:.85rem;font-weight:700;cursor:pointer}
.nav-lang summary::-webkit-details-marker{display:none}
.nav-lang summary:hover{background:rgba(255,255,255,.12)}
.nav-lang summary:focus-visible{outline:3px solid var(--coalition);outline-offset:2px}
.nav-lang summary svg{width:18px;height:18px}
.nav-lang-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:60;min-width:180px;padding:.35rem;background:var(--surface);border:1px solid var(--line);border-radius:.6rem;box-shadow:0 12px 32px rgba(25,32,80,.18)}
.nav-lang-menu a{display:block;padding:.5rem .75rem;border-radius:.4rem;color:var(--ink);text-decoration:none;font-weight:600}
.nav-lang-menu a:hover{background:var(--surface-2)}
.nav-lang-menu a[aria-current]{font-weight:800;background:var(--surface-2)}
@media (max-width:1199.98px){.nav-lang-menu{right:auto;left:0}}
.footer-bottom .langs{display:flex;gap:1rem;flex-wrap:wrap}
.footer-bottom .langs a[aria-current]{font-weight:800;color:var(--ink)}
.navbar-collapse.show{display:block}
/* The menu opens from the button below 1200px: below that no language's
   labels and buttons fit on one line. Above it, items never break inside, and
   if a language's labels are longer than the room, the buttons move to a
   second row on the right instead of running off the page. */
@media (min-width:1200px){
 .navbar-collapse{display:flex!important;flex-wrap:wrap;row-gap:.5rem}
 .site-nav .nav-link,.site-nav .util .btn{white-space:nowrap}
 .site-nav .nav-link{padding:.45rem .55rem}
 .site-nav .util{margin-left:auto}
}
@media (min-width:1200px) and (max-width:1399.98px){
 .site-nav .navbar-nav{margin-left:1rem!important}
 .site-nav .nav-link{font-size:.97rem}
}
.form-note{font-size:.9rem;color:var(--ink-soft)}
.form-ok{border:1px solid var(--st-monitoring);background:var(--st-monitoring-bg);color:var(--st-monitoring);border-radius:.6rem;padding:.8rem 1rem;font-weight:600}
.form-err{border:1px solid var(--st-activated);background:var(--st-activated-bg);color:var(--st-activated);border-radius:.6rem;padding:.8rem 1rem;font-weight:600}
.hp-field{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.fl-map a:focus-visible path{outline:none;stroke:var(--coalition);stroke-width:2.5}
.fl-map .counties a path:hover{fill:var(--map-hover,#ffb18a)}
.member .logo img,.logo-tile img,.logo-big img{max-width:100%;max-height:100%;object-fit:contain}
.empty-note{color:var(--ink-soft);font-style:italic}
.pager{display:flex;justify-content:space-between;gap:1rem;margin-top:1.5rem}
.prose img{max-width:100%;height:auto;border-radius:.5rem}
.prose blockquote{border-left:3px solid var(--line);padding-left:1rem;color:var(--ink-soft)}
/* Counties in the current response are marked .hit by the renderer (the
   prototype hard-coded them by id; those rules are gone). */
.fl-map .counties path.hit{fill:var(--map-impact)}
/* Bootstrap's g-4/g-5 gutters overflow a 390px screen by 12px. */
@media (max-width:575.98px){.row.g-5,.row.g-4{--bs-gutter-x:1.5rem}}