:root {
  color-scheme: light;

  /* Raw palette — light Robinhood-inspired (visual language only) */
  --km-color-yellow-400: #f5e66a;
  --km-color-yellow-500: #e8d44a;
  --km-color-yellow-vivid: #ffd60a;
  --km-color-amber-500: #c9a227;
  --km-color-amber-600: #a8861a;
  /* Amber text on light surfaces needs the 700 step to pass WCAG AA. */
  --km-color-amber-700: #7a6212;
  --km-color-green-500: #00c805;
  --km-color-green-600: #00b005;
  --km-color-green-700: #009604;
  /* Text-safe green: brand greens fail WCAG AA as small text on light surfaces (2.1-2.9:1). */
  --km-color-green-800: #046b05;
  --km-color-cyan-400: #5ac8fa;
  --km-color-cyan-500: #0a84ff;
  --km-color-blue-500: #0a84ff;
  --km-color-lime-400: #30d158;
  --km-color-purple-400: #bf5af2;
  --km-color-coral-400: #ff6961;
  --km-color-teal-400: #64d2ff;
  --km-color-red-500: #ff5000;
  --km-color-red-600: #e54800;
  --km-color-red-700: #cc3d00;
  /* Market down uses a true red so it never reads as a warning/amber state. */
  --km-color-rose-500: #e5484d;
  --km-color-rose-600: #cf3a3f;
  /* Market up sits one step darker than brand green to stay distinguishable. */
  --km-color-green-market: #0f9d58;
  --km-color-amber-400: #f0a020;
  --km-color-neutral-0: #ffffff;
  --km-color-neutral-50: #f7f7f7;
  --km-color-neutral-100: #f0f0f0;
  --km-color-neutral-200: #e8e8e8;
  --km-color-neutral-300: #c7c7c7;
  --km-color-neutral-400: #999999;
  --km-color-neutral-500: #6a6a6a;
  --km-color-neutral-600: #4a4a4a;
  --km-color-neutral-700: #2e2e2e;
  --km-color-neutral-800: #1a1a1a;
  --km-color-neutral-900: #0f0f0f;
  --km-color-neutral-950: #0b0b0b;
  --km-color-neutral-black: #000000;

  --km-space-0: 0;
  --km-space-1: 4px;
  --km-space-2: 8px;
  --km-space-3: 12px;
  --km-space-4: 16px;
  --km-space-5: 20px;
  --km-space-6: 24px;
  --km-space-8: 32px;
  --km-space-10: 40px;
  --km-space-12: 48px;
  --km-space-16: 64px;
  --km-space-20: 80px;
  --km-space-24: 96px;

  --km-radius-none: 0;
  --km-radius-sm: 2px;
  --km-radius-md: 4px;
  --km-radius-lg: 8px;
  --km-radius-xl: 12px;
  --km-v2-radius: 12px;
  --km-radius-full: 9999px;

  --km-v2-paper: #f7f8f3;
  --km-v2-ink: #18211b;
  --km-v2-gold: #f5c542;
  --km-v2-green: #276347;
  --km-v2-line: #e3e6dc;
  --km-v2-muted: #68715f;
  --km-v2-panel: #ffffff;
  --km-v2-green-tint: #edf4ea;

  --km-font-display: 'DM Sans', 'PingFang SC', 'Microsoft YaHei', 'Plus Jakarta Sans', system-ui, sans-serif;
  --km-font-ui:
    'DM Sans', 'PingFang SC', 'Microsoft YaHei', 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI',
    sans-serif;
  --km-font-mono: 'JetBrains Mono', 'IBM Plex Mono', Consolas, monospace;
  --km-font-size-caption: 12px;
  --km-font-size-compact: 14px;
  --km-font-size-meta: 14px;
  --km-font-size-body: 16px;
  --km-touch-target-min: 44px;
  --km-font-size-heading-sm: 18px;
  --km-font-size-heading-md: 22px;
  --km-font-size-heading-lg: 28px;
  --km-font-size-display-md: 44px;
  --km-font-size-display-lg: 56px;
  --km-leading-tight: 1.15;
  --km-leading-normal: 1.5;
  --km-leading-relaxed: 1.7;

  --km-duration-fast: 150ms;
  --km-duration-normal: 200ms;
  --km-duration-slow: 300ms;
  --km-motion-distance: 8px;

  --km-breakpoint-xs: 375px;
  --km-breakpoint-phone: 414px;
  --km-breakpoint-sm: 768px;
  --km-breakpoint-md: 1024px;
  --km-breakpoint-lg: 1180px;
  --km-breakpoint-xl: 1440px;
  --km-breakpoint-2xl: 1536px;
  --km-container-lg: var(--km-breakpoint-lg);
  --km-container-xl: var(--km-breakpoint-xl);

  /* Semantic surfaces — light */
  --km-color-surface-base: var(--km-v2-paper);
  --km-color-surface-panel: var(--km-v2-panel);
  --km-color-surface-raised: var(--km-v2-panel);
  /* Layering scale: canvas (page) → panel (card) → raised (focus) → sunken (inset rows). */
  --km-color-surface-canvas: var(--km-v2-paper);
  --km-color-surface-sunken: #f2f4f1;
  --km-color-surface-chart: #fafafa;
  --km-color-surface-chart-raised: #f5f5f5;
  --km-color-surface-card: var(--km-color-neutral-0);
  --km-color-surface-modal: var(--km-color-neutral-0);
  --km-color-surface-deep: var(--km-color-neutral-100);
  --km-color-surface-passport: var(--km-color-neutral-50);
  --km-color-surface-passport-panel: var(--km-color-neutral-0);
  --km-color-surface-trading: var(--km-color-neutral-50);
  --km-color-surface-trading-panel: var(--km-color-neutral-0);
  --km-color-surface-warning-panel: #fff8e8;
  --km-color-surface-control: var(--km-color-neutral-100);
  --km-color-surface-control-hover: var(--km-color-neutral-200);

  --km-color-text-primary: var(--km-v2-ink);
  --km-color-text-secondary: var(--km-v2-muted);
  /* Muted/faint text stays >= 4.5:1 on white so small labels remain readable. */
  --km-color-text-muted: var(--km-v2-muted);
  --km-color-text-faint: #5a5a5a;
  --km-color-border-subtle: var(--km-v2-line);
  --km-color-border-strong: var(--km-color-neutral-300);
  --km-color-border-bluegray: #dce3ea;
  --km-color-divider: var(--km-color-neutral-200);

  /* V2 action green is forest #276347; market-up stays a distinct chart green. */
  --km-color-gold-400: #f7d36a;
  --km-color-gold-500: var(--km-v2-gold);
  --km-color-gold-600: #d4a52e;
  --km-color-identity: var(--km-v2-gold);
  --km-color-identity-soft: color-mix(in srgb, var(--km-color-gold-500) 14%, transparent);
  --km-color-identity-border: color-mix(in srgb, var(--km-color-gold-500) 32%, transparent);
  --km-color-telemetry: var(--km-color-cyan-400);
  --km-color-telemetry-soft: color-mix(in srgb, var(--km-color-cyan-400) 12%, transparent);

  /* Highlight — vivid yellow accent for emphasis, scores, badges, attention CTAs */
  --km-color-highlight: var(--km-color-yellow-vivid);

  --km-color-action-primary: var(--km-v2-green);
  --km-color-action-secondary: #1e4f38;
  /* Use for green TEXT on light surfaces; action-primary is for fills/borders/icons only. */
  --km-color-action-text: var(--km-v2-green);
  --km-color-action-primary-hover: #1e4f38;
  --km-color-action-primary-active: #173f2c;
  --km-color-data: var(--km-color-cyan-500);
  --km-color-success: var(--km-color-green-500);
  --km-color-warning: var(--km-color-amber-500);
  --km-color-danger: var(--km-color-red-500);

  /* Market direction is a distinct semantic from brand action and warning. */
  --km-color-up: var(--km-color-green-market);
  --km-color-down: var(--km-color-rose-500);
  --km-color-up-soft: color-mix(in srgb, var(--km-color-green-market) 12%, transparent);
  --km-color-down-soft: color-mix(in srgb, var(--km-color-rose-500) 12%, transparent);
  --km-color-up-ink: #0b6b3d;
  --km-color-down-ink: #a32227;
  --km-color-brand-indigo: #5048e5;
  --km-color-brand-indigo-hover: #4338ca;
  --km-color-brand-orange: #ea9813;
  --km-color-brand-orange-hover: #d9860f;

  /* Home / product chrome — light RH */
  --km-color-home-bg: var(--km-color-surface-canvas);
  --km-color-home-bg-deep: #f5f5f5;
  /* Home surfaces mirror the shared layering scale. */
  --km-color-home-card: var(--km-color-neutral-0);
  --km-color-home-card-sunken: var(--km-color-surface-sunken);
  /* Story/marketing dark block keeps a green cast instead of pure black. */
  --km-color-home-ink-block: #12211a;
  --km-color-home-ink-block-soft: #172c22;
  --km-color-home-panel: #ffffff;
  --km-color-home-panel-hover: #f7f7f7;
  --km-color-home-glass: rgba(255, 255, 255, 0.92);
  --km-color-home-metric-panel: #fafafa;
  --km-color-home-ink: #0b0b0b;
  --km-color-home-ink-inverse: #ffffff;
  --km-color-home-ink-on-icon: #ffffff;
  --km-color-home-ink-on-light: #0b0b0b;
  --km-color-home-ink-on-panel: #0b0b0b;
  --km-color-home-ink-on-cyan: #0b0b0b;
  --km-color-home-ink-on-teal: #0b0b0b;
  --km-color-home-ink-on-yellow: #ffffff;
  --km-color-home-ink-on-warning: #0b0b0b;
  --km-color-home-ink-on-coral: #ffffff;
  --km-color-home-text-muted: #4a4a4a;
  --km-color-home-soft: rgba(11, 11, 11, 0.04);
  --km-color-home-line: rgba(11, 11, 11, 0.1);
  /* Brand/accent are the semantic names; home-yellow/home-teal remain aliases
     because a large amount of legacy home CSS still references them. */
  --km-color-home-brand: var(--km-color-action-primary);
  --km-color-home-brand-strong: var(--km-color-action-secondary);
  --km-color-home-yellow: var(--km-color-home-brand);
  --km-color-home-amber: var(--km-color-home-brand-strong);
  --km-color-home-warning: var(--km-color-amber-400);
  --km-color-home-teal: var(--km-color-home-brand-strong);
  --km-color-home-coral: var(--km-color-danger);
  --km-color-home-green: var(--km-color-up);
  --km-color-home-sky: #5ac8fa;
  --km-color-overlay-strong: rgba(11, 11, 11, 0.45);
  --km-color-chart-axis: rgba(11, 11, 11, 0.35);
  --km-color-chart-grid: rgba(11, 11, 11, 0.08);

  --km-color-text-primary-alpha-12: rgba(11, 11, 11, 0.12);
  --km-color-success-alpha-10: rgba(0, 200, 5, 0.1);
  --km-color-success-alpha-20: rgba(0, 200, 5, 0.2);
  --km-color-success-alpha-40: rgba(0, 200, 5, 0.4);
  --km-color-danger-alpha-20: rgba(255, 80, 0, 0.2);
  --km-color-danger-alpha-40: rgba(255, 80, 0, 0.4);
  --km-color-neutral-alpha-20: rgba(153, 153, 153, 0.2);
  --km-color-neutral-alpha-30: rgba(153, 153, 153, 0.3);
  --km-color-surface-control-alpha-20: rgba(240, 240, 240, 0.8);
  --km-color-surface-control-alpha-30: rgba(232, 232, 232, 0.9);
  --km-color-action-primary-alpha-10: rgba(0, 200, 5, 0.1);
  --km-color-action-primary-alpha-25: rgba(0, 200, 5, 0.25);
  --km-color-action-primary-alpha-40: rgba(0, 200, 5, 0.4);
  --km-color-action-primary-alpha-20: rgba(0, 200, 5, 0.2);
  --km-color-action-primary-alpha-30: rgba(0, 200, 5, 0.3);
  --km-color-action-primary-alpha-05: rgba(0, 200, 5, 0.05);
  --km-color-action-primary-alpha-50: rgba(0, 200, 5, 0.5);

  --km-color-highlight-alpha-05: rgba(255, 214, 10, 0.05);
  --km-color-highlight-alpha-06: rgba(255, 214, 10, 0.06);
  --km-color-highlight-alpha-10: rgba(255, 214, 10, 0.1);
  --km-color-highlight-alpha-20: rgba(255, 214, 10, 0.2);
  --km-color-highlight-alpha-25: rgba(255, 214, 10, 0.25);
  --km-color-highlight-alpha-30: rgba(255, 214, 10, 0.3);
  --km-color-highlight-alpha-35: rgba(255, 214, 10, 0.35);

  --km-chart-series-blue: var(--km-color-blue-500);
  --km-chart-series-lime: var(--km-color-lime-400);
  --km-chart-series-purple: var(--km-color-purple-400);
  --km-chart-series-yellow: var(--km-color-green-500);
  --km-chart-series-coral: var(--km-color-coral-400);
  --km-chart-series-teal: var(--km-color-teal-400);

  --km-space-page-x: var(--km-space-12);
  --km-space-section-y: var(--km-space-16);
  --km-space-panel: var(--km-space-6);
  --km-space-control-gap: var(--km-space-3);

  --km-button-primary-bg: var(--km-color-action-primary);
  --km-button-primary-fg: #f7f8f3;
  --km-button-secondary-bg: transparent;
  --km-button-secondary-fg: var(--km-color-text-primary);
  --km-button-secondary-border: var(--km-color-border-subtle);
  --km-button-danger-bg: var(--km-color-danger);
  --km-button-danger-fg: var(--km-color-neutral-0);
  --km-button-radius: var(--km-radius-lg);
  --km-button-height: var(--km-touch-target-min);
  --km-button-height-compact: 36px;
  --km-button-height-large: 48px;

  --km-market-card-bg: var(--km-color-surface-raised);
  --km-market-card-border: var(--km-color-border-subtle);
  --km-market-card-border-active: var(--km-color-action-primary);
  --km-market-card-radius: var(--km-radius-lg);
  --km-market-card-padding: var(--km-space-panel);

  --km-metric-tile-value-font: var(--km-font-mono);
  --km-metric-tile-value-color: var(--km-color-text-primary);
  --km-metric-tile-label-color: var(--km-color-text-muted);
  --km-metric-tile-delta-up: var(--km-color-up);
  --km-metric-tile-delta-down: var(--km-color-down);

  --km-status-badge-verified-bg: var(--km-color-identity);
  --km-status-badge-data-bg: var(--km-color-data);
  --km-status-badge-pending-bg: var(--km-color-warning);
  --km-status-badge-risk-bg: var(--km-color-danger);
  --km-status-badge-tradable-bg: var(--km-color-success);
  --km-status-badge-watch-bg: var(--km-color-telemetry);
  --km-status-badge-pause-bg: var(--km-color-danger);
  --km-status-badge-neutral-bg: var(--km-color-surface-panel);
  --km-status-badge-neutral-fg: var(--km-color-text-secondary);

  --km-price-ref-color: var(--km-color-text-primary);
  --km-price-ref-label-color: var(--km-color-telemetry);
  --km-price-exec-color: var(--km-color-text-primary);
  --km-price-exec-label-color: var(--km-color-action-primary);
  --km-price-delta-up: var(--km-color-up);
  --km-price-delta-down: var(--km-color-down);

  --km-state-panel-bg: var(--km-color-surface-panel);
  --km-state-panel-border: var(--km-color-border-subtle);
  --km-state-panel-radius: var(--km-radius-lg);

  --km-shadow-sm: 0 1px 2px rgba(11, 11, 11, 0.06);
  --km-shadow-md: 0 4px 16px rgba(11, 11, 11, 0.08);
  --km-shadow-lg: 0 12px 40px rgba(11, 11, 11, 0.1);
  --km-shadow-panel: 0 1px 0 rgba(11, 11, 11, 0.04), 0 8px 24px rgba(11, 11, 11, 0.06);
  /* Card resting/hover pair: elevation carries hierarchy instead of border colour. */
  --km-shadow-card: 0 1px 2px rgba(11, 16, 10, 0.05), 0 6px 18px rgba(11, 16, 10, 0.05);
  --km-shadow-card-hover: 0 2px 4px rgba(11, 16, 10, 0.06), 0 16px 34px rgba(11, 16, 10, 0.1);
  --km-focus-ring-color: var(--km-color-action-primary);
  --km-focus-ring-width: 2px;
  --km-focus-ring-offset: 2px;

  --km-z-header: 99;
  --km-z-mobile-nav: 98;
  --km-mobile-bottom-nav-size: 64px;
  /* iOS notch / status-bar inset for the fixed top header (0 elsewhere). */
  --km-header-top-inset: env(safe-area-inset-top, 0px);
  /* Full fixed-header height incl. notch — used for sticky/scroll offsets. */
  --km-header-height: calc(76px + var(--km-header-top-inset));
  --km-z-sticky: 50;
  --km-z-dropdown: 200;
  --km-z-modal: 400;
  --km-z-toast: 500;
  --km-status-badge-fg-on-color: var(--km-color-neutral-0);
  --km-status-badge-radius: var(--km-radius-sm);

  /* Aliases used by legacy CSS */
  --km-gradient-action: linear-gradient(90deg, var(--km-color-green-500), var(--km-color-green-600));
  --km-text-primary: var(--km-color-text-primary);
  --km-text-secondary: var(--km-color-text-secondary);
  --km-text-muted: var(--km-color-text-muted);
}

