/* Generated by tools/themes/apply.js from tools/themes/catalog.json — do not edit (edit the catalog, then run the tool). */
:root[data-skin="mo-factory"] { --font: 'Cairo'; --bg: #f5f5f5; --panel: #ffffff; --text: rgba(0,0,0,0.88); --muted: #6f6f6f; --line: #f0f0f0; --primary: #1e3a5f; --primary-soft: #e6edf5; --side: #1e3a5f; --side-text: #ffffff; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #1e3a5f; --on-primary: #ffffff; --surface-2: #fafafa; --hover: #fafafa; --input-border: #f0f0f0; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-factory"][data-theme="dark"] { --font: 'Cairo'; --bg: #000000; --panel: #141414; --text: rgba(255,255,255,0.85); --muted: #868686; --line: #303030; --primary: #4a79ac; --primary-soft: #15263b; --side: #001529; --side-text: #ffffff; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #4a79ac; --on-primary: #ffffff; --surface-2: #1f1f1f; --hover: #1f1f1f; --input-border: #303030; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-factory"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-lotus"] { --font: 'Cairo'; --bg: #f5f5f7; --panel: #ffffff; --text: #1f1f2e; --muted: #6f6f7a; --line: #ececf1; --primary: #7c3aed; --primary-soft: #f3e8ff; --side: #ffffff; --side-text: #1f1f2e; --side-hover: rgba(0,0,0,.05); --side-strong: #1f1f2e; --side-link: #1f1f2e; --side-active: #7c3aed; --on-primary: #ffffff; --surface-2: #fafafa; --hover: #fafafa; --input-border: #ececf1; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-lotus"][data-theme="dark"] { --font: 'Cairo'; --bg: #0f0d17; --panel: #1a1726; --text: #ece9f7; --muted: #9a94b3; --line: #2e2942; --primary: #9b6cf6; --primary-soft: #2a1f47; --side: #151220; --side-text: #ece9f7; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #9b6cf6; --on-primary: #111111; --surface-2: #221e31; --hover: #221e31; --input-border: #2e2942; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-lotus"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-ocean"] { --font: 'Cairo'; --bg: #f0f4f9; --panel: #ffffff; --text: #14213d; --muted: #636d81; --line: #e3e9f2; --primary: #1677ff; --primary-soft: #e6f0ff; --side: #001529; --side-text: #ffffff; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #06b6d4; --side-active: #1677ff; --on-primary: #111111; --surface-2: #f7f9fc; --hover: #f7f9fc; --input-border: #e3e9f2; --radius: 12px; --r-sm: 6px; --r-nav: 6px; }
:root[data-skin="mo-ocean"][data-theme="dark"] { --font: 'Cairo'; --bg: #0a1220; --panel: #111c2e; --text: #e3ebf7; --muted: #8193b2; --line: #22324d; --primary: #3c89ff; --primary-soft: #132a4d; --side: #07101d; --side-text: #e3ebf7; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #22d3ee; --side-active: #3c89ff; --on-primary: #111111; --surface-2: #16233a; --hover: #16233a; --input-border: #22324d; --radius: 12px; --r-sm: 6px; --r-nav: 6px; }
:root[data-skin="mo-ocean"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-emerald"] { --font: 'Tajawal'; --bg: #f1f7f4; --panel: #ffffff; --text: #10261d; --muted: #5e7369; --line: #dfece6; --primary: #059669; --primary-soft: #e3f6ee; --side: linear-gradient(180deg, #064e3b 0%, #065f46 100%); --side-text: #ffffff; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #059669; --on-primary: #111111; --surface-2: #f6faf8; --hover: #f6faf8; --input-border: #dfece6; --radius: 16px; --r-sm: 10px; --r-nav: 10px; }
:root[data-skin="mo-emerald"][data-theme="dark"] { --font: 'Tajawal'; --bg: #0a1511; --panel: #10201a; --text: #e2f2ea; --muted: #86a597; --line: #1f3a2f; --primary: #10b981; --primary-soft: #0f3326; --side: linear-gradient(180deg, #03271e 0%, #053a2c 100%); --side-text: #e2f2ea; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #a3e635; --side-active: #10b981; --on-primary: #111111; --surface-2: #152a22; --hover: #152a22; --input-border: #1f3a2f; --radius: 16px; --r-sm: 10px; --r-nav: 10px; }
:root[data-skin="mo-emerald"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-sunset"] { --font: 'Almarai'; --bg: #fbf6f2; --panel: #ffffff; --text: #2b1a10; --muted: #816d5e; --line: #f1e6dd; --primary: #e4560c; --primary-soft: #ffedd5; --side: #ffffff; --side-text: #2b1a10; --side-hover: rgba(0,0,0,.05); --side-strong: #2b1a10; --side-link: #2b1a10; --side-active: #e4560c; --on-primary: #111111; --surface-2: #fdf9f6; --hover: #fdf9f6; --input-border: #f1e6dd; --radius: 18px; --r-sm: 12px; --r-nav: 12px; }
:root[data-skin="mo-sunset"][data-theme="dark"] { --font: 'Almarai'; --bg: #140e0b; --panel: #1f1612; --text: #f6e9df; --muted: #b09683; --line: #3a2a21; --primary: #fb7c3c; --primary-soft: #3a2213; --side: #1a120e; --side-text: #f6e9df; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #fb7c3c; --on-primary: #111111; --surface-2: #281d17; --hover: #281d17; --input-border: #3a2a21; --radius: 18px; --r-sm: 12px; --r-nav: 12px; }
:root[data-skin="mo-sunset"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-rose"] { --font: 'Readex Pro'; --bg: #fdf6f9; --panel: #ffffff; --text: #2d1422; --muted: #836775; --line: #f5e1ea; --primary: #db2777; --primary-soft: #fce7f3; --side: #fff7fa; --side-text: #2d1422; --side-hover: rgba(0,0,0,.05); --side-strong: #2d1422; --side-link: #2d1422; --side-active: #db2777; --on-primary: #ffffff; --surface-2: #fef9fb; --hover: #fef9fb; --input-border: #f5e1ea; --radius: 22px; --r-sm: 16px; --r-nav: 16px; }
:root[data-skin="mo-rose"][data-theme="dark"] { --font: 'Readex Pro'; --bg: #150c11; --panel: #20131a; --text: #f8e8f0; --muted: #b891a4; --line: #3d2531; --primary: #f0529c; --primary-soft: #3d1529; --side: #1a0f15; --side-text: #f8e8f0; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #c084fc; --side-active: #f0529c; --on-primary: #111111; --surface-2: #291922; --hover: #291922; --input-border: #3d2531; --radius: 22px; --r-sm: 16px; --r-nav: 16px; }
:root[data-skin="mo-rose"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-graphite"] { --font: 'IBM Plex Sans Arabic'; --bg: #f4f4f5; --panel: #ffffff; --text: #18181b; --muted: #6e6e76; --line: #e4e4e7; --primary: #27272a; --primary-soft: #f1f1f3; --side: #18181b; --side-text: #fafafa; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #27272a; --on-primary: #ffffff; --surface-2: #fafafa; --hover: #fafafa; --input-border: #e4e4e7; --radius: 9px; --r-sm: 3px; --r-nav: 3px; }
:root[data-skin="mo-graphite"][data-theme="dark"] { --font: 'IBM Plex Sans Arabic'; --bg: #0c0c0e; --panel: #16161a; --text: #ededf0; --muted: #8e8e98; --line: #2a2a31; --primary: #d4d4d8; --primary-soft: #23232a; --side: #09090b; --side-text: #ededf0; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #a1a1aa; --side-active: #d4d4d8; --on-primary: #18181b; --surface-2: #1d1d22; --hover: #1d1d22; --input-border: #2a2a31; --radius: 9px; --r-sm: 3px; --r-nav: 3px; }
:root[data-skin="mo-graphite"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-royal"] { --font: 'Noto Kufi Arabic'; --bg: #f5f4ef; --panel: #ffffff; --text: #1b2233; --muted: #716d5f; --line: #e7e3d6; --primary: #b7791f; --primary-soft: #fbf1dc; --side: linear-gradient(180deg, #0b1f3a 0%, #13294b 100%); --side-text: #f5e6c4; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #b7791f; --on-primary: #111111; --surface-2: #faf9f5; --hover: #faf9f5; --input-border: #e7e3d6; --radius: 10px; --r-sm: 4px; --r-nav: 4px; }
:root[data-skin="mo-royal"][data-theme="dark"] { --font: 'Noto Kufi Arabic'; --bg: #0a0f1a; --panel: #111a2b; --text: #ece6d6; --muted: #9c957f; --line: #243150; --primary: #d69e2e; --primary-soft: #33280f; --side: linear-gradient(180deg, #050d1c 0%, #0b1a33 100%); --side-text: #f0dca8; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #d69e2e; --on-primary: #1a1206; --surface-2: #172238; --hover: #172238; --input-border: #243150; --radius: 10px; --r-sm: 4px; --r-nav: 4px; }
:root[data-skin="mo-royal"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-mint"] { --font: 'Tajawal'; --bg: #eef8f7; --panel: rgba(255, 255, 255, 0.86); --text: #0f2a2a; --muted: #5a7674; --line: rgba(13, 148, 136, 0.14); --primary: #0d9488; --primary-soft: rgba(13, 148, 136, 0.1); --side: rgba(255, 255, 255, 0.55); --side-text: #0f2a2a; --side-hover: rgba(0,0,0,.05); --side-strong: #0f2a2a; --side-link: #0f2a2a; --side-active: #0d9488; --on-primary: #111111; --surface-2: rgba(255, 255, 255, 0.6); --hover: rgba(255, 255, 255, 0.6); --input-border: rgba(13, 148, 136, 0.14); --radius: 20px; --r-sm: 14px; --r-nav: 14px; }
:root[data-skin="mo-mint"][data-theme="dark"] { --font: 'Tajawal'; --bg: #071514; --panel: rgba(16, 40, 38, 0.82); --text: #dff5f2; --muted: #86a9a5; --line: rgba(45, 212, 191, 0.14); --primary: #2dd4bf; --primary-soft: rgba(45, 212, 191, 0.12); --side: rgba(8, 28, 27, 0.55); --side-text: #dff5f2; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #38bdf8; --side-active: #2dd4bf; --on-primary: #042f2e; --surface-2: rgba(16, 40, 38, 0.55); --hover: rgba(16, 40, 38, 0.55); --input-border: rgba(45, 212, 191, 0.14); --radius: 20px; --r-sm: 14px; --r-nav: 14px; }
:root[data-skin="mo-mint"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-classic"] { --font: 'Segoe UI'; --bg: #f3f3f3; --panel: #ffffff; --text: #1a1a1a; --muted: #6e6e6e; --line: #e0e0e0; --primary: #0067c0; --primary-soft: #e5f1fb; --side: #f7f7f7; --side-text: #1a1a1a; --side-hover: rgba(0,0,0,.05); --side-strong: #1a1a1a; --side-link: #005a9e; --side-active: #0067c0; --on-primary: #ffffff; --surface-2: #f9f9f9; --hover: #f9f9f9; --input-border: #e0e0e0; --radius: 9px; --r-sm: 3px; --r-nav: 3px; }
:root[data-skin="mo-classic"][data-theme="dark"] { --font: 'Segoe UI'; --bg: #1c1c1c; --panel: #272727; --text: #f0f0f0; --muted: #a0a0a0; --line: #3a3a3a; --primary: #4ca3ec; --primary-soft: #15324d; --side: #202020; --side-text: #f0f0f0; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #60cdff; --side-active: #4ca3ec; --on-primary: #111111; --surface-2: #2e2e2e; --hover: #2e2e2e; --input-border: #3a3a3a; --radius: 9px; --r-sm: 3px; --r-nav: 3px; }
:root[data-skin="mo-classic"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-neon"] { --font: 'Readex Pro'; --bg: #f0f9fc; --panel: #ffffff; --text: #0b1d2a; --muted: #5e7583; --line: #dcecf2; --primary: #0891b2; --primary-soft: #e0f5fb; --side: linear-gradient(180deg, #0f172a 0%, #1e1b4b 100%); --side-text: #e0f7ff; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #0891b2; --on-primary: #111111; --surface-2: #f6fbfd; --hover: #f6fbfd; --input-border: #dcecf2; --radius: 16px; --r-sm: 10px; --r-nav: 10px; }
:root[data-skin="mo-neon"][data-theme="dark"] { --font: 'Readex Pro'; --bg: #070b18; --panel: #0e1528; --text: #e0f2fe; --muted: #7f93b3; --line: #1f2a47; --primary: #22d3ee; --primary-soft: #0b2e3a; --side: linear-gradient(180deg, #050814 0%, #150f3a 100%); --side-text: #e0f7ff; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #a78bfa; --side-active: #22d3ee; --on-primary: #04121a; --surface-2: #131c33; --hover: #131c33; --input-border: #1f2a47; --radius: 16px; --r-sm: 10px; --r-nav: 10px; }
:root[data-skin="mo-neon"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-light"] { --font: 'Cairo'; --bg: #f3f5f9; --panel: #ffffff; --text: #13213f; --muted: #686f7d; --line: #d5ddef; --primary: #2563eb; --primary-soft: #e9effd; --side: #ffffff; --side-text: #13213f; --side-hover: rgba(0,0,0,.05); --side-strong: #13213f; --side-link: #5b25eb; --side-active: #2563eb; --on-primary: #ffffff; --surface-2: #f9fafc; --hover: #f9fafc; --input-border: #d5ddef; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-light"][data-theme="dark"] { --font: 'Cairo'; --bg: #0d1321; --panel: #182036; --text: #e9ebf3; --muted: #8d909b; --line: #343b4e; --primary: #2a67ec; --primary-soft: #112145; --side: #0a0e19; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #2a67ec; --on-primary: #ffffff; --surface-2: #21293e; --hover: #21293e; --input-border: #343b4e; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-light"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-navy"] { --font: 'Cairo'; --bg: #0b1220; --panel: #131c2e; --text: #e9ebf3; --muted: #8c909a; --line: #2f3747; --primary: #3b82f6; --primary-soft: #142647; --side: #080e18; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #3b82f6; --on-primary: #111111; --surface-2: #1c2536; --hover: #1c2536; --input-border: #2f3747; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-navy"][data-theme="dark"] { --font: 'Cairo'; --bg: #0b1220; --panel: #131c2e; --text: #e9ebf3; --muted: #8c909a; --line: #2f3747; --primary: #3b82f6; --primary-soft: #142647; --side: #080e18; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #3b82f6; --on-primary: #111111; --surface-2: #1c2536; --hover: #1c2536; --input-border: #2f3747; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-navy"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-charcoal"] { --font: 'Cairo'; --bg: #0c0c0d; --panel: #161618; --text: #e9ebf3; --muted: #8c8d92; --line: #323234; --primary: #f59e0b; --primary-soft: #36260d; --side: #09090a; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #caf623; --side-active: #f59e0b; --on-primary: #111111; --surface-2: #1f1f21; --hover: #1f1f21; --input-border: #323234; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-charcoal"][data-theme="dark"] { --font: 'Cairo'; --bg: #0c0c0d; --panel: #161618; --text: #e9ebf3; --muted: #8c8d92; --line: #323234; --primary: #f59e0b; --primary-soft: #36260d; --side: #09090a; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #caf623; --side-active: #f59e0b; --on-primary: #111111; --surface-2: #1f1f21; --hover: #1f1f21; --input-border: #323234; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-charcoal"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-violet"] { --font: 'Cairo'; --bg: #110f1a; --panel: #1a1726; --text: #e9ebf3; --muted: #8e8f98; --line: #353340; --primary: #8b5cf6; --primary-soft: #271d42; --side: #0d0b14; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #e86cf7; --side-active: #8b5cf6; --on-primary: #111111; --surface-2: #23202f; --hover: #23202f; --input-border: #353340; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-violet"][data-theme="dark"] { --font: 'Cairo'; --bg: #110f1a; --panel: #1a1726; --text: #e9ebf3; --muted: #8e8f98; --line: #353340; --primary: #8b5cf6; --primary-soft: #271d42; --side: #0d0b14; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #e86cf7; --side-active: #8b5cf6; --on-primary: #111111; --surface-2: #23202f; --hover: #23202f; --input-border: #353340; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-violet"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-sand"] { --font: 'Cairo'; --bg: #f6f1e9; --panel: #fffdf9; --text: #261d24; --muted: #716b6b; --line: #e7d9d3; --primary: #c2410c; --primary-soft: #f9ece7; --side: #ffffff; --side-text: #261d24; --side-hover: rgba(0,0,0,.05); --side-strong: #261d24; --side-link: #261d24; --side-active: #c2410c; --on-primary: #ffffff; --surface-2: #fbf7f1; --hover: #fbf7f1; --input-border: #e7d9d3; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-sand"][data-theme="dark"] { --font: 'Cairo'; --bg: #181112; --panel: #271d20; --text: #e9ebf3; --muted: #918f95; --line: #41383b; --primary: #c44612; --primary-soft: #371a11; --side: #120d0e; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #c8b324; --side-active: #c44612; --on-primary: #ffffff; --surface-2: #302629; --hover: #302629; --input-border: #41383b; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-sand"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-sky"] { --font: 'Cairo'; --bg: #edf5fb; --panel: #ffffff; --text: #0f253a; --muted: #64707c; --line: #d0e1ec; --primary: #0284c7; --primary-soft: #e6f3f9; --side: #ffffff; --side-text: #0f253a; --side-hover: rgba(0,0,0,.05); --side-strong: #0f253a; --side-link: #0211c7; --side-active: #0284c7; --on-primary: #111111; --surface-2: #f6fafd; --hover: #f6fafd; --input-border: #d0e1ec; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-sky"][data-theme="dark"] { --font: 'Cairo'; --bg: #0a151f; --panel: #142433; --text: #e9ebf3; --muted: #8e949d; --line: #303e4b; --primary: #0284c7; --primary-soft: #09293d; --side: #081017; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #0284c7; --on-primary: #111111; --surface-2: #1d2d3b; --hover: #1d2d3b; --input-border: #303e4b; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-sky"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-lavender"] { --font: 'Cairo'; --bg: #f3f1fa; --panel: #ffffff; --text: #1e1c3f; --muted: #6c6b7d; --line: #ded8f0; --primary: #7c3aed; --primary-soft: #f2ebfd; --side: #ffffff; --side-text: #1e1c3f; --side-hover: rgba(0,0,0,.05); --side-strong: #1e1c3f; --side-link: #1e1c3f; --side-active: #7c3aed; --on-primary: #ffffff; --surface-2: #f9f8fd; --hover: #f9f8fd; --input-border: #ded8f0; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-lavender"][data-theme="dark"] { --font: 'Cairo'; --bg: #131021; --panel: #201c36; --text: #e9ebf3; --muted: #8f8f9b; --line: #3b374e; --primary: #8649ee; --primary-soft: #261846; --side: #0e0c19; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #e74eef; --side-active: #8649ee; --on-primary: #ffffff; --surface-2: #29253e; --hover: #29253e; --input-border: #3b374e; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-lavender"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-burgundy"] { --font: 'Cairo'; --bg: #14090c; --panel: #211116; --text: #e9ebf3; --muted: #908c92; --line: #3c2e32; --primary: #e11d48; --primary-soft: #390d17; --side: #0f0709; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #e47434; --side-active: #e11d48; --on-primary: #ffffff; --surface-2: #2a1b1f; --hover: #2a1b1f; --input-border: #3c2e32; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-burgundy"][data-theme="dark"] { --font: 'Cairo'; --bg: #14090c; --panel: #211116; --text: #e9ebf3; --muted: #908c92; --line: #3c2e32; --primary: #e11d48; --primary-soft: #390d17; --side: #0f0709; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #e47434; --side-active: #e11d48; --on-primary: #ffffff; --surface-2: #2a1b1f; --hover: #2a1b1f; --input-border: #3c2e32; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-burgundy"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-blue"] { --font: 'Cairo'; --bg: #f5f7fd; --panel: #ffffff; --text: #121e3c; --muted: #686e7d; --line: #d5dcee; --primary: #1d4ed8; --primary-soft: #e8edfb; --side: #ffffff; --side-text: #121e3c; --side-hover: rgba(0,0,0,.05); --side-strong: #121e3c; --side-link: #591dd8; --side-active: #1d4ed8; --on-primary: #ffffff; --surface-2: #fafbfe; --hover: #fafbfe; --input-border: #d5dcee; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-blue"][data-theme="dark"] { --font: 'Cairo'; --bg: #0c1220; --panel: #171e34; --text: #e9ebf3; --muted: #8c909a; --line: #33394c; --primary: #6183e4; --primary-soft: #1b2643; --side: #090e18; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #6183e4; --on-primary: #111111; --surface-2: #20273c; --hover: #20273c; --input-border: #33394c; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-blue"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-purple"] { --font: 'Cairo'; --bg: #f8f5fd; --panel: #ffffff; --text: #1c1a3c; --muted: #726f82; --line: #ded7ee; --primary: #6d28d9; --primary-soft: #f0eafb; --side: #ffffff; --side-text: #1c1a3c; --side-hover: rgba(0,0,0,.05); --side-strong: #1c1a3c; --side-link: #1c1a3c; --side-active: #6d28d9; --on-primary: #ffffff; --surface-2: #fcfafe; --hover: #fcfafe; --input-border: #ded7ee; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-purple"][data-theme="dark"] { --font: 'Cairo'; --bg: #120f20; --panel: #1f1b34; --text: #e9ebf3; --muted: #8f8f9a; --line: #3a364c; --primary: #9969e4; --primary-soft: #2a1f43; --side: #0e0b18; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #9969e4; --on-primary: #111111; --surface-2: #28243c; --hover: #28243c; --input-border: #3a364c; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-purple"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-orange"] { --font: 'Cairo'; --bg: #fcf6f4; --panel: #ffffff; --text: #261d24; --muted: #746d70; --line: #e8dad7; --primary: #c2410c; --primary-soft: #f9ece7; --side: #ffffff; --side-text: #261d24; --side-hover: rgba(0,0,0,.05); --side-strong: #261d24; --side-link: #261d24; --side-active: #c2410c; --on-primary: #ffffff; --surface-2: #fefbfa; --hover: #fefbfa; --input-border: #e8dad7; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-orange"][data-theme="dark"] { --font: 'Cairo'; --bg: #181112; --panel: #271d20; --text: #e9ebf3; --muted: #918f95; --line: #41383b; --primary: #c44612; --primary-soft: #371a11; --side: #120d0e; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #c8b324; --side-active: #c44612; --on-primary: #ffffff; --surface-2: #302629; --hover: #302629; --input-border: #41383b; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-orange"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-maroon"] { --font: 'Cairo'; --bg: #fbf4f6; --panel: #ffffff; --text: #221729; --muted: #756e76; --line: #e5d5db; --primary: #9f1239; --primary-soft: #f5e7eb; --side: #ffffff; --side-text: #221729; --side-hover: rgba(0,0,0,.05); --side-strong: #221729; --side-link: #9f3d12; --side-active: #9f1239; --on-primary: #ffffff; --surface-2: #fdfafb; --hover: #fdfafb; --input-border: #e5d5db; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-maroon"][data-theme="dark"] { --font: 'Cairo'; --bg: #150d15; --panel: #241824; --text: #e9ebf3; --muted: #908e96; --line: #3e343e; --primary: #bc5974; --primary-soft: #331b26; --side: #100a10; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #bc5974; --on-primary: #ffffff; --surface-2: #2d212d; --hover: #2d212d; --input-border: #3e343e; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-maroon"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-amber"] { --font: 'Cairo'; --bg: #fdf9f4; --panel: #ffffff; --text: #292323; --muted: #75716f; --line: #ebe1d6; --primary: #c96e06; --primary-soft: #fbf1e6; --side: #ffffff; --side-text: #292323; --side-hover: rgba(0,0,0,.05); --side-strong: #292323; --side-link: #292323; --side-active: #c96e06; --on-primary: #111111; --surface-2: #fefcfa; --hover: #fefcfa; --input-border: #ebe1d6; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-amber"][data-theme="dark"] { --font: 'Cairo'; --bg: #191411; --panel: #2a221f; --text: #e9ebf3; --muted: #959497; --line: #443d3a; --primary: #d97706; --primary-soft: #3c260f; --side: #130f0d; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #c6dd1f; --side-active: #d97706; --on-primary: #111111; --surface-2: #332b28; --hover: #332b28; --input-border: #443d3a; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-amber"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-forest"] { --font: 'Cairo'; --bg: #f0fdf4; --panel: #ffffff; --text: #152e35; --muted: #647373; --line: #d5ece5; --primary: #269a70; --primary-soft: #ebfbf5; --side: #0d3b2e; --side-text: #e8eaf2; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #269a70; --on-primary: #111111; --surface-2: #f8fefa; --hover: #f8fefa; --input-border: #d5ece5; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-forest"][data-theme="dark"] { --font: 'Cairo'; --bg: #0e1b1b; --panel: #192c2e; --text: #e9ebf3; --muted: #949a9e; --line: #354547; --primary: #34d399; --primary-soft: #153c32; --side: #0b1414; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #48b8d7; --side-active: #34d399; --on-primary: #111111; --surface-2: #223436; --hover: #223436; --input-border: #354547; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-forest"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-arctic"] { --font: 'Cairo'; --bg: #ecfeff; --panel: #ffffff; --text: #132e3f; --muted: #61737a; --line: #d3ecf1; --primary: #1996aa; --primary-soft: #e9fbfd; --side: #0c1a3a; --side-text: #e8eaf2; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #1996aa; --on-primary: #111111; --surface-2: #f6ffff; --hover: #f6ffff; --input-border: #d3ecf1; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-arctic"][data-theme="dark"] { --font: 'Cairo'; --bg: #0d1b21; --panel: #172c36; --text: #e9ebf3; --muted: #949aa1; --line: #33454e; --primary: #22d3ee; --primary-soft: #113c46; --side: #0a1419; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #22d3ee; --on-primary: #111111; --surface-2: #20343e; --hover: #20343e; --input-border: #33454e; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-arctic"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-carbon"] { --font: 'Cairo'; --bg: #fff9f9; --panel: #ffffff; --text: #2d2330; --muted: #787176; --line: #efe0e3; --primary: #d96363; --primary-soft: #fef1f1; --side: #ffffff; --side-text: #2d2330; --side-hover: rgba(0,0,0,.05); --side-strong: #2d2330; --side-link: #2d2330; --side-active: #d96363; --on-primary: #111111; --surface-2: #fffcfc; --hover: #fffcfc; --input-border: #efe0e3; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-carbon"][data-theme="dark"] { --font: 'Cairo'; --bg: #1a1a2e; --panel: #2d222a; --text: #e9ebf3; --muted: #9596a3; --line: #463d44; --primary: #f87171; --primary-soft: #422a3a; --side: #0d0d0d; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #f9c67f; --side-active: #f87171; --on-primary: #111111; --surface-2: #352b33; --hover: #352b33; --input-border: #463d44; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-carbon"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-teal"] { --font: 'Cairo'; --bg: #f0fdfa; --panel: #ffffff; --text: #142f39; --muted: #647377; --line: #d5eceb; --primary: #219b8b; --primary-soft: #eafbf9; --side: #0d2424; --side-text: #e8eaf2; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #219b8b; --on-primary: #111111; --surface-2: #f8fefd; --hover: #f8fefd; --input-border: #d5eceb; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-teal"][data-theme="dark"] { --font: 'Cairo'; --bg: #0d1b1e; --panel: #182c32; --text: #e9ebf3; --muted: #949aa0; --line: #34454b; --primary: #2dd4bf; --primary-soft: #133c3b; --side: #0a1417; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #2dd4bf; --on-primary: #111111; --surface-2: #21343a; --hover: #21343a; --input-border: #34454b; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-teal"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-grape"] { --font: 'Cairo'; --bg: #faf5ff; --panel: #ffffff; --text: #262541; --muted: #6f6c7b; --line: #e7e1f3; --primary: #a370d6; --primary-soft: #f9f3ff; --side: #2d1b69; --side-text: #e8eaf2; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #fc84f2; --side-active: #a370d6; --on-primary: #111111; --surface-2: #fdfaff; --hover: #fdfaff; --input-border: #e7e1f3; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-grape"][data-theme="dark"] { --font: 'Cairo'; --bg: #181522; --panel: #272438; --text: #e9ebf3; --muted: #9898a1; --line: #413e50; --primary: #c084fc; --primary-soft: #362949; --side: #12101a; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #fc90f3; --side-active: #c084fc; --on-primary: #111111; --surface-2: #302d40; --hover: #302d40; --input-border: #413e50; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-grape"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-gold"] { --font: 'Cairo'; --bg: #fffbeb; --panel: #ffffff; --text: #2c2824; --muted: #77746c; --line: #eee5d3; --primary: #b87708; --primary-soft: #fef5e7; --side: #1c1205; --side-text: #e8eaf2; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #c4f50b; --side-active: #b87708; --on-primary: #111111; --surface-2: #fffdf5; --hover: #fffdf5; --input-border: #eee5d3; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-gold"][data-theme="dark"] { --font: 'Cairo'; --bg: #1b1712; --panel: #2c2620; --text: #e9ebf3; --muted: #99999b; --line: #45403b; --primary: #f59e0b; --primary-soft: #422f11; --side: #14110e; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #caf623; --side-active: #f59e0b; --on-primary: #111111; --surface-2: #342f29; --hover: #342f29; --input-border: #45403b; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-gold"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-crimson"] { --font: 'Cairo'; --bg: #fff0f0; --panel: #ffffff; --text: #2c1d2a; --muted: #776b70; --line: #eed9db; --primary: #ef4444; --primary-soft: #fdecec; --side: #1a0000; --side-text: #e8eaf2; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #efa844; --side-active: #ef4444; --on-primary: #111111; --surface-2: #fff8f8; --hover: #fff8f8; --input-border: #eed9db; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-crimson"][data-theme="dark"] { --font: 'Cairo'; --bg: #1b1116; --panel: #2c1d25; --text: #e9ebf3; --muted: #928f96; --line: #45383f; --primary: #ef4444; --primary-soft: #411a1e; --side: #140d11; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #f1b157; --side-active: #ef4444; --on-primary: #111111; --surface-2: #34262e; --hover: #34262e; --input-border: #45383f; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-crimson"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-copper"] { --font: 'Cairo'; --bg: #fff7f0; --panel: #ffffff; --text: #2b2024; --muted: #776f6e; --line: #eeddd5; --primary: #e4560c; --primary-soft: #fdeee7; --side: #1a0a00; --side-text: #e8eaf2; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ead90c; --side-active: #e4560c; --on-primary: #111111; --surface-2: #fffbf8; --hover: #fffbf8; --input-border: #eeddd5; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-copper"][data-theme="dark"] { --font: 'Cairo'; --bg: #1b1212; --panel: #2b1f20; --text: #e9ebf3; --muted: #929095; --line: #443a3b; --primary: #ea580c; --primary-soft: #401f11; --side: #140e0e; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ecdd24; --side-active: #ea580c; --on-primary: #111111; --surface-2: #332829; --hover: #332829; --input-border: #443a3b; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-copper"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-snow"] { --font: 'Cairo'; --bg: #ffffff; --panel: #ffffff; --text: #1b213f; --muted: #70737f; --line: #e0e1f2; --primary: #6366f1; --primary-soft: #eff0fe; --side: #dce3f0; --side-text: #1b213f; --side-hover: rgba(0,0,0,.05); --side-strong: #1b213f; --side-link: #1b213f; --side-active: #6366f1; --on-primary: #ffffff; --surface-2: #ffffff; --hover: #ffffff; --input-border: #e0e1f2; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-snow"][data-theme="dark"] { --font: 'Cairo'; --bg: #111322; --panel: #1e2137; --text: #e9ebf3; --muted: #91939e; --line: #393c4f; --primary: #6366f1; --primary-soft: #202247; --side: #0d0e1a; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #bb73f2; --side-active: #6366f1; --on-primary: #ffffff; --surface-2: #272a3f; --hover: #272a3f; --input-border: #393c4f; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-snow"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-pearl"] { --font: 'Cairo'; --bg: #fdfcff; --panel: #ffffff; --text: #1e1c3f; --muted: #70707f; --line: #e1dbf1; --primary: #7c3aed; --primary-soft: #f2ebfd; --side: #e8e2f8; --side-text: #1e1c3f; --side-hover: rgba(0,0,0,.05); --side-strong: #1e1c3f; --side-link: #1e1c3f; --side-active: #7c3aed; --on-primary: #ffffff; --surface-2: #fefeff; --hover: #fefeff; --input-border: #e1dbf1; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-pearl"][data-theme="dark"] { --font: 'Cairo'; --bg: #131021; --panel: #201c36; --text: #e9ebf3; --muted: #8f8f9b; --line: #3b374e; --primary: #8649ee; --primary-soft: #261846; --side: #0e0c19; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #e74eef; --side-active: #8649ee; --on-primary: #ffffff; --surface-2: #29253e; --hover: #29253e; --input-border: #3b374e; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-pearl"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-zinc"] { --font: 'Cairo'; --bg: #f8fafc; --panel: #ffffff; --text: #171f2f; --muted: #6f747b; --line: #dadde3; --primary: #475569; --primary-soft: #edeef0; --side: #e2e8f0; --side-text: #171f2f; --side-hover: rgba(0,0,0,.05); --side-strong: #171f2f; --side-link: #4d4769; --side-active: #475569; --on-primary: #ffffff; --surface-2: #fcfdfe; --hover: #fcfdfe; --input-border: #dadde3; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-zinc"][data-theme="dark"] { --font: 'Cairo'; --bg: #0f1218; --panel: #1b1f29; --text: #e9ebf3; --muted: #8d9097; --line: #363a43; --primary: #7e8896; --primary-soft: #23272f; --side: #0b0e12; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #7e8896; --on-primary: #111111; --surface-2: #242832; --hover: #242832; --input-border: #363a43; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-zinc"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-fluent"] { --font: 'Cairo'; --bg: #F3F3F3; --panel: #FFFFFF; --text: #1B1B1B; --muted: #6f6f6f; --line: #d1dde9; --primary: #0067C0; --primary-soft: #e6f0f9; --side: #F3F3F3; --side-text: #1B1B1B; --side-hover: rgba(0,0,0,.05); --side-strong: #1B1B1B; --side-link: #0900c0; --side-active: #0067C0; --on-primary: #ffffff; --surface-2: #f9f9f9; --hover: #f9f9f9; --input-border: #d1dde9; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-fluent"][data-theme="dark"] { --font: 'Cairo'; --bg: #0a131e; --panel: #142132; --text: #e9ebf3; --muted: #8b909a; --line: #303c4b; --primary: #1372c5; --primary-soft: #08223b; --side: #080e17; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #1372c5; --on-primary: #ffffff; --surface-2: #1d2a3a; --hover: #1d2a3a; --input-border: #303c4b; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-fluent"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-modern"] { --font: 'Cairo'; --bg: #F6F7FB; --panel: #FFFFFF; --text: #1F2544; --muted: #6e7180; --line: #d2e3e3; --primary: #059669; --primary-soft: #e6f5f0; --side: #FFFFFF; --side-text: #3A4166; --side-hover: rgba(0,0,0,.05); --side-strong: #3A4166; --side-link: #056e96; --side-active: #059669; --on-primary: #111111; --surface-2: #fbfbfd; --hover: #fbfbfd; --input-border: #d2e3e3; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-modern"][data-theme="dark"] { --font: 'Cairo'; --bg: #0b1718; --panel: #142629; --text: #e9ebf3; --muted: #8f959a; --line: #304043; --primary: #059669; --primary-soft: #0a2e27; --side: #081112; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #059669; --on-primary: #111111; --surface-2: #1d2f32; --hover: #1d2f32; --input-border: #304043; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-modern"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-office"] { --font: 'Cairo'; --bg: #FFFFFF; --panel: #FFFFFF; --text: #252525; --muted: #747474; --line: #d8dee7; --primary: #1E4E8C; --primary-soft: #e9edf4; --side: #FAFAFA; --side-text: #252525; --side-hover: rgba(0,0,0,.05); --side-strong: #252525; --side-link: #2e1e8c; --side-active: #1E4E8C; --on-primary: #ffffff; --surface-2: #ffffff; --hover: #ffffff; --input-border: #d8dee7; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-office"][data-theme="dark"] { --font: 'Cairo'; --bg: #0c121b; --panel: #171e2d; --text: #e9ebf3; --muted: #8c9098; --line: #333946; --primary: #6283af; --primary-soft: #1b2636; --side: #090e14; --side-text: #e9ebf3; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #ffffff; --side-active: #6283af; --on-primary: #111111; --surface-2: #202735; --hover: #202735; --input-border: #333946; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-office"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-dark"] { --font: 'Cairo'; --bg: #0A0F1C; --panel: #111827; --text: #E6E9F2; --muted: #8a8d98; --line: #2e3441; --primary: #8B5CF6; --primary-soft: #211d43; --side: #0B1120; --side-text: #9AA3BB; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #e86cf7; --side-active: #8B5CF6; --on-primary: #111111; --surface-2: #1b2130; --hover: #1b2130; --input-border: #2e3441; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-dark"][data-theme="dark"] { --font: 'Cairo'; --bg: #0A0F1C; --panel: #111827; --text: #E6E9F2; --muted: #8a8d98; --line: #2e3441; --primary: #8B5CF6; --primary-soft: #211d43; --side: #0B1120; --side-text: #9AA3BB; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #e86cf7; --side-active: #8B5CF6; --on-primary: #111111; --surface-2: #1b2130; --hover: #1b2130; --input-border: #2e3441; --radius: 14px; --r-sm: 8px; --r-nav: 8px; }
:root[data-skin="mo-dark"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }
:root[data-skin="mo-navygold"] { --font: 'Cairo'; --bg: #f6f3ea; --panel: #ffffff; --text: #12202f; --muted: #5c6878; --line: #e8e1cf; --primary: #86621a; --primary-soft: #fbf3dc; --side: #12202f; --side-text: #eef3f8; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #c9962e; --side-active: #86621a; --on-primary: #ffffff; --surface-2: #fbf8f0; --hover: #fbf8f0; --input-border: #e8e1cf; --radius: 18px; --r-sm: 12px; --r-nav: 12px; }
:root[data-skin="mo-navygold"][data-theme="dark"] { --font: 'Cairo'; --bg: #14181f; --panel: #1b212b; --text: #eef3f8; --muted: #a8b6c6; --line: #2e3644; --primary: #e8c254; --primary-soft: #2d2a1f; --side: #131217; --side-text: #eef3f8; --side-hover: rgba(255,255,255,.08); --side-strong: #ffffff; --side-link: #d0a33b; --side-active: #e8c254; --on-primary: #1a1305; --surface-2: #222935; --hover: #222935; --input-border: #2e3644; --radius: 18px; --r-sm: 12px; --r-nav: 12px; }
:root[data-skin="mo-navygold"] .sidebar a.active { background: var(--side-active); color: var(--on-primary); }

/* Generated by tools/themes/apply.js from tools/themes/catalog.json — do not edit (edit the catalog, then run the tool). */



:root[data-style="glass"] .ant-card,
:root[data-style="glass"] .ant-modal-content,
:root[data-style="glass"] .ant-table-wrapper,
:root[data-style="glass"] .ant-list-bordered,
:root[data-style="glass"] .ant-drawer-content,
:root[data-style="glass"] .card,
:root[data-style="glass"] .stat-card,
:root[data-style="glass"] .stat,
:root[data-style="glass"] .p-card,
:root[data-style="glass"] .cart,
:root[data-style="glass"] .modal,
:root[data-style="glass"] .table-wrap,
:root[data-style="glass"] .type-card {
  border-width: 1px !important;
  border-style: solid !important;
  box-shadow: 0 8px 32px rgba(15,23,42,0.18) !important;
  backdrop-filter: blur(14px) saturate(1.3);
  -webkit-backdrop-filter: blur(14px) saturate(1.3);
}

:root[data-style="corporate"] .ant-card,
:root[data-style="corporate"] .ant-modal-content,
:root[data-style="corporate"] .ant-table-wrapper,
:root[data-style="corporate"] .ant-list-bordered,
:root[data-style="corporate"] .ant-drawer-content,
:root[data-style="corporate"] .card,
:root[data-style="corporate"] .stat-card,
:root[data-style="corporate"] .stat,
:root[data-style="corporate"] .p-card,
:root[data-style="corporate"] .cart,
:root[data-style="corporate"] .modal,
:root[data-style="corporate"] .table-wrap,
:root[data-style="corporate"] .type-card {
  border-width: 1px !important;
  border-style: solid !important;
  box-shadow: none !important;
}

:root[data-style="soft"] .ant-card,
:root[data-style="soft"] .ant-modal-content,
:root[data-style="soft"] .ant-table-wrapper,
:root[data-style="soft"] .ant-list-bordered,
:root[data-style="soft"] .ant-drawer-content,
:root[data-style="soft"] .card,
:root[data-style="soft"] .stat-card,
:root[data-style="soft"] .stat,
:root[data-style="soft"] .p-card,
:root[data-style="soft"] .cart,
:root[data-style="soft"] .modal,
:root[data-style="soft"] .table-wrap,
:root[data-style="soft"] .type-card {
  border-width: 0px !important;
  border-style: solid !important;
  box-shadow: 8px 8px 16px rgba(0,0,0,0.10), -8px -8px 16px rgba(255,255,255,0.70) !important;
}

:root[data-style="minimal"] .ant-card,
:root[data-style="minimal"] .ant-modal-content,
:root[data-style="minimal"] .ant-table-wrapper,
:root[data-style="minimal"] .ant-list-bordered,
:root[data-style="minimal"] .ant-drawer-content,
:root[data-style="minimal"] .card,
:root[data-style="minimal"] .stat-card,
:root[data-style="minimal"] .stat,
:root[data-style="minimal"] .p-card,
:root[data-style="minimal"] .cart,
:root[data-style="minimal"] .modal,
:root[data-style="minimal"] .table-wrap,
:root[data-style="minimal"] .type-card {
  border-width: 1px !important;
  border-style: solid !important;
  box-shadow: none !important;
}

:root[data-style="minimal"] .ant-card,
:root[data-style="minimal"] .card {
  box-shadow: none !important;
}

:root[data-style="neon"] .ant-card,
:root[data-style="neon"] .ant-modal-content,
:root[data-style="neon"] .ant-table-wrapper,
:root[data-style="neon"] .ant-list-bordered,
:root[data-style="neon"] .ant-drawer-content,
:root[data-style="neon"] .card,
:root[data-style="neon"] .stat-card,
:root[data-style="neon"] .stat,
:root[data-style="neon"] .p-card,
:root[data-style="neon"] .cart,
:root[data-style="neon"] .modal,
:root[data-style="neon"] .table-wrap,
:root[data-style="neon"] .type-card {
  border-width: 1px !important;
  border-style: solid !important;
  box-shadow: 0 0 0 1px var(--mo-primary), 0 0 18px color-mix(in srgb, var(--mo-primary) 45%, transparent) !important;
}

:root[data-style="neon"] .ant-btn-primary,
:root[data-style="neon"] .btn-primary {
  box-shadow: 0 0 14px color-mix(in srgb, var(--brand, var(--primary)) 60%, transparent) !important;
}

:root[data-style="luxury"] .ant-card,
:root[data-style="luxury"] .ant-modal-content,
:root[data-style="luxury"] .ant-table-wrapper,
:root[data-style="luxury"] .ant-list-bordered,
:root[data-style="luxury"] .ant-drawer-content,
:root[data-style="luxury"] .card,
:root[data-style="luxury"] .stat-card,
:root[data-style="luxury"] .stat,
:root[data-style="luxury"] .p-card,
:root[data-style="luxury"] .cart,
:root[data-style="luxury"] .modal,
:root[data-style="luxury"] .table-wrap,
:root[data-style="luxury"] .type-card {
  border-width: 0px !important;
  border-style: solid !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.18) !important;
}

:root[data-style="boutique"] .ant-card,
:root[data-style="boutique"] .ant-modal-content,
:root[data-style="boutique"] .ant-table-wrapper,
:root[data-style="boutique"] .ant-list-bordered,
:root[data-style="boutique"] .ant-drawer-content,
:root[data-style="boutique"] .card,
:root[data-style="boutique"] .stat-card,
:root[data-style="boutique"] .stat,
:root[data-style="boutique"] .p-card,
:root[data-style="boutique"] .cart,
:root[data-style="boutique"] .modal,
:root[data-style="boutique"] .table-wrap,
:root[data-style="boutique"] .type-card {
  border-width: 0px !important;
  border-style: solid !important;
  box-shadow: 0 6px 20px rgba(0,0,0,0.08) !important;
}

:root[data-style="brutal"] .ant-card,
:root[data-style="brutal"] .ant-modal-content,
:root[data-style="brutal"] .ant-table-wrapper,
:root[data-style="brutal"] .ant-list-bordered,
:root[data-style="brutal"] .ant-drawer-content,
:root[data-style="brutal"] .card,
:root[data-style="brutal"] .stat-card,
:root[data-style="brutal"] .stat,
:root[data-style="brutal"] .p-card,
:root[data-style="brutal"] .cart,
:root[data-style="brutal"] .modal,
:root[data-style="brutal"] .table-wrap,
:root[data-style="brutal"] .type-card {
  border-width: 2px !important;
  border-style: solid !important;
  border-color: #111 !important;
  box-shadow: 4px 4px 0 #111 !important;
}

:root[data-style="brutal"] .ant-btn,
:root[data-style="brutal"] .btn {
  border: 2px solid #111 !important;
  box-shadow: 2px 2px 0 #111 !important;
  font-weight: 800;
}

:root[data-mode="dark"][data-style="brutal"] .ant-card,
:root[data-mode="dark"][data-style="brutal"] .ant-modal-content,
:root[data-mode="dark"][data-style="brutal"] .ant-table-wrapper,
:root[data-mode="dark"][data-style="brutal"] .ant-list-bordered,
:root[data-mode="dark"][data-style="brutal"] .ant-drawer-content,
:root[data-mode="dark"][data-style="brutal"] .card,
:root[data-mode="dark"][data-style="brutal"] .stat-card,
:root[data-mode="dark"][data-style="brutal"] .stat,
:root[data-mode="dark"][data-style="brutal"] .p-card,
:root[data-mode="dark"][data-style="brutal"] .cart,
:root[data-mode="dark"][data-style="brutal"] .modal,
:root[data-mode="dark"][data-style="brutal"] .table-wrap,
:root[data-mode="dark"][data-style="brutal"] .type-card,
:root[data-mode="dark"][data-style="brutal"] .ant-btn,
:root[data-mode="dark"][data-style="brutal"] .btn {
  border-color: #e5e7eb !important;
  box-shadow: 4px 4px 0 #e5e7eb !important;
}

:root[data-style="earth"] .ant-card,
:root[data-style="earth"] .ant-modal-content,
:root[data-style="earth"] .ant-table-wrapper,
:root[data-style="earth"] .ant-list-bordered,
:root[data-style="earth"] .ant-drawer-content,
:root[data-style="earth"] .card,
:root[data-style="earth"] .stat-card,
:root[data-style="earth"] .stat,
:root[data-style="earth"] .p-card,
:root[data-style="earth"] .cart,
:root[data-style="earth"] .modal,
:root[data-style="earth"] .table-wrap,
:root[data-style="earth"] .type-card {
  border-width: 1px !important;
  border-style: solid !important;
  box-shadow: 0 2px 8px rgba(80,60,30,0.12) !important;
}

:root[data-style="paper"] .ant-card,
:root[data-style="paper"] .ant-modal-content,
:root[data-style="paper"] .ant-table-wrapper,
:root[data-style="paper"] .ant-list-bordered,
:root[data-style="paper"] .ant-drawer-content,
:root[data-style="paper"] .card,
:root[data-style="paper"] .stat-card,
:root[data-style="paper"] .stat,
:root[data-style="paper"] .p-card,
:root[data-style="paper"] .cart,
:root[data-style="paper"] .modal,
:root[data-style="paper"] .table-wrap,
:root[data-style="paper"] .type-card {
  border-width: 1px !important;
  border-style: solid !important;
  box-shadow: 0 1px 0 rgba(0,0,0,0.12) !important;
}

:root[data-style="compact"] .ant-card,
:root[data-style="compact"] .ant-modal-content,
:root[data-style="compact"] .ant-table-wrapper,
:root[data-style="compact"] .ant-list-bordered,
:root[data-style="compact"] .ant-drawer-content,
:root[data-style="compact"] .card,
:root[data-style="compact"] .stat-card,
:root[data-style="compact"] .stat,
:root[data-style="compact"] .p-card,
:root[data-style="compact"] .cart,
:root[data-style="compact"] .modal,
:root[data-style="compact"] .table-wrap,
:root[data-style="compact"] .type-card {
  border-width: 1px !important;
  border-style: solid !important;
  box-shadow: none !important;
}

:root[data-style="compact"] {
  font-size: 13px;
}

:root[data-style="touch"] .ant-card,
:root[data-style="touch"] .ant-modal-content,
:root[data-style="touch"] .ant-table-wrapper,
:root[data-style="touch"] .ant-list-bordered,
:root[data-style="touch"] .ant-drawer-content,
:root[data-style="touch"] .card,
:root[data-style="touch"] .stat-card,
:root[data-style="touch"] .stat,
:root[data-style="touch"] .p-card,
:root[data-style="touch"] .cart,
:root[data-style="touch"] .modal,
:root[data-style="touch"] .table-wrap,
:root[data-style="touch"] .type-card {
  border-width: 1px !important;
  border-style: solid !important;
}

:root[data-style="touch"] {
  font-size: 17px;
}
:root[data-style="touch"] .ant-btn,
:root[data-style="touch"] .btn,
:root[data-style="touch"] .ant-input,
:root[data-style="touch"] .ant-select-selector {
  min-height: 44px;
}

:root[data-style="executive"] .ant-card,
:root[data-style="executive"] .ant-modal-content,
:root[data-style="executive"] .ant-table-wrapper,
:root[data-style="executive"] .ant-list-bordered,
:root[data-style="executive"] .ant-drawer-content,
:root[data-style="executive"] .card,
:root[data-style="executive"] .stat-card,
:root[data-style="executive"] .stat,
:root[data-style="executive"] .p-card,
:root[data-style="executive"] .cart,
:root[data-style="executive"] .modal,
:root[data-style="executive"] .table-wrap,
:root[data-style="executive"] .type-card {
  border-width: 1px !important;
  border-style: solid !important;
  box-shadow: 0 12px 32px rgba(0,0,0,0.22) !important;
}