/*
 * Trace Ticker visual system
 *
 * This stylesheet is intentionally loaded after the legacy runtime styles. It
 * provides one semantic token layer for the workspace while the remaining
 * legacy pages are migrated away from component-specific color palettes.
 */

:root {
  color-scheme: light;
  --ui-brand-50: #eef2ff;
  --ui-brand-100: #e0e7ff;
  --ui-brand-200: #c7d2fe;
  --ui-brand-300: #a5b4fc;
  --ui-brand-500: #6366f1;
  --ui-brand-600: #4f46e5;
  --ui-brand-700: #4338ca;
  --ui-brand-900: #312e81;
  --ui-canvas: #f4f7fb;
  --ui-canvas-deep: #edf2f8;
  --ui-surface: #ffffff;
  --ui-surface-raised: #ffffff;
  --ui-surface-soft: #f8fafc;
  --ui-surface-muted: #f1f5f9;
  --ui-border: #dbe3ef;
  --ui-border-strong: #c4cfdd;
  --ui-text: #0f172a;
  --ui-text-secondary: #334155;
  --ui-text-muted: #64748b;
  --ui-text-subtle: #8492a6;
  --ui-success: #15803d;
  --ui-success-soft: #ecfdf3;
  --ui-success-border: #bbf7d0;
  --ui-danger: #be123c;
  --ui-danger-soft: #fff1f2;
  --ui-danger-border: #fecdd3;
  --ui-warning: #b45309;
  --ui-warning-soft: #fffbeb;
  --ui-warning-border: #fde68a;
  --ui-info: #2563eb;
  --ui-info-soft: #eff6ff;
  --ui-info-border: #bfdbfe;
  --ui-focus: #4f46e5;
  --ui-focus-ring: rgba(79, 70, 229, 0.22);
  --ui-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.05);
  --ui-shadow-sm: 0 8px 24px -18px rgba(15, 23, 42, 0.24);
  --ui-shadow-md: 0 20px 44px -32px rgba(15, 23, 42, 0.32);
  --ui-radius-sm: 10px;
  --ui-radius-md: 14px;
  --ui-radius-lg: 18px;
  --ui-radius-xl: 22px;
  --ui-font: var(--font-workspace-sans), ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --ui-mono: var(--font-workspace-mono), ui-monospace, "SFMono-Regular", Consolas, monospace;

  /* Legacy token compatibility */
  --bg-deep: var(--ui-canvas-deep);
  --bg-surface: var(--ui-surface);
  --bg-card: var(--ui-surface-raised);
  --bg-hover: var(--ui-surface-soft);
  --border: var(--ui-border);
  --border-bright: var(--ui-border-strong);
  --cyan: var(--ui-brand-600);
  --cyan-dim: var(--ui-brand-700);
  --cyan-glow: rgba(79, 70, 229, 0.16);
  --purple: var(--ui-brand-600);
  --green: var(--ui-success);
  --green-dim: #166534;
  --red: var(--ui-danger);
  --red-dim: #9f1239;
  --gold: var(--ui-warning);
  --gold-dim: #92400e;
  --orange: #c2410c;
  --text-primary: var(--ui-text);
  --text-secondary: var(--ui-text-secondary);
  --text-muted: var(--ui-text-muted);
  --display: var(--ui-font);
  --body: var(--ui-font);
  --mono: var(--ui-mono);
  --session-ui-accent: var(--ui-brand-600);
  --session-ui-accent-alt: var(--ui-brand-700);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --ui-brand-50: #171a37;
  --ui-brand-100: #202449;
  --ui-brand-200: #343965;
  --ui-brand-300: #a5b4fc;
  --ui-brand-500: #818cf8;
  --ui-brand-600: #818cf8;
  --ui-brand-700: #6366f1;
  --ui-brand-900: #e0e7ff;
  --ui-canvas: #080d17;
  --ui-canvas-deep: #060a12;
  --ui-surface: #0f1726;
  --ui-surface-raised: #131d2f;
  --ui-surface-soft: #172236;
  --ui-surface-muted: #1c2940;
  --ui-border: #24334b;
  --ui-border-strong: #344762;
  --ui-text: #f1f5f9;
  --ui-text-secondary: #cbd5e1;
  --ui-text-muted: #94a3b8;
  --ui-text-subtle: #7f8da3;
  --ui-success: #4ade80;
  --ui-success-soft: rgba(34, 197, 94, 0.12);
  --ui-success-border: rgba(74, 222, 128, 0.28);
  --ui-danger: #fb7185;
  --ui-danger-soft: rgba(244, 63, 94, 0.12);
  --ui-danger-border: rgba(251, 113, 133, 0.28);
  --ui-warning: #fbbf24;
  --ui-warning-soft: rgba(245, 158, 11, 0.12);
  --ui-warning-border: rgba(251, 191, 36, 0.28);
  --ui-info: #60a5fa;
  --ui-info-soft: rgba(59, 130, 246, 0.13);
  --ui-info-border: rgba(96, 165, 250, 0.28);
  --ui-focus: #a5b4fc;
  --ui-focus-ring: rgba(129, 140, 248, 0.28);
  --ui-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.28);
  --ui-shadow-sm: 0 12px 28px -20px rgba(0, 0, 0, 0.68);
  --ui-shadow-md: 0 24px 52px -34px rgba(0, 0, 0, 0.84);

  --bg-deep: var(--ui-canvas-deep);
  --bg-surface: var(--ui-surface);
  --bg-card: var(--ui-surface-raised);
  --bg-hover: var(--ui-surface-soft);
  --border: var(--ui-border);
  --border-bright: var(--ui-border-strong);
  --cyan: var(--ui-brand-600);
  --cyan-dim: var(--ui-brand-700);
  --cyan-glow: rgba(129, 140, 248, 0.2);
  --purple: var(--ui-brand-600);
  --green: var(--ui-success);
  --green-dim: #22c55e;
  --red: var(--ui-danger);
  --red-dim: #f43f5e;
  --gold: var(--ui-warning);
  --gold-dim: #f59e0b;
  --orange: #fb923c;
  --text-primary: var(--ui-text);
  --text-secondary: var(--ui-text-secondary);
  --text-muted: var(--ui-text-muted);
  --session-ui-accent: var(--ui-brand-600);
  --session-ui-accent-alt: var(--ui-brand-700);
}

/* Market session remains visible as status, but no longer recolors the brand. */
html[data-market-session] {
  --session-ui-accent: var(--ui-brand-600);
  --session-ui-accent-alt: var(--ui-brand-700);
}

.top-bar.top-bar-redesign[data-session] {
  --top-session-accent: var(--ui-brand-600);
}

html[data-theme="light"][data-market-session] body,
html[data-theme="light"] body {
  background: var(--ui-canvas) !important;
}

html[data-theme="dark"][data-market-session] body,
html[data-theme="dark"] body {
  background: var(--ui-canvas) !important;
}

body {
  color: var(--ui-text);
  font-family: var(--ui-font);
}

body::before {
  display: none !important;
  background: none !important;
}

::selection {
  background: color-mix(in srgb, var(--ui-brand-500) 28%, transparent);
  color: var(--ui-text);
}

:where(button, a, input, select, textarea, [role="button"]):focus-visible {
  outline: 2px solid var(--ui-focus) !important;
  outline-offset: 3px;
  box-shadow: 0 0 0 4px var(--ui-focus-ring) !important;
}

/* Workspace shell */
.app-shell {
  color: var(--ui-text);
}

.sidebar,
.sidebar.expanded {
  border: 0 !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
  backdrop-filter: none;
}

