/* Theme v2 (preview only until approved). Loaded after style.css and only overrides it, so removing this file restores v1.
   Subtle and modern: off-white / charcoal / muted blue, soft gradients, glass header, layered cards, motion that respects
   prefers-reduced-motion, and a dark mode ([data-theme=dark], or the system setting when no choice is saved). */
:root{
  --ink:#1b1e23;--ink2:#353b43;--muted:#5a616a;--line:#e4e2dd;--line2:#eeece8;--bg:#f6f5f2;--card:#fff;--card2:#fbfaf8;
  --accent:#3f6185;--accent-ink:#34516f;--accent-soft:#edf2f7;--accent-soft2:#dfe8f1;--accent-line:#c6d4e3;
  --btn-bg:#34516f;--btn-ink:#fff;--glass:rgba(250,249,247,.72);--hairline:rgba(27,30,35,.07);
  --radius:16px;--shadow:0 1px 1px rgba(20,24,30,.03),0 2px 6px rgba(20,24,30,.04),0 12px 32px -12px rgba(20,24,30,.10);
  --shadow-h:0 2px 2px rgba(20,24,30,.03),0 8px 18px rgba(20,24,30,.06),0 26px 48px -18px rgba(20,24,30,.20);
  --mesh1:rgba(120,155,195,.30);--mesh2:rgba(186,200,214,.42);--mesh3:rgba(214,205,190,.40);
  --ease:cubic-bezier(.2,.7,.2,1);--t-fast:.18s;--t:.35s;
  --fs-1:clamp(2.1rem,1.4rem + 2.6vw,3.4rem);--fs-2:clamp(1.35rem,1.1rem + .9vw,1.75rem);--fs-3:1.12rem;
}
html[data-theme=dark]{
  --ink:#e7e9ec;--ink2:#cdd2d8;--muted:#a1a9b3;--line:#2b3139;--line2:#232931;--bg:#0f1216;--card:#171b21;--card2:#1b2027;
  --accent:#8db0d6;--accent-ink:#a9c4e2;--accent-soft:#1c2633;--accent-soft2:#22303f;--accent-line:#34475d;
  --btn-bg:#a9c4e2;--btn-ink:#0f1216;--glass:rgba(17,20,25,.72);--hairline:rgba(255,255,255,.06);
  --ok:#8fd0ad;--ok-bg:#16291f;--calc:#e3c48d;--calc-bg:#2a2416;--warn:#f0a99f;--warn-bg:#2d1a18;
  --shadow:0 1px 1px rgba(0,0,0,.3),0 10px 30px -12px rgba(0,0,0,.6);--shadow-h:0 2px 2px rgba(0,0,0,.3),0 24px 48px -16px rgba(0,0,0,.75);
  --mesh1:rgba(70,110,160,.30);--mesh2:rgba(60,80,105,.35);--mesh3:rgba(110,100,85,.22);color-scheme:dark}

/* type */
body{background:var(--bg);color:var(--ink);font-feature-settings:"cv11","ss01","ss03";text-rendering:optimizeLegibility;transition:background-color var(--t) var(--ease),color var(--t) var(--ease)}
h1{font-size:var(--fs-1);letter-spacing:-.035em;font-weight:720;line-height:1.06}
h2{font-size:var(--fs-2);letter-spacing:-.022em;font-weight:680}
h3{letter-spacing:-.01em}
.lede{font-size:clamp(1.05rem,1rem + .3vw,1.22rem);line-height:1.6;color:var(--muted)}
.eyebrow{letter-spacing:.16em;color:var(--accent-ink)}
a{transition:color var(--t-fast)}
::selection{background:var(--accent-soft2)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}

