/* GENERIERT von invisible/build/tokens.mjs — nicht von Hand editieren. */
/* Quelle: definitions/foundations/tokens.*.json + definitions/themes/*.json */

*, *::before, *::after { box-sizing: border-box; }
:root { color-scheme: only light; }

/* hideOn-Utilities (mobile < 768px ≤ tablet < 1024px ≤ desktop) */
@media (max-width: 767.98px) { [data-invisible-hide~="mobile"] { display: none !important; } }
@media (min-width: 768px) and (max-width: 1023.98px) { [data-invisible-hide~="tablet"] { display: none !important; } }
@media (min-width: 1024px) { [data-invisible-hide~="desktop"] { display: none !important; } }

:root {
    /* ---- Referenz-Tokens ---- */
    --palette-green-50: #e6f4ee;
    --palette-green-100: #c4e6d6;
    --palette-green-200: #9dd6bc;
    --palette-green-300: #6ec29d;
    --palette-green-400: #3fa87e;
    --palette-green-500: #16895f;
    --palette-green-600: #11744f;
    --palette-green-700: #0d5e40;
    --palette-green-800: #094830;
    --palette-green-900: #063321;
    --palette-neutral-0: #ffffff;
    --palette-neutral-50: #f5f7f6;
    --palette-neutral-100: #e9edeb;
    --palette-neutral-200: #d5dcd8;
    --palette-neutral-300: #b8c2bd;
    --palette-neutral-400: #93a29a;
    --palette-neutral-500: #71817a;
    --palette-neutral-600: #55645d;
    --palette-neutral-700: #3d4a44;
    --palette-neutral-800: #29332e;
    --palette-neutral-900: #1c2420;
    --palette-neutral-950: #17201d;
    --palette-neutral-1000: #0d1210;
    --palette-violet-50: #f0ebff;
    --palette-violet-100: #ddd1ff;
    --palette-violet-200: #c3adff;
    --palette-violet-300: #a583ff;
    --palette-violet-400: #8a61ff;
    --palette-violet-500: #7148ff;
    --palette-violet-600: #5c35e0;
    --palette-violet-700: #4827b8;
    --palette-violet-800: #351b8f;
    --palette-violet-900: #241166;
    --palette-red-50: #fdecea;
    --palette-red-100: #fad3cf;
    --palette-red-200: #f5b0a9;
    --palette-red-300: #ee8779;
    --palette-red-400: #e15c49;
    --palette-red-500: #d3392c;
    --palette-red-600: #b42d22;
    --palette-red-700: #8f231a;
    --palette-red-800: #661712;
    --palette-red-900: #380d08;
    --palette-amber-50: #fdf5e0;
    --palette-amber-100: #faeac0;
    --palette-amber-200: #f3d98e;
    --palette-amber-300: #e9c55c;
    --palette-amber-400: #dbb43c;
    --palette-amber-500: #c9a227;
    --palette-amber-600: #a8861d;
    --palette-amber-700: #816614;
    --palette-amber-800: #5a4710;
    --palette-amber-900: #33270a;
    --palette-blue-50: #e8f1fb;
    --palette-blue-100: #cfe2f6;
    --palette-blue-200: #a9cbee;
    --palette-blue-300: #7fb0e2;
    --palette-blue-400: #548fd2;
    --palette-blue-500: #2f6fbd;
    --palette-blue-600: #275da0;
    --palette-blue-700: #1e4a82;
    --palette-blue-800: #15355d;
    --palette-blue-900: #0c1f38;
    --palette-orange-50: #fdf0e7;
    --palette-orange-100: #fadcc7;
    --palette-orange-200: #f5c29a;
    --palette-orange-300: #eda368;
    --palette-orange-400: #e28540;
    --palette-orange-500: #d3691f;
    --palette-orange-600: #b25618;
    --palette-orange-700: #8c4413;
    --palette-orange-800: #66310e;
    --palette-orange-900: #401f09;
    --palette-teal-50: #e6f6f4;
    --palette-teal-100: #c2e9e4;
    --palette-teal-200: #96d8d0;
    --palette-teal-300: #66c2b8;
    --palette-teal-400: #3aa89d;
    --palette-teal-500: #1a8c81;
    --palette-teal-600: #14766d;
    --palette-teal-700: #0f5f58;
    --palette-teal-800: #0a4842;
    --palette-teal-900: #06312d;
    --palette-pink-50: #fdecf3;
    --palette-pink-100: #f9cfe0;
    --palette-pink-200: #f3a8c7;
    --palette-pink-300: #e97ba9;
    --palette-pink-400: #dc538c;
    --palette-pink-500: #c93370;
    --palette-pink-600: #ab285e;
    --palette-pink-700: #871f4a;
    --palette-pink-800: #631636;
    --palette-pink-900: #400e23;
    --size-0: 0;
    --size-1: 4px;
    --size-2: 8px;
    --size-3: 12px;
    --size-4: 16px;
    --size-5: 20px;
    --size-6: 24px;
    --size-8: 32px;
    --size-10: 40px;
    --size-12: 48px;
    --size-16: 64px;
    --size-20: 80px;
    --size-24: 96px;
    --size-32: 128px;
    --size-40: 160px;
    --size-05: 2px;
    --border-hairline: 1px;
    --border-emphasis: 2px;
    --border-thick: 4px;
    --container-sm: 480px;
    --container-md: 640px;
    --container-lg: 800px;
    --container-xl: 1080px;
    --container-2xl: 1280px;
    --radius-none: 0;
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-full: 999px;
    --shadow-control: 0 1px 2px rgba(13, 18, 16, 0.10);
    --shadow-raised: 0 2px 8px rgba(13, 18, 16, 0.14);
    --shadow-overlay-small: 0 8px 24px rgba(13, 18, 16, 0.20);
    --shadow-overlay-large: 0 16px 48px rgba(13, 18, 16, 0.28);
    --shadow-inset: inset 0 1px 2px rgba(13, 18, 16, 0.08);
    --overlay-dim: rgba(13, 18, 16, 0.55);
    --overlay-transparent: transparent;
    --font-sans: system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-mono: ui-monospace, "JetBrains Mono", Consolas, monospace;
    --text-xs: 12px;
    --text-sm: 13px;
    --text-md: 14px;
    --text-lg: 16px;
    --text-xl: 20px;
    --text-2xl: 26px;
    --text-3xl: 32px;
    --text-4xl: 40px;
    --text-5xl: 48px;
    --text-6xl: 64px;
    --text-reading: 18px;
    --weight-light: 300;
    --weight-regular: 400;
    --weight-medium: 500;
    --weight-semibold: 600;
    --weight-bold: 700;
    --leading-tight: 1.25;
    --leading-base: 1.55;
    --leading-loose: 1.7;
    --tracking-tight: -0.01em;
    --tracking-base: 0;
    --tracking-wide: 0.04em;
    --z-base: 0;
    --z-dropdown: 1000;
    --z-sticky: 1100;
    --z-window: 1200;
    --z-modal: 1300;
    --z-toast: 1400;
    --opacity-disabled: 0.5;
    --opacity-muted: 0.72;
    --opacity-backdrop: 0.55;
    --breakpoint-sm: 640px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 1024px;
    --breakpoint-xl: 1280px;
    --blur-sm: 4px;
    --blur-md: 8px;
    --blur-lg: 16px;
    --icon-sm: 16px;
    --icon-md: 20px;
    --icon-lg: 24px;
    --duration-fast: 120ms;
    --duration-base: 200ms;
    --duration-slow: 320ms;
    --easing-standard: cubic-bezier(0.2, 0, 0, 1);
    --easing-in: cubic-bezier(0.4, 0, 1, 1);
    --easing-out: cubic-bezier(0, 0, 0.2, 1);

    /* ---- Semantische Tokens ---- */
    --color-action-primary: var(--palette-green-500);
    --color-action-primary-hover: var(--palette-green-600);
    --color-action-primary-active: var(--palette-green-700);
    --color-action-on-primary: var(--palette-neutral-0);
    --color-action-secondary: var(--palette-neutral-100);
    --color-action-secondary-hover: var(--palette-neutral-200);
    --color-action-on-secondary: var(--palette-neutral-950);
    --color-action-danger: var(--palette-red-600);
    --color-action-danger-hover: var(--palette-red-700);
    --color-action-danger-active: var(--palette-red-800);
    --color-action-on-danger: var(--palette-neutral-0);
    --color-action-disabled: var(--palette-neutral-200);
    --color-action-on-disabled: var(--palette-neutral-500);
    --color-action-secondary-border: var(--overlay-transparent);
    --color-surface-page: var(--palette-neutral-50);
    --color-surface-default: var(--palette-neutral-0);
    --color-surface-raised: var(--palette-neutral-0);
    --color-surface-sunken: var(--palette-neutral-100);
    --color-surface-overlay: var(--palette-neutral-0);
    --color-surface-backdrop: var(--overlay-dim);
    --color-text-default: var(--palette-neutral-950);
    --color-text-muted: var(--palette-neutral-500);
    --color-text-inverse: var(--palette-neutral-0);
    --color-text-link: var(--palette-green-600);
    --color-text-disabled: var(--palette-neutral-400);
    --color-text-placeholder: var(--palette-neutral-400);
    --color-border-default: var(--palette-neutral-200);
    --color-border-subtle: var(--palette-neutral-100);
    --color-border-strong: var(--palette-neutral-400);
    --color-border-focus: var(--palette-green-400);
    --color-border-error: var(--palette-red-500);
    --color-status-success: var(--palette-green-600);
    --color-status-success-surface: var(--palette-green-50);
    --color-status-warning: var(--palette-amber-600);
    --color-status-warning-surface: var(--palette-amber-50);
    --color-status-danger: var(--palette-red-600);
    --color-status-danger-surface: var(--palette-red-50);
    --color-status-info: var(--palette-blue-600);
    --color-status-info-surface: var(--palette-blue-50);
    --color-band-dark: var(--palette-neutral-950);
    --color-band-dark-text: var(--palette-neutral-100);
    --color-band-dark-muted: var(--palette-neutral-400);
    --color-band-gray: var(--palette-neutral-50);
    --color-band-gray-text: var(--palette-neutral-900);
    --color-band-gray-muted: var(--palette-neutral-600);
    --color-accent: var(--palette-green-500);
    --color-sale: var(--palette-red-600);
    --form-background: var(--palette-neutral-0);
    --form-background-disabled: var(--palette-neutral-100);
    --form-border: var(--palette-neutral-300);
    --form-border-hover: var(--palette-neutral-400);
    --form-border-focus: var(--palette-green-500);
    --form-placeholder: var(--palette-neutral-400);
    --form-error: var(--palette-red-600);
    --focus-ring-color: var(--palette-green-400);
    --focus-ring-width: var(--border-emphasis);
    --focus-ring-offset: var(--size-05);
    --radius-control: var(--radius-md);
    --radius-surface: var(--radius-lg);
    --radius-overlay: var(--radius-xl);
    --elevation-control: var(--shadow-control);
    --elevation-raised: var(--shadow-raised);
    --elevation-overlay: var(--shadow-overlay-large);
    --layer-dropdown: var(--z-dropdown);
    --layer-window: var(--z-window);
    --layer-modal: var(--z-modal);
    --layer-toast: var(--z-toast);
    --state-disabled-opacity: var(--opacity-disabled);
    --font-family-default: var(--font-sans);
    --font-family-mono: var(--font-mono);
    --font-family-display: var(--font-sans);
    --font-size-display: var(--text-3xl);
    --font-size-hero: var(--text-6xl);
    --font-leading-display: var(--leading-tight);
    --layout-container: var(--container-2xl);
    --layout-content: var(--container-xl);
}