html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .sidebar.expanded {
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

.sidebar-logo-text {
  color: var(--ui-text) !important;
  font-family: var(--ui-font) !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  letter-spacing: 0.15em !important;
}

.sidebar-divider {
  background: var(--ui-border) !important;
}

.nav-item {
  color: var(--ui-text-muted) !important;
  border-radius: var(--ui-radius-md) !important;
  transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease !important;
}

.nav-item[data-tone] .ultron-learn-more-nav-icon,
.sidebar-learn-more-card[data-tone] .sidebar-learn-more-card-icon {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  color: var(--ui-brand-600) !important;
  box-shadow: none !important;
}

.nav-item:hover {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  color: var(--ui-text-secondary) !important;
}

.nav-item.active {
  border-color: color-mix(in srgb, var(--ui-brand-500) 32%, var(--ui-border)) !important;
  background: color-mix(in srgb, var(--ui-brand-500) 10%, var(--ui-surface)) !important;
  color: var(--ui-brand-700) !important;
  box-shadow: inset 3px 0 0 var(--ui-brand-600) !important;
}

html[data-theme="dark"] .nav-item.active {
  color: var(--ui-brand-300) !important;
  background: color-mix(in srgb, var(--ui-brand-500) 13%, var(--ui-surface)) !important;
}

.nav-item.active .ultron-learn-more-nav-icon {
  border-color: color-mix(in srgb, var(--ui-brand-500) 34%, var(--ui-border)) !important;
  background: color-mix(in srgb, var(--ui-brand-500) 13%, var(--ui-surface)) !important;
  color: var(--ui-brand-600) !important;
}

.main-content > .top-bar.top-bar-redesign {
  border-color: var(--ui-border) !important;
  background: color-mix(in srgb, var(--ui-surface) 94%, transparent) !important;
  box-shadow: var(--ui-shadow-sm), inset 0 1px 0 color-mix(in srgb, #ffffff 52%, transparent) !important;
}

html[data-theme="dark"] .main-content > .top-bar.top-bar-redesign {
  background: color-mix(in srgb, var(--ui-surface) 94%, transparent) !important;
  box-shadow: var(--ui-shadow-sm), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

.top-system-meta,
.top-stock-card,
.top-market-status-card,
.top-forecast-meta-card {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  box-shadow: none !important;
}

.legacy-mobile-toolbar {
  border: 1px solid var(--ui-border);
  background: color-mix(in srgb, var(--ui-surface) 94%, transparent);
  box-shadow: var(--ui-shadow-sm);
  backdrop-filter: blur(18px);
}

.legacy-mobile-toolbar-toggle,
.legacy-mobile-toolbar-action,
.sidebar-mobile-close {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  color: var(--ui-text-secondary) !important;
}

.page {
  color: var(--ui-text);
}

.card,
.stat-card,
.section-card,
.dashboard-panel-card {
  border-color: var(--ui-border);
  background: var(--ui-surface);
  color: var(--ui-text);
  box-shadow: var(--ui-shadow-xs);
}

.input-field,
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
select,
textarea {
  border-color: var(--ui-border);
  background-color: var(--ui-surface);
  color: var(--ui-text);
}

::placeholder {
  color: var(--ui-text-subtle);
  opacity: 1;
}

.btn-primary,
.topic-terminal-header-btn.is-primary {
  border-color: var(--ui-brand-600) !important;
  background: var(--ui-brand-600) !important;
  color: #ffffff !important;
  box-shadow: 0 10px 24px -16px color-mix(in srgb, var(--ui-brand-600) 64%, transparent) !important;
}

.btn-primary:hover,
.topic-terminal-header-btn.is-primary:hover {
  border-color: var(--ui-brand-700) !important;
  background: var(--ui-brand-700) !important;
}

.btn-secondary,
.topic-terminal-header-btn.is-secondary {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface) !important;
  color: var(--ui-text-secondary) !important;
}

/* One brand treatment for page headers and their icons. */
:is(
  .topic-terminal-header--dashboard,
  .topic-terminal-header--forecast,
  .topic-terminal-header--options,
  .topic-terminal-header--simulations,
  .topic-terminal-header--history,
  .topic-terminal-header--price-history,
  .topic-terminal-header--tracking
) {
  --topic-accent: var(--ui-brand-600);
  --topic-accent-strong: var(--ui-brand-700);
  --topic-accent-soft: var(--ui-brand-50);
  --topic-accent-border: color-mix(in srgb, var(--ui-brand-500) 30%, var(--ui-border));
  --topic-accent-shadow: color-mix(in srgb, var(--ui-brand-600) 18%, transparent);
}

.topic-terminal-header {
  border: 0 !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

.topic-terminal-header .topic-terminal-header-icon {
  border-color: color-mix(in srgb, var(--ui-brand-500) 24%, var(--ui-border)) !important;
  background: color-mix(in srgb, var(--ui-brand-500) 10%, var(--ui-surface)) !important;
  color: var(--ui-brand-600) !important;
  box-shadow: none !important;
}

.topic-terminal-header-pill,
.topic-terminal-header-control-card,
.topic-terminal-header-status {
  border-color: var(--ui-border) !important;
  background: color-mix(in srgb, var(--ui-surface-soft) 76%, var(--ui-surface)) !important;
  color: var(--ui-text-secondary) !important;
  box-shadow: none !important;
}

.topic-terminal-header-pill-icon,
.topic-terminal-header-kicker,
.topic-terminal-header-control-kicker,
.topic-terminal-header-status-kicker {
  color: var(--ui-brand-600) !important;
}

.topic-terminal-header-title,
.topic-terminal-header-control-value,
.topic-terminal-header-control-value strong {
  color: var(--ui-text) !important;
}

.topic-terminal-header-text,
.topic-terminal-header-status-text {
  color: var(--ui-text-muted) !important;
}

/* Accessible loading and empty shells */
.loading-state.loading-state--spinner-only {
  min-height: 112px;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border-radius: var(--ui-radius-lg);
  color: var(--ui-text-muted);
}

.loading-state.loading-state--spinner-only .loader {
  width: 30px;
  height: 30px;
  border: 3px solid color-mix(in srgb, var(--ui-brand-500) 18%, var(--ui-border));
  border-top-color: var(--ui-brand-600);
  box-shadow: none;
}

.loading-state-label {
  display: block;
  color: var(--ui-text-muted);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.01em;
  text-align: center;
}

.loading-state.loading-state--spinner-only:not(:has(.loading-state-label))::after {
  content: attr(aria-label);
  display: block;
  color: var(--ui-text-muted);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.01em;
  text-align: center;
}

.empty-state,
.no-data,
.no-results,
.history-workspace-empty {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  color: var(--ui-text-secondary) !important;
}

/* Dashboard: Week Ahead workspace */
#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell {
  position: relative;
  display: grid;
  gap: 14px;
  padding: 0 0 18px !important;
  overflow: hidden !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-xl) !important;
  background: var(--ui-surface) !important;
  box-shadow: var(--ui-shadow-md) !important;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell::before {
  content: "" !important;
  display: block !important;
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  z-index: 2;
  background: var(--ui-brand-600);
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell .week-ahead-header--forecast {
  position: relative;
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  justify-content: space-between;
  gap: 20px !important;
  margin: 0 !important;
  padding: 22px 22px 19px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ui-border) !important;
  border-radius: 0 !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

.week-ahead-heading-group {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.week-ahead-heading-icon,
.dashboard-trajectory-toolbar-icon,
.week-ahead-section-heading-icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid color-mix(in srgb, var(--ui-brand-500) 24%, var(--ui-border));
  background: color-mix(in srgb, var(--ui-brand-500) 10%, var(--ui-surface));
  color: var(--ui-brand-600);
}

.week-ahead-heading-icon {
  width: 44px;
  height: 44px;
  border-radius: var(--ui-radius-md);
}

.week-ahead-heading-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.week-ahead-eyebrow {
  color: var(--ui-brand-600);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1.2;
  text-transform: uppercase;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell .week-ahead-title {
  margin: 0;
  color: var(--ui-text) !important;
  font-family: var(--ui-font) !important;
  font-size: clamp(19px, 1.7vw, 24px) !important;
  font-weight: 750 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.2;
  text-transform: none !important;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell .week-ahead-subtitle {
  max-width: 690px;
  margin: 0;
  color: var(--ui-text-muted) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}

.week-ahead-header-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.week-ahead-meta-chip {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  border: 1px solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-text-secondary);
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
  box-shadow: var(--ui-shadow-xs);
}

.week-ahead-meta-chip svg {
  color: var(--ui-brand-600);
}

#page-dashboard .dashboard-trajectory-card {
  margin: 0 16px 2px !important;
  overflow: hidden;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-lg) !important;
  background: var(--ui-surface-soft) !important;
  box-shadow: none !important;
}

.dashboard-trajectory-toolbar,
.week-ahead-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.dashboard-trajectory-toolbar {
  min-height: 58px;
  padding: 11px 14px;
  border-bottom: 1px solid var(--ui-border);
  background: var(--ui-surface);
}

.dashboard-trajectory-toolbar-copy,
.week-ahead-section-heading > span:last-child {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.dashboard-trajectory-toolbar-copy > span:last-child,
.week-ahead-section-heading > span:last-child {
  display: grid;
  gap: 2px;
}

.dashboard-trajectory-toolbar-copy strong,
.week-ahead-section-heading strong {
  color: var(--ui-text);
  font-size: 12px;
  font-weight: 750;
  line-height: 1.3;
}

.dashboard-trajectory-toolbar-copy small,
.week-ahead-section-heading small {
  color: var(--ui-text-muted);
  font-size: 10px;
  font-weight: 500;
  line-height: 1.35;
}

.dashboard-trajectory-toolbar-icon,
.week-ahead-section-heading-icon {
  width: 32px;
  height: 32px;
  border-radius: 10px;
}


#page-dashboard .dashboard-trajectory-card #miniChartArea {
  min-height: 240px;
  padding: 12px;
  background: var(--ui-surface-soft) !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea > .loading-state {
  min-height: 216px;
  border: 1px dashed var(--ui-border);
  background: var(--ui-surface);
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-card {
  padding: 16px !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-stats-bar {
  grid-auto-rows: auto !important;
  gap: 8px !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-stat-item {
  min-height: 92px !important;
  padding: 12px !important;
  border-color: var(--ui-border) !important;
  border-radius: 12px !important;
  background: var(--ui-surface-soft) !important;
  box-shadow: none !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-stat-item[data-tone="info"] .trajgraph-stat-value,
#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-stat-value {
  color: var(--stat-tone, var(--ui-text)) !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea :is(.trajgraph-stat-label, .trajgraph-stat-sub, .trajgraph-y-tick, .trajgraph-y-axis-label, .trajgraph-legend) {
  color: var(--ui-text-muted) !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-svg-stage {
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-active-readout {
  border-color: color-mix(in srgb, var(--ui-brand-500) 30%, var(--ui-border)) !important;
  background: color-mix(in srgb, var(--ui-surface) 94%, transparent) !important;
  box-shadow: var(--ui-shadow-sm) !important;
}

.week-ahead-content-block {
  display: grid;
  gap: 10px;
  margin: 0 16px;
  padding: 14px;
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-radius-lg);
  background: var(--ui-surface-soft);
}

.week-ahead-section-heading {
  justify-content: flex-start;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell #dashForecastGrid {
  margin: 0 !important;
  padding: 10px !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell #dashForecastGrid > .loading-state {
  min-width: 100%;
  border: 1px dashed var(--ui-border);
  background: var(--ui-surface-soft);
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell #dashForecastGrid .dash-day-widget {
  min-height: 174px !important;
  border-color: var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  background: var(--ui-surface) !important;
  box-shadow: var(--ui-shadow-xs) !important;
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease !important;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell #dashForecastGrid .dash-day-widget:hover {
  border-color: color-mix(in srgb, var(--ui-brand-500) 34%, var(--ui-border)) !important;
  box-shadow: var(--ui-shadow-sm) !important;
  transform: translateY(-1px) !important;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell #dashForecastGrid .dash-day-widget.selected,
#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell #dashForecastGrid .dash-day-widget.active {
  border-color: var(--ui-brand-500) !important;
  box-shadow: 0 0 0 3px var(--ui-focus-ring), var(--ui-shadow-sm) !important;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell #dashForecastGrid :is(.dash-day-label, .dash-day-date, .dash-day-move) {
  color: var(--ui-text-muted) !important;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell #dashForecastGrid .dash-day-price {
  font-size: clamp(21px, 1.8vw, 26px) !important;
  font-weight: 750 !important;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell #dashForecastDetail {
  margin: 0 !important;
  padding: 14px !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell #dashForecastDetail > .loading-state {
  border: 1px dashed var(--ui-border);
  background: var(--ui-surface-soft);
}

/* Profile Hub uses the same surfaces and one brand color for non-semantic icons. */
.profile-hub-modal {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface) !important;
  box-shadow: 0 32px 80px -34px rgba(15, 23, 42, 0.46) !important;
}

.profile-hub-sidebar,
.profile-hub-content,
.profile-hub-content-scroll,
.profile-identity-card {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface) !important;
  color: var(--ui-text) !important;
}

.profile-identity-cover {
  background: var(--ui-brand-700) !important;
}

.profile-avatar {
  border-color: var(--ui-surface) !important;
  background: var(--ui-brand-100) !important;
  color: var(--ui-brand-700) !important;
  box-shadow: 0 10px 22px -16px color-mix(in srgb, var(--ui-brand-600) 60%, transparent) !important;
}

.profile-hub-kicker,
.profile-hub-kicker i {
  color: var(--ui-brand-600) !important;
}

.profile-hub-title,
.profile-identity-name,
.setting-label,
.profile-form-title,
.profile-data-title {
  color: var(--ui-text) !important;
}

.profile-hub-desc,
.profile-identity-email,
.profile-identity-meta,
.setting-desc,
.profile-form-message {
  color: var(--ui-text-muted) !important;
}

:is(
  #profileHubTabProfile,
  #profileHubTabSettings,
  #profileHubTabData,
  #profileHubTabAbout,
  #profileHubTabNotifications,
  #profileHubTabSecurity,
  #profileHubTabPlans,
  #profileHubTabBilling,
  #profileHubTabAdmin
) {
  --profile-hub-icon-color: var(--ui-brand-600) !important;
}

.profile-hub-tab {
  color: var(--ui-text-muted) !important;
  border-radius: var(--ui-radius-md) !important;
}

.profile-hub-tab:hover {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  color: var(--ui-text-secondary) !important;
}

.profile-hub-tab.active,
.profile-hub-tab.profile-hub-tab-admin.active {
  border-color: color-mix(in srgb, var(--ui-brand-500) 30%, var(--ui-border)) !important;
  background: color-mix(in srgb, var(--ui-brand-500) 11%, var(--ui-surface)) !important;
  color: var(--ui-brand-700) !important;
  box-shadow: inset 3px 0 0 var(--ui-brand-600) !important;
}

html[data-theme="dark"] .profile-hub-tab.active,
html[data-theme="dark"] .profile-hub-tab.profile-hub-tab-admin.active {
  color: var(--ui-brand-300) !important;
}

.profile-settings-grid .card,
.profile-overview-grid .card,
.profile-security-grid .card,
.profile-form-section,
.profile-data-section {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  box-shadow: none !important;
}

/* Autosave status is populated by the settings controller. */
.profile-hub-autosave-status {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  padding: 0 10px;
  border: 1px solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface-soft);
  color: var(--ui-text-muted);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.02em;
  line-height: 1;
  transition: color 160ms ease, border-color 160ms ease, background-color 160ms ease;
}

.profile-hub-autosave-status::before {
  content: none;
}

.profile-hub-autosave-status > i {
  width: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: currentColor;
  font-size: 15px;
  line-height: 1;
}

.profile-hub-autosave-status.is-saving {
  border-color: color-mix(in srgb, var(--ui-brand-500) 30%, var(--ui-border));
  background: color-mix(in srgb, var(--ui-brand-500) 9%, var(--ui-surface));
  color: var(--ui-brand-600);
}

.profile-hub-autosave-status.is-saving > i {
  animation: ultronAutosavePulse 1.15s ease-in-out infinite;
}

.profile-hub-autosave-status.is-saved {
  border-color: var(--ui-success-border);
  background: var(--ui-success-soft);
  color: var(--ui-success);
}

.profile-hub-autosave-status.is-error {
  border-color: var(--ui-danger-border);
  background: var(--ui-danger-soft);
  color: var(--ui-danger);
}

@keyframes ultronAutosavePulse {
  0%,
  100% {
    opacity: 0.45;
    transform: scale(0.82);
  }
  50% {
    opacity: 1;
    transform: scale(1);
  }
}

/* Responsive layout */
@media (max-width: 1180px) {
  #page-dashboard .dashboard-week-summary-card.week-ahead-react-shell .week-ahead-header--forecast {
    align-items: flex-start;
  }

  .week-ahead-header-meta {
    max-width: 250px;
  }
}

@media (max-width: 980px) {
  .sidebar,
  .sidebar.expanded {
    border-radius: 0 var(--ui-radius-xl) var(--ui-radius-xl) 0 !important;
  }

  .legacy-mobile-toolbar {
    display: flex;
  }

  #page-dashboard .dashboard-week-summary-card.week-ahead-react-shell .week-ahead-header--forecast {
    flex-direction: column !important;
  }

  .week-ahead-header-meta {
    justify-content: flex-start;
    max-width: none;
  }

  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-stats-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .profile-hub-sidebar {
    border-right: 0 !important;
    border-bottom: 1px solid var(--ui-border) !important;
  }

  .profile-hub-sidebar-nav {
    display: flex !important;
    max-height: none !important;
    padding: 0 14px 12px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x proximity;
  }

  .profile-hub-tab {
    width: auto !important;
    min-width: max-content;
    min-height: 42px !important;
    scroll-snap-align: start;
  }
}

@media (max-width: 720px) {
  #page-dashboard .dashboard-week-summary-card.week-ahead-react-shell {
    gap: 10px;
    border-radius: var(--ui-radius-lg) !important;
  }

  #page-dashboard .dashboard-week-summary-card.week-ahead-react-shell .week-ahead-header--forecast {
    padding: 18px 16px 16px !important;
  }

  .week-ahead-heading-group {
    align-items: flex-start;
  }

  .week-ahead-heading-icon {
    width: 38px;
    height: 38px;
  }

  #page-dashboard .dashboard-week-summary-card.week-ahead-react-shell .week-ahead-title {
    font-size: 18px !important;
  }

  .week-ahead-header-meta {
    width: 100%;
  }

  .week-ahead-meta-chip {
    flex: 1 1 auto;
    justify-content: center;
  }

  #page-dashboard .dashboard-trajectory-card,
  .week-ahead-content-block {
    margin-inline: 10px !important;
  }

  .dashboard-trajectory-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }


  #page-dashboard .dashboard-trajectory-card #miniChartArea {
    padding: 8px;
  }

  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-card {
    padding: 12px !important;
  }

  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-stats-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-stat-item {
    min-height: 88px !important;
  }

  .week-ahead-content-block {
    padding: 10px;
  }

  #page-dashboard .dashboard-week-summary-card.week-ahead-react-shell #dashForecastGrid .dash-day-widget {
    min-height: 158px !important;
  }

  .profile-identity-card {
    display: none;
  }
}

