/* Cognia dark palette. Load after tokens.css; set data-theme on . * Colour/blur/shadow tokens only. Names with numbers are legacy role names, * not promises about dark-mode percentages. See docs/design/dark-mode.md. * --white is the legacy solid SURFACE; use --on-brand for filled controls * and --ink for tooltip text. The prototype bridge demonstrates those splits. */ [data-theme="dark"] { color-scheme: dark; --brand: #FB651E; --paper: #171310; --border: #99816E; --ink: #F6EADF; --graphite: #C2B1A2; --acc: #FB651E; --regdot: #E7AD72; --brand-meta: #171310; --surface: #241E19; --surface-raised: #2B241F; --on-brand: #171310; --on-category: #171310; --label-ground: #171310; --theme-duration: 0ms; /* Small washes start from warm charcoal; strokes have an independent floor. */ --brand-06: color-mix(in srgb, var(--brand) 2%, var(--surface)); --brand-07: color-mix(in srgb, var(--brand) 3%, var(--surface)); --brand-08: color-mix(in srgb, var(--brand) 4%, var(--surface)); --brand-09: color-mix(in srgb, var(--brand) 5%, var(--surface)); --brand-10: color-mix(in srgb, var(--brand) 6%, var(--surface)); --brand-12: color-mix(in srgb, var(--brand) 7%, var(--surface)); --brand-14: color-mix(in srgb, var(--brand) 8%, var(--surface)); --brand-16: color-mix(in srgb, var(--brand) 10%, var(--surface)); --brand-20: #99816E; --brand-22: #A18770; --brand-24: #A98D72; --brand-30: #B99472; --brand-35: #C59B75; --brand-38: #D1A077; --brand-45: #DDA578; --brand-55: #EDA975; --brand-60: #F6AC76; --brand-88: #FF7C3D; /* Smoke glass: opacity is high enough to bound a white object behind it. */ --paper-62: rgb(36 30 25 / .94); --paper-66: rgb(36 30 25 / .96); --paper-70: rgb(36 30 25 / .97); --paper-72: rgb(36 30 25 / .97); --paper-78: rgb(36 30 25 / .98); --paper-93: rgb(36 30 25 / .985); --paper-94: rgb(36 30 25 / .99); --paper-95: rgb(36 30 25 / .99); --paper-97: rgb(36 30 25 / 1); --map-ocean: #241E19; --map-land: #3B291D; --map-land-alt: #422E20; --map-boundary: #C59B75; --map-label-text: #F6EADF; --map-label-halo: #171310; --map-sky: #171310; --map-horizon: #211A15; --map-fog: #241E19; --map-logo-opacity: .24; --map-dot-opacity: .96; --map-flow-base-opacity: .64; --map-flow-opacity: .90; --ind-b2b: #8FAEFF; --ind-consumer: #C9A0ED; --ind-fintech: #75CBA7; --ind-healthcare: #F28D86; --ind-industrials: #D8CCC0; --ind-realestate: #D4AD78; --ind-education: #78C7E8; --ind-government: #A2BCCB; --ind-unspecified: #BFB09C; --ind-fallback: #BFB09C; --ok: #75CBA7; --ok-alt: #87D3A5; --ok-text: #8AD9B1; --danger: #FF958D; --danger-strong: #FF8B82; --danger-text: #FFA69E; --invalid-mail: #F49A94; --invalid-form: #F9A29B; --key-founder: #FB651E; --key-company: #78C7E8; --key-uni: #C9A0ED; --key-industry: #8FAEFF; --key-location: #BFB09C; --key-batch: #75CBA7; --linkedin: #87BDF4; --white: #2B241F; --black: #100D0B; --divider-warm: #99816E; --img-placeholder: #302720; --tour-ink: #F6EADF; --tour-muted: #C2B1A2; --tour-skip: #C2B1A2; --tour-dot-off: #99816E; --pulse-default: #D8CCC0; --particle-crimson: #FF9566; --ink-tip: rgb(36 30 25 / .98); --ink-sctip: rgb(36 30 25 / .98); --scrim-modal: rgb(16 13 11 / .72); --scrim-tour: rgb(16 13 11 / .78); --scrim-hole: rgb(16 13 11 / .78); --scrim-mobile: rgb(16 13 11 / .72); --ini-ink: #F6EADF; --ini-1: #422B23; --ini-2: #332C45; --ini-3: #233748; --ini-4: #243D30; --ini-5: #433821; --ini-6: #422A34; --ini-7: #333A27; --ini-8: #223B3C; --ini-9: #3E2C3A; --ini-10: #2C3245; --ini-11: #432F22; --ini-12: #293B32; --glass-fill-50: rgb(43 36 31 / .96); --glass-fill-52: rgb(43 36 31 / .962); --glass-fill-55: rgb(43 36 31 / .965); --glass-fill-58: rgb(43 36 31 / .968); --glass-fill-60: rgb(43 36 31 / .97); --glass-fill-62: rgb(43 36 31 / .972); --glass-fill-66: rgb(43 36 31 / .976); --glass-fill-68: rgb(43 36 31 / .978); --glass-fill-72: rgb(43 36 31 / .98); --glass-fill-78: rgb(43 36 31 / .984); --glass-fill-85: rgb(43 36 31 / .988); --glass-fill-90: rgb(43 36 31 / .992); --glass-fill-92: rgb(43 36 31 / .996); --glass-edge-60: #99816E; --glass-edge-65: #A18770; --glass-edge-70: #A98D72; --glass-edge-75: #B1957D; --glass-edge-80: #B99E88; --glass-edge-85: #C2A892; --glass-edge-90: #CCB49F; --estw-gradient: linear-gradient(135deg, rgb(43 36 31 / .97), rgb(36 30 25 / .96)); /* All 15 recipes: preserve radius, remove chroma amplification on dark. */ --blur-xs: blur(3px); --blur-sm: blur(7px); --blur-8: blur(8px); --blur-card: blur(8px) saturate(1); --blur-10: blur(10px); --blur-md: blur(10px) saturate(1); --blur-kpi: blur(12px) saturate(1); --blur-tile: blur(12px) saturate(1); --blur-14: blur(14px); --blur-lg: blur(14px) saturate(1); --blur-panel: blur(18px) saturate(1); --blur-est: blur(18px) saturate(1); --blur-sidebar: blur(20px) saturate(1); --blur-detail: blur(22px) saturate(1); --blur-xl: blur(24px) saturate(1); --sh-ring-soft: 0 0 0 3px #99816E; --sh-ring-danger: 0 0 0 3px rgb(255 139 130 / .72); --sh-pulse: 0 0 0 2.5px #F6EADF, 0 1px 6px rgb(0 0 0 / .65); --sh-tour-hole: 0 0 0 9999px rgb(16 13 11 / .78); --sh-1: 0 2px 8px -3px rgb(0 0 0 / .55); --sh-1-tight: 0 3px 10px -8px rgb(0 0 0 / .55); --sh-1-card: 0 3px 10px -5px rgb(0 0 0 / .50); --sh-1-rzcard: 0 3px 10px -5px rgb(0 0 0 / .52); --sh-1-mag: 0 3px 10px -4px rgb(0 0 0 / .58); --sh-2: 0 4px 12px -6px rgb(0 0 0 / .60); --sh-2-badge: 0 4px 14px -4px rgb(0 0 0 / .65); --sh-2-search: 0 4px 14px -6px rgb(0 0 0 / .60); --sh-2-inset: 0 6px 18px -14px rgb(0 0 0 / .55); --sh-2-chart: 0 8px 24px -10px rgb(0 0 0 / .65); --sh-2-pill: 0 8px 22px -8px rgb(0 0 0 / .60); --sh-3-kpi: 0 10px 28px -18px rgb(0 0 0 / .55); --sh-3-btn: 0 10px 24px -12px rgb(0 0 0 / .65); --sh-3-tile: 0 10px 26px -12px rgb(0 0 0 / .65); --sh-3-reset: 0 10px 26px -14px rgb(0 0 0 / .65); --sh-3-brand: 0 12px 28px -10px rgb(0 0 0 / .65); --sh-3-tipop: 0 12px 30px -16px rgb(0 0 0 / .65); --sh-3-mofilter: 0 12px 34px -16px rgb(0 0 0 / .70); --sh-3-suggest: 0 14px 30px -12px rgb(0 0 0 / .65); --sh-4-dbsug: 0 16px 40px -16px rgb(0 0 0 / .70); --sh-4-chat: 0 16px 44px -20px rgb(0 0 0 / .70); --sh-4-est: 0 18px 42px -22px rgb(0 0 0 / .70), inset 0 1px 0 rgb(204 180 159 / .18); --sh-4-panel: 0 18px 46px -22px rgb(0 0 0 / .70); --sh-4-sidebar: 0 22px 55px -24px rgb(0 0 0 / .70); --sh-4-detail: 0 22px 55px -24px rgb(0 0 0 / .72); --sh-5-est-hover: 0 26px 60px -24px rgb(0 0 0 / .75), inset 0 1px 0 rgb(204 180 159 / .22); --sh-5-tour: 0 20px 60px -18px rgb(0 0 0 / .75); --sh-5-modal: 0 30px 80px -20px rgb(0 0 0 / .78); }