/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --color-fg-main-50: #fff8e1;
  --color-fg-main-100: #ffecb3;
  --color-fg-main-150: #ffe699;
  --color-fg-main-200: #ffd980;
  --color-fg-main-300: #ffcc66;
  --color-fg-main-400: #ffbe40;
  --color-fg-main-500: #f4af1c;
  --color-fg-main-600: #d99612;
  --color-fg-main-700: #bf800b;
  --color-fg-main-800: #a66b06;
  --color-fg-main-850: #8f5c05;
  --color-fg-main-900: #734803;
  --color-fg-main-950: #523201;
  --color-fg-main-1000: #362000;
  --color-fg-main-00: #fefbf2;
  --color-fg-sec-50: #ebf4f8;
  --color-fg-sec-100: #d6e5ed;
  --color-fg-sec-150: #c3d8e3;
  --color-fg-sec-200: #afcbd9;
  --color-fg-sec-300: #89b2c4;
  --color-fg-sec-400: #6a9cb2;
  --color-fg-sec-500: #4c85a0;
  --color-fg-sec-600: #3e6f86;
  --color-fg-sec-700: #31596c;
  --color-fg-sec-800: #244352;
  --color-fg-sec-850: #1d3845;
  --color-fg-sec-900: #172c36;
  --color-fg-sec-950: #101e25;
  --color-fg-sec-1000: #081014;
  --color-fg-sec-00: #f5f9fb;
  --color-taishin-color-red-500: #d70c18;
  --color-taishin-color-red-700: #ac0108;
  --color-taishin-color-gray-00: #ffffff;
  --color-taishin-color-gray-50: #ebebeb;
  --color-taishin-color-gray-500: #888888;
  --color-taishin-color-gray-800: #4a4a4a;
  --color-taishin-color-gray-850: #333333;
  --color-primasia-color-blue-lighter: #e2f0ff;
  --color-primasia-color-blue-light: #b5c7db;
  --color-primasia-color-blue-medium: #2d4c6d;
  --color-primasia-color-blue-main: #002349;
  --color-primasia-color-sec-lighter: #f8f4e8;
  --color-primasia-color-sec-main: #bd9a1b;
  --color-primasia-color-sec-dark: #463b15;
  --color-rsc-color-orange-500: #fa5a00;
  --color-neutral-13: #dfdfdf;
  --color-neutral-20: #cccccc;
  --color-neutral-30: #b3b2b2;
  --color-neutral-46: #8b8a8a;
  --color-neutral-56: #707070;
  --color-neutral-60: #656565;
  --color-neutral-67: #545454;
  --color-neutral-70: #4d4d4d;
  --color-neutral-80: #323232;
  --color-neutral-84: #292929;
  --color-neutral-87: #222222;
  --color-neutral-89: #1d1d1d;
  --color-neutral-93: #131313;
  --color-neutral-00-white: #ffffff;
  --color-neutral-02: #fafafa;
  --color-neutral-04: #f5f5f5;
  --color-neutral-08: #eaeaea;
  --color-neutral-100-black: #000000;
  --color-black-a0: rgba(0, 0, 0, 0);
  --color-black-a8: rgba(0, 0, 0, 0.08);
  --color-black-a10: rgba(0, 0, 0, 0.1);
  --color-black-a20: rgba(0, 0, 0, 0.2);
  --color-black-a30: rgba(0, 0, 0, 0.3);
  --color-black-a40: rgba(0, 0, 0, 0.4);
  --color-black-a50: rgba(0, 0, 0, 0.5);
  --color-black-a60: rgba(0, 0, 0, 0.6);
  --color-black-a70: rgba(0, 0, 0, 0.7);
  --color-black-a80: rgba(0, 0, 0, 0.8);
  --color-black-a90: rgba(0, 0, 0, 0.9);
  --color-white-a0: rgba(255, 255, 255, 0);
  --color-white-a8: rgba(255, 255, 255, 0.08);
  --color-white-a10: rgba(255, 255, 255, 0.1);
  --color-white-a20: rgba(255, 255, 255, 0.2);
  --color-white-a30: rgba(255, 255, 255, 0.3);
  --color-white-a40: rgba(255, 255, 255, 0.4);
  --color-white-a50: rgba(255, 255, 255, 0.5);
  --color-white-a60: rgba(255, 255, 255, 0.6);
  --color-white-a70: rgba(255, 255, 255, 0.7);
  --color-white-a80: rgba(255, 255, 255, 0.8);
  --color-white-a90: rgba(255, 255, 255, 0.9);
  --color-red-50: #ffebec;
  --color-red-100: #ffcdcf;
  --color-red-150: #ffb3b6;
  --color-red-200: #ff999c;
  --color-red-300: #ff7075;
  --color-red-400: #f55659;
  --color-red-500: #e83c3c;
  --color-red-600: #d12a2a;
  --color-red-700: #b81d1d;
  --color-red-800: #991414;
  --color-red-850: #851010;
  --color-red-900: #6b0a0a;
  --color-red-950: #4d0505;
  --color-red-1000: #330202;
  --color-red-00: #fff5f5;
  --color-pink-50: #fff0f7;
  --color-pink-500: #ff5ca8;
  --color-pink-600: #e64591;
  --color-pink-950: #52082c;
  --color-orange-50: #fff0e6;
  --color-orange-150: #ffccad;
  --color-orange-200: #ffb894;
  --color-orange-400: #ff8c45;
  --color-orange-500: #ff7a1c;
  --color-orange-600: #e6600e;
  --color-orange-700: #cc4d00;
  --color-orange-900: #702a00;
  --color-orange-950: #521e00;
  --color-brown-50: #f5f0eb;
  --color-brown-500: #ae8359;
  --color-brown-600: #946b45;
  --color-brown-700: #7a5434;
  --color-brown-800: #614025;
  --color-brown-900: #3d2d1f;
  --color-green-50: #ebfae6;
  --color-green-100: #d4f5cc;
  --color-green-150: #c2f0b6;
  --color-green-200: #a3e693;
  --color-green-300: #7fcc6a;
  --color-green-400: #5ab346;
  --color-green-500: #339c09;
  --color-green-600: #298506;
  --color-green-700: #1f6b03;
  --color-green-800: #165201;
  --color-green-850: #124501;
  --color-green-900: #0d3600;
  --color-green-950: #092600;
  --color-green-1000: #051a00;
  --color-green-00: #f4fcf2;
  --color-aqua-50: #e0fbf6;
  --color-aqua-500: #3eddc1;
  --color-aqua-600: #2cbfa5;
  --color-aqua-950: #044238;
  --color-blue-50: #edf4ff;
  --color-blue-400: #669eff;
  --color-blue-500: #457df6;
  --color-blue-600: #3366d6;
  --color-blue-850: #143382;
  --color-blue-950: #091a4d;
  --color-purple-50: #f8f2ff;
  --color-purple-500: #c4a3ff;
  --color-purple-600: #a885e6;
  --color-purple-950: #3e1e66;
}

/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --color-bg-stock-rise-extra-light: rgba(243, 116, 109, 0.15);
  --color-bg-stock-rise-default: #f3746d;
  --color-bg-stock-rise-dark: #d24139;
  --color-bg-stock-fall-extra-light: rgba(108, 156, 70, 0.15);
  --color-bg-stock-fall-default: #6c9c46;
  --color-bg-stock-fall-dark: #3f7316;
  --color-foreground-stock-rise-default: #f3746d;
  --color-foreground-stock-rise-hover: #d24139;
  --color-foreground-stock-fall-default: #6c9c46;
  --color-foreground-pnl-gain: #f3746d;
  --color-foreground-pnl-loss: #6c9c46;
  --color-component-realtime-mkt-fall-default: #6c9c46;
  --color-component-realtime-mkt-fall-active: #3f7316;
  --color-component-realtime-mkt-fall-disabled: #d4f5cc;
  --color-component-realtime-mkt-rise-default: #f3746d;
  --color-component-realtime-mkt-rise-active: #d24139;
  --color-component-realtime-mkt-rise-disabled: #fbd5d3;
  --color-bg-screen-primary: var(--color-neutral-00-white);
  --color-bg-screen-secondary: var(--color-neutral-04);
  --color-bg-surface-container-default: var(--color-neutral-00-white);
  --color-bg-surface-container-active: var(--color-neutral-04);
  --color-bg-surface-container-hover: var(--color-neutral-02);
  --color-bg-surface-container-focus: var(--color-neutral-13);
  --color-bg-surface-container-disabled: var(--color-neutral-02);
  --color-bg-surface-subtle-default: var(--color-neutral-02);
  --color-bg-surface-subtle-active: var(--color-neutral-08);
  --color-bg-surface-subtle-disabled: var(--color-neutral-00-white);
  --color-bg-surface-variant-default: var(--color-neutral-04);
  --color-bg-surface-variant-active: var(--color-neutral-13);
  --color-bg-surface-variant-hover: var(--color-neutral-08);
  --color-bg-surface-variant-disabled: var(--color-neutral-02);
  --color-bg-surface-variant-high-default: var(--color-neutral-08);
  --color-bg-surface-variant-high-active: var(--color-neutral-20);
  --color-bg-surface-variant-high-hover: var(--color-neutral-13);
  --color-bg-surface-variant-high-disabled: var(--color-neutral-04);
  --color-bg-surface-inverse-default: var(--color-neutral-100-black);
  --color-bg-surface-inverse-hover: var(--color-neutral-70);
  --color-bg-surface-transparent-a90: var(--color-white-a90);
  --color-bg-surface-transparent-a0: var(--color-white-a0);
  --color-bg-highlight-primary-normal-default: var(--color-fg-main-500);
  --color-bg-highlight-primary-normal-hover: var(--color-fg-main-400);
  --color-bg-highlight-primary-normal-active: var(--color-fg-main-600);
  --color-bg-highlight-primary-normal-disabled: var(--color-fg-main-150);
  --color-bg-highlight-primary-light-default: var(--color-fg-main-50);
  --color-bg-highlight-secondary-normal-default: var(--color-fg-sec-500);
  --color-bg-highlight-secondary-normal-hover: var(--color-fg-sec-400);
  --color-bg-highlight-secondary-normal-active: var(--color-fg-sec-600);
  --color-bg-highlight-secondary-normal-disabled: var(--color-fg-sec-150);
  --color-bg-highlight-secondary-light-default: var(--color-fg-sec-50);
  --color-bg-stock-flat-default: var(--color-neutral-46);
  --color-bg-status-error: var(--color-red-400);
  --color-bg-status-new: var(--color-red-400);
  --color-bg-status-danger-default: var(--color-red-500);
  --color-bg-status-danger-hover: var(--color-red-400);
  --color-bg-status-danger-active: var(--color-red-600);
  --color-bg-status-danger-disabled: var(--color-red-150);
  --color-bg-mask-mid: var(--color-black-a50);
  --color-foreground-primary-default: var(--color-neutral-80);
  --color-foreground-primary-hover: var(--color-neutral-60);
  --color-foreground-primary-disabled: var(--color-neutral-20);
  --color-foreground-secondary-default: var(--color-neutral-46);
  --color-foreground-secondary-hover: var(--color-neutral-30);
  --color-foreground-secondary-disabled: var(--color-neutral-20);
  --color-foreground-tertiary-default: var(--color-neutral-30);
  --color-foreground-tertiary-active: var(--color-neutral-60);
  --color-foreground-tertiary-disabled: var(--color-neutral-13);
  --color-foreground-highlight-normal-default: var(--color-fg-main-500);
  --color-foreground-highlight-dark-default: var(--color-fg-main-600);
  --color-foreground-highlight-dark-hover: var(--color-fg-main-500);
  --color-foreground-stock-flat-default: var(--color-neutral-46);
  --color-foreground-pnl-even: var(--color-neutral-80);
  --color-foreground-inverted-primary-default: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover: var(--color-neutral-08);
  --color-foreground-inverted-primary-default-opposite: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover-opposite: var(--color-neutral-08);
  --color-foreground-inverted-secondary-default: var(--color-neutral-13);
  --color-foreground-inverted-tertiary-default: var(--color-neutral-46);
  --color-foreground-inverted-tertiary-default-opposite: var(--color-neutral-13);
  --color-foreground-link-text-default: var(--color-fg-sec-500);
  --color-foreground-link-text-hover: var(--color-fg-sec-400);
  --color-foreground-link-text-disabled: var(--color-fg-sec-100);
  --color-foreground-link-underline-default: var(--color-neutral-46);
  --color-foreground-link-underline-hover: var(--color-neutral-30);
  --color-foreground-status-danger: var(--color-red-500);
  --color-foreground-status-success-default: var(--color-green-500);
  --color-foreground-status-success-hover: var(--color-green-400);
  --color-foreground-status-warning-default: var(--color-fg-main-600);
  --color-foreground-status-warning-hover: var(--color-fg-main-500);
  --color-foreground-status-error-default: var(--color-red-500);
  --color-foreground-status-error-hover: var(--color-red-400);
  --color-foreground-odd-default: var(--color-fg-sec-500);
  --color-stroke-inverse: var(--color-neutral-100-black);
  --color-stroke-heavy: var(--color-neutral-13);
  --color-stroke-default: var(--color-neutral-08);
  --color-stroke-subtle: var(--color-neutral-04);
  --color-stroke-minimal: var(--color-neutral-02);
  --color-component-trade-toast-bg: var(--color-neutral-80);
  --color-component-trade-toast-deal: var(--color-fg-main-500);
  --color-component-trade-toast-successful: var(--color-blue-500);
  --color-component-trade-toast-error: var(--color-red-400);
  --color-component-segment-bg: var(--color-neutral-08);
  --color-component-segment-selected: var(--color-neutral-00-white);
  --color-component-selection-default: var(--color-fg-main-500);
  --color-component-tooltip-background-default: var(--color-neutral-80);
  --color-component-tooltip-background-light: var(--color-neutral-00-white);
  --color-component-datepicker-background-active: var(--color-fg-sec-00);
  --color-component-tag-background-normal-red: var(--color-red-50);
  --color-component-tag-background-normal-pink: var(--color-pink-50);
  --color-component-tag-background-normal-orange: var(--color-orange-50);
  --color-component-tag-background-normal-brown: var(--color-brown-50);
  --color-component-tag-background-normal-yellow: var(--color-fg-main-50);
  --color-component-tag-background-normal-aqua: var(--color-aqua-50);
  --color-component-tag-background-normal-green: var(--color-green-50);
  --color-component-tag-background-normal-blue: var(--color-blue-50);
  --color-component-tag-background-normal-purple: var(--color-purple-50);
  --color-component-tag-background-normal-grey: var(--color-neutral-08);
  --color-component-tag-background-normal-light-grey: var(--color-neutral-04);
  --color-component-tag-background-inverse-red: var(--color-red-600);
  --color-component-tag-background-inverse-black: var(--color-neutral-100-black);
  --color-component-tag-foreground-red: var(--color-red-600);
  --color-component-tag-foreground-pink: var(--color-pink-600);
  --color-component-tag-foreground-orange: var(--color-orange-600);
  --color-component-tag-foreground-brown: var(--color-brown-600);
  --color-component-tag-foreground-yellow: var(--color-fg-main-600);
  --color-component-tag-foreground-aqua: var(--color-aqua-600);
  --color-component-tag-foreground-green: var(--color-green-600);
  --color-component-tag-foreground-blue: var(--color-blue-600);
  --color-component-tag-foreground-purple: var(--color-purple-600);
  --color-component-tag-foreground-grey: var(--color-neutral-60);
  --color-component-tag-foreground-light-grey: var(--color-neutral-46);
  --color-component-nav-logobar: var(--color-neutral-00-white);
  --color-component-nav-trade-nav: var(--color-fg-sec-500);
  --color-component-nav-trade-btn-active: var(--color-fg-sec-600);
  --color-component-nav-trade-btn-default: var(--color-fg-sec-500);
  --color-component-web-frame-shadow-default: var(--color-black-a8);
  --color-component-chart-chart1: var(--color-fg-main-500);
  --color-component-chart-chart2: var(--color-fg-main-400);
  --color-component-chart-chart3: var(--color-fg-main-300);
  --color-component-chart-chart4: var(--color-fg-main-200);
  --color-component-chart-chart5: var(--color-fg-main-150);
  --color-component-chart-chart6: var(--color-fg-main-100);
  --color-component-chart-chart7: var(--color-fg-main-50);
  --color-component-chart-chart8: var(--color-fg-main-00);
  --color-component-chart-negative: var(--color-green-500);
  --color-component-locked-article-badge-background-normal: var(--color-neutral-00-white);
  --color-component-locked-article-badge-background-preview: var(--color-neutral-04);
  --color-component-locked-article-badge-foreground-unpaid: var(--color-neutral-60);
  --color-component-locked-article-badge-foreground-paid: var(--color-fg-main-500);
  --color-component-locked-article-badge-stroke-paid: var(--color-fg-main-100);
  --color-component-controll-button-background-default: var(--color-black-a20);
  --color-component-controll-button-background-hover: var(--color-black-a30);
  --color-component-heatmap-0: var(--color-neutral-13);
  --color-component-heatmap-2: var(--color-red-100);
  --color-component-heatmap-4: var(--color-red-200);
  --color-component-heatmap-6: var(--color-red-300);
  --color-component-heatmap-8: var(--color-red-400);
  --color-component-heatmap-10: var(--color-red-500);
  --color-component-realtime-mkt-flat-default: var(--color-neutral-46);
  --color-component-realtime-mkt-flat-active: var(--color-neutral-60);
  --color-component-realtime-mkt-flat-disabled: var(--color-neutral-20);
  --color-component-input-foreground-placeholder: var(--color-neutral-30);
  --color-component-input-foreground-value: var(--color-neutral-80);
  --color-component-input-foreground-disabled: var(--color-neutral-20);
  --color-component-input-foreground-required: var(--color-red-600);
  --color-component-input-foreground-error: var(--color-red-600);
  --color-component-input-stroke-default: var(--color-neutral-08);
  --color-component-input-stroke-focus: var(--color-fg-main-500);
  --color-component-input-stroke-error: var(--color-red-600);
  --color-component-callout-foreground-high: var(--color-red-700);
  --color-component-callout-foreground-medium: var(--color-fg-main-600);
  --color-component-callout-foreground-low: var(--color-neutral-30);
  --color-component-callout-background-high: var(--color-red-50);
  --color-component-callout-background-medium: var(--color-fg-main-50);
  --color-component-callout-background-low: var(--color-neutral-02);
  --color-component-stock-card-legend-background: var(--color-white-a80);
  --color-component-footer-background-primary: var(--color-neutral-93);
  --color-component-footer-background-secondary: var(--color-neutral-87);
}