/*
 * Dark theme — activate with [data-km-theme='dark'] on <html>,
 * applied before first paint by the index.html bootstrap.
 * Graphite surfaces and soft gold actions are the approved C direction.
 *
 * Only SEMANTIC tokens are overridden; the raw palette above is shared.
 */
[data-km-theme='dark'] {
  color-scheme: dark;
  --km-button-primary-fg: #151816;
  --km-status-badge-fg-on-color: #151816;
  --km-color-action-primary-alpha-10: rgba(232, 189, 100, 0.1);
  --km-color-action-primary-alpha-20: rgba(232, 189, 100, 0.2);
  --km-color-action-primary-alpha-25: rgba(232, 189, 100, 0.25);
  --km-color-action-primary-alpha-30: rgba(232, 189, 100, 0.3);
  --km-color-action-primary-alpha-40: rgba(232, 189, 100, 0.4);
  --km-color-action-primary-alpha-50: rgba(232, 189, 100, 0.5);
  --km-color-fill-tertiary: #272e28;
  --text-secondary: #bcc3b9;
  --text-tertiary: #aab3a9;
  --text-success: #80c79d;
  --text-danger: #ef8587;
  --km-color-home-ink-on-yellow: #151816;
  --km-color-home-ink-on-icon: #151816;
  --km-color-home-ink-block: #111411;
  --km-color-home-ink-block-soft: #1b201c;
  --km-v2-paper: #151816;
  --km-v2-ink: #eef0e9;
  --km-v2-gold: #e8bd64;
  --km-v2-green: #e8bd64;
  --km-v2-line: #394039;
  --km-v2-muted: #aab3a9;
  --km-v2-panel: #202521;
  --km-v2-green-tint: #292c23;
  --km-color-success: #80c79d;
  --km-color-danger: #ef8587;
  --km-color-identity-ink: #151816;
  --km-focus-ring-color: #e8bd64;

  /* Surfaces — layering ladder canvas → panel → card → raised; sunken below canvas. */
  --km-color-surface-base: #151816;
  --km-color-surface-panel: #1b201c;
  --km-color-surface-raised: #202521;
  --km-color-surface-canvas: #151816;
  --km-color-surface-sunken: #111411;
  --km-color-surface-chart: #1b201c;
  --km-color-surface-chart-raised: #252b26;
  --km-color-surface-card: #202521;
  --km-color-surface-modal: #202521;
  --km-color-surface-deep: #111411;
  --km-color-surface-passport: var(--km-color-surface-panel);
  --km-color-surface-passport-panel: var(--km-color-surface-card);
  --km-color-surface-trading: var(--km-color-surface-base);
  --km-color-surface-trading-panel: var(--km-color-surface-card);
  --km-color-surface-warning-panel: #241d0b;
  --km-color-surface-control: #272e28;
  --km-color-surface-control-hover: #333b34;

  /* Text — all steps hold WCAG AA on the card/panel ladder. */
  --km-color-text-primary: #eef0e9;
  --km-color-text-secondary: #bcc3b9;
  --km-color-text-muted: #aab3a9;
  --km-color-text-faint: #9da79d;
  --km-color-border-subtle: rgba(255, 255, 255, 0.09);
  --km-color-border-strong: rgba(255, 255, 255, 0.16);
  --km-color-border-bluegray: #2a3430;
  --km-color-divider: rgba(255, 255, 255, 0.08);

  /* Soft gold actions remain distinct from green market and success states. */
  --km-color-action-primary: #e8bd64;
  --km-color-action-secondary: #f1ce83;
  --km-color-action-text: #e8bd64;
  --km-color-action-primary-hover: #f1ce83;
  --km-color-action-primary-active: #d5aa54;

  /* Identity shares the soft gold accent. */
  --km-color-identity: #e8bd64;

  /* Market direction — brighter variants read cleanly on near-black. */
  --km-color-up: #80c79d;
  --km-color-down: #ef8587;
  --km-color-up-ink: #80c79d;
  --km-color-down-ink: #ef8587;

  --km-color-warning: #e8bd64;

  /* Home / product chrome mirrors the shared ladder. */
  --km-color-home-bg: var(--km-color-surface-canvas);
  --km-color-home-bg-deep: #111411;
  --km-color-home-card: var(--km-color-surface-card);
  --km-color-home-card-sunken: var(--km-color-surface-sunken);
  --km-color-home-panel: #202521;
  --km-color-home-panel-hover: #202521;
  --km-color-home-glass: rgba(21, 24, 22, 0.96);
  --km-color-home-metric-panel: #1b201c;
  --km-color-home-ink: #eef0e9;
  --km-color-home-ink-inverse: #eef0e9;
  --km-color-home-ink-on-light: #eef0e9;
  --km-color-home-ink-on-panel: #eef0e9;
  --km-color-home-text-muted: #bcc3b9;
  --km-color-home-soft: rgba(255, 255, 255, 0.06);
  --km-color-home-line: rgba(255, 255, 255, 0.12);

  /* Overlays and chart chrome swap to white-alpha bases. */
  --km-color-overlay-strong: rgba(0, 0, 0, 0.6);
  --km-color-chart-axis: rgba(242, 245, 243, 0.4);
  --km-color-chart-grid: rgba(255, 255, 255, 0.09);

  --km-color-text-primary-alpha-12: rgba(242, 245, 243, 0.14);
  --km-color-neutral-alpha-20: rgba(153, 153, 153, 0.25);
  --km-color-neutral-alpha-30: rgba(153, 153, 153, 0.35);
  --km-color-surface-control-alpha-20: rgba(33, 42, 36, 0.8);
  --km-color-surface-control-alpha-30: rgba(43, 53, 47, 0.9);
  --km-color-highlight-alpha-05: rgba(255, 214, 10, 0.08);
  --km-color-highlight-alpha-06: rgba(255, 214, 10, 0.09);
  --km-color-action-primary-alpha-05: rgba(232, 189, 100, 0.08);
  --km-gradient-action: linear-gradient(90deg, #e8bd64, #f1ce83);
  --km-chart-series-yellow: #e8bd64;

  /* Elevation: shadows deepen, hairline glow replaces border contrast. */
  --km-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --km-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.45);
  --km-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.5);
  --km-shadow-panel: 0 0 0 1px rgba(255, 255, 255, 0.05), 0 8px 24px rgba(0, 0, 0, 0.4);
  --km-shadow-card: 0 0 0 1px rgba(255, 255, 255, 0.05), 0 6px 18px rgba(0, 0, 0, 0.35);
  --km-shadow-card-hover: 0 0 0 1px rgba(255, 255, 255, 0.08), 0 16px 34px rgba(0, 0, 0, 0.5);
}

