
:root {
  color-scheme: dark;
  --color-bg: #151B1F;
  --color-sidebar: #10151A;
  --color-surface: #20272D;
  --color-elevated: #262E35;
  --color-hover: rgba(255, 255, 255, .05);
  --color-active: rgba(255, 255, 255, .08);
  --color-border: rgba(255, 255, 255, .08);
  --color-border-strong: rgba(255, 255, 255, .13);
  --color-text: #F7F8F6;
  --color-action: #F7F8F6;
  --color-on-action: #0D1216;
  --color-text-secondary: #A7ABB3;
  --color-text-tertiary: #9DA2AC;
  --color-brand: #7ADBB4;
  --color-accent: #7ADBB4;
  --color-accent-text: #7ADBB4;
  --color-accent-hover: #95E4C5;
  --color-on-accent: #0D1216;
  --color-danger: #E59A96;
  --color-warning: #C3A16C;
  --color-accent-subtle: #1E3A31;
  --color-focus-border: #858585;
  --color-danger-fill: #AA403A;
  --color-on-danger: #FFFFFF;
  --shadow-overlay: 0 16px 48px rgba(0, 0, 0, .32);

  --font-ui: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-code: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  --text-body: 15px;
  --leading-body: 22px;
  --text-nav: 14px;
  --leading-nav: 20px;
  --text-secondary: 13px;
  --leading-secondary: 18px;
  --text-caption: 12px;
  --leading-caption: 16px;
  --text-message: 16px;
  --leading-message: 27px;
  --text-title: 36px;
  --leading-title: 43px;
  --text-modal: 20px;
  --leading-modal: 26px;
  --text-input: 16px;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-small: 8px;
  --radius-control: 12px;
  --radius-panel: 16px;
  --control-size: 44px;
  --appearance-option-min: 104px;
  --navigation-size: 44px;
  --icon-small: 16px;
  --icon-toolbar: 20px;
  --icon-action: 24px;
  --icon-stroke: 1.75;
  --icon-stroke-small: 2;     
  --icon-fill-opacity: 0;     
  --icon-brand: 28px;
  --icon-chevron-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 9.75 5 5 5-5'/%3E%3C/svg%3E");
  --motion-hover: 140ms;
  --motion-press: 120ms;
  --motion-popover: 180ms;
  --motion-modal: 200ms;
  --ease-ui: cubic-bezier(.2, .7, .2, 1);
  --press-scale: .98;
  --disabled-opacity: .5;

  
  --bg: var(--color-bg);
  --workspace: var(--color-bg);
  --paper: var(--color-bg);
  --sidebar: var(--color-sidebar);
  --panel: var(--color-surface);
  --surface: var(--color-surface);
  --surface-hover: var(--color-hover);
  --input: var(--color-surface);
  --text: var(--color-text);
  --ink: var(--color-text);
  --text-soft: var(--color-text);
  --muted: var(--color-text-secondary);
  --faint: var(--color-text-tertiary);
  --line: var(--color-border);
  --line-strong: var(--color-border-strong);
  --green: var(--color-accent);
  --accent: var(--color-accent);
  --green-strong: var(--color-accent-hover);
  --on-accent: var(--color-on-accent);
  --soft: var(--color-accent-subtle);
  --green-wash: color-mix(in srgb, var(--color-accent) 10%, transparent);
  --green-focus: color-mix(in srgb, var(--color-accent) 14%, transparent);
  --amber: var(--color-warning);
  --red: var(--color-danger);
  --shadow: var(--shadow-overlay);
  --fs-micro: var(--text-caption);
  --fs-small: var(--text-secondary);
  --fs-body: var(--text-body);
  --fs-lead: var(--text-modal);
  --fs-title: var(--text-title);

  font-family: var(--font-ui);
  font-synthesis: none;
}

