/* Tokens: cores, tipos, espaços, raios e movimento. Claro em :root; escuro pelo sistema (salvo escolha Claro) ou por escolha Escuro. */

@font-face {
  font-family: "IBM Plex Sans";
  src: url("/fontes/ibm-plex-sans.woff2") format("woff2");
  font-weight: 100 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("/fontes/ibm-plex-sans-italico.woff2") format("woff2");
  font-weight: 100 700;
  font-style: italic;
  font-display: swap;
}
@font-face { font-family: "Barlow Condensed"; src: url("/fontes/barlow-condensed-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow Condensed"; src: url("/fontes/barlow-condensed-800.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("/fontes/ibm-plex-mono-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("/fontes/ibm-plex-mono-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }

:root {
  color-scheme: light dark;
  --fundo: #f6f5f0; --superficie: #fbfaf6; --tinta: #121212; --secundario: #5b5e64;
  --linha: #121212; --linha-suave: #d9d6cc; --linha-forte: #8a877e;
  --acento: #fe5864; --acento-texto: #c8323f; --acento-suave: #ffe3e6;
  --preenchido: #ecebe4; --sobre-acento: #121212;
  --vidro: rgba(246, 245, 240, .94);
  --sombra-folha: 0 -1px 0 #121212;
  --sombra-flutuante: 0 0 0 1px #121212;
  --cortina: rgba(18, 18, 18, .4);
  --st-cond: #a8261c; --st-rev: #7140a8; --st-abs: #1c7444; --st-arq: #4d5d70; --st-inv: #9a5c00; --st-nd: #656b74;
  --st-cond-bg: #fbe9e7; --st-rev-bg: #f1e9fa; --st-abs-bg: #e3f3ea; --st-arq-bg: #e8edf3; --st-inv-bg: #fbefdc; --st-nd-bg: #eff0f2;

  --titulo: "Barlow Condensed", "Arial Narrow", sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", monospace;
  --sans: "IBM Plex Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --t-corpo: 17px; --t-pequeno: 15px; --t-mini: 13px; --t-rotulo: 12px;
  --t-h1: 28px; --t-h2: 22px; --t-h3: 19px; --t-resposta: 18px;
  --entrelinha: 1.55;

  --raio: 2px; --raio-p: 2px; --raio-pilula: 999px; --toque: 44px;
  --e1: 4px; --e2: 8px; --e3: 12px; --e4: 16px; --e5: 24px; --e6: 32px; --e7: 48px;
  --mover: 200ms cubic-bezier(.2, .8, .2, 1);
}

/* escuro: pelo sistema, salvo escolha manual de Claro; ou por escolha manual de Escuro */
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) {
    --fundo: #0e0f11; --superficie: #16181b; --tinta: #ecebe6; --secundario: #9a9da3;
    --linha: #5a5d63; --linha-suave: #2a2c30; --linha-forte: #5a5d63;
    --acento: #fe5864; --acento-texto: #fe5864; --acento-suave: #3d1d22;
    --preenchido: #1d1f23; --sobre-acento: #121212;
    --vidro: rgba(14, 15, 17, .94);
    --sombra-folha: 0 -1px 0 #5a5d63;
    --sombra-flutuante: 0 0 0 1px #5a5d63;
    --cortina: rgba(0, 0, 0, .6);
    --st-cond: #f08a80; --st-rev: #c3a2ee; --st-abs: #7fd3a2; --st-arq: #a9b8ca; --st-inv: #f0b860; --st-nd: #a3a9b2;
    --st-cond-bg: #3a1d1b; --st-rev-bg: #2c2140; --st-abs-bg: #16321f; --st-arq-bg: #222c38; --st-inv-bg: #3a2a10; --st-nd-bg: #252a31;
  }
}
:root[data-tema="claro"] { color-scheme: light; }
:root[data-tema="escuro"] {
  color-scheme: dark;
  --fundo: #0e0f11; --superficie: #16181b; --tinta: #ecebe6; --secundario: #9a9da3;
  --linha: #5a5d63; --linha-suave: #2a2c30; --linha-forte: #5a5d63;
  --acento: #fe5864; --acento-texto: #fe5864; --acento-suave: #3d1d22;
  --preenchido: #1d1f23; --sobre-acento: #121212;
  --vidro: rgba(14, 15, 17, .94);
  --sombra-folha: 0 -1px 0 #5a5d63;
  --sombra-flutuante: 0 0 0 1px #5a5d63;
  --cortina: rgba(0, 0, 0, .6);
  --st-cond: #f08a80; --st-rev: #c3a2ee; --st-abs: #7fd3a2; --st-arq: #a9b8ca; --st-inv: #f0b860; --st-nd: #a3a9b2;
  --st-cond-bg: #3a1d1b; --st-rev-bg: #2c2140; --st-abs-bg: #16321f; --st-arq-bg: #222c38; --st-inv-bg: #3a2a10; --st-nd-bg: #252a31;
}

@media (prefers-reduced-motion: reduce) { :root { --mover: 0ms; } }
