/* ============================================================
   ALN Design-System · gemeinsame Token-Datei für Dashboard und Portal
   (UX Stufe 1, R1 · 24.09.2026). Quelle: 02-Entwurf-Dashboard-Portal.html, Block „TOKENS".
   Stufe 2 tauscht NUR diese Variablen. Komponenten greifen nie auf Hex-Werte zu.
   Schrift: Hanken Grotesk, lokal (kein Google-Request, DSGVO).
   ============================================================ */
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:300;font-display:swap;src:url('fonts/hanken/HankenGrotesk-300-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:300;font-display:swap;src:url('fonts/hanken/HankenGrotesk-300-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/hanken/HankenGrotesk-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/hanken/HankenGrotesk-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/hanken/HankenGrotesk-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/hanken/HankenGrotesk-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/hanken/HankenGrotesk-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/hanken/HankenGrotesk-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/hanken/HankenGrotesk-700-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/hanken/HankenGrotesk-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
:root{
  /* Farben — Flächen */
  --aln-cream:#FBF9F7;          /* Website: Creme (PDF: Papierweiß #FAFAFA) */
  --aln-white:#FFFFFF;
  --aln-grey:#EFEFEF;           /* PDF: Hellgrau — Sekundärfläche (Tabellenkopf, Hover) */
  --aln-ice:#E8ECF5;            /* PDF: Eisblau — hervorgehobene Flächen (Hinweis, Prüfmodus) */
  --aln-dove:#BCC6DC;           /* Taubenblau — Pills, aktive Reiter, Linien. NICHT für Buttons */
  --aln-dove-30:rgba(188,198,220,.30);
  --aln-dove-15:rgba(188,198,220,.15);
  --aln-marine:#16233A;         /* Website: Marine — Buttons, Überschriften, eine große Fläche je Seite */
  --aln-marine-dark:#0F1A2C;    /* Hover */
  /* Farben — Text */
  --aln-ink:var(--aln-marine);  /* Überschriften, Labels */
  --aln-graphite:#3A3D42;       /* Fließtext (PDF: #2F3133) */
  --aln-muted:rgba(58,61,66,.70);
  --aln-faint:rgba(58,61,66,.50);
  --aln-on-dark:rgba(255,255,255,.78);
  /* Linien */
  --aln-hair:rgba(188,198,220,.55);
  --aln-hair-soft:rgba(188,198,220,.45);
  --aln-hair-dark:rgba(255,255,255,.14);
  /* Status — VORSCHLAG (F-5), nicht in den Quellen */
  --aln-ok:#3F7D5D;      --aln-ok-bg:#E6F0EA;
  --aln-warn:#B8862B;    --aln-warn-bg:#F6EFDD;
  --aln-danger:#A3453A;  --aln-danger-bg:#F5E4E1;
  /* Typografie */
  --aln-font:'Hanken Grotesk',system-ui,-apple-system,sans-serif;
  --aln-fs-11:11px; --aln-fs-12:12px; --aln-fs-13:13.5px; --aln-fs-14:14px; --aln-fs-15:15.5px;
  --aln-fs-17:17px; --aln-fs-20:20px; --aln-fs-26:26px; --aln-fs-32:32px;
  --aln-lh:1.55;
  --aln-track:.12em;             /* gesperrte Versalien */
  --aln-tight:-.02em;            /* Überschriften */
  /* Abstände */
  --aln-s1:4px; --aln-s2:8px; --aln-s3:12px; --aln-s4:16px; --aln-s5:24px; --aln-s6:32px; --aln-s7:48px;
  /* Radien */
  --aln-r-lg:24px; --aln-r-md:18px; --aln-r:12px; --aln-r-sm:10px; --aln-r-pill:999px;
  /* Schatten */
  --aln-shadow-card:0 8px 30px -20px rgba(22,35,58,.25);
  --aln-shadow-hover:0 22px 50px -28px rgba(22,35,58,.40);
  --aln-shadow-overlay:0 30px 60px -30px rgba(22,35,58,.45);
  /* Maße */
  --aln-side-w:236px; --aln-main-max:1240px; --aln-dialog-max:960px; --aln-btn-h:40px; --aln-btn-h-lg:46px;
  --aln-actions-w:132px;         /* feste Aktionsspalte in Tabellen */
}
/* ============================================================
   PORTAL-ERGÄNZUNG (UX Stufe 2 · D1, 26.09.2026) — Präfix --p-
   Quelle: UX-Stufe2-Portal/02-portal-design.html (ALN Dashboard UX Fable).
   Nur aus bestehenden Tokens abgeleitet, keine neuen Farben.
   ============================================================ */
:root{
  --p-bg:var(--aln-cream);
  --p-card:var(--aln-white);
  --p-text:var(--aln-graphite);
  --p-head:var(--aln-marine);
  --p-quiet:var(--aln-muted);
  --p-line:var(--aln-hair-soft);
  --p-track:var(--aln-dove-30);
  /* Typo-Skala: 13 · 15 · 17 · 22 · 32 · 48 */
  --p-t1:13px; --p-t2:15px; --p-t3:17px; --p-t4:22px; --p-t5:32px; --p-t6:48px;
  /* Raster: 8er-Schritte, Inhalt max. 1080 px */
  --p-max:1080px; --p-gut:40px; --p-gap:24px; --p-sec:64px;
  --p-card-pad:32px; --p-r:var(--aln-r-lg);
  --p-shadow:0 1px 2px rgba(22,35,58,.04),0 12px 32px -18px rgba(22,35,58,.18);
  --p-btn-h:48px;
}
@media(max-width:640px){:root{--p-gut:20px;--p-gap:16px;--p-sec:40px;--p-card-pad:20px;--p-t5:26px;--p-t6:40px;}}
/* ============================================================
   DASHBOARD-ERGÄNZUNG (UX Stufe 2 · D2, 26.09.2026) — Präfix --d-
   Quelle: UX-Stufe2-Dashboard/01-Richtung-Dashboard.md + 02-dashboard-design.html (ALN Dashboard UX Fable).
   Nur aus bestehenden Tokens abgeleitet, keine neuen Farben.
   ============================================================ */
:root{
  --d-bg:var(--aln-cream);
  --d-card:var(--aln-white);
  --d-text:var(--aln-graphite);
  --d-head:var(--aln-marine);
  --d-quiet:var(--aln-muted);
  --d-line:var(--aln-hair-soft);
  --d-track:var(--aln-dove-30);
  --d-hover:var(--aln-dove-15);
  --d-focus:var(--aln-dove-30);
  /* Typo-Skala: 12 Meta · 14 Text · 16 Eingabe · 20 Kartentitel · 28 Seitentitel · 36 Kennzahl */
  --d-t1:12px; --d-t2:14px; --d-t3:16px; --d-t4:20px; --d-t5:28px; --d-t6:36px;
  /* Raster: Seitenleiste 232, Inhalt zentriert max. 1200, Seitenrand 40, 8er-Schritte */
  --d-side:232px; --d-max:1200px; --d-pad:40px; --d-gap:16px; --d-sec:40px; --d-card-pad:24px;
  --d-row:56px; --d-row2:64px;
  --d-r:var(--aln-r-lg);
  --d-shadow:0 1px 2px rgba(22,35,58,.04),0 8px 24px -16px rgba(22,35,58,.16);
  --d-btn-h:40px; --d-field-h:44px;
  --d-rail:360px;          /* Prüfmodus-Panel */
  --d-act:112px;           /* Aktionsspalte: ein Textlink + „···" */
}
@media(max-width:760px){:root{--d-pad:20px;--d-sec:32px;--d-card-pad:20px;--d-t5:24px;--d-t6:30px;}}