*, *::before, *::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

:root {
    --sw: 260px;
    --th: 62px;
    --g9: #0d2318;
    --g8: #163328;
    --g7: #1e4535;
    --g6: #2a5c45;
    --g5: #3a7d5e;
    --g4: #4ea87e;
    --g3: #7ddba8;
    --g1: #e8f5ef;
    --sf: #fff;
    --bd: #e3e8ef;
    --t1: #0f1923;
    --t2: #4a5568;
    --t3: #8a96a8;
    --red: #dc2626;
    --rbg: #fff1f2;
    --rbg1: #fef2f2;
    --rbd: #fca5a5;
    --sh1: 0 1px 3px rgba(0,0,0,.06);
    --sh2: 0 4px 16px rgba(0,0,0,.08);
    --sh3: 0 8px 32px rgba(0,0,0,.16);
    --white-07: rgba(255,255,255,.07);
    --white-08: rgba(255,255,255,.08);
    --white-10: rgba(255,255,255,.1);
    --white-12: rgba(255,255,255,.12);
    --white-30: rgba(255,255,255,.3);
    --white-40: rgba(255,255,255,.4);
    --white-65: rgba(255,255,255,.65);
    --white-75: rgba(255,255,255,.75);
    --white-025: rgba(255,255,255,0.025);
    --white-02: rgba(255,255,255,0.02);
    --white-03: rgba(255,255,255,0.03);
    --white-18: rgba(255,255,255,0.18);
    --white-28: rgba(255,255,255,0.28);
    --white-36: rgba(255,255,255,0.36);
    --white-38: rgba(255,255,255,0.38);
    --white-42: rgba(255,255,255,0.42);
    --white-45: rgba(255,255,255,0.45);
    --white-50: rgba(255,255,255,0.5);
    --white-88: rgba(255,255,255,0.88);
    --white-09: rgba(255,255,255,0.09);
    --white-14: rgba(255,255,255,0.14);
    --white-32: rgba(255,255,255,0.32);
    --white-58: rgba(255,255,255,0.58);
    --white-22: rgba(255,255,255,0.22);
    --white-44: rgba(255,255,255,0.44);
    --white-48: rgba(255,255,255,0.48);
    --white-55: rgba(255,255,255,0.55);
    --white-9: rgba(255,255,255,0.9);
    --white-7: rgba(255,255,255,0.7);
    --white-72: rgba(255,255,255,0.72);
    --white-2: rgba(255,255,255,0.2);
    --ghost-white: #eef3f8;
    --silver-blue: #d6dee9;
    --black-45: rgba(0,0,0,.45);
    --black-30: rgba(0,0,0,.3);
    --black-18: rgba(0,0,0,.18);
    --black-05: rgba(0,0,0,0.05);
    --black-06: rgba(0,0,0,0.06);
    --black-07: rgba(0,0,0,0.07);
    --black-10: rgba(0,0,0,0.10);
    --black-42: rgba(0,0,0,0.42);
    --black-16: rgba(0, 0, 0, 0.16);
    --black-40: rgba(0,0,0,.4);
    --black-4: rgba(0,0,0,.04);
    --black-6: rgba(0,0,0,.06);
    --purple-100: #f3e8ff;
    --purple-700: #6b21a8;
    --purple-600: #7c3aed;
    --blue-100: #eff6ff;
    --blue-500: #3b82f6;
    --alert-strong: #b91c1c;
    --alert-light: #fff8f8;
    --danger-overlay: rgba(220,38,38,.18);
    --danger-shadow-12: 0 0 0 3px rgba(239,68,68,.12);
    --success-light-bg: #f0fdf4;
    --success-shadow-10: 0 0 0 3px rgba(34,197,94,.1);
    --green-overlay-08: rgba(42,92,69,.08);
    --green-overlay-06: rgba(42,92,69,.06);
    --shadow-dark-30: 0 -4px 20px rgba(0,0,0,.3);
    --shadow-medium-12: 0 8px 24px rgba(0,0,0,.12);
    --green-action-08: rgba(42,92,69,.08);
    --green-action-06: rgba(42,92,69,.06);
    --green-border-12: rgba(42,92,69,.12);
    --green-shadow-30: 0 4px 14px rgba(42,92,69,.3);
    --black-50: rgba(0,0,0,.5);
    --green-50: #1f6f5f;
    --light-black: #17233d;
    --success-green: #16a34a;
    --green-success: #2a9d55;
    --green-600-dark: #1f4f39;
    --green-600-alt: #2d6b4f;
    --green-600-darker: #245741;
    --green-03: rgba(42,92,69,0.3);
    --green-04: rgba(42,92,69,0.04);
    --green-025: rgba(78,168,126,0.25);
    --green-045: rgba(78,168,126,0.45);
    --green-action: #295c46;
    --orange-bg: #fff7ed;
    --orange: #ea580c;
    --orange-text: #9a3412;
    --bg: #f2f4f7;
    --surface: #ffffff;
    --surface-light: #f9fbfd;
    --surface-lighter: #fcfdfd;
    --surface-lightest: #f8fbfa;
    --surface-input: #f4f7fb;
    --surface-hover: #eef4f2;
    --surface-hover-light: #eef2f7;
    --surface-gradient-start: #f8fbf9;
    --surface-gradient-end: #f2f7f4;
    --surface-fff: #fcfffd;
    --surface-100: #f1f5f9;
    --border-light1: #cbe7d8;
    --border-lighter: #d6dee8;
    --bg-light: #f7fafc;
    --bg-light1: #f3f3f3;
    --bg-light-alt: #f8fafc;
    --bg-lighter: #f9fbfd;
    --bg-lightest: #fcfdfd;
    --bg-very-light: #fafcfa;
    --bg-ultra-light: #f3f4f6;
    --text-gray: #64748b;
    --text-gray-light: #7b8795;
    --text-gray-lighter: #a9b3c3;
    --text-gray-lightest: #b3bfd0;
    --text-placeholder: #94a3b8;
    --text-gray-dark: #334155;
    --svg-icon: #a9b3c3;
    --gradient-example-1: #eef6f2;
    --gradient-example-2: #ddebe4;
    --gradient-example-3: rgba(125, 219, 168, .18);
    --text-secondary: #4b5563;
    --icon-gray-light: #9aa5b1;
    --focus-light: #eef6f2;
    --focus-lighter: #ddebe4;
    --border-dashed: #d6dee8;
    --dropdown-hover: #f7f9fc;
    --dropdown-border: #edf1f5;
    --dropdown-add-bg: #f2f8f4;
    --border-hover-green: #cbe7d8;
    --border-light: #dcdfe4;
    --error: #ef4444;
    --error-red: #ff0000;
    --focus-shadow-strong: rgba(78, 168, 126, 0.2);
    --danger-bg: #fdeceb;
    --danger-light-bg: #fff7f6;
    --danger-light-bg1: #fef2f2;
    --danger-light-border: #f1b5ad;
    --danger-text: #b42318;
    --danger-text1: #991b1b;
    --danger-text-hover: #992d22;
    --danger-error-bg: #fee2e2;
    --focus-shadow: 0 0 0 3px rgba(42,92,69,0.1);
    --focus-shadow-medium: rgba(78, 168, 126, 0.14);
    --focus-shadow-light: rgba(78, 168, 126, 0.12);
    --focus-shadow-lighter: rgba(78, 168, 126, 0.1);
    --helper-border: rgba(42, 92, 69, 0.08);
    --helper-bg: rgba(232, 245, 239, 0.55);
    --input-border: rgba(15, 25, 35, 0.09);
    --input-text-color: #9ca3af;
    --white-overlay: rgba(255, 255, 255, 0.96);
    --white-overlay-light: rgba(255, 255, 255, 0.8);
    --white-overlay-transparent: rgba(255, 255, 255, 0.98);
    --white-overlay-transparent1: rgba(255, 255, 255, 0.15);
    --white-overlay-transparent2: rgba(255, 255, 255, 1);
    --white-overlay-semi: rgba(255, 255, 255, 0.9);
    --white-overlay-semi1: rgba(255, 255, 255, 0.92);
    --white-overlay-soft: rgba(255, 255, 255, 0.72);
    --dark-overlay: rgba(0, 0, 0, 0.88);
    --dark-overlay-semi: rgba(0, 0, 0, 0.12);
    --modal-shadow: rgba(15, 25, 35, 0.18);
    --modal-shadow1: rgba(15, 25, 35, 0.16);
    --dropdown-shadow: rgba(15, 25, 35, 0.08);
    --modal-shadow-light: rgba(15, 25, 35, 0.12);
    --modal-shadow-lighter: rgba(15, 25, 35, 0.08);
    --button-shadow: rgba(42, 92, 69, 0.18);
    --helper-border-green: rgba(42, 92, 69, 0.24);
    --helper-border-light: rgba(42, 92, 69, 0.12);
    --border-light-green: rgba(226, 232, 240, 0.8);
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .04);
    --shadow-md: 0 4px 16px rgba(0,0,0,.08);
    --shadow-lg: 0 8px 32px rgba(0,0,0,.14);
    --shadow-modal: 0 20px 50px rgba(15,25,35,.16);
    --shadow-focus-light: rgba(78,168,126,.1);
    --shadow-focus-medium: rgba(78,168,126,.12);
    --shadow-focus-medium1: rgba(42, 92, 69, .2);
    --shadow-focus-strong: rgba(78,168,126,.2);
    --shadow-lightbox: rgba(0,0,0,.88);
    --shadow-lightbox-btn: rgba(255,255,255,.15);
    --radius: 10px;
    --font: 'Plus Jakarta Sans', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
    --transition: 0.22s cubic-bezier(.4,0,.2,1);
    --ink: #111827;
    --ink2: #374151;
    --muted: #6b7280;
    --muted-600: #475569;
    --muted-border: #d8e1ec;
    --muted-border-2: #cbd5e1;
    --muted-border-3: #d9e2ec;
    --muted-border-4: #b9c8d8;
    --muted-border-5: #e8edf3;
    --muted-border-6: #d4dde8;
    --bdr: #e5e7eb;
    --bdr2: #d1d5db;
    --amber: #b45309;
    --ambg: #fffbeb;
    --ambd: #fde68a;
    --rad: 10px;
    --rad2: 6px;
    --shadow-card: 0 4px 24px rgba(0,0,0,.09), 0 1px 4px rgba(0,0,0,.05);
    --text-dark: #333;
    --text-900: #0f172a;
    --amber-darker: #92400e;
    --amber-dark: #78350f;
    --brand-yellow: #fbbf24;
    --light-bg: #fafafa;
    --light-border: #d1ead9;
    --light-border-soft: #c6e6d4;
    --brand-blue: #1a1f71;
    --brand-red: #eb001b;
    --brand-orange: #f79e1b;
    --bg-dark: #0d1f18;
    --blue-primary: #007bff;
    --muted-gray: #6c757d;
    --gray-555: #555;
    --green-focus: rgba(42, 92, 69, 0.1);
    --green-shadow: rgba(42, 92, 69, 0.32);
    --green-orb: rgba(78,168,126,0.13);
    --green-shadow-22: rgba(22,51,40,0.22);
    --green-bg-08: rgba(22,51,40,0.08);
    --red-focus: rgba(220, 38, 38, 0.1);
    --red-focus-alt: rgba(239,68,68,0.1);
    --success-focus: rgba(22, 163, 74, 0.1);
    --light-gray-bg: #f9fafb;
    --warning-bg: #fff8e6;
    --warning-border: #f6d860;
    --warning-fill: #c47a00;
    --warning-text: #7a5000;
    --warning-text-dark: #5c3a00;
    --blue: #2563eb;
    --danger-700: #7f1d1d;
    --blue-800: #1e40af;
    --shadow-black-20: rgba(0,0,0,.2);
    --shadow-black-10: rgba(0,0,0,.10);
    --shadow-black-08: rgba(0,0,0,.08);
    --shadow-green-30: rgba(78,168,126,.3);
    --shadow-green-30b: rgba(42,92,69,.3);
    --amber-700: #ca8a04;
    --neon-green: #0cea35;
    --overlay-dark: rgba(0,0,0,.55);
    --red-focus-15: rgba(239,68,68,.15);
    --green-500: #22c55e;
    --amber-500: #f59e0b;
    --yellow-100: #fef9c3;
    --yellow-800: #854d0e;
    --green-100: #eafff0;
    --green-600: #166534;
    --green-300: #29bf45;
    --greeni-50: #dcfce7;
    --green-900: #267c29;
    --purple-100: #f5f3ff;
    --purple-200: #e9d5ff;
    --blue-600: #3a6ac7;
    --gray-700: #8b7a7a;
}


