/* -----------------------------------------------------------------------------
 * vendored from https://brandeditor.test-demo.skyten.io/dist/skyten/skyten-organisms.css
 * on 2026-07-15T09:29:04Z
 * sha256(source)=49c662adef76 bytes=409391
 * transform:     src/assets/brand/skyten/narrow-scope.py
 * regenerate:    BE_EMAIL=... BE_PASSWORD=... scripts/vendor-brand-tokens.sh skyten
 * ----------------------------------------------------------------------------- */
/* SPLIT (STTS-2958): design tokens ONLY — render-blocking.
 * Component rules live in tokens-components.css, loaded async.
 * Generated by scripts/split-brand-tokens.py — do not hand-edit. */

:root {
  --text-h1-font-size: 60px;
  --text-h2-font-size: 48px;
  --text-h3-font-size: 40px;
  --text-h4-font-size: 32px;
  --text-h5-font-size: 24px;
  --text-h6-font-size: 20px;
}
:root {
  --color-foundations-black: #000000;
  --color-foundations-white: #ffffff;
  --color-foundations-transparent: transparent;
  --font-sans: 'Noto Sans', -apple-system, sans-serif;
  --font-mono: "Courier New", Courier, monospace;
  --brand-primary: #00A6F4;
  --brand-secondary: #0084D1;
  --brand-tertiary: #9AE600;
  --gradient: linear-gradient(to top, var(--brand-primary), var(--brand-secondary));
  --gradient-card: linear-gradient(135deg, #4ebbfb 0%, #33b0f8 25%, #304565 65%, #54657e 100%);
  --radius-xs: 4px;
  --radius-s: 6px;
  --radius-m: 8px;
  --radius-l: 20px;
  --radius-xl: 20px;
  --radius-pill: 30px;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --container-max: 1280px;
  --nav-rail-width: 74px;
  --topbar-height: 66px;
  --page-grid-gap: 18px;
  --page-margin-x: var(--space-lg);
  --page-grid-row: 30px;
  --crm-topbar-bg: #e6e7ea;
  --crm-topbar-fg: var(--text-primary);
  --background-primary: #FFFFFE;
  --background-secondary: #FAFAF9;
  --text-primary: #171717;
  --text-tertiary: color-mix(in srgb, var(--text-primary) 40%, transparent);
  --border-primary: #E5E5E4;
  --border-secondary: #F5F5F4;
  --color-primary: var(--brand-primary);
  --color-secondary: var(--brand-secondary);
  --tertiary: var(--brand-tertiary);
  --highlight: var(--brand-tertiary);
  --border-width-hairline: 0.5px;
  --focus-outline-offset: 2px;
  --focus-outline-offset-loose: 3px;
  --focus-outline-primary: 2px solid color-mix(in srgb, var(--brand-primary) 55%, transparent);
  --focus-ring-gradient-button: 0 0 0 3px color-mix(in srgb, var(--brand-primary) 45%, transparent);
  --shadow-inset-well: inset -1px -20px 10px rgba(0, 0, 0, 0.05), inset 1px 3px 6px rgba(255, 255, 255, 0.1);
  --shadow-inset-pressed: inset -0.95px -19px 9.5px rgba(0, 0, 0, 0.15), inset 0.95px 2.85px 5.7px rgba(255, 255, 255, 0.1);
  --shadow-active-secondary: var(--shadow-inset-well);
  --shadow-primary: 0 2px 4px rgba(0, 0, 0, 0.04), 0 1px 2px -1px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.06), inset 0 -1px 0.25px rgba(255, 255, 255, 0.2), inset 0 1px 0.25px rgba(255, 255, 255, 0.2);
  --button-gradient-gap: 12px;
  --button-gradient-line-height: 18px;
  --button-gradient-padding: 14px 28px 16px;
  --button-gradient-padding-sm: 8px 12px;
  --button-padding: 14px 28px 16px;
  --button-font-size: 16px;
  --button-line-height: 18px;
  --button-gap: 12px;
  --button-padding-sm: 8px 12px;
  --button-font-size-sm: 14px;
  --button-line-height-sm: 18px;
  --button-gap-sm: 12px;
  --text-h7-font-size: 16px;
  --text-h7-font-weight: 500;
  --text-h7-letter-spacing: 0;
  --text-h7-line-height: 24px;
  --text-h8-font-size: 14px;
  --text-h8-font-weight: 500;
  --text-h8-letter-spacing: 0;
  --text-h8-line-height: 20px;
  --text-caption-font-size: 12px;
  --text-caption-font-weight: 500;
  --text-caption-letter-spacing: 0;
  --text-caption-line-height: 20px;
  --text-p-sm-font-size: 14px;
  --text-p-sm-font-weight: 400;
  --text-p-sm-letter-spacing: 0;
  --text-p-sm-line-height: 24px;
  --gradient-accent-from: #7c86ff;
  --surface-inverse-deep: #0f172b;
  --gradient-accent-to: #46ecd5;
  --brand-primary-w25: color-mix(in srgb, var(--brand-primary) 75%, white);
  --brand-primary-w50: color-mix(in srgb, var(--brand-primary) 50%, white);
  --brand-primary-w75: color-mix(in srgb, var(--brand-primary) 25%, white);
  --brand-primary-b25: color-mix(in srgb, var(--brand-primary) 75%, black);
  --brand-primary-b50: color-mix(in srgb, var(--brand-primary) 50%, black);
  --brand-secondary-w25: color-mix(in srgb, var(--brand-secondary) 75%, white);
  --brand-secondary-w50: color-mix(in srgb, var(--brand-secondary) 50%, white);
  --brand-secondary-b25: color-mix(in srgb, var(--brand-secondary) 75%, black);
  --brand-tertiary-w25: color-mix(in srgb, var(--brand-tertiary) 75%, white);
  --brand-tertiary-w50: color-mix(in srgb, var(--brand-tertiary) 50%, white);
  --brand-tertiary-b25: color-mix(in srgb, var(--brand-tertiary) 75%, black);
}
:root {
  --text-doc-h1-font-size: calc(var(--text-h1-font-size, 60px) * 0.5);
  --text-doc-h1-line-height: calc(var(--text-h1-line-height, 72px) * 0.5);
  --text-doc-h1-font-weight: var(--text-h1-font-weight, 700);
  --text-doc-h1-letter-spacing: var(--text-h1-letter-spacing, -0.02em);
  --text-doc-h2-font-size: calc(var(--text-h2-font-size, 48px) * 0.5);
  --text-doc-h2-line-height: calc(var(--text-h2-line-height, 64px) * 0.5);
  --text-doc-h2-font-weight: var(--text-h2-font-weight, 700);
  --text-doc-h2-letter-spacing: var(--text-h2-letter-spacing, -0.01em);
  --text-doc-h3-font-size: calc(var(--text-h3-font-size, 40px) * 0.5);
  --text-doc-h3-line-height: calc(var(--text-h3-line-height, 52px) * 0.5);
  --text-doc-h3-font-weight: var(--text-h3-font-weight, 700);
  --text-doc-h3-letter-spacing: var(--text-h3-letter-spacing, -0.01em);
  --text-doc-h4-font-size: calc(var(--text-h4-font-size, 32px) * 0.5);
  --text-doc-h4-line-height: calc(var(--text-h4-line-height, 40px) * 0.5);
  --text-doc-h4-font-weight: var(--text-h4-font-weight, 700);
  --text-doc-h4-letter-spacing: var(--text-h4-letter-spacing, -0.01em);
  --text-doc-h5-font-size: calc(var(--text-h5-font-size, 24px) * 0.5);
  --text-doc-h5-line-height: calc(var(--text-h5-line-height, 32px) * 0.5);
  --text-doc-h5-font-weight: var(--text-h5-font-weight, 600);
  --text-doc-h5-letter-spacing: var(--text-h5-letter-spacing, 0);
  --text-doc-h6-font-size: calc(var(--text-h6-font-size, 20px) * 0.5);
  --text-doc-h6-line-height: calc(var(--text-h6-line-height, 28px) * 0.5);
  --text-doc-h6-font-weight: var(--text-h6-font-weight, 600);
  --text-doc-h6-letter-spacing: var(--text-h6-letter-spacing, 0);
  --text-doc-h7-font-size: calc(var(--text-h7-font-size, 16px) * 0.5);
  --text-doc-h7-line-height: calc(var(--text-h7-line-height, 24px) * 0.5);
  --text-doc-h7-font-weight: var(--text-h7-font-weight, 500);
  --text-doc-h7-letter-spacing: var(--text-h7-letter-spacing, 0);
  --text-doc-h8-font-size: calc(var(--text-h8-font-size, 14px) * 0.5);
  --text-doc-h8-line-height: calc(var(--text-h8-line-height, 20px) * 0.5);
  --text-doc-h8-font-weight: var(--text-h8-font-weight, 500);
  --text-doc-h8-letter-spacing: var(--text-h8-letter-spacing, 0);
  --text-doc-p-font-size: calc(var(--text-p-font-size, 16px) * 0.5);
  --text-doc-p-line-height: calc(var(--text-p-line-height, 28px) * 0.5);
  --text-doc-p-font-weight: var(--text-p-font-weight, 400);
  --text-doc-p-letter-spacing: var(--text-p-letter-spacing, 0);
  --text-doc-p-large-font-size: calc(var(--text-p-large-font-size, 20px) * 0.5);
  --text-doc-p-large-line-height: calc(var(--text-p-large-line-height, 32px) * 0.5);
  --text-doc-p-large-font-weight: var(--text-p-large-font-weight, 400);
  --text-doc-p-large-letter-spacing: var(--text-p-large-letter-spacing, 0);
  --text-doc-p-sm-font-size: calc(var(--text-p-sm-font-size, 14px) * 0.5);
  --text-doc-p-sm-line-height: calc(var(--text-p-sm-line-height, 24px) * 0.5);
  --text-doc-p-sm-font-weight: var(--text-p-sm-font-weight, 400);
  --text-doc-p-sm-letter-spacing: var(--text-p-sm-letter-spacing, 0);
  --text-doc-caption-font-size: calc(var(--text-caption-font-size, 12px) * 0.5);
  --text-doc-caption-line-height: calc(var(--text-caption-line-height, 20px) * 0.5);
  --text-doc-caption-font-weight: var(--text-caption-font-weight, 500);
  --text-doc-caption-letter-spacing: var(--text-caption-letter-spacing, 0);
  --text-doc-p-strong-font-size: calc(var(--text-p-font-size, 16px) * 0.5);
  --text-doc-p-strong-line-height: calc(var(--text-p-line-height, 28px) * 0.5);
  --text-doc-p-strong-font-weight: 600;
  --text-doc-p-strong-letter-spacing: var(--text-p-letter-spacing, 0);
  --text-doc-micro-font-size: calc(var(--text-h8-font-size, 14px) * 0.5);
  --text-doc-micro-line-height: calc(var(--text-h8-line-height, 20px) * 0.5);
  --text-doc-micro-font-weight: var(--text-h8-font-weight, 500);
  --text-doc-micro-letter-spacing: var(--text-h8-letter-spacing, 0);
  --text-doc-fine-font-size: calc(var(--text-p-sm-font-size, 14px) * 0.5);
  --text-doc-fine-line-height: calc(var(--text-p-sm-line-height, 24px) * 0.5);
  --text-doc-fine-font-weight: var(--text-p-sm-font-weight, 400);
  --text-doc-fine-letter-spacing: var(--text-p-sm-letter-spacing, 0);
}
:root {
  --background-hover: color-mix(in srgb, var(--text-primary) 5%, var(--background-primary));
  --background-hover-brand: color-mix(in srgb, var(--brand-primary) 8%, transparent);
  --background-input: color-mix(in srgb, var(--border-primary) 22%, var(--background-secondary));
  --background-input-search: var(--background-input);
  --border-active: var(--brand-primary);
  --border-error: #c10007;
  --border-hover: color-mix(in srgb, var(--text-primary) 10%, var(--border-primary));
  --border-input-active: var(--brand-primary);
  --border-input-hover: var(--brand-primary);
  --border-modal: transparent;
  --border-width-active: 2px;
  --border-width-primary: 1px;
  --button-background-active: var(--brand-primary);
  --button-background-disabled: color-mix(in srgb, var(--border-secondary) 65%, var(--background-secondary));
  --button-background-error: #ffe2e2;
  --button-background-error-active: #e7000b;
  --button-background-long-order: #d0fae5;
  --button-background-long-position: #a4f4cf;
  --button-background-primary: color-mix(in srgb, var(--border-primary) 40%, var(--background-secondary));
  --button-background-short-long-inactive: color-mix(in srgb, var(--border-primary) 30%, var(--background-primary));
  --button-background-short-order: #ffc9c9;
  --button-background-short-position: #ffa2a2;
  --button-border-active-bottom: transparent;
  --button-border-disabled: var(--border-primary);
  --button-border-error: #c8000a;
  --button-border-long-bottom: #059669;
  --button-border-primary: var(--border-primary);
  --button-border-short-bottom: #dc2626;
  --button-text-active: #ffffff;
  --button-text-disabled: color-mix(in srgb, var(--text-primary) 38%, var(--border-primary));
  --button-text-error: #991b1b;
  --button-text-investment-short: var(--text-primary);
  --button-text-long-active: #065f46;
  --button-text-long-order: #065f46;
  --button-text-primary: var(--text-primary);
  --button-text-short-active: #b91c1c;
  --button-text-short-long-inactive: #78716c;
  --button-text-short-order: #b91c1c;
  --chart-01: #111827;
  --chart-02: #1f2937;
  --chart-03: #374151;
  --chart-04: #4b5563;
  --chart-05: #6b7280;
  --chart-06: #9ca3af;
  --chart-07: #cbd5e1;
  --chart-08: #94a3b8;
  --chart-09: #64748b;
  --line-chart-series-1: var(--chart-01);
  --line-chart-series-2: var(--chart-02);
  --line-chart-series-3: var(--chart-03);
  --line-chart-series-4: var(--chart-04);
  --line-chart-series-5: var(--chart-05);
  --line-chart-series-6: var(--chart-06);
  --functional-background-inverse: #0f172a;
  --functional-error-background: #fef2f2;
  --functional-error-default: #dc2626;
  --functional-error-text: #991b1b;
  --functional-highlight: #64748b;
  --functional-info-background: #dbeafe;
  --functional-info-default: #2563eb;
  --functional-info-text: #1e40af;
  --functional-link: #1d4ed8;
  --functional-primary: var(--brand-primary);
  --functional-secondary: var(--brand-secondary);
  --table-header-background: var(--functional-primary);
  --table-header-text: #ffffff;
  --table-header-weight: 700;
  --functional-success-background: #d1fae5;
  --functional-success-default: #059669;
  --functional-success-text: #065f46;
  --functional-tertiary: #475569;
  --functional-text-inverse: #ffffff;
  --functional-warning-background: #fef3c7;
  --functional-warning-default: #d97706;
  --functional-warning-text: #92400e;
  --icon-primary: var(--brand-primary);
  --icon-disabled: var(--button-text-disabled);
  --login-sky-glow: color-mix(in srgb, var(--brand-primary) 50%, #ffffff);
  --login-sky-mid: var(--brand-primary);
  --login-sky-deep: color-mix(in srgb, var(--brand-primary) 45%, #000000);
  --login-sky-horizon: color-mix(in srgb, var(--login-sky-glow) 55%, var(--login-sky-deep));
  --login-sky-zenith: color-mix(in srgb, var(--login-sky-mid) 45%, var(--login-sky-deep));
  --login-card-bg: color-mix(in srgb, var(--background-secondary) 98%, transparent);
  --login-card-shadow:
    0 0 0 1px color-mix(in srgb, var(--background-secondary) 40%, transparent),
    0 30px 80px color-mix(in srgb, var(--login-sky-deep) 35%, transparent),
    0 8px 24px color-mix(in srgb, var(--login-sky-deep) 20%, transparent);
  --text-active: var(--brand-primary);
  --text-active-secondary: var(--brand-secondary);
  --text-secondary: color-mix(in srgb, var(--text-primary) 50%, #6b7280);
  --text-tertiary-muted: color-mix(in srgb, var(--text-tertiary) 72%, #9ca3af);
  --universal-error: #c10007;
  --universal-error-default: #c8000a;
  --universal-disabled: color-mix(in srgb, var(--text-primary) 35%, var(--border-primary));
  --universal-negative-signal: #ef4444;
  --universal-positive-signal: #10b981;
  --shadow-filters-popup:
    0 2px 4px rgb(0 0 0 / 0.04),
    0 1px 2px -1px rgb(0 0 0 / 0.06),
    0 0 0 1px rgb(0 0 0 / 0.06),
    inset 0 -1px 0.25px rgb(255 255 255 / 0.2),
    inset 0 1px 0.25px rgb(255 255 255 / 0.2);
}
:root[data-theme=dark] {
  --background-hover: color-mix(in srgb, #ffffff 8%, var(--background-primary));
  --background-hover-brand: color-mix(in srgb, var(--brand-primary) 8%, transparent);
  --background-input: color-mix(in srgb, #ffffff 5%, var(--background-primary));
  --background-input-search: var(--background-input);
  --border-active: var(--brand-primary);
  --border-error: #f87171;
  --border-hover: color-mix(in srgb, #ffffff 12%, var(--border-primary));
  --border-input-active: var(--brand-primary);
  --border-input-hover: var(--brand-secondary);
  --border-modal: transparent;
  --border-width-active: 2px;
  --border-width-primary: 1px;
  --button-background-active: var(--brand-primary);
  --button-background-disabled: color-mix(in srgb, #ffffff 4%, var(--background-primary));
  --button-background-error: #450a0a;
  --button-background-error-active: #b91c1c;
  --button-background-long-order: #064e3b;
  --button-background-long-position: #065f46;
  --button-background-primary: color-mix(in srgb, #ffffff 8%, var(--background-primary));
  --button-background-short-long-inactive: color-mix(in srgb, #ffffff 6%, var(--background-primary));
  --button-background-short-order: #7f1d1d;
  --button-background-short-position: #991b1b;
  --button-border-active-bottom: transparent;
  --button-border-disabled: var(--border-primary);
  --button-border-error: #f87171;
  --button-border-long-bottom: #34d399;
  --button-border-primary: var(--border-primary);
  --button-border-short-bottom: #f87171;
  --button-text-active: #ffffff;
  --button-text-disabled: color-mix(in srgb, var(--text-primary) 45%, #71717a);
  --button-text-error: #fecaca;
  --button-text-investment-short: var(--text-primary);
  --button-text-long-active: #a7f3d0;
  --button-text-long-order: #a7f3d0;
  --button-text-primary: var(--text-primary);
  --button-text-short-active: #fecaca;
  --button-text-short-long-inactive: #a1a1aa;
  --button-text-short-order: #fecaca;
  --chart-01: #f9fafb;
  --chart-02: #e5e7eb;
  --chart-03: #d1d5db;
  --chart-04: #9ca3af;
  --chart-05: #6b7280;
  --chart-06: #4b5563;
  --chart-07: #64748b;
  --chart-08: #94a3b8;
  --chart-09: #cbd5e1;
  --line-chart-series-1: var(--chart-01);
  --line-chart-series-2: var(--chart-02);
  --line-chart-series-3: var(--chart-03);
  --line-chart-series-4: var(--chart-04);
  --line-chart-series-5: var(--chart-05);
  --line-chart-series-6: var(--chart-06);
  --functional-background-inverse: #f8fafc;
  --functional-error-background: #450a0a;
  --functional-error-default: #f87171;
  --functional-error-text: #fecaca;
  --functional-highlight: #94a3b8;
  --functional-info-background: #172554;
  --functional-info-default: #60a5fa;
  --functional-info-text: #bfdbfe;
  --functional-link: #60a5fa;
  --functional-primary: var(--brand-primary);
  --functional-secondary: var(--brand-secondary);
  --table-header-background: var(--functional-primary);
  --table-header-text: #ffffff;
  --table-header-weight: 700;
  --functional-success-background: #052e16;
  --functional-success-default: #34d399;
  --functional-success-text: #a7f3d0;
  --functional-tertiary: #94a3b8;
  --functional-text-inverse: #0f172a;
  --functional-warning-background: #422006;
  --functional-warning-default: #fbbf24;
  --functional-warning-text: #fef3c7;
  --icon-primary: var(--brand-primary);
  --icon-disabled: var(--button-text-disabled);
  --text-active: var(--brand-primary);
  --text-active-secondary: var(--brand-secondary);
  --text-secondary: color-mix(in srgb, var(--text-primary) 65%, #a1a1aa);
  --text-tertiary-muted: color-mix(in srgb, var(--text-tertiary) 55%, #71717a);
  --universal-error: #f87171;
  --universal-error-default: #fb7185;
  --universal-disabled: #71717a;
  --universal-negative-signal: #fb7185;
  --universal-positive-signal: #34d399;
  --shadow-filters-popup:
    0 2px 8px rgb(0 0 0 / 0.5),
    0 1px 2px -1px rgb(0 0 0 / 0.4),
    0 0 0 1px rgb(255 255 255 / 0.08),
    inset 0 -1px 0.25px rgb(255 255 255 / 0.04),
    inset 0 1px 0.25px rgb(255 255 255 / 0.06);
}
:root {
  --highlight-secondary: #FF6B00;
  --bg-page: #E9E9E9;
  --bg-surface: var(--color-foundations-white);
  --bg-hover: #F9F9F9;
  --login-sky-glow: #5FA1E8;
  --login-sky-mid: #2868C2;
  --login-sky-deep: #103A86;
  --login-sky-horizon: #4584B4;
  --login-sky-zenith: #1F4778;
  --background-primary: var(--bg-page);
  --background-secondary: var(--color-foundations-white);
  --background-input: var(--color-foundations-white);
  --background-hover: var(--bg-hover);
  --background-input-search: var(--color-foundations-white);
  --text-primary: #2D2C31;
  --text-secondary: var(--neutral-30);
  --text-tertiary-muted: #D4D4D4;
  --text-active: var(--neutral-50);
  --text-active-secondary: var(--secondary-50);
  --border-primary: var(--neutral-20);
  --border-subtle: #DBE6F0;
  --border-secondary: #D9D9D9;
  --border-active: var(--neutral-50);
  --border-input-active: var(--secondary-50);
  --input-border-active: var(--tertiary);
  --border-input-hover: var(--neutral-30);
  --border-hover: var(--info-40);
  --border-error: var(--error-60);
  --border-modal: var(--color-foundations-transparent);
  --border-width-primary: 1;
  --border-width-active: 2;
  --button-background-primary: var(--neutral-10);
  --button-background-active: var(--neutral-50);
  --button-background-hover: var(--tertiary-50);
  --button-background-active-hover: var(--info-40);
  --button-background-long-order: var(--neutral-50);
  --button-background-long-position: var(--primary-10);
  --button-background-short-order: var(--color-foundations-transparent);
  --button-background-short-position: var(--error-10);
  --button-background-short-long-inactive: #F3F1F3;
  --button-background-error: var(--error-10);
  --button-background-error-active: var(--error-60);
  --button-background-disabled: var(--neutral-10);
  --button-text-primary: var(--neutral-60);
  --button-text-active: var(--info-40);
  --button-text-hover: var(--neutral-60);
  --button-text-active-hover: var(--neutral-60);
  --button-text-long-order: var(--info-40);
  --button-text-long-active: var(--info-60);
  --button-text-short-order: var(--neutral-10);
  --button-text-short-active: var(--error-60);
  --button-text-short-long-inactive: #A89EA9;
  --button-text-investment-short: #0F172B;
  --button-text-error: var(--error-60);
  --button-text-error-active: var(--neutral-10);
  --button-text-disabled: var(--neutral-20);
  --button-border-primary: var(--neutral-20);
  --button-border-long-bottom: var(--color-foundations-transparent);
  --button-border-short-bottom: var(--color-foundations-transparent);
  --button-border-active-bottom: var(--color-foundations-transparent);
  --button-border-error: var(--error-60);
  --button-border-disabled: var(--neutral-10);
  --button-radius: var(--radius-pill);
  --icon-primary: var(--info-40);
  --universal-disabled: var(--neutral-20);
  --universal-positive-signal: var(--success-60);
  --universal-negative-signal: var(--error-60);
  --universal-error: var(--error-60);
  --functional-link: #1056CC;
  --functional-default: #1056CC;
  --functional-text-inverted: var(--neutral-10);
  --functional-background-inverted: #000000;
  --functional-success-default: #21AD36;
  --functional-success-background: #E8F8EB;
  --functional-success-text: #21AD36;
  --functional-warning-default: #92640A;
  --functional-warning-background: #FFF8E0;
  --functional-warning-text: #92640A;
  --functional-error-default: #DF3D42;
  --functional-error-background: #F6E9E9;
  --functional-error-text: #DF3D42;
  --functional-info-default: #0090C9;
  --functional-info-background: #E0F6FF;
  --table-header-background: transparent;
  --table-header-text: var(--text-primary);
  --table-header-weight: 600;
  --functional-info-text: #0090C9;
  --chart-01: var(--info-40);
  --chart-03: var(--neutral-50);
  --chart-04: #FF6900;
  --chart-05: var(--secondary-50);
  --chart-06: #00BC7D;
  --chart-07: #FFBA00;
  --chart-08: #E7000B;
  --chart-09: #FFA1AD;
}
:root[data-theme=dark] {
  --highlight-secondary: #FF6B00;
  --bg-page: #02060D;
  --bg-surface: #0F172B;
  --background-primary: #171717;
  --background-secondary: #1E2939;
  --background-input: #1D293D;
  --background-hover: #1D293D;
  --background-input-search: #1D293D;
  --text-primary: #F8FAFC;
  --text-secondary: #D4D4D4;
  --text-tertiary-muted: #6A7282;
  --text-active: var(--info-60);
  --text-active-secondary: var(--info-40);
  --border-primary: #364153;
  --border-subtle: #0F1924;
  --border-secondary: #0F1924;
  --border-active: var(--info-60);
  --border-input-active: var(--info-60);
  --input-border-active: var(--tertiary);
  --border-input-hover: var(--neutral-30);
  --border-hover: var(--info-40);
  --border-error: var(--error-60);
  --border-modal: rgba(255,0,0,0);
  --border-width-primary: 1;
  --border-width-active: 2;
  --button-background-primary: #314158;
  --button-background-active: var(--info-40);
  --button-background-hover: var(--tertiary-50);
  --button-background-active-hover: var(--info-40);
  --button-radius: var(--radius-pill);
  --button-background-long-order: #004F3B;
  --button-background-long-position: #004F3B;
  --button-background-short-order: #460809;
  --button-background-short-position: #460809;
  --button-background-short-long-inactive: #1D293D;
  --button-background-error: #460809;
  --button-background-error-active: #C10007;
  --button-background-disabled: #111827;
  --button-text-primary: #FAFAFA;
  --button-text-active: var(--neutral-10);
  --button-text-hover: var(--neutral-60);
  --button-text-active-hover: var(--neutral-60);
  --button-text-long-order: #5EE9B5;
  --button-text-long-active: #5EE9B5;
  --button-text-short-order: #FF6467;
  --button-text-short-active: #FF6467;
  --button-text-short-long-inactive: #45556C;
  --button-text-investment-short: #FAFAFA;
  --button-text-error: #C10007;
  --button-text-error-active: #C10007;
  --button-text-disabled: #525252;
  --button-border-primary: #314158;
  --button-border-long-bottom: #5EE9B5;
  --button-border-short-bottom: #FF6467;
  --button-border-active-bottom: rgba(255,0,0,0);
  --button-border-error: #FF6467;
  --button-border-disabled: #525252;
  --icon-primary: var(--info-40);
  --universal-disabled: #525252;
  --universal-positive-signal: #5EE9B5;
  --universal-negative-signal: #FF6467;
  --universal-error: #FF6467;
  --functional-link: #1056CC;
  --functional-default: #2B8FFF;
  --functional-text-inverted: #000000;
  --functional-background-inverted: var(--neutral-10);
  --functional-success-default: #21AD36;
  --functional-success-background: #0A2E10;
  --functional-success-text: #5DD970;
  --functional-warning-default: #E8A000;
  --functional-warning-background: #2E1F00;
  --functional-warning-text: #FFC940;
  --functional-error-default: #DF3D42;
  --functional-error-background: #3A0A0B;
  --functional-error-text: #F08084;
  --functional-info-default: #49BAE4;
  --functional-info-background: #0A1E2E;
  --table-header-background: transparent;
  --table-header-text: var(--text-primary);
  --table-header-weight: 600;
  --functional-info-text: #80D1EE;
  --chart-01: #615FFF;
  --chart-02: #00D5BE;
  --chart-03: #8E51FF;
  --chart-04: #FF6900;
  --chart-05: #00A6F4;
  --chart-06: #5EA500;
  --chart-07: #FCC800;
  --chart-08: #EC4899;
  --chart-09: #FFA1AD;
}
:root {
  --primary-10: color-mix(in srgb, var(--brand-primary) 12%, white);
  --primary-20: color-mix(in srgb, var(--brand-primary) 24%, white);
  --primary-30: color-mix(in srgb, var(--brand-primary) 42%, white);
  --primary-40: color-mix(in srgb, var(--brand-primary) 62%, white);
  --primary-50: color-mix(in srgb, var(--brand-primary) 82%, white);
  --primary-60: var(--brand-primary);
  --primary-70: color-mix(in srgb, var(--brand-primary) 88%, black);
  --primary-80: color-mix(in srgb, var(--brand-primary) 76%, black);
  --primary-90: color-mix(in srgb, var(--brand-primary) 64%, black);
  --primary-100: color-mix(in srgb, var(--brand-primary) 55%, black);
  --secondary-10: color-mix(in srgb, var(--brand-secondary) 12%, white);
  --secondary-20: color-mix(in srgb, var(--brand-secondary) 24%, white);
  --secondary-30: color-mix(in srgb, var(--brand-secondary) 42%, white);
  --secondary-40: color-mix(in srgb, var(--brand-secondary) 62%, white);
  --secondary-50: color-mix(in srgb, var(--brand-secondary) 82%, white);
  --secondary-60: var(--brand-secondary);
  --secondary-70: color-mix(in srgb, var(--brand-secondary) 88%, black);
  --secondary-80: color-mix(in srgb, var(--brand-secondary) 76%, black);
  --secondary-90: color-mix(in srgb, var(--brand-secondary) 64%, black);
  --secondary-100: color-mix(in srgb, var(--brand-secondary) 55%, black);
  --tertiary-10: color-mix(in srgb, var(--brand-tertiary) 12%, white);
  --tertiary-20: color-mix(in srgb, var(--brand-tertiary) 24%, white);
  --tertiary-30: color-mix(in srgb, var(--brand-tertiary) 42%, white);
  --tertiary-40: color-mix(in srgb, var(--brand-tertiary) 62%, white);
  --tertiary-50: color-mix(in srgb, var(--brand-tertiary) 82%, white);
  --tertiary-60: var(--brand-tertiary);
  --tertiary-70: color-mix(in srgb, var(--brand-tertiary) 88%, black);
  --tertiary-80: color-mix(in srgb, var(--brand-tertiary) 76%, black);
  --tertiary-90: color-mix(in srgb, var(--brand-tertiary) 64%, black);
  --tertiary-100: color-mix(in srgb, var(--brand-tertiary) 55%, black);
  --highlight-10: color-mix(in srgb, var(--brand-tertiary) 12%, white);
  --highlight-20: color-mix(in srgb, var(--brand-tertiary) 24%, white);
  --highlight-30: color-mix(in srgb, var(--brand-tertiary) 42%, white);
  --highlight-40: color-mix(in srgb, var(--brand-tertiary) 62%, white);
  --highlight-50: color-mix(in srgb, var(--brand-tertiary) 82%, white);
  --highlight-60: var(--brand-tertiary);
  --highlight-70: color-mix(in srgb, var(--brand-tertiary) 88%, black);
  --highlight-80: color-mix(in srgb, var(--brand-tertiary) 76%, black);
  --highlight-90: color-mix(in srgb, var(--brand-tertiary) 64%, black);
  --highlight-100: color-mix(in srgb, var(--brand-tertiary) 55%, black);
  --success-10: color-mix(in srgb, var(--functional-success-default) 12%, white);
  --success-20: color-mix(in srgb, var(--functional-success-default) 24%, white);
  --success-30: color-mix(in srgb, var(--functional-success-default) 42%, white);
  --success-40: color-mix(in srgb, var(--functional-success-default) 62%, white);
  --success-50: color-mix(in srgb, var(--functional-success-default) 82%, white);
  --success-60: var(--functional-success-default);
  --success-70: color-mix(in srgb, var(--functional-success-default) 88%, black);
  --success-80: color-mix(in srgb, var(--functional-success-default) 76%, black);
  --success-90: color-mix(in srgb, var(--functional-success-default) 64%, black);
  --success-100: color-mix(in srgb, var(--functional-success-default) 55%, black);
  --error-10: color-mix(in srgb, var(--functional-error-default) 12%, white);
  --error-20: color-mix(in srgb, var(--functional-error-default) 24%, white);
  --error-30: color-mix(in srgb, var(--functional-error-default) 42%, white);
  --error-40: color-mix(in srgb, var(--functional-error-default) 62%, white);
  --error-50: color-mix(in srgb, var(--functional-error-default) 82%, white);
  --error-60: var(--functional-error-default);
  --error-70: color-mix(in srgb, var(--functional-error-default) 88%, black);
  --error-80: color-mix(in srgb, var(--functional-error-default) 76%, black);
  --error-90: color-mix(in srgb, var(--functional-error-default) 64%, black);
  --error-100: color-mix(in srgb, var(--functional-error-default) 55%, black);
  --warning-10: color-mix(in srgb, var(--functional-warning-default) 12%, white);
  --warning-20: color-mix(in srgb, var(--functional-warning-default) 24%, white);
  --warning-30: color-mix(in srgb, var(--functional-warning-default) 42%, white);
  --warning-40: color-mix(in srgb, var(--functional-warning-default) 62%, white);
  --warning-50: color-mix(in srgb, var(--functional-warning-default) 82%, white);
  --warning-60: var(--functional-warning-default);
  --warning-70: color-mix(in srgb, var(--functional-warning-default) 88%, black);
  --warning-80: color-mix(in srgb, var(--functional-warning-default) 76%, black);
  --warning-90: color-mix(in srgb, var(--functional-warning-default) 64%, black);
  --warning-100: color-mix(in srgb, var(--functional-warning-default) 55%, black);
  --info-10: color-mix(in srgb, var(--functional-info-default) 12%, white);
  --info-20: color-mix(in srgb, var(--functional-info-default) 24%, white);
  --info-30: color-mix(in srgb, var(--functional-info-default) 42%, white);
  --info-40: color-mix(in srgb, var(--functional-info-default) 62%, white);
  --info-50: color-mix(in srgb, var(--functional-info-default) 82%, white);
  --info-60: var(--functional-info-default);
  --info-70: color-mix(in srgb, var(--functional-info-default) 88%, black);
  --info-80: color-mix(in srgb, var(--functional-info-default) 76%, black);
  --info-90: color-mix(in srgb, var(--functional-info-default) 64%, black);
  --info-100: color-mix(in srgb, var(--functional-info-default) 55%, black);
  --neutral-10: color-mix(in srgb, var(--text-primary) 12%, white);
  --neutral-20: color-mix(in srgb, var(--text-primary) 24%, white);
  --neutral-30: color-mix(in srgb, var(--text-primary) 42%, white);
  --neutral-40: color-mix(in srgb, var(--text-primary) 62%, white);
  --neutral-50: color-mix(in srgb, var(--text-primary) 82%, white);
  --neutral-60: var(--text-primary);
  --neutral-70: color-mix(in srgb, var(--text-primary) 88%, black);
  --neutral-80: color-mix(in srgb, var(--text-primary) 76%, black);
  --neutral-90: color-mix(in srgb, var(--text-primary) 64%, black);
  --neutral-100: color-mix(in srgb, var(--text-primary) 55%, black);
}
:root {
  --chart-01: var(--brand-primary);
  --chart-02: var(--brand-secondary);
  --chart-03: var(--brand-tertiary);
  --chart-04: color-mix(in srgb, var(--brand-primary) 50%, var(--background-primary));
  --chart-05: color-mix(in srgb, var(--brand-secondary) 50%, var(--background-primary));
  --chart-06: color-mix(in srgb, var(--brand-tertiary) 50%, var(--background-primary));
  --chart-07: color-mix(in srgb, var(--brand-primary) 75%, #000);
  --chart-08: color-mix(in srgb, var(--brand-secondary) 75%, #000);
  --chart-09: color-mix(in srgb, var(--brand-primary) 60%, var(--brand-tertiary));
  --chart-10: color-mix(in srgb, var(--brand-secondary) 60%, var(--brand-tertiary));
  --chart-11: color-mix(in srgb, var(--brand-primary) 25%, var(--background-primary));
  --chart-12: color-mix(in srgb, var(--brand-tertiary) 75%, #000);
}
:root {
  --a4-page-width: 595px;
  --a4-page-height: 842px;
  --a4-page-padding: 26px 40px;
  --a4-page-padding-x: 40px;
  --a4-page-padding-bottom: 26px;
  --a4-doc-footer-padding: 16px 0 0;
}
body.skyten-brand .page-expander[aria-expanded=false] {
  --page-expander-bg: var(--border-secondary);
  --page-expander-icon: var(--text-primary);
  --page-expander-border: var(--border-primary);
}
body.skyten-brand .page-expander[aria-expanded=false]:hover, body.skyten-brand .page-expander[aria-expanded=false].page-expander--state-hover {
  --page-expander-bg: var(--border-primary);
  --page-expander-border: var(--border-input-hover);
}
body.skyten-brand .page-expander[aria-expanded=true] {
  --page-expander-bg: var(--button-background-active);
  --page-expander-icon: var(--button-text-active);
  --page-expander-border: transparent;
}
body.skyten-brand .stack--sm {
  --stack-gap: var(--space-sm);
}
body.skyten-brand .stack--lg {
  --stack-gap: var(--space-lg);
}
body.skyten-brand .card-grid--tight {
  --card-grid-gap: var(--space-sm);
}
body.skyten-brand .card-grid--wide {
  --card-grid-gap: var(--space-lg);
}
:root {
  --color-success: var(--functional-success-default, #059669);
  --color-warning: var(--functional-warning-default, #d97706);
  --color-error: var(--functional-error-default, #dc2626);
  --color-info: var(--functional-info-default, #2563eb);
}
body.skyten-brand .surface-card[data-card-chrome] > .surface-card__body {
  --card-bg: initial;
  --card-fg: initial;
}
body.skyten-brand .partners-deployed-demo {
  --partners-inner-radius: calc(var(--radius-xl, 20px) - 2px);
}
body.skyten-brand .bar-chart--primary-opacity {
  --bar-chart-primary-mix-base: var(--background-primary);
}
body.skyten-brand .line-chart--viewbox-ratio {
  --line-chart-viewbox-w: 560;
  --line-chart-viewbox-h: 240;
}
:root {
  --background-hover: var(--neutral-10);
  --border-hover: var(--neutral-30);
  --button-background-active: var(--primary-60);
  --border-active: var(--primary-60);
  --border-input-active: var(--primary-60);
  --border-input-hover: var(--primary-50);
  --functional-success-background: var(--success-10);
  --functional-error-background: var(--error-10);
  --functional-warning-background: var(--warning-10);
  --functional-info-background: var(--info-10);
}

/* ===== APPENDED by vendor-brand-tokens.sh from tokens-mitigations.css (STTS-3087) ===== */
/* =============================================================================
 * skyten tokens-mitigations.css — INTERIM upstream-tracked token fixes.
 *
 * Appended VERBATIM to the end of the generated tokens.css by
 * scripts/vendor-brand-tokens.sh (STTS-3087). NOT loaded on its own.
 * Every block here MUST cite the upstream Brand Editor (CT) ticket and the
 * condition under which it gets deleted. Keep this file EMPTY-by-default:
 * it is a mitigation channel, not a theming layer (RULES.md rule 3 — consume
 * the Brand Editor's CSS, never fork it).
 * ========================================================================== */

/* STTS-3087 / upstream CT-683 (atomic-tints incomplete re-anchor):
 * The deployed skyten-organisms.css emits THREE same-specificity `:root`
 * blocks touching the active-button pair, in this order:
 *   1. _semantic-defaults-light:  --button-background-active: var(--brand-primary);
 *                                 --button-text-active: #ffffff;
 *   2. brands/skyten/_semantics-light (trading-app Figma set):
 *                                 --button-background-active: var(--neutral-50);
 *                                 --button-text-active: var(--info-40);
 *   3. _core/_atomic-tints (CT-166, atomic dist only, LAST):
 *                                 --button-background-active: var(--primary-60);
 *                                 (does NOT re-anchor --button-text-active)
 * Net cascade: brand-blue background (3) with light-blue --info-40 text (2) —
 * unreadable on every `.btn-primary.active` (e.g. the /home buy-tokens CTA).
 * The upstream fix is for _atomic-tints to re-anchor the TEXT token alongside
 * the background it re-anchors. Until that ships, mirror it here. Same
 * specificity as the vendored `:root` blocks, later in source order, so it
 * wins the light theme while `:root[data-theme=dark]` (0,2,0) stays in charge
 * of dark.
 * REMOVE when the deployed bundle's LAST --button-text-active definition in
 * the light-theme cascade computes to #ffffff (then this block is a no-op). */
:root {
  --button-text-active: #ffffff;
}