/* ──────────────────────────────────────────────────────────────────────
   loom design tokens — surface layer
   Extracted from the loom source (fabric/loom/app/globals.css). These CSS
   variables switch automatically when the `.dark` class is toggled on <html>.
   Plain top-level rules (no @layer) so this file is valid when @import-ed as
   its own module. Documented in theme/loom-tokens.md.
─────────────────────────────────────────────────────────────────────── */
:root {
  --font-sans: "Inter", system-ui, sans-serif;

  /* Surfaces (light) */
  --surface-bg: #f8fafc; /* slate-50  — page background */
  --surface-card: #ffffff; /* white     — cards, sidebar, header */
  --surface-raised: #f1f5f9; /* slate-100 — table header, code bg */
  --surface-border: #e2e8f0; /* slate-200 — borders & dividers */
}

.dark {
  --surface-bg: #09090b; /* zinc-950 */
  --surface-card: #18181b; /* zinc-900 */
  --surface-raised: #27272a; /* zinc-800 */
  --surface-border: #3f3f46; /* zinc-700 */
}

/* ──────────────────────────────────────────────────────────────────────
   Sport-X Portal: Marken- und Statusfarben (STANDARD-Tier, Quelle portal.nexyo.io)
─────────────────────────────────────────────────────────────────────── */
:root{--bg:var(--surface-bg);--card:var(--surface-card);--raised:var(--surface-raised);--border:var(--surface-border);
 --brand:#229fa5;--brand-50:#f0fdfa;--brand-100:#ccfbf1;--brand-600:#0d9488;--brand-700:#0f766e;--brand-text:#0d9488;
 --text:#111827;--muted:#64748b;--ok:#22c55e;--warn:#f59e0b;--idle:#94a3b8;--err:#ef4444;--info:#3b82f6;
 --radius:10px;--top-h:56px;--sb-w:240px;color-scheme:light}
:root.dark{--text:#f4f4f5;--muted:#a1a1aa;--brand-50:#042f2e;--brand-100:#134e4a;--brand-700:#5eead4;--brand-text:#2dd4bf;color-scheme:dark}