:root{
  /* marca real da FD Multimedia (fdmultimedia.com.br): preto/laranja/branco,
     Space Grotesk nos títulos, DM Sans no corpo — checado com getComputedStyle
     no site ao vivo, não chutado. */
  --ink:#151515; --paper:#ffffff; --panel:#f6f6f4; --panel-2:#eeeeec;
  --line:#e2e1dd; --line-strong:#c9c8c2; --muted:#68675f; --muted-2:#9b9a92;
  --accent:#ff6335; --accent-ink:#b8360f; --accent-bg:rgba(255,99,53,.1);
  --ok:#166a45; --ok-bg:#e3f2e9; --warn:#8a5a10; --warn-bg:#faf0dc; --danger:#a3282e; --danger-bg:#faeaea;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --sans:'DM Sans',ui-sans-serif,system-ui,sans-serif;
  --display:'Space Grotesk',var(--sans);
  /* Aliases shadcn/ui (style "new-york") -> tokens FD acima. Mesma marca,
     nomenclatura padrão shadcn, pra usar as receitas de classe Tailwind reais
     (bg-primary, text-muted-foreground, border-input, ring...) — ver
     tailwind.config em index.html e as funções btnClass/inputClass/etc em
     app.js. Não redeclarar valor literal aqui de novo — sempre apontar pro
     token FD, senão os dois sistemas divergem no dark mode. */
  --background:var(--paper); --foreground:var(--ink);
  --card:var(--paper); --card-foreground:var(--ink);
  --popover:var(--paper); --popover-foreground:var(--ink);
  --primary:var(--ink); --primary-foreground:var(--paper);
  --secondary:var(--panel); --secondary-foreground:var(--ink);
  --muted-bg:var(--panel-2); --muted-foreground:var(--muted);
  --accent-foreground:var(--accent-ink);
  --destructive:var(--danger); --destructive-foreground:var(--paper);
  --border:var(--line); --input:var(--line-strong); --ring:var(--accent);
  --radius:0.5rem;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ink:#f3f3ee; --paper:#151515; --panel:#1c1c1c; --panel-2:#222222;
    --line:#2c2c2c; --line-strong:#3d3d3d; --muted:#a3a29c; --muted-2:#77766f;
    --accent:#ff7a52; --accent-ink:#ffb49a; --accent-bg:rgba(255,122,82,.16);
    --ok:#4bc189; --ok-bg:rgba(75,193,137,.16); --warn:#e2ac4a; --warn-bg:rgba(226,172,74,.16);
    --danger:#e8747a; --danger-bg:rgba(232,116,122,.16);
  }
}
:root[data-theme="dark"]{
  --ink:#f3f3ee; --paper:#151515; --panel:#1c1c1c; --panel-2:#222222;
  --line:#2c2c2c; --line-strong:#3d3d3d; --muted:#a3a29c; --muted-2:#77766f;
  --accent:#ff7a52; --accent-ink:#ffb49a; --accent-bg:rgba(255,122,82,.16);
  --ok:#4bc189; --ok-bg:rgba(75,193,137,.16); --warn:#e2ac4a; --warn-bg:rgba(226,172,74,.16);
  --danger:#e8747a; --danger-bg:rgba(232,116,122,.16);
}
/* reset mínimo — todo o resto da dashboard é Tailwind (ver index.html/app.js),
   isso aqui é só o que Tailwind's preflight não cobre pro nosso layout raiz. */
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:14px;line-height:1.5}
h1,h2,h3{font-family:var(--display);letter-spacing:-.01em;margin:0}
button{font-family:var(--sans)}
a{color:inherit}
#app{height:100vh;height:100dvh;display:flex;flex-direction:column}