/* ════════════════════════════════════════════════════════════════════════
   DanGPT design tokens — the single source of truth for every page and
   tool on the site (/, /ats, /standup, /agent, /knowledge).

   Change a colour here and it changes everywhere. Per-page stylesheets
   map their own local names onto these tokens rather than redefining
   values, so nothing drifts.

   Fonts are self-hosted (no third-party requests, GDPR).
   ════════════════════════════════════════════════════════════════════════ */

/* Body — Inter */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/inter-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/inter-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/inter-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url("/fonts/inter-latin-700-normal.woff2") format("woff2")}
/* Display — Space Grotesk */
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/space-grotesk-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:700;font-display:swap;src:url("/fonts/space-grotesk-latin-700-normal.woff2") format("woff2")}
/* Mono — IBM Plex Mono */
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/ibm-plex-mono-latin-600-normal.woff2") format("woff2")}

:root{
  /* Surfaces, darkest to lightest */
  --dg-bg:#0c0c0c;
  --dg-surface:#161616;
  --dg-surface-2:#202020;
  --dg-surface-3:#282828;

  /* Lines */
  --dg-border:#272727;
  --dg-border-2:#3a3a3a;

  /* Text, brightest to dimmest */
  --dg-text:#ececec;
  --dg-text-dim:#d9d9d9;
  --dg-muted:#9d9d9d;
  --dg-faint:#8a8a8a;

  /* Brand accent */
  --dg-accent:#0090d8;          /* accent text + borders (WCAG AA on dark) */
  --dg-accent-btn:#006bb5;      /* accent as a background behind white text */
  --dg-accent-soft:rgba(0,144,216,.12);
  --dg-accent-line:rgba(0,144,216,.35);

  /* Status */
  --dg-ok:#4ade80;      --dg-ok-soft:rgba(74,222,128,.10);   --dg-ok-line:rgba(74,222,128,.30);
  --dg-warn:#fbbf24;    --dg-warn-soft:rgba(251,191,36,.10); --dg-warn-line:rgba(251,191,36,.30);
  --dg-danger:#f87171;  --dg-danger-soft:rgba(248,113,113,.10); --dg-danger-line:rgba(248,113,113,.30);
  --dg-info:#4f8ef7;    --dg-info-soft:rgba(79,142,247,.10);
  --dg-purple:#b478ff;  --dg-purple-soft:rgba(180,120,255,.12);

  /* Type */
  --dg-sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --dg-display:"Space Grotesk","Inter",-apple-system,sans-serif;
  --dg-mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;

  --dg-radius:12px;
  --dg-radius-sm:8px;

  /* Depth */
  --dg-shadow:0 1px 0 rgba(0,0,0,.35), 0 2px 8px rgba(0,0,0,.25);
  --dg-scrim:rgba(12,12,12,.88);
  --dg-sticky-bar:rgba(12,12,12,.93);

  /* Sticky notes are physical objects — same colour in either theme */
  --dg-note-y:#f0cf65;
  --dg-note-b:#7fa8e8;
  --dg-note-g:#7fcf9b;
  --dg-note-ink:#16181d;
}

/* ── Light theme ────────────────────────────────────────────────────────────
   Only the tokens change; every page maps its own names onto these, so the
   whole site flips from this one block.                                     */
:root[data-theme="light"]{
  --dg-bg:#f4f5f7;
  --dg-surface:#ffffff;
  --dg-surface-2:#f1f2f5;
  --dg-surface-3:#e3e5ea;

  --dg-border:#dee0e6;
  --dg-border-2:#c3c8d2;

  --dg-text:#14181f;
  --dg-text-dim:#2c3340;
  --dg-muted:#586173;
  --dg-faint:#5d6675;

  --dg-accent:#0070ac;
  --dg-accent-btn:#00629a;
  --dg-accent-soft:rgba(0,112,172,.10);
  --dg-accent-line:rgba(0,112,172,.35);

  --dg-ok:#1a7344;      --dg-ok-soft:rgba(26,115,68,.10);     --dg-ok-line:rgba(26,115,68,.35);
  --dg-warn:#8a5b00;    --dg-warn-soft:rgba(138,91,0,.10);    --dg-warn-line:rgba(138,91,0,.35);
  --dg-danger:#b3261e;  --dg-danger-soft:rgba(179,38,30,.08); --dg-danger-line:rgba(179,38,30,.35);
  --dg-info:#1f4fd0;    --dg-info-soft:rgba(31,79,208,.08);
  --dg-purple:#6b3fa0;  --dg-purple-soft:rgba(107,63,160,.09);

  --dg-shadow:0 1px 0 rgba(15,22,38,.05), 0 2px 8px rgba(15,22,38,.06);
  --dg-scrim:rgba(240,242,245,.90);
  --dg-sticky-bar:rgba(244,245,247,.93);
}

/* ── Shared chrome ──────────────────────────────────────────────────────── */
.dg-back{
  display:block;max-width:1080px;margin:0 auto;
  padding:16px 20px 0;
  font-size:13px;color:var(--dg-muted);text-decoration:none;
  font-family:var(--dg-sans);
}
.dg-back strong{color:var(--dg-accent);font-weight:400}
.dg-back:hover{color:var(--dg-text)}
@media print{.dg-back{display:none!important}}

/* ── Theme toggle ───────────────────────────────────────────────────────── */
.dg-theme{
  position:fixed;top:12px;right:14px;z-index:900;
  display:inline-flex;align-items:center;gap:7px;
  background:var(--dg-surface);border:1px solid var(--dg-border);
  color:var(--dg-muted);border-radius:999px;padding:7px 13px;
  font-family:var(--dg-sans);font-size:12px;font-weight:500;
  cursor:pointer;line-height:1;box-shadow:var(--dg-shadow);
}
.dg-theme:hover{color:var(--dg-text);border-color:var(--dg-border-2)}
.dg-theme:focus-visible{outline:2px solid var(--dg-accent);outline-offset:2px}
.dg-theme svg{width:14px;height:14px;flex-shrink:0}
.dg-theme .dg-theme-label{white-space:nowrap}
/* show the icon for the mode you'd switch TO */
.dg-theme .i-sun{display:none}
:root[data-theme="light"] .dg-theme .i-sun{display:block}
:root[data-theme="light"] .dg-theme .i-moon{display:none}
@media (max-width:620px){
  .dg-theme{padding:7px 9px}
  .dg-theme .dg-theme-label{display:none}
}
@media print{.dg-theme{display:none!important}}