:root[data-theme="light"] {
  color-scheme: light;
  --color-bg: #F7F8F6;
  --color-sidebar: #EDEFEC;
  --color-surface: #FFFFFF;
  --color-elevated: #FFFFFF;
  --color-hover: rgba(0, 0, 0, .04);
  --color-active: rgba(0, 0, 0, .07);
  --color-border: rgba(0, 0, 0, .10);
  --color-border-strong: rgba(0, 0, 0, .18);
  --color-text: #0D1216;
  --color-action: #0D1216;
  --color-on-action: #FFFFFF;
  --color-text-secondary: #626262;
  --color-text-tertiary: #6B6B6B;
  --color-brand: #16704F;
  --color-accent: #16704F;
  --color-accent-text: #125E43;
  --color-accent-hover: #125E43;
  --color-on-accent: #FFFFFF;
  --color-danger: #AA403A;
  --color-warning: #80602F;
  --color-accent-subtle: #E2F3EB;
  --color-focus-border: #808080;
  --shadow-overlay: 0 16px 48px rgba(0, 0, 0, .14);
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    color-scheme: light;
    --color-bg: #F7F8F6;
    --color-sidebar: #EDEFEC;
    --color-surface: #FFFFFF;
    --color-elevated: #FFFFFF;
    --color-hover: rgba(0, 0, 0, .04);
    --color-active: rgba(0, 0, 0, .07);
    --color-border: rgba(0, 0, 0, .10);
    --color-border-strong: rgba(0, 0, 0, .18);
    --color-text: #0D1216;
    --color-action: #0D1216;
    --color-on-action: #FFFFFF;
    --color-text-secondary: #626262;
    --color-text-tertiary: #6B6B6B;
    --color-brand: #16704F;
  --color-accent: #16704F;
    --color-accent-text: #125E43;
    --color-accent-hover: #125E43;
    --color-on-accent: #FFFFFF;
    --color-danger: #AA403A;
    --color-warning: #80602F;
    --color-accent-subtle: #E2F3EB;
    --color-focus-border: #808080;
    --shadow-overlay: 0 16px 48px rgba(0, 0, 0, .14);
  }
}


:root:not([data-palette="brand"]) {
  --color-bg: #1C1E21;
  --color-sidebar: #151719;
  --color-surface: #25282C;
  --color-elevated: #2B2E33;
  --color-text: #F5F5F5;
  --color-text-secondary: #B4B4B4;
  --color-text-tertiary: #A6A6A6;
  --color-action: #F5F5F5;
  --color-on-action: #1C1E21;
  --color-accent: #F5F5F5;
  --color-accent-text: #F5F5F5;
  --color-accent-hover: #FFFFFF;
  --color-on-accent: #1C1E21;
  --color-accent-subtle: #393939;
}
:root[data-theme="light"]:not([data-palette="brand"]) {
  --color-bg: #FFFFFF;
  --color-sidebar: #F7F7F7;
  --color-surface: #F4F4F4;
  --color-elevated: #FFFFFF;
  --color-text: #202020;
  --color-text-secondary: #5E5E5E;
  --color-text-tertiary: #6B6B6B;
  --color-action: #202020;
  --color-on-action: #FFFFFF;
  --color-accent: #202020;
  --color-accent-text: #202020;
  --color-accent-hover: #393939;
  --color-on-accent: #FFFFFF;
  --color-accent-subtle: #E8E8E8;
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]):not([data-palette="brand"]) {
  --color-bg: #FFFFFF;
  --color-sidebar: #F7F7F7;
  --color-surface: #F4F4F4;
  --color-elevated: #FFFFFF;
  --color-text: #202020;
  --color-text-secondary: #5E5E5E;
  --color-text-tertiary: #6B6B6B;
  --color-action: #202020;
  --color-on-action: #FFFFFF;
  --color-accent: #202020;
  --color-accent-text: #202020;
  --color-accent-hover: #393939;
  --color-on-accent: #FFFFFF;
  --color-accent-subtle: #E8E8E8;
  }
}
.brand-hero { --color-accent: var(--color-brand); }