@media (max-width: 440px) {
  .week-ahead-heading-icon {
    display: none;
  }

  .week-ahead-meta-chip {
    width: 100%;
  }


  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-stats-bar {
    grid-template-columns: 1fr !important;
  }

  .week-ahead-section-heading small,
  .dashboard-trajectory-toolbar-copy small {
    display: none;
  }
}

/* Forecast status is a direct freshness label, not another scored dashboard. */
#page-dashboard #signalMeterContainer.signal-meter-modern-shell :is(.signal-modern__hero, .signal-modern__metric, .signal-distribution-card, .stat-card) {
  border: 0 !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .signal-modern__metric--forecast {
  min-height: 92px !important;
  background: var(--ui-brand-50) !important;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .signal-modern__metric--forecast .signal-modern__metric-track,
#page-dashboard #signalMeterContainer.signal-meter-modern-shell .signal-modern__metric--forecast .signal-modern__status-tags {
  display: none !important;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .signal-modern__metric--forecast #i5dot {
  background: var(--ui-brand-600) !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .signal-modern__metric--forecast #i5val {
  color: var(--ui-brand-600) !important;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .signal-modern__metric-track {
  border: 0 !important;
  background: var(--ui-surface-muted) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .signal-modern__metric-track > div,
#page-dashboard #signalMeterContainer.signal-meter-modern-shell :is(#signalBullBar, #signalFlatBar, #signalBearBar) {
  background-image: none !important;
  box-shadow: none !important;
  transition-duration: 300ms !important;
}

/* Authentication popup uses the same flat indigo treatment as the workspace. */
.auth-modal-overlay {
  background: rgba(15, 23, 42, 0.46) !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

#authModalPanel.auth-modal,
#authModalPanel .auth-card-shell {
  border: 0 !important;
  background: var(--ui-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#authModalPanel .auth-tabbar {
  border: 0 !important;
  background: var(--ui-surface-muted) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#authModalPanel .auth-tab-indicator {
  display: none !important;
}

#authModalPanel .auth-tab-btn {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--ui-text-muted) !important;
}

#authModalPanel .auth-tab-btn.active {
  background: var(--ui-brand-50) !important;
  color: var(--ui-brand-700) !important;
}

#authModalPanel .auth-modal-footer {
  border: 0 !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
}

#authModalPanel .auth-main-btn,
.popup .btn-primary,
.popup .popup-btn-primary {
  border: 0 !important;
  background: var(--ui-brand-600) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

#authModalPanel .auth-main-btn:hover,
.popup .btn-primary:hover,
.popup .popup-btn-primary:hover {
  background: var(--ui-brand-700) !important;
  transform: none !important;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .profile-hub-autosave-status.is-saving > i {
    animation: none !important;
  }

  #page-dashboard .dashboard-week-summary-card.week-ahead-react-shell #dashForecastGrid .dash-day-widget:hover {
    transform: none !important;
  }
}

/* Standalone access and resource pages share the same indigo workspace brand. */
.ultron-access-body {
  background: var(--ui-canvas) !important;
  color: var(--ui-text);
}

.ultron-access-bg {
  background: var(--ui-canvas) !important;
}

.ultron-access-bg::after {
  background: color-mix(in srgb, var(--ui-brand-500) 22%, transparent) !important;
}

.ultron-auth-trace-aurora-a {
  display: none !important;
  background: none !important;
}

.ultron-auth-trace-aurora-b {
  display: none !important;
  background: none !important;
}

.ultron-auth-trace-sweep {
  display: none !important;
  background: none !important;
}

.ultron-auth-trace-ring,
.ultron-auth-trace-ring-b {
  border-color: color-mix(in srgb, var(--ui-brand-500) 14%, transparent) !important;
}

.ultron-access-card {
  border-color: color-mix(in srgb, var(--ui-border) 78%, transparent) !important;
  background: color-mix(in srgb, var(--ui-surface) 94%, transparent) !important;
  box-shadow: var(--ui-shadow-md) !important;
}

.ultron-access-welcome,
.ultron-access-copy,
.ultron-access-kicker,
.ultron-access-lock-row,
.ultron-access-legal,
.ultron-access-copyright {
  color: var(--ui-text-muted) !important;
}