/* theme.atlassian v1.1.0 */
[data-theme="atlassian"] {
    --layout-container: 1216px;
    --layout-content: 1216px;
    --color-surface-page: #FFFFFF;
    --color-surface-default: #FFFFFF;
    --color-surface-raised: #FFFFFF;
    --color-surface-sunken: #F8F8F8;
    --color-surface-overlay: #FFFFFF;
    --color-text-default: #292A2E;
    --color-text-muted: #6B6E76;
    --color-text-inverse: #FFFFFF;
    --color-text-link: #1868DB;
    --color-border-default: #E4E5E9;
    --color-border-strong: #D5D7DC;
    --color-action-primary: #1868DB;
    --color-action-primary-hover: #1558BC;
    --color-action-primary-active: #123F8C;
    --color-action-on-primary: #FFFFFF;
    --color-action-secondary: #101214;
    --color-action-secondary-hover: #292A2E;
    --color-action-on-secondary: #FFFFFF;
    --color-accent: #BF63F3;
    --color-band-dark: #101214;
    --color-band-dark-text: #FFFFFF;
    --color-band-dark-muted: #B8BABF;
    --color-band-gray: #F8F8F8;
    --color-band-gray-text: #101214;
    --color-band-gray-muted: #6B6E76;
    --radius-control: 9999px;
    --font-family-default: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --font-family-display: 'Figtree', 'Inter', system-ui, sans-serif;
    --font-size-hero: 84px;
    --font-size-display: 68px;
    --font-leading-display: 1.05;
    --focus-ring-color: #1868DB;
}

