@import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Geist+Mono:wght@400;500&display=swap');

/* ============================================================================
   Olympus · tokens.css — A FONTE UNICA DA VERDADE de cor, letra, escala e raio.
   Direcao: BRASA (aprovada 2026-07-13). Ninguem edita este arquivo fora da
   Onda "Fundacao". Se voce precisa de uma cor nova, ela vira token AQUI.

   COMO ISTO CARREGA A FONTE
   -------------------------
   O @import no topo baixa Geist + Geist Mono do Google Fonts (OFL, gratis).
   Decisao: @import (e nao <link> no HTML) porque as 108 telas tem <head>
   proprio — @import faz a fonte viajar junto do CSS, sem editar 108 arquivos.
   Custo: 1 round-trip extra. Mitigacao: themes-loader.js tambem injeta o
   <link rel=preconnect> + <link rel=stylesheet> das fontes (idempotente, por
   id) em qualquer tela que carregue o loader, o que dispara o download em
   paralelo. Os dois caminhos convivem — o browser deduplica.

   ORDEM DE CARGA (IMPORTA)
   ------------------------
     <link rel="stylesheet" href="/tokens.css">   <- 1o
     <link rel="stylesheet" href="/themes.css">   <- 2o (SEMPRE depois)
     <script src="/themes-loader.js"></script>    <- no <head>, anti-flash

   POR QUE ESTE :root SOZINHO NAO BASTA (leia antes de "simplificar")
   -----------------------------------------------------------------
   104 das 108 telas declaram o PROPRIO :root num <style> inline. Um :root
   inline tem a MESMA especificidade de um :root em arquivo, e vem DEPOIS no
   documento => o inline GANHA. Ou seja: os valores abaixo sao apenas o piso
   (fallback) pra telas limpas.
   Quem de fato pinta as 104 telas e o themes.css, via :root[data-theme="..."]
   — seletor de ATRIBUTO, especificidade maior, ganha do :root inline.
   Por isso o themes-loader.js agora SEMPRE seta data-theme (inclusive no
   tema escuro padrao). Antes ele so setava no tema claro, e era por isso que
   o bloco do tema escuro estava morto.
   ============================================================================ */