/**
 * Do not edit directly, this file was auto-generated.
 */

[data-theme='dark'] {
  --color-bg-stock-rise-extra-light: rgba(255, 55, 55, 0.2);
  --color-bg-stock-rise-default: #ff3737;
  --color-bg-stock-rise-dark: #c71919;
  --color-bg-stock-fall-extra-light: rgba(111, 218, 26, 0.2);
  --color-bg-stock-fall-default: #6fda1a;
  --color-bg-stock-fall-dark: #3f7316;
  --color-foreground-stock-rise-default: #ff3737;
  --color-foreground-stock-rise-hover: #c71919;
  --color-foreground-stock-fall-default: #6fda1a;
  --color-foreground-pnl-gain: #ff3737;
  --color-foreground-pnl-loss: #6fda1a;
  --color-component-realtime-mkt-fall-default: #6fda1a;
  --color-component-realtime-mkt-fall-active: #3f7316;
  --color-component-realtime-mkt-fall-disabled: #36561c;
  --color-component-realtime-mkt-rise-default: #e83c3c;
  --color-component-realtime-mkt-rise-active: #f55659;
  --color-component-realtime-mkt-rise-disabled: #612525;
  --color-bg-screen-primary: var(--color-neutral-93);
  --color-bg-screen-secondary: var(--color-neutral-100-black);
  --color-bg-surface-container-default: var(--color-neutral-89);
  --color-bg-surface-container-active: var(--color-neutral-84);
  --color-bg-surface-container-hover: var(--color-neutral-84);
  --color-bg-surface-container-focus: var(--color-neutral-70);
  --color-bg-surface-container-disabled: var(--color-neutral-87);
  --color-bg-surface-subtle-default: var(--color-neutral-87);
  --color-bg-surface-subtle-active: var(--color-neutral-80);
  --color-bg-surface-subtle-disabled: var(--color-neutral-89);
  --color-bg-surface-variant-default: var(--color-neutral-84);
  --color-bg-surface-variant-active: var(--color-neutral-56);
  --color-bg-surface-variant-hover: var(--color-neutral-70);
  --color-bg-surface-variant-disabled: var(--color-neutral-87);
  --color-bg-surface-variant-high-default: var(--color-neutral-80);
  --color-bg-surface-variant-high-active: var(--color-neutral-30);
  --color-bg-surface-variant-high-hover: var(--color-neutral-56);
  --color-bg-surface-variant-high-disabled: var(--color-neutral-84);
  --color-bg-surface-inverse-default: var(--color-neutral-00-white);
  --color-bg-surface-inverse-hover: var(--color-neutral-08);
  --color-bg-surface-transparent-a90: var(--color-black-a90);
  --color-bg-surface-transparent-a0: var(--color-black-a0);
  --color-bg-highlight-primary-normal-default: var(--color-fg-main-500);
  --color-bg-highlight-primary-normal-hover: var(--color-fg-main-600);
  --color-bg-highlight-primary-normal-active: var(--color-fg-main-400);
  --color-bg-highlight-primary-normal-disabled: var(--color-fg-main-850);
  --color-bg-highlight-primary-light-default: var(--color-fg-main-850);
  --color-bg-highlight-secondary-normal-default: var(--color-fg-sec-500);
  --color-bg-highlight-secondary-normal-hover: var(--color-fg-sec-600);
  --color-bg-highlight-secondary-normal-active: var(--color-fg-sec-400);
  --color-bg-highlight-secondary-normal-disabled: var(--color-fg-sec-850);
  --color-bg-highlight-secondary-light-default: var(--color-fg-sec-800);
  --color-bg-stock-flat-default: var(--color-neutral-46);
  --color-bg-status-error: var(--color-red-500);
  --color-bg-status-new: var(--color-red-500);
  --color-bg-status-danger-default: var(--color-red-600);
  --color-bg-status-danger-hover: var(--color-red-500);
  --color-bg-status-danger-active: var(--color-red-700);
  --color-bg-status-danger-disabled: var(--color-red-900);
  --color-bg-mask-mid: var(--color-black-a50);
  --color-foreground-primary-default: var(--color-neutral-13);
  --color-foreground-primary-hover: var(--color-neutral-30);
  --color-foreground-primary-disabled: var(--color-neutral-60);
  --color-foreground-secondary-default: var(--color-neutral-46);
  --color-foreground-secondary-hover: var(--color-neutral-30);
  --color-foreground-secondary-disabled: var(--color-neutral-20);
  --color-foreground-tertiary-default: var(--color-neutral-60);
  --color-foreground-tertiary-active: var(--color-neutral-30);
  --color-foreground-tertiary-disabled: var(--color-neutral-67);
  --color-foreground-highlight-normal-default: var(--color-fg-main-500);
  --color-foreground-highlight-dark-default: var(--color-fg-main-300);
  --color-foreground-highlight-dark-hover: var(--color-fg-main-400);
  --color-foreground-stock-flat-default: var(--color-neutral-46);
  --color-foreground-pnl-even: var(--color-neutral-13);
  --color-foreground-inverted-primary-default: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover: var(--color-neutral-08);
  --color-foreground-inverted-primary-default-opposite: var(--color-neutral-80);
  --color-foreground-inverted-primary-hover-opposite: var(--color-neutral-60);
  --color-foreground-inverted-secondary-default: var(--color-neutral-13);
  --color-foreground-inverted-tertiary-default: var(--color-neutral-46);
  --color-foreground-inverted-tertiary-default-opposite: var(--color-neutral-80);
  --color-foreground-link-text-default: var(--color-fg-sec-400);
  --color-foreground-link-text-hover: var(--color-fg-sec-300);
  --color-foreground-link-text-disabled: var(--color-fg-sec-800);
  --color-foreground-link-underline-default: var(--color-neutral-46);
  --color-foreground-link-underline-hover: var(--color-neutral-30);
  --color-foreground-status-danger: var(--color-red-500);
  --color-foreground-status-success-default: var(--color-green-500);
  --color-foreground-status-success-hover: var(--color-green-400);
  --color-foreground-status-warning-default: var(--color-fg-main-600);
  --color-foreground-status-warning-hover: var(--color-fg-main-500);
  --color-foreground-status-error-default: var(--color-red-500);
  --color-foreground-status-error-hover: var(--color-red-400);
  --color-foreground-odd-default: var(--color-fg-sec-300);
  --color-stroke-inverse: var(--color-neutral-00-white);
  --color-stroke-heavy: var(--color-neutral-67);
  --color-stroke-default: var(--color-neutral-80);
  --color-stroke-subtle: var(--color-neutral-84);
  --color-stroke-minimal: var(--color-neutral-87);
  --color-component-trade-toast-bg: var(--color-neutral-67);
  --color-component-trade-toast-deal: var(--color-fg-main-500);
  --color-component-trade-toast-successful: var(--color-blue-500);
  --color-component-trade-toast-error: var(--color-red-400);
  --color-component-segment-bg: var(--color-neutral-80);
  --color-component-segment-selected: var(--color-neutral-70);
  --color-component-selection-default: var(--color-fg-main-500);
  --color-component-tooltip-background-default: var(--color-neutral-67);
  --color-component-tooltip-background-light: var(--color-neutral-67);
  --color-component-datepicker-background-active: var(--color-fg-sec-900);
  --color-component-tag-background-normal-red: var(--color-red-950);
  --color-component-tag-background-normal-pink: var(--color-pink-950);
  --color-component-tag-background-normal-orange: var(--color-orange-950);
  --color-component-tag-background-normal-brown: var(--color-brown-900);
  --color-component-tag-background-normal-yellow: var(--color-fg-main-950);
  --color-component-tag-background-normal-aqua: var(--color-aqua-950);
  --color-component-tag-background-normal-green: var(--color-green-800);
  --color-component-tag-background-normal-blue: var(--color-blue-850);
  --color-component-tag-background-normal-purple: var(--color-purple-950);
  --color-component-tag-background-normal-grey: var(--color-neutral-70);
  --color-component-tag-background-normal-light-grey: var(--color-neutral-80);
  --color-component-tag-background-inverse-red: var(--color-red-600);
  --color-component-tag-background-inverse-black: var(--color-neutral-00-white);
  --color-component-tag-foreground-red: var(--color-red-400);
  --color-component-tag-foreground-pink: var(--color-pink-500);
  --color-component-tag-foreground-orange: var(--color-orange-500);
  --color-component-tag-foreground-brown: var(--color-brown-500);
  --color-component-tag-foreground-yellow: var(--color-fg-main-500);
  --color-component-tag-foreground-aqua: var(--color-aqua-500);
  --color-component-tag-foreground-green: var(--color-green-500);
  --color-component-tag-foreground-blue: var(--color-blue-400);
  --color-component-tag-foreground-purple: var(--color-purple-500);
  --color-component-tag-foreground-grey: var(--color-neutral-20);
  --color-component-tag-foreground-light-grey: var(--color-neutral-30);
  --color-component-nav-logobar: var(--color-neutral-89);
  --color-component-nav-trade-nav: var(--color-fg-sec-500);
  --color-component-nav-trade-btn-active: var(--color-fg-sec-600);
  --color-component-nav-trade-btn-default: var(--color-fg-sec-500);
  --color-component-web-frame-shadow-default: var(--color-black-a50);
  --color-component-chart-chart1: var(--color-fg-main-500);
  --color-component-chart-chart2: var(--color-fg-main-400);
  --color-component-chart-chart3: var(--color-fg-main-300);
  --color-component-chart-chart4: var(--color-fg-main-200);
  --color-component-chart-chart5: var(--color-fg-main-150);
  --color-component-chart-chart6: var(--color-fg-main-100);
  --color-component-chart-chart7: var(--color-fg-main-50);
  --color-component-chart-chart8: var(--color-fg-main-00);
  --color-component-chart-negative: var(--color-green-500);
  --color-component-locked-article-badge-background-normal: var(--color-neutral-00-white);
  --color-component-locked-article-badge-background-preview: var(--color-neutral-04);
  --color-component-locked-article-badge-foreground-unpaid: var(--color-neutral-60);
  --color-component-locked-article-badge-foreground-paid: var(--color-fg-main-500);
  --color-component-locked-article-badge-stroke-paid: var(--color-fg-main-100);
  --color-component-controll-button-background-default: var(--color-black-a20);
  --color-component-controll-button-background-hover: var(--color-black-a30);
  --color-component-heatmap-0: var(--color-neutral-70);
  --color-component-heatmap-2: var(--color-red-800);
  --color-component-heatmap-4: var(--color-red-700);
  --color-component-heatmap-6: var(--color-red-600);
  --color-component-heatmap-8: var(--color-red-500);
  --color-component-heatmap-10: var(--color-red-400);
  --color-component-realtime-mkt-flat-default: var(--color-neutral-46);
  --color-component-realtime-mkt-flat-active: var(--color-neutral-30);
  --color-component-realtime-mkt-flat-disabled: var(--color-neutral-80);
  --color-component-input-foreground-placeholder: var(--color-neutral-30);
  --color-component-input-foreground-value: var(--color-neutral-13);
  --color-component-input-foreground-disabled: var(--color-neutral-60);
  --color-component-input-foreground-required: var(--color-red-500);
  --color-component-input-foreground-error: var(--color-red-500);
  --color-component-input-stroke-default: var(--color-neutral-80);
  --color-component-input-stroke-focus: var(--color-fg-main-500);
  --color-component-input-stroke-error: var(--color-red-500);
  --color-component-callout-foreground-high: var(--color-red-300);
  --color-component-callout-foreground-medium: var(--color-fg-main-400);
  --color-component-callout-foreground-low: var(--color-neutral-46);
  --color-component-callout-background-high: var(--color-red-900);
  --color-component-callout-background-medium: var(--color-fg-main-900);
  --color-component-callout-background-low: var(--color-neutral-89);
  --color-component-stock-card-legend-background: var(--color-black-a80);
  --color-component-footer-background-primary: var(--color-neutral-89);
  --color-component-footer-background-secondary: var(--color-neutral-84);
}



/**
 * Do not edit directly, this file was auto-generated.
 */

