@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');

:root {
  --ink: #07111f;
  --ink-soft: #0c1b2e;
  --panel: #101f32;
  --panel-light: #152943;
  --line: rgba(223, 232, 237, 0.13);
  --line-bright: rgba(223, 232, 237, 0.24);
  --paper: #f1f5f3;
  --paper-muted: #a6b4c0;
  --paper-faint: #708294;
  --lime: #c8f230;
  --lime-soft: rgba(200, 242, 48, 0.13);
  --amber: #f6bd62;
  --amber-soft: rgba(246, 189, 98, 0.13);
  --cyan: #6ed8e7;
  --display: 'Space Grotesk', 'Arial Narrow', sans-serif;
  --body: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --shadow: 0 20px 70px rgba(0, 0, 0, 0.22);
}

* { box-sizing: border-box; }
html { background: var(--ink); scroll-behavior: smooth; }
body { margin: 0; background: var(--ink); color: var(--paper); font-family: var(--body); font-size: 14px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
button, input, select { font: inherit; }
button, a, select { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }
.app-shell { width: min(100%, 1600px); margin: 0 auto; overflow: hidden; position: relative; background: var(--ink); }
.app-shell::before { content: ''; position: absolute; top: 0; left: 14%; right: 0; height: 680px; pointer-events: none; background: radial-gradient(circle at 68% 8%, rgba(34, 87, 113, 0.3), transparent 37%), radial-gradient(circle at 25% 0%, rgba(200, 242, 48, 0.055), transparent 26%); }
.topbar, main, .footer { position: relative; z-index: 1; }
.topbar { height: 88px; display: flex; align-items: center; justify-content: space-between; padding: 0 clamp(22px, 5vw, 80px); border-bottom: 1px solid rgba(223, 232, 237, 0.08); }
.brand { display: inline-flex; align-items: center; gap: 11px; font: 700 22px/1 var(--display); letter-spacing: -0.055em; }
.brand-accent { color: var(--lime); }
.brand-mark { width: 27px; height: 28px; position: relative; display: inline-block; transform: skew(-7deg); }
.brand-mark span { position: absolute; bottom: 3px; width: 5px; border-radius: 2px 2px 0 0; background: var(--lime); }
.brand-mark span:first-child { left: 4px; height: 13px; opacity: 0.65; }
.brand-mark span:nth-child(2) { left: 11px; height: 21px; }
.brand-mark i { position: absolute; right: 1px; top: 2px; width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 5px rgba(200,242,48,.11); }
.topbar-right { display: flex; align-items: center; gap: 14px; }
.demo-badge { display: inline-flex; align-items: center; gap: 8px; color: var(--amber); border: 1px solid rgba(246,189,98,.26); background: var(--amber-soft); border-radius: 999px; padding: 7px 11px 7px 9px; font-size: 10px; font-weight: 700; letter-spacing: .105em; text-transform: uppercase; }
.badge-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 0 4px rgba(246,189,98,.12); }
.icon-button, .menu-button { display: grid; place-items: center; border: 1px solid var(--line); background: transparent; color: var(--paper-muted); transition: .2s ease; }
.icon-button { width: 34px; height: 34px; border-radius: 50%; }
.icon-button svg { width: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.icon-button:hover, .menu-button:hover { border-color: var(--lime); color: var(--lime); }
.menu-button { display: none; width: 38px; height: 34px; border: 0; gap: 5px; flex-direction: column; align-items: flex-end; justify-content: center; }
.menu-button span { display: block; height: 1px; width: 21px; background: var(--paper); }
.menu-button span:last-child { width: 13px; background: var(--paper-muted); }
.page-section { padding-left: clamp(22px, 5vw, 80px); padding-right: clamp(22px, 5vw, 80px); }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(350px, .7fr); gap: clamp(30px, 6vw, 120px); padding-top: clamp(70px, 9vw, 145px); padding-bottom: 70px; }
.eyebrow, .section-index, .status-label, .summary-label { text-transform: uppercase; font-size: 10px; font-weight: 700; letter-spacing: .14em; }
.eyebrow { display: flex; align-items: center; gap: 10px; color: var(--paper-muted); }
.eyebrow-line { width: 31px; height: 1px; background: var(--lime); }
.eyebrow-separator { color: var(--lime); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3, .brand, .status-card strong, .metric strong { font-family: var(--display); }
h1 { max-width: 790px; margin: 23px 0 24px; font-size: clamp(56px, 8.2vw, 116px); line-height: .9; letter-spacing: -.078em; font-weight: 600; }
h1 em, h2 em { color: var(--lime); font-style: normal; }
.hero-lede { max-width: 500px; color: var(--paper-muted); font-size: 16px; line-height: 1.7; }
.hero-footnote { display: flex; align-items: center; gap: 10px; margin-top: 42px; color: var(--paper-faint); font-size: 11px; }
.hero-footnote strong { color: var(--paper); font-weight: 600; margin-left: 3px; }
.pulse-ring, .tiny-pulse, .live-dot { border-radius: 50%; background: var(--lime); display: inline-block; }
.pulse-ring { width: 8px; height: 8px; box-shadow: 0 0 0 5px rgba(200,242,48,.12); animation: pulse 1.9s infinite; }
@keyframes pulse { 0%,100% { box-shadow: 0 0 0 4px rgba(200,242,48,.1); } 50% { box-shadow: 0 0 0 8px rgba(200,242,48,0); } }
.status-card { min-height: 360px; align-self: end; padding: 22px; border: 1px solid var(--line); border-radius: 9px; background: linear-gradient(145deg, rgba(21,41,67,.78), rgba(11,28,47,.86)); box-shadow: var(--shadow); position: relative; overflow: hidden; }
.status-card::after { content: ''; position: absolute; right: -60px; bottom: -100px; width: 220px; height: 220px; background: radial-gradient(circle, rgba(200,242,48,.13), transparent 67%); pointer-events: none; }
.status-card-top { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--line); padding-bottom: 18px; }
.status-label { display: inline-flex; align-items: center; gap: 8px; color: var(--lime); font-size: 9px; letter-spacing: .12em; }
.live-dot { width: 6px; height: 6px; box-shadow: 0 0 0 4px rgba(200,242,48,.1); }
.status-time { color: var(--paper-muted); font: 600 12px var(--display); font-variant-numeric: tabular-nums; }
.progress-ring-wrap { display: flex; align-items: center; gap: 20px; padding: 35px 0 30px; }
.progress-ring { --progress: 68.4deg; width: 145px; height: 145px; flex: 0 0 145px; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(var(--lime) var(--progress), rgba(223,232,237,.1) 0); position: relative; }
.progress-ring::before { content: ''; position: absolute; inset: 9px; background: var(--panel); border-radius: 50%; }
.progress-ring > div { z-index: 1; text-align: center; }
.progress-ring strong { display: block; font: 600 31px/1 var(--display); letter-spacing: -.07em; }
.progress-ring span { color: var(--paper-muted); display: block; margin-top: 7px; font-size: 10px; }
.status-summary { display: grid; gap: 8px; }
.summary-label { color: var(--paper-faint); font-size: 9px; }
.status-summary strong { font-size: 25px; letter-spacing: -.06em; font-variant-numeric: tabular-nums; }
.summary-note { color: var(--paper-faint); font-size: 11px; }
.positive { color: var(--lime); }
.source-lockup { position: absolute; left: 22px; right: 22px; bottom: 20px; display: flex; align-items: center; gap: 10px; padding-top: 16px; border-top: 1px solid var(--line); color: var(--paper-muted); }
.source-icon { display: grid; place-items: center; width: 24px; height: 24px; border: 1px solid rgba(200,242,48,.32); color: var(--lime); border-radius: 50%; font-size: 13px; }
.source-lockup span:nth-child(2) { display: grid; gap: 1px; }
.source-lockup b { font-size: 11px; color: var(--paper); font-weight: 600; }
.source-lockup small { font-size: 9px; color: var(--paper-faint); }
.source-arrow { margin-left: auto; color: var(--lime); font-size: 18px; }
.metric-strip { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.15fr; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding-top: 24px; padding-bottom: 24px; }
.metric { min-height: 90px; padding: 4px clamp(16px, 2.4vw, 37px); border-left: 1px solid var(--line); display: flex; flex-direction: column; justify-content: center; gap: 5px; }
.metric:first-child { padding-left: 0; border-left: 0; }
.metric span { color: var(--paper-faint); font-size: 10px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
.metric strong { color: var(--paper); font-size: 28px; letter-spacing: -.06em; font-variant-numeric: tabular-nums; }
.metric strong small { color: var(--paper-faint); font: 500 13px var(--body); letter-spacing: 0; }
.metric > small { color: var(--paper-faint); font-size: 10px; }
.metric-primary strong { color: var(--lime); }
.metric-action { position: relative; }
.text-button { width: max-content; border: 0; padding: 0; background: transparent; color: var(--lime); font-size: 10px; font-weight: 600; }
.text-button span { display: inline-block; margin-left: 5px; font-size: 12px; }
.workspace { padding-top: 58px; padding-bottom: 50px; }
.workspace-nav { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.view-tabs { display: flex; align-items: center; gap: clamp(19px, 3.3vw, 58px); }
.view-tabs a { position: relative; display: flex; align-items: center; gap: 9px; padding: 0 0 17px; color: var(--paper-faint); font: 600 12px var(--display); transition: color .2s ease; }
.view-tabs a span { color: var(--paper-faint); font: 500 9px var(--body); }
.view-tabs a::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: transparent; }
.view-tabs a:hover, .view-tabs a.active { color: var(--paper); }
.view-tabs a.active::after { background: var(--lime); }
.workspace-updated { display: flex; gap: 8px; align-items: center; padding-bottom: 17px; color: var(--lime); font-size: 10px; text-transform: uppercase; letter-spacing: .12em; }
.tiny-pulse { width: 6px; height: 6px; box-shadow: 0 0 0 4px rgba(200,242,48,.08); }
.view-mode-button { margin-left: 11px; padding: 0 0 0 11px; border: 0; border-left: 1px solid var(--line); background: transparent; color: var(--paper-faint); }
.filter-row { display: flex; align-items: center; gap: 15px; padding: 25px 0 40px; }
.filter-label, .select-prefix { color: var(--paper-faint); font-size: 10px; text-transform: uppercase; letter-spacing: .11em; }
.filter-chips { display: flex; gap: 7px; flex-wrap: wrap; }
.filter-chip { border: 1px solid var(--line); border-radius: 999px; background: transparent; color: var(--paper-muted); padding: 7px 13px; font-size: 11px; transition: .2s ease; }
.filter-chip:hover, .filter-chip.active { border-color: var(--lime); color: var(--ink); background: var(--lime); }
.filter-spacer { flex: 1; }
.region-select-wrap { position: relative; display: flex; gap: 8px; align-items: center; border-left: 1px solid var(--line); padding-left: 18px; }
.region-select-wrap select { appearance: none; border: 0; padding: 4px 21px 4px 0; color: var(--paper); background: transparent; outline: 0; font-size: 11px; font-weight: 600; }
.region-select-wrap option { color: var(--ink); }
.select-chevron { position: absolute; right: 2px; pointer-events: none; color: var(--lime); font-size: 16px; top: 0; }
.content-layout { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(270px, .68fr); gap: clamp(28px, 5vw, 85px); }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 28px; }
.section-index { color: var(--lime); font-size: 9px; letter-spacing: .13em; }
.section-index span { color: var(--paper-faint); margin: 0 6px; }
h2 { margin: 9px 0 0; font-size: clamp(38px, 4.5vw, 66px); line-height: .94; letter-spacing: -.075em; }
.heading-note { display: flex; align-items: center; gap: 8px; color: var(--paper-faint); font-size: 10px; padding-bottom: 5px; white-space: nowrap; }
.results-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.race-card { padding: 20px 20px 17px; background: var(--panel); border: 1px solid var(--line); border-radius: 7px; transition: border-color .25s ease, transform .25s ease; position: relative; overflow: hidden; animation: cardIn .35s ease both; }
.race-card:hover { border-color: var(--line-bright); transform: translateY(-2px); }
.race-card.wide { grid-column: span 2; }
.race-card::after { content: ''; position: absolute; width: 130px; height: 130px; right: -75px; top: -75px; background: radial-gradient(circle, rgba(200,242,48,.1), transparent 67%); pointer-events: none; }
@keyframes cardIn { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
.race-card-top { display: flex; align-items: start; justify-content: space-between; margin-bottom: 20px; }
.race-kicker { color: var(--paper-faint); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.race-card h3 { margin: 5px 0 0; font-size: 21px; letter-spacing: -.055em; }
.race-delta { display: inline-flex; align-items: center; gap: 5px; color: var(--lime); background: var(--lime-soft); padding: 5px 7px; border-radius: 3px; font-size: 10px; font-weight: 700; }
.race-delta.down { color: var(--amber); background: var(--amber-soft); }
.candidate-list { display: grid; gap: 15px; }
.candidate-row { display: grid; grid-template-columns: 26px 1fr auto; gap: 9px; align-items: center; }
.candidate-position { color: var(--paper-faint); font: 600 11px var(--display); }
.candidate-identity { min-width: 0; display: grid; gap: 5px; }
.candidate-name-line { display: flex; justify-content: space-between; gap: 10px; font-size: 11px; }
.candidate-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--paper); font-weight: 600; }
.candidate-party { color: var(--paper-faint); font-size: 9px; font-weight: 400; margin-left: 5px; }
.party-mark { display: inline-grid; place-items: center; width: 24px; height: 19px; margin-right: 6px; vertical-align: -5px; overflow: hidden; border-radius: 3px; color: #fff; font: 800 9px/1 var(--display); letter-spacing: -.04em; box-shadow: 0 0 0 1px rgba(255,255,255,.18); }
.party-pl { position: relative; background: #1d5da8; }
.party-pl::before { content: ''; position: absolute; inset: 0 0 7px; background: #1d5da8; }
.party-pl::after { content: ''; position: absolute; right: -6px; bottom: 3px; width: 31px; height: 4px; transform: rotate(-17deg); background: #f4c62b; }
.party-flag, .party-star { position: relative; z-index: 1; display: grid; place-items: center; width: 100%; height: 100%; }
.party-flag b { position: relative; z-index: 2; font-size: 10px; }
.party-pt { background: #e3262e; border-radius: 50%; }
.party-star { color: #fff; font-size: 17px; line-height: 1; }
.party-star b { position: absolute; color: #e3262e; font: 800 7px/1 var(--display); letter-spacing: -.08em; }
.party-generic { padding: 0 4px; color: var(--ink); background: var(--paper-muted); }
.bar-label .party-mark { margin-right: 5px; }
.vote-bar { height: 6px; border-radius: 99px; overflow: hidden; background: rgba(223,232,237,.1); }
.vote-bar-fill { display: block; height: 100%; border-radius: inherit; background: var(--candidate-color, var(--lime)); transition: width .7s cubic-bezier(.2,.75,.3,1); }
.candidate-votes { text-align: right; min-width: 65px; }
.candidate-votes strong { display: block; font: 600 18px/1 var(--display); letter-spacing: -.06em; }
.candidate-votes small { color: var(--paper-faint); font-size: 9px; }
.race-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 20px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--paper-faint); font-size: 10px; }
.race-footer strong { color: var(--paper); font-weight: 600; }
.race-footer a { color: var(--lime); font-weight: 600; }
.change-section { margin-top: 58px; }
.subsection-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.subsection-heading h3, .side-panel h3 { margin: 7px 0 0; font-size: 21px; letter-spacing: -.055em; }
.change-count { color: var(--paper-faint); font-size: 10px; }
.change-feed { display: grid; }
.change-item { display: grid; grid-template-columns: 20px 80px 1fr auto; gap: 12px; align-items: center; min-height: 61px; border-bottom: 1px solid var(--line); color: var(--paper-muted); font-size: 11px; }
.change-item .change-bullet { width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 4px rgba(200,242,48,.08); }
.change-time { color: var(--paper-faint); font-variant-numeric: tabular-nums; }
.change-item strong { color: var(--paper); font-weight: 600; }
.change-value { color: var(--lime); font-weight: 700; font-size: 10px; }
.side-column { display: grid; align-content: start; gap: 13px; padding-top: 2px; }
.side-panel { border: 1px solid var(--line); border-radius: 7px; background: rgba(16,31,50,.72); padding: 19px; }
.side-panel-header { display: flex; align-items: start; justify-content: space-between; gap: 13px; }
.side-panel h3 { color: var(--paper); }
.keyboard-hint { border: 1px solid var(--line); color: var(--paper-faint); border-radius: 3px; padding: 3px 5px; font-size: 9px; }
.search-input-wrap { display: flex; gap: 8px; align-items: center; margin-top: 18px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 5px; transition: border .2s ease; }
.search-input-wrap:focus-within { border-color: var(--lime); }
.search-input-wrap svg { width: 15px; fill: none; stroke: var(--paper-faint); stroke-width: 1.7; stroke-linecap: round; }
.search-input-wrap input { min-width: 0; flex: 1; border: 0; outline: 0; color: var(--paper); background: transparent; font-size: 11px; }
.search-input-wrap input::placeholder { color: var(--paper-faint); }
.search-input-wrap button { border: 0; background: transparent; color: var(--paper-faint); font-size: 19px; line-height: 1; }
.search-results { min-height: 96px; }
.search-empty { display: grid; justify-items: center; align-content: center; min-height: 110px; text-align: center; }
.search-empty-icon { color: var(--lime); font: 29px var(--display); }
.search-empty p { margin: 7px 0 0; color: var(--paper-faint); font-size: 10px; line-height: 1.55; }
.municipality-result { display: flex; align-items: center; gap: 9px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.municipality-result:last-child { border-bottom: 0; }
.municipality-pin { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; color: var(--lime); border: 1px solid rgba(200,242,48,.28); font-size: 12px; }
.municipality-result div { display: grid; gap: 2px; min-width: 0; flex: 1; }
.municipality-result strong { font-size: 11px; }
.municipality-result small { color: var(--paper-faint); font-size: 9px; }
.municipality-result > span { color: var(--lime); font: 600 12px var(--display); }
.side-link { color: var(--lime); font-size: 10px; font-weight: 600; white-space: nowrap; }
.coverage-map { min-height: 165px; margin: 16px -3px 13px; position: relative; overflow: hidden; background: radial-gradient(ellipse at center, rgba(110,216,231,.09), transparent 67%); border: 1px solid rgba(223,232,237,.06); border-radius: 4px; }
.map-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(223,232,237,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(223,232,237,.05) 1px, transparent 1px); background-size: 21px 21px; opacity: .45; }
.map-region { position: absolute; display: grid; place-items: center; border: 1px solid rgba(200,242,48,.5); border-radius: 50%; width: 42px; height: 42px; color: var(--lime); font: 600 10px var(--display); background: rgba(200,242,48,.09); box-shadow: 0 0 25px rgba(200,242,48,.07); }
.region-norte { top: 25px; left: 35%; } .region-nordeste { top: 43px; right: 15%; } .region-centro { top: 77px; left: 39%; } .region-sudeste { bottom: 19px; right: 22%; } .region-sul { bottom: 8px; left: 41%; }
.coverage-legend { display: flex; justify-content: space-between; align-items: center; color: var(--paper-faint); font-size: 10px; }
.legend-dot { display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: var(--lime); }
.coverage-legend strong { color: var(--paper); font: 600 16px var(--display); }
.pulse-panel { background: var(--lime); color: var(--ink); min-height: 153px; display: flex; flex-direction: column; justify-content: space-between; }
.pulse-quote-mark { font: 700 46px/0.7 var(--display); opacity: .42; }
.pulse-panel p { max-width: 210px; margin: 0; font: 600 18px/1.08 var(--display); letter-spacing: -.05em; }
.pulse-panel span { font-size: 9px; opacity: .66; }
.hidden-view { display: none; }
.route-view.is-visible { display: block; }
.region-heading { max-width: 900px; margin-bottom: 40px; }
.region-heading > p { max-width: 330px; margin-bottom: 5px; color: var(--paper-muted); font-size: 12px; line-height: 1.6; }
.regions-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.region-card { min-height: 186px; padding: 18px; border: 1px solid var(--line); background: var(--panel); border-radius: 6px; position: relative; overflow: hidden; }
.region-card:first-child { background: linear-gradient(145deg, rgba(200,242,48,.15), var(--panel) 68%); }
.region-card::before { content: ''; position: absolute; right: -18px; bottom: -18px; width: 80px; height: 80px; border-radius: 50%; border: 1px solid rgba(200,242,48,.23); }
.region-card .section-index { display: block; margin-bottom: 22px; }
.region-card h3 { margin: 0 0 7px; font-size: 21px; }
.region-card p { color: var(--paper-faint); margin: 0 0 17px; font-size: 10px; }
.region-card strong { font: 600 25px var(--display); letter-spacing: -.07em; }
.region-card small { display: block; margin-top: 4px; color: var(--lime); font-size: 9px; }
.state-table-wrap { margin-top: 53px; }
.state-table { display: grid; }
.state-row { display: grid; grid-template-columns: 25px 1.2fr 1fr 75px 70px; gap: 15px; align-items: center; min-height: 56px; border-bottom: 1px solid var(--line); color: var(--paper-muted); font-size: 11px; }
.state-row strong { color: var(--paper); font-weight: 600; }
.state-row .state-progress { height: 5px; border-radius: 99px; background: rgba(223,232,237,.1); overflow: hidden; }
.state-row .state-progress span { display: block; height: 100%; background: var(--lime); border-radius: inherit; }
.state-row .state-percent { text-align: right; color: var(--paper); font: 600 14px var(--display); }
.state-row .state-leader { color: var(--lime); font-size: 10px; }
.methodology-view { max-width: 920px; }
.methodology-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.methodology-grid article { min-height: 190px; padding: 24px; background: var(--panel); }
.method-number { color: var(--lime); font: 600 12px var(--display); }
.methodology-grid h3 { margin: 30px 0 8px; font-size: 18px; }
.methodology-grid p { margin: 0; color: var(--paper-muted); font-size: 11px; line-height: 1.7; }
.methodology-note { display: flex; gap: 13px; margin-top: 16px; padding: 18px; border: 1px solid rgba(246,189,98,.25); background: var(--amber-soft); border-radius: 6px; }
.note-icon { flex: 0 0 24px; display: grid; place-items: center; width: 24px; height: 24px; border: 1px solid var(--amber); border-radius: 50%; color: var(--amber); font-weight: 700; }
.methodology-note strong { display: block; margin-bottom: 4px; color: var(--amber); font-size: 11px; }
.methodology-note p { margin: 0; color: var(--paper-muted); font-size: 11px; }
.footer { display: flex; align-items: center; gap: 22px; padding: 28px clamp(22px, 5vw, 80px) 42px; color: var(--paper-faint); border-top: 1px solid var(--line); font-size: 10px; }
.footer-brand { display: inline-flex; align-items: center; gap: 7px; color: var(--paper); font: 600 13px var(--display); }
.brand-mark.small { transform: scale(.58); transform-origin: right center; margin-right: -4px; }
.footer > a { margin-left: auto; color: var(--lime); }
.footer-copyright { color: var(--paper-faint); font-size: 9px; letter-spacing: .02em; }
.mobile-dock { display: none; }
.compact .race-card { padding: 14px; }
.compact .candidate-list { gap: 9px; }
.compact .side-column { display: none; }
.compact .content-layout { grid-template-columns: 1fr; }
@media (max-width: 1020px) {
  .hero-grid { grid-template-columns: 1fr minmax(320px, .75fr); gap: 35px; }
  h1 { font-size: clamp(54px, 8vw, 82px); }
  .content-layout { gap: 25px; }
  .regions-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 760px) {
  body { padding-bottom: 76px; }
  .topbar { height: 68px; padding: 0 18px; }
  .brand { font-size: 19px; }
  .demo-badge { padding: 6px 8px; font-size: 8px; letter-spacing: .08em; }
  .icon-button { width: 31px; height: 31px; }
  .menu-button { display: flex; }
  .hero-grid { display: block; padding-top: 55px; padding-bottom: 42px; }
  .hero-copy { padding-right: 8px; }
  h1 { margin-top: 19px; font-size: clamp(53px, 15vw, 78px); }
  .hero-lede { font-size: 14px; line-height: 1.6; }
  .hero-footnote { margin-top: 29px; }
  .status-card { min-height: 325px; margin-top: 42px; padding: 17px; }
  .progress-ring-wrap { gap: 15px; padding: 28px 0 27px; }
  .progress-ring { width: 122px; height: 122px; flex-basis: 122px; }
  .progress-ring strong { font-size: 27px; }
  .status-summary strong { font-size: 21px; }
  .metric-strip { grid-template-columns: repeat(2, 1fr); padding: 0; }
  .metric { min-height: 98px; padding: 17px 15px; border-top: 1px solid var(--line); }
  .metric:nth-child(odd) { padding-left: 0; border-left: 0; }
  .metric:first-child { border-top: 0; }
  .metric:nth-child(2) { border-top: 0; }
  .metric strong { font-size: 24px; }
  .workspace { padding-top: 41px; padding-bottom: 26px; }
  .workspace-nav { overflow: visible; }
  .view-tabs { gap: 0; width: 100%; justify-content: space-between; }
  .view-tabs a { font-size: 11px; padding-bottom: 14px; }
  .view-tabs a span { display: none; }
  .workspace-updated { display: none; }
  .filter-row { gap: 10px; flex-wrap: wrap; padding: 20px 0 28px; }
  .filter-label { width: 100%; }
  .filter-spacer { display: none; }
  .region-select-wrap { margin-left: auto; border-left: 0; padding-left: 0; }
  .content-layout { display: block; }
  .side-column { margin-top: 32px; }
  .section-heading { align-items: start; flex-direction: column; gap: 14px; }
  .heading-note { padding: 0; }
  h2 { font-size: 48px; }
  .results-grid { grid-template-columns: 1fr; }
  .race-card.wide { grid-column: span 1; }
  .race-card h3 { font-size: 19px; }
  .change-section { margin-top: 43px; }
  .change-item { grid-template-columns: 15px 52px 1fr auto; gap: 8px; min-height: 64px; font-size: 10px; }
  .change-value { font-size: 9px; }
  .side-column { padding-top: 0; }
  .pulse-panel { min-height: 140px; }
  .regions-grid { grid-template-columns: repeat(2, 1fr); }
  .region-card { min-height: 165px; padding: 15px; }
  .region-card:last-child { grid-column: span 2; }
  .state-row { grid-template-columns: 20px 1fr 65px; gap: 9px; }
  .state-row .state-progress, .state-row .state-leader { display: none; }
  .methodology-grid { grid-template-columns: 1fr; }
  .methodology-grid article { min-height: 160px; }
  .methodology-grid h3 { margin-top: 22px; }
  .footer { padding: 26px 18px 35px; flex-wrap: wrap; gap: 11px; }
  .footer > a { width: 100%; margin-left: 0; }
  .mobile-dock { position: fixed; left: 10px; right: 10px; bottom: 10px; z-index: 15; display: grid; grid-template-columns: repeat(4,1fr); padding: 8px 5px 6px; border: 1px solid rgba(223,232,237,.15); border-radius: 12px; background: rgba(12,27,46,.93); box-shadow: 0 10px 40px rgba(0,0,0,.35); backdrop-filter: blur(18px); }
  .mobile-dock a { display: grid; justify-items: center; gap: 2px; color: var(--paper-faint); font-size: 16px; }
  .mobile-dock a small { font-size: 9px; }
  .mobile-dock a.active { color: var(--lime); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Ajustes de interação e estados de fonte */
:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
.region-select-wrap select:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; border-radius: 3px; }
.source-lockup[data-state="loading"] .source-icon { color: var(--amber); border-color: rgba(246,189,98,.5); animation: sourceSpin 1s linear infinite; }
.source-lockup[data-state="loading"] .source-arrow { color: var(--amber); }
.source-lockup[data-state="error"] .source-icon { color: #ff8f83; border-color: rgba(255,143,131,.5); }
.source-lockup[data-state="error"] .source-arrow { color: #ff8f83; }
@keyframes sourceSpin { to { transform: rotate(360deg); } }
.refresh-setting { display: inline-flex; align-items: center; gap: 5px; color: var(--paper-faint); font-size: 9px; margin-top: 1px; }
.refresh-setting select { appearance: none; border: 0; color: var(--lime); background: transparent; padding: 0 12px 0 0; font-size: 9px; font-weight: 700; }
.state-select-wrap { border-left: 1px solid var(--line); }
.mobile-menu-panel { display: none; }
@media (max-width: 760px) {
  .mobile-menu-panel { position: absolute; top: 68px; right: 18px; left: 18px; z-index: 10; display: none; grid-template-columns: repeat(2, 1fr); gap: 1px; padding: 6px; border: 1px solid var(--line-bright); border-radius: 8px; background: rgba(16,31,50,.98); box-shadow: var(--shadow); }
  .mobile-menu-panel.open { display: grid; }
  .mobile-menu-panel a { display: flex; justify-content: space-between; padding: 13px 11px; border-radius: 4px; color: var(--paper-muted); font: 600 11px var(--display); }
  .mobile-menu-panel a:hover, .mobile-menu-panel a:focus-visible { color: var(--ink); background: var(--lime); }
  .mobile-menu-panel a span { color: var(--paper-faint); font: 500 9px var(--body); }
  .mobile-menu-panel a:hover span, .mobile-menu-panel a:focus-visible span { color: var(--ink); }
  .filter-row .state-select-wrap { margin-left: 0; }
  .refresh-setting { margin-top: 2px; }
}

/* Comparativo de candidatos */
.comparison-section { margin-top: 42px; }
.comparison-card { margin-top: 14px; padding: 20px 22px 16px; border: 1px solid var(--line); border-radius: 7px; background: linear-gradient(120deg, rgba(200,242,48,.07), var(--panel) 42%, rgba(110,216,231,.05)); }
.comparison-intro, .comparison-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--paper-faint); font-size: 10px; }
.comparison-live { display: inline-flex; align-items: center; gap: 7px; color: var(--lime); text-transform: uppercase; letter-spacing: .11em; font-weight: 700; }
.bar-chart { display: grid; gap: 17px; margin: 22px 0 19px; }
.bar-row { display: grid; grid-template-columns: minmax(128px, 1fr) minmax(180px, 2.4fr) 76px; gap: 14px; align-items: center; }
.bar-label { display: flex; align-items: baseline; gap: 7px; min-width: 0; }
.bar-label strong { overflow: hidden; color: var(--paper); font: 600 14px var(--display); letter-spacing: -.04em; text-overflow: ellipsis; white-space: nowrap; }
.bar-label small { color: var(--paper-faint); font-size: 9px; }
.bar-track { height: 14px; overflow: hidden; border-radius: 99px; background: rgba(223,232,237,.1); box-shadow: inset 0 0 0 1px rgba(223,232,237,.05); }
.bar-fill { display: block; height: 100%; width: 0; border-radius: inherit; background: var(--bar-color, var(--lime)); box-shadow: 0 0 20px color-mix(in srgb, var(--bar-color, var(--lime)) 35%, transparent); transition: width .65s cubic-bezier(.2,.75,.3,1); }
.bar-value { text-align: right; color: var(--paper); font: 600 20px var(--display); letter-spacing: -.06em; font-variant-numeric: tabular-nums; }
.bar-value small { display: block; margin-top: 2px; color: var(--paper-faint); font: 400 9px var(--body); letter-spacing: 0; }
.comparison-foot { padding-top: 13px; border-top: 1px solid var(--line); }
.comparison-foot strong { color: var(--lime); font-size: 9px; font-weight: 600; }
@media (max-width: 760px) {
  .comparison-section { margin-top: 36px; }
  .comparison-card { padding: 17px 14px 14px; }
  .bar-row { grid-template-columns: 94px 1fr 54px; gap: 8px; }
  .bar-label { display: grid; gap: 2px; }
  .bar-label strong { font-size: 11px; }
  .bar-track { height: 11px; }
  .bar-value { font-size: 16px; }
  .comparison-foot { align-items: start; flex-direction: column; gap: 3px; }
}


/* Mapa territorial e sinais de atualização */
.live-map-section { margin-top: 48px; }
.live-map-section .subsection-heading h3 { max-width: 430px; }
.live-map-card { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(260px, .65fr); gap: 0; margin-top: 14px; min-height: 510px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: linear-gradient(145deg, rgba(21,41,67,.84), rgba(8,22,37,.96)); }
.map-stage { min-height: 510px; display: grid; place-items: center; padding: 24px; position: relative; background: radial-gradient(circle at 45% 45%, rgba(110,216,231,.08), transparent 44%), linear-gradient(90deg, rgba(200,242,48,.025) 1px, transparent 1px), linear-gradient(rgba(200,242,48,.025) 1px, transparent 1px); background-size: auto, 32px 32px, 32px 32px; }
.map-stage > svg { width: 100%; max-height: 500px; overflow: visible; filter: drop-shadow(0 16px 30px rgba(0,0,0,.18)); }
.map-state { fill: color-mix(in srgb, var(--state-color, var(--cyan)) calc(22% + var(--state-heat, 0%) * .52), #14273a); cursor: pointer; outline: none; transition: fill .55s ease, stroke .25s ease, filter .25s ease; }
.map-state.has-party-leader { stroke: color-mix(in srgb, var(--state-color, var(--cyan)) 62%, #35506a); }
.map-state:hover, .map-state:focus-visible { fill: var(--lime); stroke: var(--paper); stroke-width: 1.8; filter: drop-shadow(0 0 9px rgba(200,242,48,.5)); }
.map-state.is-hot { fill: color-mix(in srgb, var(--lime) 64%, var(--cyan)); animation: stateFlash 1.3s ease-out 2; }
@keyframes stateFlash { 0% { filter: drop-shadow(0 0 0 rgba(200,242,48,0)); } 35% { filter: drop-shadow(0 0 17px rgba(200,242,48,.88)); } 100% { filter: drop-shadow(0 0 0 rgba(200,242,48,0)); } }
.map-pulse { fill: var(--lime); stroke: var(--lime); stroke-width: 1; opacity: 0; transform-box: fill-box; transform-origin: center; animation: mapPulse 1.7s ease-out forwards; }
@keyframes mapPulse { 0% { opacity: .95; transform: scale(.35); } 72% { opacity: .45; } 100% { opacity: 0; transform: scale(4); } }
.map-rail { display: flex; flex-direction: column; min-width: 0; padding: 23px 21px 18px; border-left: 1px solid var(--line); }
.map-rail-head { display: grid; gap: 8px; padding-bottom: 17px; border-bottom: 1px solid var(--line); }
.map-rail-head > span:last-child { color: var(--paper-faint); font-size: 9px; }
.map-party-legend { display: flex; flex-wrap: wrap; gap: 10px; color: var(--paper-muted); font-size: 9px; }
.legend-party-dot { display: inline-block; width: 7px; height: 7px; margin-right: 4px; border-radius: 50%; vertical-align: 1px; }
.legend-party-dot.pl, .party-dot-pl { background: #1d5da8; box-shadow: 0 0 0 3px rgba(29,93,168,.18); }
.legend-party-dot.pt, .party-dot-pt { background: #e3262e; box-shadow: 0 0 0 3px rgba(227,38,46,.16); }
.map-party-code { color: var(--paper); font-weight: 700; }
.map-state-list { display: grid; gap: 0; margin-top: 8px; }
.map-state-row { display: grid; grid-template-columns: 8px 1fr auto; align-items: center; gap: 9px; padding: 13px 0; border-bottom: 1px solid rgba(223,232,237,.08); font-size: 11px; }
.map-state-row.is-active { color: var(--lime); }
.map-state-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 4px rgba(110,216,231,.1); }
.map-state-row.is-active .map-state-dot { background: var(--lime); box-shadow: 0 0 0 4px rgba(200,242,48,.12); animation: pulse 1.4s infinite; }
.map-state-row strong { display: grid; gap: 2px; font: 600 12px var(--display); }
.map-state-row strong small, .map-state-row > span:last-child small { display: block; color: var(--paper-faint); font: 400 9px var(--body); }
.map-state-row > span:last-child { text-align: right; color: var(--paper); font: 600 12px var(--display); font-variant-numeric: tabular-nums; }
.map-note { margin: auto 0 0; padding-top: 17px; border-top: 1px solid var(--line); color: var(--paper-faint); font-size: 10px; line-height: 1.55; }
.map-fallback { color: var(--paper-faint); font-size: 11px; text-align: center; }
@media (max-width: 960px) {
  .live-map-card { grid-template-columns: 1fr; }
  .map-stage { min-height: 390px; }
  .map-rail { border-top: 1px solid var(--line); border-left: 0; }
  .map-state-list { grid-template-columns: repeat(2, 1fr); column-gap: 20px; }
  .map-note { margin-top: 17px; }
}
@media (max-width: 760px) {
  .live-map-section { margin-top: 38px; }
  .live-map-card { margin-left: -1px; margin-right: -1px; }
  .map-stage { min-height: 310px; padding: 12px 6px; }
  .map-rail { padding: 17px 14px 15px; }
  .map-state-list { grid-template-columns: 1fr 1fr; gap: 0 14px; }
  .map-state-row { padding: 10px 0; }
}