/* Keyboard focus must stay visible on every interactive surface. Pointer clicks
   are unaffected because :focus-visible only matches keyboard/AT focus. */
a:focus-visible,
button:focus-visible,
[role='button']:focus-visible,
[tabindex]:not([tabindex='-1']):focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: var(--km-focus-ring-width) solid var(--km-focus-ring-color);
  outline-offset: var(--km-focus-ring-offset);
}

/* Shared modal surface and text hierarchy. Keep every Ant Design dialog on the
   same neutral palette, including imperative Modal.confirm dialogs. */

/* Brand green seed makes antd success tags render 1.9:1 text; force the text-safe green. */
.ant-tag.ant-tag-success {
  color: var(--km-color-success) !important;
}

/* antd Empty descriptions default to disabled-alpha text (4.29:1); keep them readable.
   !important because antd css-in-js styles inject after this static stylesheet. */
.ant-empty-description {
  color: var(--km-color-text-secondary) !important;
}

.ant-modal-root .ant-modal-content {
  color: var(--km-color-text-primary);
  background: var(--km-color-surface-raised);
  border: 1px solid var(--km-color-border-subtle);
  border-radius: var(--km-radius-lg);
  box-shadow: var(--km-shadow-lg);
}

.ant-modal-root .ant-modal-header {
  color: var(--km-color-text-primary);
  background: var(--km-color-surface-raised);
}

