/* Design-System Verwaltung — Tokens * ───────────────────────────────── * Palette + Spacing + Typo + Radius + Shadow als CSS-Variablen. * Palette-Wechsel: siehe presets/*.css (überschreibt --accent + --bg). * * Erwartete Fonts (im laden falls gewünscht): * Inter (400,500,600,700) * Fraunces (400,500,600) — nur wenn Serif-Titel gewollt (Robin-Marke) * IBM Plex Mono (500,600) — nur wenn Mono-Section-Labels gewollt (empfohlen) */ :root{ /* ── Palette (neutrales Default — via presets/*.css überschreiben) ── */ --accent: #1f6feb; /* primary — Buttons, Links, aktive Sidebar-Items */ --accent-d: #1858c4; /* primary hover */ --accent-bg: rgba(31,111,235,.10); /* subtile primary-Fläche für active-Zustände */ --bg: #ffffff; /* Seiten-Hintergrund */ --bg-2: #f5f5f7; /* Hover, Section-Backgrounds */ --surface: #ffffff; /* Card / Sidebar / Table-Row */ --border: #e5e5ea; /* Standard-Border */ --border-2: #d0d0d5; /* Border bei Hover / stärker */ --text: #1a1a1e; /* Body-Text */ --text-soft: #4a4a52; /* Sekundär */ --text-dim: #86868c; /* Labels, Hints */ /* ── Status-Farben (in allen Presets identisch) ── */ --good: #2e7d32; --good-bg: #e8f5e9; --good-bd: #a5d6a7; --warn: #c62828; --warn-bg: #fff0f0; --warn-bd: #f5c0c0; --info: #1565c0; --info-bg: #e3f2fd; --caution: #e65100; --caution-bg: #fff3e0; /* ── Typo ── */ --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; --font-title: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; /* per-Preset auf Fraunces schaltbar */ --font-mono: 'IBM Plex Mono', 'SF Mono', ui-monospace, Menlo, monospace; /* ── Layout ── */ --sidebar-w: 228px; --sidebar-mobile-w: min(84vw, 300px); --mobile-breakpoint: 720px; /* zur Referenz — media queries verwenden hard-coded 720px */ /* ── Spacing ── */ --space-1: .25rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem; --space-5: 1.5rem; --space-6: 2rem; /* ── Radius ── */ --radius-sm: 6px; --radius: 9px; --radius-lg: 12px; --radius-xl: 18px; /* Login-Card etc. */ /* ── Shadow ── */ --shadow-1: 0 1px 2px rgba(20,15,8,.05), 0 2px 8px rgba(20,15,8,.04); --shadow-2: 0 4px 14px rgba(20,15,8,.06), 0 1px 3px rgba(20,15,8,.04); --shadow-lg: 0 8px 32px rgba(20,15,8,.10), 0 4px 8px rgba(20,15,8,.05); /* ── Motion ── */ --transition: .12s ease; --transition-drawer: .22s ease; } /* Reset — bewusst minimal, nicht Normalize/Reset-Bibliothek. */ *{box-sizing:border-box; margin:0; padding:0} html, body{overflow-x:hidden} body{ font-family: var(--font-body); background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; min-height: 100vh; } a{color: inherit}