.ultron-access-title,
.ultron-access-copy strong,
.ultron-access-legal a {
  color: var(--ui-text) !important;
}

.ultron-access-primary-btn,
.auth-main-btn,
.auth-gradient-btn {
  border-color: transparent !important;
  background: var(--ui-brand-600) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.ultron-access-primary-btn:hover,
.auth-main-btn:hover,
.auth-gradient-btn:hover {
  background: var(--ui-brand-700) !important;
  box-shadow: none !important;
}

.ultron-access-secondary-btn {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-raised) !important;
  color: var(--ui-text-secondary) !important;
  box-shadow: var(--ui-shadow-xs) !important;
}

.ultron-access-secondary-btn:hover {
  border-color: color-mix(in srgb, var(--ui-brand-500) 36%, var(--ui-border)) !important;
  background: var(--ui-surface-soft) !important;
}

.ultron-access-legal {
  border-color: var(--ui-border) !important;
}

.ultron-access-legal a:hover,
.auth-forgot-link,
.auth-forgot-link:hover {
  color: var(--ui-brand-600) !important;
}

.auth-input-field:focus,
.auth-modal .input-field:focus {
  border-color: var(--ui-focus) !important;
  box-shadow: 0 0 0 4px var(--ui-focus-ring) !important;
}

#authModalPanel .auth-main-btn:not(.btn-run-forecast),
#authModalPanel .auth-gradient-btn:not(.btn-run-forecast),
#authModalPanel .auth-reg-complete-actions .btn.btn-primary,
#authModalPanel .auth-recovery-code-actions .btn.btn-primary {
  border-color: transparent !important;
  background: var(--ui-brand-600) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

#authModalPanel .auth-main-btn:hover:not(:disabled),
#authModalPanel .auth-gradient-btn:hover:not(:disabled),
#authModalPanel .auth-reg-complete-actions .btn.btn-primary:hover:not(:disabled),
#authModalPanel .auth-recovery-code-actions .btn.btn-primary:hover:not(:disabled) {
  background: var(--ui-brand-700) !important;
  box-shadow: none !important;
}

html[data-theme='dark'] #authModalPanel .auth-tabbar {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface-soft) !important;
}

html[data-theme='dark'] #authModalPanel .auth-tab-indicator {
  background: color-mix(in srgb, var(--ui-brand-500) 18%, var(--ui-surface-raised)) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ui-brand-300) 24%, transparent) !important;
}

html[data-theme='dark'] #authModalPanel .auth-tabbar::after,
html[data-theme='dark'] #authModalPanel .auth-tab-indicator::before {
  display: none !important;
}

html[data-theme='dark'] #authModalPanel .auth-tab-btn {
  border-color: transparent !important;
  background: transparent !important;
  color: var(--ui-text-muted) !important;
}

html[data-theme='dark'] #authModalPanel .auth-tab-btn:hover:not(.active) {
  background: color-mix(in srgb, var(--ui-brand-500) 8%, transparent) !important;
  color: var(--ui-text-secondary) !important;
}

html[data-theme='dark'] #authModalPanel .auth-tab-btn.active {
  color: var(--ui-brand-300) !important;
}

html[data-theme='dark'] #authModalPanel .auth-legal {
  border-color: var(--ui-border) !important;
  border-top-color: var(--ui-border-strong) !important;
  background: color-mix(in srgb, var(--ui-surface-raised) 96%, transparent) !important;
  color: var(--ui-text-muted) !important;
  box-shadow: 0 20px 44px -30px rgba(0, 0, 0, 0.86) !important;
}

html[data-theme='dark'] #authModalPanel .auth-legal a {
  color: var(--ui-text-secondary) !important;
}

html[data-theme='dark'] #authModalPanel .auth-legal a:hover {
  color: var(--ui-brand-300) !important;
}

html[data-theme='dark'] .ultron-access-bg {
  background: var(--ui-canvas) !important;
}

html[data-theme='dark'] .ultron-access-card {
  border-color: var(--ui-border) !important;
  background: color-mix(in srgb, var(--ui-surface) 95%, transparent) !important;
  box-shadow: 0 30px 68px -30px rgba(0, 0, 0, 0.9) !important;
}

/* Page accents are navigational decoration; reserve green/red/amber for state. */
.ultron-resource-hero:is(.is-green, .is-gold, .is-orange, .is-red) {
  background: var(--bg-card) !important;
}

.ultron-resource-root:is(.is-green, .is-gold, .is-orange, .is-red) .ultron-resource-hero-icon,
.ultron-resource-root:is(.is-green, .is-gold, .is-orange, .is-red) .ultron-resource-bullet-icon {
  color: var(--ui-brand-600) !important;
}

.ultron-resource-root:is(.is-green, .is-gold, .is-orange, .is-red) .ultron-resource-quick-link.is-active {
  border-color: color-mix(in srgb, var(--ui-brand-500) 44%, var(--ui-border-strong)) !important;
}

.ultron-terms-policies-hero-icon,
.ultron-privacy-policy-hero-icon,
.ultron-terms-policies-hero-icon-svg,
.ultron-privacy-policy-hero-icon-svg,
.ultron-terms-policies-hero-kicker,
.ultron-privacy-policy-hero-kicker,
.ultron-terms-policies-panel-kicker,
.ultron-privacy-policy-panel-kicker {
  border-color: color-mix(in srgb, var(--ui-brand-500) 34%, var(--ui-border)) !important;
  color: var(--ui-brand-600) !important;
}

html[data-theme='dark'] .ultron-terms-policies-hero-icon,
html[data-theme='dark'] .ultron-privacy-policy-hero-icon,
html[data-theme='dark'] .ultron-terms-policies-hero-icon-svg,
html[data-theme='dark'] .ultron-privacy-policy-hero-icon-svg,
html[data-theme='dark'] .ultron-terms-policies-hero-kicker,
html[data-theme='dark'] .ultron-privacy-policy-hero-kicker,
html[data-theme='dark'] .ultron-terms-policies-panel-kicker,
html[data-theme='dark'] .ultron-privacy-policy-panel-kicker {
  color: var(--ui-brand-300) !important;
}

/* --------------------------------------------------------------------------
 * Popup and modal surfaces
 *
 * Legacy, React, and CSS-module dialogs all resolve to the same quiet surface
 * hierarchy. Status colors remain reserved for success, warning, and danger.
 * -------------------------------------------------------------------------- */

:where(
  .popup-overlay,
  .auth-modal-overlay,
  .profile-hub-modal-overlay,
  .forecast-settings-picker-overlay,
  .forecast-short-shares-popup-overlay,
  .top-run-forecast-modal-overlay,
  .welcome-overlay,
  .ultron-system-updates-push-modal-backdrop
) {
  background: rgba(15, 23, 42, 0.42) !important;
  background-image: none !important;
  backdrop-filter: blur(8px) !important;
}

html[data-theme="dark"] :where(
  .popup-overlay,
  .auth-modal-overlay,
  .profile-hub-modal-overlay,
  .forecast-settings-picker-overlay,
  .forecast-short-shares-popup-overlay,
  .top-run-forecast-modal-overlay,
  .welcome-overlay,
  .ultron-system-updates-push-modal-backdrop
) {
  background: rgba(2, 6, 23, 0.7) !important;
}

:where(
  .feedback-modal-backdrop,
  .forecast-settings-picker-backdrop,
  .forecast-short-shares-popup-backdrop,
  [class*="SignOutModal-module__"][class*="__backdrop"],
  [class*="BillingUpgradeSuccessModal-module__"][class*="__backdrop"]
) {
  background: rgba(15, 23, 42, 0.42) !important;
  background-image: none !important;
  backdrop-filter: blur(8px) !important;
}

html[data-theme="dark"] :where(
  .feedback-modal-backdrop,
  .forecast-settings-picker-backdrop,
  .forecast-short-shares-popup-backdrop,
  [class*="SignOutModal-module__"][class*="__backdrop"],
  [class*="BillingUpgradeSuccessModal-module__"][class*="__backdrop"]
) {
  background: rgba(2, 6, 23, 0.7) !important;
}

:is(
  .popup,
  #authModalPanel,
  .profile-hub-modal,
  .forecast-settings-picker-panel,
  .forecast-short-shares-popup,
  .top-run-forecast-modal,
  .welcome-panel,
  .system-update-image-lightbox-card,
  .ultron-system-updates-push-modal,
  [class*="SignOutModal-module__"][role="dialog"],
  [class*="BillingUpgradeSuccessModal-module__"][role="dialog"]
) {
  border: 1px solid var(--ui-border-strong) !important;
  background: var(--ui-surface) !important;
  background-image: none !important;
  box-shadow: var(--ui-shadow-sm) !important;
  color: var(--ui-text) !important;
}

:is(
  #alertsClearPopup,
  #predictionClearPopup,
  #forecastUsageLimitPopup,
  #resetPopup,
  #tradeDayPopup,
  #tradeEditorPopup,
  #tradeCompletePopup,
  #systemLogDayPopup,
  #alertsDayPopup,
  #priceLogDayPopup,
  #actionConfirmPopup,
  #surgePopup,
  #feedbackPopup,
  #updatesPopupOverlay
) .popup,
#authModalPanel.auth-modal.simple-auth-modal {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface) !important;
  background-image: none !important;
  box-shadow: var(--ui-shadow-sm) !important;
  color: var(--ui-text) !important;
}

html[data-theme] :is(
  #alertsClearPopup,
  #predictionClearPopup,
  #forecastUsageLimitPopup,
  #resetPopup,
  #tradeDayPopup,
  #tradeEditorPopup,
  #tradeCompletePopup,
  #systemLogDayPopup,
  #alertsDayPopup,
  #priceLogDayPopup,
  #actionConfirmPopup
) .popup {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface) !important;
  background-image: none !important;
  box-shadow: var(--ui-shadow-sm) !important;
  color: var(--ui-text) !important;
}

