/* Сгенерировано из project/tokens.json дизайн-системы Trade Desk (версия 1). Не править руками — перегенерировать. */
.td-app {
  color-scheme: dark;
  --bg-void: #06080b;
  --surface-100: #0e1116;
  --surface-200: #141821;
  --surface-300: #1b2029;
  --line-soft: #232937;
  --line-hard: #333c4e;
  --ink-100: #e8eef8;
  --ink-200: #a8b3c6;
  --ink-300: #808b9f;
  --long: #2fe0a0;
  --long-wash: rgba(47,224,160,0.14);
  --on-long: #06080b;
  --short: #ff5c72;
  --short-wash: rgba(255,92,114,0.14);
  --on-short: #06080b;
  --warn: #ffb547;
  --warn-wash: rgba(255,181,71,0.14);
  --on-warn: #06080b;
  --info: #4ea8ff;
  --info-wash: rgba(78,168,255,0.14);
  --on-info: #06080b;
  --ink-wash: rgba(168,179,198,0.10);
  --focus: #6fd3ff;
  --grid-line: #1a2029;
  --chart-equity: var(--info);
  --chart-bench: var(--ink-300);
  --chart-dd: var(--short);
  --shadow-panel: 0 1px 0 rgba(255,255,255,0.04) inset, 0 16px 40px rgba(0,0,0,0.45);
  --shadow-pop: 0 12px 28px rgba(0,0,0,0.55);
  --glow-live: 0 0 0 1px rgba(47,224,160,0.35), 0 0 18px rgba(47,224,160,0.20);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-pill: 999px;
  --opacity-stale: 0.45;
  --opacity-muted: 0.65;
  --font-ui: "Space Grotesk", "Segoe UI", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;
}
.td-app[data-theme="light"] {
  color-scheme: light;
  --bg-void: #eef1f6;
  --surface-100: #ffffff;
  --surface-200: #f7f9fc;
  --surface-300: #eef2f8;
  --line-soft: #e2e7f0;
  --line-hard: #c6ceda;
  --ink-100: #0d1420;
  --ink-200: #46505f;
  --ink-300: #667184;
  --long: #0a7f57;
  --long-wash: rgba(10,127,87,0.12);
  --on-long: #ffffff;
  --short: #c8102e;
  --short-wash: rgba(200,16,46,0.10);
  --on-short: #ffffff;
  --warn: #a35c00;
  --warn-wash: rgba(163,92,0,0.12);
  --on-warn: #ffffff;
  --info: #0b62d6;
  --info-wash: rgba(11,98,214,0.10);
  --on-info: #ffffff;
  --ink-wash: rgba(70,80,95,0.08);
  --focus: #0b62d6;
  --grid-line: #e6ebf3;
  --chart-equity: var(--info);
  --chart-bench: var(--ink-300);
  --chart-dd: var(--short);
  --shadow-panel: 0 1px 2px rgba(13,20,32,0.06), 0 12px 32px rgba(13,20,32,0.08);
  --shadow-pop: 0 12px 28px rgba(13,20,32,0.16);
  --glow-live: 0 0 0 1px rgba(10,127,87,0.30);
}
.td-app .display { font-family: var(--font-ui); font-size: 28px; line-height: 32px; font-weight: 600; letter-spacing: -0.02em; }
.td-app .title { font-family: var(--font-ui); font-size: 15px; line-height: 20px; font-weight: 600; letter-spacing: 0.01em; }
.td-app .body { font-family: var(--font-ui); font-size: 14px; line-height: 20px; font-weight: 400; }
.td-app .body-sm { font-family: var(--font-ui); font-size: 12px; line-height: 16px; font-weight: 400; }
.td-app .label { font-family: var(--font-ui); font-size: 11px; line-height: 14px; font-weight: 500; letter-spacing: 0.12em; }
.td-app .metric-xl { font-family: var(--font-mono); font-size: 34px; line-height: 38px; font-weight: 500; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.td-app .metric { font-family: var(--font-mono); font-size: 22px; line-height: 26px; font-weight: 500; font-variant-numeric: tabular-nums; }
.td-app .num { font-family: var(--font-mono); font-size: 13px; line-height: 18px; font-weight: 400; font-variant-numeric: tabular-nums; }
.td-app .ticker { font-family: var(--font-mono); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: 0.04em; font-variant-numeric: tabular-nums; }
.td-app .delta { font-family: var(--font-mono); font-size: 12px; line-height: 16px; font-weight: 500; font-variant-numeric: tabular-nums; }