/* * OMA themes — the one theme file for the public site and the app. * * Every theme binds the ZUI token contract (colour, type, shape, depth, motion, density) plus the * OMA extensions listed under "Contract" below. The look is chosen with `data-theme` on * (default: cobalt) and the mode with the `.dark` class, which theme.js / useTheme resolve from the * stored choice or the device preference before first paint. * * cobalt — Blueprint blue on a workspace grey canvas with a dark platform rail (default) * coral — Lorax orange on a cool canvas, Lexend Deca type, navy chrome * orchid — the site's original look: plum ink, pink signal, cream paper, pill shapes * ember — warm ivory, charcoal ink, terracotta accent, serif display headings * * Contract (OMA extensions beyond the ZUI tokens): * --font-display, --display-weight, --display-tracking display headings * --heading heading colour * --band, --band-foreground, --band-muted, --band-border, --band-accent * the dark chrome (app header, site bands) * --canvas, --canvas-foreground tinted backdrop behind artifact mockups * --tint-1 … --tint-4 decorative card tints * --artifact-surface, --artifact-eyebrow, --artifact-callout, --artifact-table-head * the artifact page itself * * Specificity: `:root[data-theme]` (light) beats the ZUI `:root` defaults; `:root.dark[data-theme]` * beats ZUI's `.dark`. Every dark block therefore repeats every colour its light block sets. */ :root { color-scheme: light; } :root.dark { color-scheme: dark; } /* ========================================================================== cobalt (default) */ :root:not([data-theme]), :root[data-theme="cobalt"] { --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen", "Ubuntu", "Helvetica Neue", sans-serif; --font-mono: Menlo, Consolas, "DejaVu Sans Mono", ui-monospace, monospace; --font-display: var(--font-sans); --display-weight: 600; --display-tracking: -0.03em; --text-xs: 0.6875rem; --text-sm: 0.75rem; --text-base: 0.875rem; --text-base-line-height: 1.43; --text-lg: 1rem; --text-xl: 1.25rem; --text-2xl: 1.5rem; --text-3xl: 1.75rem; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --spacing: 0.25rem; --control-height-sm: 1.5rem; --control-height-md: 1.875rem; --control-height-lg: 2.5rem; --control-padding-x-sm: 0.4375rem; --control-padding-x-md: 0.625rem; --control-padding-x-lg: 0.9375rem; --button-padding-x-sm: 0.4375rem; --button-padding-x-md: 0.625rem; --button-padding-x-lg: 0.9375rem; --radius: 0.125rem; --radius-sm: 0.125rem; --radius-md: 0.125rem; --radius-lg: 0.25rem; --radius-xl: 0.375rem; --radius-2xl: 0.5rem; --radius-button: 0.125rem; --shadow-1: 0 0 0 1px rgba(17, 20, 24, 0.1), 0 1px 1px rgba(17, 20, 24, 0.2); --shadow-2: 0 0 0 1px rgba(17, 20, 24, 0.1), 0 1px 1px rgba(17, 20, 24, 0.2), 0 2px 6px rgba(17, 20, 24, 0.2); --shadow-3: 0 0 0 1px rgba(17, 20, 24, 0.1), 0 2px 4px rgba(17, 20, 24, 0.2), 0 8px 24px rgba(17, 20, 24, 0.2); --shadow-4: 0 0 0 1px rgba(17, 20, 24, 0.1), 0 4px 8px rgba(17, 20, 24, 0.2), 0 18px 46px 6px rgba(17, 20, 24, 0.2); --shadow-card: 0 0 0 1px rgba(17, 20, 24, 0.1), 0 1px 1px rgba(17, 20, 24, 0.2); --shadow-glow: 0 0 0 3px rgba(45, 114, 210, 0.3); --duration-fast: 100ms; --duration-normal: 200ms; --duration-slow: 300ms; --ease-standard: cubic-bezier(0.4, 1, 0.75, 0.9); --ease-decelerate: cubic-bezier(0, 0, 0.2, 1); --background: #f6f7f9; --foreground: #1c2127; --heading: #1c2127; --card: #ffffff; --card-foreground: #1c2127; --popover: #ffffff; --popover-foreground: #1c2127; --border: rgba(17, 20, 24, 0.15); --input: rgba(17, 20, 24, 0.3); --ring: #2d72d2; --muted: #edeff2; --muted-foreground: #5f6b7c; --primary: #2d72d2; --primary-foreground: #ffffff; --primary-text: #215db0; --primary-glow: rgba(45, 114, 210, 0.3); --secondary: #edeff2; --secondary-foreground: #1c2127; --accent: #e4effb; --accent-foreground: #184a90; --danger: #cd4246; --danger-foreground: #ffffff; --danger-text: #ac2f33; --success: #238551; --success-foreground: #ffffff; --success-text: #1c6e42; --warning: #ec9a3c; --warning-foreground: #1c2127; --warning-text: #935610; --info: #edeff2; --info-foreground: #1c2127; --info-border: rgba(17, 20, 24, 0.15); --chart-1: #2d72d2; --gradient-primary: linear-gradient(180deg, #4c90f0, #2d72d2); --gradient-hero: linear-gradient(135deg, #e4effb, #edeff2 60%, #f6f7f9); --gradient-subtle: linear-gradient(180deg, #ffffff, #f6f7f9); --sidebar: #1c2127; --sidebar-foreground: #c5cbd3; --sidebar-primary: #2d72d2; --sidebar-primary-foreground: #ffffff; --sidebar-accent: #2f343c; --sidebar-accent-foreground: #ffffff; --sidebar-border: #2f343c; --band: #1c2127; --band-foreground: #f6f7f9; --band-muted: #abb3bf; --band-border: #383e47; --band-accent: #4c90f0; --canvas: #e4e9ef; --canvas-foreground: #1c2127; --tint-1: #e4effb; --tint-2: #e3f2ea; --tint-3: #fbeee0; --tint-4: #edeff2; --artifact-surface: #ffffff; --artifact-eyebrow: #215db0; --artifact-callout: #e4effb; --artifact-table-head: #edeff2; } :root.dark:not([data-theme]), :root.dark[data-theme="cobalt"] { --background: #1c2127; --foreground: #f6f7f9; --heading: #f6f7f9; --card: #252a31; --card-foreground: #f6f7f9; --popover: #2f343c; --popover-foreground: #f6f7f9; --border: #383e47; --input: #404854; --ring: #8abbff; --muted: #252a31; --muted-foreground: #abb3bf; --primary: #2d72d2; --primary-foreground: #ffffff; --primary-text: #8abbff; --primary-glow: rgba(138, 187, 255, 0.3); --secondary: #2f343c; --secondary-foreground: #f6f7f9; --accent: #1a3b66; --accent-foreground: #8abbff; --danger: #e76a6e; --danger-foreground: #1c2127; --danger-text: #fa999c; --success: #32a467; --success-foreground: #1c2127; --success-text: #72ca9b; --warning: #ec9a3c; --warning-foreground: #1c2127; --warning-text: #fbb360; --info: #252a31; --info-foreground: #f6f7f9; --info-border: #383e47; --chart-1: #8abbff; --shadow-1: 0 0 0 1px rgba(17, 20, 24, 0.2), 0 1px 1px rgba(17, 20, 24, 0.4); --shadow-2: 0 0 0 1px rgba(17, 20, 24, 0.2), 0 1px 1px rgba(17, 20, 24, 0.4), 0 2px 6px rgba(17, 20, 24, 0.4); --shadow-3: 0 0 0 1px rgba(17, 20, 24, 0.2), 0 2px 4px rgba(17, 20, 24, 0.4), 0 8px 24px rgba(17, 20, 24, 0.4); --shadow-4: 0 0 0 1px rgba(17, 20, 24, 0.2), 0 4px 8px rgba(17, 20, 24, 0.4), 0 18px 46px 6px rgba(17, 20, 24, 0.4); --shadow-card: 0 0 0 1px rgba(17, 20, 24, 0.2), 0 1px 1px rgba(17, 20, 24, 0.4); --shadow-glow: 0 0 0 3px rgba(138, 187, 255, 0.3); --gradient-primary: linear-gradient(180deg, #4c90f0, #215db0); --gradient-hero: linear-gradient(135deg, #184a90, #252a31 60%, #1c2127); --gradient-subtle: linear-gradient(180deg, #252a31, #1c2127); --sidebar: #111418; --sidebar-foreground: #abb3bf; --sidebar-primary: #8abbff; --sidebar-primary-foreground: #1c2127; --sidebar-accent: #252a31; --sidebar-accent-foreground: #ffffff; --sidebar-border: #252a31; --band: #111418; --band-foreground: #f6f7f9; --band-muted: #abb3bf; --band-border: #2f343c; --band-accent: #8abbff; --canvas: #2f343c; --canvas-foreground: #f6f7f9; --tint-1: #1a3b66; --tint-2: #1b3d2c; --tint-3: #46301a; --tint-4: #2f343c; --artifact-surface: #252a31; --artifact-eyebrow: #8abbff; --artifact-callout: #1a3b66; --artifact-table-head: #2f343c; } /* ========================================================================== coral */ :root[data-theme="coral"] { --font-sans: "Lexend Deca", "Avenir Next", "Helvetica Neue", Helvetica, Arial, sans-serif; --font-mono: "Source Code Pro", ui-monospace, Menlo, Consolas, monospace; --font-display: var(--font-sans); --display-weight: 600; --display-tracking: -0.025em; --text-xs: 0.6875rem; --text-sm: 0.75rem; --text-base: 0.875rem; --text-base-line-height: 1.5; --text-lg: 1rem; --text-xl: 1.25rem; --text-2xl: 1.5rem; --text-3xl: 1.75rem; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 600; --spacing: 0.25rem; --control-height-sm: 2rem; --control-height-md: 2.5rem; --control-height-lg: 3rem; --control-padding-x-sm: 0.625rem; --control-padding-x-md: 0.75rem; --control-padding-x-lg: 1rem; --button-padding-x-sm: 0.75rem; --button-padding-x-md: 1rem; --button-padding-x-lg: 1.5rem; --radius: 0.1875rem; --radius-sm: 0.1875rem; --radius-md: 0.1875rem; --radius-lg: 0.25rem; --radius-xl: 0.375rem; --radius-2xl: 0.5rem; --radius-button: 0.1875rem; --shadow-1: 0 1px 5px rgba(45, 62, 80, 0.12); --shadow-2: 0 3px 8px rgba(45, 62, 80, 0.16); --shadow-3: 0 8px 20px rgba(45, 62, 80, 0.2); --shadow-4: 0 12px 28px rgba(45, 62, 80, 0.25); --shadow-card: 0 1px 5px rgba(45, 62, 80, 0.12); --shadow-glow: 0 0 0 2px #7fd1de; --duration-fast: 100ms; --duration-normal: 150ms; --duration-slow: 250ms; --ease-standard: ease; --ease-decelerate: cubic-bezier(0.2, 0, 0, 1); --background: #f5f8fa; --foreground: #33475b; --heading: #33475b; --card: #ffffff; --card-foreground: #33475b; --popover: #ffffff; --popover-foreground: #33475b; --border: #cbd6e2; --input: #cbd6e2; --ring: #00a4bd; --muted: #eaf0f6; --muted-foreground: #516f90; --primary: #ff7a59; --primary-foreground: #1b2a38; --primary-text: #d9552f; --primary-glow: rgba(255, 122, 89, 0.3); --secondary: #eaf0f6; --secondary-foreground: #33475b; --accent: #e5f5f8; --accent-foreground: #00728a; --danger: #d9363d; --danger-foreground: #ffffff; --danger-text: #b52a30; --success: #00bda5; --success-foreground: #1b2a38; --success-text: #007a6a; --warning: #f5c26b; --warning-foreground: #33475b; --warning-text: #8a5a00; --info: #e5f5f8; --info-foreground: #33475b; --info-border: #cbd6e2; --chart-1: #00a4bd; --gradient-primary: linear-gradient(180deg, #ff8f73, #ff7a59); --gradient-hero: linear-gradient(135deg, #e5f5f8, #f5f8fa 60%, #ffffff); --gradient-subtle: linear-gradient(180deg, #ffffff, #f5f8fa); --sidebar: #2d3e50; --sidebar-foreground: #cbd6e2; --sidebar-primary: #ff7a59; --sidebar-primary-foreground: #1b2a38; --sidebar-accent: #3e5974; --sidebar-accent-foreground: #ffffff; --sidebar-border: #3e5974; --band: #2d3e50; --band-foreground: #ffffff; --band-muted: #99acc2; --band-border: #3e5974; --band-accent: #ff7a59; --canvas: #dfe8f0; --canvas-foreground: #33475b; --tint-1: #ffe8e2; --tint-2: #e5f5f8; --tint-3: #eaf0f6; --tint-4: #e0f8f5; --artifact-surface: #ffffff; --artifact-eyebrow: #d9552f; --artifact-callout: #fff1ec; --artifact-table-head: #eaf0f6; } :root.dark[data-theme="coral"] { --background: #1b2a38; --foreground: #eaf0f6; --heading: #eaf0f6; --card: #253749; --card-foreground: #eaf0f6; --popover: #253749; --popover-foreground: #eaf0f6; --border: #3e5974; --input: #516f90; --ring: #7fd1de; --muted: #253749; --muted-foreground: #99acc2; --primary: #ff7a59; --primary-foreground: #1b2a38; --primary-text: #ff9b82; --primary-glow: rgba(255, 122, 89, 0.35); --secondary: #2d3e50; --secondary-foreground: #eaf0f6; --accent: #14414a; --accent-foreground: #7fd1de; --danger: #d9363d; --danger-foreground: #ffffff; --danger-text: #ff8a8f; --success: #00bda5; --success-foreground: #1b2a38; --success-text: #4fd9c6; --warning: #f5c26b; --warning-foreground: #1b2a38; --warning-text: #f5c26b; --info: #253749; --info-foreground: #eaf0f6; --info-border: #3e5974; --chart-1: #7fd1de; --shadow-1: 0 1px 5px rgba(0, 0, 0, 0.3); --shadow-2: 0 3px 8px rgba(0, 0, 0, 0.4); --shadow-3: 0 8px 20px rgba(0, 0, 0, 0.5); --shadow-4: 0 12px 28px rgba(0, 0, 0, 0.6); --shadow-card: 0 1px 5px rgba(0, 0, 0, 0.3); --gradient-hero: linear-gradient(135deg, #14414a, #253749 60%, #1b2a38); --gradient-subtle: linear-gradient(180deg, #253749, #1b2a38); --sidebar: #14212e; --sidebar-foreground: #cbd6e2; --sidebar-primary: #ff7a59; --sidebar-primary-foreground: #1b2a38; --sidebar-accent: #2d3e50; --sidebar-accent-foreground: #ffffff; --sidebar-border: #2d3e50; --band: #14212e; --band-foreground: #ffffff; --band-muted: #99acc2; --band-border: #2d3e50; --band-accent: #ff7a59; --canvas: #2d3e50; --canvas-foreground: #eaf0f6; --tint-1: #4a3333; --tint-2: #14414a; --tint-3: #2d3e50; --tint-4: #14403b; --artifact-surface: #253749; --artifact-eyebrow: #ff9b82; --artifact-callout: #3a3540; --artifact-table-head: #2d3e50; } /* ========================================================================== orchid */ :root[data-theme="orchid"] { --font-sans: "IBM Plex Sans", Arial, sans-serif; --font-mono: "IBM Plex Mono", ui-monospace, monospace; --font-display: "Arial Rounded MT Bold", "Trebuchet MS", Arial, sans-serif; --display-weight: 400; --display-tracking: -0.065em; --radius: 0.75rem; --radius-sm: 0.5rem; --radius-md: 0.75rem; --radius-lg: 1rem; --radius-xl: 1.25rem; --radius-2xl: 1.75rem; --radius-button: 999px; --shadow-1: 0 1px 2px rgba(58, 25, 43, 0.06); --shadow-2: 0 4px 12px rgba(58, 25, 43, 0.08); --shadow-3: 0 10px 28px rgba(58, 25, 43, 0.1); --shadow-4: 0 26px 70px rgba(25, 3, 12, 0.24); --shadow-card: 0 1px 2px rgba(58, 25, 43, 0.06), 0 1px 1px rgba(58, 25, 43, 0.04); --shadow-glow: 0 0 0 3px rgba(245, 102, 161, 0.3); --background: #fcfcf7; --foreground: #24161d; --heading: #4a1835; --card: #ffffff; --card-foreground: #24161d; --popover: #ffffff; --popover-foreground: #24161d; --border: #ddd6d3; --input: #cfc5c9; --ring: #f566a1; --muted: #efe9e6; --muted-foreground: #6b5e65; --primary: #f566a1; --primary-foreground: #260814; --primary-text: #d94584; --primary-glow: rgba(245, 102, 161, 0.3); --secondary: #efe9e6; --secondary-foreground: #24161d; --accent: #f6c0df; --accent-foreground: #4a1835; --danger: #c92a2a; --danger-foreground: #ffffff; --danger-text: #b32020; --success: #39794c; --success-foreground: #ffffff; --success-text: #2f6b41; --warning: #d4a052; --warning-foreground: #24161d; --warning-text: #9a5b00; --info: #eef5fb; --info-foreground: #24161d; --info-border: #b9ddf5; --chart-1: #419fe9; --gradient-primary: linear-gradient(135deg, #f78bb8, #f566a1); --gradient-hero: linear-gradient(135deg, #f6c0df, #fcfcf7 60%, #b9ddf5); --gradient-subtle: linear-gradient(180deg, #ffffff, #fcfcf7); --sidebar: #f5f1ee; --sidebar-foreground: #24161d; --sidebar-primary: #f566a1; --sidebar-primary-foreground: #260814; --sidebar-accent: #efe9e6; --sidebar-accent-foreground: #24161d; --sidebar-border: #ddd6d3; --band: #4a1835; --band-foreground: #ffffff; --band-muted: #c9aebb; --band-border: #6d4058; --band-accent: #f566a1; --canvas: #b9ddf5; --canvas-foreground: #4a1835; --tint-1: #f6c0df; --tint-2: #d9ccf8; --tint-3: #b9ddf5; --tint-4: #d7f1c3; --artifact-surface: #ffffff; --artifact-eyebrow: #d94584; --artifact-callout: #fbe7f1; --artifact-table-head: #f5eff2; } :root.dark[data-theme="orchid"] { --background: #200a15; --foreground: #fcfcf7; --heading: #f6c0df; --card: #2c0f1d; --card-foreground: #fcfcf7; --popover: #35101f; --popover-foreground: #fcfcf7; --border: #4d2238; --input: #5a2a43; --ring: #f566a1; --muted: #35101f; --muted-foreground: #bda9b3; --primary: #f566a1; --primary-foreground: #260814; --primary-text: #f78bb8; --primary-glow: rgba(245, 102, 161, 0.35); --secondary: #35101f; --secondary-foreground: #fcfcf7; --accent: #5b1b3b; --accent-foreground: #f6c0df; --danger: #ff8775; --danger-foreground: #260814; --danger-text: #ff9f91; --success: #91d3a4; --success-foreground: #260814; --success-text: #a6dfb5; --warning: #f0c060; --warning-foreground: #260814; --warning-text: #f0c060; --info: #1f3a52; --info-foreground: #fcfcf7; --info-border: #2f5273; --chart-1: #6db7f0; --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.3); --shadow-2: 0 4px 12px rgba(0, 0, 0, 0.4); --shadow-3: 0 10px 28px rgba(0, 0, 0, 0.5); --shadow-4: 0 26px 70px rgba(0, 0, 0, 0.6); --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.4); --gradient-hero: linear-gradient(135deg, #5b1b3b, #200a15 60%, #1f3a52); --gradient-subtle: linear-gradient(180deg, #2c0f1d, #200a15); --sidebar: #2c0f1d; --sidebar-foreground: #fcfcf7; --sidebar-primary: #f566a1; --sidebar-primary-foreground: #260814; --sidebar-accent: #35101f; --sidebar-accent-foreground: #fcfcf7; --sidebar-border: #4d2238; --band: #140309; --band-foreground: #fcfcf7; --band-muted: #bda9b3; --band-border: #3a1a2a; --band-accent: #f566a1; --canvas: #1f3a52; --canvas-foreground: #cfe6f7; --tint-1: #5b1b3b; --tint-2: #3a2d5c; --tint-3: #1f3a52; --tint-4: #244232; --artifact-surface: #2c0f1d; --artifact-eyebrow: #f78bb8; --artifact-callout: #4a1730; --artifact-table-head: #35101f; } /* ========================================================================== ember */ :root[data-theme="ember"] { --font-display: "Newsreader", "Iowan Old Style", "Charter", Georgia, "Times New Roman", serif; --font-sans: "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace; --display-weight: 500; --display-tracking: -0.02em; --radius: 0.75rem; --radius-sm: 0.5rem; --radius-md: 0.75rem; --radius-lg: 1rem; --radius-xl: 1.25rem; --radius-2xl: 1.75rem; --radius-button: 0.625rem; --shadow-1: 0 1px 2px rgba(20, 20, 19, 0.06); --shadow-2: 0 4px 12px rgba(20, 20, 19, 0.08); --shadow-3: 0 10px 28px rgba(20, 20, 19, 0.1); --shadow-4: 0 26px 70px rgba(20, 20, 19, 0.2); --shadow-card: 0 1px 2px rgba(20, 20, 19, 0.06), 0 1px 1px rgba(20, 20, 19, 0.04); --shadow-glow: 0 0 0 3px rgba(201, 100, 66, 0.3); --background: #f4f3ee; --foreground: #141413; --heading: #141413; --card: #faf9f5; --card-foreground: #141413; --popover: #faf9f5; --popover-foreground: #141413; --border: #e3e0d5; --input: #e3e0d5; --ring: #c96442; --muted: #ebe9e0; --muted-foreground: #6e6c64; --primary: #c96442; --primary-foreground: #ffffff; --primary-text: #b4553a; --primary-glow: rgba(201, 100, 66, 0.25); --secondary: #ebe9e0; --secondary-foreground: #141413; --accent: #f0e8e0; --accent-foreground: #141413; --danger: #b4453a; --danger-foreground: #ffffff; --danger-text: #a03c32; --success: #5f8a5a; --success-foreground: #ffffff; --success-text: #4f7a4a; --warning: #d4a052; --warning-foreground: #141413; --warning-text: #8f6620; --info: #f0eee6; --info-foreground: #141413; --info-border: #e3e0d5; --chart-1: #c96442; --gradient-primary: linear-gradient(135deg, #d97757 0%, #c96442 100%); --gradient-hero: linear-gradient(135deg, #fbf1ec, #f4f3ee 60%, #ebe9e0); --gradient-subtle: linear-gradient(180deg, #faf9f5, #f4f3ee); --sidebar: #f0eee6; --sidebar-foreground: #141413; --sidebar-primary: #c96442; --sidebar-primary-foreground: #ffffff; --sidebar-accent: #ebe9e0; --sidebar-accent-foreground: #141413; --sidebar-border: #e3e0d5; --band: #141413; --band-foreground: #f5f4ef; --band-muted: #a3a09a; --band-border: #2e2d2b; --band-accent: #d97757; --canvas: #e8e4d8; --canvas-foreground: #141413; --tint-1: #fbf1ec; --tint-2: #ebe9e0; --tint-3: #e7ecf3; --tint-4: #e9efe2; --artifact-surface: #ffffff; --artifact-eyebrow: #c96442; --artifact-callout: #fbf1ec; --artifact-table-head: #f4f2ec; } :root.dark[data-theme="ember"] { --background: #1f1e1d; --foreground: #f5f4ef; --heading: #f5f4ef; --card: #262624; --card-foreground: #f5f4ef; --popover: #30302e; --popover-foreground: #f5f4ef; --border: #3f3e3a; --input: #3f3e3a; --ring: #d97757; --muted: #30302e; --muted-foreground: #a3a09a; --primary: #d97757; --primary-foreground: #141413; --primary-text: #e8926f; --primary-glow: rgba(217, 119, 87, 0.3); --secondary: #393937; --secondary-foreground: #f5f4ef; --accent: #3a322e; --accent-foreground: #f5f4ef; --danger: #e06a5c; --danger-foreground: #141413; --danger-text: #f08a7e; --success: #7fae79; --success-foreground: #141413; --success-text: #9cc496; --warning: #d4a052; --warning-foreground: #141413; --warning-text: #e4b76e; --info: #30302e; --info-foreground: #f5f4ef; --info-border: #3f3e3a; --chart-1: #d97757; --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.3); --shadow-2: 0 4px 12px rgba(0, 0, 0, 0.4); --shadow-3: 0 10px 28px rgba(0, 0, 0, 0.5); --shadow-4: 0 26px 70px rgba(0, 0, 0, 0.6); --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.4); --gradient-hero: linear-gradient(135deg, #3a2f2a, #1f1e1d 60%, #262624); --gradient-subtle: linear-gradient(180deg, #262624, #1f1e1d); --sidebar: #262624; --sidebar-foreground: #f5f4ef; --sidebar-primary: #d97757; --sidebar-primary-foreground: #141413; --sidebar-accent: #30302e; --sidebar-accent-foreground: #f5f4ef; --sidebar-border: #3f3e3a; --band: #121211; --band-foreground: #f5f4ef; --band-muted: #a3a09a; --band-border: #2a2928; --band-accent: #d97757; --canvas: #33322f; --canvas-foreground: #f5f4ef; --tint-1: #3a2f2a; --tint-2: #393937; --tint-3: #2f3338; --tint-4: #303430; --artifact-surface: #2b2a28; --artifact-eyebrow: #d97757; --artifact-callout: #3a2f2a; --artifact-table-head: #33322f; }