/* glass header */
.site-header{background:var(--glass);backdrop-filter:saturate(1.6) blur(16px);-webkit-backdrop-filter:saturate(1.6) blur(16px);border-bottom:1px solid var(--hairline);view-transition-name:site-header;transition:box-shadow var(--t) var(--ease)}
.site-header.scrolled{box-shadow:0 8px 30px -14px rgba(20,24,30,.25)}
.brand,.brand small{color:var(--ink)}.brand small{color:var(--muted)}
.brand-mark{background:linear-gradient(140deg,var(--accent-soft2),var(--accent-soft));border-color:var(--accent-line);color:var(--accent-ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
.site-nav a{color:var(--ink2);position:relative;transition:background var(--t-fast),color var(--t-fast)}
.site-nav a:hover{background:var(--accent-soft);color:var(--ink)}
.site-nav a[aria-current]{background:var(--accent-soft2);color:var(--accent-ink)}
.nav-toggle,.theme-toggle{background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:10px;font:inherit;cursor:pointer}
.theme-toggle{display:inline-grid;place-items:center;width:40px;height:40px;padding:0;margin-left:6px;order:3;transition:transform var(--t-fast) var(--ease),background var(--t-fast)}
.theme-toggle:hover{background:var(--accent-soft)}.theme-toggle:active{transform:scale(.92)}
.theme-toggle svg{width:18px;height:18px}.theme-toggle .moon{display:none}
html[data-theme=dark] .theme-toggle .sun{display:none}html[data-theme=dark] .theme-toggle .moon{display:block}
@media (max-width:900px){.theme-toggle{margin-left:auto}.nav-toggle{margin-left:8px}}
.preview-ribbon{background:transparent;color:var(--muted);border-bottom:1px solid var(--hairline)}
.deadline-banner{background:linear-gradient(90deg,var(--accent-soft),var(--card2),var(--accent-soft));border-bottom:1px solid var(--hairline);color:var(--ink)}
.deadline-banner strong{color:var(--accent-ink)}

/* buttons + micro-interactions */
.btn,.btn-amber{background:var(--btn-bg);border-color:var(--btn-bg);color:var(--btn-ink);border-radius:12px;box-shadow:0 1px 0 rgba(255,255,255,.15) inset,0 6px 16px -8px rgba(30,50,75,.5);transition:transform var(--t-fast) var(--ease),box-shadow var(--t-fast),background var(--t-fast)}
.btn:hover,.btn-amber:hover{color:var(--btn-ink);background:var(--btn-bg);transform:translateY(-1px);box-shadow:0 1px 0 rgba(255,255,255,.15) inset,0 12px 24px -10px rgba(30,50,75,.55)}
.btn:active{transform:translateY(0) scale(.98)}
.btn-ghost{background:var(--card);color:var(--ink);border:1px solid var(--line);box-shadow:none}
.btn-ghost:hover{background:var(--accent-soft);color:var(--ink);box-shadow:none}

/* hero with animated mesh */
.hero{background:var(--card);border:1px solid var(--hairline);border-radius:24px;box-shadow:var(--shadow);isolation:isolate}
.hero::before{content:"";position:absolute;inset:-40%;height:auto;z-index:-1;background:
  radial-gradient(38% 42% at 22% 30%,var(--mesh1),transparent 70%),radial-gradient(34% 38% at 78% 24%,var(--mesh2),transparent 70%),
  radial-gradient(40% 46% at 60% 82%,var(--mesh3),transparent 72%);filter:blur(28px);animation:mesh 22s var(--ease) infinite alternate;will-change:transform}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 0,var(--card) 92%);opacity:.55}
@keyframes mesh{0%{transform:translate3d(0,0,0) rotate(0) scale(1)}50%{transform:translate3d(4%,-3%,0) rotate(8deg) scale(1.06)}100%{transform:translate3d(-3%,4%,0) rotate(-6deg) scale(1.02)}}
.hero h1{font-size:clamp(2rem,1.3rem + 2.8vw,3.2rem)}
.countdown div{background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--hairline);border-radius:16px;box-shadow:var(--shadow)}
.countdown b{color:var(--ink);display:inline-block}
.countdown b.tick{animation:tick .45s var(--ease)}
@keyframes tick{0%{transform:translateY(-35%);opacity:0;filter:blur(2px)}100%{transform:none;opacity:1;filter:none}}
.kd-list-wrap{background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--hairline)}
.kd-item{transition:background var(--t-fast),transform var(--t-fast) var(--ease)}
.kd-item:hover{background:var(--accent-soft);transform:translateX(2px)}
.kd-item.is-next{background:var(--card);box-shadow:0 0 0 1px var(--accent-line),var(--shadow)}
.kd-item.is-next .kd-date::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-right:7px;vertical-align:1px;animation:pulse 2.2s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 55%,transparent)}100%{box-shadow:0 0 0 9px transparent}}
.badge,.tag,.chip,.pill,.dstatus{border-radius:999px;transition:transform var(--t-fast) var(--ease),background var(--t-fast)}
.chip:hover,.pill:hover{transform:translateY(-1px)}

/* layered surfaces */
.card,.tile,.hook,.res,.race,.vs-col,.cmp-col,.acc,.lookup,.glance-box,.profile-hero,.em-panel,.ut-item,.office-card,.water-board,.ask-card,.ask-inline,.bcontest,.cal-item,.feature-map,.step,.callout,.race-teaser,.ballot-callout{
  background:var(--card);border:1px solid var(--hairline);border-radius:var(--radius);box-shadow:var(--shadow)}