:root {
  --space-half: 2px;          
  --radius-xs: 4px;           
  --radius-large: 20px;       
  --radius-pill: 999px;       
  --control-min: 32px;        
  --control-compact: 36px;    
  --row-height: 40px;         
  --row-settings: 52px;       
  --track-height: 4px;        
  --icon-mark: 20px;          
  --mark-tile: 32px;          
  --text-label: 14px;         
  --leading-label: 20px;
  --text-heading: 17px;       
  --leading-heading: 24px;
  --text-display: 28px;       
  --leading-display: 34px;

  
  --color-thumb: color-mix(in srgb, var(--color-elevated) 92%, #FFFFFF);
  
  --color-track: color-mix(in srgb, var(--color-text) 12%, transparent);
  --color-disabled-fill: color-mix(in srgb, var(--color-text) 10%, transparent);
  --color-on-disabled: var(--color-text-secondary);
  --color-success: #5FBF8A;
  --color-scrim: rgb(0 0 0 / .6);    
  --color-on-scrim: #FFFFFF;          
  
  --shadow-raised: 0 1px 2px rgba(0, 0, 0, .24);
  --shadow-popover: 0 0 0 1px var(--color-border), 0 12px 32px rgba(0, 0, 0, .32);
}
:root[data-theme="light"] {
  --color-success: #1D7A4A;
  --color-scrim: rgb(0 0 0 / .4);
  --shadow-raised: 0 1px 2px rgba(0, 0, 0, .08), 0 0 0 1px rgba(0, 0, 0, .04);
  --shadow-popover: 0 0 0 1px var(--color-border), 0 12px 32px rgba(0, 0, 0, .10);
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --color-success: #1D7A4A;
    --color-scrim: rgb(0 0 0 / .4);
    --shadow-raised: 0 1px 2px rgba(0, 0, 0, .08), 0 0 0 1px rgba(0, 0, 0, .04);
    --shadow-popover: 0 0 0 1px var(--color-border), 0 12px 32px rgba(0, 0, 0, .10);
  }
}

:root { --viz-1:#5B90CA; --viz-2:#BF8941; --viz-3:#37A69A; --viz-4:#5F6D80; }
:root[data-theme="light"] { --viz-1:#346BA6; --viz-2:#B77B29; --viz-3:#008879; --viz-4:#475366; }
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) { --viz-1:#346BA6; --viz-2:#B77B29; --viz-3:#008879; --viz-4:#475366; }
}

@media (max-width: 899px) {
  :root {
    
    --text-body: 17px;
    --leading-body: 24px;
    --text-nav: 16px;
    --leading-nav: 24px;
    --text-secondary: 14px;
    --leading-secondary: 20px;
    --text-caption: 14px;
    --leading-caption: 20px;
    --text-message: 16px;
    --leading-message: 26px;
    --text-section: 21px;
    --leading-section: 29px;
    --radius-bubble: 17px;
    --text-title: 30px;
    --leading-title: 36px;
    --navigation-size: 48px;
    --icon-toolbar: 20px;
  }
}


:root {
  
  --text-footnote: 12px;      
  --leading-footnote: 16px;
  --text-meta: 13px;          
  --leading-meta: 18px;
  --text-headline: 17px;      
  --leading-headline: 24px;
  --text-section: 22px;       
  --leading-section: 30px;
  --text-screen: 28px;        
  --leading-screen: 34px;
  --tracking-heading: -.02em; 
  
  --radius-composer: 30px;
  --radius-bubble: 18px;      
  --radius-sheet: 22px;       
  
  --dialog-width: 440px;
  --dialog-confirm-width: 400px;
  --dialog-close: 32px;
  --menu-item-height: 40px;
  --sheet-handle-width: 36px;
  --sheet-handle-height: 5px;
  
  --border-selected: 2px;     
  --text-notice: 15px;        
  --leading-notice: 22px;
  
  --color-bubble: var(--color-surface);         
  --color-knob: #FFFFFF;                        
  --color-viewer: rgb(8 8 8 / .97);             
  --color-on-viewer: #FFFFFF;
  --color-viewer-control: rgb(255 255 255 / .12);
  --color-viewer-control-hover: rgb(255 255 255 / .2);
  --color-media-stage: #101010;                 
  --shadow-drawer: 24px 0 48px rgb(0 0 0 / .18);
  --shadow-composer: 0 1px 2px rgb(0 0 0 / .06), 0 10px 30px rgb(0 0 0 / .10);
}

@media (max-width:899px) { :root { --text-notice: 16px; } }
:root[data-theme="light"] {
  --color-bubble: #ECEDEF;
  --shadow-composer: 0 2px 8px rgb(0 0 0 / .06);
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --color-bubble: #ECEDEF;
    --shadow-composer: 0 2px 8px rgb(0 0 0 / .06);
  }
}