:is(
  .popup,
  #authModalPanel,
  .profile-hub-modal,
  .forecast-settings-picker-panel,
  .forecast-short-shares-popup,
  .top-run-forecast-modal,
  .welcome-panel,
  .system-update-image-lightbox-card,
  .ultron-system-updates-push-modal,
  [class*="SignOutModal-module__"][role="dialog"],
  [class*="BillingUpgradeSuccessModal-module__"][role="dialog"]
)::before,
:is(
  .popup,
  #authModalPanel,
  .profile-hub-modal,
  .forecast-settings-picker-panel,
  .forecast-short-shares-popup,
  .top-run-forecast-modal,
  .welcome-panel,
  .system-update-image-lightbox-card,
  .ultron-system-updates-push-modal,
  [class*="SignOutModal-module__"][role="dialog"],
  [class*="BillingUpgradeSuccessModal-module__"][role="dialog"]
)::after {
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

:where(.popup-title, .popup-body, .auth-modal-title, .profile-hub-title, .welcome-title) {
  color: var(--ui-text) !important;
}

:where(
  .popup-body,
  .auth-modal-subtitle,
  .profile-hub-desc,
  .forecast-settings-picker-subtitle,
  .forecast-short-shares-popup-subtitle,
  .welcome-copy
) {
  color: var(--ui-text-muted) !important;
}

:where(
  .popup-actions,
  .auth-modal-footer,
  .forecast-settings-picker-head,
  .forecast-short-shares-popup-head,
  .welcome-actions,
  .ultron-system-updates-push-modal-actions
) {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Common dialog controls use solid, high-contrast surfaces. */
:is(
  .popup,
  #authModalPanel,
  .profile-hub-modal,
  .forecast-settings-picker-panel,
  .forecast-short-shares-popup,
  .top-run-forecast-modal,
  .welcome-panel,
  .ultron-system-updates-push-modal
) :is(.btn-primary, .auth-main-btn, .auth-gradient-btn),
#authModalPanel :where(.auth-main-btn, .auth-gradient-btn),
.top-run-forecast-modal .top-run-btn.confirm,
.welcome-panel .welcome-actions .btn-primary,
.ultron-system-updates-push-modal-push {
  border-color: #3730a3 !important;
  background: #4338ca !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

:is(
  .popup,
  #authModalPanel,
  .profile-hub-modal,
  .forecast-settings-picker-panel,
  .forecast-short-shares-popup,
  .top-run-forecast-modal,
  .welcome-panel,
  .ultron-system-updates-push-modal
) :is(.btn-primary, .auth-main-btn, .auth-gradient-btn):hover:not(:disabled),
#authModalPanel :where(.auth-main-btn, .auth-gradient-btn):hover:not(:disabled),
.top-run-forecast-modal .top-run-btn.confirm:hover:not(:disabled),
.welcome-panel .welcome-actions .btn-primary:hover:not(:disabled),
.ultron-system-updates-push-modal-push:hover:not(:disabled) {
  border-color: #312e81 !important;
  background: #3730a3 !important;
  box-shadow: none !important;
}

:is(
  .popup,
  #authModalPanel,
  .profile-hub-modal,
  .forecast-settings-picker-panel,
  .forecast-short-shares-popup,
  .top-run-forecast-modal,
  .welcome-panel,
  .ultron-system-updates-push-modal
) :is(.btn-secondary, .top-run-btn.cancel),
.ultron-system-updates-push-modal :where(
  .ultron-system-updates-push-modal-cancel,
  .ultron-system-updates-push-modal-save
) {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface-muted) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--ui-text-secondary) !important;
}

:is(
  .popup,
  #authModalPanel,
  .profile-hub-modal,
  .forecast-settings-picker-panel,
  .forecast-short-shares-popup,
  .top-run-forecast-modal,
  .welcome-panel,
  .ultron-system-updates-push-modal
) :is(.btn-secondary, .top-run-btn.cancel):hover:not(:disabled),
.ultron-system-updates-push-modal :where(
  .ultron-system-updates-push-modal-cancel,
  .ultron-system-updates-push-modal-save
):hover:not(:disabled) {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface-soft) !important;
  color: var(--ui-text) !important;
}

/* Auth modal */
#authModalPanel :is(
  .auth-card-shell,
  .auth-tabbar,
  .auth-legal,
  .auth-reg-complete-card,
  .auth-recovery-code-card,
  .auth-success-card
) {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#authModalPanel .auth-tab-indicator {
  border: 1px solid color-mix(in srgb, var(--ui-brand-500) 38%, var(--ui-border)) !important;
  background: var(--ui-brand-50) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#authModalPanel :is(.auth-tabbar, .auth-tab-indicator)::before,
#authModalPanel :is(.auth-tabbar, .auth-tab-indicator)::after {
  content: none !important;
  background: none !important;
  box-shadow: none !important;
}

#authModalPanel :is(.auth-input-field, .input-field) {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface-raised) !important;
  box-shadow: none !important;
  color: var(--ui-text) !important;
}

#authModalPanel .auth-message.error {
  color: var(--ui-danger) !important;
}

#authModalPanel .auth-message.success {
  color: var(--ui-success) !important;
}

/* Profile Hub and its nested settings dialogs */
.profile-hub-modal {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface) !important;
  background-image: none !important;
  box-shadow: var(--ui-shadow-sm) !important;
}

#profileHubModalPanel :is(
  .profile-hub-sidebar,
  .profile-hub-main-panel,
  .profile-identity-card,
  .profile-modern-card,
  .profile-system-card,
  .profile-form-card,
  .profile-data-management-card,
  .profile-forecast-mode-card,
  .profile-referral-panel,
  .billing-plan-card,
  .billing-plan-social-proof,
  .card
) {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#profileHubModalPanel :is(.profile-hub-hero, .billing-hero) {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

#profileHubModalPanel :is(
  .profile-hub-hero,
  .billing-hero,
  .profile-modern-card,
  .profile-system-card,
  .billing-plan-card
)::before,
#profileHubModalPanel :is(
  .profile-hub-hero,
  .billing-hero,
  .profile-modern-card,
  .profile-system-card,
  .billing-plan-card
)::after {
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

.profile-hub-modal .profile-identity-cover {
  background: var(--ui-brand-600) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#profileHubModalPanel :is(.profile-avatar, .profile-avatar-upload, .profile-avatar-cropper-preview-fill) {
  border-color: var(--ui-border-strong) !important;
  background-color: var(--ui-surface-muted) !important;
  box-shadow: none !important;
}

#profileHubModalPanel .profile-hub-tab {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ui-text-muted) !important;
}

#profileHubModalPanel .profile-hub-tab:hover {
  background: var(--ui-surface-muted) !important;
  color: var(--ui-text) !important;
}

#profileHubModalPanel .profile-hub-tab.active {
  border-color: color-mix(in srgb, var(--ui-brand-500) 42%, var(--ui-border)) !important;
  background: var(--ui-brand-50) !important;
  box-shadow: none !important;
  color: var(--ui-brand-700) !important;
}

#profileHubModalPanel :is(.profile-input-shell, .profile-referral-input-shell, .profile-upload-dropzone) {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface-raised) !important;
  background-image: none !important;
  box-shadow: none !important;
}

:where(.forecast-settings-picker-panel, .forecast-short-shares-popup) :where(
  .forecast-settings-picker-current,
  .forecast-settings-picker-option,
  .forecast-settings-picker-note,
  .forecast-short-shares-popup-current,
  .forecast-short-shares-popup-option,
  .billing-cancel-feedback-section,
  .billing-cancel-feedback-option,
  .profile-email-verification-code-card,
  .card
) {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

:where(.forecast-settings-picker-panel, .forecast-short-shares-popup) :where(
  .forecast-settings-picker-option:hover,
  .forecast-settings-picker-option.active,
  .forecast-settings-picker-option.is-selected,
  .forecast-short-shares-popup-option:hover,
  .forecast-short-shares-popup-option.active,
  .forecast-short-shares-popup-option.is-selected
) {
  border-color: color-mix(in srgb, var(--ui-brand-500) 48%, var(--ui-border)) !important;
  background: var(--ui-brand-50) !important;
  box-shadow: none !important;
}

/* Confirmation, feedback, usage-limit, and movement dialogs */
#actionConfirmPopup .action-confirm-shell,
#actionConfirmPopup:is(.is-profile-hub-save, .is-market-warning, .is-add-trade) .action-confirm-shell {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface) !important;
  background-image: none !important;
  box-shadow: var(--ui-shadow-sm) !important;
}

#actionConfirmPopup:is(.is-profile-hub-save, .is-market-warning, .is-add-trade) {
  background: rgba(15, 23, 42, 0.42) !important;
  background-image: none !important;
  backdrop-filter: blur(8px) !important;
}

html[data-theme="dark"] #actionConfirmPopup:is(.is-profile-hub-save, .is-market-warning, .is-add-trade) {
  background: rgba(2, 6, 23, 0.7) !important;
}

#actionConfirmPopup:is(.is-profile-hub-save, .is-market-warning, .is-add-trade) .popup.action-confirm-shell {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface) !important;
  background-image: none !important;
  box-shadow: var(--ui-shadow-sm) !important;
}

#actionConfirmPopup:is(.is-profile-hub-save, .is-market-warning, .is-add-trade) .popup.action-confirm-shell::before,
#actionConfirmPopup:is(.is-profile-hub-save, .is-market-warning, .is-add-trade) .popup.action-confirm-shell::after {
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

#actionConfirmPopup :where(.action-confirm-hero, .action-confirm-profile-hero) {
  background: var(--ui-brand-50) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#actionConfirmPopup :where(
  .action-confirm-hero,
  .action-confirm-warning-hero,
  .action-confirm-profile-hero,
  .action-confirm-market-card,
  .action-confirm-trade-card
)::before,
#actionConfirmPopup :where(
  .action-confirm-hero,
  .action-confirm-warning-hero,
  .action-confirm-profile-hero,
  .action-confirm-market-card,
  .action-confirm-trade-card
)::after {
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

#actionConfirmPopup.is-market-warning :where(.action-confirm-warning-hero, .action-confirm-market-card) {
  border-color: var(--ui-warning-border) !important;
  background: var(--ui-warning-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--ui-warning) !important;
}

#actionConfirmPopup.is-market-warning .action-confirm-warning-hero-icon {
  border-color: var(--ui-warning-border) !important;
  background: var(--ui-warning-soft) !important;
  box-shadow: none !important;
  color: var(--ui-warning) !important;
}

#actionConfirmPopup.is-market-warning #actionConfirmBtn.action-confirm-primary-btn {
  border-color: #78350f !important;
  background: #92400e !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

#actionConfirmPopup.is-market-warning #actionConfirmBtn.action-confirm-primary-btn:hover:not(:disabled) {
  border-color: #451a03 !important;
  background: #78350f !important;
  box-shadow: none !important;
}

