/* ==========================================================
   ai-labs · design tokens dos kits
   Derivado do COPA UI (github.com/Lucasa22/ui-labs, labs/copa-ui/
   src/styles/tokens.css). Mesma linguagem visual: paleta broadcast
   royal/mint/lime/flame, raios e superfícies noite/dia.

   Uso: o kit inclui <link rel="stylesheet" href="/ui/tokens.css">
   (o app monta ui/copa em /ui — ver docs/anatomy-of-a-kit.md).
   As fontes do copa-ui (Anton/Barlow) são webfonts; como os kits
   rodam sem CDN (CSP/offline), aqui ficam stacks de sistema.
   ========================================================== */
:root{
  /* raios / tempo */
  --r-xs:8px; --r-sm:12px; --r-md:16px; --r-lg:20px; --r-full:999px;
  --btn-radius:var(--r-full); --btn-clip:none;
  --ease:cubic-bezier(.4,0,.2,1); --spring:cubic-bezier(.34,1.56,.64,1);
  --t-fast:.16s; --t-med:.35s; --t-slow:.5s;

  /* paleta fixa da marca (não muda com o modo) + tinta de contraste de cada cor */
  --royal:#2E4BE8;  --royal-ink:#FFFFFF;
  --mint:#4FE3C1;   --mint-ink:#06251D;
  --lime:#ADE514;   --lime-ink:#1C2404;
  --flame:#F04E23;  --flame-ink:#FFFFFF;
  --lilac:#C4A9F2;  --lilac-ink:#241640;
  --scarlet:#E02B2B;

  /* gradientes de assinatura (moldura broadcast / listra) */
  --frame:conic-gradient(from 210deg, var(--royal), var(--mint), var(--lime), var(--flame), var(--lilac), var(--royal));
  --stripe:linear-gradient(90deg, var(--royal) 0 22%, var(--mint) 22% 40%, var(--lime) 40% 58%, var(--flame) 58% 78%, var(--lilac) 78% 100%);

  /* fontes (sistema — sem CDN) */
  --f-display:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --f-body:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --f-data:"JetBrains Mono","SFMono-Regular",ui-monospace,Menlo,Consolas,monospace;
}

/* superfícies — modo escuro (default) */
:root, :root[data-theme="dark"]{
  --bg:#07090D; --panel:#12151d; --panel-2:#1a1e29;
  --ink:#F2F4F8; --ink-2:#9AA3B5; --ink-3:#5B6373;
  --line:rgba(242,244,248,.10);
  --accent:var(--royal); --accent-2:var(--mint);
  /* variantes de TEXTO das cores da marca: mint/lime puros não têm
     contraste em fundo claro, então estes tokens flipam com o modo */
  --mint-text:var(--mint); --lime-text:var(--lime);
  --shadow-1:0 3px 12px rgba(0,0,0,.4); --shadow-2:0 12px 34px rgba(0,0,0,.55);
}
@media (prefers-color-scheme: light){
  :root{
    --bg:#EEF0F4; --panel:#FFFFFF; --panel-2:#F2F4F8;
    --ink:#0B0D12; --ink-2:#525A6B; --ink-3:#98A0B0;
    --line:rgba(11,13,18,.10);
    --mint-text:#0C9E85; --lime-text:#6E9206;
    --shadow-1:0 3px 12px rgba(11,13,18,.08); --shadow-2:0 12px 34px rgba(11,13,18,.16);
  }
}
:root[data-theme="light"]{
  --bg:#EEF0F4; --panel:#FFFFFF; --panel-2:#F2F4F8;
  --ink:#0B0D12; --ink-2:#525A6B; --ink-3:#98A0B0;
  --line:rgba(11,13,18,.10);
  --mint-text:#0C9E85; --lime-text:#6E9206;
  --shadow-1:0 3px 12px rgba(11,13,18,.08); --shadow-2:0 12px 34px rgba(11,13,18,.16);
}