.ant-modal-root .ant-modal-title,
.ant-modal-root .ant-modal-confirm-title {
  color: var(--km-color-text-primary);
}

.ant-modal-root .ant-modal-confirm-content {
  color: var(--km-color-text-secondary);
}

.ant-modal-root .ant-modal-close {
  width: var(--km-touch-target-min);
  min-width: var(--km-touch-target-min);
  height: var(--km-touch-target-min);
  color: var(--km-color-text-muted);
}

.ant-modal-root .ant-modal-close:hover,
.ant-modal-root .ant-modal-close:focus-visible {
  color: var(--km-color-text-primary);
  background: var(--km-color-surface-panel);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --km-duration-fast: 0.01ms;
    --km-duration-normal: 0.01ms;
    --km-duration-slow: 0.01ms;
    --km-motion-distance: 0;
  }
}

@media (max-width: 768px) {
  :root {
    --km-space-page-x: var(--km-space-4);
    --km-space-section-y: var(--km-space-10);
    --km-font-size-display-md: 34px;
    --km-font-size-display-lg: 42px;
  }
}

@media (max-width: 414px) {
  :root {
    --km-space-page-x: var(--km-space-3);
    --km-font-size-heading-lg: 24px;
    --km-font-size-display-md: 32px;
    --km-font-size-display-lg: 38px;
  }
}