body.theme-blue {
    --g9: #0f172a;
    --g8: #1d4ed8;
    --g7: #2563eb;
    --g6: #3b82f6;
    --g5: #60a5fa;
    --g4: #93c5fd;
    --g3: #dbeafe;
    --g1: #eff6ff;
    --success-light-bg: #dbeafe;
    --success-shadow-10: 0 0 0 3px rgba(59,130,246,.1);
    --green-overlay-08: rgba(59,130,246,.08);
    --green-overlay-06: rgba(59,130,246,.06);
    --green-action-08: rgba(59,130,246,.08);
    --green-action-06: rgba(59,130,246,.06);
    --green-border-12: rgba(59,130,246,.12);
    --green-shadow-30: 0 4px 14px rgba(59,130,246,.3);
    --green-50: #1d4ed8;
    --green-success: #2563eb;
    --green-600-dark: #1e40af;
    --green-600-alt: #1d4ed8;
    --green-600-darker: #1e3a8a;
    --green-action: #1d4ed8;
    --surface-hover: #eff6ff;
    --surface-hover-light: #f0f9ff;
    --border-light1: #bfdbfe;
    --bg-light: #eff6ff;
    --bg-light1: #e0f2fe;
    --bg-light-alt: #f0f9ff;
    --bg-lighter: #f9f9f9;
    --bg-lightest: #eaf8ff;
    --bg-very-light: #f8fbff;
    --bg-ultra-light: #eff6ff;
    --gradient-example-1: #eff6ff;
    --gradient-example-2: #dbeafe;
    --surface-hover: #eff6ff;
    --focus-light: #eff6ff;
    --focus-lighter: #dbeafe;
    --dropdown-add-bg: #eff6ff;
    --border-hover-green: #bfdbfe;
    --focus-shadow-strong: rgba(59, 130, 246, 0.2);
    --focus-shadow-medium: rgba(59, 130, 246, 0.14);
    --focus-shadow-light: rgba(59, 130, 246, 0.12);
    --focus-shadow-lighter: rgba(59, 130, 246, 0.1);
    --helper-border: rgba(59, 130, 246, 0.08);
    --helper-bg: rgba(219, 234, 254, 0.55);
    --button-shadow: rgba(59, 130, 246, 0.18);
    --helper-border-green: rgba(59, 130, 246, 0.24);
    --helper-border-light: rgba(59, 130, 246, 0.12);
    --shadow-focus-light: rgba(59,130,246,.1);
    --shadow-focus-medium: rgba(59,130,246,.12);
    --shadow-focus-medium1: rgba(59,130,246,.2);
    --shadow-focus-strong: rgba(59,130,246,.2);
    --gradient-example-3: rgb(125 150 219 / 18%);
    --green-100: #eff6ff;
    --green-600: #1e40af;
    --green-300: #3b82f6;
    --greeni-50: #e0f2fe;
    --green-900: #1e3a8a;
    --green-500: #3b82f6;
    --green-03: rgba(59,130,246,0.3);
    --green-04: rgba(59,130,246,0.04);
    --green-025: rgba(147,197,253,0.25);
    --green-045: rgba(147,197,253,0.45);
    --green-focus: rgba(59,130,246,0.1);
    --green-shadow: rgba(59,130,246,0.32);
    --green-orb: rgba(147,197,253,0.13);
    --green-shadow-22: rgba(30,64,175,0.22);
    --green-bg-08: rgba(30,64,175,0.08);
    --shadow-green-30: rgba(59,130,246,.3);
    --shadow-green-30b: rgba(30,64,175,.3);
    --neon-green: #0ea5e9;
    --success-green: #2563eb;
    --focus-shadow: 0 0 0 3px rgba(59,130,246,0.1);
    --light-border: #bfdbfe;
    --light-border-soft: #c7e9ff;
    --success-focus: rgba(59,130,246,0.1);
}

