body.tf-vip-theme {
  --tf-bg: #07111d;
  --tf-bg-start: #06101b;
  --tf-bg-end: #09111d;
  --tf-panel: rgba(8, 19, 33, 0.88);
  --tf-panel-strong: rgba(11, 26, 46, 0.96);
  --tf-line: rgba(100, 152, 194, 0.2);
  --tf-copy: #d8ebf7;
  --tf-muted: #8fb0c7;
  --tf-cyan: #52efff;
  --tf-amber: #ffb85d;
  --tf-good: #75f2a6;
  --tf-danger: #ff9099;
  --tf-ambient-a: rgba(82, 239, 255, 0.12);
  --tf-ambient-b: rgba(255, 184, 93, 0.12);
  --tf-overlay-a: rgba(82, 239, 255, 0.08);
  --tf-overlay-b: rgba(255, 184, 93, 0.08);
  --tf-panel-glow-a: rgba(255, 184, 93, 0.08);
  --tf-panel-glow-b: rgba(82, 239, 255, 0.08);
  --tf-pill-bg: rgba(82, 239, 255, 0.08);
  --tf-pill-border: rgba(82, 239, 255, 0.24);
  --tf-button-soft-a: rgba(82, 239, 255, 0.14);
  --tf-button-soft-b: rgba(46, 167, 255, 0.08);
  --tf-button-primary-a: rgba(255, 184, 93, 0.18);
  --tf-button-primary-b: rgba(82, 239, 255, 0.08);
  --tf-scrollbar-a: rgba(82, 239, 255, 0.48);
  --tf-scrollbar-b: rgba(255, 184, 93, 0.38);
  --tf-grid-opacity: 0.16;
  color: var(--tf-copy);
  font-family: "IBM Plex Sans", "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at top, var(--tf-ambient-a), transparent 34%),
    radial-gradient(circle at bottom right, var(--tf-ambient-b), transparent 24%),
    linear-gradient(160deg, var(--tf-bg-start), #0c1626 58%, var(--tf-bg-end));
}

body.tf-vip-theme::before,
body.tf-vip-theme::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

body.tf-vip-theme::before {
  background:
    radial-gradient(circle at 12% 14%, var(--tf-overlay-a), transparent 26%),
    radial-gradient(circle at 88% 10%, var(--tf-overlay-b), transparent 24%);
  opacity: 0.9;
}

body.tf-vip-theme::after {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), transparent 14%, transparent 86%, rgba(255, 255, 255, 0.02)),
    repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.015) 0 1px, transparent 1px 4px);
  opacity: var(--tf-grid-opacity);
}

body.tf-vip-theme.quant-mode {
  --tf-line: rgba(108, 212, 255, 0.3);
  --tf-copy: #dff8ff;
  --tf-muted: #90b6ca;
  --tf-cyan: #79efff;
  --tf-amber: #ffc16a;
  --tf-good: #8fffc0;
  --tf-bg-start: #02050d;
  --tf-bg-end: #081523;
  --tf-ambient-a: rgba(77, 214, 255, 0.18);
  --tf-ambient-b: rgba(255, 188, 82, 0.14);
  --tf-overlay-a: rgba(117, 198, 255, 0.1);
  --tf-overlay-b: rgba(255, 188, 82, 0.08);
  --tf-panel-glow-a: rgba(255, 188, 82, 0.08);
  --tf-panel-glow-b: rgba(117, 198, 255, 0.08);
  --tf-pill-bg: rgba(117, 198, 255, 0.08);
  --tf-pill-border: rgba(117, 198, 255, 0.26);
  --tf-button-soft-a: rgba(117, 198, 255, 0.16);
  --tf-button-soft-b: rgba(255, 188, 82, 0.06);
  --tf-button-primary-a: rgba(255, 188, 82, 0.18);
  --tf-button-primary-b: rgba(117, 198, 255, 0.08);
  --tf-scrollbar-a: rgba(117, 198, 255, 0.56);
  --tf-scrollbar-b: rgba(255, 188, 82, 0.34);
  font-family: "IBM Plex Mono", "JetBrains Mono", "Consolas", monospace;
}