/* theme.beta-developer-portal v1.0.0 */
[data-theme="beta-developer-portal"] {
    --color-surface-page: #121B23;
    --color-surface-default: #1A2733;
    --color-surface-raised: #223140;
    --color-surface-sunken: #0D141B;
    --color-surface-overlay: #223140;
    --color-text-default: #ECEFF1;
    --color-text-muted: #9FB0BC;
    --color-text-inverse: #121B23;
    --color-text-link: #2891F9;
    --color-border-default: #2C3E4E;
    --color-border-strong: #3E556A;
    --color-action-primary: #2891F9;
    --color-action-primary-hover: #4DA5FA;
    --color-action-primary-active: #1B7FE4;
    --color-action-on-primary: #FFFFFF;
    --color-action-secondary: #223140;
    --color-action-secondary-hover: #2C3E4E;
    --color-action-on-secondary: #ECEFF1;
    --color-status-info-surface: #16283A;
    --color-status-success-surface: #132A20;
    --color-status-warning-surface: #332A12;
    --color-status-danger-surface: #331616;
}

/* theme.clickup-brain v1.1.0 */
[data-theme="clickup-brain"] {
    --color-surface-page: #000000;
    --color-surface-default: #000000;
    --color-surface-raised: #0D0D0F;
    --color-surface-sunken: #0D0D0F;
    --color-surface-overlay: #0A0A0C;
    --color-text-default: #EEEEEE;
    --color-text-muted: #B4B4B4;
    --color-text-inverse: #000000;
    --color-text-link: #EC3609;
    --color-border-default: #212121;
    --color-border-strong: #2E2E2E;
    --color-action-primary: #EC3609;
    --color-action-primary-hover: #FF4A1C;
    --color-action-primary-active: #C82D08;
    --color-action-on-primary: #FFFFFF;
    --color-action-secondary: #EEEEEE;
    --color-action-secondary-hover: #FFFFFF;
    --color-action-on-secondary: #000000;
    --color-status-success: #42CC77;
    --color-status-success-surface: #0C2417;
    --color-band-dark: #000000;
    --color-band-dark-text: #EEEEEE;
    --color-band-dark-muted: #B4B4B4;
    --color-band-gray: #0D0D0F;
    --color-band-gray-text: #EEEEEE;
    --color-band-gray-muted: #B4B4B4;
    --font-family-default: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --font-family-display: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    --font-family-mono: 'Sometype Mono', ui-monospace, 'Cascadia Code', monospace;
    --font-size-display: 48px;
    --font-size-hero: 76px;
    --color-accent: #B38CFF;
    --focus-ring-color: #EC3609;
}