[data-brand='tssco'] {
  --color-bg-stock-rise-extra-light: rgba(243, 116, 109, 0.15);
  --color-bg-stock-rise-default: #f3746d;
  --color-bg-stock-rise-dark: #d24139;
  --color-bg-stock-fall-extra-light: rgba(108, 156, 70, 0.15);
  --color-bg-stock-fall-default: #6c9c46;
  --color-bg-stock-fall-dark: #3f7316;
  --color-foreground-stock-rise-default: #f3746d;
  --color-foreground-stock-rise-hover: #d24139;
  --color-foreground-stock-fall-default: #6c9c46;
  --color-foreground-pnl-gain: #f3746d;
  --color-foreground-pnl-loss: #6c9c46;
  --color-component-controll-button-background-default: #ffffff;
  --color-component-controll-button-background-hover: #ffffff;
  --color-bg-screen-primary: var(--color-neutral-00-white);
  --color-bg-screen-secondary: var(--color-neutral-04);
  --color-bg-surface-container-default: var(--color-neutral-00-white);
  --color-bg-surface-container-active: var(--color-neutral-04);
  --color-bg-surface-container-hover: var(--color-neutral-02);
  --color-bg-surface-container-focus: var(--color-neutral-13);
  --color-bg-surface-container-disabled: var(--color-neutral-02);
  --color-bg-surface-subtle-default: var(--color-neutral-02);
  --color-bg-surface-subtle-active: var(--color-neutral-08);
  --color-bg-surface-subtle-disabled: var(--color-neutral-00-white);
  --color-bg-surface-variant-default: var(--color-neutral-04);
  --color-bg-surface-variant-active: var(--color-neutral-13);
  --color-bg-surface-variant-hover: var(--color-neutral-08);
  --color-bg-surface-variant-disabled: var(--color-neutral-02);
  --color-bg-surface-variant-high-default: var(--color-neutral-08);
  --color-bg-surface-variant-high-active: var(--color-neutral-20);
  --color-bg-surface-variant-high-hover: var(--color-neutral-13);
  --color-bg-surface-variant-high-disabled: var(--color-neutral-04);
  --color-bg-surface-inverse-default: var(--color-neutral-100-black);
  --color-bg-surface-inverse-hover: var(--color-neutral-70);
  --color-bg-surface-transparent-a90: var(--color-white-a90);
  --color-bg-surface-transparent-a0: var(--color-white-a0);
  --color-bg-highlight-primary-normal-default: var(--color-taishin-color-red-500);
  --color-bg-highlight-primary-normal-hover: var(--color-taishin-color-red-500);
  --color-bg-highlight-primary-normal-active: var(--color-red-600);
  --color-bg-highlight-primary-normal-disabled: var(--color-red-50);
  --color-bg-highlight-primary-light-default: var(--color-red-50);
  --color-bg-highlight-secondary-normal-default: var(--color-taishin-color-gray-800);
  --color-bg-highlight-secondary-normal-hover: var(--color-taishin-color-gray-850);
  --color-bg-highlight-secondary-normal-active: var(--color-neutral-60);
  --color-bg-highlight-secondary-normal-disabled: var(--color-taishin-color-gray-50);
  --color-bg-highlight-secondary-light-default: var(--color-fg-sec-50);
  --color-bg-stock-flat-default: var(--color-neutral-46);
  --color-bg-status-error: var(--color-red-400);
  --color-bg-status-new: var(--color-red-400);
  --color-bg-status-danger-default: var(--color-red-500);
  --color-bg-status-danger-hover: var(--color-red-400);
  --color-bg-status-danger-active: var(--color-red-600);
  --color-bg-status-danger-disabled: var(--color-red-150);
  --color-bg-mask-mid: var(--color-black-a50);
  --color-foreground-primary-default: var(--color-neutral-80);
  --color-foreground-primary-hover: var(--color-neutral-70);
  --color-foreground-primary-disabled: var(--color-neutral-20);
  --color-foreground-secondary-default: var(--color-neutral-46);
  --color-foreground-secondary-hover: var(--color-neutral-30);
  --color-foreground-secondary-disabled: var(--color-neutral-20);
  --color-foreground-tertiary-default: var(--color-neutral-30);
  --color-foreground-tertiary-active: var(--color-neutral-60);
  --color-foreground-tertiary-disabled: var(--color-neutral-13);
  --color-foreground-highlight-normal-default: var(--color-taishin-color-red-500);
  --color-foreground-highlight-dark-default: var(--color-taishin-color-red-500);
  --color-foreground-highlight-dark-hover: var(--color-taishin-color-red-500);
  --color-foreground-stock-flat-default: var(--color-neutral-46);
  --color-foreground-pnl-even: var(--color-neutral-80);
  --color-foreground-inverted-primary-default: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover: var(--color-neutral-08);
  --color-foreground-inverted-primary-default-opposite: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover-opposite: var(--color-neutral-08);
  --color-foreground-inverted-secondary-default: var(--color-neutral-13);
  --color-foreground-inverted-tertiary-default: var(--color-neutral-46);
  --color-foreground-inverted-tertiary-default-opposite: var(--color-neutral-13);
  --color-foreground-link-text-default: var(--color-fg-sec-500);
  --color-foreground-link-text-hover: var(--color-fg-sec-400);
  --color-foreground-link-text-disabled: var(--color-fg-sec-100);
  --color-foreground-link-underline-default: var(--color-fg-sec-500);
  --color-foreground-link-underline-hover: var(--color-fg-sec-400);
  --color-foreground-status-danger: var(--color-red-500);
  --color-foreground-status-success-default: var(--color-green-500);
  --color-foreground-status-success-hover: var(--color-green-400);
  --color-foreground-status-warning-default: var(--color-fg-main-600);
  --color-foreground-status-warning-hover: var(--color-fg-main-500);
  --color-foreground-status-error-default: var(--color-red-500);
  --color-foreground-status-error-hover: var(--color-red-400);
  --color-foreground-odd-default: var(--color-fg-sec-500);
  --color-stroke-inverse: var(--color-neutral-100-black);
  --color-stroke-heavy: var(--color-neutral-13);
  --color-stroke-default: var(--color-neutral-08);
  --color-stroke-subtle: var(--color-neutral-04);
  --color-stroke-minimal: var(--color-neutral-02);
  --color-component-trade-toast-bg: var(--color-neutral-80);
  --color-component-trade-toast-deal: var(--color-fg-main-500);
  --color-component-trade-toast-successful: var(--color-blue-500);
  --color-component-trade-toast-error: var(--color-red-400);
  --color-component-segment-bg: var(--color-neutral-08);
  --color-component-segment-selected: var(--color-neutral-00-white);
  --color-component-selection-default: var(--color-fg-sec-500);
  --color-component-tooltip-background-default: var(--color-neutral-80);
  --color-component-tooltip-background-light: var(--color-neutral-00-white);
  --color-component-datepicker-background-active: var(--color-neutral-04);
  --color-component-tag-background-normal-red: var(--color-red-50);
  --color-component-tag-background-normal-pink: var(--color-pink-50);
  --color-component-tag-background-normal-orange: var(--color-orange-50);
  --color-component-tag-background-normal-brown: var(--color-brown-50);
  --color-component-tag-background-normal-yellow: var(--color-fg-main-50);
  --color-component-tag-background-normal-aqua: var(--color-aqua-50);
  --color-component-tag-background-normal-green: var(--color-green-50);
  --color-component-tag-background-normal-blue: var(--color-blue-50);
  --color-component-tag-background-normal-purple: var(--color-purple-50);
  --color-component-tag-background-normal-grey: var(--color-neutral-08);
  --color-component-tag-background-normal-light-grey: var(--color-neutral-04);
  --color-component-tag-background-inverse-red: var(--color-red-600);
  --color-component-tag-background-inverse-black: var(--color-neutral-100-black);
  --color-component-tag-foreground-red: var(--color-red-600);
  --color-component-tag-foreground-pink: var(--color-pink-600);
  --color-component-tag-foreground-orange: var(--color-orange-600);
  --color-component-tag-foreground-brown: var(--color-brown-600);
  --color-component-tag-foreground-yellow: var(--color-fg-main-600);
  --color-component-tag-foreground-aqua: var(--color-aqua-600);
  --color-component-tag-foreground-green: var(--color-green-500);
  --color-component-tag-foreground-blue: var(--color-blue-600);
  --color-component-tag-foreground-purple: var(--color-purple-600);
  --color-component-tag-foreground-grey: var(--color-neutral-60);
  --color-component-tag-foreground-light-grey: var(--color-neutral-46);
  --color-component-nav-logobar: var(--color-taishin-color-red-500);
  --color-component-nav-trade-nav: var(--color-taishin-color-gray-800);
  --color-component-nav-trade-btn-active: var(--color-taishin-color-gray-850);
  --color-component-nav-trade-btn-default: var(--color-taishin-color-gray-800);
  --color-component-web-frame-shadow-default: var(--color-black-a8);
  --color-component-chart-chart1: var(--color-taishin-color-red-700);
  --color-component-chart-chart2: var(--color-taishin-color-red-500);
  --color-component-chart-chart3: var(--color-orange-500);
  --color-component-chart-chart4: var(--color-orange-200);
  --color-component-chart-chart5: var(--color-fg-main-150);
  --color-component-chart-chart6: var(--color-fg-main-300);
  --color-component-chart-chart7: var(--color-fg-main-500);
  --color-component-chart-chart8: var(--color-fg-main-900);
  --color-component-chart-negative: var(--color-green-500);
  --color-component-locked-article-badge-background-normal: var(--color-neutral-00-white);
  --color-component-locked-article-badge-background-preview: var(--color-neutral-04);
  --color-component-locked-article-badge-foreground-unpaid: var(--color-neutral-60);
  --color-component-locked-article-badge-foreground-paid: var(--color-fg-main-500);
  --color-component-locked-article-badge-stroke-paid: var(--color-fg-main-100);
  --color-component-heatmap-0: var(--color-green-400);
  --color-component-heatmap-2: var(--color-red-100);
  --color-component-heatmap-4: var(--color-red-100);
  --color-component-heatmap-6: var(--color-red-100);
  --color-component-heatmap-8: var(--color-red-100);
  --color-component-heatmap-10: var(--color-red-100);
  --color-component-realtime-mkt-fall-default: var(--color-green-500);
  --color-component-realtime-mkt-fall-active: var(--color-green-600);
  --color-component-realtime-mkt-fall-disabled: var(--color-green-100);
  --color-component-realtime-mkt-flat-default: var(--color-neutral-46);
  --color-component-realtime-mkt-flat-active: var(--color-neutral-60);
  --color-component-realtime-mkt-flat-disabled: var(--color-neutral-20);
  --color-component-realtime-mkt-rise-default: var(--color-red-500);
  --color-component-realtime-mkt-rise-active: var(--color-red-600);
  --color-component-realtime-mkt-rise-disabled: var(--color-red-100);
  --color-component-input-foreground-placeholder: var(--color-neutral-30);
  --color-component-input-foreground-value: var(--color-neutral-80);
  --color-component-input-foreground-disabled: var(--color-neutral-20);
  --color-component-input-foreground-required: var(--color-red-600);
  --color-component-input-foreground-error: var(--color-red-600);
  --color-component-input-stroke-default: var(--color-neutral-08);
  --color-component-input-stroke-focus: var(--color-neutral-46);
  --color-component-input-stroke-error: var(--color-red-600);
  --color-component-callout-foreground-high: var(--color-red-700);
  --color-component-callout-foreground-medium: var(--color-fg-main-600);
  --color-component-callout-foreground-low: var(--color-neutral-30);
  --color-component-callout-background-high: var(--color-red-50);
  --color-component-callout-background-medium: var(--color-fg-main-50);
  --color-component-callout-background-low: var(--color-neutral-02);
  --color-component-stock-card-legend-background: var(--color-white-a80);
  --color-component-footer-background-primary: var(--color-neutral-93);
  --color-component-footer-background-secondary: var(--color-neutral-87);
}

/**
 * Do not edit directly, this file was auto-generated.
 */

