/* Treinamento Claude — tokens.css */
/* ============================================================
   CLAUDE ACADEMY — DESIGN SYSTEM (tokens)
   Base neutra (não-creme) + um único accent ocre/latão.
   Trocar tema de cor = editar apenas as variáveis --accent-*.
   ============================================================ */
:root{
  color-scheme: light;
  /* superfícies */
  --bg:#f6f5f3;
  --surface:#ffffff;
  --surface-2:#efeeeb;
  --surface-inset:#f2f1ee;
  /* bordas */
  --border:#e6e4df;
  --border-strong:#d7d3cb;
  /* texto */
  --text:#1b1a17;
  --text-2:#6c685f;
  --text-3:#9c978c;
  /* accent (ocre/latão) — único token de cor da marca */
  --accent:#a9791f;
  --accent-hover:#8f6416;
  --accent-text:#8a6115;
  --accent-subtle:#f4edda;
  --accent-ring:rgba(169,121,31,.32);
  /* estado positivo (concluído) — usado com parcimônia */
  --positive:#3f7a54;
  --positive-subtle:#e8f0e9;
  --danger:#b23b3b;
  --danger-subtle:#f6e7e6;
  /* sombras (muito discretas) */
  --shadow-sm:0 1px 2px rgba(28,26,23,.05);
  --shadow-md:0 8px 28px -12px rgba(28,26,23,.16);
  --shadow-pop:0 16px 48px -16px rgba(28,26,23,.28);
  /* raios (variam por hierarquia) */
  --r-xs:6px; --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:22px;
  /* layout */
  --sidebar-w:264px;
  --topbar-h:60px;
  --content-max:1140px;
  /* tipografia */
  --font:'Hanken Grotesk',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
[data-theme="dark"]{
  color-scheme: dark;
  --bg:#121211;
  --surface:#1a1a18;
  --surface-2:#232320;
  --surface-inset:#1f1f1c;
  --border:rgba(255,255,255,.08);
  --border-strong:rgba(255,255,255,.15);
  --text:#eceae4;
  --text-2:#a29d93;
  --text-3:#726d63;
  --accent:#d9a441;
  --accent-hover:#e6b155;
  --accent-text:#e0ae52;
  --accent-subtle:rgba(217,164,65,.13);
  --accent-ring:rgba(217,164,65,.38);
  --positive:#5fa277;
  --positive-subtle:rgba(95,162,119,.14);
  --danger:#e07a7a;
  --danger-subtle:rgba(224,122,122,.15);
  --shadow-sm:0 1px 2px rgba(0,0,0,.3);
  --shadow-md:0 10px 30px -12px rgba(0,0,0,.5);
  --shadow-pop:0 20px 56px -18px rgba(0,0,0,.65);
}
