/* erzeugt aus design/tokens.json mit tools/tokens-bauen.js - nicht von Hand aendern */

/* Rampen und Kalendertoene: nur ueber Rollen benutzen, nie direkt im Fenster. */
:root {
  --g-0: #ffffff; --g-50: #f6f7f9; --g-100: #eef0f3; --g-200: #e3e6eb; --g-300: #cfd3da; --g-400: #a9aebb; --g-500: #868c99; --g-600: #666c7b; --g-700: #555b68; --g-800: #3a3e47; --g-850: #2b2e35; --g-900: #22242a; --g-950: #1c1d22; --g-975: #17181c; --g-990: #131418;
  --i-50: #eef0ff; --i-100: #e0e3fd; --i-200: #c4c9fa; --i-300: #a2a9f6; --i-400: #7f88f0; --i-500: #5f69e4; --i-600: #4b55d0; --i-700: #3c44b0; --i-800: #2f358a; --i-900: #23285f;
  --r-50: #fdecec; --r-300: #f2a0a2; --r-500: #e5484d; --r-600: #d6393e; --r-700: #b4292f; --r-900: #6b1519;
  --gr-50: #e8f6ee; --gr-300: #8fd1ae; --gr-500: #2f9e6a; --gr-700: #1f7049; --gr-900: #0f3d27;
  --a-50: #fff5e0; --a-300: #f5cf7a; --a-500: #e8a317; --a-700: #a86b00; --a-900: #5c3a00;
  --k-blau: #3d8fd8; --k-tuerkis: #1fa3a3; --k-gruen: #3f9a6a; --k-gelb: #c9a227; --k-orange: #e07b39; --k-rot: #e5484d; --k-rosa: #d6589b; --k-lila: #9b5fd0; --k-grau: #868c99;
}

/* Rollen, dunkel (Grundzustand). */
:root {
  color-scheme: dark light;
  --bg: #17181c;
  --side: #131418;
  --raised: #22242a;
  --fill: #22242a;
  --fill-hover: #2b2e35;
  --sel: #2b2e35;
  --line: #1c1d22;
  --line-strong: #3a3e47;
  --ink: #eceef2;
  --ink-2: #a9aebb;
  --ink-3: #868c99;
  --faint: #666c7b;
  --accent: #5f69e4;
  --accent-hover: #7f88f0;
  --on-accent: #ffffff;
  --accent-ink: #a9aebb;
  --accent-tint: #22242a;
  --task-bg: #3c44b0;
  --task-ink: #ffffff;
  --task-ink-2: #c4c9fa;
  --task-done: #22242a;
  --now: #ff5c61;
  --danger: #f0676b;
  --danger-tint: #3a1c1e;
  --ok: #3fbf83;
  --warn: #f2b232;
  --heat-0: #22242a;
  --heat-1: #262a48;
  --heat-2: #2f358a;
  --heat-3: #4b55d0;
  --heat-4: #7f88f0;
  --heat-5: #c4c9fa;
  --ev-mix: 20%;
  --licht: rgba(255, 255, 255, 0.06);
  --kante: rgba(255, 255, 255, 0.12);
  --scrim: rgba(0, 0, 0, 0.45);
  --scrim-stark: rgba(0, 0, 0, 0.62);
  --vollbild: rgba(19, 20, 24, 0.94);
  --e1: 0 1px 2px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.04);
  --e2: 0 3px 8px -2px rgba(0, 0, 0, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4);
  --e3: 0 0 0 1px rgba(255, 255, 255, 0.07), 0 12px 28px -6px rgba(0, 0, 0, 0.6), 0 2px 4px rgba(0, 0, 0, 0.3);
  --e4: 0 0 0 1px rgba(255, 255, 255, 0.07), 0 24px 48px -10px rgba(0, 0, 0, 0.7);
  --e5: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 40px 80px -16px rgba(0, 0, 0, 0.8);
}

:root.immer-dunkel { color-scheme: dark; }