[data-theme='dark'] [data-brand='tssco'],
[data-theme='dark'][data-brand='tssco'] {
  --color-bg-stock-rise-extra-light: rgba(255, 55, 55, 0.2);
  --color-bg-stock-rise-default: #ff3737;
  --color-bg-stock-rise-dark: #c71919;
  --color-bg-stock-fall-extra-light: rgba(111, 218, 26, 0.2);
  --color-bg-stock-fall-default: #6fda1a;
  --color-bg-stock-fall-dark: #3f7316;
  --color-foreground-stock-rise-default: #ff3737;
  --color-foreground-stock-rise-hover: #c71919;
  --color-foreground-stock-fall-default: #6fda1a;
  --color-foreground-pnl-gain: #ff3737;
  --color-foreground-pnl-loss: #6fda1a;
  --color-component-controll-button-background-default: #ffffff;
  --color-component-controll-button-background-hover: #ffffff;
  --color-bg-screen-primary: var(--color-neutral-93);
  --color-bg-screen-secondary: var(--color-neutral-100-black);
  --color-bg-surface-container-default: var(--color-neutral-89);
  --color-bg-surface-container-active: var(--color-neutral-84);
  --color-bg-surface-container-hover: var(--color-neutral-84);
  --color-bg-surface-container-focus: var(--color-neutral-70);
  --color-bg-surface-container-disabled: var(--color-neutral-87);
  --color-bg-surface-subtle-default: var(--color-neutral-87);
  --color-bg-surface-subtle-active: var(--color-neutral-80);
  --color-bg-surface-subtle-disabled: var(--color-neutral-89);
  --color-bg-surface-variant-default: var(--color-neutral-84);
  --color-bg-surface-variant-active: var(--color-neutral-56);
  --color-bg-surface-variant-hover: var(--color-neutral-70);
  --color-bg-surface-variant-disabled: var(--color-neutral-87);
  --color-bg-surface-variant-high-default: var(--color-neutral-80);
  --color-bg-surface-variant-high-active: var(--color-neutral-30);
  --color-bg-surface-variant-high-hover: var(--color-neutral-56);
  --color-bg-surface-variant-high-disabled: var(--color-neutral-84);
  --color-bg-surface-inverse-default: var(--color-neutral-00-white);
  --color-bg-surface-inverse-hover: var(--color-neutral-08);
  --color-bg-surface-transparent-a90: var(--color-black-a90);
  --color-bg-surface-transparent-a0: var(--color-black-a0);
  --color-bg-highlight-primary-normal-default: var(--color-taishin-color-red-500);
  --color-bg-highlight-primary-normal-hover: var(--color-taishin-color-red-500);
  --color-bg-highlight-primary-normal-active: var(--color-red-400);
  --color-bg-highlight-primary-normal-disabled: var(--color-red-950);
  --color-bg-highlight-primary-light-default: var(--color-red-950);
  --color-bg-highlight-secondary-normal-default: var(--color-taishin-color-gray-800);
  --color-bg-highlight-secondary-normal-hover: var(--color-neutral-70);
  --color-bg-highlight-secondary-normal-active: var(--color-neutral-60);
  --color-bg-highlight-secondary-normal-disabled: var(--color-taishin-color-gray-850);
  --color-bg-highlight-secondary-light-default: var(--color-fg-sec-800);
  --color-bg-stock-flat-default: var(--color-neutral-46);
  --color-bg-status-error: var(--color-red-500);
  --color-bg-status-new: var(--color-red-500);
  --color-bg-status-danger-default: var(--color-red-600);
  --color-bg-status-danger-hover: var(--color-red-500);
  --color-bg-status-danger-active: var(--color-red-700);
  --color-bg-status-danger-disabled: var(--color-red-900);
  --color-bg-mask-mid: var(--color-black-a50);
  --color-foreground-primary-default: var(--color-neutral-13);
  --color-foreground-primary-hover: var(--color-neutral-30);
  --color-foreground-primary-disabled: var(--color-neutral-60);
  --color-foreground-secondary-default: var(--color-neutral-46);
  --color-foreground-secondary-hover: var(--color-neutral-30);
  --color-foreground-secondary-disabled: var(--color-neutral-20);
  --color-foreground-tertiary-default: var(--color-neutral-60);
  --color-foreground-tertiary-active: var(--color-neutral-30);
  --color-foreground-tertiary-disabled: var(--color-neutral-67);
  --color-foreground-highlight-normal-default: var(--color-taishin-color-red-500);
  --color-foreground-highlight-dark-default: var(--color-taishin-color-red-500);
  --color-foreground-highlight-dark-hover: var(--color-taishin-color-red-500);
  --color-foreground-stock-flat-default: var(--color-neutral-46);
  --color-foreground-pnl-even: var(--color-neutral-13);
  --color-foreground-inverted-primary-default: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover: var(--color-neutral-08);
  --color-foreground-inverted-primary-default-opposite: var(--color-neutral-80);
  --color-foreground-inverted-primary-hover-opposite: var(--color-neutral-60);
  --color-foreground-inverted-secondary-default: var(--color-neutral-13);
  --color-foreground-inverted-tertiary-default: var(--color-neutral-46);
  --color-foreground-inverted-tertiary-default-opposite: var(--color-neutral-80);
  --color-foreground-link-text-default: var(--color-fg-sec-400);
  --color-foreground-link-text-hover: var(--color-fg-sec-300);
  --color-foreground-link-text-disabled: var(--color-fg-sec-800);
  --color-foreground-link-underline-default: var(--color-fg-sec-400);
  --color-foreground-link-underline-hover: var(--color-fg-sec-300);
  --color-foreground-status-danger: var(--color-red-500);
  --color-foreground-status-success-default: var(--color-green-500);
  --color-foreground-status-success-hover: var(--color-green-400);
  --color-foreground-status-warning-default: var(--color-fg-main-600);
  --color-foreground-status-warning-hover: var(--color-fg-main-500);
  --color-foreground-status-error-default: var(--color-red-500);
  --color-foreground-status-error-hover: var(--color-red-400);
  --color-foreground-odd-default: var(--color-fg-sec-300);
  --color-stroke-inverse: var(--color-neutral-00-white);
  --color-stroke-heavy: var(--color-neutral-67);
  --color-stroke-default: var(--color-neutral-80);
  --color-stroke-subtle: var(--color-neutral-84);
  --color-stroke-minimal: var(--color-neutral-87);
  --color-component-trade-toast-bg: var(--color-neutral-67);
  --color-component-trade-toast-deal: var(--color-fg-main-500);
  --color-component-trade-toast-successful: var(--color-blue-500);
  --color-component-trade-toast-error: var(--color-red-400);
  --color-component-segment-bg: var(--color-neutral-80);
  --color-component-segment-selected: var(--color-neutral-70);
  --color-component-selection-default: var(--color-fg-sec-500);
  --color-component-tooltip-background-default: var(--color-neutral-67);
  --color-component-tooltip-background-light: var(--color-neutral-67);
  --color-component-datepicker-background-active: var(--color-neutral-87);
  --color-component-tag-background-normal-red: var(--color-red-950);
  --color-component-tag-background-normal-pink: var(--color-pink-950);
  --color-component-tag-background-normal-orange: var(--color-orange-950);
  --color-component-tag-background-normal-brown: var(--color-brown-900);
  --color-component-tag-background-normal-yellow: var(--color-fg-main-950);
  --color-component-tag-background-normal-aqua: var(--color-aqua-950);
  --color-component-tag-background-normal-green: var(--color-green-800);
  --color-component-tag-background-normal-blue: var(--color-blue-850);
  --color-component-tag-background-normal-purple: var(--color-purple-950);
  --color-component-tag-background-normal-grey: var(--color-neutral-70);
  --color-component-tag-background-normal-light-grey: var(--color-neutral-80);
  --color-component-tag-background-inverse-red: var(--color-red-600);
  --color-component-tag-background-inverse-black: var(--color-neutral-00-white);
  --color-component-tag-foreground-red: var(--color-red-400);
  --color-component-tag-foreground-pink: var(--color-pink-500);
  --color-component-tag-foreground-orange: var(--color-orange-500);
  --color-component-tag-foreground-brown: var(--color-brown-500);
  --color-component-tag-foreground-yellow: var(--color-fg-main-500);
  --color-component-tag-foreground-aqua: var(--color-aqua-500);
  --color-component-tag-foreground-green: var(--color-green-500);
  --color-component-tag-foreground-blue: var(--color-blue-400);
  --color-component-tag-foreground-purple: var(--color-purple-500);
  --color-component-tag-foreground-grey: var(--color-neutral-20);
  --color-component-tag-foreground-light-grey: var(--color-neutral-30);
  --color-component-nav-logobar: var(--color-taishin-color-red-500);
  --color-component-nav-trade-nav: var(--color-taishin-color-gray-800);
  --color-component-nav-trade-btn-active: var(--color-taishin-color-gray-850);
  --color-component-nav-trade-btn-default: var(--color-taishin-color-gray-800);
  --color-component-web-frame-shadow-default: var(--color-black-a50);
  --color-component-chart-chart1: var(--color-taishin-color-red-700);
  --color-component-chart-chart2: var(--color-taishin-color-red-500);
  --color-component-chart-chart3: var(--color-orange-500);
  --color-component-chart-chart4: var(--color-orange-200);
  --color-component-chart-chart5: var(--color-fg-main-150);
  --color-component-chart-chart6: var(--color-fg-main-300);
  --color-component-chart-chart7: var(--color-fg-main-500);
  --color-component-chart-chart8: var(--color-fg-main-900);
  --color-component-chart-negative: var(--color-green-500);
  --color-component-locked-article-badge-background-normal: var(--color-neutral-00-white);
  --color-component-locked-article-badge-background-preview: var(--color-neutral-04);
  --color-component-locked-article-badge-foreground-unpaid: var(--color-neutral-60);
  --color-component-locked-article-badge-foreground-paid: var(--color-fg-main-500);
  --color-component-locked-article-badge-stroke-paid: var(--color-fg-main-00);
  --color-component-heatmap-0: var(--color-green-600);
  --color-component-heatmap-2: var(--color-red-700);
  --color-component-heatmap-4: var(--color-red-700);
  --color-component-heatmap-6: var(--color-red-700);
  --color-component-heatmap-8: var(--color-red-700);
  --color-component-heatmap-10: var(--color-red-700);
  --color-component-realtime-mkt-fall-default: var(--color-green-500);
  --color-component-realtime-mkt-fall-active: var(--color-green-400);
  --color-component-realtime-mkt-fall-disabled: var(--color-green-900);
  --color-component-realtime-mkt-flat-default: var(--color-neutral-46);
  --color-component-realtime-mkt-flat-active: var(--color-neutral-30);
  --color-component-realtime-mkt-flat-disabled: var(--color-neutral-80);
  --color-component-realtime-mkt-rise-default: var(--color-red-500);
  --color-component-realtime-mkt-rise-active: var(--color-red-400);
  --color-component-realtime-mkt-rise-disabled: var(--color-red-900);
  --color-component-input-foreground-placeholder: var(--color-neutral-30);
  --color-component-input-foreground-value: var(--color-neutral-13);
  --color-component-input-foreground-disabled: var(--color-neutral-60);
  --color-component-input-foreground-required: var(--color-red-500);
  --color-component-input-foreground-error: var(--color-red-500);
  --color-component-input-stroke-default: var(--color-neutral-80);
  --color-component-input-stroke-focus: var(--color-neutral-46);
  --color-component-input-stroke-error: var(--color-red-500);
  --color-component-callout-foreground-high: var(--color-red-300);
  --color-component-callout-foreground-medium: var(--color-fg-main-400);
  --color-component-callout-foreground-low: var(--color-neutral-46);
  --color-component-callout-background-high: var(--color-red-900);
  --color-component-callout-background-medium: var(--color-fg-main-900);
  --color-component-callout-background-low: var(--color-neutral-89);
  --color-component-stock-card-legend-background: var(--color-black-a80);
  --color-component-footer-background-primary: var(--color-neutral-89);
  --color-component-footer-background-secondary: var(--color-neutral-84);
}

/**
 * Do not edit directly, this file was auto-generated.
 */

[data-brand='fugle'] {
  --color-bg-stock-rise-extra-light: rgba(243, 116, 109, 0.15);
  --color-bg-stock-rise-default: #f3746d;
  --color-bg-stock-rise-dark: #d24139;
  --color-bg-stock-fall-extra-light: rgba(108, 156, 70, 0.15);
  --color-bg-stock-fall-default: #6c9c46;
  --color-bg-stock-fall-dark: #3f7316;
  --color-foreground-stock-rise-default: #f3746d;
  --color-foreground-stock-rise-hover: #d24139;
  --color-foreground-stock-fall-default: #6c9c46;
  --color-foreground-pnl-gain: #f3746d;
  --color-foreground-pnl-loss: #6c9c46;
  --color-component-realtime-mkt-fall-default: #6c9c46;
  --color-component-realtime-mkt-fall-active: #3f7316;
  --color-component-realtime-mkt-fall-disabled: #d4f5cc;
  --color-component-realtime-mkt-rise-default: #f3746d;
  --color-component-realtime-mkt-rise-active: #d24139;
  --color-component-realtime-mkt-rise-disabled: #fbd5d3;
  --color-bg-screen-primary: var(--color-neutral-00-white);
  --color-bg-screen-secondary: var(--color-neutral-04);
  --color-bg-surface-container-default: var(--color-neutral-00-white);
  --color-bg-surface-container-active: var(--color-neutral-04);
  --color-bg-surface-container-hover: var(--color-neutral-02);
  --color-bg-surface-container-focus: var(--color-neutral-13);
  --color-bg-surface-container-disabled: var(--color-neutral-02);
  --color-bg-surface-subtle-default: var(--color-neutral-02);
  --color-bg-surface-subtle-active: var(--color-neutral-08);
  --color-bg-surface-subtle-disabled: var(--color-neutral-00-white);
  --color-bg-surface-variant-default: var(--color-neutral-04);
  --color-bg-surface-variant-active: var(--color-neutral-13);
  --color-bg-surface-variant-hover: var(--color-neutral-08);
  --color-bg-surface-variant-disabled: var(--color-neutral-02);
  --color-bg-surface-variant-high-default: var(--color-neutral-08);
  --color-bg-surface-variant-high-active: var(--color-neutral-20);
  --color-bg-surface-variant-high-hover: var(--color-neutral-13);
  --color-bg-surface-variant-high-disabled: var(--color-neutral-04);
  --color-bg-surface-inverse-default: var(--color-neutral-100-black);
  --color-bg-surface-inverse-hover: var(--color-neutral-70);
  --color-bg-surface-transparent-a90: var(--color-white-a90);
  --color-bg-surface-transparent-a0: var(--color-white-a0);
  --color-bg-highlight-primary-normal-default: var(--color-fg-main-500);
  --color-bg-highlight-primary-normal-hover: var(--color-fg-main-400);
  --color-bg-highlight-primary-normal-active: var(--color-fg-main-600);
  --color-bg-highlight-primary-normal-disabled: var(--color-fg-main-150);
  --color-bg-highlight-primary-light-default: var(--color-fg-main-50);
  --color-bg-highlight-secondary-normal-default: var(--color-fg-sec-500);
  --color-bg-highlight-secondary-normal-hover: var(--color-fg-sec-400);
  --color-bg-highlight-secondary-normal-active: var(--color-fg-sec-600);
  --color-bg-highlight-secondary-normal-disabled: var(--color-fg-sec-150);
  --color-bg-highlight-secondary-light-default: var(--color-fg-sec-50);
  --color-bg-stock-flat-default: var(--color-neutral-46);
  --color-bg-status-error: var(--color-red-400);
  --color-bg-status-new: var(--color-red-400);
  --color-bg-status-danger-default: var(--color-red-500);
  --color-bg-status-danger-hover: var(--color-red-400);
  --color-bg-status-danger-active: var(--color-red-600);
  --color-bg-status-danger-disabled: var(--color-red-150);
  --color-bg-mask-mid: var(--color-black-a50);
  --color-foreground-primary-default: var(--color-neutral-80);
  --color-foreground-primary-hover: var(--color-neutral-60);
  --color-foreground-primary-disabled: var(--color-neutral-20);
  --color-foreground-secondary-default: var(--color-neutral-46);
  --color-foreground-secondary-hover: var(--color-neutral-30);
  --color-foreground-secondary-disabled: var(--color-neutral-20);
  --color-foreground-tertiary-default: var(--color-neutral-30);
  --color-foreground-tertiary-active: var(--color-neutral-60);
  --color-foreground-tertiary-disabled: var(--color-neutral-13);
  --color-foreground-highlight-normal-default: var(--color-fg-main-500);
  --color-foreground-highlight-dark-default: var(--color-fg-main-600);
  --color-foreground-highlight-dark-hover: var(--color-fg-main-500);
  --color-foreground-stock-flat-default: var(--color-neutral-46);
  --color-foreground-pnl-even: var(--color-neutral-80);
  --color-foreground-inverted-primary-default: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover: var(--color-neutral-08);
  --color-foreground-inverted-primary-default-opposite: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover-opposite: var(--color-neutral-08);
  --color-foreground-inverted-secondary-default: var(--color-neutral-13);
  --color-foreground-inverted-tertiary-default: var(--color-neutral-46);
  --color-foreground-inverted-tertiary-default-opposite: var(--color-neutral-13);
  --color-foreground-link-text-default: var(--color-fg-sec-500);
  --color-foreground-link-text-hover: var(--color-fg-sec-400);
  --color-foreground-link-text-disabled: var(--color-fg-sec-100);
  --color-foreground-link-underline-default: var(--color-neutral-46);
  --color-foreground-link-underline-hover: var(--color-neutral-30);
  --color-foreground-status-danger: var(--color-red-500);
  --color-foreground-status-success-default: var(--color-green-500);
  --color-foreground-status-success-hover: var(--color-green-400);
  --color-foreground-status-warning-default: var(--color-fg-main-600);
  --color-foreground-status-warning-hover: var(--color-fg-main-500);
  --color-foreground-status-error-default: var(--color-red-500);
  --color-foreground-status-error-hover: var(--color-red-400);
  --color-foreground-odd-default: var(--color-fg-sec-500);
  --color-stroke-inverse: var(--color-neutral-100-black);
  --color-stroke-heavy: var(--color-neutral-13);
  --color-stroke-default: var(--color-neutral-08);
  --color-stroke-subtle: var(--color-neutral-04);
  --color-stroke-minimal: var(--color-neutral-02);
  --color-component-trade-toast-bg: var(--color-neutral-80);
  --color-component-trade-toast-deal: var(--color-fg-main-500);
  --color-component-trade-toast-successful: var(--color-blue-500);
  --color-component-trade-toast-error: var(--color-red-400);
  --color-component-segment-bg: var(--color-neutral-08);
  --color-component-segment-selected: var(--color-neutral-00-white);
  --color-component-selection-default: var(--color-fg-main-500);
  --color-component-tooltip-background-default: var(--color-neutral-80);
  --color-component-tooltip-background-light: var(--color-neutral-00-white);
  --color-component-datepicker-background-active: var(--color-fg-sec-00);
  --color-component-tag-background-normal-red: var(--color-red-50);
  --color-component-tag-background-normal-pink: var(--color-pink-50);
  --color-component-tag-background-normal-orange: var(--color-orange-50);
  --color-component-tag-background-normal-brown: var(--color-brown-50);
  --color-component-tag-background-normal-yellow: var(--color-fg-main-50);
  --color-component-tag-background-normal-aqua: var(--color-aqua-50);
  --color-component-tag-background-normal-green: var(--color-green-50);
  --color-component-tag-background-normal-blue: var(--color-blue-50);
  --color-component-tag-background-normal-purple: var(--color-purple-50);
  --color-component-tag-background-normal-grey: var(--color-neutral-08);
  --color-component-tag-background-normal-light-grey: var(--color-neutral-04);
  --color-component-tag-background-inverse-red: var(--color-red-600);
  --color-component-tag-background-inverse-black: var(--color-neutral-100-black);
  --color-component-tag-foreground-red: var(--color-red-600);
  --color-component-tag-foreground-pink: var(--color-pink-600);
  --color-component-tag-foreground-orange: var(--color-orange-600);
  --color-component-tag-foreground-brown: var(--color-brown-600);
  --color-component-tag-foreground-yellow: var(--color-fg-main-600);
  --color-component-tag-foreground-aqua: var(--color-aqua-600);
  --color-component-tag-foreground-green: var(--color-green-600);
  --color-component-tag-foreground-blue: var(--color-blue-600);
  --color-component-tag-foreground-purple: var(--color-purple-600);
  --color-component-tag-foreground-grey: var(--color-neutral-60);
  --color-component-tag-foreground-light-grey: var(--color-neutral-46);
  --color-component-nav-logobar: var(--color-neutral-00-white);
  --color-component-nav-trade-nav: var(--color-fg-sec-500);
  --color-component-nav-trade-btn-active: var(--color-fg-sec-600);
  --color-component-nav-trade-btn-default: var(--color-fg-sec-500);
  --color-component-web-frame-shadow-default: var(--color-black-a8);
  --color-component-chart-chart1: var(--color-fg-main-500);
  --color-component-chart-chart2: var(--color-fg-main-400);
  --color-component-chart-chart3: var(--color-fg-main-300);
  --color-component-chart-chart4: var(--color-fg-main-200);
  --color-component-chart-chart5: var(--color-fg-main-150);
  --color-component-chart-chart6: var(--color-fg-main-100);
  --color-component-chart-chart7: var(--color-fg-main-50);
  --color-component-chart-chart8: var(--color-fg-main-00);
  --color-component-chart-negative: var(--color-green-500);
  --color-component-locked-article-badge-background-normal: var(--color-neutral-00-white);
  --color-component-locked-article-badge-background-preview: var(--color-neutral-04);
  --color-component-locked-article-badge-foreground-unpaid: var(--color-neutral-60);
  --color-component-locked-article-badge-foreground-paid: var(--color-fg-main-500);
  --color-component-locked-article-badge-stroke-paid: var(--color-fg-main-100);
  --color-component-controll-button-background-default: var(--color-black-a20);
  --color-component-controll-button-background-hover: var(--color-black-a30);
  --color-component-heatmap-0: var(--color-neutral-13);
  --color-component-heatmap-2: var(--color-red-100);
  --color-component-heatmap-4: var(--color-red-200);
  --color-component-heatmap-6: var(--color-red-300);
  --color-component-heatmap-8: var(--color-red-400);
  --color-component-heatmap-10: var(--color-red-500);
  --color-component-realtime-mkt-flat-default: var(--color-neutral-46);
  --color-component-realtime-mkt-flat-active: var(--color-neutral-60);
  --color-component-realtime-mkt-flat-disabled: var(--color-neutral-20);
  --color-component-input-foreground-placeholder: var(--color-neutral-30);
  --color-component-input-foreground-value: var(--color-neutral-80);
  --color-component-input-foreground-disabled: var(--color-neutral-20);
  --color-component-input-foreground-required: var(--color-red-600);
  --color-component-input-foreground-error: var(--color-red-600);
  --color-component-input-stroke-default: var(--color-neutral-08);
  --color-component-input-stroke-focus: var(--color-fg-main-500);
  --color-component-input-stroke-error: var(--color-red-600);
  --color-component-callout-foreground-high: var(--color-red-700);
  --color-component-callout-foreground-medium: var(--color-fg-main-600);
  --color-component-callout-foreground-low: var(--color-neutral-30);
  --color-component-callout-background-high: var(--color-red-50);
  --color-component-callout-background-medium: var(--color-fg-main-50);
  --color-component-callout-background-low: var(--color-neutral-02);
  --color-component-stock-card-legend-background: var(--color-white-a80);
  --color-component-footer-background-primary: var(--color-neutral-93);
  --color-component-footer-background-secondary: var(--color-neutral-87);
}

