.hero-vote {
  position: relative;
  padding: 50px 0 35px;
}
.hero-vote h1 {
  font-size: clamp(38px, 4.5vw, 67px);
  font-weight: 800;
  max-width: 900px;
  text-transform: uppercase;
  line-height: 1.06;
  letter-spacing: -2.8px;
}
.hero-vote h1 em {
  font-style: normal;
  color: var(--green);
}
.hero-vote .lead {
  max-width: 700px;
  font-size: 17px;
}
.vote-ribbon {
  display: flex;
  gap: 12px;
  margin: 24px 0;
  flex-wrap: wrap;
}
.vote-ribbon span {
  border: 1px solid var(--border);
  padding: 8px 12px;
  border-radius: 20px;
  font-size: 11px;
  color: var(--muted);
}
.candidate-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 26px 0;
}
.candidate {
  position: relative;
  overflow: hidden;
  padding: 28px;
  background: linear-gradient(135deg, #1e2b3b, #121a25);
  border: 1px solid #394b60;
  border-radius: 12px;
}
.candidate .number {
  position: absolute;
  right: 24px;
  top: 15px;
  font-size: 70px;
  opacity: 0.09;
  font-family: 'Bricolage Grotesque';
  font-weight: 800;
}
.candidate h2 {
  font: 700 28px 'Bricolage Grotesque';
  margin: 12px 0;
}
.candidate .party {
  color: var(--green);
  font-size: 11px;
  letter-spacing: 2px;
}
.candidate p {
  color: var(--muted);
  line-height: 1.8;
  font-size: 14px;
}
.candidate-links {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 18px;
}
.candidate-links a {
  font-size: 13px;
  border: 1px solid var(--border);
  padding: 8px 11px;
  border-radius: 6px;
}
.candidate-links a:hover {
  border-color: var(--green);
}
.tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 26px 0;
}
.tabs button {
  background: #141e2b;
  color: var(--muted);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 9px 14px;
  font-size: 13px;
}
.tabs button.active {
  background: var(--green);
  color: #172412;
}
.compare-table td {
  white-space: normal;
  text-align: left;
  line-height: 1.7;
  vertical-align: top;
  max-width: 340px;
  padding: 20px;
  font-size: 15px;
}
.compare-table th {
  text-align: left;
  padding: 12px 20px;
}
.compare-table td:first-child {
  color: var(--green);
  width: 150px;
}
.compare-table td:nth-child(4) {
  color: var(--muted);
}
.compare-table a {
  display: block;
  color: #b8cfed;
  font-size: 13px;
  margin-top: 10px;
}
.page-note {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.9;
  margin: 18px 0;
}
.big-cta {
  margin: 30px 0;
  padding: 25px;
  border-radius: 10px;
  background: linear-gradient(100deg, #b8ef6c16, #72b7e910);
  border: 1px solid #b8ef6c33;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.big-cta h3 {
  margin: 0 0 8px;
}
.big-cta p {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
  margin: 0;
}
.primary {
  background: var(--green);
  color: #101c0d;
  border-color: var(--green);
  font-weight: 700;
}
.official-toolbar {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: end;
}
.official-toolbar label,
.field-label {
  display: block;
  font-size: 11px;
  color: var(--muted);
  margin-bottom: 8px;
  letter-spacing: 0.8px;
}
.official-toolbar input,
.connect-form input {
  background: #0c141f;
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 7px;
  padding: 11px 12px;
  max-width: 100%;
  font: inherit;
}
.official-toolbar input[type='number'] {
  width: 95px;
}
.official-toolbar input[type='text'] {
  width: 140px;
}
.catalog {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  margin: 20px 0;
}
.catalog input {
  padding: 10px;
  background: #0c141f;
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.catalog-list {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding-bottom: 15px;
}
.catalog-list button {
  background: #192331;
  color: #b6c9db;
  border: 1px solid var(--border);
  padding: 8px;
  font-size: 13px;
  border-radius: 5px;
}
.status-box {
  color: var(--muted);
  padding: 16px;
  border: 1px dashed var(--border);
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.8;
  margin: 18px 0;
}
.error-status {
  border-color: #dbae73;
  color: #e8c397;
}
.real-metrics {
  margin: 20px 0;
}
.real-table td {
  white-space: normal;
}
.real-table th {
  text-align: left;
}
.real-table td {
  text-align: left;
  padding: 14px;
}
.real-table td small {
  display: block;
  color: var(--muted);
  margin-top: 5px;
}
.real-bars {
  display: grid;
  gap: 17px;
  margin: 22px 0;
}
.real-bar {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) 2fr 120px;
  align-items: center;
  gap: 15px;
  font-size: 14px;
}
.real-bar > div {
  height: 9px;
  background: #263242;
  border-radius: 5px;
}
.real-bar > div > span {
  display: block;
  height: 100%;
  background: var(--green);
  border-radius: 5px;
}
.connect-form {
  display: grid;
  gap: 12px;
}
.connect-form button {
  justify-self: start;
}
.connect-form label {
  color: var(--muted);
  font-size: 14px;
}
.support-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin: 25px 0;
}
.support-grid .panel p {
  font-size: 14px;
  line-height: 1.9;
  color: var(--muted);
}
.stage {
  color: var(--green);
  font-size: 11px;
  letter-spacing: 1px;
}
.timeline {
  border-left: 1px solid #3c5167;
  margin: 28px 0 28px 12px;
  padding-left: 32px;
}
.timeline article {
  position: relative;
  padding: 0 0 30px;
}
.timeline article:before {
  content: '';
  width: 10px;
  height: 10px;
  position: absolute;
  top: 5px;
  left: -38px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 0 5px #b8ef6c12;
}
.timeline time {
  color: var(--green);
  font-size: 13px;
  letter-spacing: 1px;
}
.timeline h3 {
  font-size: 22px;
  margin: 7px 0;
}
.timeline p {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.8;
  margin: 8px 0;
}
.congress-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin: 25px 0;
}
.congress-summary article {
  border: 1px solid var(--border);
  border-radius: 9px;
  padding: 20px;
}
.congress-summary strong {
  font-family: 'Bricolage Grotesque';
  font-size: 35px;
  display: block;
  margin: 8px 0;
  color: var(--green);
}
.congress-summary span {
  font-size: 13px;
  color: var(--muted);
}
.party-row select {
  padding: 7px;
  font-size: 13px;
  max-width: 185px;
}
.party-row td {
  padding-right: 18px;
}
.simulator {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 24px;
}
.simulator label {
  font-size: 14px;
  color: var(--muted);
}
.simulator-result {
  padding: 20px;
  margin: 18px 0;
  background: #b8ef6c08;
  border: 1px solid #b8ef6c26;
  border-radius: 8px;
  font-size: 15px;
  line-height: 1.9;
}
.warning-copy {
  color: #d6bd8d;
}
.support-heading h1 {
  font-size: 46px;
}
.empty-donation {
  padding: 25px;
  border: 1px dashed #4b5c6e;
  border-radius: 10px;
  margin: 25px 0;
  text-align: center;
}
.empty-donation h3 {
  color: var(--green);
  margin: 0 0 10px;
}
.nav {
  padding: 11px 13px;
}
.aside-bottom {
  padding-top: 15px;
}
.little-star {
  margin-bottom: 10px;
  font-size: 27px;
}
.official-facts {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  flex-wrap: wrap;
}
.official-facts p {
  font-size: 11px;
  color: var(--muted);
}
@media (max-width: 760px) {
  .hero-vote h1 {
    letter-spacing: -1.5px;
    font-size: 38px;
  }
  .candidate-grid,
  .support-grid {
    grid-template-columns: 1fr;
  }
  .congress-summary {
    grid-template-columns: 1fr 1fr;
  }
  .compare-table {
    min-width: 740px;
  }
  .big-cta {
    flex-direction: column;
    align-items: start;
  }
  .real-bar {
    grid-template-columns: 1fr 100px;
  }
  .real-bar > div {
    grid-column: 1/-1;
    grid-row: 2;
  }
  .support-heading h1 {
    font-size: 34px;
  }
  .candidate {
    padding: 22px;
  }
  nav {
    gap: 0;
  }
  .nav {
    padding: 10px;
  }
  .aside-bottom {
    display: none;
  }
}

