/*
 * GCHP Vorstandscockpit – Oberfläche 25
 * Das einzige Stylesheet des Cockpits. Layer-Reihenfolge (spätere gewinnen unabhängig von
 * der Spezifität): tokens, base, layout, components, pages, utilities.
 *
 * Bausteine (Kurzreferenz; PHP-Helfer in partials/ui-v24.php, Vorlage: circulars.php):
 *   Shell     .ui-sidebar · .ui-topbar · .ui-tabbar · .ui-main
 *   Kopf      .ui-pagehead (+__text, __sub, __actions) · .ui-eyebrow · .ui-sectionhead · .ui-section
 *   Aktion    .ui-btn(--primary|--secondary|--ghost|--danger|--on-brand|--on-brand-ghost|--sm) · .ui-iconbtn · .ui-more
 *   Beleg     .ui-source(--draft) – nur über uiSource() erzeugen
 *   Liste     .ui-list > .ui-list__head + .ui-row(.is-link|.is-done|.is-withdrawn) > __lead __main(__meta __title __desc __badges) __trail
 *   Status    .ui-badge--{neutral,info,success,approved,warning,danger,draft,conf,strict} · .ui-count
 *   Filter    .ui-segment · .ui-chips/.ui-chip · .ui-filterbar · .ui-search(--large|--compact)
 *   Inhalt    .ui-card · .ui-hero · .ui-kpis/.ui-kpi · .ui-facts · .ui-toc · .ui-banner--{info,warn,success,danger,draft} · .ui-note · .ui-empty
 *   Weitere   .ui-table · .ui-dialog · .ui-toast · .ui-check · .ui-progress · .ui-alpha · .ui-steps · .ui-field · .ui-form-grid · .ui-date
 */

@layer tokens, base, layout, components, pages, utilities;