body.tf-vip-theme.mode-trader {
  --tf-line: rgba(255, 190, 112, 0.24);
  --tf-cyan: #ffd08a;
  --tf-amber: #ffb252;
  --tf-muted: #c5aa86;
  --tf-ambient-a: rgba(255, 174, 66, 0.14);
  --tf-ambient-b: rgba(255, 220, 163, 0.08);
  --tf-overlay-a: rgba(255, 174, 66, 0.08);
  --tf-overlay-b: rgba(255, 220, 163, 0.06);
  --tf-panel-glow-a: rgba(255, 174, 66, 0.1);
  --tf-panel-glow-b: rgba(255, 220, 163, 0.04);
  --tf-pill-bg: rgba(255, 174, 66, 0.1);
  --tf-pill-border: rgba(255, 174, 66, 0.26);
  --tf-button-soft-a: rgba(255, 174, 66, 0.16);
  --tf-button-soft-b: rgba(255, 220, 163, 0.05);
  --tf-button-primary-a: rgba(255, 196, 121, 0.22);
  --tf-button-primary-b: rgba(255, 174, 66, 0.08);
}

body.tf-vip-theme.mode-mobile_trader {
  --tf-line: rgba(123, 242, 255, 0.26);
  --tf-cyan: #8af6ff;
  --tf-amber: #72d8ff;
  --tf-muted: #90c8dc;
  --tf-ambient-a: rgba(72, 225, 255, 0.14);
  --tf-ambient-b: rgba(139, 239, 255, 0.08);
  --tf-overlay-a: rgba(72, 225, 255, 0.08);
  --tf-overlay-b: rgba(139, 239, 255, 0.06);
  --tf-panel-glow-a: rgba(72, 225, 255, 0.08);
  --tf-panel-glow-b: rgba(139, 239, 255, 0.06);
  --tf-pill-bg: rgba(72, 225, 255, 0.09);
  --tf-pill-border: rgba(72, 225, 255, 0.24);
  --tf-button-soft-a: rgba(72, 225, 255, 0.16);
  --tf-button-soft-b: rgba(110, 219, 255, 0.06);
  --tf-button-primary-a: rgba(122, 234, 255, 0.18);
  --tf-button-primary-b: rgba(72, 225, 255, 0.08);
}

body.tf-vip-theme.mode-signal_deck {
  --tf-line: rgba(102, 227, 255, 0.28);
  --tf-cyan: #8eeaff;
  --tf-amber: #56b2ff;
  --tf-muted: #8bb7d8;
  --tf-ambient-a: rgba(43, 246, 255, 0.14);
  --tf-ambient-b: rgba(63, 132, 255, 0.1);
  --tf-overlay-a: rgba(43, 246, 255, 0.08);
  --tf-overlay-b: rgba(63, 132, 255, 0.08);
  --tf-panel-glow-a: rgba(43, 246, 255, 0.1);
  --tf-panel-glow-b: rgba(63, 132, 255, 0.08);
  --tf-pill-bg: rgba(43, 246, 255, 0.08);
  --tf-pill-border: rgba(43, 246, 255, 0.24);
  --tf-button-soft-a: rgba(43, 246, 255, 0.16);
  --tf-button-soft-b: rgba(63, 132, 255, 0.08);
  --tf-button-primary-a: rgba(63, 132, 255, 0.2);
  --tf-button-primary-b: rgba(43, 246, 255, 0.08);
}

