/* Estilo das páginas de pesquisa: /study e os recortes por categoria.
 *
 * Extraído do study.html quando nasceu a segunda página. Servido de
 * /assets/, que os dois servidores já entregam — não há passo de build,
 * então isto é o arquivo real que o navegador busca.
 *
 * As variáveis são as mesmas do index.html. Se a marca mudar lá, muda
 * aqui: são duas cópias de propósito, porque o site público carrega um
 * CSS embutido gigante e importá-lo aqui traria o layout inteiro junto.
 */

:root{
  --bg:#060A12; --panel:#0E1728; --panel2:#0D1424; --line:#24304D;
  --ink:#F4F7FF; --mut:#95A2C7; --brand:#7A63FF; --brand2:#65DDF3;
  --ok:#34D399; --warn:#FBBF24; --bad:#F87171;
}
*{box-sizing:border-box}
body{margin:0;color:var(--ink);
  background:radial-gradient(1200px 600px at 70% -10%,#1B2350 0%,var(--bg) 55%);
  font:16px/1.65 Inter,system-ui,'Segoe UI',Arial,sans-serif}
.wrap{max-width:860px;margin:0 auto;padding:44px 20px 90px}
a{color:var(--brand2)}
.brand{display:inline-flex;margin-bottom:38px}
.brand img{display:block;width:112px;height:auto}
.kicker{font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--brand2);font-weight:700;margin:0 0 12px}
h1{font-size:clamp(28px,5vw,42px);line-height:1.12;letter-spacing:-.025em;
  margin:0 0 14px}
.sub{font-size:18px;color:var(--mut);margin:0 0 26px}
h2{font-size:23px;letter-spacing:-.02em;margin:52px 0 12px;
  padding-top:22px;border-top:1px solid var(--line)}
h3{font-size:16px;margin:30px 0 8px}
.meta{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 30px;
  font-size:12.5px;color:var(--mut)}
.meta span{padding:5px 11px;border:1px solid var(--line);
  border-radius:999px;background:var(--panel2)}
.big{background:var(--panel);border:1px solid var(--line);
  border-radius:16px;padding:26px 28px;margin:26px 0}
.big .n{font-size:clamp(38px,8vw,58px);font-weight:800;line-height:1;
  letter-spacing:-.03em;color:var(--brand2)}
.big p{margin:12px 0 0;color:var(--mut);font-size:14.5px}

/* Tabela larga rola DENTRO do contêiner. A página nunca rola na
 * horizontal — no celular de 375px as tabelas de 5 colunas estouram, e
 * body com scroll lateral quebra a leitura da página inteira. */
.tw{overflow-x:auto;margin:18px 0;border:1px solid var(--line);
  border-radius:12px;background:var(--panel2)}
table{border-collapse:collapse;width:100%;font-size:14px;min-width:420px}
th,td{padding:11px 14px;text-align:left;
  border-bottom:1px solid var(--line);white-space:nowrap}
th{font-size:11px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--mut);font-weight:700}
tbody tr:last-child td{border-bottom:none}
td.num{text-align:right;font-variant-numeric:tabular-nums}

.warn{border-left:3px solid var(--warn);background:rgba(251,191,36,.05);
  padding:15px 18px;border-radius:0 11px 11px 0;margin:20px 0;font-size:14.5px}
.warn b{color:var(--warn)}
.note{border-left:3px solid var(--brand);background:rgba(122,99,255,.05);
  padding:15px 18px;border-radius:0 11px 11px 0;margin:20px 0;font-size:14.5px}
ul{padding-left:20px}
li{margin:7px 0}
.dl{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:20px 0}
.btn{display:inline-block;padding:13px 20px;border-radius:12px;
  background:var(--brand);color:#fff;text-decoration:none;font-weight:700;
  font-size:14px;border:1px solid var(--brand)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
code{background:var(--panel2);padding:2px 6px;border-radius:5px;
  font-size:12.5px;border:1px solid var(--line)}
.cite{font-size:13px;color:var(--mut);background:var(--panel2);
  border:1px solid var(--line);border-radius:11px;padding:15px 17px;
  margin:14px 0}
.src{list-style:none;padding:0;margin:16px 0}
.src li{display:flex;justify-content:space-between;gap:14px;
  padding:11px 15px;border:1px solid var(--line);border-radius:11px;
  background:var(--panel2);margin:8px 0;font-size:14px}
.src b{font-weight:600}
.src span{color:var(--mut);font-size:12.5px;white-space:nowrap}
footer{margin-top:58px;padding-top:24px;border-top:1px solid var(--line);
  font-size:13px;color:var(--mut)}