/* ============ Factory Theme Tokens — 6 presets x light/dark ============ Semantic color tokens scoped by [data-theme] and [data-mode] on . Default (no attributes): amber light, via the :root fallback below. */ :root, [data-theme="amber"][data-mode="light"] { --canvas: #FAF9F7; --surface: #FFFFFF; --surface-2: #F5F4F2; --border: #E7E5E4; --ink: #1C1917; --muted: #78716C; --accent: #B45309; --accent-ink: #FFFFFF; --accent-50: #FFFBEB; --accent-100: #FEF3C7; --accent-200: #FDE68A; } [data-theme="amber"][data-mode="dark"] { --canvas: #1B1A18; --surface: #26241F; --surface-2: #2E2B26; --border: #3A3733; --ink: #F5F3F0; --muted: #A8A29E; --accent: #F59E0B; --accent-ink: #1C1917; --accent-50: #3A2E18; --accent-100: #4A3A1E; --accent-200: #6B5327; } [data-theme="luminous"][data-mode="light"] { --canvas: #F4F7FF; --surface: #FFFFFF; --surface-2: #EDF2FC; --border: #DCE4F5; --ink: #101428; --muted: #5A6480; --accent: #1E3FE0; --accent-ink: #FFFFFF; --accent-50: #EEF2FF; --accent-100: #E0E8FF; --accent-200: #C7D6FF; } [data-theme="luminous"][data-mode="dark"] { --canvas: #0A0D1A; --surface: #10142A; --surface-2: #161B36; --border: #232A4A; --ink: #EAF0FF; --muted: #8A94B8; --accent: #5B7CFF; --accent-ink: #0A0D1A; --accent-50: #141B3D; --accent-100: #1B2450; --accent-200: #27336E; } [data-theme="botanica"][data-mode="light"] { --canvas: #F0EEE9; --surface: #FAF8F2; --surface-2: #E9E5DA; --border: #DED9CC; --ink: #22301F; --muted: #696D60; --accent: #4F6428; --accent-ink: #FFFFFF; --accent-50: #F0F3E8; --accent-100: #E3EAD2; --accent-200: #CBD9B4; } [data-theme="botanica"][data-mode="dark"] { --canvas: #141812; --surface: #1D241B; --surface-2: #242C21; --border: #33402E; --ink: #EDF2E4; --muted: #9AA68F; --accent: #9DC183; --accent-ink: #141812; --accent-50: #212B1C; --accent-100: #2A3823; --accent-200: #3A4E30; } [data-theme="lavender"][data-mode="light"] { --canvas: #F6F4FB; --surface: #FFFFFF; --surface-2: #EFEBF7; --border: #E3DEF0; --ink: #241F35; --muted: #716A87; --accent: #6D5BD0; --accent-ink: #FFFFFF; --accent-50: #F1EDFB; --accent-100: #E6E0F7; --accent-200: #D1C8F0; } [data-theme="lavender"][data-mode="dark"] { --canvas: #171423; --surface: #201C31; --surface-2: #282238; --border: #38324E; --ink: #ECE8F7; --muted: #A29BBC; --accent: #B3A6F2; --accent-ink: #171423; --accent-50: #262045; --accent-100: #2F2852; --accent-200: #423A6E; } [data-theme="neongrid"][data-mode="light"] { --canvas: #F2F4F8; --surface: #FFFFFF; --surface-2: #E9EDF4; --border: #DDE2EC; --ink: #0D0E12; --muted: #5B6472; --accent: #6A1FD6; --accent-ink: #FFFFFF; --accent-50: #F3EEFF; --accent-100: #E9DEFC; --accent-200: #D3C0F7; } [data-theme="neongrid"][data-mode="dark"] { --canvas: #0D0E12; --surface: #181B22; --surface-2: #1F232C; --border: #262B36; --ink: #F5F7FA; --muted: #9AA3B2; --accent: #A6FF00; --accent-ink: #0D0E12; --accent-50: #1E2608; --accent-100: #28330B; --accent-200: #3A4A12; } [data-theme="terracotta"][data-mode="light"] { --canvas: #FAF4EC; --surface: #FFFDF8; --surface-2: #F3EADD; --border: #EBDFCE; --ink: #33231A; --muted: #7E6C5D; --accent: #BC4B28; --accent-ink: #FFFFFF; --accent-50: #FBEEE6; --accent-100: #F6DCCB; --accent-200: #EEB894; } [data-theme="terracotta"][data-mode="dark"] { --canvas: #1E1611; --surface: #2A1E17; --surface-2: #34251C; --border: #4A362A; --ink: #F7EBDF; --muted: #BFA693; --accent: #E97451; --accent-ink: #1E1611; --accent-50: #3A2318; --accent-100: #4A2C1E; --accent-200: #6B3E29; }