/**
 * Do not edit directly, this file was auto-generated.
 */

[data-theme='dark'] [data-brand='fugle'],
[data-theme='dark'][data-brand='fugle'] {
  --color-bg-stock-rise-extra-light: rgba(255, 55, 55, 0.2);
  --color-bg-stock-rise-default: #ff3737;
  --color-bg-stock-rise-dark: #c71919;
  --color-bg-stock-fall-extra-light: rgba(111, 218, 26, 0.2);
  --color-bg-stock-fall-default: #6fda1a;
  --color-bg-stock-fall-dark: #3f7316;
  --color-foreground-stock-rise-default: #ff3737;
  --color-foreground-stock-rise-hover: #c71919;
  --color-foreground-stock-fall-default: #6fda1a;
  --color-foreground-pnl-gain: #ff3737;
  --color-foreground-pnl-loss: #6fda1a;
  --color-component-realtime-mkt-fall-default: #6fda1a;
  --color-component-realtime-mkt-fall-active: #3f7316;
  --color-component-realtime-mkt-fall-disabled: #36561c;
  --color-component-realtime-mkt-rise-default: #e83c3c;
  --color-component-realtime-mkt-rise-active: #f55659;
  --color-component-realtime-mkt-rise-disabled: #612525;
  --color-bg-screen-primary: var(--color-neutral-93);
  --color-bg-screen-secondary: var(--color-neutral-100-black);
  --color-bg-surface-container-default: var(--color-neutral-89);
  --color-bg-surface-container-active: var(--color-neutral-84);
  --color-bg-surface-container-hover: var(--color-neutral-84);
  --color-bg-surface-container-focus: var(--color-neutral-70);
  --color-bg-surface-container-disabled: var(--color-neutral-87);
  --color-bg-surface-subtle-default: var(--color-neutral-87);
  --color-bg-surface-subtle-active: var(--color-neutral-80);
  --color-bg-surface-subtle-disabled: var(--color-neutral-89);
  --color-bg-surface-variant-default: var(--color-neutral-84);
  --color-bg-surface-variant-active: var(--color-neutral-56);
  --color-bg-surface-variant-hover: var(--color-neutral-70);
  --color-bg-surface-variant-disabled: var(--color-neutral-87);
  --color-bg-surface-variant-high-default: var(--color-neutral-80);
  --color-bg-surface-variant-high-active: var(--color-neutral-30);
  --color-bg-surface-variant-high-hover: var(--color-neutral-56);
  --color-bg-surface-variant-high-disabled: var(--color-neutral-84);
  --color-bg-surface-inverse-default: var(--color-neutral-00-white);
  --color-bg-surface-inverse-hover: var(--color-neutral-08);
  --color-bg-surface-transparent-a90: var(--color-black-a90);
  --color-bg-surface-transparent-a0: var(--color-black-a0);
  --color-bg-highlight-primary-normal-default: var(--color-fg-main-500);
  --color-bg-highlight-primary-normal-hover: var(--color-fg-main-600);
  --color-bg-highlight-primary-normal-active: var(--color-fg-main-400);
  --color-bg-highlight-primary-normal-disabled: var(--color-fg-main-850);
  --color-bg-highlight-primary-light-default: var(--color-fg-main-850);
  --color-bg-highlight-secondary-normal-default: var(--color-fg-sec-500);
  --color-bg-highlight-secondary-normal-hover: var(--color-fg-sec-600);
  --color-bg-highlight-secondary-normal-active: var(--color-fg-sec-400);
  --color-bg-highlight-secondary-normal-disabled: var(--color-fg-sec-850);
  --color-bg-highlight-secondary-light-default: var(--color-fg-sec-800);
  --color-bg-stock-flat-default: var(--color-neutral-46);
  --color-bg-status-error: var(--color-red-500);
  --color-bg-status-new: var(--color-red-500);
  --color-bg-status-danger-default: var(--color-red-600);
  --color-bg-status-danger-hover: var(--color-red-500);
  --color-bg-status-danger-active: var(--color-red-700);
  --color-bg-status-danger-disabled: var(--color-red-900);
  --color-bg-mask-mid: var(--color-black-a50);
  --color-foreground-primary-default: var(--color-neutral-13);
  --color-foreground-primary-hover: var(--color-neutral-30);
  --color-foreground-primary-disabled: var(--color-neutral-60);
  --color-foreground-secondary-default: var(--color-neutral-46);
  --color-foreground-secondary-hover: var(--color-neutral-30);
  --color-foreground-secondary-disabled: var(--color-neutral-20);
  --color-foreground-tertiary-default: var(--color-neutral-60);
  --color-foreground-tertiary-active: var(--color-neutral-30);
  --color-foreground-tertiary-disabled: var(--color-neutral-67);
  --color-foreground-highlight-normal-default: var(--color-fg-main-500);
  --color-foreground-highlight-dark-default: var(--color-fg-main-300);
  --color-foreground-highlight-dark-hover: var(--color-fg-main-400);
  --color-foreground-stock-flat-default: var(--color-neutral-46);
  --color-foreground-pnl-even: var(--color-neutral-13);
  --color-foreground-inverted-primary-default: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover: var(--color-neutral-08);
  --color-foreground-inverted-primary-default-opposite: var(--color-neutral-80);
  --color-foreground-inverted-primary-hover-opposite: var(--color-neutral-60);
  --color-foreground-inverted-secondary-default: var(--color-neutral-13);
  --color-foreground-inverted-tertiary-default: var(--color-neutral-46);
  --color-foreground-inverted-tertiary-default-opposite: var(--color-neutral-80);
  --color-foreground-link-text-default: var(--color-fg-sec-400);
  --color-foreground-link-text-hover: var(--color-fg-sec-300);
  --color-foreground-link-text-disabled: var(--color-fg-sec-800);
  --color-foreground-link-underline-default: var(--color-neutral-46);
  --color-foreground-link-underline-hover: var(--color-neutral-30);
  --color-foreground-status-danger: var(--color-red-500);
  --color-foreground-status-success-default: var(--color-green-500);
  --color-foreground-status-success-hover: var(--color-green-400);
  --color-foreground-status-warning-default: var(--color-fg-main-600);
  --color-foreground-status-warning-hover: var(--color-fg-main-500);
  --color-foreground-status-error-default: var(--color-red-500);
  --color-foreground-status-error-hover: var(--color-red-400);
  --color-foreground-odd-default: var(--color-fg-sec-300);
  --color-stroke-inverse: var(--color-neutral-00-white);
  --color-stroke-heavy: var(--color-neutral-67);
  --color-stroke-default: var(--color-neutral-80);
  --color-stroke-subtle: var(--color-neutral-84);
  --color-stroke-minimal: var(--color-neutral-87);
  --color-component-trade-toast-bg: var(--color-neutral-67);
  --color-component-trade-toast-deal: var(--color-fg-main-500);
  --color-component-trade-toast-successful: var(--color-blue-500);
  --color-component-trade-toast-error: var(--color-red-400);
  --color-component-segment-bg: var(--color-neutral-80);
  --color-component-segment-selected: var(--color-neutral-70);
  --color-component-selection-default: var(--color-fg-main-500);
  --color-component-tooltip-background-default: var(--color-neutral-67);
  --color-component-tooltip-background-light: var(--color-neutral-67);
  --color-component-datepicker-background-active: var(--color-fg-sec-900);
  --color-component-tag-background-normal-red: var(--color-red-950);
  --color-component-tag-background-normal-pink: var(--color-pink-950);
  --color-component-tag-background-normal-orange: var(--color-orange-950);
  --color-component-tag-background-normal-brown: var(--color-brown-900);
  --color-component-tag-background-normal-yellow: var(--color-fg-main-950);
  --color-component-tag-background-normal-aqua: var(--color-aqua-950);
  --color-component-tag-background-normal-green: var(--color-green-800);
  --color-component-tag-background-normal-blue: var(--color-blue-850);
  --color-component-tag-background-normal-purple: var(--color-purple-950);
  --color-component-tag-background-normal-grey: var(--color-neutral-70);
  --color-component-tag-background-normal-light-grey: var(--color-neutral-80);
  --color-component-tag-background-inverse-red: var(--color-red-600);
  --color-component-tag-background-inverse-black: var(--color-neutral-00-white);
  --color-component-tag-foreground-red: var(--color-red-400);
  --color-component-tag-foreground-pink: var(--color-pink-500);
  --color-component-tag-foreground-orange: var(--color-orange-500);
  --color-component-tag-foreground-brown: var(--color-brown-500);
  --color-component-tag-foreground-yellow: var(--color-fg-main-500);
  --color-component-tag-foreground-aqua: var(--color-aqua-500);
  --color-component-tag-foreground-green: var(--color-green-500);
  --color-component-tag-foreground-blue: var(--color-blue-400);
  --color-component-tag-foreground-purple: var(--color-purple-500);
  --color-component-tag-foreground-grey: var(--color-neutral-20);
  --color-component-tag-foreground-light-grey: var(--color-neutral-30);
  --color-component-nav-logobar: var(--color-neutral-89);
  --color-component-nav-trade-nav: var(--color-fg-sec-500);
  --color-component-nav-trade-btn-active: var(--color-fg-sec-600);
  --color-component-nav-trade-btn-default: var(--color-fg-sec-500);
  --color-component-web-frame-shadow-default: var(--color-black-a50);
  --color-component-chart-chart1: var(--color-fg-main-500);
  --color-component-chart-chart2: var(--color-fg-main-400);
  --color-component-chart-chart3: var(--color-fg-main-300);
  --color-component-chart-chart4: var(--color-fg-main-200);
  --color-component-chart-chart5: var(--color-fg-main-150);
  --color-component-chart-chart6: var(--color-fg-main-100);
  --color-component-chart-chart7: var(--color-fg-main-50);
  --color-component-chart-chart8: var(--color-fg-main-00);
  --color-component-chart-negative: var(--color-green-500);
  --color-component-locked-article-badge-background-normal: var(--color-neutral-00-white);
  --color-component-locked-article-badge-background-preview: var(--color-neutral-04);
  --color-component-locked-article-badge-foreground-unpaid: var(--color-neutral-60);
  --color-component-locked-article-badge-foreground-paid: var(--color-fg-main-500);
  --color-component-locked-article-badge-stroke-paid: var(--color-fg-main-100);
  --color-component-controll-button-background-default: var(--color-black-a20);
  --color-component-controll-button-background-hover: var(--color-black-a30);
  --color-component-heatmap-0: var(--color-neutral-70);
  --color-component-heatmap-2: var(--color-red-800);
  --color-component-heatmap-4: var(--color-red-700);
  --color-component-heatmap-6: var(--color-red-600);
  --color-component-heatmap-8: var(--color-red-500);
  --color-component-heatmap-10: var(--color-red-400);
  --color-component-realtime-mkt-flat-default: var(--color-neutral-46);
  --color-component-realtime-mkt-flat-active: var(--color-neutral-30);
  --color-component-realtime-mkt-flat-disabled: var(--color-neutral-80);
  --color-component-input-foreground-placeholder: var(--color-neutral-30);
  --color-component-input-foreground-value: var(--color-neutral-13);
  --color-component-input-foreground-disabled: var(--color-neutral-60);
  --color-component-input-foreground-required: var(--color-red-500);
  --color-component-input-foreground-error: var(--color-red-500);
  --color-component-input-stroke-default: var(--color-neutral-80);
  --color-component-input-stroke-focus: var(--color-fg-main-500);
  --color-component-input-stroke-error: var(--color-red-500);
  --color-component-callout-foreground-high: var(--color-red-300);
  --color-component-callout-foreground-medium: var(--color-fg-main-400);
  --color-component-callout-foreground-low: var(--color-neutral-46);
  --color-component-callout-background-high: var(--color-red-900);
  --color-component-callout-background-medium: var(--color-fg-main-900);
  --color-component-callout-background-low: var(--color-neutral-89);
  --color-component-stock-card-legend-background: var(--color-black-a80);
  --color-component-footer-background-primary: var(--color-neutral-89);
  --color-component-footer-background-secondary: var(--color-neutral-84);
}

/**
 * Do not edit directly, this file was auto-generated.
 */

