:root {
  /* Status- und Akzent-Tokens auch im Dark Theme (DESIGN_SYSTEM.md §2.1, 23.09.2026) */
  --white-accent: #5b8fff;
  --white-success: #1f9d55;
  --white-success-soft: rgba(31, 157, 85, 0.16);
  --white-warning: #f59e0b;
  --white-danger: #e03131;
  --font-size-sm: 0.8125rem;
  /* Anlage-Farben (DESIGN_SYSTEM.md §2.1 „Anlage-Farblogik“, fest, nie tauschen) */
  --anlage-fondspolice: #5b8fff;
  --anlage-depot: #fbbf24;
  --anlage-avdepot: #f97316;
  --anlage-rurup: #4ade80;
  /* Bootstrap-Primary an die Design-/Accent-Farbe koppeln (siehe light.css).
     Ohne Accent = Standardblau; Anlageform-Farben (hardcoded) unberührt. */
  --bs-primary: var(--accent-color, #0d6efd);
  --bs-primary-rgb: var(--accent-rgb, 13, 110, 253);
  /* Radius-Tokens */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --radius-circle: 50%;
  /* Bootstrap-Override: Komponenten ohne projekteigene Radius-Regel */
  --bs-border-radius: var(--radius-sm);
  --bs-border-radius-sm: 6px;
  --bs-border-radius-lg: var(--radius-lg);
  --bs-border-radius-pill: var(--radius-pill);
  --app-html-height: 100vh;
  --app-html-min-height: 100vh;
  --app-html-background: transparent;
  --app-font-size: 0.875rem;
  --app-background: #040A14;
  /* Soft-Surface fuer Hauptbereich-Container, Header, Sekundaer-Buttons.
     Navy-Variante (leicht heller als App-bg) — passt zum alten Dark-Mode
     (Navy statt Grau). */
  --surface-soft-bg: #0c1526;
  /* Anlage-Picker (Sidebar-Anlagefinder): Aliased auf surface-soft-bg, sodass
     die Anlageklassen-Haelfte des Pickers spaeter leicht auf eine andere Color
     umgeschaltet werden kann (z.B. Whitelabeling). */
  --picker-anlage-bg: var(--surface-soft-bg);
  /* Generisches Hover-Glow analog zum Light-Mode — heller Tint statt
     dunklerer (auf dunklem BG bringt Aufhellung den "Leuchten"-Effekt). */
  --hover-glow-bg: rgba(255, 255, 255, 0.06);
  --hover-glow-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08);
  /* Float-Halo-Token analog Light. In Dark schattenlos, weil Cards sich
     allein durch den helleren BG-Stufung gegen den dunklen App-BG abheben
     (siehe cards.css ~Z.142). Bei Bedarf spaeter auf eine dunkle Variante
     (z.B. 0 2px 16px rgba(0,0,0,0.45)) umstellbar. */
  --surface-shadow-soft: none;
  --app-background-image: radial-gradient(circle at center, rgba(4, 10, 20, 1) 0%, rgba(4, 10, 20, 0.9) 30%, rgba(4, 10, 20, 0.6) 60%, rgba(4, 10, 20, 0) 80%), radial-gradient(circle, rgba(255, 255, 255, 0.1) 1px, transparent 1px);
  --app-background-repeat: no-repeat, repeat;
  --app-background-size: 100% 100%, 20px 20px;
  --app-background-position: center;
  --app-text-color: rgba(241, 245, 249, 0.92);
  --pdf-preview-background: rgba(10, 18, 36, 0.92);
  --app-body-height: 100vh;
  --app-body-min-height: 100vh;
  --app-letter-spacing: normal;
  --app-line-height: 1.5;
  --auto-calc-bg: linear-gradient(135deg, rgba(27, 41, 76, 0.95) 0%, rgba(11, 24, 53, 0.82) 52%, rgba(var(--accent-rgb, 92, 152, 255), 0.32) 100%);
  --auto-calc-border: rgba(var(--accent-rgb, 92, 152, 255), 0.38);
  --auto-calc-text: #f6f9ff;
  --auto-calc-subtext: rgba(198, 218, 255, 0.78);
  --auto-calc-ring: rgba(255, 255, 255, 0.95);
  --auto-calc-ring-secondary: rgba(var(--accent-rgb, 92, 152, 255), 0.88);
  --auto-calc-glow: rgba(var(--accent-rgb, 92, 152, 255), 0.55);
  --auto-calc-card-shadow-base: 0 18px 38px -18px rgba(var(--accent-rgb, 92, 152, 255), 0.55), 0 12px 26px -20px rgba(0, 0, 0, 0.6);
  --auto-calc-card-shadow-peak: 0 26px 48px -16px rgba(var(--accent-rgb, 92, 152, 255), 0.6), 0 14px 30px -18px rgba(0, 0, 0, 0.55);
  --auto-calc-sheen-gradient: linear-gradient(120deg, rgba(255, 255, 255, 0.25), rgba(255, 255, 255, 0.08) 40%, rgba(var(--accent-rgb, 92, 152, 255), 0.45) 60%, rgba(255, 255, 255, 0.05) 75%, transparent 90%);
  --auto-calc-sheen-start: -140%;
  --auto-calc-sheen-end: 140%;
  --auto-calc-sheen-opacity: 0.7;
  --auto-calc-spinner-secondary-opacity: 0.82;
  --nav-height: 60px;
  --nav-brand-color: #ffffff;
  --nav-brand-hover-color: #ffffff;
  --nav-link-color: rgba(255, 255, 255, 0.8);
  --nav-link-hover-color: var(--accent-color, #5c98ff);
  --nav-link-active-color: var(--accent-color, #337eff);
  --nav-dropdown-toggle-color: #ffffff;
  --nav-dropdown-hover-color: #ffffff;
  --nav-dark-brand-color: #ffffff;
  --nav-dark-brand-hover-color: #ffffff;
  /* Header halbtransparent schwarz — Dark-Variante. */
  --nav-dark-background: rgba(0, 0, 0, 0.7);
  --nav-header-border: rgba(255, 255, 255, 0.08);
  --nav-header-shadow: none;
  --nav-dark-link-color: rgb(188, 197, 201);
  --nav-dark-link-hover-color: rgb(255, 255, 255);
  --nav-tabs-link-color: rgba(255, 255, 255, 0.8);
  --nav-tabs-link-hover-color: var(--accent-color, #337eff);
  --nav-tabs-link-active-color: var(--accent-color, #5c98ff);
  --nav-tabs-link-active-border: var(--accent-color, #5c98ff);
  --nav-tabs-link-active-border-width: 3px;
  --nav-tabs-link-active-weight: 500;
  --nav-tabs-icon-color: var(--accent-color, #5c98ff);
  --nav-pills-active-bg: var(--accent-color, rgb(15, 76, 154));
  --nav-tool-font-size: 15px;
  --nav-tool-hover-font-size: 15px;
  --nav-tool-color: rgb(255, 255, 255);
  --nav-tool-hover-color: rgb(var(--accent-rgb, 92, 152, 255));
  --nav-tool-active-color: rgb(15, 76, 154);
  --nav-bottom-background: rgba(0, 0, 0, 0.7);
  --nav-bottom-color: rgb(188, 197, 201);
  --nav-bottom-hover-color: rgb(255, 255, 255);
  --nav-sidebar-background: #ffffff;
  --nav-sidebar-border: rgba(0, 0, 0, 0.1);
  --nav-sidebar-link-color: inherit;
  --nav-sidebar-hover-bg: rgba(var(--accent-rgb, 92, 152, 255), 0.2);
  --nav-sidebar-hover-color: #007bff;
  --form-focus-border: rgb(188, 197, 201);
  --form-focus-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(80, 80, 80, 0.6);
  --form-control-bg: #1c2533;
  --form-control-bg-focus: #243041;
  --form-control-border: rgba(255, 255, 255, 0.22);
  /* Vorberechneter Wert: form-control-border rgba(255,255,255,0.22) gemischt
     ueber form-control-bg #1c2533. Solid statt transparent, weil die Trenn-
     linie ohne eigenen Backdrop direkt auf dem App-Background liegt — semi-
     transparent wuerde dort anders mischen als an der Form-Control-Border.
     Bei Aenderung der form-control-border-Opacity manuell mitziehen. */
  --sidebar-divider-color: #4e5560;
  --form-control-color: #ffffff;
  --form-control-placeholder: rgba(255, 255, 255, 0.55);
  --form-control-placeholder-focus: rgba(255, 255, 255, 0.35);
  --form-control-disabled-bg: #1a202c;
  --form-control-disabled-color: #d9dfe5;
  --form-control-autofill-bg: rgba(255, 255, 255, 0.85);
  --form-control-autofill-color: #0a0a14;
  --locked-input-opacity: 0.5;
  --locked-input-bg: rgba(18, 24, 36, 0.95);
  --locked-input-color: rgba(180, 190, 210, 0.75);
  --locked-input-border: rgba(255, 255, 255, 0.12);
  --locked-input-overlay: rgba(0, 0, 0, 0.15);
  --form-check-label-color: rgba(255, 255, 255, 0.85);
  --form-check-link-color: #ffffff;
  --form-check-link-hover-color: var(--accent-color, #5c98ff);
  --form-check-label-hover-color: #ffffff;
  --range-thumb-bg: rgb(15, 76, 154);
  --range-thumb-border: hidden;
  --range-thumb-shadow: none;
  --custom-control-label-color: rgba(240, 242, 248, 0.92);
  --custom-control-label-hover-color: #ffffff;
  --custom-control-border-color: rgba(148, 163, 184, 0.45);
  --custom-control-background: #1c2533;
  --custom-control-shadow: none;
  --custom-control-checked-background: var(--accent-color, #5c98ff);
  --custom-control-checked-border: var(--accent-color, #5c98ff);
  --custom-control-focus-shadow: 0 0 0 0.2rem rgba(var(--accent-rgb, 92, 152, 255), 0.28);
  /* Switch OFF state */
  --switch-track-solid-bg: rgba(var(--accent-rgb, 92, 152, 255), 0.2);
  --switch-track-bg: linear-gradient(135deg, rgba(var(--accent-rgb, 92, 152, 255), 0.24), rgba(var(--accent-rgb, 92, 152, 255), 0.14));
  --switch-track-border: rgba(var(--accent-rgb, 92, 152, 255), 0.48);
  --switch-track-shadow: inset 0 1px 2px rgba(4, 10, 20, 0.65), 0 1px 2px rgba(4, 10, 20, 0.52);
  --switch-track-hover-solid-bg: rgba(var(--accent-rgb, 92, 152, 255), 0.28);
  --switch-track-hover-bg: linear-gradient(135deg, rgba(var(--accent-rgb, 92, 152, 255), 0.32), rgba(var(--accent-rgb, 92, 152, 255), 0.18));
  --switch-track-hover-border: rgba(var(--accent-rgb, 92, 152, 255), 0.62);
  --switch-track-hover-shadow: inset 0 1px 2px rgba(4, 10, 20, 0.72), 0 0 0 0.3rem rgba(var(--accent-rgb, 92, 152, 255), 0.2);
  --switch-track-focus-border: rgba(var(--accent-rgb, 92, 152, 255), 0.7);
  --switch-track-focus-shadow: inset 0 1px 2px rgba(4, 10, 20, 0.78), 0 0 0 0.35rem rgba(var(--accent-rgb, 92, 152, 255), 0.28);
  /* Switch ON state */
  --switch-track-checked-solid-bg: var(--accent-color, #2563eb);
  --switch-track-checked-bg: linear-gradient(135deg, rgba(var(--accent-rgb, 92, 152, 255), 0.95), var(--accent-color, #2563eb));
  --switch-track-checked-border: var(--accent-color, #2563eb);
  /* TEST: weisser Rim entfaellt — checked uebernimmt 1:1 den
     --switch-track-shadow vom OFF-Zustand (Z.131). Beide Zustaende
     teilen die Tiefen-Optik (dunkler Inset + dezenter Outer-Drop),
     nur Farbe wechselt. Kein Highlight-Rim mehr.
     Revert: zurueck auf inset 0 0 0 1px rgba(255,255,255,0.25). */
  --switch-track-checked-shadow: inset 0 1px 2px rgba(4, 10, 20, 0.65), 0 1px 2px rgba(4, 10, 20, 0.52);
  --switch-track-checked-hover-solid-bg: var(--accent-color, #1d4ed8);
  --switch-track-checked-hover-bg: linear-gradient(135deg, var(--accent-color, #2563eb), var(--accent-color, #1d4ed8));
  --switch-track-disabled-shadow: inset 0 1px 2px rgba(4, 10, 20, 0.58);
  --switch-track-disabled-opacity: 0.55;
  --switch-thumb-bg: linear-gradient(145deg, rgba(160, 180, 210, 0.95) 15%, rgba(120, 145, 185, 0.88) 85%);
  --switch-thumb-shadow: 0 4px 12px -3px rgba(var(--accent-rgb, 92, 152, 255), 0.4), 0 2px 6px -3px rgba(0, 0, 0, 0.6);
  --switch-thumb-hover-shadow: 0 5px 14px -3px rgba(var(--accent-rgb, 92, 152, 255), 0.45), 0 3px 8px -4px rgba(0, 0, 0, 0.65);
  --switch-thumb-checked-bg: linear-gradient(145deg, rgba(200, 215, 240, 1) 10%, rgba(160, 185, 225, 0.95) 95%);
  --switch-thumb-checked-shadow: 0 6px 16px -4px rgba(54, 110, 255, 0.48), 0 4px 10px -4px rgba(0, 0, 0, 0.68);
  --wl-surface-bg: linear-gradient(145deg, rgba(17, 26, 45, 0.96), rgba(8, 14, 28, 0.98));
  --wl-surface-border: rgba(var(--accent-rgb, 92, 152, 255), 0.26);
  --wl-surface-shadow: 0 18px 36px rgba(4, 10, 20, 0.65);
  --wl-surface-hover-shadow: 0 24px 42px rgba(4, 10, 20, 0.72);
  --wl-surface-overlay: linear-gradient(135deg, rgba(var(--accent-rgb, 92, 152, 255), 0.18) 0%, rgba(20, 35, 70, 0.45) 45%, rgba(4, 10, 20, 0.85) 100%);
  --wl-editor-bg: rgba(9, 15, 30, 0.95);
  --wl-editor-text: rgba(236, 243, 255, 0.95);
  --wl-editor-border: rgba(var(--accent-rgb, 92, 152, 255), 0.28);
  --wl-editor-placeholder: rgba(148, 163, 184, 0.65);
  --wl-editor-caret: var(--accent-color, #5c98ff);
  --wl-editor-focus-border: var(--accent-color, #5c98ff);
  --wl-editor-focus-shadow: 0 0 0 0.3rem rgba(var(--accent-rgb, 92, 152, 255), 0.24);
  --wl-toolbar-bg: linear-gradient(145deg, rgba(14, 24, 42, 0.96), rgba(6, 12, 24, 0.98));
  --wl-toolbar-border: rgba(var(--accent-rgb, 92, 152, 255), 0.26);
  --wl-toolbar-button-bg: transparent;
  --wl-toolbar-button-color: rgba(236, 243, 255, 0.92);
  --wl-toolbar-button-hover-bg: rgba(var(--accent-rgb, 92, 152, 255), 0.18);
  --wl-toolbar-button-hover-border: rgba(var(--accent-rgb, 92, 152, 255), 0.35);
  --wl-toolbar-button-hover-color: #ffffff;
  --wl-toolbar-button-active-bg: var(--accent-color, #5c98ff);
  --wl-toolbar-button-active-border: var(--accent-color, #5c98ff);
  --wl-toolbar-button-active-color: #040a14;
  --wl-toolbar-button-active-shadow: 0 12px 24px rgba(var(--accent-rgb, 92, 152, 255), 0.32);
  --wl-toolbar-button-focus-shadow: 0 0 0 0.26rem rgba(var(--accent-rgb, 92, 152, 255), 0.28);
  --wl-toolbar-dropdown-bg: rgba(9, 16, 32, 0.98);
  --wl-toolbar-dropdown-border: rgba(var(--accent-rgb, 92, 152, 255), 0.3);
  --wl-toolbar-dropdown-color: rgba(236, 243, 255, 0.92);
  --wl-toolbar-divider: rgba(var(--accent-rgb, 92, 152, 255), 0.25);
  --wl-toolbar-button-shadow: 0 2px 8px rgba(4, 10, 20, 0.6);
  --wl-toolbar-button-hover-shadow: 0 12px 24px rgba(var(--accent-rgb, 92, 152, 255), 0.32);
  --wl-toolbar-glyph-bg: rgba(var(--accent-rgb, 92, 152, 255), 0.1);
  --wl-toolbar-glyph-hover-bg: rgba(var(--accent-rgb, 92, 152, 255), 0.28);
  --wl-select-border: rgba(var(--accent-rgb, 92, 152, 255), 0.28);
  --wl-select-background: rgba(9, 16, 32, 0.96);
  --wl-select-color: rgba(236, 243, 255, 0.92);
  --wl-select-focus-border: var(--accent-color, #5c98ff);
  --wl-select-focus-shadow: 0 0 0 0.26rem rgba(var(--accent-rgb, 92, 152, 255), 0.22);
  --wl-dropzone-bg: linear-gradient(180deg, rgba(12, 20, 38, 0.96), rgba(6, 12, 24, 0.98));
  --wl-dropzone-border: rgba(var(--accent-rgb, 92, 152, 255), 0.32);
  --wl-dropzone-color: rgba(208, 218, 246, 0.86);
  --wl-dropzone-hover-bg: rgba(14, 24, 44, 0.98);
  --wl-dropzone-hover-border: var(--accent-color, #5c98ff);
  --wl-dropzone-hover-shadow: 0 0 0 0.3rem rgba(var(--accent-rgb, 92, 152, 255), 0.22);
  --wl-meta-bg: rgba(12, 20, 38, 0.92);
  --wl-meta-color: rgba(208, 218, 246, 0.75);
  --wl-meta-subtle: rgba(208, 218, 246, 0.6);
  --wl-meta-count: var(--accent-color, #5c98ff);
  --wl-meta-warning: #ff6b6b;
  --wl-meta-warning-bg: rgba(255, 107, 107, 0.18);
  --wl-editor-scrollbar-thumb: rgba(var(--accent-rgb, 92, 152, 255), 0.35);
  --wl-editor-scrollbar-track: rgba(6, 12, 24, 0.6);
  --wl-editor-link: #8ab4ff;
  --sub-accordion-background: rgba(15, 23, 42, 0.95);
  --sub-accordion-border: rgba(71, 85, 105, 0.3);
  --sub-accordion-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.4), 0 10px 10px -5px rgba(0, 0, 0, 0.2);
  --sub-accordion-blur: blur(16px);
  --sub-accordion-text: inherit;
  --accordion-bg: #1c1f2b;
  --accordion-bg-active: #293248;
  --accordion-hover-bg: #293248;
  --accordion-border: rgba(71, 85, 105, 0.35);
  --accordion-text: rgba(255, 255, 255, 0.88);
  --accordion-hover-text: #ffffff;
  --accordion-body-bg: #1c1f2b;
  --accordion-body-text: rgba(255, 255, 255, 0.8);
  --accordion-list-bg: #1c1f2b;
  --accordion-list-hover-bg: #293248;
  --accordion-list-text: rgba(255, 255, 255, 0.8);
  --accordion-list-hover-text: #ffffff;
  --accordion-icon-filter: brightness(2.4) drop-shadow(0 0 6px rgba(var(--accent-rgb, 92, 152, 255), 0.6));
  --accordion-icon-opacity: 0.9;
  --accordion-icon-active-filter: brightness(2.8) drop-shadow(0 0 10px rgba(var(--accent-rgb, 92, 152, 255), 0.75));
  --accordion-icon-active-opacity: 1;
  --badge-strong-text-color: #ffffff;
  --badge-soft-text-color: #0f172a;
  --heading-color: rgba(240, 242, 248, 0.92);
  --heading-weight: 600;
  --heading-h1-color: #ffffff;
  --heading-h2-color: #e5e5e5;
  --heading-h3-color: #dcdcdc;
  --heading-h456-color: #cccccc;
  --heading-hover-color: #ffffff;
  --body-text-color: rgba(224, 232, 255, 0.82);
  --lead-font-size: 1.0625rem;
  --lead-text-color: rgba(224, 232, 255, 0.85);
  --section-title-color: #ffffff;
  --section-subtitle-color: rgba(219, 227, 255, 0.78);
  --strikethrough-line-width: 2px;
  --mini-info-color: rgba(188, 197, 201, 0.85);
  --mini-info-margin-right: 170px;
  --mini-info-hover-color: #ffffff;
  --back-to-top-color: rgb(15, 76, 154);
  --back-to-top-hover-color: rgba(15, 76, 154, 0.5);
  --legend-item-gap: 20px;
  --legend-circle-size: 15px;
  --legend-circle-margin: 5px;
  --legend-alpha-color: rgb(220, 53, 69);
  --legend-beta-color: rgb(13, 110, 253);
  --legend-gamma-color: rgb(117, 126, 133);
  --legend-rent-color: rgb(163, 128, 230);
  --plot-add-color: rgb(76, 154, 15);
  --plot-delete-color: rgb(154, 76, 15);
  --plot-ins-delete-color: rgb(50, 50, 50);
  --plot-action-hover-color: rgb(255, 255, 255);
  --plot-add-offset: 3px;
  --plot-delete-offset: 3px;
  --plot-ins-delete-offset: 3px;
  --multi-plot-carousel-height: 100vh;
  --multi-plot-carousel-max-height: 100vh;
  --theme-switch-icon-color: rgba(255, 255, 255, 0.85);
  --theme-switch-sun-color: #ffffff;
  --theme-switch-moon-color: #ffffff;
  --carousel-control-filter: invert(30%);
  --carousel-control-size: 30px;
  --carousel-icon-size: 30px;
  --carousel-prev-icon: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
  --carousel-next-icon: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
  --sidebar-title-color: rgba(224, 232, 255, 0.92);
  --sidebar-link-color: rgba(229, 233, 245, 0.85);
  --sidebar-link-hover-bg: rgba(var(--accent-rgb, 92, 152, 255), 0.25);
  --sidebar-link-hover-color: #ffffff;
  --sidebar-links-gap: 10px;
  --sidebar-link-padding: 5px 10px;
  --sidebar-submenu-gap: 10px;
  --sidebar-submenu-indent: 10px;
  --content-padding: 12px;
  --content-padding-top: 4px;
  --content-padding-right: calc(var(--content-padding, 12px) + 6px);
  --content-padding-left: calc(var(--content-padding, 12px) + 6px);
  --info-icon-color: rgba(224, 232, 255, 0.95);
  --info-icon-hover-bg: rgba(var(--accent-rgb, 92, 152, 255), 0.18);
  --info-icon-hover-shadow: 0 0 0 2px rgba(var(--accent-rgb, 92, 152, 255), 0.28);
  --info-icon-hover-color: rgba(255, 255, 255, 0.98);
  --info-icon-danger-color: #dc3545;
  --info-icon-danger-hover-bg: rgba(220, 53, 69, 0.18);
  --info-icon-danger-hover-shadow: 0 0 0 3px rgba(220, 53, 69, 0.35);
  --card-radius: var(--radius-md);
  --card-border-width: 1px;
  --card-border: rgba(var(--accent-rgb, 92, 152, 255), 0.28);
  --card-padding: 18px;
  --card-background: linear-gradient(145deg, rgba(24, 32, 54, 0.88), rgba(10, 18, 36, 0.92));
  --card-overlay: radial-gradient(140% 140% at 0% 0%, rgba(var(--accent-rgb, 92, 152, 255), 0.22), transparent 62%);
  --card-overlay-secondary: radial-gradient(140% 140% at 100% 0%, rgba(37, 99, 235, 0.18), transparent 68%);
  --card-overlay-opacity: 0.45;
  --card-overlay-secondary-opacity: 0.3;
  --card-overlay-hover-opacity: 0.65;
  --card-overlay-secondary-hover-opacity: 0.45;
  --card-overlay-inset: -45%;
  --card-overlay-transform: rotate(16deg);
  --card-overlay-secondary-transform: rotate(-18deg);
  --card-overlay-hover-transform: rotate(4deg);
  --card-overlay-secondary-hover-transform: rotate(-4deg);
  --card-hover-transform: none;
  --card-backdrop-filter: none;
  --card-shadow: 0 28px 52px -26px rgba(4, 8, 18, 0.78), inset 0 0 0 1px rgba(var(--accent-rgb, 92, 152, 255), 0.14);
  --card-shadow-hover: 0 36px 68px -30px rgba(8, 18, 36, 0.85), 0 0 0 1px rgba(var(--accent-rgb, 92, 152, 255), 0.26);
  --card-color: #ffffff;
  --av-effect-card-bg: rgba(255, 255, 255, 0.92);
  --av-effect-card-border: rgba(15, 23, 42, 0.12);
  --av-effect-card-foreground: #0f172a;
  --av-effect-card-muted: rgba(71, 85, 105, 0.82);
  --av-effect-card-positive: #34d399;
  --av-effect-footnote-color: rgba(71, 85, 105, 0.8);
  --av-effect-card-shadow: none;
  --flash-border-radius: 14px;
  --flash-border-color: rgba(var(--accent-rgb, 92, 152, 255), 0.35);
  --flash-background-color: rgba(9, 14, 27, 0.88);
  --flash-text-color: rgba(230, 237, 255, 0.92);
  --flash-shadow: 0 16px 38px -28px rgba(4, 8, 18, 0.8);
  --flash-shadow-hover: 0 28px 56px -28px rgba(8, 18, 36, 0.62);
  --flash-default-accent: #3b82f6;
  --flash-link-color: #93c5fd;
  --flash-link-hover-color: #bfdbfe;
  --flash-close-filter: invert(1);
  --flash-close-hover-bg: rgba(255, 255, 255, 0.12);
  --flash-close-focus-ring: rgba(59, 130, 246, 0.45);
  --flash-success-background: rgba(25, 135, 84, 0.22);
  --flash-success-border: rgba(25, 135, 84, 0.42);
  --flash-success-text: rgba(223, 255, 239, 0.95);
  --flash-warning-background: rgba(255, 193, 7, 0.2);
  --flash-warning-border: rgba(255, 193, 7, 0.38);
  --flash-warning-text: rgba(255, 248, 220, 0.92);
  --flash-danger-background: rgba(220, 53, 69, 0.22);
  --flash-danger-border: rgba(220, 53, 69, 0.4);
  --flash-danger-text: rgba(255, 228, 232, 0.95);
  --flash-info-background: rgba(13, 110, 253, 0.22);
  --flash-info-border: rgba(13, 110, 253, 0.44);
  --flash-info-text: rgba(220, 234, 255, 0.95);
  /* Bootstrap alerts (non-flash) - dark mode */
  --alert-success-background: rgba(25, 135, 84, 0.22);
  --alert-success-border: rgba(25, 135, 84, 0.42);
  --alert-success-text: rgba(223, 255, 239, 0.95);
  --alert-info-background: rgba(13, 110, 253, 0.22);
  --alert-info-border: rgba(13, 110, 253, 0.44);
  --alert-info-text: rgba(220, 234, 255, 0.95);
  /* TEST: Warnbanner global auf Fonder-Orange (#f59e0b) — siehe
     component_colors.css. Vorher: Bootstrap-Yellow (255,193,7). Revert:
     alte rgba(255,193,7,...)-Werte zurück. */
  --alert-warning-background: rgba(245, 158, 11, 0.16);
  --alert-warning-border: rgba(245, 158, 11, 0.55);
  --alert-warning-text: #f59e0b;
  --alert-danger-background: rgba(220, 53, 69, 0.22);
  --alert-danger-border: rgba(220, 53, 69, 0.4);
  --alert-danger-text: rgba(255, 228, 232, 0.95);
  /* Dezent: leichte transluzente Erhöhung über der Card statt eines dunklen,
     eingelassenen Blocks (vorher = --app-background, dunkler als die Card ->
     wirkte als "Loch" mit grauem Rand). Translucent passt sich dem Untergrund an. */
  --payout-highlight-bg: rgba(255, 255, 255, 0.035);
  --payout-highlight-border: rgba(255, 255, 255, 0.08);
  --payout-highlight-text: rgba(230, 237, 255, 0.9);
  --payout-highlight-title: rgba(255, 255, 255, 0.82);
  --payout-highlight-sub: rgba(219, 227, 255, 0.62);
  --payout-chip-bg: transparent;
  --payout-chip-border: transparent;
  --payout-chip-color: inherit;
  --payout-chip-hover-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  --payout-chip-net-bg: rgba(25, 135, 84, 0.25);
  --payout-chip-net-border: rgba(25, 135, 84, 0.45);
  --payout-chip-net-color: rgba(223, 255, 239, 0.95);
  --payout-chip-brut-bg: rgba(13, 110, 253, 0.25);
  --payout-chip-brut-border: rgba(13, 110, 253, 0.48);
  --payout-chip-brut-color: rgba(220, 234, 255, 0.95);
  --dropdown-bg: #1c1f2b;
  --dropdown-border: rgba(255, 255, 255, 0.1);
  --dropdown-item-color: rgba(255, 255, 255, 0.8);
  --dropdown-item-hover-bg: var(--accent-color, #5c98ff);
  --dropdown-item-hover-color: #ffffff;
  --dropdown-item-active-bg: var(--accent-color, #5c98ff);
  --dropdown-item-active-color: #ffffff;
  --dropdown-divider-color: rgba(255, 255, 255, 0.1);
  --dropdown-toggle-color: rgba(255, 255, 255, 0.8);
  --dropdown-toggle-border: rgba(255, 255, 255, 0.1);
  --dropdown-toggle-hover-bg: var(--accent-color, #5c98ff);
  --dropdown-toggle-hover-color: #ffffff;
  --dropdown-arrow-color: #1c1f2b;
  /* Anlagefinder-Sidebar Buttons */
  --sidebar-pill-active-bg: var(--accent-color, rgb(15, 76, 154));
  --sidebar-pill-active-color: #ffffff;
  /* Sekundaerbutton-BG = Container-Card-Grauton (analog Light). */
  --btn-sidebar-secondary-bg: var(--surface-soft-bg);
  --btn-sidebar-secondary-color: #ffffff;
  --btn-sidebar-secondary-hover-bg: var(--surface-soft-bg);
  --sidebar-element-gap: 24px;
  --sidebar-element-height: 45px;
  --btn-shared-radius: 14px;
  --btn-shared-padding: 0.65rem 1.3rem;
  --btn-shared-gap: 0.45rem;
  --btn-shared-font-size: 0.95rem;
  --btn-shared-weight: 600;
  --btn-shared-letter-spacing: 0.01em;
  --btn-border-width: 1px;
  --btn-focus-ring: 0 0 0 3px rgba(var(--accent-rgb, 92, 152, 255), 0.32);
  --btn-active-translate: 0;
  --btn-hover-translate: -3px;
  --btn-sm-padding: 0.45rem 0.95rem;
  --btn-sm-font-size: 0.85rem;
  --btn-lg-padding: 0.95rem 1.85rem;
  --btn-lg-font-size: 1.08rem;
  --btn-icon-size: 1.05em;
  --btn-shadow: none;
  --btn-custom-bg: linear-gradient(135deg, rgba(18, 30, 52, 0.92), rgba(26, 42, 68, 0.92));
  --btn-custom-border: rgba(var(--accent-rgb, 92, 152, 255), 0.48);
  --btn-custom-color: rgba(224, 232, 255, 0.92);
  --btn-custom-hover-border: rgba(var(--accent-rgb, 92, 152, 255), 0.68);
  --btn-custom-hover-bg: linear-gradient(135deg, rgba(37, 61, 102, 0.95), rgba(46, 78, 124, 0.95));
  --btn-custom-hover-color: #ffffff;
  --btn-primary-bg: linear-gradient(135deg, rgba(var(--accent-rgb, 92, 152, 255), 0.88), rgba(var(--accent-rgb, 51, 126, 255), 0.98));
  --btn-primary-color: #ffffff;
  --btn-primary-border: transparent;
  --btn-primary-shadow: 0 22px 46px -24px rgba(var(--accent-rgb, 51, 126, 255), 0.7);
  --btn-primary-hover-bg: linear-gradient(135deg, rgba(var(--accent-rgb, 51, 126, 255), 0.98), rgba(var(--accent-rgb, 92, 152, 255), 0.88));
  --btn-primary-hover-shadow: 0 30px 60px -26px rgba(var(--accent-rgb, 51, 126, 255), 0.78);
  --btn-secondary-bg: linear-gradient(135deg, rgba(var(--accent-rgb, 92, 152, 255), 0.24), rgba(var(--accent-rgb, 51, 126, 255), 0.38));
  --btn-secondary-color: rgba(255, 255, 255, 0.92);
  --btn-secondary-before-bg: radial-gradient(circle, rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0) 65%);
  --btn-secondary-before-opacity: 0.65;
  --btn-secondary-hover-bg: linear-gradient(135deg, rgba(var(--accent-rgb, 51, 126, 255), 0.38), rgba(var(--accent-rgb, 92, 152, 255), 0.52));
  --btn-secondary-hover-color: #ffffff;
  --btn-secondary-hover-shadow: 0 18px 32px -18px rgba(0, 0, 0, 0.65), 0 0 18px rgba(var(--accent-rgb, 92, 152, 255), 0.55);
  --btn-secondary-before-hover-opacity: 0.9;
  --btn-secondary-active-bg: linear-gradient(135deg, rgba(29, 99, 204, 0.55), rgba(43, 108, 230, 0.65));
  --btn-secondary-active-shadow: 0 6px 14px rgba(0, 0, 0, 0.4);
  --btn-outline-border-width: 2px;
  --btn-outline-backdrop: blur(10px);
  --btn-outline-shadow: 0 14px 30px -18px rgba(8, 18, 36, 0.55);
  --btn-outline-primary-border: rgba(var(--accent-rgb, 92, 152, 255), 0.7);
  --btn-outline-primary-color: rgba(196, 216, 255, 0.92);
  --btn-outline-primary-hover-bg: linear-gradient(135deg, rgba(var(--accent-rgb, 92, 152, 255), 0.9), rgba(var(--accent-rgb, 51, 126, 255), 1));
  --btn-outline-primary-hover-color: #ffffff;
  --btn-outline-primary-hover-shadow: 0 20px 40px -22px rgba(var(--accent-rgb, 92, 152, 255), 0.65);
  --btn-outline-success-border: rgba(34, 197, 94, 0.68);
  --btn-outline-success-color: rgba(209, 250, 229, 0.95);
  --btn-outline-success-shadow: 0 12px 26px -20px rgba(34, 197, 94, 0.5);
  --btn-outline-success-hover-bg: linear-gradient(135deg, rgba(34, 197, 94, 0.85), rgba(22, 163, 74, 0.95));
  --btn-outline-success-hover-color: #ffffff;
  --btn-outline-success-hover-shadow: 0 20px 40px -22px rgba(34, 197, 94, 0.55);
  --btn-outline-warning-color: rgba(255, 212, 128, 0.95);
  --btn-outline-warning-border: rgba(255, 193, 7, 0.75);
  --btn-outline-warning-hover-bg: linear-gradient(135deg, rgba(255, 193, 7, 0.9), rgba(255, 160, 0, 0.95));
  --btn-outline-warning-hover-color: #0b0b0b;
  --btn-outline-warning-hover-shadow: 0 18px 36px -24px rgba(255, 193, 7, 0.55);
  --btn-outline-warning-focus-shadow: 0 0 0 0.24rem rgba(255, 193, 7, 0.38);
  --btn-outline-danger-color: rgba(255, 189, 201, 0.92);
  --btn-outline-danger-border: rgba(239, 68, 68, 0.7);
  --btn-outline-danger-hover-bg: linear-gradient(135deg, rgba(239, 68, 68, 0.88), rgba(220, 38, 38, 0.96));
  --btn-outline-danger-hover-color: #ffffff;
  --btn-outline-danger-hover-shadow: 0 20px 42px -24px rgba(239, 68, 68, 0.58);
  --btn-outline-danger-focus-shadow: 0 0 0 0.24rem rgba(239, 68, 68, 0.4);
  --btn-outline-info-color: rgba(173, 216, 255, 0.95);
  --btn-outline-info-border: rgba(59, 130, 246, 0.7);
  --btn-outline-info-hover-bg: linear-gradient(135deg, rgba(59, 130, 246, 0.92), rgba(37, 99, 235, 1));
  --btn-outline-info-hover-color: #ffffff;
  --btn-outline-info-hover-shadow: 0 20px 42px -24px rgba(59, 130, 246, 0.62);
  --btn-outline-info-focus-shadow: 0 0 0 0.24rem rgba(59, 130, 246, 0.4);
  --btn-outline-light-color: rgba(244, 247, 255, 0.95);
  --btn-outline-light-border: rgba(244, 247, 255, 0.6);
  --btn-outline-light-hover-bg: rgba(244, 247, 255, 0.9);
  --btn-outline-light-hover-color: rgba(10, 18, 32, 0.92);
  --btn-outline-light-hover-shadow: 0 16px 34px -24px rgba(244, 247, 255, 0.6);
  --btn-outline-light-focus-shadow: 0 0 0 0.24rem rgba(244, 247, 255, 0.35);
  --support-fab-size: 68px;
  --support-fab-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --support-fab-color: #ffffff;
  --support-fab-border: rgba(118, 75, 162, 0.5);
  --support-fab-shadow: 
    0 8px 32px -8px rgba(102, 126, 234, 0.6),
    0 4px 16px -4px rgba(118, 75, 162, 0.5),
    0 0 0 1px rgba(255, 255, 255, 0.15) inset;
  --support-fab-hover-bg: linear-gradient(135deg, #764ba2 0%, #667eea 100%);
  --support-fab-hover-border: rgba(255, 255, 255, 0.5);
  --support-fab-hover-shadow: 
    0 12px 40px -8px rgba(102, 126, 234, 0.7),
    0 8px 24px -4px rgba(118, 75, 162, 0.6),
    0 0 0 1px rgba(255, 255, 255, 0.25) inset;
  --support-fab-bottom: 28px;
  --support-fab-right: 28px;
  --support-fab-z-index: 1080;
  --support-fab-icon-size: 26px;
  --support-chat-bg: #16213e;
  --support-chat-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
  --support-chat-messages-bg: #0d1b2a;
  --support-chat-scrollbar: #1b3a5d;
  --support-chat-user-avatar-bg: #1b3a5d;
  --support-chat-user-avatar-color: #94a3b8;
  --support-chat-bot-bubble-bg: #1b2838;
  --support-chat-bot-bubble-color: #e2e8f0;
  --support-chat-bot-bubble-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
  --support-chat-hint-color: #64748b;
  --support-chat-divider: #1b3a5d;
  --support-chat-feedback-btn-border: #1b3a5d;
  --support-chat-feedback-btn-bg: #0d1b2a;
  --support-chat-feedback-btn-color: #94a3b8;
  --support-chat-escalation-bg: linear-gradient(135deg, #422006 0%, #713f12 100%);
  --support-chat-escalation-color: #fcd34d;
  --support-chat-escalation-confirm-bg: linear-gradient(135deg, #1e3a5f 0%, #1e40af30 100%);
  --support-chat-escalation-confirm-border: #3b82f6;
  --support-chat-escalation-confirm-title: #93c5fd;
  --support-chat-escalation-confirm-text: #bfdbfe;
  --support-chat-escalation-confirm-label: #60a5fa;
  --support-chat-escalation-input-bg: #0d1b2a;
  --support-chat-escalation-input-border: #1e40af;
  --support-chat-escalation-input-color: #e2e8f0;
  --support-chat-input-area-bg: #16213e;
  --support-chat-file-preview-bg: #1b3a5d;
  --support-chat-file-name-color: #94a3b8;
  --support-chat-form-bg: #1b3a5d;
  --support-chat-form-focus-shadow: 0 0 0 4px rgba(102, 126, 234, 0.2);
  --support-chat-action-btn-hover-bg: #1b3a5d;
  --support-chat-action-btn-hover-color: #e2e8f0;
  --support-chat-input-color: #e2e8f0;
  --support-chat-footer-link-hover-bg: #1b3a5d;
  --support-chat-warning-bg: rgba(251, 191, 36, 0.1);
  --support-chat-warning-color: #fbbf24;
  --support-chat-chip-bg: #1b3a5d;
  --support-chat-chip-color: #e2e8f0;
  --support-chat-chip-border: #2d4a6f;
  --support-chat-chip-hover-bg: #2d4a6f;
  --support-chat-chip-hover-border: #3d5a7f;
  --btn-outline-secondary-padding: 12px;
  --btn-outline-secondary-color: rgba(232, 240, 255, 0.95);
  --btn-outline-secondary-border-width: 2px;
  --btn-outline-secondary-border: rgba(126, 172, 255, 0.7);
  --btn-outline-secondary-bg: linear-gradient(145deg, rgba(28, 46, 88, 0.45), rgba(18, 32, 62, 0.32));
  --btn-outline-secondary-backdrop: blur(18px);
  --btn-outline-secondary-font-weight: 600;
  --btn-outline-secondary-font-size: 1rem;
  --btn-outline-secondary-shadow: 0 22px 44px -28px rgba(4, 8, 18, 0.8), 0 0 0 1px rgba(var(--accent-rgb, 92, 152, 255), 0.24);
  --btn-outline-secondary-before-bg: radial-gradient(circle, rgba(var(--accent-rgb, 92, 152, 255), 0.28), rgba(var(--accent-rgb, 92, 152, 255), 0) 70%);
  --btn-outline-secondary-before-opacity: 0.58;
  --btn-outline-secondary-before-hover-opacity: 0.8;
  --btn-outline-secondary-hover-color: #ffffff;
  --btn-outline-secondary-hover-bg: linear-gradient(135deg, rgba(var(--accent-rgb, 92, 152, 255), 0.68), rgba(var(--accent-rgb, 51, 126, 255), 0.8));
  --btn-outline-secondary-hover-border: rgba(202, 220, 255, 0.65);
  --btn-outline-secondary-hover-shadow: 0 28px 58px -30px rgba(4, 8, 18, 0.85), 0 0 18px rgba(var(--accent-rgb, 92, 152, 255), 0.55);
  --btn-outline-secondary-hover-backdrop: blur(26px);
  --table-text-color: rgba(246, 250, 255, 0.94);
  /* TEST: Tabellen-Grunddesign Etappe 2 — Card-BG + Trennlinien statt Zebra.
     Revert: alte rgba(20,28,46,0.42)/rgba(24,32,52,0.45)-Token wieder
     auseinanderziehen, --table-backdrop-filter zurück auf
     "blur(20px) brightness(1.1)", Hover wieder "rgba(36,54,88,0.65)". */
  --table-background: var(--card-background);
  --table-header-bg: transparent;
  --table-header-color: rgba(255, 255, 255, 0.98);
  --table-row-bg: transparent;
  --table-row-alt-bg: transparent;
  --table-row-hover-bg: var(--hover-glow-bg);
  --table-row-divider: var(--form-control-border);
  --table-link-color: rgba(142, 186, 255, 0.92);
  --table-link-hover-color: rgba(199, 219, 255, 0.98);
  /* table-box-shadow: 2026-05-13 global auf none gestellt — siehe
     light.css für Begründung. Re-Aktivieren: alten Wert
     "0 8px 20px rgba(0, 0, 0, 0.3)" zurücksetzen. */
  --table-box-shadow: none;
  --table-backdrop-filter: none;
  --modal-radius: 20px;
  --modal-bg: linear-gradient(145deg, rgba(9, 16, 30, 0.98), rgba(18, 30, 52, 0.98));
  --modal-border: rgba(var(--accent-rgb, 92, 152, 255), 0.32);
  --modal-shadow: 0 42px 90px -32px rgba(3, 6, 14, 0.88), 0 0 0 1px rgba(var(--accent-rgb, 92, 152, 255), 0.22);
  --modal-backdrop-filter: none;
  --modal-backdrop-bg: rgba(3, 8, 16, 0.88);
  --modal-backdrop-bg-center: rgba(3, 8, 16, 0.55);
  --modal-header-bg: rgba(12, 22, 38, 0.92);
  --modal-header-color: rgba(236, 243, 255, 0.96);
  --modal-body-color: rgba(214, 224, 250, 0.92);
  --modal-footer-bg: rgba(12, 22, 38, 0.88);
  --modal-divider-color: rgba(var(--accent-rgb, 92, 152, 255), 0.26);
  --modal-close-color: rgba(224, 232, 255, 0.92);
  --modal-close-hover-bg: rgba(var(--accent-rgb, 92, 152, 255), 0.18);
  --modal-close-hover-color: #ffffff;
  --modal-close-filter: brightness(1.4) saturate(1.4) invert(1);
  --modal-close-hover-filter: brightness(1.6) saturate(1.6) invert(1);
  --range-switch-track-bg: #ddd;
  --range-switch-thumb-default-bg: gray;
  --range-switch-thumb-active-bg: rgb(15, 76, 154);
  --binary-switch-background: rgba(15, 23, 42, 0.78);
  --binary-switch-border: rgba(var(--accent-rgb, 92, 152, 255), 0.35);
  --binary-switch-color: rgba(223, 232, 255, 0.72);
  --binary-switch-focus-border: rgba(var(--accent-rgb, 92, 152, 255), 0.75);
  --binary-switch-focus-shadow: 0 0 0 3px rgba(var(--accent-rgb, 92, 152, 255), 0.25);
  --binary-switch-indicator-bg: linear-gradient(135deg, rgba(var(--accent-rgb, 92, 152, 255), 0.35), rgba(var(--accent-rgb, 92, 152, 255), 0.18));
  --binary-switch-indicator-shadow: 0 6px 18px rgba(13, 110, 253, 0.35);
  --binary-switch-active-color: #ffffff;
  --icon-feather-size: 14px;
  --icon-menu-size: 32px;
  --icon-menu-color: #ffffff;
  --icon-chat-size: 42px;
  --icon-chat-color: rgba(255, 255, 255, 0.92);
  --icon-chat-hover-color: rgba(var(--accent-rgb, 92, 152, 255), 0.85);
  --cookie-banner-padding: 26px;
  --cookie-banner-bg: linear-gradient(135deg, rgba(8, 14, 28, 0.95), rgba(12, 22, 38, 0.9));
  --cookie-banner-text: rgba(224, 232, 255, 0.95);
  --cookie-banner-border: rgba(var(--accent-rgb, 92, 152, 255), 0.65);
  --cookie-banner-border-width: 4px;
  --cookie-banner-shadow: rgba(4, 8, 18, 0.68);
  --cookie-banner-backdrop: blur(20px);
  --cookie-banner-highlight: linear-gradient(120deg, rgba(var(--accent-rgb, 92, 152, 255), 0.22), transparent 70%);
  --cookie-banner-highlight-opacity: 1;
  --cookie-banner-pattern: radial-gradient(150% 130% at 0% 0%, rgba(var(--accent-rgb, 92, 152, 255), 0.32), transparent 62%);
  --cookie-banner-pattern-opacity: 0.35;
  --cookie-banner-pattern-transform: rotate(14deg);
  --cookie-heading-color: rgba(236, 243, 255, 0.96);
  --cookie-paragraph-color: rgba(196, 208, 235, 0.92);
  --cookie-category-bg: rgba(18, 27, 46, 0.9);
  --cookie-category-border: rgba(var(--accent-rgb, 92, 152, 255), 0.28);
  --cookie-category-shadow: 0 18px 42px -26px rgba(8, 18, 36, 0.82);
  --cookie-category-backdrop: blur(16px);
  --cookie-category-heading-color: rgba(236, 243, 255, 0.96);
  --cookie-button-color: rgba(224, 232, 255, 0.95);
  --cookie-button-bg: linear-gradient(135deg, rgba(var(--accent-rgb, 92, 152, 255), 0.22), rgba(var(--accent-rgb, 92, 152, 255), 0.34));
  --cookie-button-border: rgba(var(--accent-rgb, 92, 152, 255), 0.45);
  --cookie-button-shadow: 0 16px 36px -22px rgba(8, 18, 36, 0.82);
  --cookie-button-hover-shadow: 0 22px 44px -24px rgba(8, 18, 36, 0.85);
  --cookie-button-accept-bg: linear-gradient(135deg, rgba(16, 185, 129, 0.4), rgba(20, 184, 166, 0.6));
  --cookie-button-accept-color: #ffffff;
  --cookie-button-accept-border: rgba(16, 185, 129, 0.65);
  --cookie-button-accept-shadow: 0 20px 44px -24px rgba(16, 185, 129, 0.7);
  --cookie-button-accept-hover-bg: linear-gradient(135deg, rgba(16, 185, 129, 0.68), rgba(6, 182, 212, 0.78));
  --cookie-button-reject-bg: linear-gradient(135deg, rgba(239, 68, 68, 0.38), rgba(220, 38, 38, 0.58));
  --cookie-button-reject-color: #ffffff;
  --cookie-button-reject-border: rgba(239, 68, 68, 0.68);
  --cookie-button-reject-shadow: 0 20px 44px -24px rgba(239, 68, 68, 0.65);
  --cookie-button-reject-hover-bg: linear-gradient(135deg, rgba(239, 68, 68, 0.7), rgba(220, 38, 38, 0.82));
  --cookie-button-settings-bg: linear-gradient(135deg, rgba(255, 255, 255, 0.16), rgba(var(--accent-rgb, 92, 152, 255), 0.24));
  --cookie-button-settings-color: rgba(224, 232, 255, 0.92);
  --cookie-button-settings-border: rgba(var(--accent-rgb, 92, 152, 255), 0.4);
  --cookie-button-settings-shadow: 0 18px 40px -26px rgba(8, 18, 36, 0.68);
  --cookie-button-settings-hover-bg: linear-gradient(135deg, rgba(255, 255, 255, 0.38), rgba(var(--accent-rgb, 92, 152, 255), 0.38));
  --cookie-button-settings-hover-color: #ffffff;
  --cookie-button-info-bg: linear-gradient(135deg, rgba(59, 130, 246, 0.22), rgba(37, 99, 235, 0.35));
  --cookie-button-info-color: rgba(202, 219, 255, 0.95);
  --cookie-button-info-border: rgba(59, 130, 246, 0.45);
  --cookie-button-info-shadow: 0 18px 40px -26px rgba(59, 130, 246, 0.6);
  --cookie-button-info-hover-bg: linear-gradient(135deg, rgba(59, 130, 246, 0.55), rgba(37, 99, 235, 0.75));
  --cookie-button-info-hover-color: #ffffff;
  --cookie-check-filter: brightness(1.1);
  --cookie-icon-spacing: 6px;
  --loom-overlay-bg: rgba(255, 255, 255, 0.1);
  --loom-spinner-border: rgba(0, 0, 0, 0.3);
  --loom-spinner-border-top: #3b82f6;
  --loom-loading-text-color: #cccccc;
  --embed-consent-bg: #1e293b;
  --embed-consent-border: #475569;
  --embed-consent-title-color: #e2e8f0;
  --embed-consent-text-color: #cbd5e1;
  --chart-loader-overlay-bg: radial-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.35));
  --chart-loader-overlay-alt-bg: radial-gradient(rgba(255, 255, 255, 0.3), rgba(0, 0, 0, 0.1));
  --chart-spinner-border: rgba(255, 255, 255, 0.35);
  --chart-spinner-border-top: var(--accent-color, #0d6efd);
}

html[data-theme="dark"] {
  --av-effect-card-bg: rgba(17, 25, 40, 0.86);
  --av-effect-card-border: rgba(148, 163, 184, 0.22);
  --av-effect-card-foreground: #e2e8f0;
  --av-effect-card-muted: rgba(203, 213, 225, 0.78);
  --av-effect-card-positive: #34d399;
  --av-effect-footnote-color: rgba(203, 213, 225, 0.75);
  --av-effect-card-shadow: 0 26px 52px -28px rgba(7, 12, 22, 0.8);

  /* Beratungsflow / Endkunden-Rentencheck (DESIGN_SYSTEM.md §5.15, aus fonder-v6), Dark */
  --strategie-karte-bg: linear-gradient(145deg, rgba(24, 32, 54, 0.92), rgba(12, 21, 40, 0.96));
  --v6-karte-bg: linear-gradient(145deg, rgba(24, 32, 54, 0.92), rgba(12, 21, 40, 0.96));
  --v6-karte-rand: rgba(var(--accent-rgb, 92, 152, 255), 0.18);
  --v6-karte-schatten: none;
  --v6-kasten-bg: rgba(255, 255, 255, 0.03);
  --v6-hinweis-bg: rgba(255, 255, 255, 0.03);
  --v6-hinweis-text: #adb5bd;
  --white-warning-soft: rgba(245, 159, 0, 0.16);
  --white-accent-soft: rgba(var(--accent-rgb, 92, 152, 255), 0.18);
}