/* ===================================================================== tokens */
@layer tokens {
  @font-face{font-family:"Inter";src:url("inter-400.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
  @font-face{font-family:"Inter";src:url("inter-500.woff") format("woff");font-weight:500;font-style:normal;font-display:swap}
  @font-face{font-family:"Inter";src:url("inter-600.woff") format("woff");font-weight:600;font-style:normal;font-display:swap}
  @font-face{font-family:"Inter";src:url("inter-700.woff") format("woff");font-weight:700;font-style:normal;font-display:swap}

  :root{
    color-scheme:light;
    --ui-font:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
    --ui-font-mono:ui-monospace,"SF Mono","Cascadia Mono",Menlo,Consolas,monospace;
    --ui-fs-display:2.5rem;--ui-lh-display:2.75rem;
    --ui-fs-h1:1.875rem;--ui-lh-h1:2.25rem;
    --ui-fs-h2:1.25rem;--ui-lh-h2:1.75rem;
    --ui-fs-h3:1.0625rem;--ui-lh-h3:1.5rem;
    --ui-fs-body:1rem;--ui-lh-body:1.5rem;
    --ui-fs-ui:.9375rem;--ui-lh-ui:1.25rem;
    --ui-fs-small:.875rem;--ui-lh-small:1.25rem;
    --ui-fs-meta:.8125rem;--ui-lh-meta:1.125rem;
    --ui-fs-kpi:1.75rem;--ui-lh-kpi:2rem;

    --ui-gutter:16px;--ui-section-gap:32px;
    --ui-radius-xs:6px;--ui-radius-sm:8px;--ui-radius-md:12px;--ui-radius-lg:16px;--ui-radius-xl:20px;--ui-radius-full:999px;
    --ui-sidebar-w:248px;--ui-rail-w:88px;--ui-topbar-h:56px;--ui-tabbar-h:64px;--ui-content-max:1120px;--ui-measure:75ch;--ui-tap:44px;
    --ui-z-sticky:20;--ui-z-topbar:40;--ui-z-nav:50;--ui-z-menu:60;--ui-z-toast:70;--ui-z-dialog:80;
    --ui-dur-1:120ms;--ui-dur-2:200ms;--ui-dur-3:280ms;
    --ui-ease:cubic-bezier(.2,0,0,1);--ui-ease-out:cubic-bezier(0,0,.2,1);

    --ui-bg:#F3F5F4;--ui-surface:#FFFFFF;--ui-surface-2:#E9EEEB;--ui-surface-hover:#F5F7F6;--ui-surface-active:#EDF1EF;--ui-surface-raised:#FFFFFF;
    --ui-segment-selected:#FFFFFF;--ui-segment-ring:#7D8B85;
    --ui-text:#17211D;--ui-text-2:#4D5A54;--ui-text-3:#5F6C66;--ui-text-disabled:#8A9690;
    --ui-border:#DCE3DF;--ui-border-strong:#7D8B85;--ui-selection:#CFE6DA;

    --ui-primary:#17573F;--ui-primary-hover:#114633;--ui-primary-active:#0C3828;--ui-on-primary:#FFFFFF;
    --ui-primary-soft:#E3F0E9;--ui-primary-soft-hover:#D5E8DE;--ui-on-primary-soft:#114633;
    --ui-link:#17573F;--ui-focus:#2563EB;

    --ui-brand:#123F31;--ui-on-brand:#F3F7F4;--ui-on-brand-2:#C9DCD1;--ui-brand-btn:#D4E4DC;--ui-brand-btn-hover:#FFFFFF;--ui-brand-line:#8FB3A2;--ui-brand-chip:#2F5A4A;--ui-focus-on-brand:#FFFFFF;
    --ui-inverse-bg:#1F2A26;--ui-inverse-text:#F3F7F4;--ui-inverse-action:#8ADBB2;

    --ui-neutral-fg:#46524D;--ui-neutral-bg:#EDF0EE;
    --ui-info-fg:#1D5C8C;--ui-info-bg:#E3EEF7;
    --ui-success-fg:#1C6B42;--ui-success-bg:#E2F2E8;--ui-success-solid:#1E7047;--ui-on-success-solid:#FFFFFF;
    --ui-warning-fg:#7A4E00;--ui-warning-bg:#FCF0D4;--ui-warning-icon:#A86E00;
    --ui-danger-fg:#A3283A;--ui-danger-bg:#FBE6E9;--ui-danger-solid:#B42E41;--ui-on-danger-solid:#FFFFFF;
    --ui-draft-fg:#7A4E00;--ui-draft-bg:#FFF9EB;--ui-draft-border:#A8770F;
    --ui-conf-fg:#6A3C8E;--ui-conf-bg:#F2EAF8;--ui-strict-solid:#5B2D80;--ui-on-strict-solid:#FFFFFF;
    --ui-mark:#FCE9B0;

    --ui-chart-1:#13815A;--ui-chart-2:#2E6BC0;--ui-chart-3:#D47A1C;--ui-chart-4:#C2557D;--ui-chart-prior:#8A9690;
    --ui-chart-grid:#E3E8E5;--ui-chart-axis:#B4BFBA;--ui-chart-label:var(--ui-text-2);--ui-chart-marker:var(--ui-text);

    --ui-shadow-1:0 1px 2px rgb(18 38 30 / .05),0 1px 3px rgb(18 38 30 / .05);
    --ui-shadow-2:0 2px 4px rgb(18 38 30 / .05),0 6px 16px rgb(18 38 30 / .08);
    --ui-shadow-3:0 4px 8px rgb(18 38 30 / .06),0 16px 40px rgb(18 38 30 / .16);
    --ui-select-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234D5A54' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  }
  @media (max-width:767px){:root{--ui-fs-display:2rem;--ui-lh-display:2.25rem;--ui-fs-h1:1.625rem;--ui-lh-h1:2rem;--ui-fs-kpi:1.5rem;--ui-lh-kpi:1.75rem}}
  @media (min-width:768px){:root{--ui-gutter:24px;--ui-topbar-h:64px}}
  @media (min-width:1024px){:root{--ui-gutter:32px;--ui-section-gap:40px}}

  /* Dunkel: automatisch nur mit html[data-theme-auto], manuell mit data-theme="dark". Zwei identische Blöcke. */
  @media (prefers-color-scheme:dark){
    :root[data-theme-auto]:not([data-theme="light"]){
      color-scheme:dark;
      --ui-bg:#0E1412;--ui-surface:#161D1A;--ui-surface-2:#222B27;--ui-surface-hover:#1B2420;--ui-surface-active:#212B27;--ui-surface-raised:#1E2723;--ui-segment-selected:#2E3934;--ui-segment-ring:#8A9992;
      --ui-text:#E6ECE9;--ui-text-2:#A5B1AB;--ui-text-3:#94A09A;--ui-text-disabled:#5F6B66;--ui-border:#27312D;--ui-border-strong:#6E7D76;--ui-selection:#2A4A3B;
      --ui-primary:#6FCF9F;--ui-primary-hover:#8ADBB2;--ui-primary-active:#5BBE8C;--ui-on-primary:#08201A;--ui-primary-soft:#1C3A2D;--ui-primary-soft-hover:#224636;--ui-on-primary-soft:#A9E5C5;--ui-link:#7DD3A8;--ui-focus:#8AB4FF;
      --ui-brand:#123F31;--ui-on-brand:#EAF2ED;--ui-on-brand-2:#C9DCD1;--ui-brand-btn:#D4E4DC;--ui-brand-line:#8FB3A2;--ui-brand-chip:#2F5A4A;
      --ui-inverse-bg:#E6ECE9;--ui-inverse-text:#101614;--ui-inverse-action:#17573F;
      --ui-neutral-fg:#B8C3BE;--ui-neutral-bg:#232C29;--ui-info-fg:#93C3F0;--ui-info-bg:#142838;
      --ui-success-fg:#84D6A6;--ui-success-bg:#16301F;--ui-success-solid:#5BBE87;--ui-on-success-solid:#06180F;
      --ui-warning-fg:#F1C56C;--ui-warning-bg:#33260C;--ui-warning-icon:#F1C56C;
      --ui-danger-fg:#F4A3AE;--ui-danger-bg:#3A1A20;--ui-danger-solid:#EC7C8B;--ui-on-danger-solid:#1F070B;
      --ui-draft-fg:#F1C56C;--ui-draft-bg:#241D0E;--ui-draft-border:#B08A3A;
      --ui-conf-fg:#D3B5F2;--ui-conf-bg:#2B1F38;--ui-strict-solid:#C29BEB;--ui-on-strict-solid:#1B0D2A;--ui-mark:#4A3A12;
      --ui-chart-1:#26976A;--ui-chart-2:#4A84CF;--ui-chart-3:#C2701C;--ui-chart-4:#BB5BA2;--ui-chart-prior:#6E7D76;--ui-chart-grid:#26302C;--ui-chart-axis:#3A4641;
      --ui-shadow-1:0 1px 2px rgb(0 0 0 / .45);--ui-shadow-2:0 2px 4px rgb(0 0 0 / .4),0 8px 20px rgb(0 0 0 / .35);--ui-shadow-3:0 6px 12px rgb(0 0 0 / .45),0 20px 48px rgb(0 0 0 / .5);
      --ui-select-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A5B1AB' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    }
  }
  :root[data-theme="dark"]{
    color-scheme:dark;
    --ui-bg:#0E1412;--ui-surface:#161D1A;--ui-surface-2:#222B27;--ui-surface-hover:#1B2420;--ui-surface-active:#212B27;--ui-surface-raised:#1E2723;--ui-segment-selected:#2E3934;--ui-segment-ring:#8A9992;
    --ui-text:#E6ECE9;--ui-text-2:#A5B1AB;--ui-text-3:#94A09A;--ui-text-disabled:#5F6B66;--ui-border:#27312D;--ui-border-strong:#6E7D76;--ui-selection:#2A4A3B;
    --ui-primary:#6FCF9F;--ui-primary-hover:#8ADBB2;--ui-primary-active:#5BBE8C;--ui-on-primary:#08201A;--ui-primary-soft:#1C3A2D;--ui-primary-soft-hover:#224636;--ui-on-primary-soft:#A9E5C5;--ui-link:#7DD3A8;--ui-focus:#8AB4FF;
    --ui-brand:#123F31;--ui-on-brand:#EAF2ED;--ui-on-brand-2:#C9DCD1;--ui-brand-btn:#D4E4DC;--ui-brand-line:#8FB3A2;--ui-brand-chip:#2F5A4A;
    --ui-inverse-bg:#E6ECE9;--ui-inverse-text:#101614;--ui-inverse-action:#17573F;
    --ui-neutral-fg:#B8C3BE;--ui-neutral-bg:#232C29;--ui-info-fg:#93C3F0;--ui-info-bg:#142838;
    --ui-success-fg:#84D6A6;--ui-success-bg:#16301F;--ui-success-solid:#5BBE87;--ui-on-success-solid:#06180F;
    --ui-warning-fg:#F1C56C;--ui-warning-bg:#33260C;--ui-warning-icon:#F1C56C;
    --ui-danger-fg:#F4A3AE;--ui-danger-bg:#3A1A20;--ui-danger-solid:#EC7C8B;--ui-on-danger-solid:#1F070B;
    --ui-draft-fg:#F1C56C;--ui-draft-bg:#241D0E;--ui-draft-border:#B08A3A;
    --ui-conf-fg:#D3B5F2;--ui-conf-bg:#2B1F38;--ui-strict-solid:#C29BEB;--ui-on-strict-solid:#1B0D2A;--ui-mark:#4A3A12;
    --ui-chart-1:#26976A;--ui-chart-2:#4A84CF;--ui-chart-3:#C2701C;--ui-chart-4:#BB5BA2;--ui-chart-prior:#6E7D76;--ui-chart-grid:#26302C;--ui-chart-axis:#3A4641;
    --ui-shadow-1:0 1px 2px rgb(0 0 0 / .45);--ui-shadow-2:0 2px 4px rgb(0 0 0 / .4),0 8px 20px rgb(0 0 0 / .35);--ui-shadow-3:0 6px 12px rgb(0 0 0 / .45),0 20px 48px rgb(0 0 0 / .5);
    --ui-select-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A5B1AB' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  }

}

/* ===================================================================== base */
@layer base {
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--ui-topbar-h) + 16px);scroll-padding-bottom:calc(var(--ui-tabbar-h) + env(safe-area-inset-bottom) + 24px)}
  @media (min-width:768px){html{scroll-padding-bottom:24px}}
  body.ui-app{margin:0;background:var(--ui-bg);color:var(--ui-text);font-family:var(--ui-font);font-size:var(--ui-fs-body);line-height:var(--ui-lh-body);font-variant-numeric:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
  ::selection{background:var(--ui-selection)}
  :focus-visible{outline:2px solid var(--ui-focus);outline-offset:2px}

  /* Elementstile nur auf umgestellten Seiten, damit Altseiten unberührt bleiben. */
  .ui25 *,.ui25 *::before,.ui25 *::after{box-sizing:border-box}
  .ui25 :where(h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote){margin:0}
  .ui25 :where(h1){font-size:var(--ui-fs-h1);line-height:var(--ui-lh-h1);font-weight:700;letter-spacing:-.02em;text-wrap:balance}
  .ui25 :where(h2){font-size:var(--ui-fs-h2);line-height:var(--ui-lh-h2);font-weight:650;letter-spacing:-.01em}
  .ui25 :where(h3){font-size:var(--ui-fs-h3);line-height:var(--ui-lh-h3);font-weight:650}
  .ui25 :where(h4){font-size:var(--ui-fs-ui);line-height:var(--ui-lh-ui);font-weight:600}
  .ui25 :where(a){color:var(--ui-link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
  @media (hover:hover){.ui25 :where(a):hover{text-decoration-thickness:2px}}
  .ui25 :where(ul,ol){padding-left:1.25em}
  .ui25 :where(img,svg){max-width:100%}
  .ui25 :where(img){height:auto}
  .ui25 :where(button,input,select,textarea){font:inherit;color:inherit}
  .ui25 :where(small){font-size:var(--ui-fs-meta);line-height:var(--ui-lh-meta)}
  .ui25 :where(strong,b){font-weight:600}
  .ui25 :where(mark){background:var(--ui-mark);color:var(--ui-text);border-radius:3px;padding:0 2px}
  .ui25 :where(hr){border:0;border-top:1px solid var(--ui-border);margin:var(--ui-space-6,24px) 0}
  .ui25 :where(code,kbd){font-family:var(--ui-font-mono);font-size:.875em}
  .ui25 :where(table){border-collapse:collapse}
  .ui25 [hidden]{display:none!important}
  @media print{.ui25 [hidden].is-beyond-preview{display:revert!important}}

  .sr-only,.v2-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}
  .skip-link{position:fixed;left:12px;top:12px;z-index:100;transform:translateY(-200%);padding:10px 16px;border-radius:var(--ui-radius-md);background:var(--ui-surface);color:var(--ui-text);font:600 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font);text-decoration:none;box-shadow:var(--ui-shadow-3);border:2px solid var(--ui-focus)}
  .skip-link:focus,.skip-link:focus-visible{transform:none;outline:none}
  @media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
}

/* ===================================================================== layout */
@layer layout {
  .ui-icon{width:22px;height:22px;flex:none;display:inline-block;vertical-align:middle}

  /* Seitenleiste ≥1024 · Icon-Rail 768–1023 · aus <768 */
  .ui-sidebar{display:none}
  @media (min-width:768px){
    body.ui-app{padding-left:var(--ui-rail-w)}
    .ui-sidebar{display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;z-index:var(--ui-z-nav);width:var(--ui-rail-w);background:var(--ui-surface);border-right:1px solid var(--ui-border);padding:0 8px 16px;overflow-y:auto;overscroll-behavior:contain}
    .ui-sidebar__brand{display:flex;align-items:center;justify-content:center;height:64px;flex:none;color:var(--ui-text);text-decoration:none;border-radius:var(--ui-radius-md)}
    .ui-sidebar__brand img{width:32px;height:32px;border-radius:8px}
    .ui-sidebar__brand span{display:none}
    .ui-sidebar__nav{display:grid;gap:4px}
    .ui-sidebar__nav a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:72px;min-height:56px;margin:0 auto;padding:4px 0;border-radius:var(--ui-radius-md);color:var(--ui-text-2);text-decoration:none;font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);text-align:center}
    .ui-sidebar__nav a .ui-icon{width:24px;height:24px;padding:0;box-sizing:content-box;border-radius:999px;padding:4px 16px;transition:background-color var(--ui-dur-1) var(--ui-ease)}
    .ui-sidebar__nav a[aria-current="page"]{color:var(--ui-on-primary-soft);font-weight:650}
    .ui-sidebar__nav a[aria-current="page"] .ui-icon{background:var(--ui-primary-soft);color:var(--ui-primary)}
    @media (hover:hover){.ui-sidebar__nav a:not([aria-current]):hover .ui-icon{background:var(--ui-surface-hover)}.ui-sidebar__nav a:hover{color:var(--ui-text)}}
    .ui-sidebar__nav a:focus-visible{outline-offset:-2px}
    .ui-sidebar__nav .ui-count{position:absolute;top:2px;right:6px;min-width:20px;height:20px;line-height:20px;font-size:12px;padding:0 5px}
    .ui-sidebar__label,.ui-sidebar__nav--secondary{display:none}
  }
  @media (min-width:1024px){
    body.ui-app{padding-left:var(--ui-sidebar-w)}
    .ui-sidebar{width:var(--ui-sidebar-w);padding:0 12px 16px}
    .ui-sidebar__brand{justify-content:flex-start;gap:12px;padding:0 12px;margin-bottom:8px}
    .ui-sidebar__brand span{display:grid}
    .ui-sidebar__brand strong{font:650 var(--ui-fs-ui)/1.2 var(--ui-font)}
    .ui-sidebar__brand small{font:400 var(--ui-fs-meta)/1.3 var(--ui-font);color:var(--ui-text-2)}
    .ui-sidebar__nav{gap:2px}
    .ui-sidebar__nav a{flex-direction:row;justify-content:flex-start;gap:12px;width:auto;min-height:44px;margin:0;padding:0 12px;font:500 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font);color:var(--ui-text);text-align:left}
    .ui-sidebar__nav a .ui-icon{width:22px;height:22px;padding:0;color:var(--ui-text-2);background:none!important}
    .ui-sidebar__nav a[aria-current="page"]{background:var(--ui-primary-soft);color:var(--ui-on-primary-soft)}
    .ui-sidebar__nav a[aria-current="page"] .ui-icon{color:var(--ui-primary)}
    @media (hover:hover){.ui-sidebar__nav a:not([aria-current]):hover{background:var(--ui-surface-hover)}}
    .ui-sidebar__nav .ui-count{position:static;margin-left:auto}
    .ui-sidebar__nav a[aria-current="page"] .ui-count{background:var(--ui-surface);color:var(--ui-on-primary-soft)}
    .ui-sidebar__label{display:block;margin:20px 12px 6px;font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
    .ui-sidebar__nav--secondary{display:grid}
    .ui-sidebar__foot{margin-top:auto;padding:16px 12px 0;font:400 12px/1.4 var(--ui-font);color:var(--ui-text-3)}
  }
  .ui-sidebar__foot{display:none}
  @media (min-width:1024px){.ui-sidebar__foot{display:block}}

  /* Kopfzeile */
  .ui-topbar{position:sticky;top:0;z-index:var(--ui-z-topbar);display:flex;align-items:center;gap:8px;min-height:var(--ui-topbar-h);padding:env(safe-area-inset-top) max(var(--ui-gutter),env(safe-area-inset-right)) 0 max(var(--ui-gutter),env(safe-area-inset-left));background:var(--ui-bg);border-bottom:1px solid var(--ui-border)}
  @supports (backdrop-filter:blur(12px)){@media (min-width:768px){.ui-topbar{background:color-mix(in srgb,var(--ui-bg) 88%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}}}
  .ui-topbar__brand{display:flex;align-items:center;gap:10px;min-height:44px;color:var(--ui-text);text-decoration:none;font:650 1.0625rem/1.2 var(--ui-font);min-width:0}
  .ui-topbar__brand img{width:28px;height:28px;border-radius:7px}
  @media (min-width:768px){.ui-topbar__brand{display:none}}
  .ui-topbar__back{display:inline-flex;align-items:center;gap:2px;min-height:44px;margin-left:-8px;padding:0 8px 0 2px;border-radius:var(--ui-radius-md);color:var(--ui-link);text-decoration:none;font:600 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font);min-width:0}
  .ui-topbar__back span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ui-topbar__back .ui-icon{width:20px;height:20px}
  @media (hover:hover){.ui-topbar__back:hover{background:var(--ui-primary-soft)}}
  .ui-topbar__spacer{flex:1 1 auto}
  .ui-topbar__search{display:none!important}
  @media (min-width:1024px){.ui-topbar__search{display:flex!important;flex:0 1 440px}.ui-topbar__searchbtn{display:none!important}}
  .ui-topbar__upload{display:none!important}
  @media (min-width:1024px){.ui-topbar__upload{display:inline-flex!important}}

  /* Profilmenü (bleibt <details>, es ist ein Menü) */
  .ui-profile{position:relative}
  .ui-profile>summary{list-style:none;display:grid;place-items:center;width:44px;height:44px;border-radius:999px;cursor:pointer}
  .ui-profile>summary::-webkit-details-marker{display:none}
  .ui-profile>summary span{display:grid;place-items:center;width:36px;height:36px;border-radius:999px;background:var(--ui-primary);color:var(--ui-on-primary);font:650 var(--ui-fs-meta)/1 var(--ui-font);letter-spacing:.02em}
  .ui-profile>summary:focus-visible{outline-offset:0}
  .ui-profile__menu{position:absolute;right:0;top:calc(100% + 6px);z-index:var(--ui-z-menu);display:grid;gap:2px;min-width:260px;padding:8px;background:var(--ui-surface-raised);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-3)}
  .ui-profile__menu>strong{display:block;padding:8px 12px 4px;font:650 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font)}
  .ui-profile__menu>small{display:block;padding:0 12px 8px;color:var(--ui-text-2);font-size:var(--ui-fs-meta)}
  .ui-profile__menu a,.ui-profile__menu button{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:0 12px;border:0;border-radius:10px;background:none;color:var(--ui-text);font:500 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font);text-decoration:none;text-align:left;cursor:pointer}
  .ui-profile__menu .ui-icon{width:20px;height:20px;color:var(--ui-text-2)}
  @media (hover:hover){.ui-profile__menu a:hover,.ui-profile__menu button:hover{background:var(--ui-surface-hover)}}
  .ui-profile__menu form{margin:0}
  .ui-profile__menu hr{border:0;border-top:1px solid var(--ui-border);margin:6px 4px}
  .ui-profile__theme{display:grid;gap:6px;padding:6px 12px 10px}
  .ui-profile__theme>span{font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-profile__version{padding:6px 12px 4px;font:400 12px/1.4 var(--ui-font);color:var(--ui-text-3)}

  /* Tableiste <768 */
  .ui-tabbar{position:fixed;inset:auto 0 0;z-index:var(--ui-z-nav);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));height:calc(var(--ui-tabbar-h) + env(safe-area-inset-bottom));padding:6px max(2px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(2px,env(safe-area-inset-left));background:var(--ui-surface);border-top:1px solid var(--ui-border)}
  .ui-tabbar a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:0;color:var(--ui-text-2);text-decoration:none;font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);border-radius:var(--ui-radius-md)}
  .ui-tabbar a span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ui-tabbar .ui-icon{width:24px;height:24px;box-sizing:content-box;padding:3px 16px;border-radius:999px}
  .ui-tabbar a[aria-current="page"]{color:var(--ui-text);font-weight:600}
  .ui-tabbar a span{letter-spacing:-.01em}
  .ui-tabbar a[aria-current="page"] .ui-icon{background:var(--ui-primary-soft);color:var(--ui-primary)}
  .ui-tabbar a:focus-visible{outline-offset:-2px}
  .ui-tabbar .ui-count{position:absolute;top:0;left:calc(50% + 6px);min-width:18px;height:18px;padding:0 5px;line-height:18px;font-size:11.5px;background:var(--ui-primary);color:var(--ui-on-primary)}
  body.ui-app{padding-bottom:calc(var(--ui-tabbar-h) + env(safe-area-inset-bottom))}
  @media (min-width:768px){.ui-tabbar{display:none}body.ui-app{padding-bottom:0}}

  /* Inhalt */
  .ui-main{display:block;width:100%;max-width:var(--ui-content-max);margin:0 auto;padding:24px max(var(--ui-gutter),env(safe-area-inset-right)) 48px max(var(--ui-gutter),env(safe-area-inset-left));min-width:0}
  @media (min-width:1024px){.ui-main{padding-top:32px;padding-bottom:64px}}
  .ui-main>*+*{margin-top:var(--ui-section-gap)}
  .ui-main>.ui-pagehead+*{margin-top:24px}
  .ui-main>[hidden]+*{margin-top:var(--ui-section-gap)}
  .ui-stack{display:grid;gap:16px}
  .ui-stack--tight{display:grid;gap:8px}
  .ui-grid-2{display:grid;gap:16px}
  @media (min-width:768px){.ui-grid-2{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}}
  .ui-split{display:grid;gap:var(--ui-section-gap)}
  @media (min-width:1024px){.ui-split{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:24px;align-items:start}}
  .ui-split>*{min-width:0}
  .ui-split>*>*+*{margin-top:var(--ui-section-gap)}
  .ui-detail{display:grid;gap:var(--ui-section-gap)}
  .ui-detail>*{min-width:0}
  .ui-detail__main>*+*{margin-top:var(--ui-section-gap)}
  .ui-detail__aside>*+*{margin-top:16px}
  @media (min-width:1280px){.ui-detail{grid-template-columns:minmax(0,1fr) 300px;gap:32px;align-items:start}.ui-detail__aside{position:sticky;top:calc(var(--ui-topbar-h) + 16px);order:2}}

  /* Seitenkopf */
  .ui-pagehead{display:grid;gap:16px;align-items:end}
  .ui-pagehead__text{display:grid;gap:8px;min-width:0}
  .ui-pagehead__text>.ui-eyebrow{margin-bottom:-4px}
  .ui-pagehead h1{font-size:var(--ui-fs-h1);line-height:var(--ui-lh-h1);font-weight:700;letter-spacing:-.02em;margin:0;overflow-wrap:anywhere}
  .ui-pagehead__sub{margin:0;font-size:var(--ui-fs-body);line-height:var(--ui-lh-body);color:var(--ui-text-2);max-width:var(--ui-measure)}
  .ui-pagehead__actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
  @media (min-width:768px){.ui-pagehead{grid-template-columns:minmax(0,1fr) auto}.ui-pagehead__actions{justify-content:flex-end}}
  .ui-eyebrow{margin:0;font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2);letter-spacing:0;text-transform:none}

  /* Abschnitte */
  .ui-section{display:block;min-width:0}
  .ui-section>*+*{margin-top:12px}
  .ui-sectionhead{display:flex;align-items:center;justify-content:space-between;gap:8px 12px;flex-wrap:wrap;margin:0 0 12px}
  .ui-section>.ui-sectionhead{margin-bottom:0}
  .ui-sectionhead h2{display:flex;align-items:center;gap:8px;margin:0;font-size:var(--ui-fs-h2);line-height:var(--ui-lh-h2);font-weight:650;letter-spacing:-.01em}
  .ui-sectionhead p{flex-basis:100%;margin:0;color:var(--ui-text-2);font-size:var(--ui-fs-small);line-height:var(--ui-lh-small)}
}