@media (max-width: 375px) {
  :root {
    --km-space-page-x: 12px;
    --km-font-size-display-md: 30px;
    --km-font-size-display-lg: 36px;
  }
}

/*
 * Global font loading: use swap while web fonts load so text renders
 * immediately in fallback system fonts (no FOIT / invisible text).
 */
@font-face {
  font-family: 'KolmarketFallback';
  src: local('system-ui');
  font-display: swap;
}

/*
 * content-visibility: auto speeds initial paint of scrollable cards/lists
 * by deferring off-screen layout work. Opt-in per component via the utility
 * class .km-content-auto; add it to scrollable token grids, market lists,
 * portfolio panels, and creator discovery cards for instant TTI improvement.
 */
.km-content-auto {
  content-visibility: auto;
  contain-intrinsic-size: auto 500px;
}

/*
 * Use only the "paint" value so the browser still lays out text geometry
 * (prevents CLS) but skips rasterization of far-off images / heavy layers.
 */
@media (min-width: 1024px) {
  .km-content-paint {
    content-visibility: auto;
    contain-intrinsic-size: auto 500px;
  }
}

.docs-layout {
  --docs-sidebar-width: 17.5rem;
  --docs-toc-width: 14rem;
  --docs-header-offset: 0;
  --docs-shell-width: var(--km-shell-width, min(1280px, calc(100vw - var(--km-space-page-x, 1rem) * 2)));
  --docs-line: var(--km-color-border-subtle);
  --docs-sidebar-bg: color-mix(in srgb, var(--km-color-surface-panel) 92%, #fff 8%);
  --docs-content-bg: var(--km-color-surface-base);
  --docs-accent: var(--km-color-action-text);
  min-height: auto;
  padding-top: 0;
  color: var(--km-color-text-primary);
  background: transparent;
}

.kolmarket-network-stage--active .docs-page-shell.km-page-shell {
  background-color: transparent !important;
}

.docs-page-shell.km-page-shell .km-page-shell__inner {
  width: var(--km-shell-width);
  max-width: var(--km-shell-width);
  padding-block: 0;
  padding-top: var(--km-header-height, 76px);
}

.docs-layout__frame {
  display: grid;
  width: 100%;
  min-height: auto;
  grid-template-columns: minmax(0, 1fr);
}

.docs-layout__sidebar {
  display: none;
  min-width: 0;
  border-right: 1px solid var(--docs-line);
  background: var(--docs-sidebar-bg);
}

.docs-layout__sidebar-inner {
  position: sticky;
  top: calc(var(--km-header-height, 76px) + 0.5rem);
  display: flex;
  flex-direction: column;
}

.docs-layout__brand {
  flex: 0 0 auto;
  padding: 1.25rem 1rem 0.85rem;
  border-bottom: 1px solid var(--docs-line);
}

.docs-layout__brand strong {
  display: block;
  font-size: 0.95rem;
  letter-spacing: -0.02em;
}

.docs-layout__brand small {
  display: block;
  margin-top: 0.35rem;
  color: var(--km-color-text-muted);
  font-size: 0.75rem;
  line-height: 1.45;
}

.docs-layout__nav-scroll {
  padding: 0.85rem 0.65rem 1.25rem;
}

.docs-layout__drawer .docs-layout__nav-scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}