body.theme-red {
    --g9: #2b0a0a;
    --g8: #7f1d1d;
    --g7: #991b1b;
    --g6: #dc2626;
    --g5: #ef4444;
    --g4: #f87171;
    --g3: #fca5a5;
    --g1: #fef2f2;
    --success-light-bg: #fee2e2;
    --success-shadow-10: 0 0 0 3px rgba(220,38,38,.1);
    --green-overlay-08: rgba(220,38,38,.08);
    --green-overlay-06: rgba(220,38,38,.06);
    --green-action-08: rgba(220,38,38,.08);
    --green-action-06: rgba(220,38,38,.06);
    --green-border-12: rgba(220,38,38,.12);
    --green-shadow-30: 0 4px 14px rgba(220,38,38,.3);
    --green-50: #7f1d1d;
    --green-success: #dc2626;
    --green-600-dark: #991b1b;
    --green-600-alt: #7f1d1d;
    --green-600-darker: #7f1d1d;
    --green-action: #7f1d1d;
    --surface-hover: #fef2f2;
    --surface-hover-light: #fef5f5;
    --border-light1: #fca5a5;
    --bg-light: #fef2f2;
    --bg-light1: #fee2e2;
    --bg-light-alt: #fef5f5;
    --bg-lighter: #fafafa;
    --bg-lightest: #fef9f9;
    --bg-very-light: #fef8f8;
    --bg-ultra-light: #fef2f2;
    --gradient-example-1: #fef2f2;
    --gradient-example-2: #fee2e2;
    --surface-hover: #fef2f2;
    --focus-light: #fef2f2;
    --focus-lighter: #fee2e2;
    --dropdown-add-bg: #fef2f2;
    --border-hover-green: #fca5a5;
    --focus-shadow-strong: rgba(220, 38, 38, 0.2);
    --focus-shadow-medium: rgba(220, 38, 38, 0.14);
    --focus-shadow-light: rgba(220, 38, 38, 0.12);
    --focus-shadow-lighter: rgba(220, 38, 38, 0.1);
    --helper-border: rgba(220, 38, 38, 0.08);
    --helper-bg: rgba(254, 226, 226, 0.55);
    --button-shadow: rgba(220, 38, 38, 0.18);
    --helper-border-green: rgba(220, 38, 38, 0.24);
    --helper-border-light: rgba(220, 38, 38, 0.12);
    --shadow-focus-light: rgba(220,38,38,.1);
    --shadow-focus-medium: rgba(220,38,38,.12);
    --shadow-focus-medium1: rgba(220,38,38,.2);
    --shadow-focus-strong: rgba(220,38,38,.2);
    --gradient-example-3: rgb(220 38 38 / 18%);
    --green-100: #fef2f2;
    --green-600: #991b1b;
    --green-300: #f87171;
    --greeni-50: #fee2e2;
    --green-900: #7f1d1d;
    --green-500: #ef4444;
    --green-03: rgba(220,38,38,0.3);
    --green-04: rgba(220,38,38,0.04);
    --green-025: rgba(248,113,113,0.25);
    --green-045: rgba(248,113,113,0.45);
    --green-focus: rgba(220,38,38,0.1);
    --green-shadow: rgba(220,38,38,0.32);
    --green-orb: rgba(248,113,113,0.13);
    --green-shadow-22: rgba(159,18,18,0.22);
    --green-bg-08: rgba(159,18,18,0.08);
    --shadow-green-30: rgba(220,38,38,.3);
    --shadow-green-30b: rgba(159,18,18,.3);
    --neon-green: #f87171;
    --success-green: #dc2626;
    --focus-shadow: 0 0 0 3px rgba(220,38,38,0.1);
    --light-border: #fca5a5;
    --light-border-soft: #fecaca;
    --success-focus: rgba(220,38,38,0.1);
}

