/* Aufgeteilt aus app.css — Kaskade: tokens -> base -> layout -> components. Reihenfolge in components/styles.html nicht aendern. */
:root {
    --app-bg: #0f172a;
    --app-bg-soft: #111827;
    --app-surface: rgba(15, 23, 42, 0.78);
    --app-surface-solid: #111827;
    --app-border: rgba(148, 163, 184, 0.22);
    --app-text: #e5e7eb;
    --app-muted: #94a3b8;
    --app-primary: #38bdf8;
    --app-primary-strong: #0ea5e9;
    --app-primary-contrast: #031525;
    --app-radius: 1.25rem;
    --app-shadow: 0 24px 80px rgba(2, 6, 23, 0.38);

    /* Layout: shared content width + fluid side gutters.
       Tune --app-container-max to use more/less of large displays. */
    --app-container-max: 1480px;
    --app-container-gutter: clamp(1rem, 0.5rem + 2vw, 3rem);
}