/* ===================================================================== components */
@layer components {
  /* Buttons */
  .ui-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border:1px solid transparent;border-radius:var(--ui-radius-md);font:600 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font);text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color var(--ui-dur-1) var(--ui-ease),border-color var(--ui-dur-1),color var(--ui-dur-1),box-shadow var(--ui-dur-1);-webkit-tap-highlight-color:transparent}
  .ui-btn .ui-icon{width:20px;height:20px}
  .ui-btn--primary{background:var(--ui-primary);color:var(--ui-on-primary)}
  .ui-btn--primary:active{background:var(--ui-primary-active)}
  .ui-btn--secondary{background:var(--ui-surface);border-color:var(--ui-border-strong);color:var(--ui-text)}
  .ui-btn--secondary:active{background:var(--ui-surface-active)}
  .ui-btn--ghost{background:transparent;color:var(--ui-link);padding:0 12px}
  .ui-btn--ghost:active{background:var(--ui-primary-soft-hover)}
  .ui-btn--danger{background:transparent;color:var(--ui-danger-fg);border-color:color-mix(in srgb,var(--ui-danger-fg) 40%,transparent)}
  .ui-btn--danger:active{background:var(--ui-danger-bg);border-color:var(--ui-danger-fg)}
  .ui-btn--on-brand{background:var(--ui-brand-btn);color:var(--ui-brand)}
  .ui-btn--on-brand-ghost{background:transparent;border-color:var(--ui-brand-line);color:var(--ui-on-brand)}
  .ui-btn--on-brand:focus-visible,.ui-btn--on-brand-ghost:focus-visible{outline-color:var(--ui-focus-on-brand)}
  @media (hover:hover){
    .ui-btn--primary:hover{background:var(--ui-primary-hover)}
    .ui-btn--secondary:hover{background:var(--ui-surface-hover)}
    .ui-btn--ghost:hover{background:var(--ui-primary-soft)}
    .ui-btn--danger:hover{background:var(--ui-danger-bg)}
    .ui-btn--on-brand:hover{background:var(--ui-brand-btn-hover)}
    .ui-btn--on-brand-ghost:hover{background:rgb(255 255 255 / .08)}
  }
  .ui-btn:disabled,.ui-btn[aria-disabled="true"]{background:var(--ui-surface-2);border-color:transparent;color:var(--ui-text-disabled);cursor:not-allowed}
  .ui-btn--ghost:disabled,.ui-btn--danger:disabled{background:transparent}
  @media (pointer:fine){.ui-btn--sm{min-height:36px;padding:0 14px}}
  .ui-btn--block{width:100%}
  .ui-iconbtn{display:inline-grid;place-items:center;width:44px;height:44px;flex:none;padding:0;border:0;border-radius:var(--ui-radius-md);background:transparent;color:var(--ui-text-2);cursor:pointer;text-decoration:none}
  @media (hover:hover){.ui-iconbtn:hover{background:var(--ui-surface-hover);color:var(--ui-text)}}
  .ui-iconbtn[aria-current="page"]{background:var(--ui-primary-soft);color:var(--ui-primary)}
  .ui-iconbtn[aria-disabled="true"]{color:var(--ui-text-disabled);pointer-events:none}

  /* Navigationslink „Alle anzeigen ›“ */
  .ui-more{display:inline-flex;align-items:center;gap:2px;min-height:44px;color:var(--ui-link);font:600 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);text-decoration:none;white-space:nowrap}
  .ui-more .ui-icon{width:16px;height:16px}
  @media (hover:hover){.ui-more:hover{text-decoration:underline;text-underline-offset:3px}}
  .ui-more--sm{min-height:32px;font-size:var(--ui-fs-meta)}
  .ui-link{color:var(--ui-link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}

  /* Beleg-Chip */
  .ui-source{position:relative;display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px;border:1px solid transparent;border-radius:var(--ui-radius-sm);background:var(--ui-primary-soft);color:var(--ui-on-primary-soft);font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);font-variant-numeric:tabular-nums;text-decoration:none;white-space:nowrap;flex:none}
  .ui-source::before{content:"";position:absolute;inset:-6px -2px}
  .ui-source .ui-icon{width:16px;height:16px}
  @media (hover:hover){.ui-source:hover{background:var(--ui-primary-soft-hover)}}
  .ui-source:active{background:var(--ui-primary-soft-hover);box-shadow:inset 0 0 0 1px var(--ui-primary)}
  .ui-source--draft{background:transparent;border:1px dashed var(--ui-draft-border);color:var(--ui-draft-fg)}
  @media (hover:hover){.ui-source--draft:hover{background:var(--ui-draft-bg)}}

  /* Karten */
  .ui-card{display:block;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-1);padding:16px;color:var(--ui-text);min-width:0}
  @media (min-width:768px){.ui-card{padding:20px}}
  @media (min-width:1024px){.ui-card{padding:24px}}
  .ui-card>*+*{margin-top:12px}
  a.ui-card{position:relative;text-decoration:none;transition:box-shadow var(--ui-dur-1) var(--ui-ease),border-color var(--ui-dur-1)}
  @media (hover:hover){a.ui-card:hover{box-shadow:var(--ui-shadow-2);border-color:var(--ui-border-strong)}}
  a.ui-card:active{background:var(--ui-surface-active)}
  .ui-card__chevron{position:absolute;top:16px;right:16px;width:16px!important;height:16px!important;color:var(--ui-text-3)}
  .ui-hero{position:relative;display:grid;gap:12px;padding:20px;border-radius:var(--ui-radius-xl);background:var(--ui-brand);color:var(--ui-on-brand)}
  @media (min-width:1024px){.ui-hero{padding:28px}}
  .ui-hero :focus-visible{outline-color:var(--ui-focus-on-brand)}
  .ui-hero__eyebrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-on-brand-2)}
  .ui-hero__chip{display:inline-flex;align-items:center;min-height:24px;padding:2px 8px;border-radius:var(--ui-radius-xs);background:var(--ui-brand-chip);color:var(--ui-on-brand);font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font)}
  .ui-hero__title{margin:0;font:700 var(--ui-fs-display)/var(--ui-lh-display) var(--ui-font);letter-spacing:-.025em;color:var(--ui-on-brand)}
  .ui-hero__title a{color:inherit;text-decoration:none}
  .ui-hero__meta{display:flex;flex-wrap:wrap;gap:4px 16px;margin:0;color:var(--ui-on-brand-2);font:500 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font)}
  .ui-hero__meta span{display:inline-flex;align-items:center;gap:6px}
  .ui-hero__meta .ui-icon{width:18px;height:18px}
  .ui-hero__text{margin:0;color:var(--ui-on-brand);max-width:60ch}
  .ui-hero__actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}

  /* Listen und Zeilen */
  .ui-list{display:block;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-1);overflow:hidden;min-width:0;padding:0;list-style:none}
  .ui-list__head{display:flex;align-items:center;gap:6px 12px;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid var(--ui-border);background:var(--ui-surface)}
  @media (min-width:768px){.ui-list__head{padding:12px 20px}}
  .ui-list__head h2,.ui-list__head h3{margin:0;font:650 var(--ui-fs-h3)/var(--ui-lh-h3) var(--ui-font);letter-spacing:0}
  .ui-list__head h2 a,.ui-list__head h3 a{color:inherit;text-decoration:none}
  @media (hover:hover){.ui-list__head h2 a:hover,.ui-list__head h3 a:hover{text-decoration:underline}}
  .ui-list__head p,.ui-list__head>span:not(.ui-badge){margin:0;font:400 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-list__head .ui-more{margin-left:auto;min-height:32px}
  .ui-row{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;align-items:start;padding:14px 16px;background:var(--ui-surface);margin:0;list-style:none}
  @media (min-width:768px){.ui-row{padding:16px 20px}}
  .ui-row:has(>.ui-row__lead){grid-template-columns:auto minmax(0,1fr) auto}
  .ui-row:not(:has(>.ui-row__trail)){grid-template-columns:minmax(0,1fr)}
  .ui-row:has(>.ui-row__lead):not(:has(>.ui-row__trail)){grid-template-columns:auto minmax(0,1fr)}
  .ui-row+.ui-row,.ui-row+.ui-row--more,.ui-list__head+.ui-row{border-top:1px solid var(--ui-border)}
  .ui-list__head+.ui-row{border-top:0}
  .ui-row__lead{display:flex;align-items:flex-start}
  .ui-row__main{display:grid;gap:2px;min-width:0;align-content:start}
  .ui-row__main>*{max-width:var(--ui-measure)}
  .ui-row__meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:0;font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-row__title{margin:0;font:600 var(--ui-fs-body)/var(--ui-lh-body) var(--ui-font);color:var(--ui-text);overflow-wrap:anywhere;letter-spacing:0}
  .ui-row__title--text{font-weight:400}
  .ui-row__title a{color:inherit;text-decoration:none}
  @media (hover:hover){.ui-row__title a:hover{text-decoration:underline;text-underline-offset:3px}}
  .ui-row__desc{margin:0;font:400 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);color:var(--ui-text-2);overflow-wrap:anywhere}
  .ui-row__desc a{color:var(--ui-link)}
  .ui-row__badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
  .ui-row__badges:empty{display:none}
  .ui-row__actions{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin-top:4px}
  .ui-row__trail{display:flex;flex-direction:column;align-items:flex-end;gap:4px;padding-top:0}
  @media (max-width:519px){
    .ui-row:not(.is-link):has(>.ui-row__lead):has(>.ui-row__trail .ui-source){grid-template-columns:auto minmax(0,1fr)}
    .ui-row:not(.is-link):has(>.ui-row__lead)>.ui-row__trail:has(.ui-source){grid-column:2;flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 16px;margin-top:10px}
  }
  .ui-row__chevron{width:16px!important;height:16px!important;color:var(--ui-text-3);margin-top:4px;transition:transform var(--ui-dur-1) var(--ui-ease)}
  /* ganze Zeile als Link: Titel-Link wird gestreckt, weitere Elemente liegen darüber */
  .ui-row.is-link .ui-row__title a::after{content:"";position:absolute;inset:0;z-index:0}
  .ui-row.is-link :is(.ui-source,.ui-row__trail a,.ui-row__desc a,.ui-row__actions a,button,input,label){position:relative;z-index:1}
  .ui-row.is-link .ui-row__title a:focus-visible{outline:none}
  .ui-row.is-link:has(.ui-row__title a:focus-visible){outline:2px solid var(--ui-focus);outline-offset:-2px}
  @media (hover:hover){.ui-row.is-link:hover{background:var(--ui-surface-hover)}.ui-row.is-link:hover .ui-row__title a{text-decoration:none}}
  @media (hover:hover) and (prefers-reduced-motion:no-preference){.ui-row.is-link:hover .ui-row__chevron{transform:translateX(2px)}}
  .ui-row.is-link:active{background:var(--ui-surface-active)}
  .ui-row.is-done .ui-row__title{color:var(--ui-text-2)}
  .ui-row.is-withdrawn .ui-row__title{color:var(--ui-text-3);text-decoration:line-through}
  .ui-row.is-saving{cursor:progress}
  .ui-row.is-target{animation:ui-target 1.6s var(--ui-ease-out)}
  @keyframes ui-target{0%{background:var(--ui-primary-soft)}100%{background:var(--ui-surface)}}
  .ui-row--more{display:flex;justify-content:center;padding:4px 16px;background:var(--ui-surface)}
  .ui-row--empty{padding:16px;color:var(--ui-text-2);font-size:var(--ui-fs-small)}
  .ui-row__feedback{font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-row__feedback:empty{display:none}
  .ui-row__feedback button{margin-left:8px}
  .ui-row__num{width:40px;font:600 var(--ui-fs-meta)/var(--ui-lh-body) var(--ui-font);font-variant-numeric:tabular-nums;color:var(--ui-text-2)}

  /* Datumsblock */
  .ui-date{display:grid;align-content:start;width:56px;margin-right:4px}
  .ui-date b{font:700 1.25rem/1.5rem var(--ui-font);font-variant-numeric:tabular-nums;color:var(--ui-text);letter-spacing:-.01em}
  .ui-date small{font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2);white-space:nowrap}
  .ui-avatar{display:grid;place-items:center;width:36px;height:36px;border-radius:999px;background:var(--ui-surface-2);color:var(--ui-text-2);font:650 var(--ui-fs-meta)/1 var(--ui-font)}
  .ui-lead-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--ui-radius-md);background:var(--ui-primary-soft);color:var(--ui-primary)}
  .ui-lead-icon .ui-icon{width:22px;height:22px}

  /* Badges und Zähler */
  .ui-badge{display:inline-flex;align-items:center;gap:4px;min-height:24px;padding:2px 8px;border:1px solid transparent;border-radius:var(--ui-radius-xs);font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);white-space:nowrap;letter-spacing:0;text-transform:none;vertical-align:middle}
  .ui-badge .ui-icon{width:14px;height:14px;stroke-width:2}
  .ui-badge--neutral{background:var(--ui-neutral-bg);color:var(--ui-neutral-fg)}
  .ui-badge--info{background:var(--ui-info-bg);color:var(--ui-info-fg)}
  .ui-badge--success{background:var(--ui-success-bg);color:var(--ui-success-fg)}
  .ui-badge--approved{background:var(--ui-success-solid);color:var(--ui-on-success-solid)}
  .ui-badge--warning{background:var(--ui-warning-bg);color:var(--ui-warning-fg)}
  .ui-badge--warning .ui-icon{color:var(--ui-warning-icon)}
  .ui-badge--danger{background:var(--ui-danger-bg);color:var(--ui-danger-fg)}
  .ui-badge--draft{background:var(--ui-draft-bg);color:var(--ui-draft-fg);border:1px dashed var(--ui-draft-border)}
  .ui-badge--conf{background:var(--ui-conf-bg);color:var(--ui-conf-fg)}
  .ui-badge--strict{background:var(--ui-strict-solid);color:var(--ui-on-strict-solid)}
  .ui-count{display:inline-block;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--ui-surface-2);color:var(--ui-text-2);font:600 var(--ui-fs-meta)/22px var(--ui-font);font-variant-numeric:tabular-nums;text-align:center;letter-spacing:0}
  .ui-sectionhead h2 .ui-count,.ui-list__head .ui-count{vertical-align:2px}

  /* Segment */
  .ui-segment{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px;padding:4px;background:var(--ui-surface-2);border-radius:var(--ui-radius-md);max-width:100%}
  .ui-segment a,.ui-segment button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;min-width:0;padding:0 12px;border:0;border-radius:9px;background:transparent;color:var(--ui-text-2);font:600 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font);text-decoration:none;text-align:center;cursor:pointer}
  .ui-segment a span{overflow:hidden;text-overflow:ellipsis}
  .ui-segment [aria-current="page"],.ui-segment [aria-pressed="true"]{background:var(--ui-segment-selected);color:var(--ui-text);box-shadow:0 0 0 1px var(--ui-segment-ring),var(--ui-shadow-1)}
  .ui-segment [aria-current="page"] .ui-count{background:var(--ui-primary-soft);color:var(--ui-on-primary-soft)}
  @media (hover:hover){.ui-segment a:not([aria-current]):hover{color:var(--ui-text);background:rgb(255 255 255 / .55)}}
  :root[data-theme="dark"] .ui-segment a:not([aria-current]):hover{background:rgb(255 255 255 / .04)}
  @media (max-width:420px){.ui-segment a{flex-direction:column;gap:2px;padding:6px 6px;font-size:var(--ui-fs-small)}.ui-segment .ui-count{height:18px;line-height:18px;font-size:12px}}
  @media (max-width:479px){.ui-segment:has(>:nth-child(4)){grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr))}.ui-segment:has(>:nth-child(4)) a{flex-direction:row}}
  @media (min-width:768px){.ui-segment--inline{display:inline-grid}}

  /* Filterchips */
  .ui-chips{display:flex;flex-wrap:wrap;gap:8px;padding:0;list-style:none}
  .ui-chip{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border:1px solid var(--ui-border-strong);border-radius:999px;background:var(--ui-surface);color:var(--ui-text);font:500 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font);text-decoration:none;white-space:nowrap;cursor:pointer}
  @media (pointer:coarse){.ui-chip{min-height:44px}}
  .ui-chip small,.ui-chip .ui-chip__count{font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-chip .ui-icon{width:16px;height:16px}
  .ui-chip[aria-current="page"],.ui-chip[aria-current="true"],.ui-chip[aria-pressed="true"],.ui-chip.is-active{background:var(--ui-primary);border-color:var(--ui-primary);color:var(--ui-on-primary)}
  .ui-chip[aria-current] small,.ui-chip[aria-current] .ui-chip__count,.ui-chip[aria-pressed="true"] small,.ui-chip.is-active small{color:var(--ui-on-primary)}
  @media (hover:hover){.ui-chip:not([aria-current]):not([aria-pressed="true"]):not(.is-active):hover{background:var(--ui-surface-hover)}}
  .ui-chip:active{background:var(--ui-surface-active)}
  .ui-chip.is-empty{border-color:var(--ui-border);color:var(--ui-text-2)}
  .ui-chips--label{align-items:center}
  .ui-chips__label{font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2);margin-right:4px}

  /* Filterleiste */
  .ui-filterbar{display:grid;gap:12px}
  .ui-filterbar__row{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:flex-end}
  .ui-filterbar__row>.ui-field{flex:1 1 180px;min-width:0}
  .ui-filterbar__row>.ui-field--grow{flex:3 1 260px}
  .ui-filterbar__result{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin:0;font:500 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);color:var(--ui-text-2)}
  .ui-filterbar__result strong{color:var(--ui-text)}

  /* Formularfelder */
  .ui-field{display:grid;gap:6px;min-width:0}
  .ui-field>span,.ui-label{font:600 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);color:var(--ui-text)}
  .ui-hint{font:400 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-error-text{margin:0;display:flex;gap:6px;align-items:center;font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-danger-fg)}
  .ui-input,.ui-field :is(input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),select,textarea),.ui-search input{width:100%;min-height:48px;padding:11px 14px;border:1px solid var(--ui-border-strong);border-radius:var(--ui-radius-md);background:var(--ui-surface);color:var(--ui-text);font:400 16px/24px var(--ui-font);transition:border-color var(--ui-dur-1)}
  .ui-field textarea{min-height:120px;resize:vertical}
  .ui-field :is(input[type=date],input[type=time],input[type=month]){height:48px}
  @media (min-width:1024px) and (pointer:fine){.ui-field :is(input[type=date],input[type=time],input[type=month]){height:44px}}
  .ui-field select,select.ui-input{appearance:none;-webkit-appearance:none;padding-right:40px;background-image:var(--ui-select-chevron);background-repeat:no-repeat;background-position:right 12px center;background-size:18px}
  @media (min-width:1024px) and (pointer:fine){.ui-input,.ui-field :is(input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),select){min-height:44px;padding-top:9px;padding-bottom:9px}}
  ::placeholder{color:var(--ui-text-3);opacity:1}
  @media (hover:hover){.ui-input:hover,.ui-field :is(input,select,textarea):hover{border-color:var(--ui-text-2)}}
  .ui-input:focus,.ui-field :is(input,select,textarea):focus,.ui-search input:focus{border-color:var(--ui-primary);outline:2px solid var(--ui-focus);outline-offset:1px}
  .ui-field [aria-invalid="true"]{border-color:var(--ui-danger-fg)}
  .ui-field :is(input,select,textarea):disabled{background:var(--ui-surface-2);color:var(--ui-text-disabled);border-color:var(--ui-border)}
  .ui-checkline{display:flex;align-items:flex-start;gap:10px;min-height:44px;padding-top:10px;font:400 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font);cursor:pointer}
  .ui-checkline input{width:20px;height:20px;margin:0;accent-color:var(--ui-primary);flex:none}
  .ui-form-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}
  .ui-form{display:grid;gap:16px}
  .ui-form__actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;align-items:center}
  @media (max-width:767px){.ui-form__actions{flex-direction:column-reverse;align-items:stretch}.ui-form__actions .ui-btn{width:100%}}
  .ui-dropzone{display:grid;justify-items:center;align-content:center;gap:8px;min-height:160px;padding:24px 16px;border:2px dashed var(--ui-border-strong);border-radius:var(--ui-radius-lg);background:var(--ui-surface);text-align:center;cursor:pointer}
  .ui-dropzone .ui-icon{width:32px;height:32px;color:var(--ui-primary)}
  .ui-dropzone strong{font:600 var(--ui-fs-body)/var(--ui-lh-body) var(--ui-font)}
  .ui-dropzone.is-dragover,.ui-dropzone:focus-within{border-color:var(--ui-primary);background:var(--ui-primary-soft)}

  /* Abhaken */
  .ui-check{position:relative;display:inline-grid;place-items:center;width:44px;height:44px;margin:-6px 0 0 -10px;flex:none;cursor:pointer}
  .ui-check input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:2}
  .ui-check>span{display:grid;place-items:center;width:28px;height:28px;border:2px solid var(--ui-border-strong);border-radius:999px;background:var(--ui-surface);color:transparent;transition:background-color var(--ui-dur-1),border-color var(--ui-dur-1)}
  .ui-check>span .ui-icon{width:18px;height:18px;stroke-width:2.5}
  @media (hover:hover){.ui-check:hover>span{border-color:var(--ui-primary)}}
  .ui-check input:checked+span{background:var(--ui-primary);border-color:var(--ui-primary);color:var(--ui-on-primary)}
  .ui-check input:focus-visible+span{outline:2px solid var(--ui-focus);outline-offset:3px}
  .ui-check input[aria-busy="true"]+span{border-style:dashed;animation:ui-spin 1s linear infinite}
  .ui-check input:disabled+span{border-color:var(--ui-border)}
  .ui-check b{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .ui-check-space{display:block;width:44px;height:1px;margin-left:-10px}
  @keyframes ui-spin{to{transform:rotate(360deg)}}
  @media (forced-colors:active){.ui-check>span{border-color:CanvasText}.ui-check input:checked+span{forced-color-adjust:none;background:Highlight;border-color:Highlight;color:HighlightText}.ui-check input:not(:checked)+span{color:Canvas}}

  /* Suche */
  .ui-search{position:relative;display:flex;align-items:center;gap:8px;min-width:0}
  .ui-search__field{position:relative;flex:1 1 auto;min-width:0}
  .ui-search__icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:20px!important;height:20px!important;color:var(--ui-text-2);pointer-events:none}
  .ui-search input{padding-left:44px;padding-right:44px;-webkit-appearance:none;appearance:none}
  .ui-search input::-webkit-search-cancel-button{display:none}
  .ui-search__clear{position:absolute;right:2px;top:50%;transform:translateY(-50%)}
  .ui-search--large input{min-height:52px;box-shadow:var(--ui-shadow-1)}
  .ui-search--large .ui-btn{min-height:52px}
  .ui-search--compact input{min-height:40px;padding-top:7px;padding-bottom:7px;background:var(--ui-surface-2);border-color:transparent;padding-right:48px}
  .ui-search--compact input:focus{background:var(--ui-surface)}
  .ui-search--compact kbd{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:var(--ui-radius-sm);background:var(--ui-surface);color:var(--ui-text-2);font:600 var(--ui-fs-meta)/1 var(--ui-font);border:1px solid var(--ui-border)}
  .ui-search--compact input:focus~kbd,.ui-search--compact input:not(:placeholder-shown)~kbd{display:none}
  @media (max-width:479px){.ui-search--large .ui-btn span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.ui-search--large .ui-btn{padding:0 14px}}
  .ui-search .ui-btn .ui-icon{display:none}
  @media (max-width:479px){.ui-search--large .ui-btn .ui-icon{display:inline-block}}

  /* KPI */
  .ui-kpis{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
  .ui-kpis--3{grid-template-columns:repeat(3,minmax(0,1fr))}
  @media (min-width:768px){.ui-kpis,.ui-kpis--3{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}}
  @media (min-width:1024px){.ui-kpis{gap:16px}}
  .ui-kpis--stack{grid-template-columns:1fr!important}
  .ui-kpi{position:relative;display:grid;gap:4px;align-content:start;min-height:104px;padding:16px;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-1);color:var(--ui-text);text-decoration:none;min-width:0}
  @media (min-width:1024px){.ui-kpi{padding:18px 20px}}
  .ui-kpi__label{display:flex;align-items:center;gap:6px;font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-kpi__label .ui-icon{width:16px;height:16px}
  .ui-kpi__value{font:700 var(--ui-fs-kpi)/var(--ui-lh-kpi) var(--ui-font);font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--ui-text);overflow-wrap:anywhere}
  .ui-kpi__value--sm{font-size:1.25rem;line-height:1.75rem}
  .ui-kpi__context{font:400 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-kpi__delta{font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2);font-variant-numeric:tabular-nums}
  .ui-kpi__delta.is-good{color:var(--ui-success-fg)}
  .ui-kpi__delta.is-bad{color:var(--ui-danger-fg)}
  .ui-kpi__source{margin-top:6px}
  .ui-kpi.is-attention .ui-kpi__value{color:var(--ui-warning-fg)}
  .ui-kpi.is-attention .ui-kpi__label .ui-icon{color:var(--ui-warning-icon)}
  a.ui-kpi{transition:box-shadow var(--ui-dur-1),border-color var(--ui-dur-1)}
  @media (hover:hover){a.ui-kpi:hover{box-shadow:var(--ui-shadow-2);border-color:var(--ui-border-strong)}}
  a.ui-kpi:active{background:var(--ui-surface-active)}
  a.ui-kpi::after{content:"";position:absolute;top:18px;right:16px;width:7px;height:7px;border-top:2px solid var(--ui-text-3);border-right:2px solid var(--ui-text-3);transform:rotate(45deg)}
  @media (max-width:479px){.ui-kpis--3 .ui-kpi{padding:12px;min-height:92px}.ui-kpis--3 .ui-kpi__value{font-size:1.375rem;line-height:1.75rem}.ui-kpis--3 a.ui-kpi::after{display:none}}

  /* Faktenraster */
  .ui-facts{display:grid;gap:1px;grid-template-columns:repeat(2,minmax(0,1fr));padding:0;background:var(--ui-border);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);overflow:hidden}
  @media (min-width:768px){.ui-facts{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}}
  .ui-facts>div{display:grid;gap:2px;align-content:start;padding:12px 16px;background:var(--ui-surface);min-width:0}
  .ui-facts dt{font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-facts dd{margin:0;font:500 var(--ui-fs-body)/var(--ui-lh-body) var(--ui-font);color:var(--ui-text);overflow-wrap:anywhere}
  .ui-facts dd .ui-badge{margin-top:2px}
  .ui-facts dd small{display:block;color:var(--ui-text-2);font-weight:400}
  .ui-facts--wide>div{grid-column:1/-1}
  @media (min-width:1280px){.ui-detail__aside .ui-facts{grid-template-columns:1fr}}

  /* Inhaltsübersicht */
  .ui-toc{display:flex;flex-wrap:wrap;gap:8px;padding:0}
  .ui-toc a{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 12px 0 14px;border:1px solid var(--ui-border);border-radius:999px;background:var(--ui-surface);color:var(--ui-text);font:500 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font);text-decoration:none;white-space:nowrap}
  @media (pointer:coarse){.ui-toc a{min-height:44px}}
  @media (hover:hover){.ui-toc a:hover{background:var(--ui-surface-hover);border-color:var(--ui-border-strong)}}
  .ui-toc a[aria-current="true"]{border-color:var(--ui-primary);background:var(--ui-primary-soft);color:var(--ui-on-primary-soft)}
  @media (min-width:768px) and (max-width:1279px){.ui-toc--sticky{position:sticky;top:var(--ui-topbar-h);z-index:var(--ui-z-sticky);margin-left:calc(-1 * var(--ui-gutter));margin-right:calc(-1 * var(--ui-gutter));padding:10px var(--ui-gutter);background:var(--ui-bg);border-bottom:1px solid var(--ui-border)}}
  @media (min-width:1280px){.ui-detail__aside .ui-toc{flex-direction:column;gap:2px}.ui-detail__aside .ui-toc a{border:0;border-radius:10px;min-height:40px;justify-content:space-between;background:transparent}.ui-detail__aside .ui-toc a:hover{background:var(--ui-surface-hover)}.ui-detail__aside .ui-toc a[aria-current="true"]{background:var(--ui-primary-soft)}.ui-toc--sticky{position:static}}

  /* Banner und Notiz */
  .ui-banner{--tone-bg:var(--ui-info-bg);--tone-fg:var(--ui-info-fg);display:grid;grid-template-columns:20px minmax(0,1fr);gap:4px 12px;padding:12px 16px;border-radius:var(--ui-radius-md);background:var(--tone-bg);border:1px solid color-mix(in srgb,var(--tone-fg) 22%,transparent);color:var(--ui-text)}
  .ui-banner>.ui-icon{width:20px;height:20px;color:var(--tone-fg);margin-top:1px}
  .ui-banner__body{display:grid;gap:4px;min-width:0}
  .ui-banner__title{margin:0;font:600 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font);color:var(--ui-text)}
  .ui-banner__text{margin:0;font:400 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);color:var(--ui-text-2)}
  .ui-banner a:not(.ui-btn){color:var(--tone-fg);font-weight:600}
  .ui-banner__actions{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin-top:6px}
  .ui-banner__actions .ui-more{color:var(--tone-fg)}
  .ui-banner--info{--tone-bg:var(--ui-info-bg);--tone-fg:var(--ui-info-fg)}
  .ui-banner--warn{--tone-bg:var(--ui-warning-bg);--tone-fg:var(--ui-warning-fg)}
  .ui-banner--warn>.ui-icon{color:var(--ui-warning-icon)}
  .ui-banner--success{--tone-bg:var(--ui-success-bg);--tone-fg:var(--ui-success-fg)}
  .ui-banner--danger{--tone-bg:var(--ui-danger-bg);--tone-fg:var(--ui-danger-fg)}
  .ui-banner--draft{--tone-bg:var(--ui-draft-bg);--tone-fg:var(--ui-draft-fg);border:1px dashed var(--ui-draft-border)}
  .ui-banner--neutral{--tone-bg:var(--ui-surface);--tone-fg:var(--ui-text-2);border-color:var(--ui-border)}
  .ui-note{display:flex;align-items:flex-start;gap:8px;font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-note .ui-icon{width:16px;height:16px;margin-top:1px}

  /* Leerzustand */
  .ui-empty{display:grid;justify-items:center;gap:8px;padding:32px 16px;text-align:center;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg)}
  .ui-empty>.ui-icon{width:48px;height:48px;padding:12px;box-sizing:border-box;border-radius:999px;background:var(--ui-surface-2);color:var(--ui-text-2)}
  .ui-empty h2,.ui-empty h3{margin:0;font:650 var(--ui-fs-h3)/var(--ui-lh-h3) var(--ui-font)}
  .ui-empty p{margin:0;max-width:44ch;font:400 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);color:var(--ui-text-2)}

  /* Toast */
  .ui-toast{position:fixed;left:16px;right:16px;bottom:calc(var(--ui-tabbar-h) + env(safe-area-inset-bottom) + 12px);z-index:var(--ui-z-toast);display:flex;align-items:center;gap:8px;min-height:52px;padding:6px 6px 6px 16px;border-radius:var(--ui-radius-md);background:var(--ui-inverse-bg);color:var(--ui-inverse-text);box-shadow:var(--ui-shadow-3);font:500 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font)}
  .ui-toast>span{flex:1 1 auto}
  .ui-toast .ui-btn--ghost{color:var(--ui-inverse-action)}
  .ui-toast .ui-iconbtn{color:var(--ui-inverse-text)}
  @media (hover:hover){.ui-toast .ui-btn--ghost:hover,.ui-toast .ui-iconbtn:hover{background:rgb(255 255 255 / .1)}}
  .ui-toast :focus-visible{outline-color:var(--ui-inverse-action)}
  @media (min-width:768px){.ui-toast{left:auto;right:24px;bottom:24px;max-width:440px}}
  @media (prefers-reduced-motion:no-preference){.ui-toast:not([hidden]){animation:ui-toast-in var(--ui-dur-2) var(--ui-ease-out)}}
  @keyframes ui-toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

  /* Tabelle (auf dem Handy als Karten) */
  .ui-table-wrap{background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);overflow:hidden;box-shadow:var(--ui-shadow-1)}
  .ui-table{width:100%;border-collapse:separate;border-spacing:0;font:400 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);font-variant-numeric:tabular-nums}
  .ui-table caption{caption-side:top;padding:12px 16px 8px;text-align:left;font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-table th{padding:10px 16px;background:var(--ui-surface-2);color:var(--ui-text-2);font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);text-align:left;vertical-align:bottom}
  .ui-table td{padding:12px 16px;border-top:1px solid var(--ui-border);vertical-align:top;color:var(--ui-text)}
  .ui-table tbody th{background:transparent;color:var(--ui-text);font:600 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);border-top:1px solid var(--ui-border);text-align:left;vertical-align:top}
  .ui-table .is-num,.ui-table td.num{text-align:right;white-space:nowrap}
  .ui-table tfoot td,.ui-table tfoot th,.ui-table tr.is-total td,.ui-table tr.is-total th{font-weight:650;background:var(--ui-surface-hover)}
  @media (max-width:639px){
    .ui-table--cards thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
    .ui-table--cards tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:12px 16px;border-top:1px solid var(--ui-border)}
    .ui-table--cards tbody tr:first-child{border-top:0}
    .ui-table--cards :is(td,tbody th){display:flex;justify-content:space-between;gap:12px;padding:0;border:0;grid-column:1/-1}
    .ui-table--cards :is(td,tbody th)::before{content:attr(data-label);font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2);text-align:left}
    .ui-table--cards :is(td,tbody th):first-child{font:600 var(--ui-fs-body)/var(--ui-lh-body) var(--ui-font)}
    .ui-table--cards :is(td,tbody th):first-child::before{display:none}
  }
  .ui-table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .ui-table-scroll:focus-visible{outline-offset:-2px}

  /* Dialog / Bottom-Sheet */
  .ui-dialog{border:0;border-radius:var(--ui-radius-xl);background:var(--ui-surface-raised);color:var(--ui-text);box-shadow:var(--ui-shadow-3);padding:24px;width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - 32px)}
  .ui-dialog::backdrop{background:rgb(10 20 16 / .45)}
  .ui-dialog__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}
  .ui-dialog__head h2{font:650 var(--ui-fs-h2)/var(--ui-lh-h2) var(--ui-font);margin:0}
  @media (max-width:767px){.ui-dialog{margin:auto 0 0;width:100%;max-width:100%;border-radius:20px 20px 0 0;padding-bottom:calc(24px + env(safe-area-inset-bottom))}}
  @media (max-width:767px) and (prefers-reduced-motion:no-preference){.ui-dialog[open]{animation:ui-sheet-in var(--ui-dur-3) var(--ui-ease-out)}}
  @keyframes ui-sheet-in{from{transform:translateY(100%)}to{transform:none}}

  /* Fortschritt */
  .ui-progress{display:grid;gap:6px;min-width:200px}
  .ui-progress__label{font:600 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);color:var(--ui-text)}
  .ui-progress__track{height:8px;border-radius:999px;background:var(--ui-surface-2);overflow:hidden}
  .ui-progress__bar{display:block;height:100%;border-radius:999px;background:var(--ui-chart-1)}

  /* A–Z-Index */
  .ui-alpha{position:sticky;top:var(--ui-topbar-h);z-index:var(--ui-z-sticky);display:flex;gap:4px;margin-left:calc(-1 * var(--ui-gutter));margin-right:calc(-1 * var(--ui-gutter));padding:8px var(--ui-gutter);background:var(--ui-bg);border-bottom:1px solid var(--ui-border);overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%)}
  .ui-alpha::-webkit-scrollbar{display:none}
  @media (min-width:768px){.ui-alpha{flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none}}
  .ui-alpha a{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:var(--ui-radius-sm);color:var(--ui-text);font:600 var(--ui-fs-ui)/1 var(--ui-font);text-decoration:none}
  @media (pointer:coarse){.ui-alpha a{width:44px;height:44px}}
  @media (hover:hover){.ui-alpha a:hover{background:var(--ui-surface-hover)}}
  .ui-alpha a[aria-disabled="true"]{color:var(--ui-text-disabled);pointer-events:none}
  .ui-alpha-head{position:sticky;top:calc(var(--ui-topbar-h) + 57px);z-index:calc(var(--ui-z-sticky) - 1);margin:0;padding:6px 0;background:var(--ui-bg);font:650 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font)}
  @media (min-width:768px){.ui-alpha-head{position:static}}

  /* Schrittliste */
  .ui-steps{display:grid;gap:0;padding:0;list-style:none;counter-reset:ui-step}
  .ui-steps li{position:relative;display:grid;grid-template-columns:28px minmax(0,1fr);gap:2px 12px;padding-bottom:16px;counter-increment:ui-step}
  .ui-steps li::before{content:counter(ui-step);grid-row:span 2;display:grid;place-items:center;width:28px;height:28px;border-radius:999px;background:var(--ui-primary-soft);color:var(--ui-on-primary-soft);font:650 var(--ui-fs-meta)/1 var(--ui-font)}
  .ui-steps li:not(:last-child)::after{content:"";position:absolute;left:13.5px;top:32px;bottom:4px;width:1px;background:var(--ui-border)}
  .ui-steps strong{font:600 var(--ui-fs-ui)/28px var(--ui-font)}
  .ui-steps p{margin:0;color:var(--ui-text-2);font:400 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font)}

  /* Fließtext-Block (Beschlusstext, Hinweise) */
  .ui-prose{max-width:var(--ui-measure);font:400 var(--ui-fs-body)/var(--ui-lh-body) var(--ui-font);color:var(--ui-text)}
  .ui-prose>*+*{margin-top:12px}
  .ui-muted{color:var(--ui-text-2)}
  .ui-meta{font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-num{font-variant-numeric:tabular-nums}
  .ui-namelist{margin:0;font:400 var(--ui-fs-ui)/1.6 var(--ui-font);color:var(--ui-text)}

  /* Charts */
  .ui-chart{display:block;width:100%;height:auto;overflow:visible;font-family:var(--ui-font)}
  .ui-chart text{font-size:13px;fill:var(--ui-chart-label)}
  .ui-chart .ui-c1{fill:var(--ui-chart-1)}.ui-chart .ui-c2{fill:var(--ui-chart-2)}.ui-chart .ui-c3{fill:var(--ui-chart-3)}.ui-chart .ui-c4{fill:var(--ui-chart-4)}.ui-chart .ui-cp{fill:var(--ui-chart-prior)}
  .ui-chart .ui-s1{stroke:var(--ui-chart-1)}.ui-chart .ui-s2{stroke:var(--ui-chart-2)}.ui-chart .ui-s3{stroke:var(--ui-chart-3)}
  .ui-chart .ui-grid{stroke:var(--ui-chart-grid)}.ui-chart .ui-axis{stroke:var(--ui-chart-axis)}.ui-chart .ui-marker{stroke:var(--ui-chart-marker);fill:var(--ui-chart-marker)}
  .ui-chart .ui-track{fill:var(--ui-surface-2)}
  .ui-chart .ui-value{fill:var(--ui-text);font-weight:600}
  .ui-legend{display:flex;flex-wrap:wrap;gap:4px 16px;padding:0;list-style:none;font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-legend li{display:inline-flex;align-items:center;gap:6px}
  .ui-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;background:var(--ui-chart-1)}
  .ui-legend i.ui-c2{background:var(--ui-chart-2)}.ui-legend i.ui-c3{background:var(--ui-chart-3)}.ui-legend i.ui-c4{background:var(--ui-chart-4)}.ui-legend i.ui-cp{background:var(--ui-chart-prior)}
  .ui-bars{display:grid;gap:12px;padding:0;list-style:none}
  .ui-bars li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:baseline}
  .ui-bars__label{font:500 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);color:var(--ui-text);min-width:0;overflow-wrap:anywhere}
  .ui-bars__value{font:600 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
  .ui-bars__value small{display:block;font-weight:500;color:var(--ui-text-2)}
  .ui-bars__track{grid-column:1/-1;height:8px;border-radius:4px;background:var(--ui-surface-2);overflow:hidden}
  .ui-bars__fill{display:block;height:100%;border-radius:4px;background:var(--ui-chart-1)}
  .ui-bars__fill.ui-c3{background:var(--ui-chart-3)}.ui-bars__fill.ui-c2{background:var(--ui-chart-2)}.ui-bars__fill.ui-cp{background:var(--ui-chart-prior)}
}