body.theme-purple {
    --g9: #2d1b4e;
    --g8: #5b21b6;
    --g7: #7c3aed;
    --g6: #a855f7;
    --g5: #c084fc;
    --g4: #d8b4fe;
    --g3: #e9d5ff;
    --g1: #f5f3ff;
    --success-light-bg: #e9d5ff;
    --success-shadow-10: 0 0 0 3px rgba(124,58,237,.1);
    --green-overlay-08: rgba(124,58,237,.08);
    --green-overlay-06: rgba(124,58,237,.06);
    --green-action-08: rgba(124,58,237,.08);
    --green-action-06: rgba(124,58,237,.06);
    --green-border-12: rgba(124,58,237,.12);
    --green-shadow-30: 0 4px 14px rgba(124,58,237,.3);
    --green-50: #5b21b6;
    --green-success: #7c3aed;
    --green-600-dark: #6d28d9;
    --green-600-alt: #5b21b6;
    --green-600-darker: #4c1d95;
    --green-action: #5b21b6;
    --surface-hover: #f5f3ff;
    --surface-hover-light: #faf5ff;
    --border-light1: #d8b4fe;
    --bg-light: #f5f3ff;
    --bg-light1: #ede9fe;
    --bg-light-alt: #faf5ff;
    --bg-lighter: #fafafa;
    --bg-lightest: #faf8ff;
    --bg-very-light: #faf7ff;
    --bg-ultra-light: #f5f3ff;
    --gradient-example-1: #f5f3ff;
    --gradient-example-2: #e9d5ff;
    --surface-hover: #f5f3ff;
    --focus-light: #f5f3ff;
    --focus-lighter: #e9d5ff;
    --dropdown-add-bg: #f5f3ff;
    --border-hover-green: #d8b4fe;
    --focus-shadow-strong: rgba(124, 58, 237, 0.2);
    --focus-shadow-medium: rgba(124, 58, 237, 0.14);
    --focus-shadow-light: rgba(124, 58, 237, 0.12);
    --focus-shadow-lighter: rgba(124, 58, 237, 0.1);
    --helper-border: rgba(124, 58, 237, 0.08);
    --helper-bg: rgba(233, 213, 255, 0.55);
    --button-shadow: rgba(124, 58, 237, 0.18);
    --helper-border-green: rgba(124, 58, 237, 0.24);
    --helper-border-light: rgba(124, 58, 237, 0.12);
    --shadow-focus-light: rgba(124,58,237,.1);
    --shadow-focus-medium: rgba(124,58,237,.12);
    --shadow-focus-medium1: rgba(124,58,237,.2);
    --shadow-focus-strong: rgba(124,58,237,.2);
    --gradient-example-3: rgb(124 58 237 / 18%);
    --green-100: #f5f3ff;
    --green-600: #6d28d9;
    --green-300: #d8b4fe;
    --greeni-50: #ede9fe;
    --green-900: #4c1d95;
    --green-500: #a855f7;
    --green-03: rgba(124,58,237,0.3);
    --green-04: rgba(124,58,237,0.04);
    --green-025: rgba(216,180,254,0.25);
    --green-045: rgba(216,180,254,0.45);
    --green-focus: rgba(124,58,237,0.1);
    --green-shadow: rgba(124,58,237,0.32);
    --green-orb: rgba(216,180,254,0.13);
    --green-shadow-22: rgba(88,28,135,0.22);
    --green-bg-08: rgba(88,28,135,0.08);
    --shadow-green-30: rgba(124,58,237,.3);
    --shadow-green-30b: rgba(88,28,135,.3);
    --neon-green: #c084fc;
    --success-green: #a855f7;
    --focus-shadow: 0 0 0 3px rgba(124,58,237,0.1);
    --light-border: #e9d5ff;
    --light-border-soft: #f3e8ff;
    --success-focus: rgba(124,58,237,0.1);
}

