/* ==========================================================================
   NOSTALGAR — Design System "Noite de Thais"
   tokens.css — as variáveis fundamentais da marca.
   Importado pelo wiki, pelo site (MyAAC) e pelos materiais de divulgação.

   Conceito: a rua de Thais à noite — pedra escura, luz de tocha, papel
   à mesa da taverna. O pergaminho é COMPONENTE, nunca o fundo da página.
   Sem border-radius: cantos vivos ou chanfrados (pixel-art de 2004).
   ========================================================================== */

:root {
  /* ------------------------------------------------------------------
     PEDRA — fundos escuros e quentes (a rua à noite)
     ------------------------------------------------------------------ */
  /* recalibrada em 2026-07-06 (pedido do Lucas: "muito escuro") — dois tons
     mais clara que a original, fim de tarde na taverna, não madrugada */
  --pedra-0: #1c150c;   /* âncora escura: header, fundo de hero          */
  --pedra-1: #271d10;   /* fundo padrão de página                        */
  --pedra-2: #322515;   /* painel / faixa                                */
  --pedra-3: #3d2e1a;   /* card, caixa elevada                           */
  --pedra-4: #493720;   /* hover de card / linha de tabela               */
  --linha-1: #5c4729;   /* borda discreta                                */
  --linha-2: #755b36;   /* borda em destaque                             */

  /* ------------------------------------------------------------------
     TINTA — texto sobre pedra
     ------------------------------------------------------------------ */
  --tinta-0: #fdf8ea;   /* texto máximo: títulos sobre imagem, destaque  */
  --tinta-1: #f5ecd6;   /* texto principal                               */
  --tinta-2: #dccdab;   /* texto secundário                              */
  --tinta-3: #b5a381;   /* legendas, texto apagado                       */

  /* ------------------------------------------------------------------
     PERGAMINHO — superfícies claras de leitura (o papel na mesa)
     ------------------------------------------------------------------ */
  --perg-1: #ebdcb4;    /* papel                                         */
  --perg-2: #e0cd9e;    /* papel sombreado                               */
  --perg-3: #c9b182;    /* dobra / borda do papel                        */
  --perg-tinta-1: #2b2011; /* texto sobre papel                          */
  --perg-tinta-2: #5c4a2e; /* texto secundário sobre papel               */

  /* ------------------------------------------------------------------
     BRASA — âmbar de tocha: o acento primário da marca
     ------------------------------------------------------------------ */
  --brasa-1: #f2a93b;   /* acento primário: CTAs, destaques              */
  --brasa-2: #ffc565;   /* hover / brilho                                */
  --brasa-3: #b87818;   /* âmbar profundo, bordas de destaque            */
  --brasa-veu: rgba(242, 169, 59, 0.08); /* véu de luz sobre pedra       */
  --ouro-claro: #e8c56e; /* títulos e links sobre pedra (herda o wiki)   */

  /* ------------------------------------------------------------------
     MUSGO — vida: online, sucesso, "sim"
     ------------------------------------------------------------------ */
  --musgo-1: #85ac59;
  --musgo-2: #a3c878;
  --musgo-3: #4c6630;

  /* ------------------------------------------------------------------
     LACRE — cera de selo: alertas, PvP, "não"
     ------------------------------------------------------------------ */
  --lacre-1: #a62b21;
  --lacre-2: #c6473a;
  --lacre-3: #711a12;

  /* ------------------------------------------------------------------
     MANA — azul arcano: magia, runas, conhecimento
     ------------------------------------------------------------------ */
  --mana-1: #7fa0cc;
  --mana-2: #9fbce4;
  --mana-3: #4a6690;

  /* ------------------------------------------------------------------
     PAPÉIS SEMÂNTICOS (use estes no dia a dia)
     ------------------------------------------------------------------ */
  --cor-fundo:      var(--pedra-1);
  --cor-superficie: var(--pedra-2);
  --cor-card:       var(--pedra-3);
  --cor-texto:      var(--tinta-1);
  --cor-texto-2:    var(--tinta-2);
  --cor-titulo:     var(--ouro-claro);
  --cor-acento:     var(--brasa-1);
  --cor-link:       var(--ouro-claro);
  --cor-ok:         var(--musgo-1);
  --cor-alerta:     var(--brasa-1);
  --cor-perigo:     var(--lacre-2);
  --cor-borda:      var(--linha-1);

  /* ------------------------------------------------------------------
     TIPOGRAFIA
     Cinzel        — lápide romana: títulos, marca, botões (sempre caps)
     Alegreya      — literária: prosa, leitura longa
     Alegreya Sans — humanista: UI, tabelas, dados densos (a irmã sã)
     VT323         — terminal: números de jogo grandes, contadores
     ------------------------------------------------------------------ */
  --fonte-display: 'Cinzel', 'Georgia', serif;
  --fonte-corpo: 'Alegreya', 'Georgia', 'Times New Roman', serif;
  --fonte-ui: 'Alegreya Sans', 'Segoe UI', 'Helvetica Neue', sans-serif;
  --fonte-pixel: 'VT323', 'Consolas', monospace;

  --texto-xs:   0.78rem;   /* 12,5px — legendas, tags                    */
  --texto-sm:   0.94rem;   /* 15px — tabelas densas, notas               */
  --texto-md:   1.0625rem; /* 17px — corpo                               */
  --texto-lg:   1.30rem;   /* 21px — destaque, lead                      */
  --texto-xl:   clamp(1.45rem, 1.25rem + 1vw, 1.75rem);   /* h2          */
  --texto-2xl:  clamp(1.85rem, 1.45rem + 2vw, 2.40rem);   /* h1          */
  --texto-hero: clamp(2.35rem, 1.70rem + 3.4vw, 3.60rem); /* hero        */

  --caps-espaco: 0.14em;   /* letter-spacing de títulos em Cinzel        */
  --caps-ui: 0.09em;       /* letter-spacing de rótulos/tags em caps     */

  /* ------------------------------------------------------------------
     ESPAÇAMENTO (base 4px) e FORMA
     ------------------------------------------------------------------ */
  --esp-1: 4px;  --esp-2: 8px;   --esp-3: 12px; --esp-4: 16px;
  --esp-5: 24px; --esp-6: 32px;  --esp-7: 48px; --esp-8: 64px;

  --chanfro: 7px;          /* canto cortado dos cards (clip-path)        */
  --largura-conteudo: 1120px;
  --largura-leitura: 860px;

  /* ------------------------------------------------------------------
     RELEVO — o bisel 3D que substitui border-radius e sombra difusa
     ------------------------------------------------------------------ */
  --bisel-luz: rgba(255, 233, 185, 0.16);
  --bisel-sombra: rgba(0, 0, 0, 0.45);
  --sombra-baixa: 0 1px 0 rgba(0, 0, 0, 0.5);
  --sombra-card: 0 2px 0 rgba(0, 0, 0, 0.45), 0 8px 24px rgba(0, 0, 0, 0.35);
  --brilho-tocha: 0 0 18px rgba(242, 169, 59, 0.22);

  /* ------------------------------------------------------------------
     MOVIMENTO — sóbrio; a chama tremula, o site não dança
     ------------------------------------------------------------------ */
  --transicao: 140ms ease-out;
  --transicao-lenta: 320ms ease-out;
}