.docs-layout__group + .docs-layout__group {
  margin-top: 1rem;
}

.docs-layout__group-title {
  margin: 0 0 0.35rem;
  padding: 0 0.55rem;
  color: var(--km-color-text-muted);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.docs-layout__nav-list {
  display: grid;
  gap: 0.15rem;
}

.docs-layout__nav-link,
.docs-layout__nav-button {
  display: block;
  width: 100%;
  padding: 0.45rem 0.55rem;
  border: 0;
  border-radius: 0.45rem;
  color: var(--km-color-text-secondary);
  background: transparent;
  cursor: pointer;
  font: inherit;
  font-size: 0.84rem;
  line-height: 1.45;
  text-align: left;
  text-decoration: none;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}

.docs-layout__nav-link:hover,
.docs-layout__nav-button:hover {
  color: var(--km-color-text-primary);
  background: color-mix(in srgb, var(--docs-accent) 8%, transparent);
}

.docs-layout__nav-link.is-active,
.docs-layout__nav-button.is-active {
  color: var(--docs-accent);
  background: color-mix(in srgb, var(--docs-accent) 12%, transparent);
  font-weight: 650;
}

.docs-layout__nav-link.is-route-active {
  color: var(--km-color-text-primary);
  font-weight: 700;
}

.docs-layout__subnav {
  display: grid;
  gap: 0.1rem;
  margin: 0.15rem 0 0.35rem 0.65rem;
  padding-left: 0.55rem;
  border-left: 1px solid var(--docs-line);
}

.docs-layout__subnav .docs-layout__nav-button {
  padding: 0.32rem 0.45rem;
  font-size: 0.78rem;
}

.docs-layout__nav-button.is-depth-2 {
  padding-left: 0.35rem;
  font-size: 0.82rem;
  font-weight: 600;
}

.docs-layout__nav-button.is-depth-3 {
  padding-left: 0.15rem;
  font-size: 0.76rem;
  font-weight: 500;
  color: var(--km-color-text-muted);
}

.docs-layout__nav-group-block {
  margin-top: 0.35rem;
}

.docs-layout__subnav-heading,
.docs-layout__toc-group-title {
  margin: 0.55rem 0 0.25rem;
  padding: 0 0.55rem;
  color: var(--km-color-text-muted);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.docs-layout__toc-branch {
  display: grid;
  gap: 0.15rem;
  margin: 0.1rem 0 0.35rem 0.55rem;
  padding-left: 0.45rem;
  border-left: 1px solid var(--docs-line);
}

.docs-layout__toc-button.is-depth-2 {
  padding-left: 0.15rem;
  font-size: 0.76rem;
  font-weight: 600;
}

.docs-layout__toc-button.is-depth-3 {
  padding-left: 0.35rem;
  font-size: 0.75rem;
  color: var(--km-color-text-muted);
}

.docs-layout__toc-button.is-depth-3.is-active {
  color: var(--docs-accent);
}

.docs-layout__main-wrap {
  min-width: 0;
}

.docs-layout__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--docs-line);
  background: color-mix(in srgb, var(--docs-content-bg) 88%, var(--docs-sidebar-bg) 12%);
}