* { box-sizing: border-box; }
body {
  margin: 0;
  color: var(--color-text);
  background: var(--color-bg);
  font-size: var(--text-body);
  line-height: var(--leading-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
button, input, textarea, select { color: inherit; font: inherit; }
:where(button, input, textarea, select, a, label, summary) { touch-action: manipulation; }
:where(button, .button, .quiet, .text-button, summary) {
  min-height: var(--control-size);
  min-width: var(--control-size);
}
:where(button, .button, .quiet, .text-button) {
  border-radius: var(--radius-control);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background var(--motion-hover) ease, color var(--motion-hover) ease,
    border-color var(--motion-hover) ease, transform var(--motion-press) ease;
}
button:active:not(:disabled) { transform: scale(var(--press-scale)); }
:where(button, input, textarea, select):disabled {
  opacity: var(--disabled-opacity);
  cursor: not-allowed;
}
:where(input, textarea, select) { font-size: var(--text-input); border-radius: var(--radius-control); }
:where(input, textarea)::placeholder { color: var(--color-text-tertiary); opacity: 1; }

:is(button, a, input, textarea, select, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

[tabindex="-1"]:focus-visible:not(input, textarea, select, button, a) { outline: none; }
:where(h1, h2, h3) { font-family: var(--font-display); font-weight: var(--weight-semibold); }
code, pre { font-family: var(--font-code); }
[hidden] { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  :root { --press-scale: 1; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation: none !important;
    transition: none !important;
  }
}


[data-brand="serpentai"] { --family-color:#D0EED2; }
:root[data-theme="light"] [data-brand="serpentai"] { --family-color:#285840; }
[data-brand="openai"] { --family-color:#E9E9E9; }
:root[data-theme="light"] [data-brand="openai"] { --family-color:#242424; }
[data-brand="anthropic"] { --family-color:#E3B49A; }
:root[data-theme="light"] [data-brand="anthropic"] { --family-color:#91492C; }
[data-brand="google"] { --family-color:#ADC4FF; }
:root[data-theme="light"] [data-brand="google"] { --family-color:#365FAD; }
[data-brand="xai"] { --family-color:#C8CCD4; }
:root[data-theme="light"] [data-brand="xai"] { --family-color:#465366; }
[data-brand="deepseek"] { --family-color:#96BFFF; }
:root[data-theme="light"] [data-brand="deepseek"] { --family-color:#285EA4; }
[data-brand="moonshot"] { --family-color:#B3BAFF; }
:root[data-theme="light"] [data-brand="moonshot"] { --family-color:#5145A4; }
[data-brand="zai"] { --family-color:#AECFD9; }
:root[data-theme="light"] [data-brand="zai"] { --family-color:#286370; }
[data-brand="bytedance"] { --family-color:#F0ACCA; }
:root[data-theme="light"] [data-brand="bytedance"] { --family-color:#91446C; }
[data-brand="kling"] { --family-color:#C1DF95; }
:root[data-theme="light"] [data-brand="kling"] { --family-color:#526D20; }
[data-brand="alibaba"] { --family-color:#FFC18D; }
:root[data-theme="light"] [data-brand="alibaba"] { --family-color:#985414; }
[data-brand="bfl"] { --family-color:#E3B2F0; }
:root[data-theme="light"] [data-brand="bfl"] { --family-color:#794292; }
[data-brand="midjourney"] { --family-color:#E6E6E6; }
:root[data-theme="light"] [data-brand="midjourney"] { --family-color:#1F1F1F; }
[data-brand="minimax"] { --family-color:#F7A1B8; }
:root[data-theme="light"] [data-brand="minimax"] { --family-color:#9B2F4E; }
[data-brand="qwen"] { --family-color:#BEB5FF; }
:root[data-theme="light"] [data-brand="qwen"] { --family-color:#563DB0; }
[data-brand="mistral"] { --family-color:#FFAA8C; }
:root[data-theme="light"] [data-brand="mistral"] { --family-color:#A33C12; }
[data-brand="neutral"] { --family-color:#BEC8CC; }
:root[data-theme="light"] [data-brand="neutral"] { --family-color:#4B606A; }
@media(prefers-color-scheme:light) {
  :root:not([data-theme="dark"]) [data-brand="serpentai"] { --family-color:#285840; }
  :root:not([data-theme="dark"]) [data-brand="openai"] { --family-color:#242424; }
  :root:not([data-theme="dark"]) [data-brand="anthropic"] { --family-color:#91492C; }
  :root:not([data-theme="dark"]) [data-brand="google"] { --family-color:#365FAD; }
  :root:not([data-theme="dark"]) [data-brand="xai"] { --family-color:#465366; }
  :root:not([data-theme="dark"]) [data-brand="deepseek"] { --family-color:#285EA4; }
  :root:not([data-theme="dark"]) [data-brand="moonshot"] { --family-color:#5145A4; }
  :root:not([data-theme="dark"]) [data-brand="zai"] { --family-color:#286370; }
  :root:not([data-theme="dark"]) [data-brand="bytedance"] { --family-color:#91446C; }
  :root:not([data-theme="dark"]) [data-brand="kling"] { --family-color:#526D20; }
  :root:not([data-theme="dark"]) [data-brand="alibaba"] { --family-color:#985414; }
  :root:not([data-theme="dark"]) [data-brand="bfl"] { --family-color:#794292; }
  :root:not([data-theme="dark"]) [data-brand="midjourney"] { --family-color:#1F1F1F; }
  :root:not([data-theme="dark"]) [data-brand="minimax"] { --family-color:#9B2F4E; }
  :root:not([data-theme="dark"]) [data-brand="qwen"] { --family-color:#563DB0; }
  :root:not([data-theme="dark"]) [data-brand="mistral"] { --family-color:#A33C12; }
  :root:not([data-theme="dark"]) [data-brand="neutral"] { --family-color:#4B606A; }
}


:root {
  --ease-spring: linear(0, 0.35 12%, 0.72 24%, 0.95 34%, 1.04 43%, 1.05 55%, 1.0 76%, 1);
  --dur-fast: 150ms;
  --dur-base: 250ms;
}
html {
  -webkit-tap-highlight-color: transparent;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
::selection { background: color-mix(in srgb, var(--color-accent) 30%, transparent); }
:where(button, .button, a.button, [role="button"], summary) {
  transition: scale var(--dur-fast) var(--ease-spring), opacity var(--dur-fast) ease,
    background-color var(--dur-fast) ease, border-color var(--dur-fast) ease, color var(--dur-fast) ease;
}
:where(button, .button, a.button, [role="button"]):active:not(:disabled):not([aria-disabled="true"]) { scale: .97; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}
:where(input, select, textarea) { caret-color: var(--color-accent); accent-color: var(--color-accent); }
@media (prefers-reduced-motion: reduce) {
  :where(button, .button, a.button, [role="button"], summary) { transition: none; }
  :where(button, .button, a.button, [role="button"]):active { scale: none; }
}


a.brand { display:inline-flex; align-items:center; gap:9px; min-height:44px; color:var(--color-text); text-decoration:none; font-size:22px; --brand-size:30px; }
.brand-glyph { display:block; flex:none; width:var(--brand-size,30px); height:var(--brand-size,30px); background:currentColor; mask:url('/snake.svg') center/contain no-repeat; -webkit-mask:url('/snake.svg') center/contain no-repeat; }
.brand-glyph img { width:100%; height:100%; object-fit:contain; opacity:0; }
.brand-name { display:inline-block; flex:none; height:.82em; width:4.09em; background:currentColor; mask:url('/wordmark.svg') left center/contain no-repeat; -webkit-mask:url('/wordmark.svg') left center/contain no-repeat; text-indent:-999em; overflow:hidden; white-space:nowrap; translate:0 11%; }

body.public-page .button { background:var(--color-action); color:var(--color-on-action); min-height:44px; }
body.public-page .button.secondary { background:var(--color-hover); color:var(--color-text); }
body.public-page nav a { display:inline-flex; align-items:center; min-height:44px; padding:8px 11px; background:var(--color-surface); }


:where(svg.ui-icon, svg.si) {
  width: var(--icon-toolbar);
  height: var(--icon-toolbar);
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: var(--icon-stroke);
  stroke-linecap: round;
  stroke-linejoin: round;
}
:where(button.active, button.is-selected, button[aria-pressed="true"],
  button[aria-current="page"], a[aria-current="page"], [role="radio"][aria-checked="true"]) {
  --icon-fill-opacity: .32;
}
:where(button.active, button.is-selected, button[aria-pressed="true"],
  button[aria-current="page"], a[aria-current="page"], [role="radio"][aria-checked="true"])
  :where(svg.ui-icon, svg.si) { color: var(--color-accent-text); }


:root[data-design="leaders"][data-theme="light"] {
  --color-bg: #F7F7F7;
  --color-sidebar: #EFEFEF;
  --color-surface: #FFFFFF;
  --shadow-composer: 0 1px 2px rgb(0 0 0 / .06), 0 8px 24px rgb(0 0 0 / .08);
}
@media (prefers-color-scheme: light) {
  :root[data-design="leaders"]:not([data-theme="dark"]) {
    --color-bg: #F7F7F7;
    --color-sidebar: #EFEFEF;
    --color-surface: #FFFFFF;
    --shadow-composer: 0 1px 2px rgb(0 0 0 / .06), 0 8px 24px rgb(0 0 0 / .08);
  }
}

:root[data-design="leaders"][data-theme="dark"] {
  --color-bg: #17191C;
  --color-sidebar: #121416;
  --color-border: rgba(255, 255, 255, .12);
  --shadow-composer: 0 1px 2px rgb(0 0 0 / .4), 0 8px 24px rgb(0 0 0 / .4);
}
@media (prefers-color-scheme: dark) {
  :root[data-design="leaders"]:not([data-theme="light"]) {
    --color-bg: #17191C;
    --color-sidebar: #121416;
    --color-border: rgba(255, 255, 255, .12);
    --shadow-composer: 0 1px 2px rgb(0 0 0 / .4), 0 8px 24px rgb(0 0 0 / .4);
  }
}

:root[data-design="leaders"] { --color-scrim: rgb(0 0 0 / .22); }

:root[data-design="leaders"] { --color-field: color-mix(in srgb, var(--color-text) 6%, transparent); }
:root[data-design="leaders"][data-theme="dark"] { --color-scrim: rgb(0 0 0 / .4); }
@media (prefers-color-scheme: dark) {
  :root[data-design="leaders"]:not([data-theme="light"]) { --color-scrim: rgb(0 0 0 / .4); }
}

@media (max-width: 899px) {
  :root[data-design="leaders"] {
    --leading-body: 26px;
    --leading-secondary: 21px;
    --leading-caption: 21px;
    --leading-message: 24px;
    --text-label: 14px;
    --leading-label: 21px;
    --text-heading: 17px;
    --leading-heading: 26px;
    --text-title: 28px;
    --leading-title: 34px;
  }
}

:root[data-design="leaders"] { --color-pick: color-mix(in srgb, var(--color-brand) 8%, var(--color-surface)); }
:root[data-design="leaders"][data-theme="dark"] { --color-pick: color-mix(in srgb, var(--color-brand) 14%, var(--color-surface)); }
@media (prefers-color-scheme: dark) {
  :root[data-design="leaders"]:not([data-theme="light"]) { --color-pick: color-mix(in srgb, var(--color-brand) 14%, var(--color-surface)); }
}

:root[data-design="leaders"] { --icon-chevron-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 9.75 5 5 5-5'/%3E%3C/svg%3E"); }

@font-face { font-family:"Onest"; src:url(/onest.woff2?v=22eaaea21f) format("woff2"); font-weight:400 700; font-style:normal; font-display:swap; }
:root[data-design="leaders"] {
  --font-ui: "Onest", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-display: "Onest", -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --tracking-heading: -.012em;
  --tracking-display: -.022em;
}

@media (min-width: 900px) { :root[data-design="leaders"] { --text-caption: 14px; --leading-caption: 20px; --text-secondary: 14px; --leading-secondary: 20px; --text-meta: 14px; --leading-meta: 20px; } }

:root[data-design="leaders"] { --color-text-tertiary: #8F8F8F; --color-brand-mark: #7ADBB4; }
:root[data-design="leaders"][data-theme="light"] { --color-text-secondary: #4D4D4D; --color-text-tertiary: #737373; --color-brand-mark: #29996C; }
@media (prefers-color-scheme: light) {
  :root[data-design="leaders"]:not([data-theme="dark"]) { --color-text-secondary: #4D4D4D; --color-text-tertiary: #737373; --color-brand-mark: #29996C; }
}

:root:root[data-design="leaders"] {
  --color-bg: #000000;
  --color-sidebar: #0D0D0D;
  --color-surface: #1D1D1F;
  --color-elevated: #2C2C2E;
  --color-border: rgba(255, 255, 255, .10);
  --color-border-strong: rgba(255, 255, 255, .18);
  --color-text: #F5F5F7;
  --color-text-secondary: #A1A1A6;
  --color-text-tertiary: #86868B;
  --color-action: #F5F5F7;
  --color-on-action: #000000;
  --color-accent: #F5F5F7;
  --color-accent-text: #F5F5F7;
  --color-accent-hover: #FFFFFF;
  --color-on-accent: #000000;
  --color-accent-subtle: #2C2C2E;
  --color-brand: #3CCB8C;
  --color-brand-mark: #3CCB8C;
  --color-cta: #3CCB8C;
  --color-cta-hover: #5AD6A0;
  --color-on-cta: #00170C;
  --font-ui: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --tracking-heading: -.012em;
  --tracking-display: -.018em;
}
:root[data-design="leaders"][data-theme="light"] {
  --color-bg: #FFFFFF;
  --color-sidebar: #F5F5F7;
  --color-surface: #FFFFFF;
  --color-elevated: #FFFFFF;
  --color-border: rgba(0, 0, 0, .08);
  --color-border-strong: rgba(0, 0, 0, .14);
  --color-text: #1D1D1F;
  --color-text-secondary: #6E6E73;
  --color-text-tertiary: #6E6E73;
  --color-action: #1D1D1F;
  --color-on-action: #FFFFFF;
  --color-accent: #1D1D1F;
  --color-accent-text: #1D1D1F;
  --color-accent-hover: #3A3A3C;
  --color-on-accent: #FFFFFF;
  --color-accent-subtle: #E8E8ED;
  --color-brand: #3CCB8C;
  --color-brand-mark: #3CCB8C;
  --color-cta: #3CCB8C;
  --color-cta-hover: #34B57D;
  --color-on-cta: #00170C;
}
@media (prefers-color-scheme: light) {
  :root[data-design="leaders"]:not([data-theme="dark"]) {
    --color-bg: #FFFFFF;
    --color-sidebar: #F5F5F7;
    --color-surface: #FFFFFF;
    --color-elevated: #FFFFFF;
    --color-border: rgba(0, 0, 0, .08);
    --color-border-strong: rgba(0, 0, 0, .14);
    --color-text: #1D1D1F;
    --color-text-secondary: #6E6E73;
    --color-text-tertiary: #6E6E73;
    --color-action: #1D1D1F;
    --color-on-action: #FFFFFF;
    --color-accent: #1D1D1F;
    --color-accent-text: #1D1D1F;
    --color-accent-hover: #3A3A3C;
    --color-on-accent: #FFFFFF;
    --color-accent-subtle: #E8E8ED;
    --color-brand: #3CCB8C;
    --color-brand-mark: #3CCB8C;
    --color-cta: #3CCB8C;
    --color-cta-hover: #34B57D;
    --color-on-cta: #00170C;
  }
}
