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

:root[data-skin="factory"] { --bg: #f5f5f5; --bg-image: none; --surface: #ffffff; --surface-2: #fafafa; --border: #f0f0f0; --text: #1f1f1f; --muted: #6f6f6f; --primary: #1e3a5f; --primary-text: #1e3a5f; --on-primary: #ffffff; --primary-soft: #e6edf5; --nav-bg: #1e3a5f; --nav-text: #dde1e7; --nav-muted: #a5b0bf; --nav-hover: #304a6c; --nav-border: #3e5675; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="factory"][data-mode="dark"] { --bg: #000000; --bg-image: none; --surface: #141414; --surface-2: #1f1f1f; --border: #303030; --text: #dcdcdc; --muted: #868686; --primary: #4a79ac; --primary-text: #6e94bd; --on-primary: #ffffff; --primary-soft: #15263b; --nav-bg: #001529; --nav-text: #d9dcdf; --nav-muted: #99a1a9; --nav-hover: #14283a; --nav-border: #243647; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="lotus"] { --bg: #f5f5f7; --bg-image: none; --surface: #ffffff; --surface-2: #fafafa; --border: #ececf1; --text: #1f1f2e; --muted: #6f6f7a; --primary: #7c3aed; --primary-text: #7c3aed; --on-primary: #ffffff; --primary-soft: #f3e8ff; --nav-bg: #ffffff; --nav-text: #3e4552; --nav-muted: #70757e; --nav-hover: #ededef; --nav-border: #dfe0e2; --nav-active-bg: #ede3fc; --nav-active-text: #5d2cb2; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="lotus"][data-mode="dark"] { --bg: #0f0d17; --bg-image: none; --surface: #1a1726; --surface-2: #221e31; --border: #2e2942; --text: #ece9f7; --muted: #9a94b3; --primary: #9b6cf6; --primary-text: #a073f6; --on-primary: #111111; --primary-soft: #2a1f47; --nav-bg: #151220; --nav-text: #dcdbde; --nav-muted: #a1a0a6; --nav-hover: #282532; --nav-border: #36333f; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="ocean"] { --bg: #f0f4f9; --bg-image: none; --surface: #ffffff; --surface-2: #f7f9fc; --border: #e3e9f2; --text: #14213d; --muted: #636d81; --primary: #1677ff; --primary-text: #1365d9; --on-primary: #111111; --primary-soft: #e6f0ff; --nav-bg: #001529; --nav-text: #d9dcdf; --nav-muted: #99a1a9; --nav-hover: #14283a; --nav-border: #243647; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 6px; color-scheme: light; }
:root[data-skin="ocean"][data-mode="dark"] { --bg: #0a1220; --bg-image: none; --surface: #111c2e; --surface-2: #16233a; --border: #22324d; --text: #e3ebf7; --muted: #8193b2; --primary: #3c89ff; --primary-text: #468fff; --on-primary: #111111; --primary-soft: #132a4d; --nav-bg: #07101d; --nav-text: #dadbdd; --nav-muted: #9c9fa5; --nav-hover: #1b232f; --nav-border: #2a313d; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="emerald"] { --bg: #f1f7f4; --bg-image: none; --surface: #ffffff; --surface-2: #f6faf8; --border: #dfece6; --text: #10261d; --muted: #5e7369; --primary: #059669; --primary-text: #047854; --on-primary: #111111; --primary-soft: #e3f6ee; --nav-bg: #064e3b; --nav-text: #dae4e2; --nav-muted: #b9cdc8; --nav-hover: #1a5c4b; --nav-border: #296756; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Tajawal', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 10px; color-scheme: light; }
:root[data-skin="emerald"][data-mode="dark"] { --bg: #0a1511; --bg-image: none; --surface: #10201a; --surface-2: #152a22; --border: #1f3a2f; --text: #e2f2ea; --muted: #86a597; --primary: #10b981; --primary-text: #10b981; --on-primary: #111111; --primary-soft: #0f3326; --nav-bg: #03271e; --nav-text: #d9dfdd; --nav-muted: #9aa9a5; --nav-hover: #173830; --nav-border: #26453e; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="sunset"] { --bg: #fbf6f2; --bg-image: none; --surface: #ffffff; --surface-2: #fdf9f6; --border: #f1e6dd; --text: #2b1a10; --muted: #816d5e; --primary: #e4560c; --primary-text: #b6450a; --on-primary: #111111; --primary-soft: #ffedd5; --nav-bg: #ffffff; --nav-text: #3e4552; --nav-muted: #70757e; --nav-hover: #ededef; --nav-border: #dfe0e2; --nav-active-bg: #fbe7dd; --nav-active-text: #ab4109; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Almarai', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 12px; color-scheme: light; }
:root[data-skin="sunset"][data-mode="dark"] { --bg: #140e0b; --bg-image: none; --surface: #1f1612; --surface-2: #281d17; --border: #3a2a21; --text: #f6e9df; --muted: #b09683; --primary: #fb7c3c; --primary-text: #fb7c3c; --on-primary: #111111; --primary-soft: #3a2213; --nav-bg: #1a120e; --nav-text: #dddbdb; --nav-muted: #a3a09f; --nav-hover: #2c2521; --nav-border: #3a3330; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="rose"] { --bg: #fdf6f9; --bg-image: radial-gradient(circle at 90% 0%, #fce7f3 0%, transparent 45%); --surface: #ffffff; --surface-2: #fef9fb; --border: #f5e1ea; --text: #2d1422; --muted: #836775; --primary: #db2777; --primary-text: #c5236b; --on-primary: #ffffff; --primary-soft: #fce7f3; --nav-bg: #fff7fa; --nav-text: #3e4451; --nav-muted: #70727d; --nav-hover: #ede6ea; --nav-border: #dfd9de; --nav-active-bg: #fadae8; --nav-active-text: #a41d59; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Readex Pro', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 16px; color-scheme: light; }
:root[data-skin="rose"][data-mode="dark"] { --bg: #150c11; --bg-image: radial-gradient(circle at 90% 0%, #3b1027 0%, transparent 45%); --surface: #20131a; --surface-2: #291922; --border: #3d2531; --text: #f8e8f0; --muted: #b891a4; --primary: #f0529c; --primary-text: #f0529c; --on-primary: #111111; --primary-soft: #3d1529; --nav-bg: #1a0f15; --nav-text: #dddbdc; --nav-muted: #a39fa1; --nav-hover: #2c2228; --nav-border: #3a3136; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="graphite"] { --bg: #f4f4f5; --bg-image: none; --surface: #ffffff; --surface-2: #fafafa; --border: #e4e4e7; --text: #18181b; --muted: #6e6e76; --primary: #27272a; --primary-text: #27272a; --on-primary: #ffffff; --primary-soft: #f1f1f3; --nav-bg: #18181b; --nav-text: #dcdcdd; --nav-muted: #a3a3a4; --nav-hover: #2a2a2d; --nav-border: #38383b; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'IBM Plex Sans Arabic', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 3px; color-scheme: light; }
:root[data-skin="graphite"][data-mode="dark"] { --bg: #0c0c0e; --bg-image: none; --surface: #16161a; --surface-2: #1d1d22; --border: #2a2a31; --text: #ededf0; --muted: #8e8e98; --primary: #d4d4d8; --primary-text: #d4d4d8; --on-primary: #18181b; --primary-soft: #23232a; --nav-bg: #09090b; --nav-text: #dadada; --nav-muted: #9d9d9d; --nav-hover: #1d1d1f; --nav-border: #2b2b2d; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="royal"] { --bg: #f5f4ef; --bg-image: none; --surface: #ffffff; --surface-2: #faf9f5; --border: #e7e3d6; --text: #1b2233; --muted: #716d5f; --primary: #b7791f; --primary-text: #926119; --on-primary: #111111; --primary-soft: #fbf1dc; --nav-bg: #0b1f3a; --nav-text: #dadde1; --nav-muted: #9da5b0; --nav-hover: #1f314a; --nav-border: #2d3e56; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Noto Kufi Arabic', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 4px; color-scheme: light; }
:root[data-skin="royal"][data-mode="dark"] { --bg: #0a0f1a; --bg-image: none; --surface: #111a2b; --surface-2: #172238; --border: #243150; --text: #ece6d6; --muted: #9c957f; --primary: #d69e2e; --primary-text: #d69e2e; --on-primary: #1a1206; --primary-soft: #33280f; --nav-bg: #050d1c; --nav-text: #dadbdd; --nav-muted: #9b9ea4; --nav-hover: #19202e; --nav-border: #282f3c; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="mint"] { --bg: #eef8f7; --bg-image: linear-gradient(135deg, #d9f3ef 0%, #e6f4fb 50%, #f1f7ee 100%); --surface: #fdfefe; --surface-2: #f8fcfc; --border: #dbefed; --text: #0f2a2a; --muted: #5a7674; --primary: #0d9488; --primary-text: #0a766d; --on-primary: #111111; --primary-soft: #e5f3f2; --nav-bg: #f7fcfb; --nav-text: #3d4451; --nav-muted: #6d747d; --nav-hover: #e5ebeb; --nav-border: #d8dedf; --nav-active-bg: #d6edeb; --nav-active-text: #0a6f66; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Tajawal', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 14px; color-scheme: light; }
:root[data-skin="mint"][data-mode="dark"] { --bg: #071514; --bg-image: linear-gradient(135deg, #062622 0%, #07182a 50%, #0b1a12 100%); --surface: #0e2523; --surface-2: #0c1f1e; --border: #123e39; --text: #dff5f2; --muted: #86a9a5; --primary: #2dd4bf; --primary-text: #2dd4bf; --on-primary: #042f2e; --primary-soft: #123a36; --nav-bg: #081918; --nav-text: #dadddc; --nav-muted: #9ca3a3; --nav-hover: #1c2b2a; --nav-border: #2b3938; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="classic"] { --bg: #f3f3f3; --bg-image: none; --surface: #ffffff; --surface-2: #f9f9f9; --border: #e0e0e0; --text: #1a1a1a; --muted: #6e6e6e; --primary: #0067c0; --primary-text: #0067c0; --on-primary: #ffffff; --primary-soft: #e5f1fb; --nav-bg: #f7f7f7; --nav-text: #3d4450; --nav-muted: #6d727c; --nav-hover: #e5e6e7; --nav-border: #d8d9dc; --nav-active-bg: #d4e3ef; --nav-active-text: #004d90; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Segoe UI', Tahoma, 'Cairo', system-ui, sans-serif; --radius: 3px; color-scheme: light; }
:root[data-skin="classic"][data-mode="dark"] { --bg: #1c1c1c; --bg-image: none; --surface: #272727; --surface-2: #2e2e2e; --border: #3a3a3a; --text: #f0f0f0; --muted: #a0a0a0; --primary: #4ca3ec; --primary-text: #4ca3ec; --on-primary: #111111; --primary-soft: #15324d; --nav-bg: #202020; --nav-text: #dedede; --nav-muted: #a6a6a6; --nav-hover: #323232; --nav-border: #3f3f3f; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="neon"] { --bg: #f0f9fc; --bg-image: radial-gradient(circle at 0% 100%, #ede9fe 0%, transparent 40%); --surface: #ffffff; --surface-2: #f6fbfd; --border: #dcecf2; --text: #0b1d2a; --muted: #5e7583; --primary: #0891b2; --primary-text: #06748e; --on-primary: #111111; --primary-soft: #e0f5fb; --nav-bg: #0f172a; --nav-text: #dbdcdf; --nav-muted: #9fa2aa; --nav-hover: #222a3b; --nav-border: #313748; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Readex Pro', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 10px; color-scheme: light; }
:root[data-skin="neon"][data-mode="dark"] { --bg: #070b18; --bg-image: radial-gradient(circle at 0% 100%, #1e1b4b 0%, transparent 45%), radial-gradient(circle at 100% 0%, #083344 0%, transparent 40%); --surface: #0e1528; --surface-2: #131c33; --border: #1f2a47; --text: #e0f2fe; --muted: #7f93b3; --primary: #22d3ee; --primary-text: #22d3ee; --on-primary: #04121a; --primary-soft: #0b2e3a; --nav-bg: #050814; --nav-text: #dadadc; --nav-muted: #9b9ca1; --nav-hover: #191c27; --nav-border: #282b35; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="midnight"] { --bg: #0c0e13; --bg-image: none; --surface: #151922; --surface-2: #1e222b; --border: #31353d; --text: #efe8d8; --muted: #908c85; --primary: #d6ad4a; --primary-text: #d6ad4a; --on-primary: #111111; --primary-soft: #302b1d; --nav-bg: #07080b; --nav-text: #dadada; --nav-muted: #9c9c9d; --nav-hover: #1b1c1f; --nav-border: #2a2b2d; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; --font: 'El Messiri', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: dark; }
:root[data-skin="midnight"][data-mode="dark"] { --bg: #0c0e13; --bg-image: none; --surface: #151922; --surface-2: #1e222b; --border: #31353d; --text: #efe8d8; --muted: #908c85; --primary: #d6ad4a; --primary-text: #d6ad4a; --on-primary: #111111; --primary-soft: #302b1d; --nav-bg: #07080b; --nav-text: #dadada; --nav-muted: #9c9c9d; --nav-hover: #1b1c1f; --nav-border: #2a2b2d; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="minimal"] { --bg: #ffffff; --bg-image: none; --surface: #fafafa; --surface-2: #fdfdfd; --border: #d6d8da; --text: #111111; --muted: #737373; --primary: #111111; --primary-text: #111111; --on-primary: #ffffff; --primary-soft: #e7e7e7; --nav-bg: #f3f3f3; --nav-text: #3c4350; --nav-muted: #656a74; --nav-hover: #e2e2e4; --nav-border: #d5d6d8; --nav-active-bg: #d3d3d3; --nav-active-text: #0d0d0d; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'IBM Plex Sans Arabic', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="minimal"][data-mode="dark"] { --bg: #0b0d12; --bg-image: none; --surface: #161820; --surface-2: #1f2129; --border: #32343b; --text: #e9ebf3; --muted: #8c8e95; --primary: #6d6d6d; --primary-text: #838383; --on-primary: #ffffff; --primary-soft: #191b1f; --nav-bg: #080a0e; --nav-text: #dadadb; --nav-muted: #9c9d9f; --nav-hover: #1c1e21; --nav-border: #2b2c30; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="slate"] { --bg: #eef1f5; --bg-image: none; --surface: #ffffff; --surface-2: #f7f8fa; --border: #d5d9df; --text: #0f172a; --muted: #686d76; --primary: #334155; --primary-text: #334155; --on-primary: #ffffff; --primary-soft: #ebecee; --nav-bg: #1e293b; --nav-text: #dddfe2; --nav-muted: #a5a9b1; --nav-hover: #303a4b; --nav-border: #3e4756; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'IBM Plex Sans Arabic', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="slate"][data-mode="dark"] { --bg: #0e1117; --bg-image: none; --surface: #191d27; --surface-2: #222630; --border: #353841; --text: #e9ebf3; --muted: #8d8f97; --primary: #6c7583; --primary-text: #89919c; --on-primary: #ffffff; --primary-soft: #20242b; --nav-bg: #0b0d11; --nav-text: #dadbdb; --nav-muted: #9d9ea0; --nav-hover: #1f2024; --nav-border: #2d2f32; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="brutal"] { --bg: #fef6e4; --bg-image: none; --surface: #ffffff; --surface-2: #fffbf2; --border: #efddde; --text: #111111; --muted: #737068; --primary: #e6537c; --primary-text: #b84263; --on-primary: #111111; --primary-soft: #ffeff3; --nav-bg: #ffd23f; --nav-text: #3e3e35; --nav-muted: #625a37; --nav-hover: #edc43e; --nav-border: #dfba3d; --nav-active-bg: #fcc048; --nav-active-text: #7d2d43; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Lalezar', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="brutal"][data-mode="dark"] { --bg: #1c131a; --bg-image: none; --surface: #2d202c; --surface-2: #352934; --border: #463b45; --text: #e9ebf3; --muted: #96939b; --primary: #ff5c8a; --primary-text: #ff5c8a; --on-primary: #111111; --primary-soft: #45202e; --nav-bg: #150e14; --nav-text: #dcdbdc; --nav-muted: #a19fa1; --nav-hover: #282127; --nav-border: #363035; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="contrast"] { --bg: #000000; --bg-image: none; --surface: #0b0b0b; --surface-2: #151515; --border: #282828; --text: #ffffff; --muted: #949494; --primary: #ffd400; --primary-text: #ffd400; --on-primary: #111111; --primary-soft: #2e2600; --nav-bg: #000000; --nav-text: #d9d9d9; --nav-muted: #999999; --nav-hover: #141414; --nav-border: #242424; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; --font: 'Tajawal', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: dark; }
:root[data-skin="contrast"][data-mode="dark"] { --bg: #000000; --bg-image: none; --surface: #0b0b0b; --surface-2: #151515; --border: #282828; --text: #ffffff; --muted: #949494; --primary: #ffd400; --primary-text: #ffd400; --on-primary: #111111; --primary-soft: #2e2600; --nav-bg: #000000; --nav-text: #d9d9d9; --nav-muted: #999999; --nav-hover: #141414; --nav-border: #242424; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="coffee"] { --bg: #f5ede3; --bg-image: none; --surface: #fffaf3; --surface-2: #faf4eb; --border: #dfd8d4; --text: #2e1d12; --muted: #746a61; --primary: #7b4a2a; --primary-text: #7b4a2a; --on-primary: #ffffff; --primary-soft: #f2edea; --nav-bg: #3b2618; --nav-text: #e2dedc; --nav-muted: #b1a8a3; --nav-hover: #4b372a; --nav-border: #564438; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Noto Kufi Arabic', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="coffee"][data-mode="dark"] { --bg: #131114; --bg-image: none; --surface: #201e23; --surface-2: #29272c; --border: #3b393d; --text: #e9ebf3; --muted: #8f8f95; --primary: #a3806a; --primary-text: #a88671; --on-primary: #111111; --primary-soft: #2d2523; --nav-bg: #0e0d0f; --nav-text: #dbdbdb; --nav-muted: #9f9e9f; --nav-hover: #212022; --nav-border: #302f31; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="paper"] { --bg: #f3ecdb; --bg-image: none; --surface: #fffdf5; --surface-2: #f9f5e8; --border: #e0d4d1; --text: #2b2418; --muted: #6e685d; --primary: #8b1e1e; --primary-text: #8b1e1e; --on-primary: #ffffff; --primary-soft: #f3e9e9; --nav-bg: #efe4c8; --nav-text: #3c4149; --nav-muted: #646566; --nav-hover: #ded5bc; --nav-border: #d1c9b3; --nav-active-bg: #e1c8b0; --nav-active-text: #681717; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Amiri', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="paper"][data-mode="dark"] { --bg: #140e13; --bg-image: none; --surface: #221a22; --surface-2: #2b232b; --border: #3d353d; --text: #e9ebf3; --muted: #908e95; --primary: #a75e5e; --primary-text: #b97e7e; --on-primary: #ffffff; --primary-soft: #301d21; --nav-bg: #0f0b0e; --nav-text: #dbdadb; --nav-muted: #9f9d9f; --nav-hover: #221f21; --nav-border: #312d30; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="light"] { --bg: #f3f5f9; --bg-image: none; --surface: #ffffff; --surface-2: #f9fafc; --border: #d5ddef; --text: #13213f; --muted: #686f7d; --primary: #2563eb; --primary-text: #235edf; --on-primary: #ffffff; --primary-soft: #e9effd; --nav-bg: #ffffff; --nav-text: #3e4552; --nav-muted: #70757e; --nav-hover: #ededef; --nav-border: #dfe0e2; --nav-active-bg: #e0e9fc; --nav-active-text: #1c4ab0; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="light"][data-mode="dark"] { --bg: #0d1321; --bg-image: none; --surface: #182036; --surface-2: #21293e; --border: #343b4e; --text: #e9ebf3; --muted: #8d909b; --primary: #2a67ec; --primary-text: #5585f0; --on-primary: #ffffff; --primary-soft: #112145; --nav-bg: #0a0e19; --nav-text: #dadbdd; --nav-muted: #9d9fa3; --nav-hover: #1e212b; --nav-border: #2c3039; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="navy"] { --bg: #0b1220; --bg-image: none; --surface: #131c2e; --surface-2: #1c2536; --border: #2f3747; --text: #e9ebf3; --muted: #8c909a; --primary: #3b82f6; --primary-text: #4f8ff7; --on-primary: #111111; --primary-soft: #142647; --nav-bg: #080e18; --nav-text: #dadbdc; --nav-muted: #9c9fa3; --nav-hover: #1c212a; --nav-border: #2b3038; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: dark; }
:root[data-skin="navy"][data-mode="dark"] { --bg: #0b1220; --bg-image: none; --surface: #131c2e; --surface-2: #1c2536; --border: #2f3747; --text: #e9ebf3; --muted: #8c909a; --primary: #3b82f6; --primary-text: #4f8ff7; --on-primary: #111111; --primary-soft: #142647; --nav-bg: #080e18; --nav-text: #dadbdc; --nav-muted: #9c9fa3; --nav-hover: #1c212a; --nav-border: #2b3038; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="charcoal"] { --bg: #0c0c0d; --bg-image: none; --surface: #161618; --surface-2: #1f1f21; --border: #323234; --text: #e9ebf3; --muted: #8c8d92; --primary: #f59e0b; --primary-text: #f59e0b; --on-primary: #111111; --primary-soft: #36260d; --nav-bg: #09090a; --nav-text: #dadada; --nav-muted: #9d9d9d; --nav-hover: #1d1d1e; --nav-border: #2b2b2c; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: dark; }
:root[data-skin="charcoal"][data-mode="dark"] { --bg: #0c0c0d; --bg-image: none; --surface: #161618; --surface-2: #1f1f21; --border: #323234; --text: #e9ebf3; --muted: #8c8d92; --primary: #f59e0b; --primary-text: #f59e0b; --on-primary: #111111; --primary-soft: #36260d; --nav-bg: #09090a; --nav-text: #dadada; --nav-muted: #9d9d9d; --nav-hover: #1d1d1e; --nav-border: #2b2b2c; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="violet"] { --bg: #110f1a; --bg-image: none; --surface: #1a1726; --surface-2: #23202f; --border: #353340; --text: #e9ebf3; --muted: #8e8f98; --primary: #9063f6; --primary-text: #9b73f7; --on-primary: #111111; --primary-soft: #271d42; --nav-bg: #0d0b14; --nav-text: #dbdadc; --nav-muted: #9e9da1; --nav-hover: #201f27; --nav-border: #2f2d35; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: dark; }
:root[data-skin="violet"][data-mode="dark"] { --bg: #110f1a; --bg-image: none; --surface: #1a1726; --surface-2: #23202f; --border: #353340; --text: #e9ebf3; --muted: #8e8f98; --primary: #9063f6; --primary-text: #9b73f7; --on-primary: #111111; --primary-soft: #271d42; --nav-bg: #0d0b14; --nav-text: #dbdadc; --nav-muted: #9e9da1; --nav-hover: #201f27; --nav-border: #2f2d35; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="sand"] { --bg: #f6f1e9; --bg-image: none; --surface: #fffdf9; --surface-2: #fbf7f1; --border: #e7d9d3; --text: #261d24; --muted: #716b6b; --primary: #c2410c; --primary-text: #b83e0b; --on-primary: #ffffff; --primary-soft: #f9ece7; --nav-bg: #ffffff; --nav-text: #3e4552; --nav-muted: #70757e; --nav-hover: #ededef; --nav-border: #dfe0e2; --nav-active-bg: #f6e4dd; --nav-active-text: #923109; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="sand"][data-mode="dark"] { --bg: #181112; --bg-image: none; --surface: #271d20; --surface-2: #302629; --border: #41383b; --text: #e9ebf3; --muted: #918f95; --primary: #c44612; --primary-text: #d3744d; --on-primary: #ffffff; --primary-soft: #371a11; --nav-bg: #120d0e; --nav-text: #dbdbdb; --nav-muted: #a09e9f; --nav-hover: #252021; --nav-border: #332f30; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="sky"] { --bg: #edf5fb; --bg-image: none; --surface: #ffffff; --surface-2: #f6fafd; --border: #d0e1ec; --text: #0f253a; --muted: #64707c; --primary: #0284c7; --primary-text: #0270a9; --on-primary: #111111; --primary-soft: #e6f3f9; --nav-bg: #ffffff; --nav-text: #3e4552; --nav-muted: #70757e; --nav-hover: #ededef; --nav-border: #dfe0e2; --nav-active-bg: #dceef7; --nav-active-text: #026395; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="sky"][data-mode="dark"] { --bg: #0a151f; --bg-image: none; --surface: #142433; --surface-2: #1d2d3b; --border: #303e4b; --text: #e9ebf3; --muted: #8e949d; --primary: #0284c7; --primary-text: #2896cf; --on-primary: #111111; --primary-soft: #09293d; --nav-bg: #081017; --nav-text: #dadbdc; --nav-muted: #9c9fa2; --nav-hover: #1c232a; --nav-border: #2b3137; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="lavender"] { --bg: #f3f1fa; --bg-image: none; --surface: #ffffff; --surface-2: #f9f8fd; --border: #ded8f0; --text: #1e1c3f; --muted: #6c6b7d; --primary: #7c3aed; --primary-text: #7c3aed; --on-primary: #ffffff; --primary-soft: #f2ebfd; --nav-bg: #ffffff; --nav-text: #3e4552; --nav-muted: #70757e; --nav-hover: #ededef; --nav-border: #dfe0e2; --nav-active-bg: #ede3fc; --nav-active-text: #5d2cb2; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="lavender"][data-mode="dark"] { --bg: #131021; --bg-image: none; --surface: #201c36; --surface-2: #29253e; --border: #3b374e; --text: #e9ebf3; --muted: #8f8f9b; --primary: #8649ee; --primary-text: #9e6df1; --on-primary: #ffffff; --primary-soft: #261846; --nav-bg: #0e0c19; --nav-text: #dbdbdd; --nav-muted: #9f9ea3; --nav-hover: #211f2b; --nav-border: #302e39; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="burgundy"] { --bg: #14090c; --bg-image: none; --surface: #211116; --surface-2: #2a1b1f; --border: #3c2e32; --text: #e9ebf3; --muted: #908c92; --primary: #e11d48; --primary-text: #e74a6d; --on-primary: #ffffff; --primary-soft: #390d17; --nav-bg: #0f0709; --nav-text: #dbdada; --nav-muted: #9f9c9d; --nav-hover: #221b1d; --nav-border: #312a2b; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: dark; }
:root[data-skin="burgundy"][data-mode="dark"] { --bg: #14090c; --bg-image: none; --surface: #211116; --surface-2: #2a1b1f; --border: #3c2e32; --text: #e9ebf3; --muted: #908c92; --primary: #e11d48; --primary-text: #e74a6d; --on-primary: #ffffff; --primary-soft: #390d17; --nav-bg: #0f0709; --nav-text: #dbdada; --nav-muted: #9f9c9d; --nav-hover: #221b1d; --nav-border: #312a2b; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="blue"] { --bg: #f5f7fd; --bg-image: none; --surface: #ffffff; --surface-2: #fafbfe; --border: #d5dcee; --text: #121e3c; --muted: #686e7d; --primary: #1d4ed8; --primary-text: #1d4ed8; --on-primary: #ffffff; --primary-soft: #e8edfb; --nav-bg: #ffffff; --nav-text: #3e4552; --nav-muted: #70757e; --nav-hover: #ededef; --nav-border: #dfe0e2; --nav-active-bg: #dfe6fa; --nav-active-text: #163ba2; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="blue"][data-mode="dark"] { --bg: #0c1220; --bg-image: none; --surface: #171e34; --surface-2: #20273c; --border: #33394c; --text: #e9ebf3; --muted: #8c909a; --primary: #6183e4; --primary-text: #718fe7; --on-primary: #111111; --primary-soft: #1b2643; --nav-bg: #090e18; --nav-text: #dadbdc; --nav-muted: #9d9fa3; --nav-hover: #1d212a; --nav-border: #2b3038; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="purple"] { --bg: #f8f5fd; --bg-image: none; --surface: #ffffff; --surface-2: #fcfafe; --border: #ded7ee; --text: #1c1a3c; --muted: #726f82; --primary: #6d28d9; --primary-text: #6d28d9; --on-primary: #ffffff; --primary-soft: #f0eafb; --nav-bg: #ffffff; --nav-text: #3e4552; --nav-muted: #70757e; --nav-hover: #ededef; --nav-border: #dfe0e2; --nav-active-bg: #ebe1fa; --nav-active-text: #521ea3; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="purple"][data-mode="dark"] { --bg: #120f20; --bg-image: none; --surface: #1f1b34; --surface-2: #28243c; --border: #3a364c; --text: #e9ebf3; --muted: #8f8f9a; --primary: #9969e4; --primary-text: #a378e7; --on-primary: #111111; --primary-soft: #2a1f43; --nav-bg: #0e0b18; --nav-text: #dbdadc; --nav-muted: #9f9da3; --nav-hover: #211f2a; --nav-border: #302d38; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="orange"] { --bg: #fcf6f4; --bg-image: none; --surface: #ffffff; --surface-2: #fefbfa; --border: #e8dad7; --text: #261d24; --muted: #746d70; --primary: #c2410c; --primary-text: #b83e0b; --on-primary: #ffffff; --primary-soft: #f9ece7; --nav-bg: #ffffff; --nav-text: #3e4552; --nav-muted: #70757e; --nav-hover: #ededef; --nav-border: #dfe0e2; --nav-active-bg: #f6e4dd; --nav-active-text: #923109; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="orange"][data-mode="dark"] { --bg: #181112; --bg-image: none; --surface: #271d20; --surface-2: #302629; --border: #41383b; --text: #e9ebf3; --muted: #918f95; --primary: #c44612; --primary-text: #d3744d; --on-primary: #ffffff; --primary-soft: #371a11; --nav-bg: #120d0e; --nav-text: #dbdbdb; --nav-muted: #a09e9f; --nav-hover: #252021; --nav-border: #332f30; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="maroon"] { --bg: #fbf4f6; --bg-image: none; --surface: #ffffff; --surface-2: #fdfafb; --border: #e5d5db; --text: #221729; --muted: #756e76; --primary: #9f1239; --primary-text: #9f1239; --on-primary: #ffffff; --primary-soft: #f5e7eb; --nav-bg: #ffffff; --nav-text: #3e4552; --nav-muted: #70757e; --nav-hover: #ededef; --nav-border: #dfe0e2; --nav-active-bg: #f2dee3; --nav-active-text: #770e2b; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="maroon"][data-mode="dark"] { --bg: #150d15; --bg-image: none; --surface: #241824; --surface-2: #2d212d; --border: #3e343e; --text: #e9ebf3; --muted: #908e96; --primary: #b4556f; --primary-text: #c3778c; --on-primary: #ffffff; --primary-soft: #331b26; --nav-bg: #100a10; --nav-text: #dbdadb; --nav-muted: #9f9d9f; --nav-hover: #231e23; --nav-border: #312c31; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="amber"] { --bg: #fdf9f4; --bg-image: none; --surface: #ffffff; --surface-2: #fefcfa; --border: #ebe1d6; --text: #292323; --muted: #75716f; --primary: #c96e06; --primary-text: #a15805; --on-primary: #111111; --primary-soft: #fbf1e6; --nav-bg: #ffffff; --nav-text: #3e4552; --nav-muted: #70757e; --nav-hover: #ededef; --nav-border: #dfe0e2; --nav-active-bg: #f7ebdc; --nav-active-text: #975305; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="amber"][data-mode="dark"] { --bg: #191411; --bg-image: none; --surface: #2a221f; --surface-2: #332b28; --border: #443d3a; --text: #e9ebf3; --muted: #959497; --primary: #d97706; --primary-text: #db7e12; --on-primary: #111111; --primary-soft: #3c260f; --nav-bg: #130f0d; --nav-text: #dcdbdb; --nav-muted: #a19f9e; --nav-hover: #262220; --nav-border: #34312f; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="forest"] { --bg: #f0fdf4; --bg-image: none; --surface: #ffffff; --surface-2: #f8fefa; --border: #d5ece5; --text: #152e35; --muted: #647373; --primary: #269a70; --primary-text: #1e7b5a; --on-primary: #111111; --primary-soft: #ebfbf5; --nav-bg: #0d3b2e; --nav-text: #dbe2e0; --nav-muted: #9eb1ab; --nav-hover: #204b3f; --nav-border: #2f564b; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="forest"][data-mode="dark"] { --bg: #0e1b1b; --bg-image: none; --surface: #192c2e; --surface-2: #223436; --border: #354547; --text: #e9ebf3; --muted: #949a9e; --primary: #34d399; --primary-text: #34d399; --on-primary: #111111; --primary-soft: #153c32; --nav-bg: #0b1414; --nav-text: #dadcdc; --nav-muted: #9da1a1; --nav-hover: #1f2727; --nav-border: #2d3535; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="arctic"] { --bg: #ecfeff; --bg-image: none; --surface: #ffffff; --surface-2: #f6ffff; --border: #d3ecf1; --text: #132e3f; --muted: #61737a; --primary: #1996aa; --primary-text: #147888; --on-primary: #111111; --primary-soft: #e9fbfd; --nav-bg: #0c1a3a; --nav-text: #dbdde1; --nav-muted: #9ea3b0; --nav-hover: #1f2c4a; --nav-border: #2e3a56; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="arctic"][data-mode="dark"] { --bg: #0d1b21; --bg-image: none; --surface: #172c36; --surface-2: #20343e; --border: #33454e; --text: #e9ebf3; --muted: #949aa1; --primary: #22d3ee; --primary-text: #22d3ee; --on-primary: #111111; --primary-soft: #113c46; --nav-bg: #0a1419; --nav-text: #dadcdd; --nav-muted: #9da1a3; --nav-hover: #1e272b; --nav-border: #2c3539; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="carbon"] { --bg: #fff9f9; --bg-image: none; --surface: #ffffff; --surface-2: #fffcfc; --border: #efe0e3; --text: #2d2330; --muted: #787176; --primary: #d96363; --primary-text: #ae4f4f; --on-primary: #111111; --primary-soft: #fef1f1; --nav-bg: #ffffff; --nav-text: #3e4552; --nav-muted: #70757e; --nav-hover: #ededef; --nav-border: #dfe0e2; --nav-active-bg: #fae9e9; --nav-active-text: #a34a4a; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="carbon"][data-mode="dark"] { --bg: #1a1a2e; --bg-image: none; --surface: #2d222a; --surface-2: #352b33; --border: #463d44; --text: #e9ebf3; --muted: #9596a3; --primary: #f87171; --primary-text: #f87171; --on-primary: #111111; --primary-soft: #422a3a; --nav-bg: #0d0d0d; --nav-text: #dbdbdb; --nav-muted: #9e9e9e; --nav-hover: #202020; --nav-border: #2f2f2f; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="teal"] { --bg: #f0fdfa; --bg-image: none; --surface: #ffffff; --surface-2: #f8fefd; --border: #d5eceb; --text: #142f39; --muted: #647377; --primary: #219b8b; --primary-text: #1a7c6f; --on-primary: #111111; --primary-soft: #eafbf9; --nav-bg: #0d2424; --nav-text: #dbdede; --nav-muted: #9ea7a7; --nav-hover: #203636; --nav-border: #2f4343; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="teal"][data-mode="dark"] { --bg: #0d1b1e; --bg-image: none; --surface: #182c32; --surface-2: #21343a; --border: #34454b; --text: #e9ebf3; --muted: #949aa0; --primary: #2dd4bf; --primary-text: #2dd4bf; --on-primary: #111111; --primary-soft: #133c3b; --nav-bg: #0a1417; --nav-text: #dadcdc; --nav-muted: #9da1a2; --nav-hover: #1e272a; --nav-border: #2c3537; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="grape"] { --bg: #faf5ff; --bg-image: none; --surface: #ffffff; --surface-2: #fdfaff; --border: #e7e1f3; --text: #262541; --muted: #6f6c7b; --primary: #a370d6; --primary-text: #825aab; --on-primary: #111111; --primary-soft: #f9f3ff; --nav-bg: #2d1b69; --nav-text: #e0dde9; --nav-muted: #aba4c3; --nav-hover: #3e2d75; --nav-border: #4a3b7e; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="grape"][data-mode="dark"] { --bg: #181522; --bg-image: none; --surface: #272438; --surface-2: #302d40; --border: #413e50; --text: #e9ebf3; --muted: #9898a1; --primary: #c084fc; --primary-text: #c084fc; --on-primary: #111111; --primary-soft: #362949; --nav-bg: #12101a; --nav-text: #dbdbdd; --nav-muted: #a09fa3; --nav-hover: #25232c; --nav-border: #33313a; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="gold"] { --bg: #fffbeb; --bg-image: none; --surface: #ffffff; --surface-2: #fffdf5; --border: #eee5d3; --text: #2c2824; --muted: #77746c; --primary: #b87708; --primary-text: #9c6507; --on-primary: #111111; --primary-soft: #fef5e7; --nav-bg: #1c1205; --nav-text: #dddbda; --nav-muted: #a4a09b; --nav-hover: #2e2519; --nav-border: #3c3328; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="gold"][data-mode="dark"] { --bg: #1b1712; --bg-image: none; --surface: #2c2620; --surface-2: #342f29; --border: #45403b; --text: #e9ebf3; --muted: #99999b; --primary: #f59e0b; --primary-text: #f59e0b; --on-primary: #111111; --primary-soft: #422f11; --nav-bg: #14110e; --nav-text: #dcdbdb; --nav-muted: #a1a09f; --nav-hover: #272421; --nav-border: #353230; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="crimson"] { --bg: #fff0f0; --bg-image: none; --surface: #ffffff; --surface-2: #fff8f8; --border: #eed9db; --text: #2c1d2a; --muted: #776b70; --primary: #ef4444; --primary-text: #bf3636; --on-primary: #111111; --primary-soft: #fdecec; --nav-bg: #1a0000; --nav-text: #ddd9d9; --nav-muted: #a39999; --nav-hover: #2c1414; --nav-border: #3a2424; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="crimson"][data-mode="dark"] { --bg: #1b1116; --bg-image: none; --surface: #2c1d25; --surface-2: #34262e; --border: #45383f; --text: #e9ebf3; --muted: #928f96; --primary: #ef4444; --primary-text: #f16060; --on-primary: #111111; --primary-soft: #411a1e; --nav-bg: #140d11; --nav-text: #dcdbdb; --nav-muted: #a19ea0; --nav-hover: #272024; --nav-border: #352f32; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="copper"] { --bg: #fff7f0; --bg-image: none; --surface: #ffffff; --surface-2: #fffbf8; --border: #eeddd5; --text: #2b2024; --muted: #776f6e; --primary: #e4560c; --primary-text: #b6450a; --on-primary: #111111; --primary-soft: #fdeee7; --nav-bg: #1a0a00; --nav-text: #dddad9; --nav-muted: #a39d99; --nav-hover: #2c1e14; --nav-border: #3a2c24; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="copper"][data-mode="dark"] { --bg: #1b1212; --bg-image: none; --surface: #2b1f20; --surface-2: #332829; --border: #443a3b; --text: #e9ebf3; --muted: #929095; --primary: #ea580c; --primary-text: #ec6924; --on-primary: #111111; --primary-soft: #401f11; --nav-bg: #140e0e; --nav-text: #dcdbdb; --nav-muted: #a19f9f; --nav-hover: #272121; --nav-border: #353030; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="snow"] { --bg: #ffffff; --bg-image: none; --surface: #ffffff; --surface-2: #ffffff; --border: #e0e1f2; --text: #1b213f; --muted: #70737f; --primary: #5f62e7; --primary-text: #5a5ddb; --on-primary: #ffffff; --primary-soft: #eff0fe; --nav-bg: #dce3f0; --nav-text: #39414f; --nav-muted: #5d6573; --nav-hover: #cdd4e1; --nav-border: #c1c8d6; --nav-active-bg: #cbd2f0; --nav-active-text: #4a4db5; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="snow"][data-mode="dark"] { --bg: #111322; --bg-image: none; --surface: #1e2137; --surface-2: #272a3f; --border: #393c4f; --text: #e9ebf3; --muted: #91939e; --primary: #5f62e7; --primary-text: #7f81ec; --on-primary: #ffffff; --primary-soft: #202247; --nav-bg: #0d0e1a; --nav-text: #dbdbdd; --nav-muted: #9e9fa3; --nav-hover: #20212c; --nav-border: #2f303a; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="pearl"] { --bg: #fdfcff; --bg-image: none; --surface: #ffffff; --surface-2: #fefeff; --border: #e1dbf1; --text: #1e1c3f; --muted: #70707f; --primary: #7c3aed; --primary-text: #7c3aed; --on-primary: #ffffff; --primary-soft: #f2ebfd; --nav-bg: #e8e2f8; --nav-text: #3b4151; --nav-muted: #616576; --nav-hover: #d8d3e8; --nav-border: #cbc7dc; --nav-active-bg: #d9caf6; --nav-active-text: #5d2cb2; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="pearl"][data-mode="dark"] { --bg: #131021; --bg-image: none; --surface: #201c36; --surface-2: #29253e; --border: #3b374e; --text: #e9ebf3; --muted: #8f8f9b; --primary: #8649ee; --primary-text: #9e6df1; --on-primary: #ffffff; --primary-soft: #261846; --nav-bg: #0e0c19; --nav-text: #dbdbdd; --nav-muted: #9f9ea3; --nav-hover: #211f2b; --nav-border: #302e39; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="zinc"] { --bg: #f8fafc; --bg-image: none; --surface: #ffffff; --surface-2: #fcfdfe; --border: #dadde3; --text: #171f2f; --muted: #6f747b; --primary: #475569; --primary-text: #475569; --on-primary: #ffffff; --primary-soft: #edeef0; --nav-bg: #e2e8f0; --nav-text: #3a414f; --nav-muted: #5f6773; --nav-hover: #d2d8e1; --nav-border: #c6cdd6; --nav-active-bg: #ccd3dd; --nav-active-text: #35404f; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="zinc"][data-mode="dark"] { --bg: #0f1218; --bg-image: none; --surface: #1b1f29; --surface-2: #242832; --border: #363a43; --text: #e9ebf3; --muted: #8d9097; --primary: #7e8896; --primary-text: #848e9b; --on-primary: #111111; --primary-soft: #23272f; --nav-bg: #0b0e12; --nav-text: #dadbdb; --nav-muted: #9d9fa0; --nav-hover: #1f2125; --nav-border: #2d3033; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="fluent"] { --bg: #F3F3F3; --bg-image: none; --surface: #FFFFFF; --surface-2: #f9f9f9; --border: #d1dde9; --text: #1B1B1B; --muted: #6f6f6f; --primary: #0067C0; --primary-text: #0067C0; --on-primary: #ffffff; --primary-soft: #e6f0f9; --nav-bg: #F3F3F3; --nav-text: #3c4350; --nav-muted: #656a74; --nav-hover: #e2e2e4; --nav-border: #d5d6d8; --nav-active-bg: #d1dfec; --nav-active-text: #004d90; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="fluent"][data-mode="dark"] { --bg: #0a131e; --bg-image: none; --surface: #142132; --surface-2: #1d2a3a; --border: #303c4b; --text: #e9ebf3; --muted: #8b909a; --primary: #1372c5; --primary-text: #428ed1; --on-primary: #ffffff; --primary-soft: #08223b; --nav-bg: #080e17; --nav-text: #dadbdc; --nav-muted: #9c9fa2; --nav-hover: #1c212a; --nav-border: #2b3037; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="modern"] { --bg: #F6F7FB; --bg-image: none; --surface: #FFFFFF; --surface-2: #fbfbfd; --border: #d2e3e3; --text: #1F2544; --muted: #6e7180; --primary: #059669; --primary-text: #047854; --on-primary: #111111; --primary-soft: #e6f5f0; --nav-bg: #FFFFFF; --nav-text: #3e4552; --nav-muted: #70757e; --nav-hover: #ededef; --nav-border: #dfe0e2; --nav-active-bg: #dcf0ea; --nav-active-text: #04714f; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="modern"][data-mode="dark"] { --bg: #0b1718; --bg-image: none; --surface: #142629; --surface-2: #1d2f32; --border: #304043; --text: #e9ebf3; --muted: #8f959a; --primary: #059669; --primary-text: #2ba680; --on-primary: #111111; --primary-soft: #0a2e27; --nav-bg: #081112; --nav-text: #dadbdb; --nav-muted: #9ca0a0; --nav-hover: #1c2425; --nav-border: #2b3233; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="office"] { --bg: #FFFFFF; --bg-image: none; --surface: #FFFFFF; --surface-2: #ffffff; --border: #d8dee7; --text: #252525; --muted: #747474; --primary: #1E4E8C; --primary-text: #1E4E8C; --on-primary: #ffffff; --primary-soft: #e9edf4; --nav-bg: #FAFAFA; --nav-text: #3d4451; --nav-muted: #6e737d; --nav-hover: #e8e9ea; --nav-border: #dbdcde; --nav-active-bg: #dbe2eb; --nav-active-text: #173b69; --danger: #b42318; --on-danger: #ffffff; --warn-bg: #fff4d6; --warn-text: #6b4600; --ok: #157a3c; --info-bg: #e5effa; --info-text: #1d4f8a; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: light; }
:root[data-skin="office"][data-mode="dark"] { --bg: #0c121b; --bg-image: none; --surface: #171e2d; --surface-2: #202735; --border: #333946; --text: #e9ebf3; --muted: #8c9098; --primary: #6283af; --primary-text: #728fb7; --on-primary: #111111; --primary-soft: #1b2636; --nav-bg: #090e14; --nav-text: #dadbdc; --nav-muted: #9d9fa1; --nav-hover: #1d2127; --nav-border: #2b3035; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }
:root[data-skin="dark"] { --bg: #0A0F1C; --bg-image: none; --surface: #111827; --surface-2: #1b2130; --border: #2e3441; --text: #E6E9F2; --muted: #8a8d98; --primary: #9063f6; --primary-text: #9b73f7; --on-primary: #111111; --primary-soft: #211d43; --nav-bg: #0B1120; --nav-text: #dadbde; --nav-muted: #9da0a6; --nav-hover: #1f2432; --nav-border: #2d323f; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; --font: 'Cairo', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --radius: 8px; color-scheme: dark; }
:root[data-skin="dark"][data-mode="dark"] { --bg: #0A0F1C; --bg-image: none; --surface: #111827; --surface-2: #1b2130; --border: #2e3441; --text: #E6E9F2; --muted: #8a8d98; --primary: #9063f6; --primary-text: #9b73f7; --on-primary: #111111; --primary-soft: #211d43; --nav-bg: #0B1120; --nav-text: #dadbde; --nav-muted: #9da0a6; --nav-hover: #1f2432; --nav-border: #2d323f; --nav-active-bg: rgba(255,255,255,0.16); --nav-active-text: #ffffff; --danger: #f97066; --on-danger: #2a0603; --warn-bg: #3a2c05; --warn-text: #fcd57a; --ok: #6ee7a0; --info-bg: #14273d; --info-text: #9cc3f0; color-scheme: dark; }

:root[data-style="glass"][data-skin] { --radius: 16px; }
:root[data-style="corporate"][data-skin] { --radius: 2px; }
:root[data-style="soft"][data-skin] { --radius: 20px; }
:root[data-style="minimal"][data-skin] { --radius: 6px; }
:root[data-style="neon"][data-skin] { --radius: 12px; }
:root[data-style="luxury"][data-skin] { --radius: 14px; --font: 'El Messiri', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }
:root[data-style="boutique"][data-skin] { --radius: 22px; --font: 'Almarai', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }
:root[data-style="brutal"][data-skin] { --radius: 4px; }
:root[data-style="earth"][data-skin] { --radius: 10px; }
:root[data-style="paper"][data-skin] { --radius: 3px; --font: 'Amiri', 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }
:root[data-style="compact"][data-skin] { --radius: 4px; }
:root[data-style="touch"][data-skin] { --radius: 12px; }




: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"] .prog,
:root[data-style="glass"] .sheet,
:root[data-style="glass"] .hero-card,
:root[data-style="glass"] .stat {
  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"] .prog,
:root[data-style="corporate"] .sheet,
:root[data-style="corporate"] .hero-card,
:root[data-style="corporate"] .stat {
  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"] .prog,
:root[data-style="soft"] .sheet,
:root[data-style="soft"] .hero-card,
:root[data-style="soft"] .stat {
  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"] .prog,
:root[data-style="minimal"] .sheet,
:root[data-style="minimal"] .hero-card,
:root[data-style="minimal"] .stat {
  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"] .prog,
:root[data-style="neon"] .sheet,
:root[data-style="neon"] .hero-card,
:root[data-style="neon"] .stat {
  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"] .prog,
:root[data-style="luxury"] .sheet,
:root[data-style="luxury"] .hero-card,
:root[data-style="luxury"] .stat {
  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"] .prog,
:root[data-style="boutique"] .sheet,
:root[data-style="boutique"] .hero-card,
:root[data-style="boutique"] .stat {
  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"] .prog,
:root[data-style="brutal"] .sheet,
:root[data-style="brutal"] .hero-card,
:root[data-style="brutal"] .stat {
  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"] .prog,
:root[data-mode="dark"][data-style="brutal"] .sheet,
:root[data-mode="dark"][data-style="brutal"] .hero-card,
:root[data-mode="dark"][data-style="brutal"] .stat,
: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"] .prog,
:root[data-style="earth"] .sheet,
:root[data-style="earth"] .hero-card,
:root[data-style="earth"] .stat {
  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"] .prog,
:root[data-style="paper"] .sheet,
:root[data-style="paper"] .hero-card,
:root[data-style="paper"] .stat {
  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"] .prog,
:root[data-style="compact"] .sheet,
:root[data-style="compact"] .hero-card,
:root[data-style="compact"] .stat {
  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"] .prog,
:root[data-style="touch"] .sheet,
:root[data-style="touch"] .hero-card,
:root[data-style="touch"] .stat {
  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;
}