:root {
  /* ---- BRASA ESCURO (padrao) — cor -------------------------------------- */
  --bg:          #0F0D0A;   /* fundo, preto quente */
  --bg2:         #16130E;   /* fundo elevado */
  --card:        #1C1813;
  --border:      #2A241B;
  --border-2:    #3D3323;
  --text:        #F2EDE2;
  --dim:         #A99F8D;
  /* --faint subiu de #6B6355 -> #8A8172. Medido: #6B6355 dava 2.98:1 sobre
     --card (reprova AA 4.5:1) e apagava empty-state/rotulo secundario em 30
     elementos. #8A8172 = 5.05:1 sobre --bg e 4.59:1 sobre --card. */
  --faint:       #8A8172;

  --gold:        #C9A84C;               /* a marca — INTACTA */
  --gold-soft:   rgba(201, 168, 76, .10);
  --gold-line:   #5E4E21;               /* BORDA. Nao usar como texto (2.39:1) */
  --gold-text:   #C9A84C;               /* dourado legivel como TEXTO (no escuro = o proprio gold) */
  --gold-fill:   #C9A84C;               /* dourado de PREENCHIMENTO (botao/barra) */
  --gold-muted:  #9A8340;               /* dourado apagado AINDA legivel (4.79:1 sobre --card) */

  --money:       #4FBF8B;   /* O UNICO verde de dinheiro. Nao existe outro. */
  --red:         #E8776B;
  --amber:       #E6B84A;

  /* Auxiliares de dado (graficos/tags). Nunca usar pra dinheiro. */
  --blue:        #87B8D9;
  --purple:      #B38AD9;

  --gold-rgb:    201, 168, 76;
  --money-rgb:   79, 191, 139;
  /* Triplets pra TINTA (fundo translucido). Sem eles as telas legadas caiam em
     rgba() hardcoded com o verde/vermelho ANTIGO, que nao repintava no claro. */
  --red-rgb:     232, 119, 107;
  --amber-rgb:   230, 184, 74;
  --blue-rgb:    135, 184, 217;

  /* ---- LETRA — UMA familia so ------------------------------------------- */
  --font-display: 'Geist', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body:    'Geist', system-ui, -apple-system, 'Segoe UI', sans-serif;
  /* Geist Mono e SO pra codigo, ID, token, hash. NUNCA em rotulo, botao,
     cabecalho de tabela ou numero. Numero alinha com tabular-nums (abaixo). */
  --font-mono:    'Geist Mono', ui-monospace, 'SF Mono', monospace;

  --weight-body:    400;
  --weight-medium:  500;
  --weight-display: 600;

  /* ---- ESCALA — 7 tamanhos (eram 47) ------------------------------------ */
  --fs-xs:   11px;    /* rotulo pequeno, legenda */
  --fs-sm:   12.5px;  /* rotulo, celula de tabela densa */
  --fs-md:   14px;    /* corpo padrao */
  --fs-lg:   16px;    /* corpo destacado, input */
  --fs-xl:   20px;    /* titulo de secao */
  --fs-2xl:  26px;    /* titulo de tela */
  --fs-3xl:  32px;    /* KPI grande */

  --lh-tight: 1.15;
  --lh-body:  1.55;

  /* ---- RAIOS — 3 (eram 25) ---------------------------------------------- */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;

  /* ---- SOMBRA / MOVIMENTO ------------------------------------------------ */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .28);
  --shadow-md: 0 4px 14px rgba(0, 0, 0, .32);
  --shadow-lg: 0 16px 40px rgba(0, 0, 0, .42);
  --ease: cubic-bezier(.2, .7, .3, 1);

  /* ---- CHROME ------------------------------------------------------------ */
  --sidebar-w: 236px;
  color-scheme: dark;

  /* ---- ALIAS BASE (piso) -------------------------------------------------
     O mapa COMPLETO de nomes legados vive em themes.css (bloco unico, servindo
     todas as paletas). Aqui fica so o piso, pra tela limpa e pro paint que
     acontece antes do themes-loader.js carimbar o data-theme. */
  --bg-2: var(--bg2);       --bg-card: var(--card);   --bg-elev: var(--card);
  --panel: var(--card);     --elev: var(--card);
  --txt: var(--text);       --ink: var(--text);
  --text-dim: var(--dim);   --muted: var(--dim);      --text-faint: var(--faint);
  --bd: var(--border);      --border-strong: var(--border-2);
  --gold-light: var(--gold); --gold-dim: var(--gold-muted); --accent: var(--gold);
  --green: var(--money);
  --line: var(--border);    --line2: var(--border);
  --ink2: var(--dim);       --ink3: var(--faint);
  --soft: var(--bg2);       --shadow: var(--shadow-lg);
}

/* ============================================================================
   BASE — so o minimo. tokens.css NAO estiliza componente.
   tabular-nums no body: numero alinha em coluna SEM precisar de mono.
   Era esse o unico motivo real pra JetBrains Mono existir aqui.
   ============================================================================ */
body {
  font-family: var(--font-body);
  font-weight: var(--weight-body);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  font-variant-numeric: tabular-nums;
  -webkit-font-feature-settings: 'tnum' 1;
  font-feature-settings: 'tnum' 1;
}

/* Titulo: mesma familia, peso 600. Sem "Poppins, serif" (fallback errado que
   virava Times New Roman quando a fonte falhava — 555 ocorrencias). */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: var(--weight-display);
  line-height: var(--lh-tight);
}

/* Botao NUNCA em mono (regra de ouro 3). */
button, input, select, textarea {
  font-family: var(--font-body);
}

/* ============================================================================
   UTILITARIOS MINIMOS (os unicos que este arquivo entrega)
   ============================================================================ */

/* REGRA DE OURO 1: VERDE E DINHEIRO E SO DINHEIRO.
   .money = R$ / faturamento / ticket / comissao. Contagem de lead, conversa,
   seguidor e porcentagem NAO levam .money — sao texto normal. */
.money {
  color: var(--money);
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum' 1;
}

/* .num = qualquer numero que precisa alinhar em coluna e NAO e dinheiro. */
.num {
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum' 1;
}

/* KPI grande — a unica "forma" que o token file define, porque a espec fechou
   o valor exato (30-32px / 500 / -.02em / 1.05). */
.kpi-value,
.kpi .v {
  font-family: var(--font-display);
  font-size: var(--fs-3xl);
  font-weight: var(--weight-medium);
  letter-spacing: -0.02em;
  line-height: 1.05;
  font-variant-numeric: tabular-nums;
}

/* Codigo / ID / token / hash — o UNICO lugar onde a mono e permitida. */
code, kbd, samp, pre, .mono, .code, .token-id, .hash {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}