body.theme-indigo {
    --g9: #1e1b4b;
    --g8: #3730a3;
    --g7: #4f46e5;
    --g6: #6366f1;
    --g5: #818cf8;
    --g4: #a5b4fc;
    --g3: #c7d2fe;
    --g1: #eef2ff;
    --success-light-bg: #e0e7ff;
    --success-shadow-10: 0 0 0 3px rgba(79,70,229,.1);
    --green-overlay-08: rgba(79,70,229,.08);
    --green-overlay-06: rgba(79,70,229,.06);
    --green-action-08: rgba(79,70,229,.08);
    --green-action-06: rgba(79,70,229,.06);
    --green-border-12: rgba(79,70,229,.12);
    --green-shadow-30: 0 4px 14px rgba(79,70,229,.3);
    --green-50: #3730a3;
    --green-success: #4f46e5;
    --green-600-dark: #4338ca;
    --green-600-alt: #3730a3;
    --green-600-darker: #312e81;
    --green-action: #3730a3;
    --surface-hover: #eef2ff;
    --surface-hover-light: #f5f3ff;
    --border-light1: #a5b4fc;
    --bg-light: #eef2ff;
    --bg-light1: #e0e7ff;
    --bg-light-alt: #f5f3ff;
    --bg-lighter: #fafafa;
    --bg-lightest: #f0f4ff;
    --bg-very-light: #f3f4ff;
    --bg-ultra-light: #eef2ff;
    --gradient-example-1: #eef2ff;
    --gradient-example-2: #e0e7ff;
    --surface-hover: #eef2ff;
    --focus-light: #eef2ff;
    --focus-lighter: #e0e7ff;
    --dropdown-add-bg: #eef2ff;
    --border-hover-green: #a5b4fc;
    --focus-shadow-strong: rgba(79, 70, 229, 0.2);
    --focus-shadow-medium: rgba(79, 70, 229, 0.14);
    --focus-shadow-light: rgba(79, 70, 229, 0.12);
    --focus-shadow-lighter: rgba(79, 70, 229, 0.1);
    --helper-border: rgba(79, 70, 229, 0.08);
    --helper-bg: rgba(224, 231, 255, 0.55);
    --button-shadow: rgba(79, 70, 229, 0.18);
    --helper-border-green: rgba(79, 70, 229, 0.24);
    --helper-border-light: rgba(79, 70, 229, 0.12);
    --shadow-focus-light: rgba(79,70,229,.1);
    --shadow-focus-medium: rgba(79,70,229,.12);
    --shadow-focus-medium1: rgba(79,70,229,.2);
    --shadow-focus-strong: rgba(79,70,229,.2);
    --gradient-example-3: rgb(79 70 229 / 18%);
    --green-100: #eef2ff;
    --green-600: #4338ca;
    --green-300: #c7d2fe;
    --greeni-50: #e0e7ff;
    --green-900: #312e81;
    --green-500: #6366f1;
    --green-03: rgba(79,70,229,0.3);
    --green-04: rgba(79,70,229,0.04);
    --green-025: rgba(165,180,252,0.25);
    --green-045: rgba(165,180,252,0.45);
    --green-focus: rgba(79,70,229,0.1);
    --green-shadow: rgba(79,70,229,0.32);
    --green-orb: rgba(165,180,252,0.13);
    --green-shadow-22: rgba(55,48,163,0.22);
    --green-bg-08: rgba(55,48,163,0.08);
    --shadow-green-30: rgba(79,70,229,.3);
    --shadow-green-30b: rgba(55,48,163,.3);
    --neon-green: #a5b4fc;
    --success-green: #6366f1;
    --focus-shadow: 0 0 0 3px rgba(79,70,229,0.1);
    --light-border: #e0e7ff;
    --light-border-soft: #e0e7ff;
    --success-focus: rgba(79,70,229,0.1);
}