[data-brand='primasia'] {
  --color-bg-stock-rise-extra-light: rgba(243, 116, 109, 0.15);
  --color-bg-stock-rise-default: #f3746d;
  --color-bg-stock-rise-dark: #d24139;
  --color-bg-stock-fall-extra-light: rgba(108, 156, 70, 0.15);
  --color-bg-stock-fall-default: #6c9c46;
  --color-bg-stock-fall-dark: #3f7316;
  --color-foreground-stock-rise-default: #f3746d;
  --color-foreground-stock-rise-hover: #d24139;
  --color-foreground-stock-fall-default: #6c9c46;
  --color-foreground-pnl-gain: #f3746d;
  --color-foreground-pnl-loss: #6c9c46;
  --color-component-controll-button-background-default: #ffffff;
  --color-component-controll-button-background-hover: #ffffff;
  --color-bg-screen-primary: var(--color-neutral-00-white);
  --color-bg-screen-secondary: var(--color-neutral-04);
  --color-bg-surface-container-default: var(--color-neutral-00-white);
  --color-bg-surface-container-active: var(--color-neutral-04);
  --color-bg-surface-container-hover: var(--color-neutral-02);
  --color-bg-surface-container-focus: var(--color-neutral-13);
  --color-bg-surface-container-disabled: var(--color-neutral-02);
  --color-bg-surface-subtle-default: var(--color-neutral-02);
  --color-bg-surface-subtle-active: var(--color-neutral-08);
  --color-bg-surface-subtle-disabled: var(--color-neutral-00-white);
  --color-bg-surface-variant-default: var(--color-neutral-04);
  --color-bg-surface-variant-active: var(--color-neutral-13);
  --color-bg-surface-variant-hover: var(--color-neutral-08);
  --color-bg-surface-variant-disabled: var(--color-neutral-02);
  --color-bg-surface-variant-high-default: var(--color-neutral-08);
  --color-bg-surface-variant-high-active: var(--color-neutral-20);
  --color-bg-surface-variant-high-hover: var(--color-neutral-13);
  --color-bg-surface-variant-high-disabled: var(--color-neutral-04);
  --color-bg-surface-inverse-default: var(--color-neutral-100-black);
  --color-bg-surface-inverse-hover: var(--color-neutral-70);
  --color-bg-surface-transparent-a90: var(--color-white-a90);
  --color-bg-surface-transparent-a0: var(--color-white-a0);
  --color-bg-highlight-primary-normal-default: var(--color-primasia-color-blue-medium);
  --color-bg-highlight-primary-normal-hover: var(--color-primasia-color-blue-medium);
  --color-bg-highlight-primary-normal-active: var(--color-blue-850);
  --color-bg-highlight-primary-normal-disabled: var(--color-primasia-color-blue-lighter);
  --color-bg-highlight-primary-light-default: var(--color-primasia-color-blue-lighter);
  --color-bg-highlight-secondary-normal-default: var(--color-neutral-67);
  --color-bg-highlight-secondary-normal-hover: var(--color-neutral-80);
  --color-bg-highlight-secondary-normal-active: var(--color-neutral-60);
  --color-bg-highlight-secondary-normal-disabled: var(--color-neutral-04);
  --color-bg-highlight-secondary-light-default: var(--color-primasia-color-sec-lighter);
  --color-bg-stock-flat-default: var(--color-neutral-46);
  --color-bg-status-error: var(--color-red-400);
  --color-bg-status-new: var(--color-red-400);
  --color-bg-status-danger-default: var(--color-red-500);
  --color-bg-status-danger-hover: var(--color-red-400);
  --color-bg-status-danger-active: var(--color-red-600);
  --color-bg-status-danger-disabled: var(--color-red-150);
  --color-bg-mask-mid: var(--color-black-a50);
  --color-foreground-primary-default: var(--color-neutral-80);
  --color-foreground-primary-hover: var(--color-neutral-70);
  --color-foreground-primary-disabled: var(--color-neutral-20);
  --color-foreground-secondary-default: var(--color-neutral-46);
  --color-foreground-secondary-hover: var(--color-neutral-30);
  --color-foreground-secondary-disabled: var(--color-neutral-20);
  --color-foreground-tertiary-default: var(--color-neutral-30);
  --color-foreground-tertiary-active: var(--color-neutral-60);
  --color-foreground-tertiary-disabled: var(--color-neutral-13);
  --color-foreground-highlight-normal-default: var(--color-primasia-color-blue-medium);
  --color-foreground-highlight-dark-default: var(--color-primasia-color-blue-medium);
  --color-foreground-highlight-dark-hover: var(--color-primasia-color-blue-medium);
  --color-foreground-stock-flat-default: var(--color-neutral-46);
  --color-foreground-pnl-even: var(--color-neutral-80);
  --color-foreground-inverted-primary-default: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover: var(--color-neutral-08);
  --color-foreground-inverted-primary-default-opposite: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover-opposite: var(--color-neutral-08);
  --color-foreground-inverted-secondary-default: var(--color-neutral-13);
  --color-foreground-inverted-tertiary-default: var(--color-neutral-46);
  --color-foreground-inverted-tertiary-default-opposite: var(--color-neutral-13);
  --color-foreground-link-text-default: var(--color-fg-sec-500);
  --color-foreground-link-text-hover: var(--color-fg-sec-400);
  --color-foreground-link-text-disabled: var(--color-fg-sec-100);
  --color-foreground-link-underline-default: var(--color-fg-sec-500);
  --color-foreground-link-underline-hover: var(--color-fg-sec-400);
  --color-foreground-status-danger: var(--color-red-500);
  --color-foreground-status-success-default: var(--color-green-500);
  --color-foreground-status-success-hover: var(--color-green-400);
  --color-foreground-status-warning-default: var(--color-fg-main-600);
  --color-foreground-status-warning-hover: var(--color-fg-main-500);
  --color-foreground-status-error-default: var(--color-red-500);
  --color-foreground-status-error-hover: var(--color-red-400);
  --color-foreground-odd-default: var(--color-primasia-color-sec-main);
  --color-stroke-inverse: var(--color-neutral-100-black);
  --color-stroke-heavy: var(--color-neutral-13);
  --color-stroke-default: var(--color-neutral-08);
  --color-stroke-subtle: var(--color-neutral-04);
  --color-stroke-minimal: var(--color-neutral-02);
  --color-component-trade-toast-bg: var(--color-neutral-80);
  --color-component-trade-toast-deal: var(--color-fg-main-500);
  --color-component-trade-toast-successful: var(--color-blue-500);
  --color-component-trade-toast-error: var(--color-red-400);
  --color-component-segment-bg: var(--color-neutral-08);
  --color-component-segment-selected: var(--color-neutral-00-white);
  --color-component-selection-default: var(--color-fg-sec-500);
  --color-component-tooltip-background-default: var(--color-neutral-80);
  --color-component-tooltip-background-light: var(--color-neutral-00-white);
  --color-component-datepicker-background-active: var(--color-neutral-04);
  --color-component-tag-background-normal-red: var(--color-red-50);
  --color-component-tag-background-normal-pink: var(--color-pink-50);
  --color-component-tag-background-normal-orange: var(--color-orange-50);
  --color-component-tag-background-normal-brown: var(--color-brown-50);
  --color-component-tag-background-normal-yellow: var(--color-fg-main-50);
  --color-component-tag-background-normal-aqua: var(--color-aqua-50);
  --color-component-tag-background-normal-green: var(--color-green-50);
  --color-component-tag-background-normal-blue: var(--color-blue-50);
  --color-component-tag-background-normal-purple: var(--color-purple-50);
  --color-component-tag-background-normal-grey: var(--color-neutral-08);
  --color-component-tag-background-normal-light-grey: var(--color-neutral-04);
  --color-component-tag-background-inverse-red: var(--color-red-600);
  --color-component-tag-background-inverse-black: var(--color-neutral-100-black);
  --color-component-tag-foreground-red: var(--color-red-600);
  --color-component-tag-foreground-pink: var(--color-pink-600);
  --color-component-tag-foreground-orange: var(--color-orange-600);
  --color-component-tag-foreground-brown: var(--color-brown-600);
  --color-component-tag-foreground-yellow: var(--color-fg-main-600);
  --color-component-tag-foreground-aqua: var(--color-aqua-600);
  --color-component-tag-foreground-green: var(--color-green-600);
  --color-component-tag-foreground-blue: var(--color-blue-600);
  --color-component-tag-foreground-purple: var(--color-purple-600);
  --color-component-tag-foreground-grey: var(--color-neutral-60);
  --color-component-tag-foreground-light-grey: var(--color-neutral-46);
  --color-component-nav-logobar: var(--color-primasia-color-blue-main);
  --color-component-nav-trade-nav: var(--color-primasia-color-blue-main);
  --color-component-nav-trade-btn-active: var(--color-primasia-color-blue-medium);
  --color-component-nav-trade-btn-default: var(--color-primasia-color-blue-main);
  --color-component-web-frame-shadow-default: var(--color-black-a8);
  --color-component-chart-chart1: var(--color-primasia-color-blue-main);
  --color-component-chart-chart2: var(--color-primasia-color-blue-medium);
  --color-component-chart-chart3: var(--color-primasia-color-blue-light);
  --color-component-chart-chart4: var(--color-primasia-color-blue-lighter);
  --color-component-chart-chart5: var(--color-fg-main-150);
  --color-component-chart-chart6: var(--color-fg-main-300);
  --color-component-chart-chart7: var(--color-primasia-color-sec-main);
  --color-component-chart-chart8: var(--color-fg-main-850);
  --color-component-chart-negative: var(--color-green-500);
  --color-component-locked-article-badge-background-normal: var(--color-neutral-00-white);
  --color-component-locked-article-badge-background-preview: var(--color-neutral-04);
  --color-component-locked-article-badge-foreground-unpaid: var(--color-neutral-60);
  --color-component-locked-article-badge-foreground-paid: var(--color-fg-main-500);
  --color-component-locked-article-badge-stroke-paid: var(--color-fg-main-100);
  --color-component-heatmap-0: var(--color-green-400);
  --color-component-heatmap-2: var(--color-red-100);
  --color-component-heatmap-4: var(--color-red-100);
  --color-component-heatmap-6: var(--color-red-100);
  --color-component-heatmap-8: var(--color-red-100);
  --color-component-heatmap-10: var(--color-red-100);
  --color-component-realtime-mkt-fall-default: var(--color-green-500);
  --color-component-realtime-mkt-fall-active: var(--color-green-600);
  --color-component-realtime-mkt-fall-disabled: var(--color-green-100);
  --color-component-realtime-mkt-flat-default: var(--color-neutral-46);
  --color-component-realtime-mkt-flat-active: var(--color-neutral-60);
  --color-component-realtime-mkt-flat-disabled: var(--color-neutral-20);
  --color-component-realtime-mkt-rise-default: var(--color-red-500);
  --color-component-realtime-mkt-rise-active: var(--color-red-600);
  --color-component-realtime-mkt-rise-disabled: var(--color-red-100);
  --color-component-input-foreground-placeholder: var(--color-neutral-30);
  --color-component-input-foreground-value: var(--color-neutral-80);
  --color-component-input-foreground-disabled: var(--color-neutral-20);
  --color-component-input-foreground-required: var(--color-red-600);
  --color-component-input-foreground-error: var(--color-red-600);
  --color-component-input-stroke-default: var(--color-neutral-08);
  --color-component-input-stroke-focus: var(--color-primasia-color-blue-main);
  --color-component-input-stroke-error: var(--color-red-600);
  --color-component-callout-foreground-high: var(--color-red-700);
  --color-component-callout-foreground-medium: var(--color-fg-main-600);
  --color-component-callout-foreground-low: var(--color-neutral-30);
  --color-component-callout-background-high: var(--color-red-50);
  --color-component-callout-background-medium: var(--color-fg-main-50);
  --color-component-callout-background-low: var(--color-neutral-02);
  --color-component-stock-card-legend-background: var(--color-white-a80);
  --color-component-footer-background-primary: var(--color-neutral-93);
  --color-component-footer-background-secondary: var(--color-neutral-87);
}

/**
 * Do not edit directly, this file was auto-generated.
 */

[data-theme='dark'] [data-brand='primasia'],
[data-theme='dark'][data-brand='primasia'] {
  --color-bg-stock-rise-extra-light: rgba(255, 55, 55, 0.2);
  --color-bg-stock-rise-default: #ff3737;
  --color-bg-stock-rise-dark: #c71919;
  --color-bg-stock-fall-extra-light: rgba(111, 218, 26, 0.2);
  --color-bg-stock-fall-default: #6fda1a;
  --color-bg-stock-fall-dark: #3f7316;
  --color-foreground-stock-rise-default: #ff3737;
  --color-foreground-stock-rise-hover: #c71919;
  --color-foreground-stock-fall-default: #6fda1a;
  --color-foreground-pnl-gain: #ff3737;
  --color-foreground-pnl-loss: #6fda1a;
  --color-component-controll-button-background-default: #ffffff;
  --color-component-controll-button-background-hover: #ffffff;
  --color-bg-screen-primary: var(--color-neutral-93);
  --color-bg-screen-secondary: var(--color-neutral-100-black);
  --color-bg-surface-container-default: var(--color-neutral-89);
  --color-bg-surface-container-active: var(--color-neutral-84);
  --color-bg-surface-container-hover: var(--color-neutral-84);
  --color-bg-surface-container-focus: var(--color-neutral-70);
  --color-bg-surface-container-disabled: var(--color-neutral-87);
  --color-bg-surface-subtle-default: var(--color-neutral-87);
  --color-bg-surface-subtle-active: var(--color-neutral-80);
  --color-bg-surface-subtle-disabled: var(--color-neutral-89);
  --color-bg-surface-variant-default: var(--color-neutral-84);
  --color-bg-surface-variant-active: var(--color-neutral-56);
  --color-bg-surface-variant-hover: var(--color-neutral-70);
  --color-bg-surface-variant-disabled: var(--color-neutral-87);
  --color-bg-surface-variant-high-default: var(--color-neutral-80);
  --color-bg-surface-variant-high-active: var(--color-neutral-30);
  --color-bg-surface-variant-high-hover: var(--color-neutral-56);
  --color-bg-surface-variant-high-disabled: var(--color-neutral-84);
  --color-bg-surface-inverse-default: var(--color-neutral-00-white);
  --color-bg-surface-inverse-hover: var(--color-neutral-08);
  --color-bg-surface-transparent-a90: var(--color-black-a90);
  --color-bg-surface-transparent-a0: var(--color-black-a0);
  --color-bg-highlight-primary-normal-default: var(--color-primasia-color-blue-medium);
  --color-bg-highlight-primary-normal-hover: var(--color-primasia-color-blue-medium);
  --color-bg-highlight-primary-normal-active: var(--color-blue-600);
  --color-bg-highlight-primary-normal-disabled: var(--color-primasia-color-blue-main);
  --color-bg-highlight-primary-light-default: var(--color-primasia-color-blue-medium);
  --color-bg-highlight-secondary-normal-default: var(--color-neutral-67);
  --color-bg-highlight-secondary-normal-hover: var(--color-neutral-46);
  --color-bg-highlight-secondary-normal-active: var(--color-neutral-60);
  --color-bg-highlight-secondary-normal-disabled: var(--color-neutral-80);
  --color-bg-highlight-secondary-light-default: var(--color-primasia-color-sec-dark);
  --color-bg-stock-flat-default: var(--color-neutral-46);
  --color-bg-status-error: var(--color-red-500);
  --color-bg-status-new: var(--color-red-500);
  --color-bg-status-danger-default: var(--color-red-600);
  --color-bg-status-danger-hover: var(--color-red-500);
  --color-bg-status-danger-active: var(--color-red-700);
  --color-bg-status-danger-disabled: var(--color-red-900);
  --color-bg-mask-mid: var(--color-black-a50);
  --color-foreground-primary-default: var(--color-neutral-13);
  --color-foreground-primary-hover: var(--color-neutral-30);
  --color-foreground-primary-disabled: var(--color-neutral-60);
  --color-foreground-secondary-default: var(--color-neutral-46);
  --color-foreground-secondary-hover: var(--color-neutral-30);
  --color-foreground-secondary-disabled: var(--color-neutral-20);
  --color-foreground-tertiary-default: var(--color-neutral-60);
  --color-foreground-tertiary-active: var(--color-neutral-30);
  --color-foreground-tertiary-disabled: var(--color-neutral-67);
  --color-foreground-highlight-normal-default: var(--color-primasia-color-blue-light);
  --color-foreground-highlight-dark-default: var(--color-primasia-color-blue-light);
  --color-foreground-highlight-dark-hover: var(--color-primasia-color-blue-light);
  --color-foreground-stock-flat-default: var(--color-neutral-46);
  --color-foreground-pnl-even: var(--color-neutral-13);
  --color-foreground-inverted-primary-default: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover: var(--color-neutral-08);
  --color-foreground-inverted-primary-default-opposite: var(--color-neutral-80);
  --color-foreground-inverted-primary-hover-opposite: var(--color-neutral-60);
  --color-foreground-inverted-secondary-default: var(--color-neutral-13);
  --color-foreground-inverted-tertiary-default: var(--color-neutral-46);
  --color-foreground-inverted-tertiary-default-opposite: var(--color-neutral-80);
  --color-foreground-link-text-default: var(--color-fg-sec-400);
  --color-foreground-link-text-hover: var(--color-fg-sec-300);
  --color-foreground-link-text-disabled: var(--color-fg-sec-800);
  --color-foreground-link-underline-default: var(--color-fg-sec-400);
  --color-foreground-link-underline-hover: var(--color-fg-sec-300);
  --color-foreground-status-danger: var(--color-red-500);
  --color-foreground-status-success-default: var(--color-green-500);
  --color-foreground-status-success-hover: var(--color-green-400);
  --color-foreground-status-warning-default: var(--color-fg-main-600);
  --color-foreground-status-warning-hover: var(--color-fg-main-500);
  --color-foreground-status-error-default: var(--color-red-500);
  --color-foreground-status-error-hover: var(--color-red-400);
  --color-foreground-odd-default: var(--color-primasia-color-sec-main);
  --color-stroke-inverse: var(--color-neutral-00-white);
  --color-stroke-heavy: var(--color-neutral-67);
  --color-stroke-default: var(--color-neutral-80);
  --color-stroke-subtle: var(--color-neutral-84);
  --color-stroke-minimal: var(--color-neutral-87);
  --color-component-trade-toast-bg: var(--color-neutral-67);
  --color-component-trade-toast-deal: var(--color-fg-main-500);
  --color-component-trade-toast-successful: var(--color-blue-500);
  --color-component-trade-toast-error: var(--color-red-400);
  --color-component-segment-bg: var(--color-neutral-80);
  --color-component-segment-selected: var(--color-neutral-70);
  --color-component-selection-default: var(--color-fg-sec-500);
  --color-component-tooltip-background-default: var(--color-neutral-67);
  --color-component-tooltip-background-light: var(--color-neutral-67);
  --color-component-datepicker-background-active: var(--color-neutral-87);
  --color-component-tag-background-normal-red: var(--color-red-950);
  --color-component-tag-background-normal-pink: var(--color-pink-950);
  --color-component-tag-background-normal-orange: var(--color-orange-950);
  --color-component-tag-background-normal-brown: var(--color-brown-900);
  --color-component-tag-background-normal-yellow: var(--color-fg-main-950);
  --color-component-tag-background-normal-aqua: var(--color-aqua-950);
  --color-component-tag-background-normal-green: var(--color-green-800);
  --color-component-tag-background-normal-blue: var(--color-blue-850);
  --color-component-tag-background-normal-purple: var(--color-purple-950);
  --color-component-tag-background-normal-grey: var(--color-neutral-70);
  --color-component-tag-background-normal-light-grey: var(--color-neutral-80);
  --color-component-tag-background-inverse-red: var(--color-red-600);
  --color-component-tag-background-inverse-black: var(--color-neutral-00-white);
  --color-component-tag-foreground-red: var(--color-red-400);
  --color-component-tag-foreground-pink: var(--color-pink-500);
  --color-component-tag-foreground-orange: var(--color-orange-500);
  --color-component-tag-foreground-brown: var(--color-brown-500);
  --color-component-tag-foreground-yellow: var(--color-fg-main-500);
  --color-component-tag-foreground-aqua: var(--color-aqua-500);
  --color-component-tag-foreground-green: var(--color-green-500);
  --color-component-tag-foreground-blue: var(--color-blue-400);
  --color-component-tag-foreground-purple: var(--color-purple-500);
  --color-component-tag-foreground-grey: var(--color-neutral-20);
  --color-component-tag-foreground-light-grey: var(--color-neutral-30);
  --color-component-nav-logobar: var(--color-primasia-color-blue-main);
  --color-component-nav-trade-nav: var(--color-primasia-color-blue-main);
  --color-component-nav-trade-btn-active: var(--color-primasia-color-blue-medium);
  --color-component-nav-trade-btn-default: var(--color-primasia-color-blue-main);
  --color-component-web-frame-shadow-default: var(--color-black-a50);
  --color-component-chart-chart1: var(--color-primasia-color-blue-medium);
  --color-component-chart-chart2: var(--color-fg-sec-600);
  --color-component-chart-chart3: var(--color-primasia-color-blue-light);
  --color-component-chart-chart4: var(--color-primasia-color-blue-lighter);
  --color-component-chart-chart5: var(--color-fg-main-150);
  --color-component-chart-chart6: var(--color-fg-main-300);
  --color-component-chart-chart7: var(--color-primasia-color-sec-main);
  --color-component-chart-chart8: var(--color-fg-main-850);
  --color-component-chart-negative: var(--color-green-500);
  --color-component-locked-article-badge-background-normal: var(--color-neutral-00-white);
  --color-component-locked-article-badge-background-preview: var(--color-neutral-04);
  --color-component-locked-article-badge-foreground-unpaid: var(--color-neutral-60);
  --color-component-locked-article-badge-foreground-paid: var(--color-fg-main-500);
  --color-component-locked-article-badge-stroke-paid: var(--color-fg-main-100);
  --color-component-heatmap-0: var(--color-green-600);
  --color-component-heatmap-2: var(--color-red-700);
  --color-component-heatmap-4: var(--color-red-700);
  --color-component-heatmap-6: var(--color-red-700);
  --color-component-heatmap-8: var(--color-red-700);
  --color-component-heatmap-10: var(--color-red-700);
  --color-component-realtime-mkt-fall-default: var(--color-green-500);
  --color-component-realtime-mkt-fall-active: var(--color-green-400);
  --color-component-realtime-mkt-fall-disabled: var(--color-green-900);
  --color-component-realtime-mkt-flat-default: var(--color-neutral-46);
  --color-component-realtime-mkt-flat-active: var(--color-neutral-30);
  --color-component-realtime-mkt-flat-disabled: var(--color-neutral-80);
  --color-component-realtime-mkt-rise-default: var(--color-red-500);
  --color-component-realtime-mkt-rise-active: var(--color-red-400);
  --color-component-realtime-mkt-rise-disabled: var(--color-red-900);
  --color-component-input-foreground-placeholder: var(--color-neutral-30);
  --color-component-input-foreground-value: var(--color-neutral-13);
  --color-component-input-foreground-disabled: var(--color-neutral-60);
  --color-component-input-foreground-required: var(--color-red-500);
  --color-component-input-foreground-error: var(--color-red-500);
  --color-component-input-stroke-default: var(--color-neutral-80);
  --color-component-input-stroke-focus: var(--color-primasia-color-blue-medium);
  --color-component-input-stroke-error: var(--color-red-500);
  --color-component-callout-foreground-high: var(--color-red-300);
  --color-component-callout-foreground-medium: var(--color-fg-main-400);
  --color-component-callout-foreground-low: var(--color-neutral-46);
  --color-component-callout-background-high: var(--color-red-900);
  --color-component-callout-background-medium: var(--color-fg-main-900);
  --color-component-callout-background-low: var(--color-neutral-89);
  --color-component-stock-card-legend-background: var(--color-black-a80);
  --color-component-footer-background-primary: var(--color-neutral-89);
  --color-component-footer-background-secondary: var(--color-neutral-84);
}

