:root {
  --bg: #0b0405;
  --bg-alt: #140607;
  --card: rgba(40, 10, 12, .55);
  --line: rgba(255, 60, 60, .14);
  --ink: #f6eee8;
  --ink-soft: #c9b5ae;
  --mute: #5a4446;
  --grid: rgba(255, 255, 255, .07);
  --red: #d0141b;
  --blood: #8a0303;
  --blood-dark: #4a0000;
  --blood-light: #e3262c;
  --yellow: #ffcf33;
  --green: #2fbf71;
  --max: 1160px;
  --ease: cubic-bezier(.2, .7, .1, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(138, 3, 3, .25), transparent 60%),
    radial-gradient(900px 500px at 0% 40%, rgba(138, 3, 3, .12), transparent 60%),
    var(--bg);
  color: var(--ink);
  font: 16px/1.6 Inter, system-ui, sans-serif;
  overflow-x: clip;
}
html { overflow-x: clip; }
/* Granulação de filme */
body::after {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 100; opacity: .06;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
::selection { background: var(--red); color: #fff; }
a { color: var(--yellow); }
h1, h2 { font-family: Anton, Impact, sans-serif; font-weight: 400; letter-spacing: .02em; text-transform: uppercase; }

/* Barra de progresso */
.progress { position: fixed; top: 0; left: 0; right: 0; height: 4px; z-index: 50; }
.progress span {
  display: block; height: 100%; width: 0;
  background: linear-gradient(90deg, var(--blood-dark), var(--red), var(--blood-light));
  box-shadow: 0 0 12px var(--red);
}

/* ===== HERO: a bandeira sangrando ===== */
.hero { position: relative; min-height: 100vh; min-height: 100svh; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; }
.flag {
  position: absolute; inset: 0; width: 100%; height: 100%; z-index: -3;
  filter: saturate(.85) brightness(.8);
  animation: flagIn 2.2s var(--ease) both;
}
@keyframes flagIn { from { transform: scale(1.12); filter: saturate(1) brightness(1); } }

.blood { position: absolute; inset: 0; z-index: -2; filter: url(#goo); pointer-events: none; }
.pool {
  position: absolute; left: -5%; right: -5%; top: 0; height: 0;
  background: linear-gradient(180deg, var(--blood-dark) 0%, var(--blood) 55%, #a50a0a 100%);
  animation: pour 2.6s var(--ease) .3s forwards;
}
@keyframes pour { to { height: 40%; } }
.drip {
  position: absolute; left: var(--x); top: 37%; width: var(--w); height: 0;
  margin-left: calc(var(--w) / -2);
  background: linear-gradient(180deg, #a50a0a, var(--blood) 70%, #6d0202);
  border-radius: 0 0 999px 999px;
  animation: drip 3.4s cubic-bezier(.5, 0, .3, 1) calc(1.6s + var(--d)) forwards;
}
.drip::after {
  content: ""; position: absolute; left: 50%; bottom: -4px; width: calc(var(--w) * .7); aspect-ratio: 1 / 1.25;
  transform: translateX(-50%); background: #8f0505; border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
  opacity: 0; animation: fall 2.8s ease-in calc(4.8s + var(--d)) infinite;
}
@keyframes drip { to { height: var(--h); } }
@keyframes fall {
  0% { opacity: 1; transform: translate(-50%, 0) scale(.6); }
  80% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, 70vh) scale(1); }
}
.vignette {
  position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(ellipse at 50% 35%, transparent 30%, rgba(0, 0, 0, .55) 100%),
    linear-gradient(180deg, transparent 70%, var(--bg) 100%);
}

.topnav {
  position: sticky; top: 0; z-index: 40;
  display: flex; gap: 2px; overflow-x: auto; padding: 12px 16px;
  background: rgba(11, 4, 5, .55); backdrop-filter: blur(14px) saturate(1.4);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
  border-bottom: 1px solid var(--line);
  scrollbar-width: none;
}
.topnav::-webkit-scrollbar { display: none; }
.topnav a {
  flex: none; color: var(--ink-soft); text-decoration: none;
  font-size: 13px; font-weight: 600; padding: 6px 12px; border-radius: 999px;
  transition: background .25s, color .25s;
}
.topnav a:hover { background: rgba(208, 20, 27, .25); color: #fff; }
.topnav .brand { font-family: Anton, sans-serif; font-weight: 400; color: #fff; letter-spacing: .06em; margin-right: 8px; }

.hero-inner {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  max-width: var(--max); margin: 0 auto; padding: 48px 16px 96px; text-align: center;
}
.kicker {
  display: inline-block; margin: 0; padding: 6px 14px; border-radius: 999px;
  background: rgba(0, 0, 0, .45); border: 1px solid rgba(255, 207, 51, .4); backdrop-filter: blur(6px);
  color: var(--yellow); font-weight: 800; text-transform: uppercase; letter-spacing: .12em; font-size: 12px;
  animation: rise 1s var(--ease) 1.2s both;
}
.hero h1 {
  position: relative;
  font-size: clamp(64px, 17vw, 210px); line-height: .88; margin: 18px 0;
  color: #fff;
  text-shadow: 0 6px 0 var(--blood-dark), 0 18px 40px rgba(0, 0, 0, .7);
  animation: slam 1.1s cubic-bezier(.2, 1.4, .3, 1) .8s both;
}
@keyframes slam { from { opacity: 0; transform: scale(1.6); letter-spacing: .3em; filter: blur(12px); } }
.glitch::before, .glitch::after {
  content: attr(data-text); position: absolute; inset: 0; pointer-events: none; text-shadow: none;
}
.glitch::before { color: var(--red); mix-blend-mode: screen; animation: glitch 4s steps(1) 2.5s infinite; }
.glitch::after { color: #00c2ff; mix-blend-mode: screen; opacity: .6; animation: glitch 4s steps(1) 2.6s infinite reverse; }
@keyframes glitch {
  0%, 92%, 100% { clip-path: inset(100% 0 0 0); transform: none; }
  93% { clip-path: inset(10% 0 60% 0); transform: translate(-6px, 2px); }
  95% { clip-path: inset(55% 0 20% 0); transform: translate(6px, -2px); }
  97% { clip-path: inset(30% 0 45% 0); transform: translate(-3px, 0); }
}
.lead {
  max-width: 660px; margin: 0 auto 36px; font-size: clamp(17px, 2.2vw, 21px); color: #f1e2dc;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .9);
  padding: 10px 18px; border-radius: 14px; background: rgba(0, 0, 0, .45);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  animation: rise 1s var(--ease) 1.5s both;
}
@keyframes rise { from { opacity: 0; transform: translateY(24px); } }
.meter {
  display: inline-flex; flex-direction: column; gap: 6px; max-width: 100%;
  background: rgba(0, 0, 0, .62); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 60, 60, .45); border-radius: 18px; padding: 20px 28px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .4), 0 20px 60px rgba(138, 3, 3, .45);
  animation: rise 1s var(--ease) 1.8s both;
}
.meter-label { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 12px; color: var(--ink-soft); text-transform: uppercase; letter-spacing: .08em; }
.pulse { flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--red); animation: pulse 1.4s infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(208, 20, 27, .8); } 70%, 100% { box-shadow: 0 0 0 10px rgba(208, 20, 27, 0); } }
.meter-value {
  font: 700 clamp(30px, 7vw, 58px)/1.1 "Courier New", monospace; font-variant-numeric: tabular-nums;
  color: #ff2b2b; text-shadow: 0 0 18px rgba(255, 30, 30, .55);
}
.meter-note { font-size: 12px; color: #8d7773; }
.updated { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 11px; color: #9fd8b4; text-transform: uppercase; letter-spacing: .08em; }
.updated .pulse { background: var(--green); animation-name: pulseG; }
@keyframes pulseG { 0% { box-shadow: 0 0 0 0 rgba(47, 191, 113, .8); } 70%, 100% { box-shadow: 0 0 0 10px rgba(47, 191, 113, 0); } }
.scroll-cue {
  position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%);
  width: 26px; height: 42px; border: 2px solid rgba(255, 255, 255, .6); border-radius: 14px;
}
.scroll-cue span { position: absolute; left: 50%; top: 8px; width: 4px; height: 8px; margin-left: -2px; border-radius: 2px; background: #fff; animation: cue 1.6s infinite; }
@keyframes cue { to { transform: translateY(14px); opacity: 0; } }

/* Faixa de manchetes */
.ticker {
  position: relative; overflow: hidden; background: var(--red); color: #fff;
  border-block: 2px solid #000; transform: rotate(-1.2deg) scale(1.03); margin-top: -14px; z-index: 5;
  box-shadow: 0 10px 40px rgba(208, 20, 27, .35);
}
.ticker-track { display: flex; width: max-content; animation: marquee 45s linear infinite; }
.ticker:hover .ticker-track { animation-play-state: paused; }
.ticker span { padding: 12px 0; font: 400 20px/1 Anton, sans-serif; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.ticker span::after { content: "✕"; margin: 0 22px; color: #000; }
@keyframes marquee { to { transform: translateX(-50%); } }

/* ===== Seções ===== */
.section { position: relative; max-width: var(--max); margin: 0 auto; padding: 104px 16px 88px; }
.section.dark { max-width: none; background: linear-gradient(180deg, #1a0507, var(--bg-alt)); }
.section.dark > * { max-width: var(--max); margin-left: auto; margin-right: auto; }
/* Sangue escorrendo no topo das seções escuras */
.section.dark::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 70px;
  background: linear-gradient(180deg, var(--blood-dark), var(--blood));
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 70' preserveAspectRatio='none'%3E%3Cpath d='M0 0h400v14c-8 0-9 10-14 10s-6-10-14-10-7 34-13 34-6-34-12-34-10 8-18 8-8-8-16-8-6 50-12 50-7-50-14-50-11 6-20 6-9-6-18-6-6 22-12 22-7-22-14-22-12 10-22 10-8-10-16-10-5 40-11 40-7-40-13-40-10 6-19 6-10-6-20-6-6 26-12 26-8-26-14-26-12 8-22 8-9-8-18-8-6 46-12 46-6-46-12-46-10 8-20 8-8-8-16-8-6 18-12 18-7-18-13-18H0z'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 70' preserveAspectRatio='none'%3E%3Cpath d='M0 0h400v14c-8 0-9 10-14 10s-6-10-14-10-7 34-13 34-6-34-12-34-10 8-18 8-8-8-16-8-6 50-12 50-7-50-14-50-11 6-20 6-9-6-18-6-6 22-12 22-7-22-14-22-12 10-22 10-8-10-16-10-5 40-11 40-7-40-13-40-10 6-19 6-10-6-20-6-6 26-12 26-8-26-14-26-12 8-22 8-9-8-18-8-6 46-12 46-6-46-12-46-10 8-20 8-8-8-16-8-6 18-12 18-7-18-13-18H0z'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
}
.section h2 { position: relative; font-size: clamp(36px, 6.5vw, 64px); line-height: 1; margin: 0 0 18px; }
.num { display: inline-block; margin-right: 10px; color: transparent; -webkit-text-stroke: 2px var(--red); }
.tag { font: 800 12px Inter, sans-serif; vertical-align: middle; background: var(--yellow); color: #000; padding: 4px 8px; border-radius: 4px; letter-spacing: .05em; }
.intro { font-size: 18px; color: var(--ink-soft); max-width: 800px; }
.sub { font-size: 22px; margin: 48px 0 14px; display: flex; align-items: center; gap: 10px; }
.sub::before { content: ""; flex: none; width: 22px; height: 4px; background: var(--red); border-radius: 2px; }
.source { font-size: 12px; color: #8a7470; margin-top: 22px; }

/* Revelar ao rolar */
.reveal { opacity: 0; transform: translateY(36px); transition: opacity .9s var(--ease), transform .9s var(--ease); transition-delay: var(--rd, 0s); }
.reveal.in { opacity: 1; transform: none; }

/* Componentes em vidro */
.score, .promise, .stat, .chart, .card, .prison, .callout {
  background: var(--card);
  border: 1px solid var(--line);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 10px 30px rgba(0, 0, 0, .35);
}
.tilt { transition: transform .35s var(--ease), box-shadow .35s, border-color .35s; }
.tilt:hover { border-color: rgba(255, 60, 60, .5); box-shadow: 0 18px 50px rgba(138, 3, 3, .45); }

/* Placar */
.scoreboard { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 14px; margin: 32px 0; }
.score { border-radius: 18px; padding: 20px; position: relative; overflow: hidden; }
.score::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--mute); }
.score b { display: block; font: 400 56px/1 Anton, sans-serif; }
.score span { color: var(--ink-soft); font-size: 14px; }
.score.nao b { color: var(--red); } .score.nao::after { background: var(--red); }
.score.parcial b { color: var(--yellow); } .score.parcial::after { background: var(--yellow); }
.score.cumprida b { color: var(--green); } .score.cumprida::after { background: var(--green); }
.score.quaest { background: linear-gradient(135deg, var(--blood), var(--blood-dark)); }
.score.quaest b { color: #fff; } .score.quaest span { color: #ffd9d9; }

.filters { display: inline-flex; flex-wrap: wrap; gap: 4px; margin-bottom: 22px; padding: 4px; border-radius: 999px; background: rgba(0, 0, 0, .35); border: 1px solid var(--line); }
.chip {
  font: 600 14px Inter, sans-serif; color: var(--ink-soft); background: transparent;
  border: 0; padding: 9px 16px; border-radius: 999px; cursor: pointer; transition: background .25s, color .25s;
}
.chip:hover { color: #fff; }
.chip.active { background: var(--red); color: #fff; box-shadow: 0 4px 18px rgba(208, 20, 27, .5); }

.promises { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; }
.promise { position: relative; overflow: hidden; border-radius: 18px; padding: 22px; animation: pop .5s var(--ease) both; animation-delay: calc(var(--i, 0) * 45ms); }
@keyframes pop { from { opacity: 0; transform: translateY(16px) scale(.98); } }
.promise h3 { margin: 12px 0 8px; font-size: 18px; line-height: 1.3; }
.promise p { margin: 0 0 8px; color: var(--ink-soft); font-size: 15px; position: relative; }
.promise .cost { color: var(--ink); font-size: 14px; margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--line); }
.promise.nao::before {
  content: "MENTIRA"; position: absolute; right: -10px; top: 18px; transform: rotate(14deg);
  font: 400 30px/1 Anton, sans-serif; letter-spacing: .08em; color: rgba(208, 20, 27, .22);
  border: 3px solid rgba(208, 20, 27, .22); padding: 4px 10px; border-radius: 6px; pointer-events: none;
}
.badge { position: relative; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; padding: 4px 9px; border-radius: 999px; }
.badge.nao { background: var(--red); color: #fff; }
.badge.parcial { background: var(--yellow); color: #000; }
.badge.cumprida { background: var(--green); color: #000; }

/* Estatísticas */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; margin: 32px 0; }
.stat { position: relative; overflow: hidden; border-radius: 18px; padding: 22px; margin-bottom: 14px; }
.stats .stat { margin-bottom: 0; }
.stat::before {
  content: ""; position: absolute; right: -40px; top: -40px; width: 120px; height: 120px; border-radius: 50%;
  background: radial-gradient(circle, rgba(208, 20, 27, .35), transparent 70%);
}
.stat b {
  position: relative; display: block; font: 400 44px/1.05 Anton, sans-serif; margin-bottom: 8px;
  background: linear-gradient(180deg, #ff4a4a, var(--red) 60%, var(--blood));
  -webkit-background-clip: text; background-clip: text; color: transparent;
  font-variant-numeric: tabular-nums;
}
.stat span { position: relative; color: var(--ink-soft); font-size: 15px; }

/* ===== Gráficos (HTML/SVG próprios) ===== */
.chart-slot { margin: 24px 0; }
.chart-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 16px; margin: 24px 0; }
.chart-grid > .chart-slot { margin: 0; }
.chart-grid.two { align-items: start; }
.chart-grid.wide-first { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
@media (max-width: 820px) { .chart-grid.wide-first { grid-template-columns: 1fr; } }
.chart { border-radius: 18px; padding: 20px; position: relative; height: 100%; }
.chart-slot.bare .chart { background: none; border: 0; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; padding: 0; }
.chart-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.chart-head h3 { margin: 0; font-size: 13px; line-height: 1.4; color: var(--ink-soft); text-transform: uppercase; letter-spacing: .07em; }
.chart-now { text-align: right; flex: none; }
.chart-now b { display: block; font: 400 34px/1 Anton, sans-serif; color: #ff3b3b; text-shadow: 0 0 20px rgba(255, 40, 40, .4); }
.chart-now span { font-size: 12px; color: var(--ink-soft); }
.chart-src { margin: 12px 0 0; font-size: 11px; color: #8a7470; }

/* Linha */
.legend-inline { display: flex; gap: 14px; flex-wrap: wrap; margin: -4px 0 10px; font-size: 12px; color: var(--ink-soft); }
.lg::before { content: ""; display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 6px; vertical-align: -2px; }
.lg.pand::before { background: repeating-linear-gradient(45deg, rgba(255, 207, 51, .55) 0 3px, transparent 3px 6px); border: 1px solid rgba(255, 207, 51, .5); }
.lg.lula::before { background: rgba(208, 20, 27, .35); border: 1px solid rgba(255, 60, 60, .6); }
.plot { position: relative; height: 260px; touch-action: pan-y; cursor: crosshair; }
.plot svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.plot .grid line { stroke: var(--grid); stroke-width: 1; vector-effect: non-scaling-stroke; stroke-dasharray: 4 6; }
.band { position: absolute; top: 0; bottom: 0; }
.band.pand { background: repeating-linear-gradient(45deg, rgba(255, 207, 51, .1) 0 4px, transparent 4px 10px); border-inline: 1px dashed rgba(255, 207, 51, .35); }
.band.lula { background: linear-gradient(180deg, rgba(208, 20, 27, .22), rgba(208, 20, 27, .05)); border-left: 2px solid rgba(255, 60, 60, .6); }
.chart.armed .draw { clip-path: inset(0 100% 0 0); }
.chart.in .draw { clip-path: inset(0 0 0 0); transition: clip-path 1.8s var(--ease); }
.y-lbl { position: absolute; left: 6px; font-size: 11px; color: #8a7470; pointer-events: none; }
.y-lbl.top { top: 4px; } .y-lbl.bot { bottom: 4px; }
.dot { position: absolute; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; background: #ff3b3b; border: 2px solid #fff; pointer-events: none; }
.dot.end { box-shadow: 0 0 0 0 rgba(255, 59, 59, .7); animation: pulse 1.6s infinite; }
.chart.armed:not(.in) .dot.end { opacity: 0; }
.dot.hover, .cross, .tip { opacity: 0; transition: opacity .15s; }
.plot.hovering .dot.hover, .plot.hovering .cross, .plot.hovering .tip { opacity: 1; }
.cross { position: absolute; top: 0; bottom: 0; width: 1px; background: rgba(255, 255, 255, .35); pointer-events: none; }
.tip {
  position: absolute; transform: translate(12px, -50%); pointer-events: none; white-space: nowrap; z-index: 2;
  background: rgba(0, 0, 0, .85); border: 1px solid rgba(255, 60, 60, .5); border-radius: 10px; padding: 6px 10px; font-size: 12px;
}
.tip.flip { transform: translate(calc(-100% - 12px), -50%); }
.tip span { display: block; color: var(--ink-soft); }
.tip b { font-size: 16px; color: #fff; }
.xaxis { position: relative; height: 22px; margin-top: 6px; border-top: 1px solid var(--grid); }
.xaxis span { position: absolute; top: 4px; transform: translateX(-50%); font-size: 11px; color: var(--ink-soft); }
.xaxis span:first-child { transform: none; }

/* Barras verticais */
.vbars { display: flex; align-items: flex-end; gap: clamp(6px, 2vw, 18px); height: 240px; padding-top: 8px; border-bottom: 1px solid var(--grid); }
.vb { flex: 1; min-width: 0; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; position: relative; }
.vb-bar {
  width: 100%; max-width: 84px; height: var(--h); border-radius: 8px 8px 2px 2px;
  background: linear-gradient(180deg, #6e5a5c, #3a2a2c);
}
.vb.hot .vb-bar { background: linear-gradient(180deg, #ff3b3b, var(--blood)); box-shadow: 0 0 24px rgba(208, 20, 27, .45); }
.vb-val { font: 400 clamp(13px, 2.4vw, 18px)/1.1 Anton, sans-serif; margin-bottom: 6px; white-space: nowrap; color: var(--ink); }
.vb.hot .vb-val { color: #ff4a4a; }
.vb-lbl { position: absolute; bottom: -24px; font-size: 12px; color: var(--ink-soft); white-space: nowrap; }
.vbars + .chart-src { margin-top: 34px; }
.chart.armed .vb-bar { transform: scaleY(0); transform-origin: bottom; }
.chart.armed .vb-val { opacity: 0; }
.chart.in .vb-bar { transform: none; transition: transform 1s var(--ease) calc(var(--i) * 90ms); }
.chart.in .vb-val { opacity: 1; transition: opacity .5s calc(.6s + var(--i) * 90ms); }

/* Barras horizontais */
.hbars { display: grid; gap: 12px; }
.hbars.compact { gap: 6px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); column-gap: 28px; }
.hb-top { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; color: var(--ink-soft); margin-bottom: 5px; }
.hb-top b { color: var(--ink); font-variant-numeric: tabular-nums; }
.hb.hot .hb-top span { color: var(--ink); } .hb.hot .hb-top b { color: #ff4a4a; }
.hb-track { height: 12px; border-radius: 999px; background: rgba(255, 255, 255, .06); overflow: hidden; }
.compact .hb-track { height: 8px; }
.compact .hb-top { font-size: 13px; margin-bottom: 3px; }
.hb-fill { height: 100%; width: var(--w); border-radius: 999px; background: linear-gradient(90deg, #3a2a2c, #6e5a5c); }
.hb.hot .hb-fill { background: linear-gradient(90deg, var(--blood), #ff3b3b); box-shadow: 0 0 14px rgba(208, 20, 27, .5); }
.chart.armed .hb-fill { transform: scaleX(0); transform-origin: left; }
.chart.in .hb-fill { transform: none; transition: transform 1.1s var(--ease) calc(var(--i, 0) * 50ms); }

/* Rosca */
.donut-wrap { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; justify-content: center; }
.donut {
  --s: 200px; width: var(--s); height: var(--s); border-radius: 50%; position: relative; flex: none;
  background: conic-gradient(var(--stops));
  box-shadow: 0 0 40px rgba(208, 20, 27, .35);
}
.chart.armed .donut { transform: rotate(-120deg) scale(.6); opacity: 0; }
.chart.in .donut { transform: none; opacity: 1; transition: transform 1.2s var(--ease), opacity .6s; }
.donut-hole {
  position: absolute; inset: 22%; border-radius: 50%; background: #120506; display: grid; place-content: center; text-align: center;
  box-shadow: inset 0 0 20px rgba(0, 0, 0, .6);
}
.donut-hole b { font: 400 34px/1 Anton, sans-serif; color: #ff3b3b; }
.donut-hole span { font-size: 12px; color: var(--ink-soft); }
.legend { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; min-width: 180px; }
.legend li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--ink-soft); }
.legend i { width: 14px; height: 14px; border-radius: 4px; flex: none; }
.legend b { margin-left: auto; color: var(--ink); padding-left: 12px; }

/* Comparativo pandemia × hoje */
.cmps { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 14px; }
.cmp { padding: 14px; border-radius: 14px; background: rgba(0, 0, 0, .25); border: 1px solid var(--line); }
.cmp-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 10px; font-weight: 600; font-size: 15px; }
.cmp-head .trend { font-style: normal; }
.cmp-row { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 10px; font-size: 12px; color: var(--ink-soft); margin-top: 6px; }
.cmp-row b { font-size: 14px; color: var(--ink); min-width: 74px; text-align: right; font-variant-numeric: tabular-nums; }
.cmp-row.now b { color: #ff4a4a; }
.cmp-row.old .hb-fill { background: linear-gradient(90deg, #4a3a3c, #8a7a7c); }
.cmp-row.now .hb-fill { background: linear-gradient(90deg, var(--blood), #ff3b3b); }

/* Bonecos */
.people-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: center; margin-top: 32px; }
.people { display: grid; grid-template-columns: repeat(10, 1fr); gap: 7px; max-width: 340px; }
.p {
  aspect-ratio: 1 / 1.6; background: #3a2a2c;
  -webkit-mask: radial-gradient(circle at 50% 18%, #000 17%, transparent 18%), linear-gradient(#000, #000) 50% 100% / 70% 58% no-repeat;
  mask: radial-gradient(circle at 50% 18%, #000 17%, transparent 18%), linear-gradient(#000, #000) 50% 100% / 70% 58% no-repeat;
  transition: background .4s, transform .4s var(--ease);
}
.people.in .p.on { background: var(--red); transform: translateY(-3px); transition-delay: calc(var(--i) * 35ms); }
.people-legend .big { font: 400 46px/1 Anton, sans-serif; color: var(--red); margin: 22px 0 4px; }
.people-legend p { margin: 0; color: var(--ink-soft); }

.callout { border-radius: 14px; border-left: 5px solid var(--red); padding: 18px 22px; margin-top: 30px; background: linear-gradient(90deg, rgba(138, 3, 3, .35), rgba(40, 10, 12, .5)); }

/* Tabelas */
.table-wrap { overflow-x: auto; margin-top: 28px; border-radius: 18px; border: 1px solid var(--line); background: var(--card); }
.tbl { width: 100%; border-collapse: collapse; min-width: 580px; }
.tbl th, .tbl td { padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
.tbl tr:last-child td { border-bottom: 0; }
.tbl tbody tr { transition: background .2s; }
.tbl tbody tr:hover { background: rgba(208, 20, 27, .1); }
.tbl th { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-soft); background: rgba(0, 0, 0, .3); }
.tbl td { color: var(--ink-soft); }
.tbl td b { color: var(--ink); }
.verdict { display: inline-block; background: rgba(255, 207, 51, .1); border: 1px solid rgba(255, 207, 51, .35); padding: 3px 10px; border-radius: 999px; font-size: 13px; font-weight: 600; color: var(--yellow); white-space: nowrap; }
.trend { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; padding: 4px 10px; border-radius: 999px; white-space: nowrap; }
.trend.down { background: var(--red); color: #fff; }
.trend.up { background: var(--green); color: #000; }

/* Linha do tempo */
.timeline { list-style: none; padding: 0; margin: 22px 0; position: relative; }
.timeline::before { content: ""; position: absolute; left: 6px; top: 6px; bottom: 6px; width: 3px; border-radius: 2px; background: linear-gradient(var(--red), var(--blood-dark)); }
.timeline li { position: relative; padding: 0 0 22px 34px; color: var(--ink-soft); }
.timeline li::before { content: ""; position: absolute; left: 0; top: 5px; width: 15px; height: 15px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 4px rgba(208, 20, 27, .25); }
.timeline b { display: block; color: var(--ink); font-size: 15px; letter-spacing: .04em; }

/* Cortes */
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; margin-top: 32px; }
.card { border-radius: 18px; padding: 22px; border-style: dashed; border-color: rgba(208, 20, 27, .5); }
.card h3 { margin: 10px 0 8px; font-size: 18px; }
.card p { margin: 0; color: var(--ink-soft); font-size: 15px; }
.scissors { display: inline-block; font-size: 30px; color: var(--red); transition: transform .4s var(--ease); }
.card:hover .scissors { transform: rotate(-30deg) scale(1.2); }

/* Viagens */
.globe-row { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 28px; align-items: center; }
.globe {
  position: relative; width: 140px; height: 140px; border-radius: 50%; display: grid; place-items: center;
  font-size: 46px; color: #fff;
  background: radial-gradient(circle at 35% 30%, #c0262a, var(--blood) 55%, #2a0000);
  box-shadow: inset -16px -16px 30px rgba(0, 0, 0, .55), 0 0 60px rgba(208, 20, 27, .35);
}
.globe::after { content: ""; position: absolute; inset: -14px; border-radius: 50%; border: 2px dashed rgba(255, 207, 51, .45); animation: spin 14s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Presídios */
.prison { border-radius: 18px; padding: 22px; }
.prison p { color: var(--ink-soft); margin: 16px 0 0; }
/* Fontes */
.sources { columns: 2 320px; padding-left: 18px; }
.sources li { margin-bottom: 8px; break-inside: avoid; font-size: 14px; }
.sources a { color: #ffb3b3; text-decoration-color: rgba(255, 179, 179, .3); text-underline-offset: 3px; }
.sources a:hover { color: #fff; }
.disclaimer { margin-top: 28px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 14px; color: var(--ink-soft); font-size: 14px; background: var(--card); }

.footer { position: relative; text-align: center; padding: 72px 16px 40px; color: var(--ink-soft); background: linear-gradient(180deg, var(--bg), #000); }
.footer-brand { font: 400 clamp(40px, 10vw, 96px)/1 Anton, sans-serif; margin: 0 0 8px; color: transparent; -webkit-text-stroke: 2px var(--red); letter-spacing: .04em; }

@media (max-width: 720px) {
  .people-wrap { grid-template-columns: 1fr; }
  .globe-row { grid-template-columns: 1fr; justify-items: center; }
  .section { padding: 88px 16px 64px; }
  .stat b { font-size: 36px; }
  .ticker span { font-size: 16px; }
  .pool { animation-name: pourMobile; }
  .drip { top: 31%; }
}
@keyframes pourMobile { to { height: 34%; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; animation-delay: 0s !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .drip::after { display: none; }
}

/* Promessas: verdade × pegadinha */
.promise .real b { color: var(--ink); }
.promise .pega { padding: 10px 12px; border-radius: 10px; background: rgba(255, 207, 51, .08); border: 1px solid rgba(255, 207, 51, .3); }
.promise .pega b { color: var(--yellow); }

/* Dá × tira */
.sub { font-size: 26px; margin: 56px 0 6px; }
.datira { display: grid; gap: 12px; margin-top: 22px; }
.dt { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-radius: 16px; overflow: hidden; border: 1px solid var(--line); animation: pop .5s var(--ease) both; animation-delay: calc(var(--i, 0) * 60ms); }
.dt > div { padding: 16px 18px; }
.dt span { display: inline-block; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; padding: 3px 9px; border-radius: 999px; margin-bottom: 8px; }
.dt p { margin: 0; font-size: 15px; color: var(--ink-soft); }
.dt-da { background: rgba(47, 191, 113, .08); }
.dt-da span { background: var(--green); color: #000; }
.dt-tira { background: rgba(208, 20, 27, .12); border-left: 1px dashed var(--line); }
.dt-tira span { background: var(--red); color: #fff; }
@media (max-width: 640px) { .dt { grid-template-columns: 1fr; } .dt-tira { border-left: 0; border-top: 1px dashed var(--line); } }

/* Desemprego: outras réguas */
.callout.desemp h3 { margin: 0 0 10px; font-size: 22px; }
.callout.desemp p { color: var(--ink-soft); }
.callout.desemp p b { color: var(--ink); }
.callout.desemp .table-wrap { margin: 14px 0 18px; }
.tbl.mini { min-width: 0; }
.callout .note { font-size: 14px; border-top: 1px dashed var(--line); padding-top: 12px; margin-bottom: 0; }
@media (max-width: 640px) {
  .callout.desemp { padding: 16px; }
  .callout.desemp .tbl { min-width: 0; font-size: 13px; }
  .callout.desemp .tbl th, .callout.desemp .tbl td { padding: 9px 8px; }
}