:root {
            --bg: #0d1117;
            --panel: rgba(19, 27, 38, 0.22);
            --panel-alt: rgba(148, 163, 184, 0.08);
            --text: #d4dbe4;
            --muted: #8895a5;
            --accent: #2f81f7;
            --accent-2: #ffb454;
            --border: rgba(255, 255, 255, 0.22);
            --danger: #f85149;
            --success: #3fb950;
            --success-text: #b3ffce;
            --success-soft-bg: rgba(63,185,80,0.15);
            --success-soft-border: rgba(63,185,80,0.5);
            --liquid-glass-blur: 20px;
            --liquid-glass-saturation: 140%;
            --liquid-glass-edge: rgba(255, 255, 255, 0.3);
            --liquid-glass-edge-strong: rgba(255, 255, 255, 0.52);
            --liquid-glass-surface: rgba(19, 27, 38, 0.16);
            --liquid-glass-surface-soft: rgba(148, 163, 184, 0.08);
            --liquid-glass-surface-deep: rgba(13, 19, 28, 0.34);
            --liquid-glass-shadow: 0 18px 40px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.22);
            --liquid-glass-divider: rgba(255, 255, 255, 0.12);
            --liquid-glass-sheen: rgba(255, 255, 255, 0.08);
            --liquid-glass-sheen-opacity: 0.56;
            --liquid-glass-radius-main: 20px;
            --liquid-glass-radius-md: 14px;
            --liquid-glass-radius-sm: 10px;
            --liquid-glass-radius-xs: 8px;
            --liquid-glass-radius-field: 10px;
            --liquid-glass-radius-button: 12px;
            --liquid-glass-control-bg: rgba(148, 163, 184, 0.09);
            --liquid-glass-control-bg-hover: rgba(148, 163, 184, 0.16);
            --liquid-glass-control-edge: rgba(255, 255, 255, 0.3);
            --liquid-glass-control-edge-strong: rgba(255, 255, 255, 0.52);
            --liquid-glass-control-text: rgba(214, 223, 233, 0.94);
            --liquid-glass-control-shadow: 0 10px 20px rgba(8, 11, 17, 0.2);
            --liquid-glass-control-shadow-hover: 0 14px 22px rgba(8, 11, 17, 0.2);
            --liquid-glass-progress-track: rgba(148, 163, 184, 0.16);
            --liquid-glass-progress-track-edge: rgba(148, 163, 184, 0.32);
            --liquid-glass-progress-fill: rgba(255, 255, 255, 0.82);
            --liquid-glass-progress-fill-shadow: 0 0 14px rgba(255, 255, 255, 0.28);
            --liquid-glass-volume-fill: rgba(236, 244, 255, 0.58);
            --nav-glass-pill-bg: rgba(148, 163, 184, 0.18);
            --nav-glass-pill-edge: rgba(255, 255, 255, 0.34);
            --nav-glass-pill-bg-hover: rgba(59, 130, 246, 0.24);
            --nav-glass-pill-edge-hover: rgba(125, 180, 255, 0.52);
            --nav-glass-menu-bg: rgba(19, 27, 38, 0.08);
            --nav-glass-menu-edge: rgba(255, 255, 255, 0.34);
            --nav-glass-item-bg: rgba(148, 163, 184, 0.06);
            --nav-glass-item-edge: rgba(255, 255, 255, 0.2);
            --nav-glass-item-bg-hover: rgba(59, 130, 246, 0.12);
            --nav-glass-item-edge-hover: rgba(125, 180, 255, 0.52);
            --liquid-glass-toggle-track: rgba(148, 163, 184, 0.26);
            --liquid-glass-toggle-track-edge: rgba(255, 255, 255, 0.46);
            --liquid-glass-toggle-thumb: rgba(246, 249, 255, 0.96);
            --liquid-glass-toggle-thumb-edge: rgba(255, 255, 255, 0.52);
            --liquid-glass-toggle-track-active: color-mix(in srgb, var(--accent) 42%, rgba(15, 23, 42, 0.3));
            --liquid-glass-toggle-track-active-edge: color-mix(in srgb, var(--accent) 65%, rgba(255, 255, 255, 0.25));
            --liquid-glass-overlay-bg: rgba(8, 12, 16, 0.42);
            --liquid-glass-overlay-bg-strong: rgba(13, 17, 23, 0.72);
            --liquid-glass-tooltip-bg: rgba(15, 23, 42, 0.78);
            --liquid-glass-tooltip-text: rgba(248, 250, 252, 0.94);
            --liquid-glass-elevated-shadow: 0 12px 30px rgba(0, 0, 0, 0.45);
            --liquid-glass-table-hover: rgba(148, 163, 184, 0.14);
            --liquid-glass-highlight-bg: rgba(255, 180, 84, 0.16);
            --liquid-glass-highlight-edge: rgba(255, 180, 84, 0.45);
            --liquid-glass-primary-bg: rgba(47, 129, 247, 0.22);
            --liquid-glass-primary-edge: rgba(47, 129, 247, 0.48);
            --liquid-glass-primary-text: rgba(230, 236, 244, 0.96);
            --liquid-glass-primary-shadow: 0 8px 24px rgba(47, 129, 247, 0.25);
            --liquid-glass-focus-ring: rgba(226, 232, 240, 0.56);
            --site-header-height: 72px;
            --site-footer-height: 56px;
            --site-footer-clearance: 0px;
            --site-overlay-gap: 16px;
            --space-1: 4px;
            --space-2: 8px;
            --space-3: 12px;
            --space-4: 16px;
            --space-5: 20px;
            --radius-pill: 999px;
            --radius-card: 12px;
            --radius-popup: var(--liquid-glass-radius-main);
            --radius-control: var(--liquid-glass-radius-sm);
            --nav-dropdown-gap: 8px;
            --surface-nav-pill-bg: var(--nav-glass-pill-bg);
            --surface-nav-pill-edge: var(--nav-glass-pill-edge);
            --surface-nav-pill-bg-hover: var(--nav-glass-pill-bg-hover);
            --surface-nav-pill-edge-hover: var(--nav-glass-pill-edge-hover);
            --surface-popup-bg: var(--nav-glass-menu-bg);
            --surface-popup-edge: var(--nav-glass-menu-edge);
            --surface-popup-item-bg: var(--nav-glass-item-bg);
            --surface-popup-item-edge: var(--nav-glass-item-edge);
            --surface-popup-item-bg-hover: var(--nav-glass-item-bg-hover);
            --surface-popup-item-edge-hover: var(--nav-glass-item-edge-hover);
        }
        body.theme-light {
            --bg: #f5f7fb;
            --panel: rgba(203, 213, 225, 0.24);
            --panel-alt: rgba(203, 213, 225, 0.16);
            --text: #384556;
            --muted: #6f7d8d;
            --accent: #2563eb;
            --accent-2: #c97b2b;
            --border: rgba(15, 23, 42, 0.22);
            --danger: #d64545;
            --success: #2d8a4a;
            --success-text: #166534;
            --success-soft-bg: rgba(22,163,74,0.18);
            --success-soft-border: rgba(22,163,74,0.35);
            --liquid-glass-blur: 20px;
            --liquid-glass-saturation: 140%;
            --liquid-glass-edge: rgba(15, 23, 42, 0.28);
            --liquid-glass-edge-strong: rgba(15, 23, 42, 0.44);
            --liquid-glass-surface: rgba(203, 213, 225, 0.2);
            --liquid-glass-surface-soft: rgba(203, 213, 225, 0.16);
            --liquid-glass-surface-deep: rgba(203, 213, 225, 0.22);
            --liquid-glass-shadow: 0 14px 34px rgba(15, 23, 42, 0.07), inset 0 1px 0 rgba(255, 255, 255, 0.96);
            --liquid-glass-divider: rgba(15, 23, 42, 0.1);
            --liquid-glass-sheen: rgba(255, 255, 255, 0.06);
            --liquid-glass-sheen-opacity: 0.5;
            --liquid-glass-radius-main: 20px;
            --liquid-glass-radius-md: 14px;
            --liquid-glass-radius-sm: 10px;
            --liquid-glass-radius-xs: 8px;
            --liquid-glass-radius-field: 10px;
            --liquid-glass-radius-button: 12px;
            --liquid-glass-control-bg: rgba(203, 213, 225, 0.2);
            --liquid-glass-control-bg-hover: rgba(203, 213, 225, 0.3);
            --liquid-glass-control-edge: rgba(15, 23, 42, 0.28);
            --liquid-glass-control-edge-strong: rgba(15, 23, 42, 0.44);
            --liquid-glass-control-text: rgba(56, 69, 86, 0.92);
            --liquid-glass-control-shadow: 0 8px 16px rgba(15, 23, 42, 0.12);
            --liquid-glass-control-shadow-hover: 0 12px 20px rgba(15, 23, 42, 0.14);
            --liquid-glass-progress-track: rgba(148, 163, 184, 0.3);
            --liquid-glass-progress-track-edge: rgba(15, 23, 42, 0.24);
            --liquid-glass-progress-fill: rgba(255, 255, 255, 0.85);
            --liquid-glass-progress-fill-shadow: 0 0 10px rgba(15, 23, 42, 0.18);
            --liquid-glass-volume-fill: rgba(71, 85, 105, 0.42);
            --nav-glass-pill-bg: rgba(203, 213, 225, 0.34);
            --nav-glass-pill-edge: rgba(15, 23, 42, 0.24);
            --nav-glass-pill-bg-hover: rgba(37, 99, 235, 0.2);
            --nav-glass-pill-edge-hover: rgba(37, 99, 235, 0.38);
            --nav-glass-menu-bg: rgba(255, 255, 255, 0.1);
            --nav-glass-menu-edge: rgba(15, 23, 42, 0.2);
            --nav-glass-item-bg: rgba(203, 213, 225, 0.09);
            --nav-glass-item-edge: rgba(15, 23, 42, 0.14);
            --nav-glass-item-bg-hover: rgba(37, 99, 235, 0.1);
            --nav-glass-item-edge-hover: rgba(37, 99, 235, 0.34);
            --liquid-glass-toggle-track: rgba(148, 163, 184, 0.42);
            --liquid-glass-toggle-track-edge: rgba(15, 23, 42, 0.34);
            --liquid-glass-toggle-thumb: rgba(255, 255, 255, 0.98);
            --liquid-glass-toggle-thumb-edge: rgba(15, 23, 42, 0.18);
            --liquid-glass-toggle-track-active: color-mix(in srgb, var(--accent) 32%, rgba(255, 255, 255, 0.45));
            --liquid-glass-toggle-track-active-edge: color-mix(in srgb, var(--accent) 55%, rgba(15, 23, 42, 0.2));
            --liquid-glass-overlay-bg: rgba(248, 250, 252, 0.58);
            --liquid-glass-overlay-bg-strong: rgba(248, 250, 252, 0.86);
            --liquid-glass-tooltip-bg: rgba(255, 255, 255, 0.9);
            --liquid-glass-tooltip-text: rgba(15, 23, 42, 0.92);
            --liquid-glass-elevated-shadow: 0 12px 30px rgba(15, 23, 42, 0.12);
            --liquid-glass-table-hover: rgba(37, 99, 235, 0.1);
            --liquid-glass-highlight-bg: rgba(217, 119, 6, 0.18);
            --liquid-glass-highlight-edge: rgba(217, 119, 6, 0.38);
            --liquid-glass-primary-bg: rgba(37, 99, 235, 0.2);
            --liquid-glass-primary-edge: rgba(37, 99, 235, 0.42);
            --liquid-glass-primary-text: rgba(44, 58, 76, 0.94);
            --liquid-glass-primary-shadow: 0 8px 24px rgba(37, 99, 235, 0.16);
            --liquid-glass-focus-ring: rgba(15, 23, 42, 0.42);
            --surface-nav-pill-bg: var(--nav-glass-pill-bg);
            --surface-nav-pill-edge: var(--nav-glass-pill-edge);
            --surface-nav-pill-bg-hover: var(--nav-glass-pill-bg-hover);
            --surface-nav-pill-edge-hover: var(--nav-glass-pill-edge-hover);
            --surface-popup-bg: var(--nav-glass-menu-bg);
            --surface-popup-edge: var(--nav-glass-menu-edge);
            --surface-popup-item-bg: var(--nav-glass-item-bg);
            --surface-popup-item-edge: var(--nav-glass-item-edge);
            --surface-popup-item-bg-hover: var(--nav-glass-item-bg-hover);
            --surface-popup-item-edge-hover: var(--nav-glass-item-edge-hover);
        }