/* theme.david-selig v1.5.1 */
[data-theme="david-selig"] {
    --color-surface-page: #FFFFFF;
    --color-surface-default: #FFFFFF;
    --color-surface-raised: #FFFFFF;
    --color-surface-sunken: #F7F7F7;
    --color-surface-overlay: #FFFFFF;
    --color-text-default: #303133;
    --color-text-muted: #55595E;
    --color-text-inverse: #FFFFFF;
    --color-text-link: #BA9684;
    --color-border-default: #EAEAEA;
    --color-border-strong: #DDDDDD;
    --color-action-primary: #BA9684;
    --color-action-primary-hover: #CBAB9A;
    --color-action-primary-active: #A98470;
    --color-action-on-primary: #141618;
    --color-action-secondary: #303133;
    --color-action-secondary-hover: #1B1D1F;
    --color-action-on-secondary: #FFFFFF;
    --color-status-info: #BA9684;
    --color-status-info-surface: #F7EFE9;
    --color-band-dark: #141618;
    --color-band-dark-text: #FFFFFF;
    --color-band-dark-muted: #B9BDC1;
    --color-band-gray: #F7F7F7;
    --color-band-gray-text: #303133;
    --color-band-gray-muted: #55595E;
    --font-family-default: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --font-size-display: 35px;
    --color-accent: #BA9684;
    --focus-ring-color: #BA9684;
}

/* theme.demo-dark v1.0.0 */
[data-theme="demo-dark"] {
    --color-surface-page: var(--palette-neutral-1000);
    --color-surface-default: var(--palette-neutral-950);
    --color-surface-raised: var(--palette-neutral-900);
    --color-surface-sunken: var(--palette-neutral-1000);
    --color-surface-overlay: var(--palette-neutral-900);
    --color-text-default: var(--palette-neutral-100);
    --color-text-muted: var(--palette-neutral-400);
    --color-text-inverse: var(--palette-neutral-950);
    --color-text-link: var(--palette-green-300);
    --color-border-default: var(--palette-neutral-800);
    --color-border-strong: var(--palette-neutral-600);
    --color-action-primary-hover: var(--palette-green-400);
    --color-action-primary-active: var(--palette-green-300);
    --color-action-secondary: var(--palette-neutral-800);
    --color-action-secondary-hover: var(--palette-neutral-700);
    --color-action-on-secondary: var(--palette-neutral-100);
    --color-status-success: var(--palette-green-400);
    --color-status-success-surface: var(--palette-green-900);
    --color-status-warning: var(--palette-amber-500);
    --color-status-warning-surface: var(--palette-amber-900);
    --color-status-danger: var(--palette-red-500);
    --color-status-danger-surface: var(--palette-red-900);
    --color-status-info: var(--palette-blue-500);
    --color-status-info-surface: var(--palette-blue-900);
    --color-action-disabled: var(--palette-neutral-800);
    --color-action-on-disabled: var(--palette-neutral-500);
    --color-text-disabled: var(--palette-neutral-600);
    --color-text-placeholder: var(--palette-neutral-600);
    --color-border-subtle: var(--palette-neutral-800);
    --form-background: var(--palette-neutral-900);
    --form-background-disabled: var(--palette-neutral-800);
    --form-border: var(--palette-neutral-700);
    --form-border-hover: var(--palette-neutral-600);
    --form-placeholder: var(--palette-neutral-600);
}