/* ===================================================================== utilities */
@layer utilities {
  .ui-hide-mobile{display:none!important}
  @media (min-width:768px){.ui-hide-mobile{display:revert!important}.ui-hide-tablet-up{display:none!important}}
  .ui-mt-0{margin-top:0!important}
  .ui-nowrap{white-space:nowrap}
  .ui-full{grid-column:1/-1}
  @media print{
    .ui-sidebar,.ui-topbar,.ui-tabbar,.ui-toast,.skip-link,.ui-more[data-show-all]{display:none!important}
    body.ui-app{padding:0!important;background:#fff}
    .ui-main{max-width:none;padding:0}
    .ui-list,.ui-card,.ui-kpi{box-shadow:none}
    .ui-row{break-inside:avoid}
  }
}

/* Anmelden, Einladung, Passwort setzen */
@layer pages {
  body.ui-auth{margin:0;min-height:100dvh;background:var(--ui-bg);color:var(--ui-text);font-family:var(--ui-font);font-size:var(--ui-fs-body);line-height:var(--ui-lh-body);-webkit-font-smoothing:antialiased}
  .ui-auth__shell{display:grid;place-items:center;min-height:100dvh;padding:24px max(16px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
  .ui-auth__card{display:grid;gap:20px;width:min(440px,100%);padding:28px 24px;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius-xl);box-shadow:var(--ui-shadow-2)}
  @media (min-width:768px){.ui-auth__card{padding:36px 36px 32px}}
  .ui-auth__brand{display:flex;align-items:center;gap:12px}
  .ui-auth__brand img{width:40px;height:40px;border-radius:10px}
  .ui-auth__brand span{display:grid}
  .ui-auth__brand strong{font:650 var(--ui-fs-h3)/1.25 var(--ui-font)}
  .ui-auth__brand small{font:400 var(--ui-fs-meta)/1.35 var(--ui-font);color:var(--ui-text-2)}
  .ui-auth__copy{display:grid;gap:6px}
  .ui-auth__copy h1{margin:0;font:700 var(--ui-fs-h1)/var(--ui-lh-h1) var(--ui-font);letter-spacing:-.02em}
  .ui-auth__copy p{margin:0;color:var(--ui-text-2)}
  .ui-auth__copy .ui-eyebrow{color:var(--ui-text-2)}
  .ui-auth .ui-banner{grid-template-columns:1fr;margin:0;font-size:var(--ui-fs-small)}
  .ui-auth .ui-form{gap:16px}
  .ui-auth .ui-btn--block{min-height:48px;margin-top:4px}
  .ui-auth__foot{text-align:center}
  .ui-auth input[readonly]{background:var(--ui-surface-2);color:var(--ui-text-2)}
}


/* ===================================================================== Seiten: arbeit */
/* Oberfläche 25 – Seitengruppe „Arbeit“: Start, Beschlüsse, Aufgaben, Suche. Nur Tokens, alles in @layer pages. */
@layer pages {
  /* .ui-list__head>span färbt direkte Badges grau (Genehmigt wäre unlesbar) – Badges stehen daher in einem Wrapper */
  .ui-list__badge{display:inline-flex}
  /* Start: „PDF hinzufügen“ steht ab 1024 schon in der Kopfzeile */
  @media (min-width:1024px){.ui-home .home-pagehead-upload{display:none}}

  /* Start: Reihenfolge auf dem Handy Hero → KPI → Offen → Zuletzt; ab 1024 zwei Spalten */
  .home-split{row-gap:var(--ui-section-gap)}
  .home-split>*+*{margin-top:0}
  .home-split__kpis>.home-kpis{margin-top:0}
  @media (min-width:1024px){
    .home-split{grid-template-areas:"hero kpis" "open recent";column-gap:24px}
    .home-split__hero{grid-area:hero}
    .home-split__kpis{grid-area:kpis}
    .home-split__open{grid-area:open}
    .home-split__recent{grid-area:recent}
    .home-kpis{grid-template-columns:1fr;gap:12px}
    .home-kpis .ui-kpi{min-height:0;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"label value" "context value";align-items:center;column-gap:12px;padding:14px 40px 14px 18px}
    .home-kpis .ui-kpi__label{grid-area:label}
    .home-kpis .ui-kpi__value{grid-area:value;text-align:right}
    .home-kpis .ui-kpi__context{grid-area:context}
    .home-kpis a.ui-kpi::after{top:50%;margin-top:-4px}
  }
  .home-split__hero .ui-hero__eyebrow h2{margin:0;font:inherit;color:inherit}
  .home-kpis .ui-kpi__context .ui-badge{margin-top:2px}
  .ui-kpi .ui-badge{max-width:100%;white-space:normal}
  /* Handy: „Letzte Sitzung“ mit Fassungs-Badge bekommt die volle Breite, sonst ragt das Badge aus der Kachel */
  @media (max-width:559px){
    .home-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
    .home-kpis>.ui-kpi:nth-child(3){grid-column:1/-1;min-height:0;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"label value" "context value";align-items:center;column-gap:12px;padding-right:36px}
    .home-kpis>.ui-kpi:nth-child(3) .ui-kpi__label{grid-area:label}
    .home-kpis>.ui-kpi:nth-child(3) .ui-kpi__value{grid-area:value}
    .home-kpis>.ui-kpi:nth-child(3) .ui-kpi__context{grid-area:context}
    .home-kpis>a.ui-kpi:nth-child(3)::after{display:block;top:50%;margin-top:-4px}
  }

  /* Überfällige Frist */
  .ui-row__desc .is-overdue{color:var(--ui-danger-fg);font-weight:600}

  /* Schnellzugriffe: neutrale Karten, 2×2 → 4 Spalten */
  .home-quick{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
  @media (min-width:1024px){.home-quick{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}}
  .home-quick__card{display:grid;align-content:start;gap:4px;min-height:112px;padding:16px 36px 16px 16px}
  .ui-card.home-quick__card>*+*{margin-top:0}
  .home-quick__icon{width:24px;height:24px;color:var(--ui-primary);margin-bottom:6px}
  .home-quick__label{font:600 var(--ui-fs-body)/var(--ui-lh-body) var(--ui-font);color:var(--ui-text);overflow-wrap:anywhere}
  .home-quick__value{font:400 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .home-quick-editor{margin-top:16px}
  .home-quick-editor .ui-sectionhead{margin:0}
  .home-quick-editor .ui-sectionhead h3{margin:0}

  /* Aufgaben: Fortschritt im Kopf; Filter auf dem Handy Suche oben, Selects zweispaltig */
  .actions-progress{align-self:end}
  @media (max-width:767px){
    .actions-progress{min-width:0}
    .ui-actions .ui-filterbar__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end}
    .ui-actions .ui-filterbar__row>.ui-field--grow{grid-column:1/-1}
  }

  /* Suche */
  .search-box{display:grid;gap:8px}
  .search-results .search-group{margin-top:var(--ui-section-gap)}
  .search-results>.ui-chips{margin-top:12px}
  .search-group .ui-sectionhead h3{display:flex;align-items:center;gap:8px;margin:0;font:650 var(--ui-fs-h3)/var(--ui-lh-h3) var(--ui-font)}
  .ui-row__desc mark{background:var(--ui-mark);color:var(--ui-text);border-radius:3px;padding:0 1px}
  .ui-row__meta .ui-badge{min-height:20px;padding:0 6px}
  .search-person-links{gap:8px}
  .search-person-chip{display:inline-flex;align-items:center;min-height:32px;padding-left:10px;border-radius:var(--ui-radius-xs);background:var(--ui-neutral-bg);color:var(--ui-neutral-fg);font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font)}
  .search-person-chip a{color:inherit;text-decoration:none;padding-right:10px}
  @media (hover:hover){.search-person-chip a:hover{text-decoration:underline}}
  .search-person-chip .ui-iconbtn{width:32px;height:32px;margin-left:-6px}
  .search-person-chip .ui-iconbtn .ui-icon{width:16px;height:16px}
  .search-person-chip.is-review{background:var(--ui-warning-bg);color:var(--ui-warning-fg)}
}


/* ===================================================================== Seiten: sitzungen */
/* Oberfläche 25 – Seitengruppe Sitzungen (meetings.php, meeting.php, assembly.php, evidence.php). Nur Tokens. */
@layer pages {
  /* Sitzungsliste */
  .ui-sitz-filters{display:grid;gap:12px;justify-items:start}
  .ui-sitz-filters>.ui-segment{width:100%}
  @media (min-width:768px){.ui-sitz-filters>.ui-segment{width:auto;min-width:420px}}
  .ui-sitz-countdown{font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-sitz-year>.ui-sectionhead{position:sticky;top:var(--ui-topbar-h);z-index:var(--ui-z-sticky);margin:0 calc(-1 * var(--ui-gutter));padding:8px var(--ui-gutter);background:var(--ui-bg)}
  .ui-sitz-year>.ui-sectionhead h2{font-size:var(--ui-fs-h3);line-height:var(--ui-lh-h3)}
  .ui-sitz-year+.ui-sitz-year{margin-top:24px}

  /* Detailseiten: H1 mit Kontextzeile */
  .ui-pagehead h1 .ui-eyebrow{display:block;margin-bottom:4px;letter-spacing:0}
  .ui-sitz-pagebtn{border:1px solid var(--ui-border);background:var(--ui-surface)}
  span.ui-sitz-pagebtn{color:var(--ui-text-disabled);border-color:var(--ui-border);background:transparent}

  /* Unter 1280: Aside löst sich auf, damit die Inhaltsübersicht über alle Abschnitte sticky bleibt */
  @media (max-width:1279px){
    .ui-sitz-detail{display:block}
    .ui-sitz-detail>.ui-detail__aside{display:contents}
    .ui-sitz-detail>.ui-detail__main{margin-top:var(--ui-section-gap)}
  }
  @media (min-width:768px) and (max-width:1279px){.ui-sitz-detail .ui-toc--sticky{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}}
  .ui-toc .ui-count{height:20px;min-width:20px;line-height:20px;font-size:12px}
  @media (min-width:1280px){.ui-sitz-detail .ui-detail__aside{max-height:calc(100dvh - var(--ui-topbar-h) - 32px);overflow-y:auto}}

  .ui-sitz-topics>*+*{margin-top:12px}
  .ui-sitz-stack>*+*{margin-top:var(--ui-section-gap)}
  .ui-sitz-topicbanner .ui-banner__actions{margin-top:2px}
  .ui-section>.ui-sectionhead>p{margin-top:-4px}
  .ui-facts dt .ui-count{height:18px;min-width:18px;line-height:18px;font-size:12px;margin-left:4px;vertical-align:1px}
  .ui-facts .ui-namelist{font-weight:400}
  .ui-facts dd .ui-badge{white-space:normal}
  @media (max-width:767px){.ui-facts:not(.ui-facts--wide)>div:last-child:nth-child(odd){grid-column:1/-1}}
  .ui-banner__actions .ui-more{white-space:normal;text-align:left}

  /* Tagesordnung */
  .ui-sitz-agenda .ui-row{align-items:start}
  .ui-sitz-agenda .ui-row__num{width:36px}
  .ui-sitz-agenda__title{font:500 var(--ui-fs-ui)/var(--ui-lh-body) var(--ui-font)}

  /* Ältere / neuere Sitzung */
  .ui-sitz-pager{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .ui-sitz-pager a.ui-card{display:flex;align-items:center;gap:8px;padding:12px 16px;min-height:56px;text-decoration:none}
  .ui-sitz-pager a.ui-card .ui-icon{width:20px;height:20px;flex:none;color:var(--ui-text-3)}
  .ui-sitz-pager span{display:grid;min-width:0}
  .ui-sitz-pager small{font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-sitz-pager strong{font:600 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font);font-variant-numeric:tabular-nums}
  .ui-sitz-pager__next{grid-column:2;justify-content:flex-end;text-align:right}
  @media (hover:hover){.ui-sitz-pager a.ui-card:hover{border-color:var(--ui-border-strong);box-shadow:var(--ui-shadow-2)}}
  .ui-sitz-pager a.ui-card:active{background:var(--ui-surface-active)}

  /* Belegseite */
  .ui-evidence{position:relative;margin:0;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-1);padding:8px;overflow:hidden}
  @media (min-width:768px){.ui-evidence{padding:16px}}
  .ui-evidence__paper{position:relative;max-width:880px;margin:0 auto;line-height:0}
  .ui-evidence__paper img{display:block;width:100%;height:auto;aspect-ratio:auto 210 / 297;border-radius:4px}
  .ui-evidence__mark{position:absolute;border-radius:3px;background:color-mix(in srgb,var(--ui-warning-icon) 28%,transparent);box-shadow:0 0 0 2px var(--ui-warning-icon);transform:rotate(var(--highlight-angle,0deg));transform-origin:left center;pointer-events:none;mix-blend-mode:multiply}
  .ui-evidence-text{max-width:var(--ui-measure)}
  .ui-evidence-text .ui-card>p{font:400 var(--ui-fs-body)/1.7 var(--ui-font);color:var(--ui-text);overflow-wrap:anywhere}
  .ui-evidence-text .ui-card>p+p{margin-top:12px}
  .ui-evidence-text .ui-card>p.ui-meta+p{margin-top:2px}
  .ui-evidence-text .ui-card>p.ui-meta{font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
}


/* ===================================================================== Seiten: wissen */
/* Seitengruppe „Bereiche“ (wissen, people, person, personnel, topics, topic, threads, regulations, course, context, case, source-library, account). Nur Tokens. */
@layer pages {
  /* Bereiche: Zahl und Chevron nebeneinander */
  .ui-areas__trail{flex-direction:row;align-items:center;gap:8px;align-self:center}
  .ui-areas__trail .ui-row__chevron{margin-top:0}
  .ui-areas__value{font:600 var(--ui-fs-ui)/var(--ui-lh-ui) var(--ui-font);font-variant-numeric:tabular-nums;color:var(--ui-text)}
  .ui-areas .ui-row__lead{align-self:center}
}
@layer pages {
  /* Personen */
  .ui-people__group{scroll-margin-top:calc(var(--ui-topbar-h) + 64px)}
  .ui-people .ui-alpha-head{font-size:var(--ui-fs-ui)}
  @media (min-width:768px){.ui-people .ui-alpha-head{padding:4px 0 8px}}
  .ui-people__trail{flex-direction:row;align-items:center;gap:8px}
  .ui-people__trail .ui-row__chevron{margin-top:0}
  @media (min-width:1024px) and (pointer:fine){.ui-people .ui-alpha{gap:2px}.ui-people .ui-alpha a{width:34px}}

  /* Personenprofil */
  .ui-person-head__id{display:flex;align-items:flex-start;gap:16px;min-width:0}
  .ui-person-head__avatar{width:56px;height:56px;flex:none;font-size:var(--ui-fs-ui);background:var(--ui-primary-soft);color:var(--ui-on-primary-soft)}
  .ui-person-head .ui-row__badges{margin-top:0}
  .ui-person-choice{display:grid;gap:0;margin:0;padding:0;border:0;min-width:0}
  .ui-person-choice legend{padding:0;margin-bottom:2px}
  @media (min-width:768px){.ui-person-choice{grid-template-columns:repeat(3,max-content);column-gap:24px}.ui-person-choice legend{grid-column:1/-1}}
  .ui-person-quote{color:var(--ui-text);font-style:italic}
  .ui-page-person .ui-section{scroll-margin-top:calc(var(--ui-topbar-h) + 72px)}

  /* Personal: Abschnitte im Raster ohne Zusatzabstand */
  .ui-personnel-year{scroll-margin-top:calc(var(--ui-topbar-h) + 16px)}

  /* Themen / Verläufe */
  .ui-topic-more{flex-wrap:wrap;align-items:center;gap:0 12px}
  .ui-thread-head>h2{font:650 var(--ui-fs-h2)/var(--ui-lh-h2) var(--ui-font);letter-spacing:-.01em}

  /* Regelwerk */
  .ui-regulation-text{color:var(--ui-text);font-size:var(--ui-fs-ui);line-height:var(--ui-lh-body)}
  .ui-regulation-keywords{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 0;padding:0;list-style:none}
  .ui-regulation-keywords a{position:relative;display:inline-flex;align-items:center;min-height:28px;padding:2px 10px;border:1px solid var(--ui-border-strong);border-radius:999px;color:var(--ui-text-2);font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);text-decoration:none}
  .ui-regulation-keywords a::before{content:"";position:absolute;inset:-8px -2px}
  @media (hover:hover){.ui-regulation-keywords a:hover{background:var(--ui-surface-hover);color:var(--ui-text)}}
  .ui-page-regulations .ui-row{scroll-margin-top:calc(var(--ui-topbar-h) + 16px)}

  /* Kontext / Akte / Konto */
  .ui-context-badges{margin-top:0}
  .ui-context-fact-wide{grid-column:1/-1}
  .ui-context-title,.ui-account-title{font:650 var(--ui-fs-h2)/var(--ui-lh-h2) var(--ui-font);letter-spacing:-.01em}
  .ui-case-icon{width:18px;height:18px;margin-right:6px;vertical-align:-3px}
  .ui-case-icon--ok{color:var(--ui-success-fg)}
  .ui-case-icon--open{color:var(--ui-warning-icon)}
  .ui-account-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
  .ui-account-actions form{margin:0}

  /* Platzplan als Karte */
  .ui-course-legend{display:flex;flex-wrap:wrap;gap:4px 16px;margin:0;padding:0;list-style:none;font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .ui-course-legend li{display:inline-flex;align-items:center;gap:6px}
  .ui-course-legend i{display:inline-block;width:12px;height:12px;border-radius:3px;border:1px solid var(--ui-border-strong)}
  .ui-course-holes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin:0;padding:0;list-style:none}
  @media (min-width:768px){.ui-course-holes{grid-template-columns:repeat(9,minmax(0,1fr));gap:8px}}
  .ui-course-hole{display:grid;justify-items:center;align-content:center;gap:2px;min-height:60px;padding:6px 2px;border:1px solid var(--ui-border);border-radius:var(--ui-radius-md);color:var(--ui-text);text-decoration:none;font-variant-numeric:tabular-nums}
  .ui-course-hole b{font:700 var(--ui-fs-h3)/1.2 var(--ui-font)}
  .ui-course-hole small{font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2);white-space:nowrap}
  :is(.ui-course-hole,.ui-course-legend i).is-empty{background:var(--ui-surface);border:1px dashed var(--ui-border-strong)}
  .ui-course-hole.is-empty b{color:var(--ui-text-2)}
  :is(.ui-course-hole,.ui-course-legend i).is-low{background:var(--ui-primary-soft);border-color:color-mix(in srgb,var(--ui-primary) 25%,transparent)}
  :is(.ui-course-hole,.ui-course-legend i).is-medium{background:var(--ui-primary-soft-hover);border-color:color-mix(in srgb,var(--ui-primary) 50%,transparent)}
  :is(.ui-course-hole,.ui-course-legend i).is-high{background:var(--ui-primary);border-color:var(--ui-primary)}
  .ui-course-hole.is-high,.ui-course-hole.is-high small{color:var(--ui-on-primary)}
  .ui-course-hole[aria-current="page"]{outline:2px solid var(--ui-text);outline-offset:2px}
  @media (hover:hover){.ui-course-hole:hover{border-color:var(--ui-border-strong)}}
  .ui-course-head-actions{display:flex;flex-wrap:wrap;gap:4px}
  .ui-course-more{background:transparent}
  .ui-page-course .ui-section{scroll-margin-top:calc(var(--ui-topbar-h) + 16px)}
}
@layer pages {
  /* Schmale Handys: Zeilen mit Datumsblock und Beleg-Chip – Chip unter den Text, damit der Text Breite behält */
  @media (max-width:479px){
    :is(.ui-page-topic,.ui-page-threads,.ui-page-case,.ui-page-course,.ui-page-personnel) .ui-row:has(>.ui-row__lead .ui-date):has(>.ui-row__trail .ui-source){grid-template-columns:auto minmax(0,1fr)}
    :is(.ui-page-topic,.ui-page-threads,.ui-page-case,.ui-page-course,.ui-page-personnel) .ui-row:has(>.ui-row__lead .ui-date)>.ui-row__trail:has(.ui-source){grid-column:2;flex-direction:row;align-items:center;margin-top:8px}
  }
}


/* ===================================================================== Seiten: zahlen */
/* Oberfläche 25 – Seitengruppe „Zahlen“: Finanzbericht, Mitglieder, Quellen, Import, Benutzer.
   Nur Tokens, keine Farbwerte. Präfix .zb- = seiteneigene Bausteine. */
@layer pages {
  .zb .ui-card>*+.ui-hint{margin-top:8px}
  .zb .ui-card>.ui-hint+*,.zb .ui-card>.ui-note+*{margin-top:12px}
  .zb .ui-card>*+h3,.zb .ui-card>*+h4{margin-top:20px}
  .zb .ui-card>.ui-eyebrow+h2,.zb .ui-card>.ui-eyebrow+h3{margin-top:4px}
  @media (max-width:639px){.zb .ui-table--cards tr.is-total{background:var(--ui-surface-hover)}}
  /* Lange Spaltenbezeichnungen (z. B. „… lt. Vorstandsbudget“) umbrechen statt den Betrag abzuschneiden. */
  @media (max-width:639px){.zb .ui-table--cards td::before{flex:1 1 0;min-width:0;white-space:normal;overflow-wrap:break-word}.zb .ui-table--cards td{align-items:baseline;text-align:right}}

  /* ---------- Finanzbericht: Steuerzeile */
  .zb-finance{display:grid;gap:var(--ui-section-gap);min-width:0}
  .zb-finance>*{min-width:0}
  .zb-finance .zb-report{display:grid;gap:var(--ui-section-gap);min-width:0}
  .zb-controls{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px}
  .zb-entity{flex:0 1 320px}
  .zb-controls .ui-chips{flex:1 1 280px}
  .zb-finance>.zb-tabs{margin-top:calc(16px - var(--ui-section-gap))}
  .zb-back{margin:0 0 calc(12px - var(--ui-section-gap))}
  .zb-back .ui-more{margin-left:-4px}
  .zb-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
  .zb-sources{display:flex;flex-wrap:wrap;gap:8px}
  .zb-footnote{margin:0;font:400 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2);max-width:var(--ui-measure)}

  /* ---------- KPI-Reihe (Handy untereinander, ab 768 drei Spalten) */
  .zb-kpis{display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
  @media (min-width:768px){.zb-kpis{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}
  @media (min-width:1024px){.zb-kpis{gap:16px}}
  .zb-kpi:has(.zb-mini){padding-right:124px}
  .zb-kpi .zb-mini{width:96px;height:64px;position:absolute;right:16px;top:50%;transform:translateY(-50%)}
  a.zb-kpi::after{top:14px;right:14px}
  @media (min-width:768px) and (max-width:1279px){.zb-kpi:has(.zb-mini){padding-right:16px}.zb-kpi .zb-mini{position:static;transform:none;margin-top:8px}}

  /* ---------- Jahresausblick mit Bullet-Chart */
  .zb-outlook__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
  .zb-outlook__head h2{font:650 var(--ui-fs-h2)/var(--ui-lh-h2) var(--ui-font)}
  .zb-outlook__number{display:block;font:700 var(--ui-fs-display)/var(--ui-lh-display) var(--ui-font);letter-spacing:-.025em;font-variant-numeric:tabular-nums;color:var(--ui-text)}
  .zb-bullet{position:relative;display:grid;gap:6px;padding:4px 0 0;max-width:720px}
  .zb-bullet__track{position:relative;display:block;height:12px;margin:2px 0;border-radius:6px;background:var(--ui-surface-2)}
  .zb-bullet__zero{position:absolute;left:50%;top:-6px;bottom:-6px;width:1px;background:var(--ui-chart-axis)}
  .zb-bullet__bar{position:absolute;top:0;bottom:0;left:var(--l);width:var(--w);border-radius:4px;background:var(--ui-chart-3)}
  .zb-bullet__marker{position:absolute;left:var(--x);top:-6px;bottom:-6px;width:2px;margin-left:-1px;background:var(--ui-chart-marker)}
  .zb-bullet__label{position:relative;display:block;width:max-content;max-width:100%;left:var(--x);font:600 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);font-variant-numeric:tabular-nums;color:var(--ui-text);white-space:nowrap}
  .zb-bullet__label.is-mid{transform:translateX(-50%)}
  .zb-bullet__label.is-end{left:auto;margin-left:auto;margin-right:calc(100% - var(--x))}
  .zb-bullet__label.is-start{left:max(0px,calc(var(--x) - 8px))}
  .zb-bullet__axis{display:flex;justify-content:space-between;font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-chart-label)}

  /* ---------- „Wofür wir ausgeben“ – einfarbig, Zeile als Link */
  .zb-areas{gap:16px}
  .zb-areas li{position:relative}
  .zb-areas__link{color:var(--ui-text);font-weight:600;text-decoration:none}
  .zb-areas__link::after{content:"";position:absolute;inset:-8px -8px;border-radius:var(--ui-radius-sm)}
  @media (hover:hover){.zb-areas li:hover .zb-areas__link{text-decoration:underline;text-underline-offset:3px}}
  .zb-areas__link:focus-visible{outline:none}
  .zb-areas li:has(.zb-areas__link:focus-visible){outline:2px solid var(--ui-focus);outline-offset:6px;border-radius:4px}
  .zb-bars__track--plan{position:relative;overflow:visible}
  .zb-bars__plan{position:absolute;left:var(--x);top:-4px;bottom:-4px;width:2px;margin-left:-1px;background:var(--ui-chart-marker)}
  .ui-legend i.zb-legend-marker{width:2px;height:12px;border-radius:0;background:var(--ui-chart-marker)}

  /* ---------- Wasserfall als Zeilen */
  .zb-wf{display:grid;gap:14px;margin:0;padding:0;list-style:none}
  .zb-wf__row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center}
  .zb-wf__label{font:500 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);color:var(--ui-text);min-width:0;overflow-wrap:anywhere}
  .zb-wf__row.is-total .zb-wf__label{font-weight:650}
  .zb-wf__value{font:600 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);font-variant-numeric:tabular-nums;color:var(--ui-text);text-align:right;white-space:nowrap}
  .zb-wf__track{position:relative;grid-column:1/-1;grid-row:2;height:12px}
  .zb-wf__bar{position:absolute;top:0;bottom:0;left:var(--l);width:var(--w);min-width:2px;border-radius:3px;background:var(--ui-chart-1)}
  .zb-wf__bar.ui-c3{background:var(--ui-chart-3)}
  .zb-wf__link{position:absolute;left:var(--x);top:-34px;bottom:50%;width:0;border-left:1px dashed var(--ui-chart-axis)}
  .zb-wf__zero{position:absolute;left:var(--x);top:-4px;bottom:-4px;width:1px;background:var(--ui-chart-axis)}
  @media (min-width:640px){
    .zb-wf{gap:10px}
    .zb-wf__row{grid-template-columns:minmax(120px,200px) minmax(0,1fr) minmax(96px,auto)}
    .zb-wf__track{grid-column:2;grid-row:1;height:14px}
    .zb-wf__link{top:-12px}
  }
  .zb-wf__legend{margin-top:16px}

  /* ---------- Jahresergebnisse */
  .zb-annual{display:grid;gap:16px}
  .zb-diverge{position:relative;display:block;height:8px;margin:6px 0 4px;border-radius:4px;background:var(--ui-surface-2);max-width:420px}
  .zb-diverge__zero{position:absolute;left:min(var(--z),calc(100% - 1px));top:-3px;bottom:-3px;width:1px;background:var(--ui-chart-axis)}
  .zb-diverge__fill{position:absolute;top:0;bottom:0;left:var(--l);width:var(--w);border-radius:4px;background:var(--ui-chart-1)}
  .zb-alts{display:grid;gap:6px;margin-top:8px;padding:10px 12px;border-radius:var(--ui-radius-md);background:var(--ui-surface-2)}
  .zb-alts__list{display:grid;gap:6px;margin:0;padding:0;list-style:none}
  .zb-alts__list li{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;font:400 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font)}
  .zb-alts__list li span{flex:1 1 160px;color:var(--ui-text-2)}
  .zb-context-note{display:flex;align-items:flex-start;gap:6px;margin-top:4px;color:var(--ui-text)}
  .zb-context-note .ui-icon{flex:none;width:16px;height:16px;margin-top:2px;color:var(--ui-text-2)}
  .zb-source-line{margin:0}
  .zb-detail__total .ui-badge{justify-self:start;margin-top:4px}

  /* ---------- Positionen / Detail */
  .zb-amount-trail{flex-direction:row;align-items:center;gap:8px}
  .zb-amount{font:600 var(--ui-fs-body)/var(--ui-lh-body) var(--ui-font);font-variant-numeric:tabular-nums;white-space:nowrap}
  .zb-amount-trail .ui-row__chevron{margin-top:0}
  .zb-total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:12px 16px;border-radius:var(--ui-radius-md);background:var(--ui-surface-2);font:500 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);color:var(--ui-text-2)}
  .zb-total strong{font:700 var(--ui-fs-h3)/var(--ui-lh-h3) var(--ui-font);color:var(--ui-text)}
  .zb-detail>h2{font:650 var(--ui-fs-h2)/var(--ui-lh-h2) var(--ui-font)}
  .zb-detail>h3{font:650 var(--ui-fs-h3)/var(--ui-lh-h3) var(--ui-font)}
  .zb-detail__total{display:grid;gap:2px}
  .zb-detail__total strong{font:700 var(--ui-fs-kpi)/var(--ui-lh-kpi) var(--ui-font);letter-spacing:-.02em}
  .zb-values dd{font-variant-numeric:tabular-nums}
  .zb .ui-facts dd{overflow-wrap:break-word;hyphens:auto}
  .zb-facts-list{display:grid;gap:4px;margin:0;padding-left:1.1em;color:var(--ui-text)}
  .zb-facts-list:empty{display:none}

  /* ---------- Linienchart Mitglieder (Beschriftungen in HTML, damit sie nicht mitskalieren) */
  .zb-line{position:relative;height:220px;margin:8px 0 0}
  @media (min-width:768px){.zb-line{height:260px}}
  .zb-line__plot{position:absolute;inset:28px 24px 32px 64px}
  .zb-line__svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
  .zb-line__svg .ui-grid{stroke-width:1}
  .zb-line__svg polyline{fill:none;stroke:var(--ui-chart-1);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
  .zb-line__dot{position:absolute;left:var(--x);top:var(--y);width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--ui-chart-1);box-shadow:0 0 0 2px var(--ui-surface)}
  .zb-line__value{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-30px);font:650 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);font-variant-numeric:tabular-nums;color:var(--ui-text);white-space:nowrap}
  .zb-line__year{position:absolute;left:var(--x);bottom:-26px;transform:translateX(-50%);font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-chart-label)}
  .zb-line__tick{position:absolute;left:-60px;width:40px;top:var(--y);transform:translateY(-50%);text-align:right;font:500 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);font-variant-numeric:tabular-nums;color:var(--ui-chart-label)}
  @media (max-width:479px){.zb-line__year.is-minor{display:none}}

  /* ---------- Import */
  .zb-dropzone{position:relative}
  .zb-dropzone input[type=file]{max-width:100%;font:400 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);color:var(--ui-text-2)}
  .zb-dropzone input[type=file]::file-selector-button{margin-right:12px;min-height:40px;padding:0 14px;border:1px solid var(--ui-border-strong);border-radius:var(--ui-radius-md);background:var(--ui-surface);color:var(--ui-text);font:600 var(--ui-fs-ui)/1 var(--ui-font);cursor:pointer}
  .zb-dropzone small{font:400 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .zb-checklist{display:grid;gap:0;margin:0;padding:0;list-style:none}
  .zb-checklist li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:2px 10px;padding:10px 0;border-top:1px solid var(--ui-border)}
  .zb-checklist li:first-child{border-top:0;padding-top:0}
  .zb-checklist .ui-icon{width:20px;height:20px;grid-row:span 2}
  .zb-checklist .is-pass .ui-icon{color:var(--ui-success-fg)}
  .zb-checklist .is-warn .ui-icon{color:var(--ui-warning-icon)}
  .zb-checklist .is-fail .ui-icon,.zb-checklist .is-block .ui-icon,.zb-checklist .is-error .ui-icon{color:var(--ui-danger-fg)}
  .zb-checklist strong{font:600 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font)}
  .zb-checklist small{font:400 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .zb-check-field{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;align-items:start;font:400 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);color:var(--ui-text);cursor:pointer}
  .zb-check-field input{width:22px;height:22px;margin:0;accent-color:var(--ui-primary)}
  .zb-proposal-row{display:grid;gap:10px}
  .zb-proposal-row+.zb-proposal-row{padding-top:16px;border-top:1px solid var(--ui-border)}
  .zb-proposal-row .ui-row__meta{gap:4px 10px}
  fieldset.zb-group{margin:0;min-width:0}
  fieldset.zb-group>legend{float:left;width:100%;padding:0;margin:0 0 12px;font:650 var(--ui-fs-h3)/var(--ui-lh-h3) var(--ui-font)}
  fieldset.zb-group>legend+*{clear:both}
  fieldset.zb-group:disabled{opacity:1}
  .zb-quote{margin:0;padding:8px 12px;border-left:3px solid var(--ui-border-strong);background:var(--ui-surface-2);border-radius:0 var(--ui-radius-sm) var(--ui-radius-sm) 0;font:400 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font);color:var(--ui-text-2)}
  .zb-agenda{margin:0;padding-left:1.4em;display:grid;gap:4px;font:400 var(--ui-fs-small)/var(--ui-lh-small) var(--ui-font)}
  .zb-pre{max-height:420px;overflow:auto;margin:0;padding:12px 14px;border:1px solid var(--ui-border);border-radius:var(--ui-radius-md);background:var(--ui-surface-2);color:var(--ui-text);font:400 var(--ui-fs-small)/1.55 var(--ui-font-mono);white-space:pre-wrap;overflow-wrap:anywhere}
  .zb-actionbar{position:sticky;bottom:calc(var(--ui-tabbar-h) + env(safe-area-inset-bottom) + 8px);z-index:var(--ui-z-sticky);display:grid;gap:12px;padding:14px 16px;border:1px solid var(--ui-border-strong);border-radius:var(--ui-radius-lg);background:var(--ui-surface-raised);box-shadow:var(--ui-shadow-3)}
  @media (min-width:768px){.zb-actionbar{bottom:16px;grid-template-columns:minmax(0,1fr) auto;align-items:center;padding:14px 20px}}
  .zb-actionbar__text{margin:0;font:400 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2);grid-column:1/-1}
  .zb-actionbar .ui-btn{justify-self:stretch}
  @media (min-width:768px){.zb-actionbar .ui-btn{justify-self:end}}
  .zb-inline-form{display:inline}
  .zb-stack{display:grid;gap:12px;justify-items:start}
  .zb-stack>*{max-width:100%}
  .zb-stack>.ui-banner,.zb-stack>.ui-card,.zb-stack>fieldset,.zb-stack>.zb-actionbar,.zb-stack>.ui-form,.zb-stack>.zb-reanalysis{justify-self:stretch}
  .zb-stack>form{margin:0}
  .zb .zb-stack>*+*{margin-top:0}

  /* ---------- Benutzer */
  .zb-users{display:grid;gap:16px}
  @media (min-width:1024px){.zb-users{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}}
  .zb-user__head{display:flex;align-items:center;gap:12px}
  .zb-user__head h3{font:650 var(--ui-fs-h3)/var(--ui-lh-h3) var(--ui-font)}
  .zb-user__head p{margin:0;font:400 var(--ui-fs-meta)/var(--ui-lh-meta) var(--ui-font);color:var(--ui-text-2)}
  .zb-user__head>div{flex:1 1 auto;min-width:0}
  .zb-user form{display:grid;gap:12px}
  .zb-user form+form,.zb-user form+.zb-user__foot,.zb-user .zb-user__invite{padding-top:16px;border-top:1px solid var(--ui-border)}
  .zb-user__row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px}
  .zb-user__row>.ui-field{flex:1 1 200px}
  .zb-user__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px}
  .zb-presence-dot{display:block;width:10px;height:10px;margin:7px 4px 0;border-radius:50%;border:2px solid var(--ui-border-strong)}
  .zb-presence-dot.is-online{border-color:var(--ui-success-fg);background:var(--ui-success-fg)}
  .zb-invite-link{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
  .zb-invite-link input{flex:1 1 260px}

  /* ---------- Quellen */
  .zb-review-form{display:grid;gap:8px;margin-top:10px}
  .zb-review-form .ui-field textarea{min-height:72px}
  .zb-review-form__foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
}