.card,.tile,.hook,.race-teaser,.res,.ut-item,.office-card,.bcontest,.cal-item,.vs-col{transition:transform var(--t) var(--ease),box-shadow var(--t) var(--ease),border-color var(--t)}
.card:hover,.tile:hover,.hook:hover,.race-teaser:hover,.office-card:hover,.ut-item:hover,.vs-col:hover{transform:translateY(-4px);box-shadow:var(--shadow-h);border-color:var(--accent-line)}
.res:hover,.bcontest:hover,.cal-item:hover{box-shadow:var(--shadow-h)}
.tile{background:linear-gradient(160deg,var(--card),var(--card2))}
.feature-map{background:linear-gradient(135deg,var(--card) 0,var(--accent-soft) 100%)}
.ballot-callout{background:linear-gradient(120deg,var(--accent-soft) 0,var(--card) 60%);position:relative;overflow:hidden}
.ballot-callout::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,var(--mesh1),transparent 70%);filter:blur(10px)}
.bbanner{background:var(--calc-bg);border-left-color:var(--calc);color:var(--ink)}
.bnone{background:var(--card2)}.bc{border-top-color:var(--line2)}.bc-party,.bcontest .src{color:var(--muted)}
.ballot .bgroup{border-bottom:1px solid var(--line);font-size:var(--fs-3);text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.bc-pick input{accent-color:var(--accent)}
.photo-ph{background:var(--accent-soft)}

/* inputs */
.lookup input,.filters select,.filters input[type=search],.cmp-pickers select,.ask-card input,.ask-card select,textarea,select,input[type=text],input[type=search]{background:var(--card2);color:var(--ink);border:1px solid var(--line);border-radius:12px;transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.lookup input:focus,select:focus,input:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 18%,transparent);outline:none}
.ac-list{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-h);animation:pop .16s var(--ease)}
.ac-opt[aria-selected=true],.ac-opt:hover{background:var(--accent-soft)}
.pill,.seg-b,.tab{background:var(--card);color:var(--ink2);border-color:var(--line)}
.pill[aria-pressed=true],.seg-b[aria-pressed=true],.tab[aria-selected=true]{background:var(--accent-soft2);color:var(--accent-ink);border-color:var(--accent-line)}
.sticky-filters{background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.cmp-tray{background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--hairline)}
table th{background:var(--card2)}th,td{border-color:var(--line)}

/* map: paper-like panel that stays readable in both modes */
.em-map{background:var(--card);border:1px solid var(--hairline);border-radius:20px;box-shadow:var(--shadow);padding:10px}
html[data-theme=dark] .em-map svg,html[data-theme=dark] .ut-maps svg{filter:brightness(.92) contrast(1.05)}
.em-map path,.ut-maps path{transition:filter var(--t-fast),opacity var(--t-fast)}
.em-map path:hover,.ut-maps path:hover{filter:brightness(1.08) saturate(1.1)}
.ctl-bar{border-radius:999px;overflow:hidden}

/* Ask */
.ask-card{background:linear-gradient(180deg,var(--card),var(--card2))}
details.ask-src>summary{border-radius:10px;transition:background var(--t-fast)}
details.ask-src>summary:hover{background:var(--accent-soft)}
details.ask-src[open] .ask-src-list{animation:fade .25s var(--ease)}
.ask-chip-thin,.ask-meta{background:var(--card2);color:var(--muted)}

/* skeleton loaders */
.skel{display:grid;gap:12px;margin:14px 0}
.skel i{display:block;height:84px;border-radius:var(--radius);background:linear-gradient(90deg,var(--line2) 0,var(--card2) 40%,var(--line2) 80%);background-size:300% 100%;animation:shimmer 1.3s linear infinite}
.skel i:nth-child(2){height:120px}.skel i:nth-child(3){height:64px;width:70%}
[aria-busy=true]{position:relative}
@keyframes shimmer{0%{background-position:100% 0}100%{background-position:-50% 0}}

/* scroll reveal (staggered) */
.reveal{opacity:0;transform:translateY(18px) scale(.985);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--i,0) * 70ms)}
.reveal.in{opacity:1;transform:none}

/* footer */
.site-footer{background:linear-gradient(180deg,transparent,var(--accent-soft));border-top:1px solid var(--hairline);color:var(--ink2)}
.site-footer h2{color:var(--ink)}