/* theme.demo-violet v1.0.0 */
[data-theme="demo-violet"] {
    --color-action-primary: var(--palette-violet-500);
    --color-action-primary-hover: var(--palette-violet-600);
    --color-action-primary-active: var(--palette-violet-700);
    --color-action-on-primary: var(--palette-neutral-0);
    --color-text-link: var(--palette-violet-600);
    --color-border-focus: var(--palette-violet-400);
    --color-status-info: var(--palette-violet-600);
    --color-status-info-surface: var(--palette-violet-50);
}

/* theme.dev-portal-dark v1.0.0 */
[data-theme="dev-portal-dark"] {
    --color-surface-page: #121B23;
    --color-surface-default: #1A2733;
    --color-surface-raised: #223140;
    --color-surface-sunken: #0D141B;
    --color-surface-overlay: #223140;
    --color-text-default: #ECEFF1;
    --color-text-muted: #9FB0BC;
    --color-text-inverse: #121B23;
    --color-text-link: #2891F9;
    --color-border-default: #2C3E4E;
    --color-border-strong: #3E556A;
    --color-action-primary: #2891F9;
    --color-action-primary-hover: #4DA5FA;
    --color-action-primary-active: #1B7FE4;
    --color-action-on-primary: #FFFFFF;
    --color-action-secondary: #223140;
    --color-action-secondary-hover: #2C3E4E;
    --color-action-on-secondary: #ECEFF1;
    --color-status-info-surface: #16283A;
    --color-status-success-surface: #132A20;
    --color-status-warning-surface: #332A12;
    --color-status-danger-surface: #331616;
}

/* theme.dev-portal-light v1.0.0 */
[data-theme="dev-portal-light"] {
    --color-surface-page: #F3F6F9;
    --color-surface-default: #FFFFFF;
    --color-surface-raised: #FFFFFF;
    --color-surface-sunken: #ECEFF1;
    --color-text-link: #1B7FE4;
    --color-border-default: #D8E0E7;
    --color-action-primary: #2891F9;
    --color-action-primary-hover: #1B7FE4;
    --color-action-primary-active: #1668BA;
    --color-action-on-primary: #FFFFFF;
    --color-status-info-surface: #E3F0FE;
}

/* theme.invisible-builders v1.0.0 */
[data-theme="invisible-builders"] {
    --color-surface-page: var(--palette-neutral-50);
    --color-surface-default: var(--palette-neutral-0);
    --color-surface-raised: var(--palette-neutral-0);
    --color-surface-sunken: var(--palette-neutral-100);
    --color-text-default: var(--palette-neutral-900);
    --color-text-muted: var(--palette-neutral-500);
    --color-border-subtle: var(--palette-neutral-200);
    --color-border-default: var(--palette-neutral-300);
    --color-border-strong: var(--palette-neutral-400);
    --radius-control: var(--radius-sm);
    --radius-surface: var(--radius-md);
}

/* theme.shein-shop v1.0.0 */
[data-theme="shein-shop"] {
    --layout-container: 1440px;
    --layout-content: 1340px;
    --color-surface-page: #FFFFFF;
    --color-surface-default: #FFFFFF;
    --color-surface-sunken: #F6F6F6;
    --color-text-default: #222222;
    --color-text-muted: #767676;
    --color-text-link: #222222;
    --color-border-default: #E5E5E5;
    --color-border-strong: #CCCCCC;
    --color-action-primary: #222222;
    --color-action-primary-hover: #000000;
    --color-action-primary-active: #000000;
    --color-action-on-primary: #FFFFFF;
    --color-action-secondary: #FFFFFF;
    --color-action-secondary-hover: #F6F6F6;
    --color-action-on-secondary: #222222;
    --color-accent: #FA6338;
    --color-sale: #FA6338;
    --color-status-warning: #FACC15;
    --color-band-dark: #222222;
    --color-band-dark-text: #FFFFFF;
    --color-band-dark-muted: #BBBBBB;
    --color-band-gray: #F6F6F6;
    --color-band-gray-text: #222222;
    --color-band-gray-muted: #767676;
    --radius-control: 2px;
    --radius-surface: 4px;
    --focus-ring-color: #222222;
    --font-size-display: 28px;
    --font-size-hero: 40px;
    --font-leading-display: 1.3;
}