body.theme-pink {
    --g9: #500724;
    --g8: #be185d;
    --g7: #db2777;
    --g6: #ec4899;
    --g5: #f472b6;
    --g4: #f9a8d4;
    --g3: #fbcfe8;
    --g1: #fdf2f8;
    --success-light-bg: #fce7f3;
    --success-shadow-10: 0 0 0 3px rgba(236,72,153,.1);
    --green-overlay-08: rgba(236,72,153,.08);
    --green-overlay-06: rgba(236,72,153,.06);
    --green-action-08: rgba(236,72,153,.08);
    --green-action-06: rgba(236,72,153,.06);
    --green-border-12: rgba(236,72,153,.12);
    --green-shadow-30: 0 4px 14px rgba(236,72,153,.3);
    --green-50: #be185d;
    --green-success: #db2777;
    --green-600-dark: #be185d;
    --green-600-alt: #be185d;
    --green-600-darker: #9d174d;
    --green-action: #be185d;
    --surface-hover: #fdf2f8;
    --surface-hover-light: #fdf2f8;
    --border-light1: #fbcfe8;
    --bg-light: #fdf2f8;
    --bg-light1: #fce7f3;
    --bg-light-alt: #fdf0f7;
    --bg-lighter: #fafafa;
    --bg-lightest: #fef9fc;
    --bg-very-light: #fefbfd;
    --bg-ultra-light: #fdf2f8;
    --gradient-example-1: #fdf2f8;
    --gradient-example-2: #fce7f3;
    --surface-hover: #fdf2f8;
    --focus-light: #fdf2f8;
    --focus-lighter: #fce7f3;
    --dropdown-add-bg: #fdf2f8;
    --border-hover-green: #fbcfe8;
    --focus-shadow-strong: rgba(236, 72, 153, 0.2);
    --focus-shadow-medium: rgba(236, 72, 153, 0.14);
    --focus-shadow-light: rgba(236, 72, 153, 0.12);
    --focus-shadow-lighter: rgba(236, 72, 153, 0.1);
    --helper-border: rgba(236, 72, 153, 0.08);
    --helper-bg: rgba(252, 231, 243, 0.55);
    --button-shadow: rgba(236, 72, 153, 0.18);
    --helper-border-green: rgba(236, 72, 153, 0.24);
    --helper-border-light: rgba(236, 72, 153, 0.12);
    --shadow-focus-light: rgba(236,72,153,.1);
    --shadow-focus-medium: rgba(236,72,153,.12);
    --shadow-focus-medium1: rgba(236,72,153,.2);
    --shadow-focus-strong: rgba(236,72,153,.2);
    --gradient-example-3: rgb(236 72 153 / 18%);
    --green-100: #fdf2f8;
    --green-600: #be185d;
    --green-300: #f9a8d4;
    --greeni-50: #fce7f3;
    --green-900: #9d174d;
    --green-500: #ec4899;
    --green-03: rgba(236,72,153,0.3);
    --green-04: rgba(236,72,153,0.04);
    --green-025: rgba(249,168,212,0.25);
    --green-045: rgba(249,168,212,0.45);
    --green-focus: rgba(236,72,153,0.1);
    --green-shadow: rgba(236,72,153,0.32);
    --green-orb: rgba(249,168,212,0.13);
    --green-shadow-22: rgba(157,23,77,0.22);
    --green-bg-08: rgba(157,23,77,0.08);
    --shadow-green-30: rgba(236,72,153,.3);
    --shadow-green-30b: rgba(157,23,77,.3);
    --neon-green: #f9a8d4;
    --success-green: #ec4899;
    --focus-shadow: 0 0 0 3px rgba(236,72,153,0.1);
    --light-border: #fbcfe8;
    --light-border-soft: #fce7f3;
    --success-focus: rgba(236,72,153,0.1);
}

body.theme-orange {
    --g9: #5a2e0c;
    --g8: #92400e;
    --g7: #b45309;
    --g6: #d97706;
    --g5: #f59e0b;
    --g4: #fbbf24;
    --g3: #fcd34d;
    --g1: #fffbeb;
    --success-light-bg: #fef3c7;
    --success-shadow-10: 0 0 0 3px rgba(217,119,6,.1);
    --green-overlay-08: rgba(217,119,6,.08);
    --green-overlay-06: rgba(217,119,6,.06);
    --green-action-08: rgba(217,119,6,.08);
    --green-action-06: rgba(217,119,6,.06);
    --green-border-12: rgba(217,119,6,.12);
    --green-shadow-30: 0 4px 14px rgba(217,119,6,.3);
    --green-50: #92400e;
    --green-success: #b45309;
    --green-600-dark: #b45309;
    --green-600-alt: #92400e;
    --green-600-darker: #78350f;
    --green-action: #92400e;
    --surface-hover: #fffbeb;
    --surface-hover-light: #fffbeb;
    --border-light1: #fcd34d;
    --bg-light: #fffbeb;
    --bg-light1: #fef3c7;
    --bg-light-alt: #fffbeb;
    --bg-lighter: #fafafa;
    --bg-lightest: #fffef0;
    --bg-very-light: #fffdf5;
    --bg-ultra-light: #fffbeb;
    --gradient-example-1: #fffbeb;
    --gradient-example-2: #fef3c7;
    --surface-hover: #fffbeb;
    --focus-light: #fffbeb;
    --focus-lighter: #fef3c7;
    --dropdown-add-bg: #fffbeb;
    --border-hover-green: #fcd34d;
    --focus-shadow-strong: rgba(217, 119, 6, 0.2);
    --focus-shadow-medium: rgba(217, 119, 6, 0.14);
    --focus-shadow-light: rgba(217, 119, 6, 0.12);
    --focus-shadow-lighter: rgba(217, 119, 6, 0.1);
    --helper-border: rgba(217, 119, 6, 0.08);
    --helper-bg: rgba(254, 243, 199, 0.55);
    --button-shadow: rgba(217, 119, 6, 0.18);
    --helper-border-green: rgba(217, 119, 6, 0.24);
    --helper-border-light: rgba(217, 119, 6, 0.12);
    --shadow-focus-light: rgba(217,119,6,.1);
    --shadow-focus-medium: rgba(217,119,6,.12);
    --shadow-focus-medium1: rgba(217,119,6,.2);
    --shadow-focus-strong: rgba(217,119,6,.2);
    --gradient-example-3: rgb(217 119 6 / 18%);
    --green-100: #fffbeb;
    --green-600: #b45309;
    --green-300: #fbbf24;
    --greeni-50: #fef3c7;
    --green-900: #78350f;
    --green-500: #f59e0b;
    --green-03: rgba(217,119,6,0.3);
    --green-04: rgba(217,119,6,0.04);
    --green-025: rgba(251,191,36,0.25);
    --green-045: rgba(251,191,36,0.45);
    --green-focus: rgba(217,119,6,0.1);
    --green-shadow: rgba(217,119,6,0.32);
    --green-orb: rgba(251,191,36,0.13);
    --green-shadow-22: rgba(120,53,15,0.22);
    --green-bg-08: rgba(120,53,15,0.08);
    --shadow-green-30: rgba(217,119,6,.3);
    --shadow-green-30b: rgba(120,53,15,.3);
    --neon-green: #fbbf24;
    --success-green: #f59e0b;
    --focus-shadow: 0 0 0 3px rgba(217,119,6,0.1);
    --light-border: #fcd34d;
    --light-border-soft: #fef3c7;
    --success-focus: rgba(217,119,6,0.1);
}