body.tf-vip-theme.mode-investor {
  --tf-line: rgba(138, 170, 224, 0.28);
  --tf-copy: #edf5ff;
  --tf-cyan: #7fafff;
  --tf-amber: #ffd8a0;
  --tf-muted: #7f9fc1;
  --tf-ambient-a: rgba(137, 170, 224, 0.16);
  --tf-ambient-b: rgba(255, 225, 186, 0.08);
  --tf-overlay-a: rgba(137, 170, 224, 0.08);
  --tf-overlay-b: rgba(255, 225, 186, 0.05);
  --tf-panel-glow-a: rgba(137, 170, 224, 0.08);
  --tf-panel-glow-b: rgba(255, 225, 186, 0.08);
  --tf-pill-bg: rgba(137, 170, 224, 0.1);
  --tf-pill-border: rgba(137, 170, 224, 0.26);
  --tf-button-soft-a: rgba(137, 170, 224, 0.16);
  --tf-button-soft-b: rgba(255, 225, 186, 0.06);
  --tf-button-primary-a: rgba(255, 225, 186, 0.18);
  --tf-button-primary-b: rgba(137, 170, 224, 0.08);
}

body.tf-vip-theme.mode-chartist {
  --tf-line: rgba(88, 242, 255, 0.3);
  --tf-cyan: #58f2ff;
  --tf-amber: #ffb85d;
  --tf-muted: #8db9c9;
  --tf-ambient-a: rgba(88, 242, 255, 0.16);
  --tf-ambient-b: rgba(255, 184, 93, 0.1);
  --tf-overlay-a: rgba(88, 242, 255, 0.08);
  --tf-overlay-b: rgba(255, 184, 93, 0.06);
  --tf-panel-glow-a: rgba(88, 242, 255, 0.1);
  --tf-panel-glow-b: rgba(255, 184, 93, 0.08);
  --tf-pill-bg: rgba(88, 242, 255, 0.09);
  --tf-pill-border: rgba(88, 242, 255, 0.26);
  --tf-button-soft-a: rgba(88, 242, 255, 0.16);
  --tf-button-soft-b: rgba(255, 184, 93, 0.06);
  --tf-button-primary-a: rgba(255, 184, 93, 0.2);
  --tf-button-primary-b: rgba(88, 242, 255, 0.08);
}

body.tf-vip-theme.mode-market_maker {
  --tf-line: rgba(125, 255, 154, 0.26);
  --tf-cyan: #7dff9a;
  --tf-amber: #9bffd4;
  --tf-good: #8fffaa;
  --tf-muted: #8dc8a0;
  --tf-ambient-a: rgba(79, 255, 125, 0.14);
  --tf-ambient-b: rgba(125, 255, 154, 0.08);
  --tf-overlay-a: rgba(79, 255, 125, 0.08);
  --tf-overlay-b: rgba(125, 255, 154, 0.06);
  --tf-panel-glow-a: rgba(79, 255, 125, 0.1);
  --tf-panel-glow-b: rgba(125, 255, 154, 0.06);
  --tf-pill-bg: rgba(79, 255, 125, 0.08);
  --tf-pill-border: rgba(79, 255, 125, 0.24);
  --tf-button-soft-a: rgba(79, 255, 125, 0.14);
  --tf-button-soft-b: rgba(125, 255, 154, 0.05);
  --tf-button-primary-a: rgba(125, 255, 154, 0.2);
  --tf-button-primary-b: rgba(79, 255, 125, 0.08);
}

body.tf-vip-theme.mode-broker {
  --tf-line: rgba(255, 194, 121, 0.28);
  --tf-cyan: #ffc16a;
  --tf-amber: #ffd8a0;
  --tf-muted: #c7ab7d;
  --tf-ambient-a: rgba(255, 194, 121, 0.14);
  --tf-ambient-b: rgba(255, 216, 160, 0.08);
  --tf-overlay-a: rgba(255, 194, 121, 0.08);
  --tf-overlay-b: rgba(255, 216, 160, 0.06);
  --tf-panel-glow-a: rgba(255, 194, 121, 0.1);
  --tf-panel-glow-b: rgba(255, 216, 160, 0.06);
  --tf-pill-bg: rgba(255, 194, 121, 0.1);
  --tf-pill-border: rgba(255, 194, 121, 0.26);
  --tf-button-soft-a: rgba(255, 194, 121, 0.16);
  --tf-button-soft-b: rgba(255, 216, 160, 0.05);
  --tf-button-primary-a: rgba(255, 216, 160, 0.2);
  --tf-button-primary-b: rgba(255, 194, 121, 0.08);
}