/* theme.untitled v1.1.0 */
[data-theme="untitled"] {
    --color-surface-page: #FFFFFF;
    --color-surface-default: #FFFFFF;
    --color-surface-raised: #FFFFFF;
    --color-surface-sunken: #F9FAFB;
    --color-surface-overlay: #FFFFFF;
    --color-text-default: #101828;
    --color-text-muted: #475467;
    --color-text-inverse: #FFFFFF;
    --color-text-link: #6941C6;
    --color-border-default: #EAECF0;
    --color-border-strong: #D0D5DD;
    --color-action-primary: #7F56D9;
    --color-action-primary-hover: #6941C6;
    --color-action-primary-active: #53389E;
    --color-action-on-primary: #FFFFFF;
    --color-action-secondary: #FFFFFF;
    --color-action-secondary-hover: #F9FAFB;
    --color-action-on-secondary: #344054;
    --color-action-secondary-border: #D0D5DD;
    --color-accent: #6941C6;
    --color-status-info: #6941C6;
    --color-status-info-surface: #F9F5FF;
    --radius-control: 8px;
    --radius-surface: 12px;
    --focus-ring-color: #D6BBFB;
    --font-size-display: 30px;
    --font-size-hero: 36px;
    --font-leading-display: 1.27;
    --font-family-default: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --font-family-display: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* Target-Schicht desktop.shell */
[data-target="desktop.shell"] {
    --radius-control: var(--radius-sm);
    --radius-surface: var(--radius-md);
    --elevation-control: none;
    --elevation-raised: var(--shadow-control);
}

/* ─────────── Raster: 12 Spalten, generiert ─────────── */
.invisible-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: var(--grid-gap, var(--size-4));
    width: 100%;
}
.invisible-grid--cols-2 > :where(*) { grid-column: span 6; }
.invisible-grid--cols-3 > :where(*) { grid-column: span 4; }
.invisible-grid--cols-4 > :where(*) { grid-column: span 3; }
.invisible-grid--cols-6 > :where(*) { grid-column: span 2; }
.invisible-grid--cols-12 > :where(*) { grid-column: span 1; }
.invisible-grid--cols-auto { grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--container-sm) / 2), 1fr)); }
.invisible-grid--cols-auto > :where(*) { grid-column: auto; }
.invisible-grid--gap-none { --grid-gap: 0; }
.invisible-grid--gap-sm { --grid-gap: var(--size-2); }
.invisible-grid--gap-md { --grid-gap: var(--size-4); }
.invisible-grid--gap-lg { --grid-gap: var(--size-6); }
.invisible-grid--gap-xl { --grid-gap: var(--size-8); }
.invisible-grid--base-cols-2 > :where(*) { grid-column: span 6; }
.invisible-grid--base-cols-3 > :where(*) { grid-column: span 4; }
.invisible-grid--base-cols-4 > :where(*) { grid-column: span 3; }
.invisible-grid--base-cols-6 > :where(*) { grid-column: span 2; }
.invisible-grid--base-cols-12 > :where(*) { grid-column: span 1; }
.invisible-grid--base-cols-auto { grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--container-sm) / 2), 1fr)); }
.invisible-grid--base-gap-none { --grid-gap: 0; }
.invisible-grid--base-gap-sm { --grid-gap: var(--size-2); }
.invisible-grid--base-gap-md { --grid-gap: var(--size-4); }
.invisible-grid--base-gap-lg { --grid-gap: var(--size-6); }
.invisible-grid--base-gap-xl { --grid-gap: var(--size-8); }

.invisible-col { min-width: 0; }
.invisible-col--span-1 { grid-column: span 1; }
.invisible-col--span-2 { grid-column: span 2; }
.invisible-col--span-3 { grid-column: span 3; }
.invisible-col--span-4 { grid-column: span 4; }
.invisible-col--span-5 { grid-column: span 5; }
.invisible-col--span-6 { grid-column: span 6; }
.invisible-col--span-7 { grid-column: span 7; }
.invisible-col--span-8 { grid-column: span 8; }
.invisible-col--span-9 { grid-column: span 9; }
.invisible-col--span-10 { grid-column: span 10; }
.invisible-col--span-11 { grid-column: span 11; }
.invisible-col--span-12 { grid-column: span 12; }
.invisible-col--start-1 { grid-column-start: 1; }
.invisible-col--start-2 { grid-column-start: 2; }
.invisible-col--start-3 { grid-column-start: 3; }
.invisible-col--start-4 { grid-column-start: 4; }
.invisible-col--start-5 { grid-column-start: 5; }
.invisible-col--start-6 { grid-column-start: 6; }
.invisible-col--start-7 { grid-column-start: 7; }
.invisible-col--start-8 { grid-column-start: 8; }
.invisible-col--start-9 { grid-column-start: 9; }
.invisible-col--start-10 { grid-column-start: 10; }
.invisible-col--start-11 { grid-column-start: 11; }
.invisible-col--start-12 { grid-column-start: 12; }