#actionConfirmPopup:is(.is-profile-hub-save, .is-add-trade) #actionConfirmBtn.action-confirm-primary-btn {
  border-color: #3730a3 !important;
  background: #4338ca !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

#actionConfirmPopup:is(.is-profile-hub-save, .is-add-trade) #actionConfirmBtn.action-confirm-primary-btn:hover:not(:disabled) {
  border-color: #312e81 !important;
  background: #3730a3 !important;
  box-shadow: none !important;
}

#actionConfirmPopup:is(.is-profile-hub-save, .is-market-warning, .is-add-trade) .action-confirm-cancel-btn {
  border: 1px solid var(--ui-border-strong) !important;
  background: var(--ui-surface-muted) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--ui-text-secondary) !important;
}

#actionConfirmPopup:is(.is-profile-hub-save, .is-market-warning, .is-add-trade) .action-confirm-cancel-btn:hover:not(:disabled) {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface-soft) !important;
  box-shadow: none !important;
  color: var(--ui-text) !important;
}

#actionConfirmPopup.is-add-trade .action-confirm-trade-card {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#actionConfirmPopup.is-add-trade[data-trade-tone="bull"] .action-confirm-trade-card-icon {
  border-color: var(--ui-success-border) !important;
  background: var(--ui-success-soft) !important;
  box-shadow: none !important;
  color: var(--ui-success) !important;
}

#actionConfirmPopup.is-add-trade[data-trade-tone="bear"] .action-confirm-trade-card-icon {
  border-color: var(--ui-danger-border) !important;
  background: var(--ui-danger-soft) !important;
  box-shadow: none !important;
  color: var(--ui-danger) !important;
}

#actionConfirmPopup.is-profile-hub-save .action-confirm-profile-success {
  border-color: var(--ui-success-border) !important;
  background: var(--ui-success-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--ui-success) !important;
}

:is(.popup, #actionConfirmPopup, [class*="SignOutModal-module__"]) :is(.btn-danger),
[class*="SignOutModal-module__"][class*="__primaryButton"] {
  border-color: #9f1239 !important;
  background: #be123c !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

:is(.popup, #actionConfirmPopup, [class*="SignOutModal-module__"]) :is(.btn-danger):hover:not(:disabled),
[class*="SignOutModal-module__"][class*="__primaryButton"]:hover:not(:disabled) {
  border-color: #881337 !important;
  background: #9f1239 !important;
  box-shadow: none !important;
}

#feedbackPopup :where(.feedback-modal-detail-wrap, .feedback-editor-modern, .feedback-field-block) {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#feedbackPopup .feedback-choice-btn {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface-raised) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--ui-text-secondary) !important;
}

#feedbackPopup .feedback-choice-btn.is-correct.active {
  border-color: var(--ui-success-border) !important;
  background: var(--ui-success-soft) !important;
  color: var(--ui-success) !important;
}

#feedbackPopup .feedback-choice-btn.is-incorrect.active {
  border-color: var(--ui-danger-border) !important;
  background: var(--ui-danger-soft) !important;
  color: var(--ui-danger) !important;
}

#feedbackPopup #feedbackSaveBtn.feedback-save-correct {
  border-color: #166534 !important;
  background: #15803d !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

#feedbackPopup #feedbackSaveBtn.feedback-save-incorrect {
  border-color: #9f1239 !important;
  background: #be123c !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

#forecastUsageLimitPopup :where(.forecast-usage-limit-hero, .forecast-usage-limit-card, .forecast-usage-limit-note) {
  border-color: var(--ui-warning-border) !important;
  background: var(--ui-warning-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#forecastUsageLimitPopup :where(.forecast-usage-limit-hero-icon, .forecast-usage-limit-value) {
  color: var(--ui-warning) !important;
}

#forecastUsageLimitPopup.popup-overlay .popup.react-popup-shell.forecast-usage-limit-popup {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface) !important;
  background-color: var(--ui-surface) !important;
  background-image: none !important;
  box-shadow: var(--ui-shadow-sm) !important;
  color: var(--ui-text) !important;
}

html[data-theme="dark"] #forecastUsageLimitPopup.popup-overlay .popup.react-popup-shell.forecast-usage-limit-popup {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface) !important;
  background-color: var(--ui-surface) !important;
  box-shadow: var(--ui-shadow-sm) !important;
}

#forecastUsageLimitPopup :where(
  .forecast-usage-limit-headline,
  .forecast-usage-limit-label,
  .forecast-usage-limit-text,
  .forecast-usage-limit-meta
) {
  color: var(--ui-text-muted) !important;
}

#forecastUsageLimitPopup .forecast-usage-limit-headline {
  color: var(--ui-text) !important;
}

#forecastUsageLimitPopup .forecast-usage-limit-hero-icon svg {
  stroke: var(--ui-warning) !important;
}

#forecastUsageLimitPopup .btn.btn-primary.forecast-usage-limit-close-btn {
  border-color: #3730a3 !important;
  background: #4338ca !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

#forecastUsageLimitPopup .btn.btn-primary.forecast-usage-limit-close-btn:hover:not(:disabled) {
  border-color: #312e81 !important;
  background: #3730a3 !important;
  box-shadow: none !important;
}

#forecastUsageLimitPopup .btn.btn-secondary.forecast-usage-limit-upgrade-btn,
#forecastUsageLimitPopup .btn.btn-secondary.forecast-usage-limit-upgrade-btn:hover:not(:disabled) {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface-muted) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--ui-text-secondary) !important;
}

#surgePopup :where(.surge-modal-visual, .surge-modal-callout, .surge-modal-badge) {
  border-color: var(--ui-warning-border) !important;
  background: var(--ui-warning-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#surgePopup.movement-alert-overlay {
  background: rgba(15, 23, 42, 0.42) !important;
  background-image: none !important;
  backdrop-filter: blur(8px) !important;
}

html[data-theme="dark"] #surgePopup.movement-alert-overlay {
  background: rgba(2, 6, 23, 0.7) !important;
}

#surgePopup .popup.surge-movement-modal,
#feedbackPopup .popup.feedback-popup-shell {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface) !important;
  background-image: none !important;
  box-shadow: var(--ui-shadow-sm) !important;
  color: var(--ui-text) !important;
}

#surgePopup[data-tone="up"] :where(.surge-modal-callout, .surge-modal-badge) {
  border-color: var(--ui-success-border) !important;
  background: var(--ui-success-soft) !important;
  color: var(--ui-success) !important;
}

#surgePopup[data-tone="down"] :where(.surge-modal-callout, .surge-modal-badge) {
  border-color: var(--ui-danger-border) !important;
  background: var(--ui-danger-soft) !important;
  color: var(--ui-danger) !important;
}

/* Forecast launcher and welcome surfaces; visual/chart content remains intact. */
.top-run-forecast-modal {
  --run-accent: var(--ui-brand-600) !important;
  --run-accent-strong: var(--ui-brand-700) !important;
  --run-accent-soft: var(--ui-brand-50) !important;
  --run-accent-glow: transparent !important;
  --run-surface: var(--ui-surface) !important;
  --run-surface-strong: var(--ui-surface-soft) !important;
  --run-border: var(--ui-border-strong) !important;
  --run-card-border: var(--ui-border) !important;
  --run-shadow: var(--ui-shadow-sm) !important;
}