body.tf-vip-theme.mode-pi {
  --tf-line: rgba(138, 170, 255, 0.28);
  --tf-cyan: #8db8ff;
  --tf-amber: #bbd3ff;
  --tf-muted: #99acd8;
  --tf-ambient-a: rgba(138, 170, 255, 0.14);
  --tf-ambient-b: rgba(187, 211, 255, 0.08);
  --tf-overlay-a: rgba(138, 170, 255, 0.08);
  --tf-overlay-b: rgba(187, 211, 255, 0.05);
  --tf-panel-glow-a: rgba(138, 170, 255, 0.1);
  --tf-panel-glow-b: rgba(187, 211, 255, 0.06);
  --tf-pill-bg: rgba(138, 170, 255, 0.1);
  --tf-pill-border: rgba(138, 170, 255, 0.26);
  --tf-button-soft-a: rgba(138, 170, 255, 0.16);
  --tf-button-soft-b: rgba(187, 211, 255, 0.05);
  --tf-button-primary-a: rgba(187, 211, 255, 0.2);
  --tf-button-primary-b: rgba(138, 170, 255, 0.08);
}

body.tf-vip-theme .wrap,
body.tf-vip-theme .shell,
body.tf-vip-theme .card,
body.tf-vip-theme .panel,
body.tf-vip-theme .hero,
body.tf-vip-theme .topbar,
body.tf-vip-theme .tab-panel,
body.tf-vip-theme .left,
body.tf-vip-theme .right,
body.tf-vip-theme .auth-shell,
body.tf-vip-theme .launcher-form,
body.tf-vip-theme .launch-card,
body.tf-vip-theme .policy-note,
body.tf-vip-theme .notice,
body.tf-vip-theme .note,
body.tf-vip-theme .info-board,
body.tf-vip-theme .ticker-board,
body.tf-vip-theme .status-box,
body.tf-vip-theme .field-group,
body.tf-vip-theme .price,
body.tf-vip-theme .grid-signal-stage,
body.tf-vip-theme .controls,
body.tf-vip-theme .ticker-picker-wrap,
body.tf-vip-theme .chart-shell,
body.tf-vip-theme .chart-workspace,
body.tf-vip-theme .chart-console-intro,
body.tf-vip-theme .terminal-tabs {
  position: relative;
  z-index: 1;
}

body.tf-vip-theme .panel,
body.tf-vip-theme .card,
body.tf-vip-theme .hero,
body.tf-vip-theme .topbar,
body.tf-vip-theme .tab-panel,
body.tf-vip-theme .ticker-picker-wrap,
body.tf-vip-theme .controls,
body.tf-vip-theme .chart-shell,
body.tf-vip-theme .chart-workspace,
body.tf-vip-theme .chart-console-intro,
body.tf-vip-theme .auth-shell,
body.tf-vip-theme .left,
body.tf-vip-theme .right,
body.tf-vip-theme .launcher-form,
body.tf-vip-theme .launch-card,
body.tf-vip-theme .policy-note,
body.tf-vip-theme .notice,
body.tf-vip-theme .note,
body.tf-vip-theme .info-board,
body.tf-vip-theme .ticker-board,
body.tf-vip-theme .status-box,
body.tf-vip-theme .field-group,
body.tf-vip-theme .price,
body.tf-vip-theme .grid-signal-stage {
  border-color: var(--tf-line);
  background:
    radial-gradient(circle at top right, var(--tf-panel-glow-a), transparent 26%),
    radial-gradient(circle at top left, var(--tf-panel-glow-b), transparent 24%),
    linear-gradient(165deg, rgba(10, 24, 40, 0.96), rgba(6, 14, 25, 0.94));
  box-shadow:
    0 22px 42px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(10px);
}