@media (min-width: 640px) {
    .invisible-grid--sm-gap-none { --grid-gap: 0; }
    .invisible-grid--sm-gap-sm { --grid-gap: var(--size-2); }
    .invisible-grid--sm-gap-md { --grid-gap: var(--size-4); }
    .invisible-grid--sm-gap-lg { --grid-gap: var(--size-6); }
    .invisible-grid--sm-gap-xl { --grid-gap: var(--size-8); }
    .invisible-grid--sm-cols-2 > :where(*) { grid-column: span 6; }
    .invisible-grid--sm-cols-3 > :where(*) { grid-column: span 4; }
    .invisible-grid--sm-cols-4 > :where(*) { grid-column: span 3; }
    .invisible-grid--sm-cols-6 > :where(*) { grid-column: span 2; }
    .invisible-grid--sm-cols-12 > :where(*) { grid-column: span 1; }
    .invisible-col--sm-span-1 { grid-column: span 1; }
    .invisible-col--sm-span-2 { grid-column: span 2; }
    .invisible-col--sm-span-3 { grid-column: span 3; }
    .invisible-col--sm-span-4 { grid-column: span 4; }
    .invisible-col--sm-span-5 { grid-column: span 5; }
    .invisible-col--sm-span-6 { grid-column: span 6; }
    .invisible-col--sm-span-7 { grid-column: span 7; }
    .invisible-col--sm-span-8 { grid-column: span 8; }
    .invisible-col--sm-span-9 { grid-column: span 9; }
    .invisible-col--sm-span-10 { grid-column: span 10; }
    .invisible-col--sm-span-11 { grid-column: span 11; }
    .invisible-col--sm-span-12 { grid-column: span 12; }
    .invisible-col--sm-start-1 { grid-column-start: 1; }
    .invisible-col--sm-start-2 { grid-column-start: 2; }
    .invisible-col--sm-start-3 { grid-column-start: 3; }
    .invisible-col--sm-start-4 { grid-column-start: 4; }
    .invisible-col--sm-start-5 { grid-column-start: 5; }
    .invisible-col--sm-start-6 { grid-column-start: 6; }
    .invisible-col--sm-start-7 { grid-column-start: 7; }
    .invisible-col--sm-start-8 { grid-column-start: 8; }
    .invisible-col--sm-start-9 { grid-column-start: 9; }
    .invisible-col--sm-start-10 { grid-column-start: 10; }
    .invisible-col--sm-start-11 { grid-column-start: 11; }
    .invisible-col--sm-start-12 { grid-column-start: 12; }
}

@media (min-width: 768px) {
    .invisible-grid--md-gap-none { --grid-gap: 0; }
    .invisible-grid--md-gap-sm { --grid-gap: var(--size-2); }
    .invisible-grid--md-gap-md { --grid-gap: var(--size-4); }
    .invisible-grid--md-gap-lg { --grid-gap: var(--size-6); }
    .invisible-grid--md-gap-xl { --grid-gap: var(--size-8); }
    .invisible-grid--md-cols-2 > :where(*) { grid-column: span 6; }
    .invisible-grid--md-cols-3 > :where(*) { grid-column: span 4; }
    .invisible-grid--md-cols-4 > :where(*) { grid-column: span 3; }
    .invisible-grid--md-cols-6 > :where(*) { grid-column: span 2; }
    .invisible-grid--md-cols-12 > :where(*) { grid-column: span 1; }
    .invisible-col--md-span-1 { grid-column: span 1; }
    .invisible-col--md-span-2 { grid-column: span 2; }
    .invisible-col--md-span-3 { grid-column: span 3; }
    .invisible-col--md-span-4 { grid-column: span 4; }
    .invisible-col--md-span-5 { grid-column: span 5; }
    .invisible-col--md-span-6 { grid-column: span 6; }
    .invisible-col--md-span-7 { grid-column: span 7; }
    .invisible-col--md-span-8 { grid-column: span 8; }
    .invisible-col--md-span-9 { grid-column: span 9; }
    .invisible-col--md-span-10 { grid-column: span 10; }
    .invisible-col--md-span-11 { grid-column: span 11; }
    .invisible-col--md-span-12 { grid-column: span 12; }
    .invisible-col--md-start-1 { grid-column-start: 1; }
    .invisible-col--md-start-2 { grid-column-start: 2; }
    .invisible-col--md-start-3 { grid-column-start: 3; }
    .invisible-col--md-start-4 { grid-column-start: 4; }
    .invisible-col--md-start-5 { grid-column-start: 5; }
    .invisible-col--md-start-6 { grid-column-start: 6; }
    .invisible-col--md-start-7 { grid-column-start: 7; }
    .invisible-col--md-start-8 { grid-column-start: 8; }
    .invisible-col--md-start-9 { grid-column-start: 9; }
    .invisible-col--md-start-10 { grid-column-start: 10; }
    .invisible-col--md-start-11 { grid-column-start: 11; }
    .invisible-col--md-start-12 { grid-column-start: 12; }
}

