:root {
  --fundo: #100f17; --painel: #1b1a25; --linha: #2a2836; --texto: #f6f4ff;
  --texto2: #b9b6c8; --violeta: #a99eff; --coral: #ff8a6e;
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--fundo); color: var(--texto);
  font: 17px/1.6 'Figtree', system-ui, -apple-system, sans-serif;
}
main { max-width: 720px; margin: 0 auto; padding: 32px 16px 64px; }
header { display: flex; align-items: center; gap: 10px; margin-bottom: 32px; }
header a { color: var(--texto); text-decoration: none; font: 800 24px 'Bricolage Grotesque', system-ui, sans-serif; }
h1, h2 { font-family: 'Bricolage Grotesque', system-ui, sans-serif; line-height: 1.2; }
h1 { font-size: 34px; margin: 0 0 8px; }
h2 { font-size: 22px; margin: 40px 0 8px; }
p, li { color: var(--texto2); }
strong { color: var(--texto); }
a { color: var(--violeta); }
.data { color: var(--texto2); font-size: 15px; }
.aviso {
  border: 1px solid var(--coral); border-radius: 16px; padding: 12px 16px; margin: 24px 0;
  color: var(--coral); background: rgba(255, 107, 74, 0.08);
}
.resumo { background: var(--painel); border: 1px solid var(--linha); border-radius: 20px; padding: 8px 20px; }
table { width: 100%; border-collapse: collapse; font-size: 15px; }
th, td { text-align: left; vertical-align: top; padding: 10px 8px; border-bottom: 1px solid var(--linha); color: var(--texto2); }
th { color: var(--texto); }
.tabela { overflow-x: auto; }
footer { margin-top: 48px; color: var(--texto2); font-size: 15px; }
@media (max-width: 600px) {
  table, tbody, tr, td { display: block; width: 100%; }
  tr:first-child { display: none; }
  tr { border-bottom: 1px solid var(--linha); padding: 8px 0; }
  td { border: 0; padding: 4px 0; }
  td::before { content: attr(data-label); display: block; color: var(--texto); font-weight: 600; font-size: 13px; }
}