.money-total {
  font-size: clamp(18px, 2vw, 30px) !important;
  overflow-wrap: anywhere;
}
.section-title {
  margin: 32px 0 18px;
}
#root > main > header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
}
table th:first-child {
  text-align: left;
}
.notice code {
  color: var(--lime, #c6f75b);
}
[hidden] {
  display: none !important;
}
@media (max-width: 650px) {
  .money-total {
    font-size: 23px !important;
  }
  .real-bar {
    grid-template-columns: 1fr !important;
  }
  .real-bar strong {
    margin-bottom: 10px;
  }
}

.candidate.candidate-flavio {
  border-top: 4px solid #e7ca4e;
  background: linear-gradient(145deg, rgba(30, 115, 85, 0.16), transparent 60%), #121b23;
}
.candidate.candidate-lula {
  border-top: 4px solid #ee626d;
  background: linear-gradient(145deg, rgba(185, 55, 67, 0.14), transparent 60%), #121b23;
}
.candidate-flavio .number {
  color: #e7ca4e;
}
.candidate-lula .number {
  color: #ff8992;
}
.candidate-flavio .party {
  color: #86dbad;
}
.candidate-lula .party {
  color: #ff8992;
}
.candidate-identity {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}
.candidate-identity i {
  width: 12px;
  height: 12px;
  display: inline-block;
  border-radius: 3px;
}
.identity-flavio {
  background: linear-gradient(135deg, #289969 50%, #e7ca4e 50%);
}
.identity-lula {
  background: #ee626d;
}
.map-legend {
  display: flex;
  gap: 12px 20px;
  flex-wrap: wrap;
  margin: 20px 0;
  color: #c7d1df;
  font-size: 14px;
}
.map-legend span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.map-legend i,
.group-distribution i {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  display: inline-block;
  flex-shrink: 0;
}
.map-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}
.brazil-map {
  min-width: 0;
}
.brazil-map svg {
  display: block;
  width: 100%;
  max-height: 580px;
  background: radial-gradient(ellipse, rgba(70, 107, 153, 0.07), transparent 70%);
}
.brazil-map path {
  cursor: pointer;
  transition:
    fill 0.2s,
    opacity 0.2s;
}
.brazil-map path:hover {
  opacity: 0.78;
  stroke: white;
  stroke-width: 2;
}
.brazil-map path:focus,
.brazil-map g[role='button']:focus {
  outline: none;
  stroke: #fff;
  stroke-width: 3;
}
.brazil-map text {
  fill: #fff;
  font: 600 14px 'Bricolage Grotesque',
    sans-serif;
  paint-order: stroke;
  stroke: #16243b;
  stroke-width: 2px;
  stroke-linejoin: round;
}
.map-detail {
  padding: 22px;
  background: #0e151e;
  border: 1px solid #253041;
  border-radius: 14px;
  min-width: 0;
}
.map-detail h3 {
  margin: 22px 0 10px;
}
.map-detail p {
  font-size: 15px;
  line-height: 1.7;
  color: #afbac9;
}
.map-detail th,
.map-detail td {
  padding: 12px 8px !important;
  font-size: 13px !important;
}
.state-selector label {
  display: block;
  font-size: 13px;
  text-transform: uppercase;
  color: #a7b3c4;
  margin-bottom: 8px;
  letter-spacing: 1px;
}
.state-selector select {
  width: 100%;
}
.party-color-dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  margin-right: 7px;
}
.group-distribution > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid #253041;
  padding: 13px 0;
  font-size: 14px;
}
.group-distribution span {
  display: flex;
  align-items: center;
  gap: 8px;
}
.group-distribution strong {
  font-size: 21px;
}
.electoral-map-panel {
  margin: 24px 0;
}
.electoral-map-panel > h3 {
  margin-top: 10px;
}
.electoral-map-panel details {
  border-top: 1px solid #29313d;
  padding-top: 18px;
  margin-top: 20px;
}
.electoral-map-panel summary {
  cursor: pointer;
  color: #d3deed;
  font-size: 15px;
}
.classification-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin: 18px 0;
}
.classification-grid label {
  font-size: 14px;
  display: grid;
  gap: 8px;
}
.classification-grid select {
  width: 100%;
  font-size: 13px;
}
.map-detail table {
  min-width: 360px;
}
@media (max-width: 1050px) {
  .map-layout {
    grid-template-columns: 1fr;
  }
  .brazil-map svg {
    max-height: 490px;
  }
  .classification-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 600px) {
  .map-detail {
    padding: 15px;
  }
  .map-layout {
    gap: 12px;
  }
  .classification-grid {
    grid-template-columns: 1fr;
  }
  .map-legend {
    gap: 12px;
  }
  .brazil-map text {
    font-size: 16px;
  }
  .electoral-map-panel {
    padding: 18px !important;
  }
}

.candidate-result-flavio td:last-child {
  color: #e7ca4e !important;
}
.candidate-result-lula td:last-child {
  color: #ee626d !important;
}
.electoral-map-panel td:last-child {
  color: #d4deea !important;
}