body.tf-vip-theme .panel::before,
body.tf-vip-theme .card::before,
body.tf-vip-theme .hero::before,
body.tf-vip-theme .topbar::before,
body.tf-vip-theme .tab-panel::before,
body.tf-vip-theme .auth-shell::before,
body.tf-vip-theme .launch-card::before,
body.tf-vip-theme .price::before,
body.tf-vip-theme .chart-shell::before,
body.tf-vip-theme .chart-workspace::before,
body.tf-vip-theme .chart-console-intro::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;
  background: linear-gradient(90deg, rgba(82, 239, 255, 0), rgba(82, 239, 255, 0.7), rgba(255, 184, 93, 0.52), rgba(82, 239, 255, 0));
  opacity: 0.92;
  pointer-events: none;
}

body.tf-vip-theme h1,
body.tf-vip-theme .title {
  text-shadow: 0 0 22px rgba(82, 239, 255, 0.16);
}

body.tf-vip-theme .eyebrow,
body.tf-vip-theme .tag,
body.tf-vip-theme .pill,
body.tf-vip-theme .chip,
body.tf-vip-theme .mode-pill {
  border-color: var(--tf-pill-border);
  background: var(--tf-pill-bg);
  color: var(--tf-cyan);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

body.tf-vip-theme .btn,
body.tf-vip-theme .vip-tab-btn,
body.tf-vip-theme .tab-btn,
body.tf-vip-theme .term-tab,
body.tf-vip-theme .cta-btn {
  border: 1px solid var(--tf-pill-border);
  border-radius: 14px;
  background: linear-gradient(135deg, var(--tf-button-soft-a), var(--tf-button-soft-b));
  color: #effcff;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 12px 24px rgba(0, 0, 0, 0.18);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

body.tf-vip-theme .btn.primary,
body.tf-vip-theme .cta-btn.primary {
  border-color: var(--tf-pill-border);
  background: linear-gradient(135deg, var(--tf-button-primary-a), var(--tf-button-primary-b));
  color: #fff1d9;
}

body.tf-vip-theme .btn.secondary,
body.tf-vip-theme .btn.alt,
body.tf-vip-theme .btn.subtle,
body.tf-vip-theme .cta-btn:not(.primary),
body.tf-vip-theme .vip-tab-btn,
body.tf-vip-theme .tab-btn,
body.tf-vip-theme .term-tab {
  border-color: rgba(143, 176, 199, 0.18);
  background: rgba(255, 255, 255, 0.03);
  color: #d2e8f6;
}

body.tf-vip-theme .vip-tab-btn.active,
body.tf-vip-theme .tab-btn.active,
body.tf-vip-theme .term-tab.active {
  border-color: rgba(255, 184, 93, 0.34);
  background: linear-gradient(135deg, rgba(255, 184, 93, 0.16), rgba(82, 239, 255, 0.10));
  color: #fff2d8;
}

@media (hover: hover) {
  body.tf-vip-theme .btn:hover,
  body.tf-vip-theme .vip-tab-btn:hover,
  body.tf-vip-theme .tab-btn:hover,
  body.tf-vip-theme .term-tab:hover,
  body.tf-vip-theme .cta-btn:hover {
    transform: translateY(-1px);
    border-color: rgba(82, 239, 255, 0.34);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.06),
      0 16px 30px rgba(0, 0, 0, 0.22);
  }
}

body.tf-vip-theme input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
body.tf-vip-theme select,
body.tf-vip-theme textarea,
body.tf-vip-theme .auth-input,
body.tf-vip-theme .ticker-input,
body.tf-vip-theme .tron-date {
  border: 1px solid rgba(143, 176, 199, 0.22);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.03));
  color: #f6fcff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

