/* ==========================================================================
   DarkWeb Monitor — design tokens
   --------------------------------------------------------------------------
   The single source of truth for colour, type, radius, motion and metrics.
   No other stylesheet in this project may declare a raw colour value: if a
   shade is needed that is not here, it is derived with color-mix() from one
   of these custom properties so that both themes follow it automatically.

   Fonts are self-hosted. Nothing is fetched from a third party, so the CSP
   stays default-src 'self' and no visitor IP leaks to a font CDN.
   ========================================================================== */

/* --- fonts ---------------------------------------------------------------- */

/* Share Tech Mono — SIL OFL 1.1. Display face: the wide, squared glyphs are
   what gives headings and the brand their terminal read. Single weight. */
@font-face {
    font-family: 'Share Tech Mono';
    src: url('../fonts/share-tech-mono-latin.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
                   U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122,
                   U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Raleway — SIL OFL 1.1. Variable file, so one download covers 100..900 and
   the weight range is declared once rather than per weight. */
@font-face {
    font-family: 'Raleway';
    src: url('../fonts/raleway-latin-var.woff2') format('woff2-variations'),
         url('../fonts/raleway-latin-var.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
                   U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
                   U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF,
                   U+FFFD;
}

/* JetBrains Mono — Apache 2.0. Data face: onion addresses, hashes, headers,
   table figures. Variable, 100..800. */
@font-face {
    font-family: 'JetBrains Mono';
    src: url('../fonts/jetbrains-mono-latin.woff2') format('woff2-variations'),
         url('../fonts/jetbrains-mono-latin.woff2') format('woff2');
    font-weight: 100 800;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
                   U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
                   U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF,
                   U+FFFD;
}

/* Cinzel — SIL OFL 1.1. Carried over from the THUGS(red) brand board for the
   places that share a mark with valhalla.thugs.red. Variable, 400..900. */
@font-face {
    font-family: 'Cinzel';
    src: url('../fonts/cinzel-latin-var.woff2') format('woff2-variations'),
         url('../fonts/cinzel-latin-var.woff2') format('woff2');
    font-weight: 400 900;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
                   U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191,
                   U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --- tokens --------------------------------------------------------------- */

:root {
  /* brand constants — identical in both themes */
  --ink:#0b0f14; --deep:#111827; --slate:#1e293b;
  --blue:#2d6cdf; --cyan:#64d2ff; --muted:#a7b1c2; --light:#e6edf3;
  --brand-red:#ff3b47;           /* THUGS(red) accent, used sparingly */
  --ok:#3ddc84; --warn:#ffc53d; --bad:#ff4d5e; --info:#4aa8ff; --violet:#c98bff;

  /* site state colours — the five values of `state` in §4 */
  --state-alive:#3ddc84; --state-blocked:#ffc53d; --state-broken:#ff8a3d;
  --state-dead:#ff4d5e;  --state-waiting:#8b98ab;

  --font-display:'Share Tech Mono', ui-monospace, monospace;
  --font-body:'Raleway', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:'JetBrains Mono', ui-monospace, 'Cascadia Code', Menlo, monospace;

  --radius-sm:8px; --radius:12px; --radius-lg:18px; --radius-pill:999px;
  --ease:cubic-bezier(.22,.61,.36,1); --speed:200ms;
  --wrap:1280px; --header-h:64px;
}

:root, [data-theme='dark'] {
  color-scheme: dark;
  --bg:#0f151f;            /* lifted from Valhalla's #0b0f14 on purpose */
  --bg-2:#131b28;
  --surface:#161f2e; --surface-2:#1b2536; --surface-3:#212d41;
  --surface-hover:#243149;
  --border:rgba(167,177,194,.14); --border-strong:rgba(167,177,194,.28);
  --text:#e6edf3; --text-dim:#a7b1c2; --text-faint:#7d879a;
  --accent:#64d2ff; --accent-2:#2d6cdf;
  --grid:rgba(100,210,255,.05);
  --shadow:0 10px 34px rgba(0,0,0,.34);
  --shadow-lift:0 18px 48px rgba(0,0,0,.46);
}

[data-theme='light'] {
  color-scheme: light;
  --bg:#eef2f8; --bg-2:#e7edf6;
  --surface:#fff; --surface-2:#f6f8fc; --surface-3:#eef2f8;
  --surface-hover:#e4ebf6;
  --border:rgba(11,15,20,.12); --border-strong:rgba(11,15,20,.24);
  --text:#0d1420; --text-dim:#4d5a6f; --text-faint:#6b7788;
  --accent:#1f5fd0; --accent-2:#2d6cdf;
  --grid:rgba(45,108,223,.06);
  --shadow:0 10px 30px rgba(15,27,45,.10);
  --shadow-lift:0 18px 44px rgba(15,27,45,.16);
  --state-blocked:#9a6b00; --state-broken:#c2560f; --state-dead:#d32236;
  --state-alive:#12864a;  --state-waiting:#5b6577;
}