@media (min-width: 1024px) {
    .invisible-grid--lg-gap-none { --grid-gap: 0; }
    .invisible-grid--lg-gap-sm { --grid-gap: var(--size-2); }
    .invisible-grid--lg-gap-md { --grid-gap: var(--size-4); }
    .invisible-grid--lg-gap-lg { --grid-gap: var(--size-6); }
    .invisible-grid--lg-gap-xl { --grid-gap: var(--size-8); }
    .invisible-grid--lg-cols-2 > :where(*) { grid-column: span 6; }
    .invisible-grid--lg-cols-3 > :where(*) { grid-column: span 4; }
    .invisible-grid--lg-cols-4 > :where(*) { grid-column: span 3; }
    .invisible-grid--lg-cols-6 > :where(*) { grid-column: span 2; }
    .invisible-grid--lg-cols-12 > :where(*) { grid-column: span 1; }
    .invisible-col--lg-span-1 { grid-column: span 1; }
    .invisible-col--lg-span-2 { grid-column: span 2; }
    .invisible-col--lg-span-3 { grid-column: span 3; }
    .invisible-col--lg-span-4 { grid-column: span 4; }
    .invisible-col--lg-span-5 { grid-column: span 5; }
    .invisible-col--lg-span-6 { grid-column: span 6; }
    .invisible-col--lg-span-7 { grid-column: span 7; }
    .invisible-col--lg-span-8 { grid-column: span 8; }
    .invisible-col--lg-span-9 { grid-column: span 9; }
    .invisible-col--lg-span-10 { grid-column: span 10; }
    .invisible-col--lg-span-11 { grid-column: span 11; }
    .invisible-col--lg-span-12 { grid-column: span 12; }
    .invisible-col--lg-start-1 { grid-column-start: 1; }
    .invisible-col--lg-start-2 { grid-column-start: 2; }
    .invisible-col--lg-start-3 { grid-column-start: 3; }
    .invisible-col--lg-start-4 { grid-column-start: 4; }
    .invisible-col--lg-start-5 { grid-column-start: 5; }
    .invisible-col--lg-start-6 { grid-column-start: 6; }
    .invisible-col--lg-start-7 { grid-column-start: 7; }
    .invisible-col--lg-start-8 { grid-column-start: 8; }
    .invisible-col--lg-start-9 { grid-column-start: 9; }
    .invisible-col--lg-start-10 { grid-column-start: 10; }
    .invisible-col--lg-start-11 { grid-column-start: 11; }
    .invisible-col--lg-start-12 { grid-column-start: 12; }
}

@media (min-width: 1280px) {
    .invisible-grid--xl-gap-none { --grid-gap: 0; }
    .invisible-grid--xl-gap-sm { --grid-gap: var(--size-2); }
    .invisible-grid--xl-gap-md { --grid-gap: var(--size-4); }
    .invisible-grid--xl-gap-lg { --grid-gap: var(--size-6); }
    .invisible-grid--xl-gap-xl { --grid-gap: var(--size-8); }
    .invisible-grid--xl-cols-2 > :where(*) { grid-column: span 6; }
    .invisible-grid--xl-cols-3 > :where(*) { grid-column: span 4; }
    .invisible-grid--xl-cols-4 > :where(*) { grid-column: span 3; }
    .invisible-grid--xl-cols-6 > :where(*) { grid-column: span 2; }
    .invisible-grid--xl-cols-12 > :where(*) { grid-column: span 1; }
    .invisible-col--xl-span-1 { grid-column: span 1; }
    .invisible-col--xl-span-2 { grid-column: span 2; }
    .invisible-col--xl-span-3 { grid-column: span 3; }
    .invisible-col--xl-span-4 { grid-column: span 4; }
    .invisible-col--xl-span-5 { grid-column: span 5; }
    .invisible-col--xl-span-6 { grid-column: span 6; }
    .invisible-col--xl-span-7 { grid-column: span 7; }
    .invisible-col--xl-span-8 { grid-column: span 8; }
    .invisible-col--xl-span-9 { grid-column: span 9; }
    .invisible-col--xl-span-10 { grid-column: span 10; }
    .invisible-col--xl-span-11 { grid-column: span 11; }
    .invisible-col--xl-span-12 { grid-column: span 12; }
    .invisible-col--xl-start-1 { grid-column-start: 1; }
    .invisible-col--xl-start-2 { grid-column-start: 2; }
    .invisible-col--xl-start-3 { grid-column-start: 3; }
    .invisible-col--xl-start-4 { grid-column-start: 4; }
    .invisible-col--xl-start-5 { grid-column-start: 5; }
    .invisible-col--xl-start-6 { grid-column-start: 6; }
    .invisible-col--xl-start-7 { grid-column-start: 7; }
    .invisible-col--xl-start-8 { grid-column-start: 8; }
    .invisible-col--xl-start-9 { grid-column-start: 9; }
    .invisible-col--xl-start-10 { grid-column-start: 10; }
    .invisible-col--xl-start-11 { grid-column-start: 11; }
    .invisible-col--xl-start-12 { grid-column-start: 12; }
}