:root {
    /* Marke */
    --brand: #20557C;
    --brand-dark: #17405F;
    --accent: #f4c541;
    --accent-text: #765900;
    --accent-hover: #5f4800;
    --accent-soft: #fff8df;
    --accent-border: #efd982;

    /* Text */
    --ink: #14212b;
    --ink-soft: #273744;
    --muted: #687786;
    --muted-light: #87939d;

    /* Flächen */
    --surface: #ffffff;
    --surface-subtle: #f7f8fa;
    --surface-muted: #f4f6f8;
    --surface-raised: #fbfcfd;
    --surface-canvas: #f5f7f9;
    --surface-blue: #edf5fb;
    --surface-blue-border: #cadfec;
    --surface-placeholder: #edf1f4;
    --surface-badge: #e9eef3;

    /* Linien / Fokus */
    --line: #e3e8ee;
    --line-strong: #cfd8e1;
    --line-hover: #aebac5;
    --line-soft: #edf0f3;
    --focus: #7698b4;

    /* Navigation */
    --nav-hover: #f6f8fa;
    --nav-active: #eef2f5;

    /* Status */
    --success: #198754;
    --success-soft: #eef8f1;
    --success-border: #b9dcc3;
    --warning: #9a6d00;
    --warning-soft: #fff7dc;
    --warning-border: #f0d36b;
    --draft: #84919d;
    --skipped: #6c757d;
    --skipped-soft: #f2f4f6;

    /* Text/Flächen auf dunklem Marken-Hintergrund */
    --on-brand: #ffffff;
    --on-brand-strong: rgba(255, 255, 255, .94);
    --on-brand-nav: rgba(255, 255, 255, .82);
    --on-brand-muted: rgba(255, 255, 255, .72);
    --on-brand-soft: rgba(255, 255, 255, .58);
    --on-brand-faint: rgba(255, 255, 255, .48);
    --on-brand-line: rgba(255, 255, 255, .12);
    --on-brand-hover: rgba(255, 255, 255, .11);
    --on-brand-outline: rgba(255, 255, 255, .30);

    /* Transparente Flächen */
    --glass-surface: rgba(255, 255, 255, .94);
    --glass-surface-strong: rgba(255, 255, 255, .96);
    --media-overlay: rgba(7, 22, 34, .72);

    /* Schatten / Focus-Ringe */
    --shadow-header: 0 2px 8px color-mix(in srgb, var(--brand) 8%, transparent);
    --shadow-card: 0 8px 28px color-mix(in srgb, var(--brand) 5%, transparent);
    --shadow-card-hover: 0 14px 35px color-mix(in srgb, var(--brand) 10%, transparent);
    --shadow-news-hover: 0 14px 32px color-mix(in srgb, var(--brand) 10%, transparent);
    --shadow-admin-card: 0 5px 22px color-mix(in srgb, var(--brand) 4.5%, transparent);
    --shadow-admin-hover: 0 8px 28px color-mix(in srgb, var(--brand) 8%, transparent);
    --focus-ring: 0 0 0 .2rem color-mix(in srgb, var(--brand) 10%, transparent);
    --focus-ring-soft: 0 0 0 .2rem color-mix(in srgb, var(--brand) 8%, transparent);
    --picker-ring: 0 0 0 2px color-mix(in srgb, var(--brand) 8%, transparent);

    /* Verläufe */
    --hero-gradient: linear-gradient(180deg, var(--surface-subtle) 0, var(--surface) 100%);
    --brand-gradient: linear-gradient(145deg, var(--brand), var(--brand-dark));
    --accent-gradient: linear-gradient(90deg, var(--accent-text), var(--accent));
}