body.tf-vip-theme input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus,
body.tf-vip-theme select:focus,
body.tf-vip-theme textarea:focus,
body.tf-vip-theme .auth-input:focus,
body.tf-vip-theme .ticker-input:focus,
body.tf-vip-theme .tron-date:focus {
  outline: none;
  border-color: rgba(82, 239, 255, 0.42);
  box-shadow: 0 0 0 3px rgba(82, 239, 255, 0.12);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(82, 239, 255, 0.06));
}

body.tf-vip-theme label,
body.tf-vip-theme .k,
body.tf-vip-theme .eyebrow,
body.tf-vip-theme .tag {
  color: #a5c6db;
}

body.tf-vip-theme .sub,
body.tf-vip-theme .lead,
body.tf-vip-theme p,
body.tf-vip-theme .meta,
body.tf-vip-theme .help-note,
body.tf-vip-theme .note,
body.tf-vip-theme .notice,
body.tf-vip-theme .policy-note {
  color: var(--tf-muted);
}

body.tf-vip-theme .state,
body.tf-vip-theme .good,
body.tf-vip-theme .up,
body.tf-vip-theme .success {
  color: var(--tf-good);
}

body.tf-vip-theme .error,
body.tf-vip-theme .errorlist,
body.tf-vip-theme .errornote,
body.tf-vip-theme .warn {
  color: #ffd2d7;
}

body.tf-vip-theme .leader-logo,
body.tf-vip-theme img.leader-logo {
  border-color: rgba(82, 239, 255, 0.22);
  background: rgba(8, 18, 31, 0.85);
}

body.tf-vip-theme a {
  color: inherit;
}

body.tf-vip-theme .help-note a,
body.tf-vip-theme .info-row a,
body.tf-vip-theme .row a,
body.tf-vip-theme .meta-links a,
body.tf-vip-theme .top-links a {
  color: var(--tf-cyan);
}

body.tf-vip-theme .status-box.warn,
body.tf-vip-theme .notice.error {
  border-color: rgba(255, 144, 153, 0.22);
  background:
    radial-gradient(circle at top right, rgba(255, 144, 153, 0.08), transparent 28%),
    linear-gradient(160deg, rgba(78, 15, 22, 0.32), rgba(18, 12, 18, 0.74));
}

body.tf-vip-theme .status-box,
body.tf-vip-theme .notice.success {
  border-color: rgba(117, 242, 166, 0.2);
  background:
    radial-gradient(circle at top right, rgba(117, 242, 166, 0.08), transparent 30%),
    linear-gradient(160deg, rgba(18, 66, 45, 0.28), rgba(7, 18, 31, 0.86));
}

body.tf-vip-theme ::-webkit-scrollbar {
  width: 11px;
  height: 11px;
}

body.tf-vip-theme ::-webkit-scrollbar-track {
  background: rgba(6, 14, 24, 0.82);
}

body.tf-vip-theme ::-webkit-scrollbar-thumb {
  border-radius: 999px;
  border: 2px solid rgba(6, 14, 24, 0.82);
  background: linear-gradient(180deg, var(--tf-scrollbar-a), var(--tf-scrollbar-b));
}

@media (max-width: 900px) {
  body.tf-vip-theme .panel,
  body.tf-vip-theme .card,
  body.tf-vip-theme .hero,
  body.tf-vip-theme .topbar,
  body.tf-vip-theme .auth-shell,
  body.tf-vip-theme .left,
  body.tf-vip-theme .right {
    border-radius: 22px;
  }

  body.tf-vip-theme .btn,
  body.tf-vip-theme .vip-tab-btn,
  body.tf-vip-theme .tab-btn,
  body.tf-vip-theme .term-tab,
  body.tf-vip-theme .cta-btn {
    min-height: 44px;
  }
}