:root{
  --bg: #0b0f14;
  --bg2: #05070a;
  --panel: rgba(255,255,255,0.06);
  --panel2: rgba(255,255,255,0.08);
  --text: #e8eef6;
  --muted: rgba(232,238,246,0.72);
  --line: rgba(255,255,255,0.10);

  --brand: #fffc62;   /* ciano */
  --brand2:#f1d014;   /* azul */

  --ok:#22c55e;
  --danger:#ef4444;

  --radius: 16px;
  --shadow: 0 14px 50px rgba(0,0,0,0.45);
}

/* TEMA CLARO */
html[data-theme="light"]{
  --bg: #f6f7fb;
  --bg2:#ffffff;
  --panel: rgba(0,0,0,0.04);
  --panel2: rgba(0,0,0,0.06);
  --text: #0b0f14;
  --muted: rgba(11,15,20,0.65);
  --line: rgba(0,0,0,0.10);
  --shadow: 0 14px 50px rgba(0,0,0,0.10);
}

/* NOTA: havia AQUI um segundo bloco `body{}` idêntico ao de baixo, só que com
   `linear-gradient(180deg, var(--bg2), var(--bg))` no fundo. Como o bloco de
   baixo tem a MESMA especificidade e vem depois, ele sobrescrevia as quatro
   propriedades — o gradiente vertical nunca chegou a ser pintado. Bloco morto
   removido; quem edita o fundo do site mexe em UM lugar só (o body abaixo). */
*{box-sizing:border-box}
/* IMPORTANTE: 'overflow-x:hidden' + 'height:100%' fazia o BODY virar um
   contêiner de rolagem próprio (o overflow-y vira 'auto' pela regra do CSS),
   desencontrando a altura do documento e criando um VÃO preto enorme antes
   do rodapé. 'overflow-x:clip' corta o excesso horizontal SEM criar rolagem
   interna; 'min-height' deixa o documento crescer com o conteúdo. */
html,body{min-height:100%;
overflow-x: clip;}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:
    radial-gradient(900px 300px at 20% 0%, rgba(255,179,0,0.20), transparent 60%),
    radial-gradient(900px 300px at 80% 0%, rgba(255,122,0,0.18), transparent 60%),
    var(--bg);
  color: var(--text);
}

img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
button, input, select{font:inherit}

.container{
  width:min(1140px, calc(100% - 32px));
  margin:0 auto;
}

.hidden{display:none !important}
.muted{color:var(--muted)}
.sep{opacity:.5; padding:0 8px}
.link-muted{color:var(--muted)}
.link-muted:hover{color:var(--text)}

/* ===== Anti-zoom / anti seleção acidental no mobile ===== */
html, body {
  touch-action: manipulation;
}

button, a, input, select, textarea, label {
  touch-action: manipulation;
}

/* evita “arrastar/selecionar” imagens e textos ao tocar rápido */
img { -webkit-user-drag: none; user-select: none; -webkit-user-select: none; }

/* opções dos dropdowns (corrige o "texto branco no fundo branco") */
select option {
  background-color: #11161e;
  color: #e8eef6;
}

html[data-theme="light"] select option {
  background-color: #ffffff;
  color: #0b0f14;
}