/* Tokens da interface. A fonte é docs/interface/design.md; tests/interface-design.test.mjs confere os dois.
   Barlow vem do kit da marca, servido pelo próprio servidor (nada de rede). */
@font-face { font-family: 'Barlow'; font-weight: 400; font-style: normal; font-display: swap; src: url('/marcas/creative-ai/fontes/Barlow-Regular.ttf') format('truetype') }
@font-face { font-family: 'Barlow'; font-weight: 500; font-style: normal; font-display: swap; src: url('/marcas/creative-ai/fontes/Barlow-Medium.ttf') format('truetype') }
@font-face { font-family: 'Barlow'; font-weight: 600 700; font-style: normal; font-display: swap; src: url('/marcas/creative-ai/fontes/Barlow-SemiBold.ttf') format('truetype') }
@font-face { font-family: 'Barlow'; font-weight: 800; font-style: normal; font-display: swap; src: url('/marcas/creative-ai/fontes/Barlow-ExtraBold.ttf') format('truetype') }

:root {
  --fundo: #F1F0EC; --superficie: #FFFFFF; --superficie-2: #F7F6F3; --mesa: #E4E3DE;
  --tinta: #0A0A0A; --texto: #1B1A19; --texto-2: #5E5C58; --texto-3: #66645F;
  --linha: #DEDCD6; --linha-forte: #C9C7C0; --campo: #8A8883;
  --destaque: #F51C62; --destaque-suave: #FDE6EE; --destaque-texto: #C80E4A; --acao: #C80E4A; --sobre-acao: #FFFFFF;
  --ok: #13795B; --ok-suave: #E2F3EC; --aviso: #8F5200; --aviso-suave: #FCF0DC; --erro: #B3261E; --erro-suave: #FBE9E7;
  --degrade: linear-gradient(135deg, #F51C62 0%, #D9268A 25%, #A239AE 55%, #704DDE 80%, #6053EC 100%);
  --sombra: 0 1px 2px rgba(10,10,10,.06), 0 8px 24px rgba(10,10,10,.06);
  --sombra-flutuante: 0 12px 40px rgba(10,10,10,.18);
  --fonte: 'Barlow', 'Helvetica Neue', Arial, sans-serif;
  --t-corpo: 400 15px/1.45 var(--fonte);
  --t-corpo-forte: 600 15px/1.45 var(--fonte);
  --t-pequeno: 400 14px/1.4 var(--fonte);
  --t-pequeno-forte: 600 14px/1.4 var(--fonte);
  --t-legenda: 400 13px/1.35 var(--fonte);
  --t-rotulo: 600 12px/1.3 var(--fonte); --ls-rotulo: 0.07em;
  --t-titulo-1: 700 20px/1.2 var(--fonte); --ls-titulo-1: -0.01em;
  --t-titulo-2: 700 17px/1.25 var(--fonte); --ls-titulo-2: -0.01em;
  --t-titulo-3: 600 15px/1.3 var(--fonte);
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 20px; --r-pilula: 999px;
  --e-xs: 4px; --e-sm: 8px; --e-md: 12px; --e-lg: 16px; --e-xl: 24px; --e-xxl: 32px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  --fundo: #0B0B0C; --superficie: #151517; --superficie-2: #1B1B1E; --mesa: #0F0F11;
  --tinta: #F3F2EF; --texto: #ECEBE7; --texto-2: #A7A5A0; --texto-3: #8E8C86;
  --linha: #26262A; --linha-forte: #34343A; --campo: #77756F;
  --destaque: #FF3D7A; --destaque-suave: #3A1424; --destaque-texto: #FF5C8F; --acao: #C80E4A; --sobre-acao: #FFFFFF;
  --ok: #4CC79A; --ok-suave: #12291F; --aviso: #F2B35B; --aviso-suave: #2E2212; --erro: #FF8A80; --erro-suave: #3A1614;
  --sombra: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.3);
  --sombra-flutuante: 0 12px 40px rgba(0,0,0,.55);
  color-scheme: dark } }
:root[data-theme="dark"] {
  --fundo: #0B0B0C; --superficie: #151517; --superficie-2: #1B1B1E; --mesa: #0F0F11;
  --tinta: #F3F2EF; --texto: #ECEBE7; --texto-2: #A7A5A0; --texto-3: #8E8C86;
  --linha: #26262A; --linha-forte: #34343A; --campo: #77756F;
  --destaque: #FF3D7A; --destaque-suave: #3A1424; --destaque-texto: #FF5C8F; --acao: #C80E4A; --sobre-acao: #FFFFFF;
  --ok: #4CC79A; --ok-suave: #12291F; --aviso: #F2B35B; --aviso-suave: #2E2212; --erro: #FF8A80; --erro-suave: #3A1614;
  --sombra: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.3);
  --sombra-flutuante: 0 12px 40px rgba(0,0,0,.55);
  color-scheme: dark }