body.theme-teal {
    --g9: #0d3b3b;
    --g8: #0d6b63;
    --g7: #0f766e;
    --g6: #14b8a6;
    --g5: #2dd4bf;
    --g4: #67e8f9;
    --g3: #a5f3fc;
    --g1: #f0fdfa;
    --success-light-bg: #ccfbf1;
    --success-shadow-10: 0 0 0 3px rgba(20,184,166,.1);
    --green-overlay-08: rgba(20,184,166,.08);
    --green-overlay-06: rgba(20,184,166,.06);
    --green-action-08: rgba(20,184,166,.08);
    --green-action-06: rgba(20,184,166,.06);
    --green-border-12: rgba(20,184,166,.12);
    --green-shadow-30: 0 4px 14px rgba(20,184,166,.3);
    --green-50: #0d6b63;
    --green-success: #0f766e;
    --green-600-dark: #0d9488;
    --green-600-alt: #0d6b63;
    --green-600-darker: #134e4a;
    --green-action: #0d6b63;
    --surface-hover: #f0fdfa;
    --surface-hover-light: #f0fdfa;
    --border-light1: #99f6e4;
    --bg-light: #f0fdfa;
    --bg-light1: #ccfbf1;
    --bg-light-alt: #f0fdfa;
    --bg-lighter: #fafafa;
    --bg-lightest: #f4fefc;
    --bg-very-light: #f8fdfc;
    --bg-ultra-light: #f0fdfa;
    --gradient-example-1: #f0fdfa;
    --gradient-example-2: #ccfbf1;
    --surface-hover: #f0fdfa;
    --focus-light: #f0fdfa;
    --focus-lighter: #ccfbf1;
    --dropdown-add-bg: #f0fdfa;
    --border-hover-green: #99f6e4;
    --focus-shadow-strong: rgba(20, 184, 166, 0.2);
    --focus-shadow-medium: rgba(20, 184, 166, 0.14);
    --focus-shadow-light: rgba(20, 184, 166, 0.12);
    --focus-shadow-lighter: rgba(20, 184, 166, 0.1);
    --helper-border: rgba(20, 184, 166, 0.08);
    --helper-bg: rgba(204, 251, 241, 0.55);
    --button-shadow: rgba(20, 184, 166, 0.18);
    --helper-border-green: rgba(20, 184, 166, 0.24);
    --helper-border-light: rgba(20, 184, 166, 0.12);
    --shadow-focus-light: rgba(20,184,166,.1);
    --shadow-focus-medium: rgba(20,184,166,.12);
    --shadow-focus-medium1: rgba(20,184,166,.2);
    --shadow-focus-strong: rgba(20,184,166,.2);
    --gradient-example-3: rgb(20 184 166 / 18%);
    --green-100: #f0fdfa;
    --green-600: #0d9488;
    --green-300: #67e8f9;
    --greeni-50: #ccfbf1;
    --green-900: #134e4a;
    --green-500: #14b8a6;
    --green-03: rgba(20,184,166,0.3);
    --green-04: rgba(20,184,166,0.04);
    --green-025: rgba(45,212,191,0.25);
    --green-045: rgba(45,212,191,0.45);
    --green-focus: rgba(20,184,166,0.1);
    --green-shadow: rgba(20,184,166,0.32);
    --green-orb: rgba(45,212,191,0.13);
    --green-shadow-22: rgba(13,107,99,0.22);
    --green-bg-08: rgba(13,107,99,0.08);
    --shadow-green-30: rgba(20,184,166,.3);
    --shadow-green-30b: rgba(13,107,99,.3);
    --neon-green: #67e8f9;
    --success-green: #14b8a6;
    --focus-shadow: 0 0 0 3px rgba(20,184,166,0.1);
    --light-border: #99f6e4;
    --light-border-soft: #ccfbf1;
    --success-focus: rgba(20,184,166,0.1);
}