.docs-layout__mobile-toggle {
  display: inline-flex;
  min-height: 2.5rem;
  align-items: center;
  gap: 0.45rem;
  padding: 0 0.75rem;
  border: 1px solid var(--docs-line);
  border-radius: 0.55rem;
  color: var(--km-color-text-primary);
  background: var(--km-color-surface-panel);
  cursor: pointer;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 650;
}

.docs-layout__breadcrumb {
  min-width: 0;
  color: var(--km-color-text-muted);
  font-size: 0.78rem;
}

.docs-layout__breadcrumb strong {
  color: var(--km-color-text-primary);
  font-weight: 650;
}

.docs-layout__content-grid {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr);
  gap: 2rem;
}

.docs-layout__article {
  min-width: 0;
  padding: 1.25rem 1rem 3rem;
  background: var(--docs-content-bg);
}

.docs-layout__page-head {
  margin-bottom: 1.75rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--docs-line);
}

.docs-layout__page-head h1 {
  margin: 0;
  font-size: clamp(1.75rem, 4vw, 2.45rem);
  line-height: 1.15;
  letter-spacing: -0.03em;
}

.docs-layout__content-grid.is-no-toc .docs-layout__page-head p {
  max-width: 56rem;
}

.docs-layout__page-head p {
  max-width: 42rem;
  margin: 0.85rem 0 0;
  color: var(--km-color-text-secondary);
  font-size: 1rem;
  line-height: 1.7;
}

.docs-layout__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 0.85rem;
  color: var(--km-color-text-muted);
  font-size: 0.78rem;
}

.docs-layout__meta span {
  padding: 0.2rem 0.55rem;
  border: 1px solid var(--docs-line);
  border-radius: 999px;
  background: var(--km-color-surface-panel);
}

.docs-layout__toc {
  display: none;
}

.docs-layout__toc-inner {
  position: sticky;
  top: calc(var(--km-header-height, 76px) + 1rem);
  padding: 0.25rem 0 1rem;
}

.docs-layout__toc-title {
  margin: 0 0 0.65rem;
  color: var(--km-color-text-muted);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.docs-layout__toc-list {
  display: grid;
  gap: 0.25rem;
}

.docs-layout__toc-button {
  display: block;
  width: 100%;
  padding: 0.25rem 0;
  border: 0;
  color: var(--km-color-text-muted);
  background: transparent;
  cursor: pointer;
  font: inherit;
  font-size: 0.78rem;
  line-height: 1.45;
  text-align: left;
  transition: color 0.15s ease;
}

.docs-layout__toc-button:hover,
.docs-layout__toc-button.is-active {
  color: var(--docs-accent);
}

.docs-layout__drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 60;
  background: rgb(15 23 42 / 42%);
}

.docs-layout__drawer {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 61;
  display: flex;
  width: min(88vw, var(--docs-sidebar-width));
  flex-direction: column;
  background: var(--docs-sidebar-bg);
  box-shadow: 0 1rem 3rem rgb(0 0 0 / 18%);
}

.docs-layout__drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.85rem 1rem;
  border-bottom: 1px solid var(--docs-line);
}

.docs-layout__drawer-head button {
  min-height: 2.25rem;
  padding: 0 0.65rem;
  border: 1px solid var(--docs-line);
  border-radius: 0.45rem;
  background: var(--km-color-surface-panel);
  cursor: pointer;
  font: inherit;
}

.docs-prose {
  max-width: none;
  color: var(--km-color-text-primary);
  font-size: 0.98rem;
  line-height: 1.75;
}

.docs-prose section + section {
  margin-top: 2.75rem;
  padding-top: 2.25rem;
  border-top: 1px solid var(--docs-line);
}

