/* ============================================================
   Pulsroute theme. Base: taste clinical, with tech's mono labels.
   Palette named from the subject (dialysis transport):
   --bg            Morgenlicht    early pick-up light on a ward corridor
   --surface-2     Flurkachel     pale tiled corridor
   --ink           Nachtschicht   graphite of a dispatch screen at 5 am
   --accent        Dialysat       the teal of dialysate fluid
   --field-1       Filterwasser   pale teal wash
   --field-2       Kassenblau     calm insurer paper blue
   --ink-field     Nachtfahrt     deep blue night ride
   --ok            Bestätigt      confirmation green
   --warn          Wartezeit      waiting amber
   ============================================================ */

@font-face {
  font-family: "IBM Plex Sans"; font-style: normal; font-weight: 100 700; font-display: swap;
  src: url("fonts/plex-sans-latin.woff2") format("woff2");
  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;
}
@font-face {
  font-family: "IBM Plex Sans"; font-style: normal; font-weight: 100 700; font-display: swap;
  src: url("fonts/plex-sans-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("fonts/plex-mono-latin-400.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("fonts/plex-mono-latin-500.woff2") format("woff2");
}

:root {
  --font-display: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  --font-body: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --w-display: 600;
  --tr-display: -0.025em;
  --tr-h2: -0.02em;
  --lh-display: 1.04;
  --fs-display: clamp(2.5rem, 1.5rem + 4.4vw, 5.25rem);
  --fs-h2: clamp(1.9rem, 1.3rem + 2.6vw, 3.4rem);
  --radius: 12px;
  --radius-sm: 8px;
  --radius-button: 10px;
  --case-eyebrow: uppercase;
  --tr-eyebrow: 0.1em;
  --bg: #f5f8f9;
  --surface: #ffffff;
  --surface-2: #e9f0f2;
  --ink: #0e1d26;
  --muted-strong: #32454f;
  --muted: #4d606a;
  --line: #d9e3e7;
  --line-strong: #bccbd2;
  --ink-field: #0b2532;
  --on-ink: #edf6f8;
  --on-ink-muted: #b4c8cf;
  --accent: #0d7a86;
  --accent-fill: #0c717c;
  --accent-on-fill: #ffffff;
  --accent-text: #0a6670;
  --accent-soft: #dbeff1;
  --field-1: #dbeff1;
  --field-1-ink: #0e1d26;
  --field-2: #e3eaf6;
  --field-2-ink: #0e1d26;
  --field-3: #0b2532;
  --field-3-ink: #edf6f8;
  --ok: #18703f;
  --ok-soft: #dcf0e4;
  --warn: #8a5a00;
  --warn-soft: #fbefd5;
  --step-glow: 0 0 0 1px var(--accent), 0 0 20px rgba(13, 122, 134, 0.24); /* Dialysat halo */
  --shadow-ui: 0 1px 2px rgba(14, 29, 38, 0.06), 0 12px 32px -12px rgba(14, 29, 38, 0.18);
  color-scheme: light; /* light is the default whatever the OS says; dark only via the toggle */
}

@media screen {
  :root[data-theme="dark"] {
    --bg: #0b141a;
    --surface: #111d24;
    --surface-2: #15232b;
    --ink: #e6f0f3;
    --muted-strong: #c0d0d6;
    --muted: #93a7af;
    --line: rgba(230, 240, 243, 0.1);
    --line-strong: rgba(230, 240, 243, 0.2);
    --ink-field: #071118;
    --on-ink: #e6f0f3;
    --on-ink-muted: #a8bcc3;
    --accent: #4cc3d0;
    --accent-fill: #4cc3d0;
    --accent-on-fill: #0b141a;
    --accent-text: #6fd0db;
    --accent-soft: rgba(76, 195, 208, 0.14);
    --field-1: #13323a;
    --field-1-ink: #e6f0f3;
    --field-2: #182436;
    --field-2-ink: #e6f0f3;
    --field-3: #071118;
    --field-3-ink: #e6f0f3;
    --ok: #6fd39d;
    --ok-soft: rgba(111, 211, 157, 0.14);
    --warn: #f0bf5c;
    --warn-soft: rgba(240, 191, 92, 0.14);
    --step-glow: 0 0 0 1px var(--accent), 0 0 24px rgba(76, 195, 208, 0.3); /* Dialysat halo at night */
    --shadow-ui: 0 1px 2px rgba(0, 0, 0, 0.3), 0 16px 40px -16px rgba(0, 0, 0, 0.6);
  }
  :root[data-theme="light"] { color-scheme: light; }
  :root[data-theme="dark"] { color-scheme: dark; }
}

body { font-variant-numeric: tabular-nums; }