body.theme-cyan {
    --g9: #0c2d4a;
    --g8: #0369a1;
    --g7: #0284c7;
    --g6: #0ea5e9;
    --g5: #38bdf8;
    --g4: #7dd3fc;
    --g3: #cffafe;
    --g1: #f0f9ff;
    --success-light-bg: #cffafe;
    --success-shadow-10: 0 0 0 3px rgba(14,165,233,.1);
    --green-overlay-08: rgba(14,165,233,.08);
    --green-overlay-06: rgba(14,165,233,.06);
    --green-action-08: rgba(14,165,233,.08);
    --green-action-06: rgba(14,165,233,.06);
    --green-border-12: rgba(14,165,233,.12);
    --green-shadow-30: 0 4px 14px rgba(14,165,233,.3);
    --green-50: #0369a1;
    --green-success: #0284c7;
    --green-600-dark: #0284c7;
    --green-600-alt: #0369a1;
    --green-600-darker: #075985;
    --green-action: #0369a1;
    --surface-hover: #f0f9ff;
    --surface-hover-light: #f0f9ff;
    --border-light1: #7dd3fc;
    --bg-light: #f0f9ff;
    --bg-light1: #e0f2fe;
    --bg-light-alt: #f0f9ff;
    --bg-lighter: #fafafa;
    --bg-lightest: #f4f9fd;
    --bg-very-light: #f7fbfe;
    --bg-ultra-light: #f0f9ff;
    --gradient-example-1: #f0f9ff;
    --gradient-example-2: #e0f2fe;
    --surface-hover: #f0f9ff;
    --focus-light: #f0f9ff;
    --focus-lighter: #e0f2fe;
    --dropdown-add-bg: #f0f9ff;
    --border-hover-green: #7dd3fc;
    --focus-shadow-strong: rgba(14, 165, 233, 0.2);
    --focus-shadow-medium: rgba(14, 165, 233, 0.14);
    --focus-shadow-light: rgba(14, 165, 233, 0.12);
    --focus-shadow-lighter: rgba(14, 165, 233, 0.1);
    --helper-border: rgba(14, 165, 233, 0.08);
    --helper-bg: rgba(207, 250, 254, 0.55);
    --button-shadow: rgba(14, 165, 233, 0.18);
    --helper-border-green: rgba(14, 165, 233, 0.24);
    --helper-border-light: rgba(14, 165, 233, 0.12);
    --shadow-focus-light: rgba(14,165,233,.1);
    --shadow-focus-medium: rgba(14,165,233,.12);
    --shadow-focus-medium1: rgba(14,165,233,.2);
    --shadow-focus-strong: rgba(14,165,233,.2);
    --gradient-example-3: rgb(14 165 233 / 18%);
    --green-100: #f0f9ff;
    --green-600: #0284c7;
    --green-300: #7dd3fc;
    --greeni-50: #e0f2fe;
    --green-900: #075985;
    --green-500: #0ea5e9;
    --green-03: rgba(14,165,233,0.3);
    --green-04: rgba(14,165,233,0.04);
    --green-025: rgba(56,189,248,0.25);
    --green-045: rgba(56,189,248,0.45);
    --green-focus: rgba(14,165,233,0.1);
    --green-shadow: rgba(14,165,233,0.32);
    --green-orb: rgba(56,189,248,0.13);
    --green-shadow-22: rgba(3,105,161,0.22);
    --green-bg-08: rgba(3,105,161,0.08);
    --shadow-green-30: rgba(14,165,233,.3);
    --shadow-green-30b: rgba(3,105,161,.3);
    --neon-green: #7dd3fc;
    --success-green: #0ea5e9;
    --focus-shadow: 0 0 0 3px rgba(14,165,233,0.1);
    --light-border: #cffafe;
    --light-border-soft: #e0f2fe;
    --success-focus: rgba(14,165,233,0.1);
}

body.theme-yellow {
    --g9: #713f12;
    --g8: #ca8a04;
    --g7: #eab308;
    --g6: #facc15;
    --g5: #fde047;
    --g4: #fef08a;
    --g3: #fef3c7;
    --g1: #fefce8;
    --success-light-bg: #fef9c3;
    --success-shadow-10: 0 0 0 3px rgba(202,136,4,.1);
    --green-overlay-08: rgba(202,136,4,.08);
    --green-overlay-06: rgba(202,136,4,.06);
    --green-action-08: rgba(202,136,4,.08);
    --green-action-06: rgba(202,136,4,.06);
    --green-border-12: rgba(202,136,4,.12);
    --green-shadow-30: 0 4px 14px rgba(202,136,4,.3);
    --green-50: #ca8a04;
    --green-success: #eab308;
    --green-600-dark: #eab308;
    --green-600-alt: #ca8a04;
    --green-600-darker: #a16207;
    --green-action: #ca8a04;
    --surface-hover: #fefce8;
    --surface-hover-light: #fefce8;
    --border-light1: #fef3c7;
    --bg-light: #fefce8;
    --bg-light1: #fef9c3;
    --bg-light-alt: #fefce8;
    --bg-lighter: #fafafa;
    --bg-lightest: #fffef0;
    --bg-very-light: #fffef7;
    --bg-ultra-light: #fefce8;
    --gradient-example-1: #fefce8;
    --gradient-example-2: #fef9c3;
    --surface-hover: #fefce8;
    --focus-light: #fefce8;
    --focus-lighter: #fef9c3;
    --dropdown-add-bg: #fefce8;
    --border-hover-green: #fef3c7;
    --focus-shadow-strong: rgba(202, 136, 4, 0.2);
    --focus-shadow-medium: rgba(202, 136, 4, 0.14);
    --focus-shadow-light: rgba(202, 136, 4, 0.12);
    --focus-shadow-lighter: rgba(202, 136, 4, 0.1);
    --helper-border: rgba(202, 136, 4, 0.08);
    --helper-bg: rgba(254, 249, 195, 0.55);
    --button-shadow: rgba(202, 136, 4, 0.18);
    --helper-border-green: rgba(202, 136, 4, 0.24);
    --helper-border-light: rgba(202, 136, 4, 0.12);
    --shadow-focus-light: rgba(202,136,4,.1);
    --shadow-focus-medium: rgba(202,136,4,.12);
    --shadow-focus-medium1: rgba(202,136,4,.2);
    --shadow-focus-strong: rgba(202,136,4,.2);
    --gradient-example-3: rgb(202 136 4 / 18%);
    --green-100: #fefce8;
    --green-600: #eab308;
    --green-300: #fef08a;
    --greeni-50: #fef9c3;
    --green-900: #a16207;
    --green-500: #facc15;
    --green-03: rgba(202,136,4,0.3);
    --green-04: rgba(202,136,4,0.04);
    --green-025: rgba(250,204,21,0.25);
    --green-045: rgba(250,204,21,0.45);
    --green-focus: rgba(202,136,4,0.1);
    --green-shadow: rgba(202,136,4,0.32);
    --green-orb: rgba(250,204,21,0.13);
    --green-shadow-22: rgba(120,53,15,0.22);
    --green-bg-08: rgba(120,53,15,0.08);
    --shadow-green-30: rgba(202,136,4,.3);
    --shadow-green-30b: rgba(120,53,15,.3);
    --neon-green: #fef08a;
    --success-green: #facc15;
    --focus-shadow: 0 0 0 3px rgba(202,136,4,0.1);
    --light-border: #fef3c7;
    --light-border-soft: #fef9c3;
    --success-focus: rgba(202,136,4,0.1);
}

html, body {
    height: 100%;
    font-family: var(--font);
    background: var(--bg);
    color: var(--t1);
    -webkit-font-smoothing: antialiased
}