:root { color-scheme: light; --white: #ffffff; --black: #000000; --transparent: transparent; --rail-bg: #25282a; --rail-bg-active: #1c1e20; --rail-text: #c7c6c0; --rail-text-muted: #a7a49f; --accent: #ef6b3a; --accent-rgb: 239, 107, 58; --accent-soft: rgba(239, 107, 58, .35); --bg: #e9e7e4; --bar: #d4d0ca; --panel: #f7f6f4; --panel-soft: #ffffff; --panel-header: #ffffff; --surface: #ffffff; --surface-subtle: var(--panel-soft); --surface-muted: #f6f7f9; --surface-strong: #f5f3ef; --surface-raised: #fbfaf8; --titlebar-bg: #fbfbfa; --sidebar-bg: #c8c4bf; --sidebar-border: #afada9; --sidebar-hover-bg: rgba(255,255,255,.35); --sidebar-hover-bg-strong: rgba(255,255,255,.42); --panel-glass: rgba(255,255,255,.56); --panel-glass-muted: rgba(255, 255, 255, 0.45); --panel-glass-bright: rgba(255, 255, 255, 0.9); --panel-glass-strong: rgba(255,255,255,.86); --line: #d6d2cc; --line-dark: #bdb8b0; --line-subtle: var(--line); --line-strong: var(--line-dark); --border: var(--line); --border-line: 1px solid var(--line); --border-line-dark: 1px solid var(--line-dark); --border-soft-line: 1px solid var(--border-soft); --border-muted-line: 1px solid var(--border-muted); --border-soft: rgba(15, 23, 42, 0.12); --border-muted: rgba(189, 184, 176, 0.32); --border-danger-soft: rgba(180, 35, 24, .24); --text: #48494c; --text-strong: #303135; --muted: #8a8781; --muted-text: var(--muted); --text-label: #6b6863; --text-subtle: #686560; --text-soft: #666666; --text-table-heading: #625f5a; --text-breadcrumb: #615f5c; --text-hover-strong: #3e3e3f; --neutral-950: #242424; --neutral-900: #333333; --neutral-800: #292929; --control-disabled-bg: #ebe8e2; --control-disabled-border: #c2bcb3; --control-disabled-text: #706b63; --control-disabled-placeholder: #969087; --control-disabled-label: #7d776f; --control-bg: #f8f8f7; --control-border: #c9c5bd; --control-border-hover: #aaa49a; --control-border-pressed: #aaa299; --control-gradient-start: #ffffff; --control-gradient-end: #f2f1ef; --control-gradient-end-muted: #f1efeb; --control-gradient-end-hover: #e9e7e3; --control-gradient-end-pressed: #e8e5df; --control-text: #4f4b46; --control-text-muted: #57534d; --input-border-focus: #9bb7d3; --toggle-track-bg: #cfd4da; --toggle-track-border: #aeb4bb; --green: #7bbcaf; --amber: #f5c56c; --red: #e06a5f; --blue: #7ea6c5; --primary: #0d6efd; --primary-soft: rgba(13, 110, 253, .08); --primary-soft-strong: rgba(13, 110, 253, .16); --primary-border: rgba(13, 110, 253, .45); --primary-focus-ring: 0 0 0 3px rgba(13, 110, 253, .18); --primary-focus-ring-soft: 0 0 0 3px rgba(13,110,253,.2); --primary-inset-ring: inset 0 0 0 1px rgba(13, 110, 253, .12); --success-bg: #d8eee8; --success-soft: #d6eee9; --success-border: #5aa99b; --success-border-soft: #78b7a9; --success-line: var(--success-border); --success: #157347; --success-text: #315f55; --success-text-strong: #34796d; --info-bg: #dce9f3; --info-soft: #d8e8f4; --info-muted-bg: #e8eef5; --info-muted-border: #c8d6e3; --info-text: #365c76; --info-text-strong: #386a90; --info-text-muted: #36566f; --info-text-deep: #294a61; --warning-bg: #ffe1a3; --warning-bg-hover: #ffd170; --warning-soft: #ffedc6; --warning-muted-bg: #fff1d0; --warning-border: #d5a64a; --warning-border-soft: rgba(154, 92, 0, .26); --warning-text: #593700; --warning-text-hover: #3e2800; --warning-text-strong: #a06b00; --warning: #8a5b00; --warning-deep: #7c5412; --danger-bg: #f8d1cc; --danger-soft: #f6e3df; --danger-muted-bg: #fff7f5; --danger-border: #c96b63; --danger-border-strong: #c94d43; --danger-border-deep: #b42318; --danger-focus-ring: 0 0 0 3px rgba(180, 35, 24, .14); --danger-focus-ring-soft: 0 0 0 3px rgba(201, 107, 99, .13); --danger-text: #a64840; --danger-text-strong: #b13e35; --danger-text-deep: #873c35; --danger-text-tooltip: #7a241c; --on-accent: #ffffff; --on-dark: #ffffff; --code-bg: #292929; --code-text: #f1f1f1; --status-neutral-bg: #e7e4df; --step-number-bg: #d8d6d2; --loading-line: #8c8881; --brand-mark-gradient: conic-gradient(#ef6b3a 0 20%, #f2c66d 0 40%, #80b9b0 0 60%, #7e9fc0 0 80%, #56545f 0); --focus-rgb: 82, 130, 177; --focus-ring: 0 0 0 3px rgba(82, 130, 177, .14); --focus-ring-color: rgba(82, 130, 177, .22); --focus-ring-strong: 0 0 0 3px rgba(82, 130, 177, .22); --focus-outline: 2px solid color-mix(in srgb, var(--blue) 55%, var(--white)); --text-table-heading-muted-border: rgba(98, 95, 90, .24); --text-table-heading-muted: rgba(98, 95, 90, .68); --overlay-backdrop: rgba(37, 40, 42, 0.38); --dialog-backdrop: rgba(15, 23, 42, 0.36); --hover-tint: rgba(0,0,0,.08); --hover-tint-soft: rgba(0, 0, 0, .06); --hover-tint-strong: rgba(0,0,0,.15); --titlebar-hover-bg: rgba(0,0,0,.055); --accent-hover-bg: rgba(239, 107, 58, .10); --accent-auth-glow: rgba(239, 107, 58, .13); --accent-ring-soft: 0 0 0 2px rgba(239, 107, 58, .16); --blue-auth-glow: rgba(126, 166, 197, .15); --transparent-surface: rgba(255, 255, 255, 0.00); --loading-envelope-bg: rgba(255,255,255,.7); --black-border-soft: rgba(0,0,0,.2); --black-border-muted: rgba(0,0,0,.18); --shadow-color-rgb: 0, 0, 0; --shadow-warm-rgb: 45, 43, 40; --shadow-slate-rgb: 15, 23, 42; --shadow-highlight-rgb: 255, 255, 255; --shadow: 0 1px 2px rgba(0,0,0,.15), 0 10px 30px rgba(0,0,0,.04); --shadow-menu: 0 16px 40px rgba(0,0,0,.18); --shadow-popover: 0 3px 8px -3px rgba(0,0,0,.16); --shadow-card: 0 2px 10px rgba(0,0,0,.06); --shadow-soft: 0 10px 28px rgba(15, 23, 42, 0.12); --shadow-strong: 0 24px 64px rgba(15, 23, 42, 0.25); --shadow-modal: 0 24px 80px rgba(0, 0, 0, 0.26); --shadow-floating: 0 16px 38px rgba(15, 23, 42, 0.2); --shadow-dismissible: 0 12px 24px rgba(15, 23, 42, 0.08); --shadow-header: 0 8px 18px rgba(65, 60, 52, .08); --shadow-chrome: 0 0 10px 0 darkgrey; --shadow-control: inset 0 1px 0 rgba(255,255,255,.75), 0 1px 1px rgba(0,0,0,.05); --shadow-control-strong: inset 0 1px 0 rgba(255,255,255,.85), 0 1px 1px rgba(0,0,0,.05); --shadow-control-hover: inset 0 1px 0 rgba(255,255,255,.82), 0 2px 5px rgba(0,0,0,.08); --shadow-control-inset: inset 0 1px 2px rgba(0,0,0,.04); --shadow-control-inset-strong: inset 0 1px 2px rgba(0,0,0,.12); --shadow-control-surface: inset 0 1px 0 rgba(255,255,255,.75), 0 1px 2px rgba(0,0,0,.035); --shadow-inset-highlight: inset 0 1px 0 rgba(255,255,255,.45); --shadow-inset-highlight-strong: inset 0 1px 0 rgba(255,255,255,.75); --shadow-inset-highlight-muted: inset 0 1px 0 rgba(255,255,255,.32); --shadow-sticky-start: 8px 0 14px -14px rgba(45, 43, 40, .6); --shadow-sticky-end: -8px 0 14px -14px rgba(45, 43, 40, .6); --shadow-data-header: 0 12px 16px -18px rgba(45, 43, 40, .8); --shadow-rail: inset -1px 0 rgba(0,0,0,.35); --shadow-xs: 0 1px 2px rgba(0,0,0,.05); --shadow-thumb: 0 1px 2px rgba(0,0,0,.22); --shadow-campaign-card: 0 14px 18px -22px rgba(45, 43, 40, .75); --shadow-campaign-soft: 0 1px 2px rgba(38, 35, 30, .04); --shadow-campaign-small: 0 4px 12px rgba(0,0,0,.09); --shadow-footer: 0 -8px 24px rgba(15, 23, 42, .06); --radius: 8px; --radius-xs: 5px; --radius-sm: 4px; --radius-md: var(--radius); --radius-lg: 12px; --radius-pill: 999px; --theme-preview-light-bg: #e9e7e4; --theme-preview-light-bar: #d4d0ca; --theme-preview-light-surface: #ffffff; --theme-preview-light-line: #d6d2cc; --theme-preview-light-text: #303135; --theme-preview-light-muted: #8a8781; --theme-preview-dark-bg: #202120; --theme-preview-dark-bar: #34342f; --theme-preview-dark-surface: #262724; --theme-preview-dark-line: #454740; --theme-preview-dark-text: #f6f4ed; --theme-preview-dark-muted: #aaa79d; --calendar-event-bg-default: #edf8f5; --calendar-event-border-default: #b9d7d0; --calendar-event-text: #21453e; --calendar-event-muted-text: #4d6764; --calendar-grid-bg: #f8f6f2; --calendar-muted-bg: #f1efeb; --calendar-today-bg: #e3f3ef; --calendar-selected-bg: #e0f0ea; --calendar-off-hours-rgb: 241, 239, 235; --calendar-day-shade: rgba(241, 239, 235, .74); --calendar-success-border: #4f9489; --calendar-danger-bg: #fff2f0; --calendar-danger-border: #f0b8b2; --calendar-overlay: rgba(33, 69, 62, .46); --calendar-switch-bg: #d8d3cb; --calendar-focus-inset: inset 0 0 0 2px rgba(90, 169, 155, .55); --calendar-focus-outline: 2px solid rgba(90, 169, 155, .35); --review-flow-purple: #9b86c7; --campaign-accent: #5d776c; --campaign-card-bg: rgba(247, 246, 244, .96); --campaign-card-bg-soft: rgba(247, 246, 244, .46); --campaign-panel-border: rgba(189, 184, 176, .8); --campaign-panel-bg: rgba(255, 255, 255, .91); --campaign-stage-shadow: 0 4px 12px rgba(48, 49, 53, .10); --campaign-stage-shadow-color: rgba(48, 49, 53, .10); --campaign-panel-shadow: 0 8px 24px rgba(48, 49, 53, .10); --campaign-panel-shadow-color: rgba(48, 49, 53, .14); --campaign-panel-shadow-strong: 0 12px 32px rgba(48, 49, 53, .14); --campaign-card-shadow: 0 14px 18px -22px rgba(45, 43, 40, .75); --font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; } :root[data-theme="dark"] { color-scheme: dark; --rail-bg: #171819; --rail-bg-active: #0f1011; --rail-text: #dfddd7; --rail-text-muted: #aaa79d; --bg: #202120; --bar: #34342f; --panel: #2b2c2a; --panel-soft: #242523; --panel-header: #30312e; --surface: #262724; --surface-subtle: #2e302c; --surface-muted: #2e302c; --surface-strong: #34342f; --surface-raised: #242523; --titlebar-bg: #242523; --sidebar-bg: #2b2c2a; --sidebar-border: #454740; --sidebar-hover-bg: rgba(255,255,255,.08); --sidebar-hover-bg-strong: rgba(255,255,255,.12); --panel-glass: rgba(36,37,35,.72); --panel-glass-muted: rgba(255,255,255,.08); --panel-glass-bright: rgba(38,39,36,.94); --panel-glass-strong: rgba(38,39,36,.92); --line: #454740; --line-dark: #5b5d54; --border: var(--line); --border-soft: rgba(255,255,255,.10); --border-muted: rgba(91, 93, 84, .55); --text: #dfddd7; --text-strong: #f6f4ed; --muted: #aaa79d; --muted-text: var(--muted); --text-label: #c9c5bd; --text-subtle: #c9c5bd; --text-soft: #aaa79d; --text-table-heading: #dfddd7; --text-breadcrumb: #dfddd7; --text-hover-strong: #f6f4ed; --control-disabled-bg: #33352f; --control-disabled-border: #5f6058; --control-disabled-text: #b8b4aa; --control-disabled-placeholder: #918d83; --control-disabled-label: #aaa69b; --control-bg: #30312e; --control-border: #5b5d54; --control-border-hover: #74776e; --control-border-pressed: #74776e; --control-gradient-start: #34342f; --control-gradient-end: #2b2c2a; --control-gradient-end-muted: #2b2c2a; --control-gradient-end-hover: #3b3c36; --control-gradient-end-pressed: #242523; --control-text: #f6f4ed; --control-text-muted: #dfddd7; --input-border-focus: #7ea6c5; --toggle-track-bg: #454740; --toggle-track-border: #5b5d54; --status-neutral-bg: #34342f; --step-number-bg: #454740; --loading-line: #aaa79d; --code-bg: #171819; --code-text: #f6f4ed; --overlay-backdrop: rgba(15, 16, 17, 0.58); --dialog-backdrop: rgba(15, 16, 17, 0.62); --hover-tint: rgba(255,255,255,.08); --hover-tint-soft: rgba(255,255,255,.06); --hover-tint-strong: rgba(255,255,255,.14); --titlebar-hover-bg: rgba(255,255,255,.08); --accent-hover-bg: rgba(239, 107, 58, .16); --accent-auth-glow: rgba(239, 107, 58, .18); --blue-auth-glow: rgba(126, 166, 197, .18); --transparent-surface: rgba(38, 39, 36, 0); --warning-bg: #7c5412; --warning-bg-hover: #8a5b00; --warning-soft: #5a431f; --warning-muted-bg: #4b3b22; --warning-text: #ffe1a3; --warning-text-hover: #ffedc6; --warning-text-strong: #ffe1a3; --danger-bg: #5f2e2a; --danger-soft: #4f2d2a; --danger-muted-bg: #3c2523; --danger-text: #f0b8b2; --danger-text-strong: #f8d1cc; --danger-text-deep: #f8d1cc; --danger-text-tooltip: #f8d1cc; --success-bg: #24473f; --success-soft: #24473f; --success-text: #d8eee8; --success-text-strong: #d6eee9; --info-bg: #243d4e; --info-soft: #243d4e; --info-text: #dce9f3; --info-text-strong: #d8e8f4; --shadow: 0 1px 2px rgba(0,0,0,.35), 0 10px 30px rgba(0,0,0,.18); --shadow-menu: 0 18px 44px rgba(0,0,0,.42); --shadow-popover: 0 8px 22px rgba(0,0,0,.36); --shadow-card: 0 2px 10px rgba(0,0,0,.22); --shadow-soft: 0 10px 28px rgba(0,0,0,.28); --shadow-strong: 0 24px 64px rgba(0,0,0,.46); --shadow-modal: 0 24px 80px rgba(0,0,0,.52); --shadow-floating: 0 18px 44px rgba(0,0,0,.42); --shadow-dismissible: 0 12px 24px rgba(0,0,0,.28); --shadow-header: 0 8px 18px rgba(0,0,0,.24); --shadow-chrome: 0 0 10px 0 rgba(0,0,0,.42); --shadow-data-header: 0 12px 16px -18px rgba(0,0,0,.9); --shadow-rail: inset -1px 0 rgba(0,0,0,.52); --shadow-xs: 0 1px 2px rgba(0,0,0,.28); --shadow-thumb: 0 1px 2px rgba(0,0,0,.42); --shadow-campaign-card: 0 14px 18px -22px rgba(0,0,0,.85); --shadow-campaign-soft: 0 1px 2px rgba(0,0,0,.24); --shadow-campaign-small: 0 4px 12px rgba(0,0,0,.32); --shadow-footer: 0 -8px 24px rgba(0,0,0,.28); --calendar-grid-bg: #242523; --calendar-muted-bg: #34342f; --calendar-today-bg: #24473f; --calendar-selected-bg: #24473f; --calendar-day-shade: rgba(52, 52, 47, .72); --calendar-danger-bg: #4f2d2a; --calendar-overlay: rgba(15, 16, 17, .56); --calendar-switch-bg: #454740; --campaign-card-bg: rgba(43, 44, 42, .96); --campaign-card-bg-soft: rgba(43, 44, 42, .58); --campaign-panel-border: rgba(91, 93, 84, .8); --campaign-panel-bg: rgba(38, 39, 36, .94); } .ui-reduce-motion *, .ui-reduce-motion *::before, .ui-reduce-motion *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .001ms !important; } * { box-sizing: border-box; } html, body, #root { height: 100%; } body { margin: 0; overflow: hidden; font-family: var(--font); color: var(--text); background: var(--bg); } a { color: inherit; }