/* page transitions */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-out .22s var(--ease) both}
::view-transition-new(root){animation:vt-in .32s var(--ease) both}
@keyframes vt-out{to{opacity:0;transform:translateY(-6px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(8px)}}

/* reduced motion: no animation, no transitions, no view transitions */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
  ::view-transition-old(root),::view-transition-new(root){animation:none!important}
  .card:hover,.tile:hover,.hook:hover,.race-teaser:hover,.office-card:hover,.ut-item:hover,.vs-col:hover{transform:none}
}
@media print{.theme-toggle,.hero::before{display:none!important}body{background:#fff;color:#000}}
/* header layout: brand · nav · toggle on one row (desktop); brand · Menu · toggle (mobile) */
@media (min-width:901px){
  .header-inner{flex-wrap:nowrap;gap:12px}
  .site-nav{flex:1 1 auto;justify-content:flex-end;gap:0;margin-left:auto}
  .site-nav a{font-size:.84rem;padding:6px 8px}
  .theme-toggle{order:3;flex:none;margin-left:4px}
}
@media (max-width:900px){
  .nav-toggle{order:2;margin-left:auto}.theme-toggle{order:3;margin-left:8px}.site-nav{order:4}
}
/* countdown fits small screens */
.countdown{gap:10px}
.countdown div{flex:1 1 0;min-width:0}
@media (max-width:480px){.countdown{gap:6px}.countdown div{padding:10px 4px 8px}.countdown b{font-size:1.9rem}.countdown span{font-size:.6rem;letter-spacing:.06em}}
/* performance: reserve the deadline banner's space (no layout shift when app.js fills it); glass only on the header;
   mesh is pure gradients moved with transform (no filter), paused when off-screen via content-visibility on sections */
.deadline-banner{min-height:2.55em;box-sizing:border-box}
.deadline-banner[hidden]{display:block;visibility:hidden}
@media (max-width:560px){.deadline-banner{min-height:4.1em}}
body{transition:none}
.hero::before{filter:none;inset:-20%;background:
  radial-gradient(45% 50% at 22% 30%,var(--mesh1),transparent 72%),radial-gradient(40% 45% at 78% 24%,var(--mesh2),transparent 72%),
  radial-gradient(48% 52% at 60% 82%,var(--mesh3),transparent 74%)}
.countdown div,.kd-list-wrap,.sticky-filters,.cmp-tray{backdrop-filter:none;-webkit-backdrop-filter:none}
.countdown div,.kd-list-wrap{background:color-mix(in srgb,var(--card) 82%,transparent)}
.site-footer,.grid-3,.split,.hooks{content-visibility:auto;contain-intrinsic-size:auto 600px}
/* election map: reserve space for parts election.js fills after load (prevents layout shift) */
#em-status{min-height:2.8em}
.em-control{min-height:72px}
.em-legend{min-height:30px}
#us-svg{aspect-ratio:975/610;width:100%;height:auto}
.em-credit{min-height:1.6em}
@media (max-width:600px){.em-toolbar{min-height:138px}.em-control{min-height:286px}#em-status{min-height:9em}}
@media (min-width:601px){.em-toolbar{min-height:44px}.em-control{min-height:120px}#em-status{min-height:4.5em}}
.deadline-banner{min-height:44px}@media (max-width:560px){.deadline-banner{min-height:68px}}

/* Oct 13 feedback: brighter light default. Bright off-white, lighter hero, lighter glass, softer shadows, fewer charcoal
   surfaces; muted blue accent unchanged. Dark mode only when the visitor turns it on. */
:root:not([data-theme=dark]){
  --bg:#fbfaf7;--card:#ffffff;--card2:#fdfcfa;--line:#ebe8e2;--line2:#f3f1ed;--ink:#22262c;--ink2:#3d434b;--muted:#5c636c;
  --glass:rgba(255,255,255,.80);--hairline:rgba(34,38,44,.06);
  --btn-bg:#3f6185;--btn-ink:#fff;
  --shadow:0 1px 1px rgba(30,40,55,.02),0 1px 4px rgba(30,40,55,.03),0 10px 26px -14px rgba(30,40,55,.08);
  --shadow-h:0 1px 2px rgba(30,40,55,.03),0 6px 14px rgba(30,40,55,.04),0 20px 38px -18px rgba(30,40,55,.13);
  --mesh1:rgba(150,180,215,.20);--mesh2:rgba(205,215,226,.30);--mesh3:rgba(232,224,210,.32);color-scheme:light}
:root:not([data-theme=dark]) .hero::after{opacity:.75}
:root:not([data-theme=dark]) .btn,:root:not([data-theme=dark]) .btn-amber{box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 4px 12px -6px rgba(63,97,133,.35)}
:root:not([data-theme=dark]) .site-footer{background:linear-gradient(180deg,transparent,#f3f6fa)}
:root:not([data-theme=dark]) .deadline-banner{background:linear-gradient(90deg,#f1f5f9,#fdfcfa,#f1f5f9)}