/**
 * Do not edit directly, this file was auto-generated.
 */

[data-brand='rsc'] {
  --color-bg-stock-rise-extra-light: rgba(243, 116, 109, 0.15);
  --color-bg-stock-rise-default: #f3746d;
  --color-bg-stock-rise-dark: #d24139;
  --color-bg-stock-fall-extra-light: rgba(108, 156, 70, 0.15);
  --color-bg-stock-fall-default: #6c9c46;
  --color-bg-stock-fall-dark: #3f7316;
  --color-foreground-stock-rise-default: #f3746d;
  --color-foreground-stock-rise-hover: #d24139;
  --color-foreground-stock-fall-default: #6c9c46;
  --color-foreground-pnl-gain: #e83c3c;
  --color-foreground-pnl-loss: #339c09;
  --color-component-controll-button-background-default: #ffffff;
  --color-component-controll-button-background-hover: #ffffff;
  --color-bg-screen-primary: var(--color-neutral-00-white);
  --color-bg-screen-secondary: var(--color-neutral-04);
  --color-bg-surface-container-default: var(--color-neutral-00-white);
  --color-bg-surface-container-active: var(--color-neutral-04);
  --color-bg-surface-container-hover: var(--color-neutral-02);
  --color-bg-surface-container-focus: var(--color-neutral-13);
  --color-bg-surface-container-disabled: var(--color-neutral-02);
  --color-bg-surface-subtle-default: var(--color-neutral-02);
  --color-bg-surface-subtle-active: var(--color-neutral-08);
  --color-bg-surface-subtle-disabled: var(--color-neutral-00-white);
  --color-bg-surface-variant-default: var(--color-neutral-04);
  --color-bg-surface-variant-active: var(--color-neutral-13);
  --color-bg-surface-variant-hover: var(--color-neutral-08);
  --color-bg-surface-variant-disabled: var(--color-neutral-02);
  --color-bg-surface-variant-high-default: var(--color-neutral-08);
  --color-bg-surface-variant-high-active: var(--color-neutral-20);
  --color-bg-surface-variant-high-hover: var(--color-neutral-13);
  --color-bg-surface-variant-high-disabled: var(--color-neutral-04);
  --color-bg-surface-inverse-default: var(--color-neutral-100-black);
  --color-bg-surface-inverse-hover: var(--color-neutral-70);
  --color-bg-surface-transparent-a90: var(--color-white-a90);
  --color-bg-surface-transparent-a0: var(--color-white-a0);
  --color-bg-highlight-primary-normal-default: var(--color-rsc-color-orange-500);
  --color-bg-highlight-primary-normal-hover: var(--color-rsc-color-orange-500);
  --color-bg-highlight-primary-normal-active: var(--color-orange-600);
  --color-bg-highlight-primary-normal-disabled: var(--color-orange-150);
  --color-bg-highlight-primary-light-default: var(--color-orange-50);
  --color-bg-highlight-secondary-normal-default: var(--color-neutral-67);
  --color-bg-highlight-secondary-normal-hover: var(--color-neutral-80);
  --color-bg-highlight-secondary-normal-active: var(--color-neutral-60);
  --color-bg-highlight-secondary-normal-disabled: var(--color-neutral-04);
  --color-bg-highlight-secondary-light-default: var(--color-fg-sec-50);
  --color-bg-stock-flat-default: var(--color-neutral-46);
  --color-bg-status-error: var(--color-red-400);
  --color-bg-status-new: var(--color-red-400);
  --color-bg-status-danger-default: var(--color-red-500);
  --color-bg-status-danger-hover: var(--color-red-400);
  --color-bg-status-danger-active: var(--color-red-600);
  --color-bg-status-danger-disabled: var(--color-red-150);
  --color-bg-mask-mid: var(--color-black-a50);
  --color-foreground-primary-default: var(--color-neutral-80);
  --color-foreground-primary-hover: var(--color-neutral-70);
  --color-foreground-primary-disabled: var(--color-neutral-20);
  --color-foreground-secondary-default: var(--color-neutral-46);
  --color-foreground-secondary-hover: var(--color-neutral-30);
  --color-foreground-secondary-disabled: var(--color-neutral-20);
  --color-foreground-tertiary-default: var(--color-neutral-30);
  --color-foreground-tertiary-active: var(--color-neutral-60);
  --color-foreground-tertiary-disabled: var(--color-neutral-13);
  --color-foreground-highlight-normal-default: var(--color-rsc-color-orange-500);
  --color-foreground-highlight-dark-default: var(--color-rsc-color-orange-500);
  --color-foreground-highlight-dark-hover: var(--color-rsc-color-orange-500);
  --color-foreground-stock-flat-default: var(--color-neutral-46);
  --color-foreground-pnl-even: var(--color-neutral-80);
  --color-foreground-inverted-primary-default: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover: var(--color-neutral-08);
  --color-foreground-inverted-primary-default-opposite: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover-opposite: var(--color-neutral-08);
  --color-foreground-inverted-secondary-default: var(--color-neutral-13);
  --color-foreground-inverted-tertiary-default: var(--color-neutral-46);
  --color-foreground-inverted-tertiary-default-opposite: var(--color-neutral-13);
  --color-foreground-link-text-default: var(--color-fg-sec-500);
  --color-foreground-link-text-hover: var(--color-fg-sec-400);
  --color-foreground-link-text-disabled: var(--color-fg-sec-100);
  --color-foreground-link-underline-default: var(--color-neutral-60);
  --color-foreground-link-underline-hover: var(--color-neutral-46);
  --color-foreground-status-danger: var(--color-red-500);
  --color-foreground-status-success-default: var(--color-green-500);
  --color-foreground-status-success-hover: var(--color-green-400);
  --color-foreground-status-warning-default: var(--color-fg-main-600);
  --color-foreground-status-warning-hover: var(--color-fg-main-500);
  --color-foreground-status-error-default: var(--color-red-500);
  --color-foreground-status-error-hover: var(--color-red-400);
  --color-foreground-odd-default: var(--color-fg-sec-500);
  --color-stroke-inverse: var(--color-neutral-100-black);
  --color-stroke-heavy: var(--color-neutral-13);
  --color-stroke-default: var(--color-neutral-08);
  --color-stroke-subtle: var(--color-neutral-04);
  --color-stroke-minimal: var(--color-neutral-02);
  --color-component-trade-toast-bg: var(--color-neutral-80);
  --color-component-trade-toast-deal: var(--color-fg-main-500);
  --color-component-trade-toast-successful: var(--color-blue-500);
  --color-component-trade-toast-error: var(--color-red-400);
  --color-component-segment-bg: var(--color-neutral-08);
  --color-component-segment-selected: var(--color-neutral-00-white);
  --color-component-selection-default: var(--color-fg-sec-500);
  --color-component-tooltip-background-default: var(--color-neutral-80);
  --color-component-tooltip-background-light: var(--color-neutral-00-white);
  --color-component-datepicker-background-active: var(--color-neutral-04);
  --color-component-tag-background-normal-red: var(--color-red-50);
  --color-component-tag-background-normal-pink: var(--color-pink-50);
  --color-component-tag-background-normal-orange: var(--color-orange-50);
  --color-component-tag-background-normal-brown: var(--color-brown-50);
  --color-component-tag-background-normal-yellow: var(--color-fg-main-50);
  --color-component-tag-background-normal-aqua: var(--color-aqua-50);
  --color-component-tag-background-normal-green: var(--color-green-50);
  --color-component-tag-background-normal-blue: var(--color-blue-50);
  --color-component-tag-background-normal-purple: var(--color-purple-50);
  --color-component-tag-background-normal-grey: var(--color-neutral-08);
  --color-component-tag-background-normal-light-grey: var(--color-neutral-04);
  --color-component-tag-background-inverse-red: var(--color-red-600);
  --color-component-tag-background-inverse-black: var(--color-neutral-100-black);
  --color-component-tag-foreground-red: var(--color-red-600);
  --color-component-tag-foreground-pink: var(--color-pink-600);
  --color-component-tag-foreground-orange: var(--color-orange-600);
  --color-component-tag-foreground-brown: var(--color-brown-600);
  --color-component-tag-foreground-yellow: var(--color-fg-main-600);
  --color-component-tag-foreground-aqua: var(--color-aqua-600);
  --color-component-tag-foreground-green: var(--color-green-600);
  --color-component-tag-foreground-blue: var(--color-blue-600);
  --color-component-tag-foreground-purple: var(--color-purple-600);
  --color-component-tag-foreground-grey: var(--color-neutral-60);
  --color-component-tag-foreground-light-grey: var(--color-neutral-60);
  --color-component-nav-logobar: var(--color-rsc-color-orange-500);
  --color-component-nav-trade-nav: var(--color-rsc-color-orange-500);
  --color-component-nav-trade-btn-active: var(--color-neutral-89);
  --color-component-nav-trade-btn-default: var(--color-neutral-67);
  --color-component-web-frame-shadow-default: var(--color-black-a8);
  --color-component-chart-chart1: var(--color-orange-600);
  --color-component-chart-chart2: var(--color-orange-900);
  --color-component-chart-chart3: var(--color-orange-700);
  --color-component-chart-chart4: var(--color-orange-400);
  --color-component-chart-chart5: var(--color-orange-150);
  --color-component-chart-chart6: var(--color-orange-50);
  --color-component-chart-chart7: var(--color-neutral-30);
  --color-component-chart-chart8: var(--color-neutral-67);
  --color-component-chart-negative: var(--color-green-500);
  --color-component-locked-article-badge-background-normal: var(--color-neutral-00-white);
  --color-component-locked-article-badge-background-preview: var(--color-neutral-04);
  --color-component-locked-article-badge-foreground-unpaid: var(--color-neutral-60);
  --color-component-locked-article-badge-foreground-paid: var(--color-fg-main-500);
  --color-component-locked-article-badge-stroke-paid: var(--color-fg-main-100);
  --color-component-heatmap-0: var(--color-green-500);
  --color-component-heatmap-2: var(--color-red-100);
  --color-component-heatmap-4: var(--color-red-100);
  --color-component-heatmap-6: var(--color-red-100);
  --color-component-heatmap-8: var(--color-red-100);
  --color-component-heatmap-10: var(--color-red-100);
  --color-component-realtime-mkt-fall-default: var(--color-green-500);
  --color-component-realtime-mkt-fall-active: var(--color-green-600);
  --color-component-realtime-mkt-fall-disabled: var(--color-green-100);
  --color-component-realtime-mkt-flat-default: var(--color-neutral-46);
  --color-component-realtime-mkt-flat-active: var(--color-neutral-60);
  --color-component-realtime-mkt-flat-disabled: var(--color-neutral-20);
  --color-component-realtime-mkt-rise-default: var(--color-red-500);
  --color-component-realtime-mkt-rise-active: var(--color-red-600);
  --color-component-realtime-mkt-rise-disabled: var(--color-red-100);
  --color-component-input-foreground-placeholder: var(--color-neutral-30);
  --color-component-input-foreground-value: var(--color-neutral-80);
  --color-component-input-foreground-disabled: var(--color-neutral-20);
  --color-component-input-foreground-required: var(--color-red-600);
  --color-component-input-foreground-error: var(--color-red-600);
  --color-component-input-stroke-default: var(--color-neutral-08);
  --color-component-input-stroke-focus: var(--color-rsc-color-orange-500);
  --color-component-input-stroke-error: var(--color-red-600);
  --color-component-callout-foreground-high: var(--color-red-700);
  --color-component-callout-foreground-medium: var(--color-fg-main-600);
  --color-component-callout-foreground-low: var(--color-neutral-30);
  --color-component-callout-background-high: var(--color-red-50);
  --color-component-callout-background-medium: var(--color-fg-main-50);
  --color-component-callout-background-low: var(--color-neutral-02);
  --color-component-stock-card-legend-background: var(--color-white-a80);
  --color-component-footer-background-primary: var(--color-neutral-93);
  --color-component-footer-background-secondary: var(--color-neutral-87);
}