/* Rollen, hell - ausser in Fenstern mit .immer-dunkel. */
@media (prefers-color-scheme: light) {
  :root:not(.immer-dunkel) {
    --bg: #ffffff;
    --side: #f6f7f9;
    --raised: #ffffff;
    --fill: #eef0f3;
    --fill-hover: #e3e6eb;
    --sel: #eef0f3;
    --line: #eef0f3;
    --line-strong: #cfd3da;
    --ink: #17181c;
    --ink-2: #555b68;
    --ink-3: #666c7b;
    --faint: #868c99;
    --accent: #4b55d0;
    --accent-hover: #3c44b0;
    --on-accent: #ffffff;
    --accent-ink: #555b68;
    --accent-tint: #eef0f3;
    --task-bg: #4b55d0;
    --task-ink: #ffffff;
    --task-ink-2: #e0e3fd;
    --task-done: #eef0f3;
    --now: #e5484d;
    --danger: #d6393e;
    --danger-tint: #fdecec;
    --ok: #2f9e6a;
    --warn: #e8a317;
    --heat-0: #eef0f3;
    --heat-1: #e0e3fd;
    --heat-2: #c4c9fa;
    --heat-3: #7f88f0;
    --heat-4: #4b55d0;
    --heat-5: #2f358a;
    --ev-mix: 18%;
    --licht: transparent;
    --kante: rgba(255, 255, 255, 0.16);
    --scrim: rgba(16, 18, 27, 0.24);
    --scrim-stark: rgba(16, 18, 27, 0.5);
    --vollbild: rgba(246, 247, 249, 0.95);
    --e1: 0 1px 2px rgba(16, 18, 27, 0.08), 0 0 0 1px rgba(16, 18, 27, 0.05);
    --e2: 0 3px 6px -2px rgba(16, 18, 27, 0.12), 0 1px 2px rgba(16, 18, 27, 0.08);
    --e3: 0 0 0 1px rgba(16, 18, 27, 0.06), 0 10px 24px -6px rgba(16, 18, 27, 0.16), 0 2px 4px rgba(16, 18, 27, 0.05);
    --e4: 0 0 0 1px rgba(16, 18, 27, 0.06), 0 20px 44px -10px rgba(16, 18, 27, 0.24), 0 2px 6px rgba(16, 18, 27, 0.04);
    --e5: 0 0 0 1px rgba(16, 18, 27, 0.05), 0 36px 72px -16px rgba(16, 18, 27, 0.32);
  }
}

/* Skalen: Schrift, Abstand, Hoehe, Radius, Dauer, Ebene. */
:root {
  --font: "Inter", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif;
  --mono: ui-monospace, "Cascadia Code", "SF Mono", "Roboto Mono", monospace;
  --t-display: 48px; --lh-display: 1; --tr-display: -0.024em; --w-display: 600;
  --t-zahl: 32px; --lh-zahl: 1.1; --tr-zahl: -0.022em; --w-zahl: 600;
  --t-seite: 24px; --lh-seite: 1.2; --tr-seite: -0.019em; --w-seite: 600;
  --t-titel: 18px; --lh-titel: 1.3; --tr-titel: -0.017em; --w-titel: 600;
  --t-kopf: 15px; --lh-kopf: 1.35; --tr-kopf: -0.012em; --w-kopf: 600;
  --t-text: 13px; --lh-text: 1.45; --tr-text: -0.006em; --w-text: 400;
  --t-meta: 12px; --lh-meta: 1.45; --tr-meta: 0em; --w-meta: 400;
  --t-klein: 11px; --lh-klein: 1.45; --tr-klein: 0.005em; --w-klein: 400;
  --sp-1: 2px; --sp-2: 4px; --sp-3: 8px; --sp-4: 12px; --sp-5: 16px; --sp-6: 24px; --sp-7: 32px; --sp-8: 48px; --sp-9: 64px; --sp-10: 96px;
  --h-klein: 24px; --h-normal: 28px; --h-gross: 32px; --h-finger: 44px;
  --rad-s: 4px; --rad-m: 6px; --rad-l: 10px; --rad-xl: 14px;
  --dauer-kurz: 120ms; --dauer-mittel: 200ms; --dauer-lang: 320ms;
  --z-raster: 0; --z-termin: 1; --z-block: 2; --z-jetzt: 3; --z-geist: 4; --z-popover: 10; --z-dialog: 20; --z-toast: 30;
}