/* * CC Global Theme Tokens * Change `data-cc-theme` on to switch palette quickly. * Theme references: * - cc-classic => "CC Classic" * - cc-carbon => "CC Carbon" * Mode references: * - dark => "CC Dark" * - light => "CC Paper Light" * Manifest: /cc-theme-manifest.json */ :root, html[data-cc-theme='cc-classic'] { --cc-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; --cc-font-display: "Outfit", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; --cc-font-mono: "Roboto Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --cc-primary: #ff9a2f; --cc-primary-rgb: 255, 154, 47; --cc-primary-hover-light: #ffad55; --cc-primary-hover-dark: #ffc074; --cc-success: #7ccf8a; --cc-success-rgb: 124, 207, 138; --cc-warning: #f2b25f; --cc-warning-rgb: 242, 178, 95; --cc-bg-dark: #14171d; --cc-bg-dark-soft: #1a1f27; --cc-card-dark: #212733; --cc-border-dark: #3c4657; --cc-paper: #f8eed8; --cc-paper-soft: #f4e8cd; --cc-paper-border: #e6d7b3; --cc-text-main: #1f2430; --cc-text-muted: #6b7280; --cc-text-body: #3b4350; --cc-text-subtle: #617082; --cc-text-bone: #2f1f09; --cc-text-bone-soft: #8a5b1a; --cc-bone-grad-light-start: #603b0b; --cc-bone-grad-light-mid: #8a5b1a; --cc-bone-grad-light-end: #3f2606; --cc-bone-grad-dark-start: #fff5df; --cc-bone-grad-dark-mid: #f5deb4; --cc-bone-grad-dark-end: #e7bc7b; } html[data-cc-theme='cc-carbon'] { --cc-primary: #f97316; --cc-primary-rgb: 249, 115, 22; --cc-primary-hover-light: #fb923c; --cc-primary-hover-dark: #fdba74; } html:not(.dark) { /* VSCode Bearded Theme - Milkshake Mango (light mode baseline) */ --cc-primary: #bd4f27; --cc-primary-rgb: 189, 79, 39; --cc-primary-hover: #cc6a46; --cc-primary-hover-light: #cc6a46; --cc-success: #008b17; --cc-success-rgb: 0, 139, 23; --cc-warning: #c08403; --cc-warning-rgb: 192, 132, 3; --cc-paper: #f3eae3; --cc-paper-soft: #f8f1ec; --cc-paper-border: #ddc8bb; --cc-text-main: #2f2521; --cc-text-muted: #7b6d65; --cc-text-body: #594b44; --cc-text-subtle: #6d5d55; --cc-text-bone: #4f2413; --cc-text-bone-soft: #925234; --cc-bone-grad-light-start: #8d3d20; --cc-bone-grad-light-mid: #b6552e; --cc-bone-grad-light-end: #7a3218; --cc-primary-hover: var(--cc-primary-hover-light); --cc-mode-id: light; --cc-surface-card: #f5ece5; --cc-home-bg-base: var(--cc-paper-soft); --cc-home-accent-rgb: var(--cc-primary-rgb); --cc-home-accent-alpha: 0.11; --cc-home-bg-mid-rgb: 201, 170, 150; --cc-home-bg-mid-alpha: 0.16; --cc-home-bg-end-rgb: 165, 129, 108; --cc-home-bg-end-alpha: 0.2; --cc-home-linear-start-rgb: 248, 241, 236; --cc-home-linear-start-alpha: 0.54; --cc-home-linear-end-rgb: 231, 214, 201; --cc-home-linear-end-alpha: 0.66; --cc-home-topmenu-bg: rgba(248, 241, 236, 0.92); --cc-home-topmenu-border: rgba(114, 82, 64, 0.16); --cc-home-icon-ring: rgba(141, 61, 32, 0.18); --cc-home-icon-shadow: rgba(141, 61, 32, 0.14); --cc-home-pill-disabled-border: rgba(107, 114, 128, 0.45); --cc-home-pill-disabled-color: rgba(107, 114, 128, 0.9); --cc-home-fee-surface: rgba(255, 255, 255, 0.68); --cc-home-fee-border: rgba(153, 108, 82, 0.22); --cc-home-token-icon-bg: rgba(255, 255, 255, 0.72); --cc-home-coming-item-bg: rgba(255, 255, 255, 0.56); --cc-home-coming-item-border: rgba(153, 108, 82, 0.2); --cc-bone-grad-active-start: var(--cc-bone-grad-light-start); --cc-bone-grad-active-mid: var(--cc-bone-grad-light-mid); --cc-bone-grad-active-end: var(--cc-bone-grad-light-end); } html.dark { --cc-primary-hover: var(--cc-primary-hover-dark); --cc-mode-id: dark; --cc-text-main: #f4ecd9; --cc-text-muted: #9ca6b3; --cc-text-body: #d7d0bf; --cc-text-subtle: #91a0b2; --cc-text-bone: #fff4de; --cc-text-bone-soft: #f6c987; --cc-surface-card: #1c232d; --cc-home-bg-base: var(--cc-bg-dark); --cc-home-accent-rgb: var(--cc-primary-rgb); --cc-home-accent-alpha: 0.13; --cc-home-bg-mid-rgb: 18, 23, 30; --cc-home-bg-mid-alpha: 0.54; --cc-home-bg-end-rgb: 13, 17, 23; --cc-home-bg-end-alpha: 0.9; --cc-home-linear-start-rgb: 22, 27, 35; --cc-home-linear-start-alpha: 0.72; --cc-home-linear-end-rgb: 13, 17, 23; --cc-home-linear-end-alpha: 0.92; --cc-home-topmenu-bg: rgba(20, 25, 33, 0.92); --cc-home-topmenu-border: rgba(156, 166, 179, 0.18); --cc-home-icon-ring: rgba(172, 182, 198, 0.14); --cc-home-icon-shadow: rgba(6, 8, 11, 0.55); --cc-home-pill-disabled-border: rgba(148, 163, 184, 0.45); --cc-home-pill-disabled-color: rgba(148, 163, 184, 0.9); --cc-home-fee-surface: rgba(27, 34, 44, 0.78); --cc-home-fee-border: rgba(145, 160, 178, 0.22); --cc-home-token-icon-bg: rgba(13, 17, 23, 0.45); --cc-home-coming-item-bg: rgba(255, 255, 255, 0.03); --cc-home-coming-item-border: rgba(145, 160, 178, 0.22); --cc-bone-grad-active-start: var(--cc-bone-grad-dark-start); --cc-bone-grad-active-mid: var(--cc-bone-grad-dark-mid); --cc-bone-grad-active-end: var(--cc-bone-grad-dark-end); }