/**
 * Do not edit directly, this file was auto-generated.
 */

[data-theme='dark'] [data-brand='rsc'],
[data-theme='dark'][data-brand='rsc'] {
  --color-bg-stock-rise-extra-light: rgba(255, 55, 55, 0.2);
  --color-bg-stock-rise-default: #ff3737;
  --color-bg-stock-rise-dark: #c71919;
  --color-bg-stock-fall-extra-light: rgba(111, 218, 26, 0.2);
  --color-bg-stock-fall-default: #6fda1a;
  --color-bg-stock-fall-dark: #3f7316;
  --color-foreground-stock-rise-default: #ff3737;
  --color-foreground-stock-rise-hover: #c71919;
  --color-foreground-stock-fall-default: #6fda1a;
  --color-foreground-pnl-gain: #e83c3c;
  --color-foreground-pnl-loss: #6fda1a;
  --color-component-controll-button-background-default: #ffffff;
  --color-component-controll-button-background-hover: #ffffff;
  --color-bg-screen-primary: var(--color-neutral-93);
  --color-bg-screen-secondary: var(--color-neutral-100-black);
  --color-bg-surface-container-default: var(--color-neutral-89);
  --color-bg-surface-container-active: var(--color-neutral-84);
  --color-bg-surface-container-hover: var(--color-neutral-84);
  --color-bg-surface-container-focus: var(--color-neutral-70);
  --color-bg-surface-container-disabled: var(--color-neutral-87);
  --color-bg-surface-subtle-default: var(--color-neutral-87);
  --color-bg-surface-subtle-active: var(--color-neutral-80);
  --color-bg-surface-subtle-disabled: var(--color-neutral-89);
  --color-bg-surface-variant-default: var(--color-neutral-84);
  --color-bg-surface-variant-active: var(--color-neutral-56);
  --color-bg-surface-variant-hover: var(--color-neutral-70);
  --color-bg-surface-variant-disabled: var(--color-neutral-87);
  --color-bg-surface-variant-high-default: var(--color-neutral-80);
  --color-bg-surface-variant-high-active: var(--color-neutral-30);
  --color-bg-surface-variant-high-hover: var(--color-neutral-56);
  --color-bg-surface-variant-high-disabled: var(--color-neutral-84);
  --color-bg-surface-inverse-default: var(--color-neutral-00-white);
  --color-bg-surface-inverse-hover: var(--color-neutral-08);
  --color-bg-surface-transparent-a90: var(--color-black-a90);
  --color-bg-surface-transparent-a0: var(--color-black-a0);
  --color-bg-highlight-primary-normal-default: var(--color-rsc-color-orange-500);
  --color-bg-highlight-primary-normal-hover: var(--color-rsc-color-orange-500);
  --color-bg-highlight-primary-normal-active: var(--color-orange-500);
  --color-bg-highlight-primary-normal-disabled: var(--color-orange-950);
  --color-bg-highlight-primary-light-default: var(--color-orange-950);
  --color-bg-highlight-secondary-normal-default: var(--color-neutral-67);
  --color-bg-highlight-secondary-normal-hover: var(--color-neutral-46);
  --color-bg-highlight-secondary-normal-active: var(--color-neutral-60);
  --color-bg-highlight-secondary-normal-disabled: var(--color-neutral-80);
  --color-bg-highlight-secondary-light-default: var(--color-fg-sec-800);
  --color-bg-stock-flat-default: var(--color-neutral-46);
  --color-bg-status-error: var(--color-red-500);
  --color-bg-status-new: var(--color-red-500);
  --color-bg-status-danger-default: var(--color-red-600);
  --color-bg-status-danger-hover: var(--color-red-500);
  --color-bg-status-danger-active: var(--color-red-700);
  --color-bg-status-danger-disabled: var(--color-red-900);
  --color-bg-mask-mid: var(--color-black-a50);
  --color-foreground-primary-default: var(--color-neutral-13);
  --color-foreground-primary-hover: var(--color-neutral-30);
  --color-foreground-primary-disabled: var(--color-neutral-60);
  --color-foreground-secondary-default: var(--color-neutral-46);
  --color-foreground-secondary-hover: var(--color-neutral-30);
  --color-foreground-secondary-disabled: var(--color-neutral-20);
  --color-foreground-tertiary-default: var(--color-neutral-60);
  --color-foreground-tertiary-active: var(--color-neutral-30);
  --color-foreground-tertiary-disabled: var(--color-neutral-67);
  --color-foreground-highlight-normal-default: var(--color-orange-500);
  --color-foreground-highlight-dark-default: var(--color-orange-500);
  --color-foreground-highlight-dark-hover: var(--color-orange-500);
  --color-foreground-stock-flat-default: var(--color-neutral-46);
  --color-foreground-pnl-even: var(--color-neutral-13);
  --color-foreground-inverted-primary-default: var(--color-neutral-00-white);
  --color-foreground-inverted-primary-hover: var(--color-neutral-08);
  --color-foreground-inverted-primary-default-opposite: var(--color-neutral-80);
  --color-foreground-inverted-primary-hover-opposite: var(--color-neutral-60);
  --color-foreground-inverted-secondary-default: var(--color-neutral-13);
  --color-foreground-inverted-tertiary-default: var(--color-neutral-46);
  --color-foreground-inverted-tertiary-default-opposite: var(--color-neutral-80);
  --color-foreground-link-text-default: var(--color-fg-sec-400);
  --color-foreground-link-text-hover: var(--color-fg-sec-300);
  --color-foreground-link-text-disabled: var(--color-fg-sec-800);
  --color-foreground-link-underline-default: var(--color-neutral-60);
  --color-foreground-link-underline-hover: var(--color-neutral-67);
  --color-foreground-status-danger: var(--color-red-500);
  --color-foreground-status-success-default: var(--color-green-500);
  --color-foreground-status-success-hover: var(--color-green-400);
  --color-foreground-status-warning-default: var(--color-fg-main-600);
  --color-foreground-status-warning-hover: var(--color-fg-main-500);
  --color-foreground-status-error-default: var(--color-red-500);
  --color-foreground-status-error-hover: var(--color-red-400);
  --color-foreground-odd-default: var(--color-fg-sec-300);
  --color-stroke-inverse: var(--color-neutral-00-white);
  --color-stroke-heavy: var(--color-neutral-67);
  --color-stroke-default: var(--color-neutral-80);
  --color-stroke-subtle: var(--color-neutral-84);
  --color-stroke-minimal: var(--color-neutral-87);
  --color-component-trade-toast-bg: var(--color-neutral-67);
  --color-component-trade-toast-deal: var(--color-fg-main-500);
  --color-component-trade-toast-successful: var(--color-blue-500);
  --color-component-trade-toast-error: var(--color-red-400);
  --color-component-segment-bg: var(--color-neutral-80);
  --color-component-segment-selected: var(--color-neutral-70);
  --color-component-selection-default: var(--color-fg-sec-500);
  --color-component-tooltip-background-default: var(--color-neutral-67);
  --color-component-tooltip-background-light: var(--color-neutral-67);
  --color-component-datepicker-background-active: var(--color-neutral-87);
  --color-component-tag-background-normal-red: var(--color-red-950);
  --color-component-tag-background-normal-pink: var(--color-pink-950);
  --color-component-tag-background-normal-orange: var(--color-orange-950);
  --color-component-tag-background-normal-brown: var(--color-brown-900);
  --color-component-tag-background-normal-yellow: var(--color-fg-main-950);
  --color-component-tag-background-normal-aqua: var(--color-aqua-950);
  --color-component-tag-background-normal-green: var(--color-green-800);
  --color-component-tag-background-normal-blue: var(--color-blue-850);
  --color-component-tag-background-normal-purple: var(--color-purple-950);
  --color-component-tag-background-normal-grey: var(--color-neutral-70);
  --color-component-tag-background-normal-light-grey: var(--color-neutral-80);
  --color-component-tag-background-inverse-red: var(--color-red-600);
  --color-component-tag-background-inverse-black: var(--color-neutral-00-white);
  --color-component-tag-foreground-red: var(--color-red-400);
  --color-component-tag-foreground-pink: var(--color-pink-500);
  --color-component-tag-foreground-orange: var(--color-orange-500);
  --color-component-tag-foreground-brown: var(--color-brown-500);
  --color-component-tag-foreground-yellow: var(--color-fg-main-500);
  --color-component-tag-foreground-aqua: var(--color-aqua-500);
  --color-component-tag-foreground-green: var(--color-green-500);
  --color-component-tag-foreground-blue: var(--color-blue-400);
  --color-component-tag-foreground-purple: var(--color-purple-500);
  --color-component-tag-foreground-grey: var(--color-neutral-20);
  --color-component-tag-foreground-light-grey: var(--color-neutral-20);
  --color-component-nav-logobar: var(--color-rsc-color-orange-500);
  --color-component-nav-trade-nav: var(--color-rsc-color-orange-500);
  --color-component-nav-trade-btn-active: var(--color-neutral-89);
  --color-component-nav-trade-btn-default: var(--color-neutral-67);
  --color-component-web-frame-shadow-default: var(--color-black-a50);
  --color-component-chart-chart1: var(--color-orange-600);
  --color-component-chart-chart2: var(--color-orange-900);
  --color-component-chart-chart3: var(--color-orange-700);
  --color-component-chart-chart4: var(--color-orange-400);
  --color-component-chart-chart5: var(--color-orange-150);
  --color-component-chart-chart6: var(--color-orange-50);
  --color-component-chart-chart7: var(--color-neutral-30);
  --color-component-chart-chart8: var(--color-neutral-67);
  --color-component-chart-negative: var(--color-green-500);
  --color-component-locked-article-badge-background-normal: var(--color-neutral-00-white);
  --color-component-locked-article-badge-background-preview: var(--color-neutral-04);
  --color-component-locked-article-badge-foreground-unpaid: var(--color-neutral-60);
  --color-component-locked-article-badge-foreground-paid: var(--color-fg-main-500);
  --color-component-locked-article-badge-stroke-paid: var(--color-fg-main-100);
  --color-component-heatmap-0: var(--color-green-700);
  --color-component-heatmap-2: var(--color-red-700);
  --color-component-heatmap-4: var(--color-red-700);
  --color-component-heatmap-6: var(--color-red-700);
  --color-component-heatmap-8: var(--color-red-700);
  --color-component-heatmap-10: var(--color-red-700);
  --color-component-realtime-mkt-fall-default: var(--color-green-500);
  --color-component-realtime-mkt-fall-active: var(--color-green-400);
  --color-component-realtime-mkt-fall-disabled: var(--color-green-900);
  --color-component-realtime-mkt-flat-default: var(--color-neutral-46);
  --color-component-realtime-mkt-flat-active: var(--color-neutral-30);
  --color-component-realtime-mkt-flat-disabled: var(--color-neutral-80);
  --color-component-realtime-mkt-rise-default: var(--color-red-500);
  --color-component-realtime-mkt-rise-active: var(--color-red-400);
  --color-component-realtime-mkt-rise-disabled: var(--color-red-900);
  --color-component-input-foreground-placeholder: var(--color-neutral-30);
  --color-component-input-foreground-value: var(--color-neutral-13);
  --color-component-input-foreground-disabled: var(--color-neutral-60);
  --color-component-input-foreground-required: var(--color-red-500);
  --color-component-input-foreground-error: var(--color-red-500);
  --color-component-input-stroke-default: var(--color-neutral-80);
  --color-component-input-stroke-focus: var(--color-rsc-color-orange-500);
  --color-component-input-stroke-error: var(--color-red-500);
  --color-component-callout-foreground-high: var(--color-red-300);
  --color-component-callout-foreground-medium: var(--color-fg-main-400);
  --color-component-callout-foreground-low: var(--color-neutral-46);
  --color-component-callout-background-high: var(--color-red-900);
  --color-component-callout-background-medium: var(--color-fg-main-900);
  --color-component-callout-background-low: var(--color-neutral-89);
  --color-component-stock-card-legend-background: var(--color-black-a80);
  --color-component-footer-background-primary: var(--color-neutral-89);
  --color-component-footer-background-secondary: var(--color-neutral-84);
}



.grid-layout {
    position: relative;
    transition: height 200ms ease;
}

.grid-width-50 {
    width: 50%;
}

.grid-width-100 {
    width: 100%;
}

.grid-item {
    transition: all 200ms ease;
    transition-property: left, top, width;
    position: absolute;
    transform: translate3d(0, 0, 0);
}
.grid-item.cssTransforms {
    transition-property: transform;
}
.grid-item.resizing {
    z-index: 1;
    will-change: width, height;
}

.grid-item.draggable-dragging {
    transition: none;
    z-index: 3;
    will-change: transform;
}

.grid-item.grid-placeholder {
    opacity: 0.2;
    transition-duration: 100ms;
    z-index: 2;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.grid-item > .resizable-handle {
    position: absolute;
    width: 20px;
    height: 20px;
    bottom: 0;
    right: 0;
    cursor: se-resize;
}

.grid-item > .resizable-handle::after {
    content: '';
    position: absolute;
    right: 3px;
    bottom: 3px;
    width: 5px;
    height: 5px;
    border-right: 2px solid rgba(0, 0, 0, 0.4);
    border-bottom: 2px solid rgba(0, 0, 0, 0.4);
}

.grid-layout {
    position: relative;
    transition: height 200ms ease;
}

.grid-width-50 {
    width: 50%;
}

.grid-width-100 {
    width: 100%;
}

.grid-item {
    transition: all 200ms ease;
    transition-property: left, top, width;
    position: absolute;
    transform: translate3d(0, 0, 0);
}
.grid-item.cssTransforms {
    transition-property: transform;
}
.grid-item.resizing {
    z-index: 1;
    will-change: width, height;
}

.grid-item.draggable-dragging {
    transition: none;
    z-index: 3;
    will-change: transform;
}

.grid-item.grid-placeholder {
    opacity: 0.2;
    transition-duration: 100ms;
    z-index: 2;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.grid-item > .resizable-handle {
    position: absolute;
    width: 20px;
    height: 20px;
    bottom: 0;
    right: 0;
    cursor: se-resize;
}

.grid-item > .resizable-handle::after {
    content: '';
    position: absolute;
    right: 3px;
    bottom: 3px;
    width: 5px;
    height: 5px;
    border-right: 2px solid rgba(0, 0, 0, 0.4);
    border-bottom: 2px solid rgba(0, 0, 0, 0.4);
}