.top-run-forecast-modal :where(.top-run-forecast-content, .top-run-forecast-fact) {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.welcome-panel :where(.welcome-topline, .welcome-visual, .welcome-progress) {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.welcome-panel :where(.welcome-topline, .welcome-visual, .welcome-progress)::before,
.welcome-panel :where(.welcome-topline, .welcome-visual, .welcome-progress)::after {
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

#welcomeOverlay .welcome-panel .welcome-actions .btn.btn-primary:not(.btn-run-forecast) {
  border-color: #3730a3 !important;
  background: #4338ca !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

#welcomeOverlay .welcome-panel .welcome-actions .btn.btn-primary:not(.btn-run-forecast):hover:not(:disabled) {
  border-color: #312e81 !important;
  background: #3730a3 !important;
  box-shadow: none !important;
}

:is(
  .popup,
  #authModalPanel,
  .profile-hub-modal,
  .forecast-settings-picker-panel,
  .forecast-short-shares-popup,
  .top-run-forecast-modal,
  .welcome-panel,
  .ultron-system-updates-push-modal
) :is(.btn-primary, .btn-secondary, .btn-danger, .auth-main-btn, .auth-gradient-btn)::before,
:is(
  .popup,
  #authModalPanel,
  .profile-hub-modal,
  .forecast-settings-picker-panel,
  .forecast-short-shares-popup,
  .top-run-forecast-modal,
  .welcome-panel,
  .ultron-system-updates-push-modal
) :is(.btn-primary, .btn-secondary, .btn-danger, .auth-main-btn, .auth-gradient-btn)::after {
  content: none !important;
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* System update popup, release push confirmation, and image preview. */
.updates-popup :where(.platform-updates-feature, .platform-update-card, .platform-update-date) {
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.system-update-image-lightbox-card,
.system-update-image-lightbox-image {
  border-color: var(--ui-border-strong) !important;
  box-shadow: none !important;
}

.ultron-system-updates-push-modal :where(
  .ultron-system-updates-push-modal-summary,
  .ultron-system-updates-push-modal-option-card
) {
  border: 1px solid var(--ui-border) !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.ultron-system-updates-push-modal .ultron-system-updates-push-modal-option-card.is-push {
  border-color: color-mix(in srgb, var(--ui-brand-500) 48%, var(--ui-border)) !important;
  background: var(--ui-brand-50) !important;
}

/* CSS-module dialogs: keep success and destructive meaning without glow. */
[class*="SignOutModal-module__"] :where(
  [class*="__avatarCard"],
  [class*="__avatarInner"],
  [class*="__secondaryButton"]
) {
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface-muted) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--ui-text-secondary) !important;
}

:where(
  [class*="SignOutModal-module__"][class*="__successOverlay"],
  [class*="BillingUpgradeSuccessModal-module__"][class*="__successOverlay"]
) {
  border-color: var(--ui-success-border) !important;
  background: var(--ui-success-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--ui-success) !important;
}

[class*="BillingUpgradeSuccessModal-module__"] :where(
  [class*="__iconWrap"],
  [class*="__iconFrame"],
  [class*="__iconBase"]
) {
  border-color: var(--ui-success-border) !important;
  background: var(--ui-success-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Component overrides never suppress the global keyboard focus treatment. */
:where(
  .popup,
  #authModalPanel,
  .profile-hub-modal,
  .forecast-settings-picker-panel,
  .forecast-short-shares-popup,
  .top-run-forecast-modal,
  .welcome-panel,
  .ultron-system-updates-push-modal,
  [class*="SignOutModal-module__"],
  [class*="BillingUpgradeSuccessModal-module__"]
) :where(button, a, input, select, textarea, [role="button"]):focus-visible {
  outline: 2px solid var(--ui-focus) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 4px var(--ui-focus-ring) !important;
}

/* Flat forecast workspace: one brand color, fewer nested surfaces, less paint. */
html[data-theme] body {
  background: var(--ui-canvas) !important;
  background-image: none !important;
}

body::before {
  display: none !important;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell {
  gap: 10px !important;
  border: 0 !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell::before {
  display: none !important;
}

#page-dashboard .dashboard-week-summary-card.week-ahead-react-shell .week-ahead-header--forecast {
  padding: 22px 22px 14px !important;
  border: 0 !important;
  background: var(--ui-surface) !important;
  background-image: none !important;
}

.week-ahead-heading-icon,
.dashboard-trajectory-toolbar-icon,
.week-ahead-section-heading-icon {
  border: 0 !important;
  background: var(--ui-brand-50) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.week-ahead-meta-chip {
  border: 0 !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#page-dashboard .dashboard-trajectory-card {
  margin: 0 16px 4px !important;
  overflow: visible !important;
  border: 0 !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

.dashboard-trajectory-toolbar {
  min-height: 52px;
  padding: 8px 6px 10px;
  border: 0 !important;
  background: var(--ui-surface) !important;
}


/* ------------------------------------------------------------------
 * Dashboard price trajectory
 *
 * The chart is drawn in measured pixel space, so this layer only supplies
 * surface, colour, and type. Geometry stays in the renderer.
 * ------------------------------------------------------------------ */
#page-dashboard .dashboard-trajectory-card #miniChartArea {
  min-height: 0;
  padding: 0 !important;
  background: transparent !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined,
#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined * {
  font-family: var(--ui-font) !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-card {
  display: grid;
  width: 100%;
  gap: 12px;
  margin: 0;
  padding: 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-header-row {
  margin: 0 !important;
}

/* Summary strip: one row of figures divided by hairlines, not four cards. */
#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stats-bar {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  grid-auto-rows: auto !important;
  gap: 0 !important;
  padding: 13px 4px !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stat-item {
  display: grid !important;
  align-content: start !important;
  justify-items: start !important;
  min-height: 0 !important;
  padding: 1px 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  text-align: left !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stat-item + .trajgraph-stat-item {
  border-left: 1px solid var(--ui-border) !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stat-label {
  max-width: none;
  color: var(--ui-text-muted) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  line-height: 1.3 !important;
  text-transform: uppercase;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stat-value {
  display: block !important;
  margin-top: 4px;
  color: var(--ui-text) !important;
  font-size: clamp(19px, 1.5vw, 25px) !important;
  font-variant-numeric: tabular-nums;
  font-weight: 760 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.14 !important;
  text-align: left !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stat-item[data-tone="bull"] .trajgraph-stat-value {
  color: var(--ui-success) !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stat-item[data-tone="bear"] .trajgraph-stat-value {
  color: var(--ui-danger) !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stat-sub {
  max-width: none;
  margin-top: 4px;
  color: var(--ui-text-subtle) !important;
  font-size: 10px !important;
  font-weight: 550 !important;
  letter-spacing: 0 !important;
  line-height: 1.35 !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-visual {
  display: grid;
  gap: 10px;
  min-width: 0;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-svg-frame {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-svg {
  position: static !important;
  inset: auto !important;
  display: block;
  width: 100% !important;
  height: auto !important;
  min-width: 0;
  overflow: visible;
}

/* Plot furniture */
#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-plot-bg {
  fill: var(--ui-surface-soft) !important;
  stroke: none !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-past-bg {
  fill: color-mix(in srgb, var(--ui-text-muted) 6%, transparent) !important;
  stroke: none !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-grid-line {
  stroke: var(--ui-border) !important;
  stroke-width: 1 !important;
  stroke-dasharray: 2 6;
  shape-rendering: crispEdges;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-now-line {
  stroke: var(--ui-brand-500) !important;
  stroke-width: 1 !important;
  stroke-dasharray: 3 4;
  opacity: 0.5;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-base-line {
  stroke: var(--ui-text-muted) !important;
  stroke-width: 1 !important;
  stroke-dasharray: 5 6;
  opacity: 0.4;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-cone-outer {
  fill: color-mix(in srgb, var(--ui-brand-500) 15%, transparent) !important;
  stroke: none !important;
  opacity: 1 !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-cone-edge {
  fill: none !important;
  stroke: color-mix(in srgb, var(--ui-brand-500) 42%, transparent) !important;
  stroke-width: 1 !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-history-line {
  fill: none !important;
  stroke: var(--ui-text-subtle) !important;
  stroke-width: 1.75 !important;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.6;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-main-line {
  fill: none !important;
  stroke: var(--ui-brand-600) !important;
  stroke-width: 2.75 !important;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: none !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-focus-line {
  stroke: var(--ui-brand-500) !important;
  stroke-width: 1 !important;
  stroke-dasharray: 3 5;
  opacity: 0.55;
  transition: x1 160ms ease, x2 160ms ease;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-error-group {
  opacity: 0 !important;
  transition: opacity 150ms ease;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-error-group.is-active {
  opacity: 1 !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined :is(.trajgraph-error-line, .trajgraph-error-cap) {
  stroke: color-mix(in srgb, var(--ui-brand-600) 70%, transparent) !important;
  stroke-width: 1.5 !important;
  stroke-linecap: round;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-hit-area {
  fill: transparent !important;
  stroke: none !important;
  pointer-events: all;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-point {
  cursor: pointer;
  outline: none;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-halo {
  fill: color-mix(in srgb, var(--ui-brand-500) 20%, transparent) !important;
  stroke: none !important;
  opacity: 0;
  transition: opacity 150ms ease;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-point.is-active .trajgraph-halo,
#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-point:hover .trajgraph-halo,
#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-point:focus-visible .trajgraph-halo {
  opacity: 1;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-dot {
  fill: var(--ui-brand-600) !important;
  stroke: var(--ui-surface) !important;
  stroke-width: 2.5 !important;
  transition: r 150ms ease;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-point.is-active .trajgraph-dot,
#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-point:focus-visible .trajgraph-dot {
  r: 5.75px;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-now-marker rect {
  fill: var(--ui-brand-600) !important;
  stroke: none !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-now-marker text {
  fill: #ffffff !important;
  font-size: 9px;
  font-weight: 750;
  letter-spacing: 0.09em;
  text-anchor: middle;
}

/* Axis type is SVG text so it can never drift out of register with the grid.
 * The legacy chart positioned these labels as absolute HTML spans, so the old
 * offsets have to be neutralised or a percentage translate resolves against
 * the whole viewBox and throws the axis hundreds of units off. */
#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-svg :is(text, .trajgraph-x-label, .trajgraph-y-tick, .trajgraph-y-axis-label) {
  position: static !important;
  inset: auto !important;
  display: initial !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  text-transform: none !important;
  transform: none !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-svg :is(.trajgraph-x-label, .trajgraph-y-tick)::before,
#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-svg :is(.trajgraph-x-label, .trajgraph-y-tick)::after {
  display: none !important;
  content: none !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-y-tick {
  fill: var(--ui-text-muted) !important;
  font-size: 10px;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-y-axis-label {
  fill: var(--ui-text-subtle) !important;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.09em;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-x-label {
  fill: var(--ui-text-muted) !important;
  font-size: 10px;
  font-weight: 650;
  letter-spacing: 0.05em;
  transition: fill 150ms ease;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-x-label.is-active {
  fill: var(--ui-brand-600) !important;
  font-weight: 800;
}

/* The readout tracks the active point instead of parking in a fixed corner. */
#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-active-readout {
  position: absolute;
  top: 10px;
  right: auto !important;
  bottom: auto !important;
  left: 10px;
  z-index: 3;
  display: grid;
  min-width: 118px;
  max-width: none !important;
  gap: 2px;
  padding: 8px 11px;
  border: 1px solid var(--ui-border) !important;
  border-radius: 10px !important;
  background: var(--ui-surface) !important;
  background-image: none !important;
  box-shadow: var(--ui-shadow-sm) !important;
  color: var(--ui-text) !important;
  pointer-events: none;
  transition: left 160ms ease, top 160ms ease;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-active-readout-label {
  color: var(--ui-text-muted) !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-active-readout-value {
  color: var(--ui-brand-600) !important;
  font-size: 16px !important;
  font-variant-numeric: tabular-nums;
  font-weight: 760 !important;
  line-height: 1.2;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-active-readout-value::after {
  display: none !important;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-active-readout-range {
  color: var(--ui-text-muted);
  font-size: 10px;
  font-variant-numeric: tabular-nums;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-data-note {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 18px;
  padding: 0 2px;
  color: var(--ui-text-muted);
  font-size: 10px;
  font-weight: 600;
  line-height: 1.4;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-key {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-key i {
  display: inline-block;
  width: 18px;
  height: 3px;
  border-radius: 999px;
  background: var(--ui-brand-600);
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-key .is-band {
  height: 9px;
  border: 1px solid color-mix(in srgb, var(--ui-brand-500) 42%, transparent);
  border-radius: 3px;
  background: color-mix(in srgb, var(--ui-brand-500) 15%, transparent);
}

#page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-key .is-history {
  background: color-mix(in srgb, var(--ui-text-subtle) 60%, transparent);
}

.week-ahead-content-block {
  border: 0 !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Daily forecast values below the recommendation use direct data, not relative bars. */
.forecast-range-table {
  display: grid;
  gap: 10px;
  padding: 16px;
  border: 0;
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface-soft);
  color: var(--ui-text);
}

.forecast-range-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.forecast-range-head > div {
  display: grid;
  gap: 2px;
}

.forecast-range-head span {
  color: var(--ui-brand-600);
  font-size: 9px;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.forecast-range-head strong {
  color: var(--ui-text);
  font-size: 14px;
  font-weight: 740;
}

.forecast-range-head p {
  max-width: 440px;
  margin: 0;
  color: var(--ui-text-muted);
  font-size: 10px;
  line-height: 1.4;
  text-align: right;
}

.forecast-range-columns,
.forecast-range-row {
  display: grid;
  grid-template-columns: minmax(90px, 1.1fr) minmax(84px, 0.9fr) minmax(86px, 0.9fr) minmax(74px, 0.75fr) minmax(150px, 1.4fr);
  align-items: center;
  gap: 12px;
}

.forecast-range-columns {
  padding: 0 12px;
  color: var(--ui-text-subtle);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.forecast-range-row {
  width: 100%;
  min-height: 48px;
  padding: 8px 12px;
  border: 0;
  border-radius: 10px;
  background: var(--ui-surface);
  color: var(--ui-text-secondary);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background-color 140ms ease, color 140ms ease;
}

.forecast-range-row:hover,
.forecast-range-row.is-active {
  background: var(--ui-brand-50);
  color: var(--ui-text);
}

.forecast-range-row:focus-visible {
  outline: 2px solid var(--ui-focus);
  outline-offset: 2px;
}

.forecast-range-date {
  display: flex;
  align-items: baseline;
  gap: 7px;
}

.forecast-range-date strong,
.forecast-range-estimate,
.forecast-range-change,
.forecast-range-band {
  font-variant-numeric: tabular-nums;
}

.forecast-range-date strong,
.forecast-range-estimate {
  color: var(--ui-text);
  font-size: 11px;
  font-weight: 720;
}

.forecast-range-date small,
.forecast-range-outlook,
.forecast-range-change,
.forecast-range-band {
  color: var(--ui-text-muted);
  font-size: 10px;
  font-weight: 550;
}

@media (max-width: 900px) {
  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stats-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stat-item {
    padding: 9px 14px !important;
  }

  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stat-item + .trajgraph-stat-item {
    border-left: 0 !important;
  }

  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stat-item:nth-child(even) {
    border-left: 1px solid var(--ui-border) !important;
  }

  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stat-item:nth-child(n + 3) {
    border-top: 1px solid var(--ui-border) !important;
  }

  .forecast-range-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .forecast-range-head p {
    text-align: left;
  }
}

@media (max-width: 700px) {
  #page-dashboard .dashboard-trajectory-card {
    margin-inline: 10px !important;
  }

  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-card {
    padding: 10px !important;
  }

  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stat-item {
    padding: 8px 12px !important;
  }

  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-data-note {
    gap: 5px 14px;
    font-size: 9px;
  }

  .forecast-range-table {
    overflow-x: auto;
    padding: 12px;
  }

  .forecast-range-columns,
  .forecast-range-row {
    min-width: 650px;
  }
}

@media (max-width: 440px) {
  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-stat-value {
    font-size: 18px !important;
  }

  #page-dashboard .dashboard-trajectory-card #miniChartArea .trajgraph-shell--streamlined .trajgraph-active-readout {
    min-width: 100px;
    padding: 7px 8px;
  }
}

/* Keep these last: older auth selectors carry unusually high specificity. */
#authModalPanel.auth-modal.simple-auth-modal,
#authModalPanel.auth-modal.simple-auth-modal .auth-card-shell {
  border: 0 !important;
  background: var(--ui-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#authModalPanel.auth-modal.simple-auth-modal .auth-tabbar {
  border: 0 !important;
  background: var(--ui-surface-muted) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#authModalPanel.auth-modal.simple-auth-modal .auth-tab-indicator {
  display: none !important;
}

#authModalPanel.auth-modal.simple-auth-modal .auth-tab-btn {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--ui-text-muted) !important;
}

#authModalPanel.auth-modal.simple-auth-modal .auth-tab-btn.active {
  background: var(--ui-brand-50) !important;
  color: var(--ui-brand-700) !important;
}

#authModalPanel.auth-modal.simple-auth-modal .auth-main-btn:not(.btn-run-forecast),
#authModalPanel.auth-modal.simple-auth-modal .auth-gradient-btn:not(.btn-run-forecast),
#authModalPanel.auth-modal.simple-auth-modal .auth-reg-complete-actions .btn.btn-primary,
#authModalPanel.auth-modal.simple-auth-modal .auth-recovery-code-actions .btn.btn-primary {
  border: 0 !important;
  background: var(--ui-brand-600) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

#authModalPanel.auth-modal.simple-auth-modal .auth-main-btn:hover:not(:disabled),
#authModalPanel.auth-modal.simple-auth-modal .auth-gradient-btn:hover:not(:disabled),
#authModalPanel.auth-modal.simple-auth-modal .auth-reg-complete-actions .btn.btn-primary:hover:not(:disabled),
#authModalPanel.auth-modal.simple-auth-modal .auth-recovery-code-actions .btn.btn-primary:hover:not(:disabled) {
  background: var(--ui-brand-700) !important;
  background-image: none !important;
  box-shadow: none !important;
  transform: none !important;
}

#authModalPanel.auth-modal.simple-auth-modal .auth-legal {
  border: 0 !important;
  background: var(--ui-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.dashboard-trajectory-toolbar {
  box-sizing: border-box;
  max-width: 100%;
}

/* Auth states keep the same solid palette, including returning-user and setup steps. */
#authModalPanel,
#authModalPanel * {
  background-image: none !important;
}

#authModalPanel :is(
  .auth-returning-user-card,
  .auth-login-success-identity,
  .auth-reg-overview-card,
  .auth-register-complete-panel,
  .auth-login-success-card
) {
  background-color: var(--ui-surface-soft) !important;
  box-shadow: none !important;
}

#authModalPanel :is(.auth-returning-user-avatar, .auth-login-success-avatar) {
  background-color: var(--ui-surface-raised) !important;
  box-shadow: none !important;
}

#authModalPanel .auth-step-track {
  background: var(--ui-surface-soft) !important;
  box-shadow: none !important;
}

#authModalPanel .auth-step-fill {
  background: var(--ui-brand-600) !important;
  box-shadow: none !important;
}

/* ------------------------------------------------------------------
 * Scenario probability map
 *
 * One segmented bar carries the directional split; the figures sit in a
 * legend beneath it instead of three separate tracks competing for the
 * same reading. Surfaces match the forecast cards above.
 * ------------------------------------------------------------------ */
#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-card {
  display: grid;
  gap: 14px;
  padding: 18px !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-lg) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 4px 16px;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-head .card-title {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-caption {
  color: var(--ui-text-muted);
  font-size: 11px;
  font-weight: 550;
  line-height: 1.4;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-bar {
  display: flex;
  align-items: stretch;
  gap: 3px;
  width: 100%;
  height: 14px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--ui-surface-muted);
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-seg {
  min-width: 0;
  flex: 0 1 auto;
  border-radius: 999px;
  transition: width 480ms ease-out;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-seg.is-bull {
  background: var(--ui-success);
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-seg.is-flat {
  background: var(--ui-warning);
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-seg.is-bear {
  background: var(--ui-danger);
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-keys {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-key {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 2px 8px;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-key.is-bull .scenario-mix-dot {
  background: var(--ui-success);
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-key.is-flat .scenario-mix-dot {
  background: var(--ui-warning);
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-key.is-bear .scenario-mix-dot {
  background: var(--ui-danger);
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-name {
  color: var(--ui-text-muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-value {
  grid-column: 2;
  color: var(--ui-text);
  font-size: 22px;
  font-variant-numeric: tabular-nums;
  font-weight: 760;
  letter-spacing: -0.03em;
  line-height: 1.15;
}

#page-dashboard #signalScenarioContent .signal-distribution-foot.scenario-range-foot {
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px 16px !important;
  min-height: 0 !important;
  margin-top: 2px !important;
  padding-top: 13px !important;
  border-top: 1px solid var(--ui-border) !important;
}

#page-dashboard #signalScenarioContent .scenario-range-label {
  color: var(--ui-text-muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#page-dashboard #signalScenarioContent .scenario-range-foot .signal-distribution-chip-row {
  justify-content: flex-end !important;
  gap: 8px !important;
}

/* Eight cells on a column count that divides eight, so the last row never
 * leaves a hole the way the old 3 / 3 / 2 stack did. */
#page-dashboard #signalMeterContainer.signal-meter-modern-shell #signalInsightPanel.scenario-insight-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

@media (max-width: 1100px) {
  #page-dashboard #signalMeterContainer.signal-meter-modern-shell #signalInsightPanel.scenario-insight-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  #page-dashboard #signalMeterContainer.signal-meter-modern-shell #signalInsightPanel.scenario-insight-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell #signalInsightPanel.scenario-insight-grid .stat-card {
  display: grid;
  align-content: start;
  gap: 6px;
  min-height: 0;
  padding: 14px 16px !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

#page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-insight-value {
  color: var(--ui-text);
  font-size: 12px;
  font-weight: 720;
  letter-spacing: 0.01em;
  line-height: 1.35;
}

@media (max-width: 760px) {
  #page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-card {
    padding: 15px !important;
  }

  #page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-keys {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  #page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-key {
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: baseline;
  }

  #page-dashboard #signalMeterContainer.signal-meter-modern-shell .scenario-mix-value {
    grid-column: auto;
    font-size: 16px;
  }

  #page-dashboard #signalScenarioContent .signal-distribution-foot.scenario-range-foot {
    align-items: flex-start !important;
    flex-direction: column !important;
  }

  #page-dashboard #signalScenarioContent .scenario-range-foot .signal-distribution-chip-row {
    justify-content: flex-start !important;
  }
}

/* Range-profile chips carried hard-coded light swatches, which read as bright
 * stickers on the dark canvas. Route them through the semantic tokens. */
#page-dashboard #signalScenarioContent .signal-pill-chip {
  border: 1px solid var(--ui-border) !important;
  background: var(--ui-surface-muted) !important;
  color: var(--ui-text-secondary) !important;
  box-shadow: none !important;
}

#page-dashboard #signalScenarioContent .signal-pill-chip.bull {
  border-color: var(--ui-success-border) !important;
  background: var(--ui-success-soft) !important;
  color: var(--ui-success) !important;
}

#page-dashboard #signalScenarioContent .signal-pill-chip.amber {
  border-color: var(--ui-warning-border) !important;
  background: var(--ui-warning-soft) !important;
  color: var(--ui-warning) !important;
}

#page-dashboard #signalScenarioContent .signal-pill-chip.rose {
  border-color: var(--ui-danger-border) !important;
  background: var(--ui-danger-soft) !important;
  color: var(--ui-danger) !important;
}