.docs-prose h2,
.docs-prose h3,
.docs-prose h4,
.v3docs-embedded .v3docs-section {
  scroll-margin-top: calc(var(--km-header-height, 76px) + 1rem);
}

.docs-prose h2 {
  margin: 0 0 1rem;
  font-size: 1.55rem;
  line-height: 1.25;
  letter-spacing: -0.025em;
}

.docs-prose h3 {
  margin: 0 0 0.85rem;
  font-size: 1.15rem;
  line-height: 1.35;
}

.docs-prose h4 {
  margin: 1.25rem 0 0.65rem;
  color: var(--km-color-text-primary);
  font-size: 1rem;
  font-weight: 700;
}

.docs-prose p {
  margin: 0 0 1rem;
  color: var(--km-color-text-secondary);
}

.docs-prose ul {
  margin: 0 0 1rem;
  padding-left: 1.2rem;
  color: var(--km-color-text-secondary);
}

.docs-prose li + li {
  margin-top: 0.45rem;
}

.docs-prose li strong,
.docs-prose .docs-prose__label {
  color: var(--km-color-text-primary);
  font-weight: 650;
}

.docs-prose a {
  color: var(--docs-accent);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.docs-prose__panel {
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid var(--docs-line);
  border-radius: 0.75rem;
  background: var(--km-color-surface-panel);
}

.docs-prose__notice {
  margin-top: 1.5rem;
  padding: 1rem 1.1rem;
  border: 1px solid color-mix(in srgb, #ef4444 35%, var(--docs-line));
  border-radius: 0.75rem;
  background: var(--km-color-surface-warning-panel);
}

.docs-prose__table-scroll {
  max-width: 100%;
  overflow-x: auto;
  margin: 1rem 0;
  padding: 0.75rem;
  border: 1px solid var(--docs-line);
  border-radius: 0.75rem;
  background: var(--km-color-surface-panel);
}

@media (min-width: 64rem) {
  .docs-layout__frame {
    grid-template-columns: var(--docs-sidebar-width) minmax(0, 1fr);
  }

  .docs-layout__sidebar {
    display: block;
    position: sticky;
    top: var(--km-header-height, 76px);
    align-self: start;
    height: calc(100vh - var(--km-header-height, 76px));
    max-height: calc(100vh - var(--km-header-height, 76px));
    overflow: hidden;
  }

  .docs-layout__sidebar-inner {
    position: static;
    height: 100%;
    max-height: none;
    overflow: hidden;
  }

  .docs-layout__sidebar .docs-layout__nav-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  .docs-layout__sidebar .docs-layout__nav-scroll::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }

  .docs-layout__toolbar {
    display: none;
  }

  .docs-layout__main-wrap {
    position: sticky;
    top: var(--km-header-height, 76px);
    align-self: start;
    height: calc(100vh - var(--km-header-height, 76px));
    max-height: calc(100vh - var(--km-header-height, 76px));
    overflow: hidden;
  }

  .docs-layout__content-grid {
    height: 100%;
    min-height: 0;
    overflow: hidden;
  }

  .docs-layout__article {
    height: 100%;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 2rem 2.25rem 4rem;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  .docs-layout__article::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }

  .docs-layout__content-grid {
    grid-template-columns: minmax(0, 1fr) var(--docs-toc-width);
    padding-right: 1.5rem;
  }

  .docs-layout__content-grid.is-no-toc {
    grid-template-columns: minmax(0, 1fr);
    padding-right: 0;
  }

  .docs-layout__content-grid.is-no-toc .docs-layout__article {
    padding-inline: 2.25rem 2.5rem;
  }

  .docs-layout__toc {
    display: block;
  }
}

@media (min-width: 80rem) {
  .docs-layout__article {
    padding-inline: 3rem 1.5rem;
  }

  .docs-layout__content-grid.is-no-toc .docs-layout__article {
    padding-inline: 3rem 3rem;
  }
}

@media print {
  .docs-layout__sidebar,
  .docs-layout__toolbar,
  .docs-layout__toc,
  .docs-layout__drawer,
  .docs-layout__drawer-backdrop {
    display: none !important;
  }

  .docs-layout__frame {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

#geo-static{font-family:"DM Sans","PingFang SC",sans-serif;color:var(--km-color-text-primary);background:var(--km-color-surface-base);min-height:100vh}
#geo-static *{box-sizing:border-box}#geo-static a{color:inherit}#geo-static .docs-layout{max-width:1280px;margin:auto}#geo-static .docs-layout__article{overflow-wrap:anywhere}#geo-static .geo-top{padding:20px;display:flex;gap:24px;align-items:center;border-bottom:1px solid var(--km-color-border-subtle)}#geo-static .geo-top img{width:32px;height:32px}#geo-static .geo-top a{min-height:44px;display:inline-flex;align-items:center}#geo-static .geo-mobile-nav{padding:16px}#geo-static .geo-mobile-nav a{display:block;padding:12px}#geo-static .meta{font-size:.875rem}#geo-static table{border-collapse:collapse;width:100%}#geo-static td,#geo-static th{padding:12px;text-align:left;border-bottom:1px solid var(--km-color-border-subtle)}#geo-static .table{overflow:auto}#geo-static .sources{overflow-wrap:anywhere}#geo-static .skip{position:absolute;top:-100px}#geo-static .skip:focus{top:0}@media(min-width:64rem){#geo-static .geo-mobile-nav{display:none}}