.jrn-tab-bar {
  position: relative;
  display: flex;
  gap: 4px;
  background: linear-gradient(180deg, #0d0d18 0%, #0a0a14 100%);
  border: 1px solid #252539;
  border-radius: 14px;
  padding: 6px;
  margin-bottom: 24px;
  max-width: 480px;
}
.jrn-tab {
  position: relative;
  z-index: 2;
  flex: 1;
  background: transparent;
  border: none;
  color: #9090a8;
  padding: 12px 18px;
  border-radius: 10px;
  font-family: 'Rubik', sans-serif;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: color 0.25s ease, transform 0.25s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  letter-spacing: 0.02em;
}
.jrn-tab:hover { color: #c0c0d0; }
.jrn-tab.active {
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}
.jrn-tab-icon { font-size: 15px; }
.jrn-tab-label { font-size: 13px; font-weight: 700; letter-spacing: 0.04em; }
.jrn-tab-indicator {
  position: absolute;
  z-index: 1;
  top: 6px;
  bottom: 6px;
  left: 6px;
  width: calc(50% - 8px);
  background: linear-gradient(135deg, #7C5CFC 0%, #6244E3 100%);
  border-radius: 10px;
  transition: transform 0.32s cubic-bezier(.4, 0, .2, 1);
  box-shadow: 0 4px 14px rgba(124, 92, 252, 0.35),
              0 1px 0 rgba(255, 255, 255, 0.15) inset;
}
.jrn-tab-bar[data-active="daily"] .jrn-tab-indicator {
  transform: translateX(100%);
}

.jrn-slide-view {
  /* No animation — prevents compositing churn on tab switch */
}

/* === DAILY TRADES HERO CARD === */
.daily-trades-hero {
  display: flex;
  align-items: center;
  gap: 28px;
  padding: 32px 36px;
  border-radius: 20px;
  margin-bottom: 24px;
  background: linear-gradient(135deg, #0d0d18 0%, #0a0a14 100%);
  border: 1px solid #252539;
  position: relative;
  overflow: hidden;
}
.daily-trades-hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  pointer-events: none;
}

/* Tier color states */
.daily-trades-hero.tier-none {
  border-color: #7c7c94;
}
.daily-trades-hero.tier-vgood {
  border-color: #166534;
  background: linear-gradient(135deg, #0a1f12 0%, #0a0a14 60%);
  box-shadow: 0 8px 32px rgba(34, 197, 94, 0.15);
}
.daily-trades-hero.tier-good {
  border-color: #7C5CFC;
  background: linear-gradient(135deg, #14102a 0%, #0a0a14 60%);
  box-shadow: 0 8px 32px rgba(124, 92, 252, 0.15);
}
.daily-trades-hero.tier-warn {
  border-color: #f59e0b;
  background: linear-gradient(135deg, #2a1f0a 0%, #0a0a14 60%);
  box-shadow: 0 8px 32px rgba(245, 158, 11, 0.25);
}
.daily-trades-hero.tier-danger {
  border-color: #991b1b;
  background: linear-gradient(135deg, #2d0d0d 0%, #0a0a14 60%);
  box-shadow: 0 8px 36px rgba(239, 68, 68, 0.45);
}

.dt-icon-wrap {
  flex-shrink: 0;
  width: 88px;
  height: 88px;
  border-radius: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #1a1a2e 0%, #0d0d18 100%);
  border: 1px solid #363650;
}
.daily-trades-hero.tier-vgood .dt-icon-wrap {
  background: linear-gradient(135deg, #0d2d1a 0%, #0a1f12 100%);
  border-color: #166534;
}
.daily-trades-hero.tier-good .dt-icon-wrap {
  background: linear-gradient(135deg, #1a1a2e 0%, #14102a 100%);
  border-color: #7C5CFC;
}
.daily-trades-hero.tier-warn .dt-icon-wrap {
  background: linear-gradient(135deg, #2a1f0a 0%, #1a1408 100%);
  border-color: #f59e0b;
}
.daily-trades-hero.tier-danger .dt-icon-wrap {
  background: linear-gradient(135deg, #2d0d0d 0%, #1f0a0a 100%);
  border-color: #ef4444;
}
.dt-icon { font-size: 42px; line-height: 1; }
.dt-content { flex: 1; min-width: 0; }
.dt-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  color: #9090a8;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.dt-count {
  font-family: 'Share Tech Mono', 'JetBrains Mono', monospace;
  font-size: 72px;
  font-weight: 400;
  line-height: 1;
  margin-bottom: 8px;
  font-feature-settings: "tnum" 1, "zero" 1;
  letter-spacing: -0.02em;
}
.daily-trades-hero.tier-none .dt-count { color: #9090a8; }
.daily-trades-hero.tier-vgood .dt-count {
  color: #22c55e;
  text-shadow: 0 0 24px rgba(34, 197, 94, 0.3);
}
.daily-trades-hero.tier-good .dt-count {
  color: #A78BFA;
  text-shadow: 0 0 24px rgba(167, 139, 250, 0.3);
}
.daily-trades-hero.tier-warn .dt-count {
  color: #f59e0b;
  text-shadow: 0 0 24px rgba(245, 158, 11, 0.4);
}
.daily-trades-hero.tier-danger .dt-count {
  color: #ef4444;
  text-shadow: 0 0 28px rgba(239, 68, 68, 0.5);
}
.dt-tier-label {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.08em;
  margin-bottom: 6px;
  text-transform: uppercase;
}
.daily-trades-hero.tier-none .dt-tier-label { color: #9090a8; }
.daily-trades-hero.tier-vgood .dt-tier-label { color: #22c55e; }
.daily-trades-hero.tier-good .dt-tier-label { color: #A78BFA; }
.daily-trades-hero.tier-warn .dt-tier-label { color: #f59e0b; }
.daily-trades-hero.tier-danger .dt-tier-label { color: #ef4444; }
.dt-message {
  font-size: 13px;
  color: #a0a0b0;
  line-height: 1.5;
  max-width: 540px;
}

/* === LEGEND CARD === */
.dt-legend-card {
  background: linear-gradient(180deg, rgba(13, 13, 24, 0.95) 0%, rgba(10, 10, 18, 0.95) 100%);
  border: 1px solid #252539;
  border-radius: 16px;
  padding: 22px 24px;
  margin-bottom: 8px;
}
.dt-legend-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: #c0c0d0;
  margin-bottom: 16px;
}
.dt-legend-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.dt-tier {
  background: #0a0a12;
  border: 1px solid #252539;
  border-radius: 12px;
  padding: 14px 16px;
  position: relative;
  overflow: hidden;
  transition: all 0.22s ease;
}
.dt-tier::before {
  content: '';
  position: absolute;
  top: 0; left: 0; bottom: 0;
  width: 3px;
  background: currentColor;
}
.dt-tier:hover {
  transform: translateY(-2px);
  border-color: currentColor;
}
.dt-tier-vgood { color: #22c55e; }
.dt-tier-good { color: #A78BFA; }
.dt-tier-warn { color: #f59e0b; }
.dt-tier-danger { color: #ef4444; }
.dt-tier-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 18px;
  font-weight: 800;
  color: currentColor;
  margin-bottom: 4px;
}
.dt-tier-name {
  font-size: 12px;
  font-weight: 700;
  color: #e2e8f0;
  margin-bottom: 6px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.dt-tier-desc {
  font-size: 11px;
  color: #9090a8;
  line-height: 1.45;
}

/* === DAILY HISTORY === */
.dt-history-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
  gap: 12px;
}
.dt-history-filter {
  display: flex;
  gap: 6px;
  background: #0a0a12;
  border: 1px solid #252539;
  border-radius: 10px;
  padding: 4px;
}
.dt-filter-btn {
  background: transparent;
  border: none;
  color: #9090a8;
  padding: 6px 14px;
  border-radius: 7px;
  font-family: 'Rubik', sans-serif;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.18s ease;
}
.dt-filter-btn:hover { color: #c0c0d0; }
.dt-filter-btn.active {
  background: linear-gradient(135deg, #7C5CFC 0%, #6244E3 100%);
  color: #ffffff;
  box-shadow: 0 2px 8px rgba(124, 92, 252, 0.3);
}

.dt-history-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 18px;
}
.dt-sum-box {
  background: #0a0a12;
  border: 1px solid #1f1f30;
  border-radius: 10px;
  padding: 12px 14px;
}
.dt-sum-lbl {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.15em;
  color: #7c7c94;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.dt-sum-val {
  font-family: 'JetBrains Mono', monospace;
  font-size: 18px;
  font-weight: 800;
  color: #e2e8f0;
  font-feature-settings: "tnum" 1, "zero" 1;
  letter-spacing: -0.01em;
}

.dt-month-section { margin-bottom: 18px; }
.dt-month-section:last-child { margin-bottom: 0; }
.dt-month-header {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.15em;
  color: #9090a8;
  text-transform: uppercase;
  padding: 0 4px 10px;
  border-bottom: 1px dashed #252539;
  margin-bottom: 10px;
}

.dt-day-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: #0a0a12;
  border: 1px solid #1f1f30;
  border-left: 3px solid #363650;
  border-radius: 10px;
  padding: 12px 16px;
  margin-bottom: 8px;
  transition: all 0.2s ease;
}
.dt-day-card:hover {
  transform: translateX(2px);
  background: #0d0d18;
}
.dt-day-card.tier-vgood { border-left-color: #22c55e; }
.dt-day-card.tier-good { border-left-color: #A78BFA; }
.dt-day-card.tier-warn { border-left-color: #f59e0b; }
.dt-day-card.tier-danger {
  border-left-color: #ef4444;
  background: linear-gradient(90deg, #1a0808 0%, #0a0a12 40%);
}
.dt-day-card.is-today {
  background: linear-gradient(90deg, #131322 0%, #0a0a12 50%);
  box-shadow: 0 0 0 1px rgba(124, 92, 252, 0.2);
}

.dt-day-left {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
  flex: 1;
}
.dt-day-icon {
  font-size: 22px;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #131322;
  border-radius: 10px;
}
.dt-day-info { min-width: 0; }
.dt-day-date {
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  font-weight: 700;
  color: #e2e8f0;
  letter-spacing: -0.01em;
  margin-bottom: 2px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.dt-today-badge {
  font-size: 9px;
  font-weight: 800;
  padding: 2px 7px;
  background: linear-gradient(135deg, #7C5CFC 0%, #6244E3 100%);
  color: #ffffff;
  border-radius: 6px;
  letter-spacing: 0.08em;
}
.dt-day-weekday {
  font-size: 11px;
  color: #7c7c94;
  font-family: 'Rubik', sans-serif;
}

.dt-day-right {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-shrink: 0;
}
.dt-day-pnl {
  font-family: 'JetBrains Mono', monospace;
  font-size: 14px;
  font-weight: 800;
  font-feature-settings: "tnum" 1, "zero" 1;
  letter-spacing: -0.01em;
  min-width: 90px;
  text-align: right;
}
.dt-day-count-wrap {
  text-align: right;
  min-width: 110px;
}
.dt-day-count-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 22px;
  font-weight: 800;
  color: #e2e8f0;
  line-height: 1;
}
.dt-day-card.tier-vgood .dt-day-count-num { color: #22c55e; }
.dt-day-card.tier-good .dt-day-count-num { color: #A78BFA; }
.dt-day-card.tier-warn .dt-day-count-num { color: #f59e0b; }
.dt-day-card.tier-danger .dt-day-count-num { color: #ef4444; }
.dt-day-count-lbl {
  font-size: 10px;
  color: #9090a8;
  margin-top: 2px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 600;
}

.dt-empty-state {
  text-align: center;
  padding: 32px 20px;
  color: #7c7c94;
  font-size: 13px;
}

@media (max-width: 760px) {
  .daily-trades-hero {
    flex-direction: column;
    text-align: center;
    padding: 24px 20px;
    gap: 18px;
  }
  .dt-count { font-size: 56px; }
  .dt-legend-grid { grid-template-columns: repeat(2, 1fr); }
  .jrn-tab-bar { max-width: 100%; }
  .jrn-tab-label { font-size: 12px; }
  .dt-history-summary { grid-template-columns: repeat(2, 1fr); }
  .dt-day-card {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .dt-day-right {
    justify-content: space-between;
    border-top: 1px dashed #252539;
    padding-top: 10px;
  }
  .dt-day-pnl, .dt-day-count-wrap { min-width: 0; }
  .dt-day-count-wrap { text-align: right; }
}


/* === FONT QUALITY — universal === */
html:not(.is-standalone):not(.perf-mode),
html:not(.is-standalone):not(.perf-mode) body {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: optimizeLegibility !important;
  font-synthesis-weight: none;
  font-synthesis-style: none;
}

html:not(.is-standalone):not(.perf-mode) body * {
  -webkit-font-smoothing: inherit;
}

/* Display headings → geometricPrecision rendering + tight kerning */
html:not(.is-standalone):not(.perf-mode) body .hero-headline,
html:not(.is-standalone):not(.perf-mode) body .section-heading,
html:not(.is-standalone):not(.perf-mode) body .hero-greet,
html:not(.is-standalone):not(.perf-mode) body .auth-brand .logo,
html:not(.is-standalone):not(.perf-mode) body .landing-logo .logo-text,
html:not(.is-standalone):not(.perf-mode) body .top-bar h1 {
  text-rendering: geometricPrecision !important;
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1 !important;
  -webkit-font-feature-settings: "kern" 1, "liga" 1, "calt" 1 !important;
  font-kerning: normal;
}

/* Numeric values get tabular nums + slashed zero for clean alignment */
html:not(.is-standalone):not(.perf-mode) body .stat-val,
html:not(.is-standalone):not(.perf-mode) body .hero-stat .val,
html:not(.is-standalone):not(.perf-mode) body .brk-val,
html:not(.is-standalone):not(.perf-mode) body .day-summary-box .val,
html:not(.is-standalone):not(.perf-mode) body .hp-stat .val {
  font-feature-settings: "tnum" 1, "zero" 1, "kern" 1 !important;
  font-variant-numeric: tabular-nums slashed-zero !important;
  letter-spacing: -0.02em !important;
}

/* === HI-DPI SHARPNESS === */
@media (min-resolution: 1.5dppx), (-webkit-min-device-pixel-ratio: 1.5) {
  html:not(.is-standalone):not(.perf-mode) body .stat-card,
  html:not(.is-standalone):not(.perf-mode) body .section-card,
  html:not(.is-standalone):not(.perf-mode) body .trade-detail-card,
  html:not(.is-standalone):not(.perf-mode) body .cal-day,
  html:not(.is-standalone):not(.perf-mode) body .feature-card,
  html:not(.is-standalone):not(.perf-mode) body .checklist-item,
  html:not(.is-standalone):not(.perf-mode) body .daily-todo-item {
    border-width: 1px;
    border-style: solid;
  }
}

/* === DEEPER COLORS — PnL + badges === */
html:not(.is-standalone):not(.perf-mode) body .pnl-pos,
html:not(.is-standalone):not(.perf-mode) body .grade-A,
html:not(.is-standalone):not(.perf-mode) body .badge-green {
  color: #2ad874 !important;
  text-shadow: 0 0 8px rgba(42, 216, 116, 0.32), 0 1px 1px rgba(0,0,0,0.5);
}
html:not(.is-standalone):not(.perf-mode) body .pnl-neg,
html:not(.is-standalone):not(.perf-mode) body .grade-D,
html:not(.is-standalone):not(.perf-mode) body .badge-red {
  color: #ff5757 !important;
  text-shadow: 0 0 8px rgba(255, 87, 87, 0.32), 0 1px 1px rgba(0,0,0,0.5);
}

/* === STAT CARDS — premium depth + glow === */
html:not(.is-standalone):not(.perf-mode) body .stat-card {
  background: linear-gradient(155deg,
    rgba(15, 13, 28, 0.96) 0%,
    rgba(12, 18, 32, 0.96) 40%,
    rgba(8, 14, 24, 0.94) 100%) !important;
  box-shadow:
    0 6px 28px rgba(0, 0, 0, 0.5),
    0 1px 0 rgba(255, 255, 255, 0.05) inset,
    0 0 0 1px rgba(124, 92, 252, 0.06) inset !important;
}
html:not(.is-standalone):not(.perf-mode) body .stat-card:hover {
  background: linear-gradient(155deg,
    rgba(22, 18, 42, 0.98) 0%,
    rgba(16, 24, 42, 0.98) 40%,
    rgba(10, 18, 30, 0.96) 100%) !important;
  box-shadow:
    0 18px 48px rgba(0, 0, 0, 0.6),
    0 0 0 1px rgba(124, 92, 252, 0.15) inset,
    0 1px 0 rgba(255, 255, 255, 0.08) inset,
    0 -1px 28px rgba(124, 92, 252, 0.12) inset !important;
  transform: translateY(-3px) !important;
}
html:not(.is-standalone):not(.perf-mode) body .stat-val {
  /* Crisp at hi-DPI: tight colour-matched glow + 1px dark edge
     (was a wide 28px fixed-purple halo that washed every figure out). */
  text-shadow: 0 0 9px color-mix(in srgb, currentColor 30%, transparent), 0 1px 1px rgba(0,0,0,0.5) !important;
}

/* === PRIMARY BUTTONS — glossy + glowing === */
html:not(.is-standalone):not(.perf-mode) body .btn-primary,
html:not(.is-standalone):not(.perf-mode) body .landing-btn-primary,
html:not(.is-standalone):not(.perf-mode) body .auth-btn {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0) 50%),
    linear-gradient(135deg, #8B6BFC 0%, #7C5CFC 50%, #6244E3 100%) !important;
  box-shadow:
    0 6px 18px rgba(124, 92, 252, 0.40),
    0 1px 0 rgba(255, 255, 255, 0.22) inset,
    0 -1px 0 rgba(0, 0, 0, 0.15) inset !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25) !important;
}
html:not(.is-standalone):not(.perf-mode) body .btn-primary:hover,
html:not(.is-standalone):not(.perf-mode) body .landing-btn-primary:hover,
html:not(.is-standalone):not(.perf-mode) body .auth-btn:hover:not(:disabled) {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0) 50%),
    linear-gradient(135deg, #A78BFA 0%, #8B6BFC 50%, #7C5CFC 100%) !important;
  box-shadow:
    0 10px 28px rgba(124, 92, 252, 0.60),
    0 1px 0 rgba(255, 255, 255, 0.28) inset,
    0 -1px 0 rgba(0, 0, 0, 0.15) inset !important;
  transform: translateY(-2px) !important;
}

html:not(.is-standalone):not(.perf-mode) body .landing-btn-primary-lg {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0) 50%),
    linear-gradient(135deg, #8B6BFC 0%, #7C5CFC 50%, #6244E3 100%) !important;
  box-shadow:
    0 10px 28px rgba(124, 92, 252, 0.50),
    0 1px 0 rgba(255, 255, 255, 0.25) inset,
    0 0 0 1px rgba(167, 139, 250, 0.20) inset !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35) !important;
}

/* === HERO BANNER — 4-stop aurora === */
html:not(.is-standalone):not(.perf-mode) body .hero-banner {
  background: linear-gradient(135deg,
    rgba(14, 10, 28, 0.95) 0%,
    rgba(22, 12, 42, 0.90) 35%,
    rgba(30, 14, 54, 0.85) 70%,
    rgba(36, 16, 62, 0.80) 100%) !important;
  box-shadow:
    0 14px 52px rgba(0, 0, 0, 0.55),
    0 1px 0 rgba(255, 255, 255, 0.06) inset,
    0 0 0 1px rgba(124, 92, 252, 0.12) inset !important;
}

/* === HERO HEADLINE — vivid 5-stop gradient text === */
html:not(.is-standalone):not(.perf-mode) body .hero-headline .accent {
  background: linear-gradient(105deg,
    #818CF8 0%,
    #A78BFA 22%,
    #C084FC 48%,
    #E879F9 72%,
    #F0ABFC 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  filter: drop-shadow(0 2px 10px rgba(167, 139, 250, 0.22));
}

/* === SIDEBAR — premium frosted glass (desktop only, NOT iOS) === */
@media (min-width: 1024px) {
  html:not(.is-standalone):not(.perf-mode):not(.is-ios) body .sidebar {
    background:
      linear-gradient(180deg, rgba(13, 10, 26, 0.92) 0%, rgba(10, 10, 18, 0.94) 100%) !important;
    backdrop-filter: blur(24px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(180%) !important;
    box-shadow:
      6px 0 28px rgba(0, 0, 0, 0.40),
      1px 0 0 rgba(124, 92, 252, 0.10) inset !important;
  }
}

/* === MODALS — clear focal point with deep shadow === */
html:not(.is-standalone):not(.perf-mode):not(.is-ios) body .modal {
  background:
    linear-gradient(180deg, rgba(15, 12, 28, 0.97) 0%, rgba(10, 10, 18, 0.97) 100%) !important;
  backdrop-filter: blur(28px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(180%) !important;
  box-shadow:
    0 36px 110px rgba(0, 0, 0, 0.78),
    0 1px 0 rgba(255, 255, 255, 0.07) inset,
    0 0 0 1px rgba(124, 92, 252, 0.12) inset !important;
}

/* === FORM INPUTS — sharper focus ring === */
html:not(.is-standalone):not(.perf-mode) body .form-input:focus,
html:not(.is-standalone):not(.perf-mode) body .form-select:focus,
html:not(.is-standalone):not(.perf-mode) body .auth-field input:focus,
html:not(.is-standalone):not(.perf-mode) body .week-review-field:focus,
html:not(.is-standalone):not(.perf-mode) body .editable:focus {
  border-color: #7C5CFC !important;
  box-shadow:
    0 0 0 3px rgba(124, 92, 252, 0.20),
    0 0 24px rgba(124, 92, 252, 0.18) !important;
}

/* === BROKERAGE STRIP — premium top accent === */
html:not(.is-standalone):not(.perf-mode) body .brokerage-strip {
  background: linear-gradient(180deg,
    rgba(20, 20, 36, 0.97) 0%,
    rgba(13, 13, 24, 0.97) 100%) !important;
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.42),
    0 1px 0 rgba(255, 255, 255, 0.04) inset,
    0 -1px 0 rgba(124, 92, 252, 0.12) inset !important;
}

/* === SCROLLBARS — premium on desktop === */
@media (min-width: 1024px) {
  html:not(.is-standalone):not(.perf-mode) body ::-webkit-scrollbar {
    width: 10px !important;
    height: 10px !important;
  }
  html:not(.is-standalone):not(.perf-mode) body ::-webkit-scrollbar-track {
    background: rgba(10, 10, 18, 0.6) !important;
  }
  html:not(.is-standalone):not(.perf-mode) body ::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #4a3d6e 0%, #2d2548 100%) !important;
    border-radius: 10px !important;
    border: 2px solid rgba(10, 10, 18, 0.4) !important;
    background-clip: padding-box !important;
  }
  html:not(.is-standalone):not(.perf-mode) body ::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #8B6BFC 0%, #6244E3 100%) !important;
    background-clip: padding-box !important;
  }
}

/* === LANDING PAGE TITLES — vivid + sharp === */
html:not(.is-standalone):not(.perf-mode) body .landing-cta-final h2,
html:not(.is-standalone):not(.perf-mode) body .section-heading {
  text-rendering: geometricPrecision !important;
  letter-spacing: -0.01em !important;
  text-shadow: 0 2px 24px rgba(124, 92, 252, 0.08);
}

/* === SVG / icons — pixel-perfect === */
html:not(.is-standalone):not(.perf-mode) body svg {
  shape-rendering: geometricPrecision;
}

/* === UNIVERSAL 4K IMAGE CRISPNESS ===
   Every raster image in the app (chart screenshots, note/trade snapshots,
   avatars) gets a hi-DPI sharpening hint so it stays crisp on 4K / retina
   panels instead of the browser's default soft bilinear scale. We use ONLY
   -webkit-optimize-contrast — NOT crisp-edges/pixelated — so photos never
   turn into blocky nearest-neighbour mush. */
html:not(.is-standalone):not(.perf-mode) body img {
  image-rendering: -webkit-optimize-contrast;
  image-rendering: optimizeQuality;
}

/* === UNIVERSAL KERNING — proper letterfit everywhere ===
   font-kerning is cheap (unlike text-rendering) and safe to apply globally;
   it tightens letter pairs for a more polished, "designed" feel across every
   label, value and paragraph. text-rendering:optimizeLegibility already
   cascades from <body> above. */
html:not(.is-standalone):not(.perf-mode) body * {
  font-kerning: normal;
  -webkit-font-kerning: normal;
}


/* ============================================================================
   THEME SYSTEM  +  3D / 4K BUTTONS & SLIDERS
   ----------------------------------------------------------------------------
   4 color schemes selectable in Settings → Display, applied via
   <html data-theme="aurora|minimal|terminal|slate">.  'aurora' is the original
   purple-glass design and is left untouched; the other three override the
   --hq-* design tokens plus the dominant surfaces.

   Specificity note: #tradercab-premium-final styles some components at (0,3,2)
   with !important AND is gated behind :not(.perf-mode):not(.is-standalone) — so
   it is OFF on mobile/PWA. To win on desktop *and* still apply on mobile, the
   rules below are NOT perf-gated and reach (0,3,2) via (a) the always-present
   [data-theme] attribute on <html> and (b) doubling the target class (.x.x).
   Same specificity + later source order = these win.
   ============================================================================ */

/* default glow colour for the universal 3D buttons/sliders (overridden per theme) */
:root{ --btn-glow-rgb: 124,92,252; }

/* ----------------------- THEME PICKER UI (Settings) ----------------------- */
.theme-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
@media (max-width:560px){ .theme-grid{ grid-template-columns:1fr; } }
.theme-opt{
  display:flex; align-items:center; gap:12px; text-align:left;
  padding:11px 13px; border-radius:13px; cursor:pointer;
  background:#0d0d18; border:1px solid #252539; color:#e2e8f0;
  font-family:inherit; position:relative; overflow:hidden;
  transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.theme-opt:hover{ border-color:#3a3a58; transform:translateY(-2px); box-shadow:0 10px 26px rgba(0,0,0,0.45); }
.theme-opt.active{ border-color:#7C5CFC; background:#13112c; box-shadow:0 0 0 1px #7C5CFC inset, 0 10px 28px rgba(124,92,252,0.28); }
.theme-swatch{
  width:46px; height:46px; border-radius:11px; flex-shrink:0;
  border:1px solid rgba(255,255,255,0.12);
  box-shadow:0 2px 10px rgba(0,0,0,0.45), 0 1px 0 rgba(255,255,255,0.08) inset;
}
.sw-aurora{ background:radial-gradient(130% 110% at 0% 0%, rgba(124,92,252,0.95), transparent 60%), linear-gradient(160deg,#1c1440,#0a0820); }
.sw-minimal{ background:linear-gradient(160deg,#1e1e22,#0a0a0b); }
.sw-terminal{ background:radial-gradient(120% 120% at 50% 120%, rgba(0,224,138,0.55), transparent 60%), linear-gradient(160deg,#0a0f12,#06080a); border-color:rgba(0,224,138,0.4); }
.sw-slate{ background:linear-gradient(150deg,#2dd4bf 0%, #14b8a6 35%, #0c1424 75%); }
.sw-mrkt{ background:radial-gradient(120% 120% at 0% 0%, rgba(124,92,252,0.95), transparent 52%), radial-gradient(120% 120% at 100% 100%, rgba(59,130,246,0.6), transparent 55%), linear-gradient(160deg,#0c0c12,#050507); }
.theme-opt-meta{ display:flex; flex-direction:column; gap:3px; flex:1; min-width:0; }
.theme-opt-name{ font-size:13.5px; font-weight:700; letter-spacing:-0.01em; color:#f1f2f8; }
.theme-opt-tag{ font-size:9px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#7a7a92; }
.theme-opt-check{ font-size:15px; font-weight:800; color:#a78bfa; opacity:0; transform:scale(.6); transition:opacity .15s ease, transform .15s ease; flex-shrink:0; }
.theme-opt.active .theme-opt-check{ opacity:1; transform:scale(1); }

/* ----------------- UNIVERSAL 3D / 4K BUTTONS (all themes) ----------------- */
html[data-theme] body .btn-primary.btn-primary,
html[data-theme] body .auth-btn.auth-btn,
html[data-theme] body .landing-btn-primary.landing-btn-primary,
html[data-theme] body .landing-btn-primary-lg.landing-btn-primary-lg{
  transform:translateZ(0);
  text-shadow:0 1px 2px rgba(0,0,0,0.38) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.32) inset,
    0 -2px 7px rgba(0,0,0,0.30) inset,
    0 2px 4px rgba(0,0,0,0.28),
    0 9px 22px rgba(0,0,0,0.34),
    0 7px 20px rgba(var(--btn-glow-rgb),0.42) !important;
  transition:transform .13s cubic-bezier(.2,.7,.3,1), box-shadow .16s ease, filter .16s ease !important;
}
html[data-theme] body .btn-primary.btn-primary:hover,
html[data-theme] body .auth-btn.auth-btn:hover:not(:disabled),
html[data-theme] body .landing-btn-primary.landing-btn-primary:hover,
html[data-theme] body .landing-btn-primary-lg.landing-btn-primary-lg:hover{
  transform:translateY(-2px) translateZ(0) !important;
  filter:brightness(1.07) saturate(1.05);
  box-shadow:
    0 1px 0 rgba(255,255,255,0.40) inset,
    0 -2px 7px rgba(0,0,0,0.30) inset,
    0 4px 9px rgba(0,0,0,0.32),
    0 18px 38px rgba(0,0,0,0.42),
    0 13px 32px rgba(var(--btn-glow-rgb),0.58) !important;
}
html[data-theme] body .btn-primary.btn-primary:active,
html[data-theme] body .auth-btn.auth-btn:active,
html[data-theme] body .landing-btn-primary.landing-btn-primary:active,
html[data-theme] body .landing-btn-primary-lg.landing-btn-primary-lg:active{
  transform:translateY(1px) translateZ(0) scale(0.985) !important;
  filter:brightness(0.97);
  box-shadow:
    0 2px 6px rgba(0,0,0,0.45) inset,
    0 1px 2px rgba(0,0,0,0.30) !important;
}
/* Ghost / secondary buttons — subtle 3D lift */
html[data-theme] body .btn-ghost.btn-ghost{
  box-shadow:0 1px 0 rgba(255,255,255,0.08) inset, 0 4px 12px rgba(0,0,0,0.28) !important;
  transition:transform .13s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease !important;
}
html[data-theme] body .btn-ghost.btn-ghost:hover{ transform:translateY(-1px); box-shadow:0 1px 0 rgba(255,255,255,0.12) inset, 0 8px 20px rgba(0,0,0,0.4) !important; }
html[data-theme] body .btn-ghost.btn-ghost:active{ transform:translateY(1px) scale(0.99); box-shadow:0 2px 6px rgba(0,0,0,0.4) inset !important; }

/* ---------------- UNIVERSAL 3D / 4K RANGE SLIDERS (generic) ---------------- */
/* Named calculator sliders (#montecarloPage .mc-slider etc.) keep their own
   id-scoped look; this lifts every other range input to a 3D glossy thumb. */
html[data-theme] body input[type=range]{
  -webkit-appearance:none; appearance:none;
  height:7px; border-radius:7px; cursor:pointer; outline:none;
  background:linear-gradient(180deg,#11111a,#1c1c2a);
  box-shadow:0 1px 2px rgba(0,0,0,0.5) inset, 0 1px 0 rgba(255,255,255,0.04);
}
html[data-theme] body input[type=range]::-webkit-slider-runnable-track{ height:7px; border-radius:7px; }
html[data-theme] body input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none; appearance:none; margin-top:-6.5px;
  width:20px; height:20px; border-radius:50%;
  background:radial-gradient(circle at 35% 28%, #fff 0%, rgba(255,255,255,0.85) 12%, rgba(var(--btn-glow-rgb),1) 55%, rgba(var(--btn-glow-rgb),0.85) 100%);
  border:1px solid rgba(255,255,255,0.55);
  box-shadow:
    0 1px 0 rgba(255,255,255,0.6) inset,
    0 -2px 4px rgba(0,0,0,0.35) inset,
    0 3px 8px rgba(0,0,0,0.5),
    0 0 14px rgba(var(--btn-glow-rgb),0.6);
  transition:transform .14s ease, box-shadow .14s ease;
}
html[data-theme] body input[type=range]::-webkit-slider-thumb:hover{ transform:scale(1.18); }
html[data-theme] body input[type=range]::-webkit-slider-thumb:active{ transform:scale(1.06); }
html[data-theme] body input[type=range]::-moz-range-track{ height:7px; border-radius:7px; background:linear-gradient(180deg,#11111a,#1c1c2a); }
html[data-theme] body input[type=range]::-moz-range-thumb{
  width:20px; height:20px; border-radius:50%; border:1px solid rgba(255,255,255,0.55);
  background:radial-gradient(circle at 35% 28%, #fff 0%, rgba(var(--btn-glow-rgb),1) 60%);
  box-shadow:0 3px 8px rgba(0,0,0,0.5), 0 0 14px rgba(var(--btn-glow-rgb),0.6);
}

/* --------------------- 3D TOGGLE SWITCHES (.muslim-switch) ----------------- */
html[data-theme] body .muslim-switch .slider{
  box-shadow:0 2px 5px rgba(0,0,0,0.45) inset, 0 1px 0 rgba(255,255,255,0.05);
}
html[data-theme] body .muslim-switch .slider:before{
  background:radial-gradient(circle at 35% 30%, #fff, #9a9ab0 80%) !important;
  box-shadow:0 2px 5px rgba(0,0,0,0.5), 0 1px 0 rgba(255,255,255,0.5) inset;
}
html[data-theme] body .muslim-switch input:checked+.slider:before{
  background:radial-gradient(circle at 35% 30%, #fff, rgba(var(--btn-glow-rgb),1) 85%) !important;
  box-shadow:0 2px 6px rgba(0,0,0,0.5), 0 0 12px rgba(var(--btn-glow-rgb),0.7);
}

/* ========================= THEME: OBSIDIAN MINIMAL ======================== */
html[data-theme="minimal"]{
  --hq-bg:#0a0a0b; --hq-surface-1:#0f0f11; --hq-surface-2:#141416; --hq-surface-3:#1c1c20;
  --hq-overlay:rgba(12,12,14,0.97);
  --hq-border:#1c1c20; --hq-border-2:#27272a; --hq-border-hi:#3a3a40;
  --hq-text-1:#fafafa; --hq-text-2:#c8c8d0; --hq-text-3:#8a8a92; --hq-text-4:#62626c;
  --hq-accent:#e4e4e7; --hq-accent-hover:#ffffff; --hq-accent-soft:rgba(255,255,255,0.08); --hq-accent-border:rgba(255,255,255,0.22);
  --hq-success:#4ade80; --hq-success-2:#86efac; --hq-success-soft:rgba(74,222,128,0.12);
  --hq-danger:#f87171; --hq-danger-2:#fca5a5; --hq-danger-soft:rgba(248,113,113,0.12);
  --hq-warning:#fbbf24;
  --btn-glow-rgb: 255,255,255;
}
html[data-theme="minimal"] body{ background:#0a0a0b !important; background-attachment:fixed !important; }
html[data-theme="minimal"]::before, html[data-theme="minimal"]::after,
html[data-theme="minimal"] body::before, html[data-theme="minimal"] body::after{ display:none !important; }
html[data-theme="minimal"] body .stat-card.stat-card,
html[data-theme="minimal"] body .section-card.section-card{
  background:#0f0f11 !important; border:1px solid #1c1c20 !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.03) inset, 0 4px 16px rgba(0,0,0,0.4) !important;
}
html[data-theme="minimal"] body .hero-banner.hero-banner{
  background:linear-gradient(160deg,#101012,#0a0a0b) !important; border:1px solid #1c1c20 !important; box-shadow:0 8px 30px rgba(0,0,0,0.45) !important;
}
html[data-theme="minimal"] body .btn-primary.btn-primary,
html[data-theme="minimal"] body .auth-btn.auth-btn,
html[data-theme="minimal"] body .landing-btn-primary.landing-btn-primary,
html[data-theme="minimal"] body .landing-btn-primary-lg.landing-btn-primary-lg{
  background:linear-gradient(180deg,#ffffff,#e8e8ec) !important; color:#0a0a0b !important; border:1px solid #ffffff !important;
}
html[data-theme="minimal"] body .pnl-pos.pnl-pos,
html[data-theme="minimal"] body .grade-A.grade-A,
html[data-theme="minimal"] body .badge-green.badge-green{ color:#4ade80 !important; text-shadow:none !important; }
html[data-theme="minimal"] body .pnl-neg.pnl-neg,
html[data-theme="minimal"] body .grade-D.grade-D,
html[data-theme="minimal"] body .badge-red.badge-red{ color:#f87171 !important; text-shadow:none !important; }
html[data-theme="minimal"] body .sidebar.sidebar{ background:linear-gradient(180deg,#0c0c0e,#0a0a0b) !important; border-right:1px solid #18181b !important; }
html[data-theme="minimal"] body .modal.modal{ background:linear-gradient(180deg,#101012,#0a0a0b) !important; border:1px solid #1c1c20 !important; }
html[data-theme="minimal"] body .hero-headline .accent{ background:none !important; -webkit-text-fill-color:#fafafa !important; color:#fafafa !important; filter:none !important; }

/* ============================== THEME: MRKT ==============================
   Inspired by mrktedge.ai — pure-black canvas, crisp white type, a
   purple→blue gradient accent, and the geometric Space Grotesk display
   font. This is the DEFAULT theme (set in the early boot script + setTheme). */
html[data-theme="mrkt"]{
  --hq-bg:#050507; --hq-surface-1:#0c0c12; --hq-surface-2:#14141d; --hq-surface-3:#1c1c28;
  --hq-overlay:rgba(7,7,11,0.97);
  --hq-border:#1a1a26; --hq-border-2:#26263a; --hq-border-hi:#3a3a55;
  --hq-text-1:#FFFFFF; --hq-text-2:#C9CBD8; --hq-text-3:#8B8FA3; --hq-text-4:#5f6376;
  --hq-accent:#7C5CFC; --hq-accent-hover:#A78BFA; --hq-accent-soft:rgba(124,92,252,0.14); --hq-accent-border:rgba(124,92,252,0.42);
  --hq-success:#22c55e; --hq-success-2:#4ade80; --hq-success-soft:rgba(34,197,94,0.12);
  --hq-danger:#ef4444; --hq-danger-2:#f87171; --hq-danger-soft:rgba(239,68,68,0.12);
  --hq-warning:#f59e0b;
  --btn-glow-rgb: 124,92,252;
}
html[data-theme="mrkt"] body{ background:#050507 !important; background-attachment:fixed !important; font-family:'Inter',-apple-system,system-ui,sans-serif !important; }
html[data-theme="mrkt"]::before, html[data-theme="mrkt"]::after,
html[data-theme="mrkt"] body::before, html[data-theme="mrkt"] body::after{ display:none !important; }
/* Geometric Space Grotesk for all display headings / titles / brand */
html[data-theme="mrkt"] .font-display,
html[data-theme="mrkt"] .sb-brand,
html[data-theme="mrkt"] .section-title,
html[data-theme="mrkt"] .stat-title,
html[data-theme="mrkt"] .hero-headline,
html[data-theme="mrkt"] .hero-greet,
html[data-theme="mrkt"] h1, html[data-theme="mrkt"] h2, html[data-theme="mrkt"] h3{
  font-family:'Space Grotesk','Inter',sans-serif !important;
  letter-spacing:-0.02em !important;
}
html[data-theme="mrkt"] body .stat-card.stat-card,
html[data-theme="mrkt"] body .section-card.section-card{
  background:#0c0c12 !important; border:1px solid #1a1a26 !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.03) inset, 0 6px 22px rgba(0,0,0,0.5) !important;
}
html[data-theme="mrkt"] body .hero-banner.hero-banner{
  background:linear-gradient(160deg,#0d0d16,#060608) !important; border:1px solid #1a1a26 !important; box-shadow:0 8px 30px rgba(0,0,0,0.55) !important;
}
/* Brokerage strip — was a muddy translucent-purple panel; make it crisp &
   solid like the stat-cards above so it reads sharp on the pure-black canvas. */
html[data-theme="mrkt"] body .brokerage-strip{
  background:#0a0a10 !important; border:1px solid #1a1a26 !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.03) inset, 0 6px 22px rgba(0,0,0,0.5) !important;
}
html[data-theme="mrkt"] body .brokerage-strip > .brk-item{
  background:#111119 !important; border:1px solid #232336 !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.04) inset, 0 4px 14px rgba(0,0,0,0.45) !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
html[data-theme="mrkt"] body .brokerage-strip > .brk-item:hover{
  border-color:#33334d !important; background:#14141f !important;
}
html[data-theme="mrkt"] body .brokerage-strip > .brk-item::before{ opacity:.45 !important; }
html[data-theme="mrkt"] body .brk-lbl{ color:#9a9eb4 !important; }
html[data-theme="mrkt"] body .sidebar.sidebar{ background:linear-gradient(180deg,#0a0a10,#060608) !important; border-right:1px solid #18181f !important; }
/* Sidebar nav — full 3D raised buttons, crisp colours, no dull flat look */
html[data-theme="mrkt"] body .nav-btn{
  background:linear-gradient(180deg,#14141f 0%,#0e0e16 100%) !important;
  border:1px solid #222232 !important;
  border-radius:11px !important;
  color:#E8E8F4 !important;
  margin:0 0 5px 0 !important;
  font-weight:600 !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.05) inset, 0 -1px 0 rgba(0,0,0,0.4) inset, 0 3px 8px rgba(0,0,0,0.45) !important;
  transition:transform .13s cubic-bezier(.2,.7,.3,1), box-shadow .16s ease, border-color .16s ease, background .16s ease, color .16s ease !important;
}
html[data-theme="mrkt"] body .nav-btn:hover{
  transform:translateY(-2px) !important;
  background:linear-gradient(180deg,#1c1c2c 0%,#121220 100%) !important;
  border-color:#3a3a58 !important;
  color:#FFFFFF !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.09) inset, 0 6px 16px rgba(0,0,0,0.55), 0 0 16px rgba(124,92,252,0.22) !important;
}
html[data-theme="mrkt"] body .nav-btn:active{
  transform:translateY(1px) scale(0.99) !important;
  box-shadow:0 2px 7px rgba(0,0,0,0.55) inset !important;
}
html[data-theme="mrkt"] body .nav-btn.active{
  background:linear-gradient(135deg, rgba(124,92,252,0.30) 0%, rgba(91,141,239,0.16) 100%) !important;
  border:1px solid rgba(124,92,252,0.6) !important;
  color:#FFFFFF !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.14) inset, 0 6px 18px rgba(124,92,252,0.38), 0 0 0 1px rgba(124,92,252,0.28) !important;
}
html[data-theme="mrkt"] body .nav-ic{ opacity:1 !important; }
html[data-theme="mrkt"] body .nav-btn:hover .nav-ic,
html[data-theme="mrkt"] body .nav-btn.active .nav-ic{ filter:drop-shadow(0 0 6px var(--c, currentColor)) !important; }
html[data-theme="mrkt"] body .modal.modal{ background:linear-gradient(180deg,#0d0d16,#08080c) !important; border:1px solid #1f1f30 !important; }
html[data-theme="mrkt"] body .btn-primary.btn-primary,
html[data-theme="mrkt"] body .auth-btn.auth-btn,
html[data-theme="mrkt"] body .landing-btn-primary.landing-btn-primary,
html[data-theme="mrkt"] body .landing-btn-primary-lg.landing-btn-primary-lg{
  background:linear-gradient(135deg,#7C5CFC 0%,#5B8DEF 100%) !important; color:#fff !important; border:1px solid rgba(124,92,252,0.6) !important;
}
html[data-theme="mrkt"] body .pnl-pos.pnl-pos,
html[data-theme="mrkt"] body .grade-A.grade-A,
html[data-theme="mrkt"] body .badge-green.badge-green{ color:#22c55e !important; text-shadow:none !important; }
html[data-theme="mrkt"] body .pnl-neg.pnl-neg,
html[data-theme="mrkt"] body .grade-D.grade-D,
html[data-theme="mrkt"] body .badge-red.badge-red{ color:#ef4444 !important; text-shadow:none !important; }
/* Signature purple→blue gradient on the landing hero headline accent */
html[data-theme="mrkt"] body .hero-headline .accent{
  background:linear-gradient(100deg,#7C5CFC 0%,#6366f1 45%,#3b82f6 100%) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important; filter:none !important;
}

/* ========================== THEME: TERMINAL PRO ========================== */
html[data-theme="terminal"]{
  --hq-bg:#06080a; --hq-surface-1:#0a0f12; --hq-surface-2:#0c1418; --hq-surface-3:#14201a;
  --hq-overlay:rgba(8,12,12,0.97);
  --hq-border:#14201a; --hq-border-2:#1c2b24; --hq-border-hi:#27403a;
  --hq-text-1:#d6e8df; --hq-text-2:#9bb0a6; --hq-text-3:#5a6b63; --hq-text-4:#445048;
  --hq-accent:#00e08a; --hq-accent-hover:#00ffa0; --hq-accent-soft:rgba(0,224,138,0.12); --hq-accent-border:rgba(0,224,138,0.4);
  --hq-success:#00e08a; --hq-success-2:#4dffba; --hq-success-soft:rgba(0,224,138,0.12);
  --hq-danger:#ff5d5d; --hq-danger-2:#ff8a8a; --hq-danger-soft:rgba(255,93,93,0.12);
  --hq-warning:#f5a623;
  --btn-glow-rgb: 245,166,35;
}
html[data-theme="terminal"] body{
  background:
    repeating-linear-gradient(0deg, transparent, transparent 22px, rgba(0,224,138,0.025) 22px, rgba(0,224,138,0.025) 23px),
    linear-gradient(180deg,#070a0c,#06080a) !important;
  background-attachment:fixed !important;
}
html[data-theme="terminal"]::before, html[data-theme="terminal"]::after,
html[data-theme="terminal"] body::before, html[data-theme="terminal"] body::after{ display:none !important; }
html[data-theme="terminal"] body .stat-card.stat-card,
html[data-theme="terminal"] body .section-card.section-card{
  background:linear-gradient(160deg,#0a0f12,#080c0e) !important; border:1px solid #14201a !important;
  box-shadow:0 0 0 1px rgba(0,224,138,0.05) inset, 0 6px 22px rgba(0,0,0,0.5) !important;
}
html[data-theme="terminal"] body .hero-banner.hero-banner{
  background:linear-gradient(135deg,#0a1410,#070a0c 70%) !important; border:1px solid #14201a !important; box-shadow:0 8px 30px rgba(0,0,0,0.5), 0 0 0 1px rgba(0,224,138,0.06) inset !important;
}
html[data-theme="terminal"] body .btn-primary.btn-primary,
html[data-theme="terminal"] body .auth-btn.auth-btn,
html[data-theme="terminal"] body .landing-btn-primary.landing-btn-primary,
html[data-theme="terminal"] body .landing-btn-primary-lg.landing-btn-primary-lg{
  background:linear-gradient(180deg,#ffd060,#f5a623 55%,#e08e00) !important; color:#0a0a0b !important; border:1px solid #ffcf6a !important;
}
html[data-theme="terminal"] body .pnl-pos.pnl-pos,
html[data-theme="terminal"] body .grade-A.grade-A,
html[data-theme="terminal"] body .badge-green.badge-green{ color:#00e08a !important; text-shadow:0 0 12px rgba(0,224,138,0.4) !important; }
html[data-theme="terminal"] body .pnl-neg.pnl-neg,
html[data-theme="terminal"] body .grade-D.grade-D,
html[data-theme="terminal"] body .badge-red.badge-red{ color:#ff5d5d !important; text-shadow:0 0 12px rgba(255,93,93,0.35) !important; }
html[data-theme="terminal"] body .sidebar.sidebar{ background:linear-gradient(180deg,#080c0e,#06080a) !important; border-right:1px solid #14201a !important; }
html[data-theme="terminal"] body .modal.modal{ background:linear-gradient(180deg,#0a1010,#06080a) !important; border:1px solid #14201a !important; }
html[data-theme="terminal"] body .hero-headline .accent{ background:none !important; -webkit-text-fill-color:#00e08a !important; color:#00e08a !important; filter:drop-shadow(0 0 10px rgba(0,224,138,0.4)) !important; }

/* ====================== THEME: CRYSTAL (glass green apple + chrome) ======= */
html[data-theme="crystal"]{
  --hq-bg:#060908; --hq-surface-1:#0b100d; --hq-surface-2:#0f1613; --hq-surface-3:#161f1a;
  --hq-overlay:rgba(9,14,11,0.97);
  --hq-border:#1d2a23; --hq-border-2:#28382f; --hq-border-hi:#3b5044;
  --hq-text-1:#eff4f1; --hq-text-2:#c6d2ca; --hq-text-3:#8d9b91; --hq-text-4:#617066;
  --hq-accent:#4ade80; --hq-accent-hover:#86efac; --hq-accent-soft:rgba(74,222,128,0.14); --hq-accent-border:rgba(74,222,128,0.42);
  --hq-success:#4ade80; --hq-success-2:#86efac; --hq-success-soft:rgba(74,222,128,0.14);
  --hq-danger:#fb7185; --hq-danger-2:#fda4af; --hq-danger-soft:rgba(251,113,133,0.12);
  --hq-warning:#e8edf0;
  --btn-glow-rgb: 74,222,128;
}
html[data-theme="crystal"] body{
  background:
    radial-gradient(1100px 620px at 50% -8%, rgba(74,222,128,0.07), transparent 60%),
    radial-gradient(1000px 700px at 50% 112%, rgba(190,205,210,0.06), transparent 62%),
    linear-gradient(180deg,#070b09 0%,#05080a 45%,#080d0a 100%) !important;
  background-attachment:fixed !important;
  letter-spacing:0.01em !important; -webkit-font-smoothing:antialiased !important;
}
html[data-theme="crystal"]::before, html[data-theme="crystal"]::after,
html[data-theme="crystal"] body::before, html[data-theme="crystal"] body::after{ display:none !important; }
/* Glass cards — translucent, silver top highlight + faint green inner glow */
html[data-theme="crystal"] body .stat-card.stat-card,
html[data-theme="crystal"] body .section-card.section-card{
  background:linear-gradient(160deg,rgba(20,28,23,0.92),rgba(10,15,12,0.95)) !important;
  border:1px solid #223129 !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.06) inset, 0 0 0 1px rgba(74,222,128,0.05) inset, 0 10px 30px rgba(0,0,0,0.55) !important;
  backdrop-filter:blur(6px) !important;
}
html[data-theme="crystal"] body .hero-banner.hero-banner{
  background:linear-gradient(135deg,rgba(20,34,26,0.9),rgba(8,12,10,0.96) 70%) !important;
  border:1px solid #223129 !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.07) inset, 0 12px 36px rgba(0,0,0,0.55), 0 0 0 1px rgba(74,222,128,0.06) inset !important;
}
/* Glassy emerald-apple primary buttons, bold dark label */
html[data-theme="crystal"] body .btn-primary.btn-primary,
html[data-theme="crystal"] body .auth-btn.auth-btn,
html[data-theme="crystal"] body .landing-btn-primary.landing-btn-primary,
html[data-theme="crystal"] body .landing-btn-primary-lg.landing-btn-primary-lg{
  background:linear-gradient(180deg,#7af0a8,#4ade80 55%,#22a85a) !important; color:#062013 !important; border:1px solid #9af7bd !important; font-weight:800 !important;
}
html[data-theme="crystal"] body .pnl-pos.pnl-pos,
html[data-theme="crystal"] body .grade-A.grade-A,
html[data-theme="crystal"] body .badge-green.badge-green{ color:#4ade80 !important; text-shadow:0 0 12px rgba(74,222,128,0.4) !important; }
html[data-theme="crystal"] body .pnl-neg.pnl-neg,
html[data-theme="crystal"] body .grade-D.grade-D,
html[data-theme="crystal"] body .badge-red.badge-red{ color:#fb7185 !important; text-shadow:0 0 12px rgba(251,113,133,0.35) !important; }
html[data-theme="crystal"] body .sidebar.sidebar{ background:linear-gradient(180deg,#0a100d,#070b09) !important; border-right:1px solid #1c2922 !important; }
html[data-theme="crystal"] body .modal.modal{ background:linear-gradient(180deg,#0c130f,#070b09) !important; border:1px solid #223129 !important; }
html[data-theme="crystal"] body .hero-headline .accent{ background:none !important; -webkit-text-fill-color:#4ade80 !important; color:#4ade80 !important; filter:drop-shadow(0 0 10px rgba(74,222,128,0.45)) !important; }
/* Bold, professional, crisp text */
html[data-theme="crystal"] body .section-title,
html[data-theme="crystal"] body .nav-btn,
html[data-theme="crystal"] body .stat-label,
html[data-theme="crystal"] body .stat-val{ font-weight:800 !important; }

/* ====================== THEME: ELECTRIC BLUE (deep navy + blue) ========== */
html[data-theme="electric"]{
  --hq-bg:#0a0f1e; --hq-surface-1:#0c1424; --hq-surface-2:#121a30; --hq-surface-3:#1a2540;
  --hq-overlay:rgba(12,20,36,0.97);
  --hq-border:#22304f; --hq-border-2:#2e4066; --hq-border-hi:#3a5180;
  --hq-text-1:#eef2fb; --hq-text-2:#c2cfe6; --hq-text-3:#8093b3; --hq-text-4:#5d6f8f;
  --hq-accent:#3b82f6; --hq-accent-hover:#60a5fa; --hq-accent-soft:rgba(59,130,246,0.14); --hq-accent-border:rgba(59,130,246,0.42);
  --hq-success:#22c55e; --hq-success-2:#4ade80; --hq-success-soft:rgba(34,197,94,0.14);
  --hq-danger:#ef4444; --hq-danger-2:#f87171; --hq-danger-soft:rgba(239,68,68,0.12);
  --hq-warning:#f59e0b;
  --btn-glow-rgb: 59,130,246;
}
html[data-theme="electric"] body{
  background:
    radial-gradient(1100px 620px at 50% -8%, rgba(59,130,246,0.09), transparent 60%),
    linear-gradient(180deg,#0a0f1e 0%,#0b1322 55%,#0a0f1e 100%) !important;
  background-attachment:fixed !important;
  font-family:'Space Grotesk','Inter',sans-serif !important;
}
html[data-theme="electric"]::before, html[data-theme="electric"]::after,
html[data-theme="electric"] body::before, html[data-theme="electric"] body::after{ display:none !important; }
html[data-theme="electric"] body .stat-card.stat-card,
html[data-theme="electric"] body .section-card.section-card{
  background:linear-gradient(160deg,#131c34,#0e1628) !important; border:1px solid #22304f !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.05) inset, 0 0 0 1px rgba(59,130,246,0.05) inset, 0 10px 30px rgba(0,0,0,0.5) !important;
}
html[data-theme="electric"] body .hero-banner.hero-banner{
  background:linear-gradient(135deg,#14213e,#0b1322 70%) !important; border:1px solid #22304f !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.06) inset, 0 12px 36px rgba(0,0,0,0.5), 0 0 0 1px rgba(59,130,246,0.07) inset !important;
}
html[data-theme="electric"] body .btn-primary.btn-primary,
html[data-theme="electric"] body .auth-btn.auth-btn,
html[data-theme="electric"] body .landing-btn-primary.landing-btn-primary,
html[data-theme="electric"] body .landing-btn-primary-lg.landing-btn-primary-lg{
  background:linear-gradient(180deg,#60a5fa,#3b82f6 55%,#2563eb) !important; color:#ffffff !important; border:1px solid #7cb0ff !important; font-weight:800 !important;
}
html[data-theme="electric"] body .pnl-pos.pnl-pos,
html[data-theme="electric"] body .grade-A.grade-A,
html[data-theme="electric"] body .badge-green.badge-green{ color:#22c55e !important; text-shadow:0 0 12px rgba(34,197,94,0.35) !important; }
html[data-theme="electric"] body .pnl-neg.pnl-neg,
html[data-theme="electric"] body .grade-D.grade-D,
html[data-theme="electric"] body .badge-red.badge-red{ color:#ef4444 !important; text-shadow:0 0 12px rgba(239,68,68,0.3) !important; }
html[data-theme="electric"] body .sidebar.sidebar{ background:linear-gradient(180deg,#0c1424,#0a0f1e) !important; border-right:1px solid #1c2840 !important; }
html[data-theme="electric"] body .modal.modal{ background:linear-gradient(180deg,#0e1628,#0a0f1e) !important; border:1px solid #22304f !important; }
html[data-theme="electric"] body .hero-headline .accent{ background:none !important; -webkit-text-fill-color:#60a5fa !important; color:#60a5fa !important; filter:drop-shadow(0 0 10px rgba(59,130,246,0.5)) !important; }

/* ====================== THEME: SLATE PROFESSIONAL ======================== */
html[data-theme="slate"]{
  --hq-bg:#0b1220; --hq-surface-1:#101a2c; --hq-surface-2:#0f1729; --hq-surface-3:#1e293b;
  --hq-overlay:rgba(13,20,36,0.97);
  --hq-border:#1e293b; --hq-border-2:#334155; --hq-border-hi:#475569;
  --hq-text-1:#f1f5f9; --hq-text-2:#cbd5e1; --hq-text-3:#94a3b8; --hq-text-4:#64748b;
  --hq-accent:#14b8a6; --hq-accent-hover:#2dd4bf; --hq-accent-soft:rgba(20,184,166,0.14); --hq-accent-border:rgba(45,212,191,0.4);
  --hq-success:#34d399; --hq-success-2:#6ee7b7; --hq-success-soft:rgba(52,211,153,0.14);
  --hq-danger:#fb7185; --hq-danger-2:#fda4af; --hq-danger-soft:rgba(251,113,133,0.14);
  --hq-warning:#fbbf24;
  --btn-glow-rgb: 20,184,166;
}
html[data-theme="slate"] body{
  background:
    radial-gradient(ellipse at 12% 4%, rgba(20,184,166,0.12) 0%, transparent 45%),
    radial-gradient(ellipse at 88% 8%, rgba(56,189,248,0.10) 0%, transparent 50%),
    linear-gradient(160deg,#0d1424 0%, #0b1220 55%, #091020 100%) !important;
  background-attachment:fixed !important;
}
html[data-theme="slate"] body::after{ background:radial-gradient(circle, rgba(20,184,166,0.22) 0%, rgba(20,184,166,0.04) 50%, transparent 70%) !important; }
html[data-theme="slate"]::before{ background:radial-gradient(circle, rgba(56,189,248,0.18) 0%, rgba(56,189,248,0.04) 50%, transparent 70%) !important; }
html[data-theme="slate"] body .stat-card.stat-card,
html[data-theme="slate"] body .section-card.section-card{
  background:linear-gradient(160deg,#101a2c,#0d1626) !important; border:1px solid #1e293b !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.04) inset, 0 8px 26px rgba(0,0,0,0.4) !important;
}
html[data-theme="slate"] body .hero-banner.hero-banner{
  background:linear-gradient(135deg,#101c30,#0c1424 70%) !important; border:1px solid #1e293b !important; box-shadow:0 10px 36px rgba(0,0,0,0.45) !important;
}
html[data-theme="slate"] body .btn-primary.btn-primary,
html[data-theme="slate"] body .auth-btn.auth-btn,
html[data-theme="slate"] body .landing-btn-primary.landing-btn-primary,
html[data-theme="slate"] body .landing-btn-primary-lg.landing-btn-primary-lg{
  background:linear-gradient(180deg,#2dd4bf,#14b8a6 55%,#0d9488) !important; color:#03201c !important; border:1px solid #2dd4bf !important;
}
html[data-theme="slate"] body .pnl-pos.pnl-pos,
html[data-theme="slate"] body .grade-A.grade-A,
html[data-theme="slate"] body .badge-green.badge-green{ color:#34d399 !important; text-shadow:0 0 12px rgba(52,211,153,0.3) !important; }
html[data-theme="slate"] body .pnl-neg.pnl-neg,
html[data-theme="slate"] body .grade-D.grade-D,
html[data-theme="slate"] body .badge-red.badge-red{ color:#fb7185 !important; text-shadow:0 0 12px rgba(251,113,133,0.3) !important; }
html[data-theme="slate"] body .sidebar.sidebar{ background:linear-gradient(180deg,#0d1626,#0b1220) !important; border-right:1px solid #1e293b !important; }
html[data-theme="slate"] body .modal.modal{ background:linear-gradient(180deg,#101a2c,#0b1220) !important; border:1px solid #1e293b !important; }
html[data-theme="slate"] body .hero-headline .accent{ background:linear-gradient(105deg,#2dd4bf,#5eead4,#38bdf8) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; filter:drop-shadow(0 2px 10px rgba(45,212,191,0.25)) !important; }

/* ===================== THEME: EMERALD TERMINAL (dark + money-green) ======== */
html[data-theme="emerald"]{
  --hq-bg:#0a120e; --hq-surface-1:#0d1712; --hq-surface-2:#11201a; --hq-surface-3:#16291f; --hq-overlay:rgba(13,23,18,0.97);
  --hq-border:#1f3329; --hq-border-2:#2a4636; --hq-border-hi:#356b50;
  --hq-text-1:#e9f3ee; --hq-text-2:#c3d6cb; --hq-text-3:#8fae9f; --hq-text-4:#647e70;
  --hq-accent:#10b981; --hq-accent-hover:#34d399; --hq-accent-soft:rgba(16,185,129,0.14); --hq-accent-border:rgba(52,211,153,0.42);
  --hq-success:#34d399; --hq-success-2:#6ee7b7; --hq-success-soft:rgba(52,211,153,0.14);
  --hq-danger:#fb7185; --hq-danger-2:#fda4af; --hq-danger-soft:rgba(251,113,133,0.12); --hq-warning:#fbbf24; --btn-glow-rgb:16,185,129;
}
html[data-theme="emerald"] body{ background:radial-gradient(1100px 620px at 50% -8%,rgba(16,185,129,0.10),transparent 60%),linear-gradient(180deg,#0a120e 0%,#08110c 55%,#0a120e 100%) !important; background-attachment:fixed !important; font-family:'Space Grotesk','Inter',sans-serif !important; }
html[data-theme="emerald"]::before,html[data-theme="emerald"]::after,html[data-theme="emerald"] body::before,html[data-theme="emerald"] body::after{ display:none !important; }
html[data-theme="emerald"] body .stat-card.stat-card,html[data-theme="emerald"] body .section-card.section-card{ background:linear-gradient(160deg,#11201a,#0d1813) !important; border:1px solid #1f3329 !important; box-shadow:0 1px 0 rgba(255,255,255,0.04) inset,0 0 0 1px rgba(16,185,129,0.05) inset,0 10px 30px rgba(0,0,0,0.5) !important; }
html[data-theme="emerald"] body .hero-banner.hero-banner{ background:linear-gradient(135deg,#10231b,#0a140e 70%) !important; border:1px solid #1f3329 !important; box-shadow:0 12px 36px rgba(0,0,0,0.5) !important; }
html[data-theme="emerald"] body .btn-primary.btn-primary,html[data-theme="emerald"] body .auth-btn.auth-btn,html[data-theme="emerald"] body .landing-btn-primary.landing-btn-primary,html[data-theme="emerald"] body .landing-btn-primary-lg.landing-btn-primary-lg{ background:linear-gradient(180deg,#34d399,#10b981 55%,#059669) !important; color:#04160f !important; border:1px solid #5ee9b6 !important; font-weight:800 !important; }
html[data-theme="emerald"] body .pnl-pos.pnl-pos,html[data-theme="emerald"] body .grade-A.grade-A,html[data-theme="emerald"] body .badge-green.badge-green{ color:#34d399 !important; text-shadow:0 0 12px rgba(52,211,153,0.35) !important; }
html[data-theme="emerald"] body .pnl-neg.pnl-neg,html[data-theme="emerald"] body .grade-D.grade-D,html[data-theme="emerald"] body .badge-red.badge-red{ color:#fb7185 !important; text-shadow:0 0 12px rgba(251,113,133,0.3) !important; }
html[data-theme="emerald"] body .sidebar.sidebar{ background:linear-gradient(180deg,#0d1712,#0a120e) !important; border-right:1px solid #18271f !important; }
html[data-theme="emerald"] body .modal.modal{ background:linear-gradient(180deg,#11201a,#0a120e) !important; border:1px solid #1f3329 !important; }
html[data-theme="emerald"] body .hero-headline .accent{ background:linear-gradient(105deg,#34d399,#6ee7b7,#10b981) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; }
html[data-theme="emerald"] body .nav-btn.active{ background:linear-gradient(135deg,rgba(16,185,129,0.20),rgba(16,185,129,0.08)) !important; border:1px solid rgba(16,185,129,0.38) !important; border-left:3px solid #34d399 !important; color:#6ee7b7 !important; }
.sw-emerald{ background:linear-gradient(160deg,#10b981,#0a120e) !important; border-color:#1f3329 !important; }

/* ===================== THEME: SAPPHIRE PRO (navy + electric blue) ========== */
html[data-theme="sapphire"]{
  --hq-bg:#0a0f1c; --hq-surface-1:#0c1426; --hq-surface-2:#111b31; --hq-surface-3:#18233e; --hq-overlay:rgba(12,20,38,0.97);
  --hq-border:#203049; --hq-border-2:#2c3f5e; --hq-border-hi:#3a5180;
  --hq-text-1:#e8eefb; --hq-text-2:#c2cfe6; --hq-text-3:#90a3c2; --hq-text-4:#647697;
  --hq-accent:#3b82f6; --hq-accent-hover:#60a5fa; --hq-accent-soft:rgba(59,130,246,0.14); --hq-accent-border:rgba(96,165,250,0.42);
  --hq-success:#22c55e; --hq-success-2:#4ade80; --hq-success-soft:rgba(34,197,94,0.14);
  --hq-danger:#ef4444; --hq-danger-2:#f87171; --hq-danger-soft:rgba(239,68,68,0.12); --hq-warning:#f5b942; --btn-glow-rgb:59,130,246;
}
html[data-theme="sapphire"] body{ background:radial-gradient(1100px 620px at 50% -8%,rgba(59,130,246,0.10),transparent 60%),linear-gradient(180deg,#0a0f1c 0%,#0a1322 55%,#0a0f1c 100%) !important; background-attachment:fixed !important; font-family:'Space Grotesk','Inter',sans-serif !important; }
html[data-theme="sapphire"]::before,html[data-theme="sapphire"]::after,html[data-theme="sapphire"] body::before,html[data-theme="sapphire"] body::after{ display:none !important; }
html[data-theme="sapphire"] body .stat-card.stat-card,html[data-theme="sapphire"] body .section-card.section-card{ background:linear-gradient(160deg,#111b31,#0c1526) !important; border:1px solid #203049 !important; box-shadow:0 1px 0 rgba(255,255,255,0.04) inset,0 0 0 1px rgba(59,130,246,0.05) inset,0 10px 30px rgba(0,0,0,0.5) !important; }
html[data-theme="sapphire"] body .hero-banner.hero-banner{ background:linear-gradient(135deg,#13213e,#0b1322 70%) !important; border:1px solid #203049 !important; box-shadow:0 12px 36px rgba(0,0,0,0.5) !important; }
html[data-theme="sapphire"] body .btn-primary.btn-primary,html[data-theme="sapphire"] body .auth-btn.auth-btn,html[data-theme="sapphire"] body .landing-btn-primary.landing-btn-primary,html[data-theme="sapphire"] body .landing-btn-primary-lg.landing-btn-primary-lg{ background:linear-gradient(180deg,#60a5fa,#3b82f6 55%,#2563eb) !important; color:#ffffff !important; border:1px solid #7cb0ff !important; font-weight:800 !important; }
html[data-theme="sapphire"] body .pnl-pos.pnl-pos,html[data-theme="sapphire"] body .grade-A.grade-A,html[data-theme="sapphire"] body .badge-green.badge-green{ color:#22c55e !important; text-shadow:0 0 12px rgba(34,197,94,0.35) !important; }
html[data-theme="sapphire"] body .pnl-neg.pnl-neg,html[data-theme="sapphire"] body .grade-D.grade-D,html[data-theme="sapphire"] body .badge-red.badge-red{ color:#ef4444 !important; text-shadow:0 0 12px rgba(239,68,68,0.3) !important; }
html[data-theme="sapphire"] body .sidebar.sidebar{ background:linear-gradient(180deg,#0c1426,#0a0f1c) !important; border-right:1px solid #182740 !important; }
html[data-theme="sapphire"] body .modal.modal{ background:linear-gradient(180deg,#111b31,#0a0f1c) !important; border:1px solid #203049 !important; }
html[data-theme="sapphire"] body .hero-headline .accent{ background:linear-gradient(105deg,#60a5fa,#93c5fd,#3b82f6) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; }
html[data-theme="sapphire"] body .nav-btn.active{ background:linear-gradient(135deg,rgba(59,130,246,0.20),rgba(59,130,246,0.08)) !important; border:1px solid rgba(59,130,246,0.38) !important; border-left:3px solid #60a5fa !important; color:#93c5fd !important; }
.sw-sapphire{ background:linear-gradient(160deg,#3b82f6,#0a0f1c) !important; border-color:#203049 !important; }

/* ===================== THEME: GOLD CARBON (near-black + gold) ============== */
html[data-theme="carbon"]{
  --hq-bg:#0b0b0d; --hq-surface-1:#0e0e11; --hq-surface-2:#161618; --hq-surface-3:#1d1d21; --hq-overlay:rgba(14,14,17,0.97);
  --hq-border:#28282d; --hq-border-2:#34343b; --hq-border-hi:#4a4a52;
  --hq-text-1:#f1efe8; --hq-text-2:#d2cfc4; --hq-text-3:#a7a59b; --hq-text-4:#74726a;
  --hq-accent:#d4af37; --hq-accent-hover:#e9c767; --hq-accent-soft:rgba(212,175,55,0.13); --hq-accent-border:rgba(233,199,103,0.40);
  --hq-success:#5ec26a; --hq-success-2:#86d98f; --hq-success-soft:rgba(94,194,106,0.14);
  --hq-danger:#e0584a; --hq-danger-2:#ea7d72; --hq-danger-soft:rgba(224,88,74,0.12); --hq-warning:#d4af37; --btn-glow-rgb:212,175,55;
}
html[data-theme="carbon"] body{ background:radial-gradient(1100px 620px at 50% -8%,rgba(212,175,55,0.07),transparent 60%),linear-gradient(180deg,#0b0b0d 0%,#090909 55%,#0b0b0d 100%) !important; background-attachment:fixed !important; font-family:'Space Grotesk','Inter',sans-serif !important; }
html[data-theme="carbon"]::before,html[data-theme="carbon"]::after,html[data-theme="carbon"] body::before,html[data-theme="carbon"] body::after{ display:none !important; }
html[data-theme="carbon"] body .stat-card.stat-card,html[data-theme="carbon"] body .section-card.section-card{ background:linear-gradient(160deg,#161618,#0f0f11) !important; border:1px solid #28282d !important; box-shadow:0 1px 0 rgba(255,255,255,0.03) inset,0 0 0 1px rgba(212,175,55,0.05) inset,0 10px 30px rgba(0,0,0,0.6) !important; }
html[data-theme="carbon"] body .hero-banner.hero-banner{ background:linear-gradient(135deg,#1a1813,#0c0c0d 72%) !important; border:1px solid #28282d !important; box-shadow:0 12px 36px rgba(0,0,0,0.6) !important; }
html[data-theme="carbon"] body .btn-primary.btn-primary,html[data-theme="carbon"] body .auth-btn.auth-btn,html[data-theme="carbon"] body .landing-btn-primary.landing-btn-primary,html[data-theme="carbon"] body .landing-btn-primary-lg.landing-btn-primary-lg{ background:linear-gradient(180deg,#e9c767,#d4af37 55%,#b8932a) !important; color:#1c1606 !important; border:1px solid #f0d488 !important; font-weight:800 !important; }
html[data-theme="carbon"] body .pnl-pos.pnl-pos,html[data-theme="carbon"] body .grade-A.grade-A,html[data-theme="carbon"] body .badge-green.badge-green{ color:#5ec26a !important; text-shadow:0 0 12px rgba(94,194,106,0.3) !important; }
html[data-theme="carbon"] body .pnl-neg.pnl-neg,html[data-theme="carbon"] body .grade-D.grade-D,html[data-theme="carbon"] body .badge-red.badge-red{ color:#e0584a !important; text-shadow:0 0 12px rgba(224,88,74,0.3) !important; }
html[data-theme="carbon"] body .sidebar.sidebar{ background:linear-gradient(180deg,#0e0e11,#0b0b0d) !important; border-right:1px solid #1c1c20 !important; }
html[data-theme="carbon"] body .modal.modal{ background:linear-gradient(180deg,#161618,#0b0b0d) !important; border:1px solid #28282d !important; }
html[data-theme="carbon"] body .hero-headline .accent{ background:linear-gradient(105deg,#e9c767,#f5dea0,#d4af37) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; }
html[data-theme="carbon"] body .nav-btn.active{ background:linear-gradient(135deg,rgba(212,175,55,0.18),rgba(212,175,55,0.07)) !important; border:1px solid rgba(212,175,55,0.36) !important; border-left:3px solid #e9c767 !important; color:#e9c767 !important; }
.sw-carbon{ background:linear-gradient(160deg,#d4af37,#0b0b0d) !important; border-color:#28282d !important; }

/* ============== THEME: REFINED MIDNIGHT VIOLET (brand violet) ============= */
html[data-theme="violet"]{
  --hq-bg:#0b0b14; --hq-surface-1:#11111a; --hq-surface-2:#15151f; --hq-surface-3:#1d1d29;
  --hq-overlay:rgba(13,13,20,0.97);
  --hq-border:#23233a; --hq-border-2:#2e2e46; --hq-border-hi:#3d3d5c;
  --hq-text-1:#f1f1f8; --hq-text-2:#c7c7da; --hq-text-3:#9090a8; --hq-text-4:#6a6a82;
  --hq-accent:#7C5CFC; --hq-accent-hover:#A78BFA; --hq-accent-soft:rgba(124,92,252,0.14); --hq-accent-border:rgba(124,92,252,0.42);
  --hq-success:#22c55e; --hq-success-2:#4ade80; --hq-success-soft:rgba(34,197,94,0.14);
  --hq-danger:#ef4444; --hq-danger-2:#f87171; --hq-danger-soft:rgba(239,68,68,0.12);
  --hq-warning:#fbbf24;
  --btn-glow-rgb: 124,92,252;
}
html[data-theme="violet"] body{
  background:
    radial-gradient(1100px 640px at 8% -8%, rgba(124,92,252,0.16), transparent 58%),
    linear-gradient(180deg,#0b0b14 0%,#08080f 60%,#06060c 100%) !important;
  background-attachment:fixed !important;
  font-family:'Space Grotesk','Inter',sans-serif !important;
}
html[data-theme="violet"]::before, html[data-theme="violet"]::after,
html[data-theme="violet"] body::before, html[data-theme="violet"] body::after{ display:none !important; }
html[data-theme="violet"] body .stat-card.stat-card,
html[data-theme="violet"] body .section-card.section-card{
  background:linear-gradient(160deg,#15151f,#101019) !important; border:1px solid #23233a !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.05) inset, 0 0 0 1px rgba(124,92,252,0.05) inset, 0 10px 30px rgba(0,0,0,0.5) !important;
}
html[data-theme="violet"] body .hero-banner.hero-banner{
  background:linear-gradient(135deg,#1a1430,#0d0d18 70%) !important; border:1px solid #2a2342 !important;
  box-shadow:0 1px 0 rgba(255,255,255,0.06) inset, 0 12px 36px rgba(0,0,0,0.5), 0 0 0 1px rgba(124,92,252,0.08) inset !important;
}
html[data-theme="violet"] body .btn-primary.btn-primary,
html[data-theme="violet"] body .auth-btn.auth-btn,
html[data-theme="violet"] body .landing-btn-primary.landing-btn-primary,
html[data-theme="violet"] body .landing-btn-primary-lg.landing-btn-primary-lg{
  background:linear-gradient(180deg,#9b7dff,#7C5CFC 55%,#5b3fd4) !important; color:#ffffff !important; border:1px solid #a890ff !important; font-weight:800 !important;
}
html[data-theme="violet"] body .pnl-pos.pnl-pos,
html[data-theme="violet"] body .grade-A.grade-A,
html[data-theme="violet"] body .badge-green.badge-green{ color:#22c55e !important; text-shadow:0 0 12px rgba(34,197,94,0.35) !important; }
html[data-theme="violet"] body .pnl-neg.pnl-neg,
html[data-theme="violet"] body .grade-D.grade-D,
html[data-theme="violet"] body .badge-red.badge-red{ color:#ef4444 !important; text-shadow:0 0 12px rgba(239,68,68,0.3) !important; }
html[data-theme="violet"] body .sidebar.sidebar{ background:linear-gradient(180deg,#0e0e1a,#0a0a12) !important; border-right:1px solid #1f1f33 !important; }
html[data-theme="violet"] body .modal.modal{ background:linear-gradient(180deg,#15151f,#0b0b14) !important; border:1px solid #23233a !important; }
html[data-theme="violet"] body .hero-headline .accent{ background:linear-gradient(105deg,#A78BFA,#c4b5fd,#7C5CFC) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; filter:drop-shadow(0 2px 10px rgba(124,92,252,0.3)) !important; }
html[data-theme="violet"] body .nav-btn.active{ background:linear-gradient(135deg,rgba(124,92,252,0.20),rgba(124,92,252,0.08)) !important; border:1px solid rgba(124,92,252,0.38) !important; border-left:3px solid #A78BFA !important; color:#c4b5fd !important; }
.sw-violet{ background:linear-gradient(160deg,#7C5CFC,#0b0b14) !important; border-color:#3d3d5c !important; }

/* Day / Night swatches for the Settings picker */
.sw-day{ background:linear-gradient(160deg,#ffffff,#e7ebf2) !important; border-color:#cdd3dd !important; }
.sw-night{ background:linear-gradient(160deg,#1a1a1f,#000) !important; border-color:#2a2a33 !important; }

/* ============================ THEME: NIGHT (crisp black) ============================
   The app is already dark — Night pushes it to pure crisp black with sharp borders
   and high-contrast text. Figure glows (already tightened globally) read well here. */
html[data-theme="night"]{
  color-scheme:dark;
  --hq-bg:#000; --hq-surface-1:#0a0a0e; --hq-surface-2:#0e0e14; --hq-surface-3:#16161c;
  --hq-border:#1a1a22; --hq-border-2:#24242e; --hq-border-hi:#33333f;
  --hq-text-1:#f4f6fb; --hq-text-2:#c4c7d2; --hq-text-3:#8b8f9c; --hq-text-4:#5e6270;
  --btn-glow-rgb:124,92,252;
}
html[data-theme="night"] body{ background:#000 !important; background-attachment:fixed !important; }
html[data-theme="night"]::before, html[data-theme="night"]::after,
html[data-theme="night"] body::before{ display:none !important; }
html[data-theme="night"] body::after{ background:radial-gradient(circle, rgba(124,92,252,0.10) 0%, transparent 60%) !important; }
html[data-theme="night"] body .stat-card.stat-card,
html[data-theme="night"] body .section-card.section-card,
html[data-theme="night"] body .plan-card.plan-card{
  background:#0a0a0e !important; border:1px solid #1a1a22 !important;
  box-shadow:0 0 0 1px rgba(255,255,255,0.02) inset, 0 6px 22px rgba(0,0,0,0.6) !important;
}
html[data-theme="night"] body .hero-banner.hero-banner{ background:linear-gradient(150deg,#0c0c12,#000 75%) !important; border:1px solid #1a1a22 !important; box-shadow:0 8px 30px rgba(0,0,0,0.6) !important; }
html[data-theme="night"] body .sidebar.sidebar{ background:#050507 !important; border-right:1px solid #16161c !important; }
html[data-theme="night"] body .top-bar.top-bar{ background:rgba(0,0,0,0.9) !important; border-bottom:1px solid #16161c !important; }
html[data-theme="night"] body .modal.modal{ background:#0a0a0e !important; border:1px solid #1a1a22 !important; }
/* hover/selected card — clearly visible (was a washed dark gradient) */
html[data-theme="night"] body .stat-card.stat-card:hover,
html[data-theme="night"] body .section-card.section-card:hover{
  background:#101018 !important; border-color:rgba(124,92,252,0.45) !important;
  box-shadow:0 0 0 1px rgba(124,92,252,0.30), 0 10px 30px rgba(0,0,0,0.7) !important;
}
/* bottom brokerage strip → true night black */
html[data-theme="night"] body .brokerage-strip.brokerage-strip{ background:linear-gradient(180deg,#0c0c12,#000) !important; border:1px solid #1a1a22 !important; }

/* ============================= THEME: DAY (crisp white) =============================
   Inverts the hardcoded-dark UI to a clean crisp white. Double-class !important is
   needed to beat the inline/hardcoded dark colours and the HI-DPI block. This is a
   broad first pass — some deep components may need touch-ups once seen on the real
   dashboard (the base app does NOT use palette variables, so coverage is manual). */
html[data-theme="daylight"]{
  color-scheme:light;
  --hq-bg:#f4f6fb; --hq-surface-1:#ffffff; --hq-surface-2:#ffffff; --hq-surface-3:#eef1f6;
  --hq-border:#e3e6ee; --hq-border-2:#d4d9e3; --hq-border-hi:#c2c8d4;
  --hq-text-1:#0e1013; --hq-text-2:#2a2f3a; --hq-text-3:#474d5b; --hq-text-4:#5d6472;
  --hq-accent:#4f46e5; --hq-accent-hover:#4338ca; --hq-accent-soft:rgba(79,70,229,0.08); --hq-accent-border:rgba(79,70,229,0.3);
  --hq-success:#16a34a; --hq-danger:#dc2626; --hq-warning:#d97706;
  --btn-glow-rgb:124,92,252;
}
html[data-theme="daylight"] body{ background:#f4f6fb !important; background-attachment:fixed !important; color:#14161f !important; }
html[data-theme="daylight"]::before, html[data-theme="daylight"]::after,
html[data-theme="daylight"] body::before, html[data-theme="daylight"] body::after{ display:none !important; }
/* keep whites pure crisp — drop the dashboard saturate/contrast grade */
html[data-theme="daylight"] main.main{ filter:none !important; }
/* cards / panels */
html[data-theme="daylight"] body .stat-card.stat-card,
html[data-theme="daylight"] body .section-card.section-card,
html[data-theme="daylight"] body .plan-card.plan-card,
html[data-theme="daylight"] body .trade-detail-card.trade-detail-card{
  background:#ffffff !important; border:1px solid #e3e6ee !important;
  box-shadow:0 1px 2px rgba(16,24,40,0.04), 0 1px 3px rgba(16,24,40,0.06) !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
html[data-theme="daylight"] body .hero-banner.hero-banner{ background:linear-gradient(160deg,#ffffff,#eef1f7) !important; border:1px solid #e3e6ee !important; box-shadow:0 4px 18px rgba(16,24,40,0.06) !important; }
/* sidebar + nav */
html[data-theme="daylight"] body .sidebar.sidebar{ background:#ffffff !important; border-right:1px solid #e5e8ef !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
html[data-theme="daylight"] body .nav-btn.nav-btn{ color:#3c4150 !important; }
html[data-theme="daylight"] body .nav-btn.nav-btn:hover{ background:#f0f2f7 !important; color:#14161f !important; }
html[data-theme="daylight"] body .nav-btn.active{ background:rgba(79,70,229,0.10) !important; color:#4f46e5 !important; }
/* top bar */
html[data-theme="daylight"] body .top-bar.top-bar{ background:rgba(255,255,255,0.92) !important; border-bottom:1px solid #e5e8ef !important; }
/* text */
html[data-theme="daylight"] body .section-title.section-title,
html[data-theme="daylight"] body .stat-title{ color:#14161f !important; }
html[data-theme="daylight"] body .form-label.form-label,
html[data-theme="daylight"] body label{ color:#3c4150 !important; }
html[data-theme="daylight"] body .lbl, html[data-theme="daylight"] body .sub,
html[data-theme="daylight"] body .hero-stat .lbl, html[data-theme="daylight"] body .hero-stat .sub{ color:#474d5b !important; }
html[data-theme="daylight"] body .val.val, html[data-theme="daylight"] body .stat-val.stat-val,
html[data-theme="daylight"] body .hero-stat .val{ color:#14161f !important; text-shadow:none !important; }
/* inputs */
html[data-theme="daylight"] body .form-input.form-input,
html[data-theme="daylight"] body .form-select.form-select,
html[data-theme="daylight"] body textarea,
html[data-theme="daylight"] body select.form-select{
  background:#ffffff !important; border:1px solid #d4d9e3 !important; color:#14161f !important;
}
html[data-theme="daylight"] body .form-input::placeholder, html[data-theme="daylight"] body textarea::placeholder{ color:#9aa0ad !important; }
/* buttons */
html[data-theme="daylight"] body .btn-ghost.btn-ghost{ background:#f0f2f7 !important; border:1px solid #d4d9e3 !important; color:#3c4150 !important; }
html[data-theme="daylight"] body .btn-primary.btn-primary,
html[data-theme="daylight"] body .auth-btn.auth-btn{ background:linear-gradient(180deg,#7c5cfc,#4f46e5) !important; color:#fff !important; border:1px solid #4f46e5 !important; }
/* pnl / grades / badges — darker for white-bg legibility, no glow */
html[data-theme="daylight"] body .pnl-pos.pnl-pos, html[data-theme="daylight"] body .grade-A.grade-A,
html[data-theme="daylight"] body .badge-green.badge-green, html[data-theme="daylight"] body .val.pos{ color:#16a34a !important; text-shadow:none !important; }
html[data-theme="daylight"] body .pnl-neg.pnl-neg, html[data-theme="daylight"] body .grade-D.grade-D,
html[data-theme="daylight"] body .badge-red.badge-red, html[data-theme="daylight"] body .val.neg{ color:#dc2626 !important; text-shadow:none !important; }
/* modals */
/* triple .modal beats the (0,4,2) :not(...) enhancement rule that hardcodes a dark gradient */
html[data-theme="daylight"] body .modal.modal.modal{ background:#ffffff !important; background-image:none !important; border:1px solid #e3e6ee !important; color:#14161f !important; box-shadow:0 24px 80px rgba(16,24,40,0.18) !important; }
html[data-theme="daylight"] body .modal-backdrop.modal-backdrop{ background:rgba(20,22,31,0.45) !important; }
/* detail cells */
html[data-theme="daylight"] body .qv-detail-cell.qv-detail-cell,
html[data-theme="daylight"] body .trade-detail-field.trade-detail-field{ background:#f7f8fb !important; border-color:#e3e6ee !important; }
/* catch the common hardcoded-dark inline container background (#0a0a12) */
html[data-theme="daylight"] [style*="background:#0a0a12"],
html[data-theme="daylight"] [style*="background: #0a0a12"]{ background:#ffffff !important; border-color:#e3e6ee !important; }
/* scrollbar */
html[data-theme="daylight"] ::-webkit-scrollbar-thumb{ background:#c9ced8 !important; }
html[data-theme="daylight"] ::-webkit-scrollbar-track{ background:#eef1f6 !important; }
/* hero headline accent — stays purple, readable on white */
html[data-theme="daylight"] body .hero-headline .accent{ background:linear-gradient(105deg,#7c3aed,#4f46e5) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; filter:none !important; }
/* hover/selected card — THE fix: was turning black on hover (HI-DPI dark gradient).
   Keep it white with a clear purple ring so the hovered/selected card is obvious. */
html[data-theme="daylight"] body .stat-card.stat-card:hover,
html[data-theme="daylight"] body .section-card.section-card:hover{
  background:#ffffff !important; border-color:#b9a7f2 !important;
  box-shadow:0 0 0 1px rgba(79,70,229,0.30), 0 10px 26px rgba(16,24,40,0.12) !important;
}
/* bottom brokerage strip → light (was a hardcoded dark gradient) */
html[data-theme="daylight"] body .brokerage-strip.brokerage-strip{ background:linear-gradient(180deg,#ffffff,#f2f4f9) !important; border:1px solid #e3e6ee !important; }
html[data-theme="daylight"] body .brk-lbl{ color:#474d5b !important; }
html[data-theme="daylight"] body .brk-sub{ color:#5d6472 !important; }
html[data-theme="daylight"] body .brk-divider{ background:linear-gradient(180deg,transparent,#d4d9e3 50%,transparent) !important; }
html[data-theme="daylight"] body .brk-val.brk-val{ text-shadow:none !important; }

/* ===================== DAY MODE — app-wide coverage (text + dark boxes) =====================
   Inline light-text and dark-bg styles are used across EVERY page; these attribute
   overrides catch them so all sessions read correctly on white. (#fff text is left alone
   on purpose — it's usually white-on-coloured-button text.) */
/* light inline text → readable dark / muted */
html[data-theme="daylight"] [style*="color:#e2e8f0"], html[data-theme="daylight"] [style*="color: #e2e8f0"],
html[data-theme="daylight"] [style*="color:#F8F8FC"], html[data-theme="daylight"] [style*="color:#f8f8fc"],
html[data-theme="daylight"] [style*="color:#eaf6ea"], html[data-theme="daylight"] [style*="color:#eaffe0"],
html[data-theme="daylight"] [style*="color:#d6e8df"]{ color:#14161f !important; }
html[data-theme="daylight"] [style*="color:#a0a0b0"], html[data-theme="daylight"] [style*="color: #a0a0b0"],
html[data-theme="daylight"] [style*="color:#c0d0e0"]{ color:#646b7c !important; }
/* dark inline backgrounds → light surface */
html[data-theme="daylight"] [style*="background:#0a0a12"], html[data-theme="daylight"] [style*="background: #0a0a12"],
html[data-theme="daylight"] [style*="background:#0d0d18"], html[data-theme="daylight"] [style*="background: #0d0d18"],
html[data-theme="daylight"] [style*="background:#1a1a2e"],
html[data-theme="daylight"] [style*="background:#131322"],
html[data-theme="daylight"] [style*="background:#252539"],
html[data-theme="daylight"] [style*="background:#08070f"],
html[data-theme="daylight"] [style*="background:#0f0f1c"]{ background:#ffffff !important; border-color:#e3e6ee !important; }
/* tinted status inline backgrounds → light tints */
html[data-theme="daylight"] [style*="background:#0d2d1a"]{ background:#e7f7ee !important; }
html[data-theme="daylight"] [style*="background:#2d0d0d"], html[data-theme="daylight"] [style*="background:#1f0a0a"]{ background:#fdeaea !important; }
/* badges (hardcoded dark-tinted) */
html[data-theme="daylight"] body .badge-green.badge-green{ background:#e7f7ee !important; color:#15803d !important; border-color:#bbe9cc !important; }
html[data-theme="daylight"] body .badge-red.badge-red{ background:#fdeaea !important; color:#b91c1c !important; border-color:#f3c6c6 !important; }
/* brokerage strip inner 3D boxes → clean white cards (was a dark translucent gradient) */
html[data-theme="daylight"] body .brokerage-strip .brk-item{
  background:#ffffff !important; background-image:none !important;
  border:1px solid #e7eaf0 !important;
  box-shadow:0 1px 2px rgba(16,24,40,0.05), 0 1px 3px rgba(16,24,40,0.07) !important;
}
/* checklists + daily-todo: dark cards & black checkboxes → light */
html[data-theme="daylight"] body .checklist-card,
html[data-theme="daylight"] body .daily-todo-card{ background:#ffffff !important; border-color:#e3e6ee !important; }
html[data-theme="daylight"] body .checklist-item,
html[data-theme="daylight"] body .daily-todo-item{ background:#f7f8fb !important; border-color:#e3e6ee !important; }
html[data-theme="daylight"] body .checklist-box{ background:#ffffff !important; border-color:#c2c8d4 !important; }
html[data-theme="daylight"] body .daily-todo-cb{ background:#ffffff !important; border-color:#c2c8d4 !important; }
/* keep the CHECKED state filled green (white base must not override it) */
html[data-theme="daylight"] body .checklist-item.ticked .checklist-box{ background:#16a34a !important; border-color:#16a34a !important; color:#ffffff !important; }
html[data-theme="daylight"] body .daily-todo-item.done .daily-todo-cb{ background:#16a34a !important; border-color:#16a34a !important; color:#ffffff !important; }
html[data-theme="daylight"] body .checklist-bar,
html[data-theme="daylight"] body .daily-todo-progress-bar{ background:#e8ebf1 !important; }
html[data-theme="daylight"] body .checklist-btn-reset{ background:#f0f2f7 !important; color:#3c4150 !important; border-color:#d4d9e3 !important; }

/* ===== DAY MODE — tool-page coverage (Prop Firm, Monte Carlo, MAE/MFE, Calendar,
   Session Clock, Plans, Recovery, Psychology, Azhkar). Found via a full-page DOM scan
   for dark surfaces / light text. ===== */
/* dark INPUTS → white */
html[data-theme="daylight"] body .pf-input, html[data-theme="daylight"] body .rc-input,
html[data-theme="daylight"] body .azhkar-input, html[data-theme="daylight"] body .mc-input{
  background:#ffffff !important; border-color:#d4d9e3 !important; color:#14161f !important;
}
/* dark non-interactive PANELS/BOXES → light */
html[data-theme="daylight"] body .pf-info-block, html[data-theme="daylight"] body .pf-dist-item,
html[data-theme="daylight"] body .pf-bar-track, html[data-theme="daylight"] body .pf-bar-tag,
html[data-theme="daylight"] body .pf-toggle-row, html[data-theme="daylight"] body .pj-kpi,
html[data-theme="daylight"] body .cal-wk-sum-box, html[data-theme="daylight"] body .dpk-panel,
html[data-theme="daylight"] body .plans-ladder-step, html[data-theme="daylight"] body .cs-display,
html[data-theme="daylight"] body .mc-progress-wrap, html[data-theme="daylight"] body .sle-recovery,
html[data-theme="daylight"] body .po-linbar-track, html[data-theme="daylight"] body .sc-utc-card,
html[data-theme="daylight"] body .tc-billing-toggle, html[data-theme="daylight"] body .mmh-quad,
html[data-theme="daylight"] body .mmh-tooltip, html[data-theme="daylight"] body .theme-opt,
html[data-theme="daylight"] body .dt-history-filter{
  background:#f4f6fb !important; border-color:#e3e6ee !important; color:#3c4150 !important;
}
/* light TITLE/VALUE/LABEL text → dark (NOT tabs/pills — those keep their active states) */
html[data-theme="daylight"] body .sc-meta-val, html[data-theme="daylight"] body .mc-stat-val,
html[data-theme="daylight"] body .dt-tier-name, html[data-theme="daylight"] body .mmh-quad-title,
html[data-theme="daylight"] body .sc-card-name, html[data-theme="daylight"] body .sc-ring-time,
html[data-theme="daylight"] body .pf-bn-val, html[data-theme="daylight"] body .sc-info-title,
html[data-theme="daylight"] body .azhkar-section-label, html[data-theme="daylight"] body .azhkar-label,
html[data-theme="daylight"] body .daily-todo-title, html[data-theme="daylight"] body .cal-po-totval-big,
html[data-theme="daylight"] body .psych-tab-count, html[data-theme="daylight"] body .pj-kv,
html[data-theme="daylight"] body .mc-chart-title, html[data-theme="daylight"] body .dsshov-label,
html[data-theme="daylight"] body .dsshov-time, html[data-theme="daylight"] body .eq-risk-pct,
html[data-theme="daylight"] body .dt-legend-title, html[data-theme="daylight"] body .cal-wk-sum-val,
html[data-theme="daylight"] body .theme-opt-name, html[data-theme="daylight"] body .pf-bar-icon{
  color:#14161f !important; text-shadow:none !important;
}
/* MAE/MFE — class-styled controls (no inline background for the attribute rules to
   catch) + the stat cards, which were dark cards with dark text in day mode. */
html[data-theme="daylight"] body .mmh-tabs, html[data-theme="daylight"] body .mmh-src{ background:#ffffff !important; border-color:#e3e6ee !important; }
html[data-theme="daylight"] body .mmh-tab:not(.active), html[data-theme="daylight"] body .mmh-src-btn:not(.active){ color:#646b7c !important; }
html[data-theme="daylight"] body .mmh-src-btn.active{ background:#ede9fe !important; color:#5b21b6 !important; }
html[data-theme="daylight"] body .mmh-stat.mmh-stat{ background:#ffffff !important; background-image:none !important; border-color:#e3e6ee !important; }
html[data-theme="daylight"] body .mmh-stat-label, html[data-theme="daylight"] body .mmh-stat-sub,
html[data-theme="daylight"] body .mmh-only-logged, html[data-theme="daylight"] body .mmh-foot,
html[data-theme="daylight"] body .mmh-tip-row .lbl{ color:#646b7c !important; }
html[data-theme="daylight"] body .mmh-stat-value.mmh-stat-value, html[data-theme="daylight"] body .mmh-tip-row .val{ color:#14161f !important; text-shadow:none !important; }
html[data-theme="daylight"] body .mmh-stat-value.win.win{ color:#16a34a !important; }
html[data-theme="daylight"] body .mmh-stat-value.loss.loss{ color:#dc2626 !important; }
/* Monte Carlo stat cards: were dark cards whose values/labels day mode turned dark too */
html[data-theme="daylight"] body #montecarloPage .mc-stat{ background:#ffffff !important; border-color:#e3e6ee !important; }
html[data-theme="daylight"] body #montecarloPage .mc-stat::before{ opacity:.35 !important; }
html[data-theme="daylight"] body #montecarloPage .mc-stat-label, html[data-theme="daylight"] body #montecarloPage .mc-stat-sub{ color:#646b7c !important; }
html[data-theme="daylight"] body #montecarloPage .mc-stat.warn .mc-stat-sub b{ color:#b45309 !important; }
html[data-theme="daylight"] body #montecarloPage .mc-stat.cyan .mc-stat-sub b{ color:#0e7490 !important; }
/* Monte Carlo — journal note, log-scale toggle, model pill */
html[data-theme="daylight"] body #montecarloPage .mc-journal-note{ background:#ecfeff !important; border-color:#a5f3fc !important; color:#3c4150 !important; }
html[data-theme="daylight"] body #montecarloPage .mc-journal-note b{ color:#0e7490 !important; }
html[data-theme="daylight"] body #montecarloPage .mc-journal-note.warn{ background:#fffbeb !important; border-color:#fde68a !important; }
html[data-theme="daylight"] body #montecarloPage .mc-journal-note.warn b{ color:#b45309 !important; }
html[data-theme="daylight"] body #montecarloPage .mc-scale-btn{ background:#ffffff !important; border-color:#d4d9e3 !important; color:#646b7c !important; }
html[data-theme="daylight"] body #montecarloPage .mc-scale-btn[aria-pressed="true"]{ background:#ede9fe !important; border-color:#a78bfa !important; color:#5b21b6 !important; }
html[data-theme="daylight"] body #montecarloPage .mc-model-pill{ background:#ede9fe !important; border-color:#c4b5fd !important; color:#5b21b6 !important; }
/* toggle switch: off = light grey, keep ON = purple (specificity-safe) */
html[data-theme="daylight"] body .slider{ background:#cdd3dd !important; }
html[data-theme="daylight"] body input:checked + .slider{ background:#4f46e5 !important; }
/* Add-Trade & all modals: default text dark on the now-white modal */
html[data-theme="daylight"] body .modal{ color:#14161f !important; }
html[data-theme="daylight"] body .modal-backdrop input, html[data-theme="daylight"] body .modal-backdrop select, html[data-theme="daylight"] body .modal-backdrop textarea,
html[data-theme="daylight"] body .modal input, html[data-theme="daylight"] body .modal select, html[data-theme="daylight"] body .modal textarea{ background:#ffffff !important; border-color:#d4d9e3 !important; color:#14161f !important; }
html[data-theme="daylight"] body .modal input::placeholder, html[data-theme="daylight"] body .modal textarea::placeholder{ color:#9aa0ad !important; }

/* ============================================================================
   DAY MODE v2 — full contrast hardening. Built from a colour audit + a live
   contrast scan. Two parts:
   (1) Auth/login surfaces were dark with dark text → invisible. Whitened here.
   (2) Every hardcoded LIGHT text colour the app uses is remapped to a readable
       dark/muted/semantic colour — but SCOPED via :is(...) to the surfaces that
       are actually white in day mode, so the intentionally-dark "terminal"
       widgets (live equity, session clock, economic calendar) keep their
       light-on-dark text untouched. Inline matches use the `i` flag (case-insensitive).
   ============================================================================ */
/* (1) login / auth surfaces */
html[data-theme="daylight"] body .auth-overlay.auth-overlay{ background:radial-gradient(1200px 700px at 50% -10%,#eef1f8,#f4f6fb) !important; }
html[data-theme="daylight"] body .auth-card.auth-card, html[data-theme="daylight"] body .login-card.login-card, html[data-theme="daylight"] body .otp-modal.otp-modal{
  background:#ffffff !important; border:1px solid #e3e6ee !important; color:#14161f !important; box-shadow:0 24px 80px rgba(16,24,40,0.16) !important;
}
html[data-theme="daylight"] body .auth-card input, html[data-theme="daylight"] body .auth-card select, html[data-theme="daylight"] body .auth-card textarea{ background:#ffffff !important; border:1px solid #d4d9e3 !important; color:#14161f !important; }
html[data-theme="daylight"] body .auth-card input::placeholder{ color:#9aa0ad !important; }
html[data-theme="daylight"] .auth-card :is([style*="background:#15151f" i],[style*="background:#11111a" i],[style*="background:#1d1d29" i],[style*="background:#0a0a12" i]){ background:#f4f6fb !important; border-color:#e3e6ee !important; }

/* (2) light text → readable, scoped to white surfaces */
html[data-theme="daylight"] :is(.stat-card,.section-card,.hero-banner,.auth-card,.login-card,.modal,.plan-card,.checklist-card,.daily-todo-card,.feature-card,.brokerage-strip,.trade-detail-card,.equity-preview) :is([style*="color:#e2e8f0" i],[style*="color:#e7e9f3" i],[style*="color:#f3f4fb" i],[style*="color:#cdd9ef" i],[style*="color:#c7cbe0" i],[style*="color:#d4d8ea" i],[style*="color:#cfd3e6" i],[style*="color:#eef2fb" i],[style*="color:#e8efff" i],[style*="color:#eaffe0" i],[style*="color:#f1f1f8" i],[style*="color:#f8f8fc" i]){ color:#14161f !important; text-shadow:none !important; }
html[data-theme="daylight"] :is(.stat-card,.section-card,.hero-banner,.auth-card,.login-card,.modal,.plan-card,.checklist-card,.daily-todo-card,.feature-card,.brokerage-strip,.trade-detail-card,.equity-preview) :is([style*="color:#a0a0b0" i],[style*="color:#c0d0e0" i],[style*="color:#9090a8" i],[style*="color:#8a90ad" i],[style*="color:#9aa0bd" i],[style*="color:#7780a0" i],[style*="color:#6a7090" i],[style*="color:#8089a6" i],[style*="color:#9494ac" i],[style*="color:#9a9ab8" i],[style*="color:#aeb4cf" i],[style*="color:#8a90a0" i],[style*="color:#9aa0ad" i]){ color:#41485a !important; text-shadow:none !important; }
html[data-theme="daylight"] :is(.stat-card,.section-card,.hero-banner,.auth-card,.login-card,.modal,.plan-card,.checklist-card,.daily-todo-card,.feature-card,.brokerage-strip,.trade-detail-card,.equity-preview) :is([style*="color:#a78bfa" i],[style*="color:#c4b5fd" i],[style*="color:#b9a7f2" i],[style*="color:#7c5cfc" i]){ color:#4f46e5 !important; text-shadow:none !important; }
html[data-theme="daylight"] :is(.stat-card,.section-card,.hero-banner,.auth-card,.login-card,.modal,.plan-card,.checklist-card,.daily-todo-card,.feature-card,.brokerage-strip,.trade-detail-card,.equity-preview) :is([style*="color:#fbbf24" i],[style*="color:#ffe08a" i],[style*="color:#f59e0b" i],[style*="color:#fcd34d" i]){ color:#b45309 !important; text-shadow:none !important; }
html[data-theme="daylight"] :is(.stat-card,.section-card,.hero-banner,.auth-card,.login-card,.modal,.plan-card,.checklist-card,.daily-todo-card,.feature-card,.brokerage-strip,.trade-detail-card,.equity-preview) :is([style*="color:#4ade80" i],[style*="color:#86efac" i],[style*="color:#34d399" i],[style*="color:#6ee7b7" i],[style*="color:#22c55e" i]){ color:#16a34a !important; text-shadow:none !important; }
html[data-theme="daylight"] :is(.stat-card,.section-card,.hero-banner,.auth-card,.login-card,.modal,.plan-card,.checklist-card,.daily-todo-card,.feature-card,.brokerage-strip,.trade-detail-card,.equity-preview) :is([style*="color:#f87171" i],[style*="color:#fca5a5" i],[style*="color:#fb7185" i],[style*="color:#fda4af" i]){ color:#dc2626 !important; text-shadow:none !important; }
html[data-theme="daylight"] :is(.stat-card,.section-card,.hero-banner,.auth-card,.login-card,.modal,.plan-card,.checklist-card,.daily-todo-card,.feature-card,.brokerage-strip,.trade-detail-card,.equity-preview) :is([style*="color:#fb923c" i],[style*="color:#fdba74" i]){ color:#c2410c !important; text-shadow:none !important; }
html[data-theme="daylight"] :is(.stat-card,.section-card,.hero-banner,.auth-card,.login-card,.modal,.plan-card,.checklist-card,.daily-todo-card,.feature-card,.brokerage-strip,.trade-detail-card,.equity-preview) :is([style*="color:#22d3ee" i],[style*="color:#67e8f9" i]){ color:#0891b2 !important; text-shadow:none !important; }
/* class-based light accent text on white */
html[data-theme="daylight"] body .nav-btn.active{ color:#4f46e5 !important; }

/* ============================================================================
   DAY MODE v3 — STRONG global text contrast (kills the faded / "mangya" look).
   Targets only GENERIC text classes that live on white surfaces. The dark
   "terminal" widgets use namespaced classes (.ecal-* / .eq-* / .sc-* / .dss-*)
   which are NOT matched here, so their light-on-dark text stays correct.
   ============================================================================ */
/* muted / label / secondary text -> dark, clearly legible (was faint grey) */
html[data-theme="daylight"] body :is(
  .lbl,.sub,.muted,.hint,.note,.meta,.small,.tiny,.caption,.subtitle,.sublabel,
  .stat-label,.stat-sub,.stat-meta,.card-sub,.card-label,.field-label,.form-hint,
  .hp-lbl,.s-sub,.sprev,.desc,.subtext,.dim,.faint,.helper,.tag-sub
){ color:#454c5a !important; text-shadow:none !important; }
/* primary values / numbers / titles -> near-black, crisp */
html[data-theme="daylight"] body :is(
  .val,.stat-val,.stat-num,.num,.big,.value,.hp-val,.card-val,.kpi-val,.amount,
  .total,.metric-val,.figure,.headline,.card-title,.panel-title,.h,.title
){ color:#0e1013 !important; text-shadow:none !important; }
/* generic body copy in the pure-white stat/section/plan cards -> solid dark
   (covers untagged <p>/<span>/<div>). NON-important so coloured P&L/badges keep
   their colour. Scoped to cards that never contain a dark terminal widget. */
html[data-theme="daylight"] body :is(.section-card,.stat-card,.plan-card,.modal,.daily-todo-card,.checklist-card,.trade-detail-card) :is(p,span,div,li,td,th,small,label,h1,h2,h3,h4,h5,h6){ color:#1b1f27; }
/* links / light-violet accents on white -> readable deep violet (forgot-password,
   auth switch, in-card links were too light) */
html[data-theme="daylight"] body :is(.auth-card a,.auth-overlay a,.auth-forgot-link,.auth-link,.auth-switch-link,.link,.text-link,.inline-link){ color:#4f46e5 !important; }

/* ============================================================================
   DAY THEME — PERFECT WHITE (force-based contrast engine, the authoritative last
   word). The app hardcodes light text everywhere, so a patch-by-patch white
   theme always leaves faded spots. Instead: FORCE every text element dark, then
   re-apply the semantic colours (P&L green/red, accent violet, amber, cyan) by
   their colour value + known classes so meaning is preserved. Result: nothing
   on the white theme can read faded. Scoped entirely to [data-theme="daylight"].
   ============================================================================ */
/* 0. clean light base + crisp font */
html[data-theme="daylight"]{
  --hq-bg:#f3f5f9; --hq-surface-1:#ffffff; --hq-surface-2:#ffffff; --hq-surface-3:#eef1f7;
  --hq-border:#e2e6ef; --hq-border-2:#d2d8e4;
  --hq-text-1:#0d1017; --hq-text-2:#272d3a; --hq-text-3:#454c5c; --hq-text-4:#5e6678;
}
html[data-theme="daylight"] body{ background:#f3f5f9 !important; color:#0d1017 !important; font-family:'Inter','Space Grotesk',system-ui,-apple-system,sans-serif !important; }
/* 1. whiten any remaining dark surface, incl. the dark "terminal" widgets */
html[data-theme="daylight"] body :is([class*="eq-"],[class*="ecal-"],[class*="sc-"],[class*="dss"],[class*="-card"],[class*="-panel"],[class*="-tile"]){ background-color:#ffffff !important; background-image:none !important; border-color:#e2e6ef !important; }
/* 2. FORCE all text dark (catches every hardcoded light colour, any class) */
html[data-theme="daylight"] body :not(svg):not(path):not(canvas):not(img){ color:#1b212c !important; text-shadow:none !important; }
/* 3a. headings / values / numbers / names -> near-black */
html[data-theme="daylight"] body :is(h1,h2,h3,h4,h5,.section-title,.stat-title,.stat-val,.val,.num,.value,.amount,[class*="-title"],[class*="-val"],[class*="-num"],[class*="-name"],[class*="-score"],[class*="-pct"]){ color:#0d1017 !important; }
/* 3b. muted / labels / hints -> strong readable grey (NOT faint) */
html[data-theme="daylight"] body :is(.lbl,.sub,.muted,.hint,.meta,.note,.desc,small,[class*="-lbl"],[class*="-sub"],[class*="-muted"],[class*="-label"],[class*="-meta"],[class*="-hint"],[class*="-desc"],[class*="-tag"]){ color:#48505f !important; }
/* 4. RE-APPLY semantic colours (win via higher specificity — last + class-level) */
html[data-theme="daylight"] body :is([style*="22c55e" i],[style*="4ade80" i],[style*="34d399" i],[style*="86efac" i],[style*="16a34a" i],[style*="22a85a" i],[style*="6ee7b7" i]){ color:#15803d !important; }
html[data-theme="daylight"] body :is([style*="ef4444" i],[style*="f87171" i],[style*="fca5a5" i],[style*="fb7185" i],[style*="dc2626" i],[style*="e0524a" i]){ color:#dc2626 !important; }
html[data-theme="daylight"] body :is([style*="7c5cfc" i],[style*="a78bfa" i],[style*="c4b5fd" i],[style*="9333ea" i],[style*="a855f7" i],[style*="6d28d9" i]){ color:#4f46e5 !important; }
html[data-theme="daylight"] body :is([style*="fbbf24" i],[style*="f59e0b" i],[style*="ffe08a" i],[style*="e7a000" i],[style*="d97706" i]){ color:#b45309 !important; }
html[data-theme="daylight"] body :is([style*="22d3ee" i],[style*="06b6d4" i],[style*="38bdf8" i]){ color:#0e7490 !important; }
html[data-theme="daylight"] body :is([style*="ec4899" i],[style*="f472b6" i]){ color:#be185d !important; }
html[data-theme="daylight"] body :is(.pnl-pos,.grade-A,.badge-green,.pos,.win,.up,.profit){ color:#15803d !important; }
html[data-theme="daylight"] body :is(.pnl-neg,.grade-D,.badge-red,.neg,.loss,.down){ color:#dc2626 !important; }
html[data-theme="daylight"] body :is(a,.link,.text-link,.accent,.nav-btn.active){ color:#4f46e5 !important; }
/* 5. buttons keep white text on their coloured fill */
html[data-theme="daylight"] body :is(.btn-primary,.auth-btn,.landing-btn-primary,.landing-btn-primary-lg,.send,.pbtn:not(.ghost)){ color:#ffffff !important; }
html[data-theme="daylight"] body :is(.btn-primary,.auth-btn) :is(span,b,i,div){ color:#ffffff !important; }

/* ============================================================================
   DAY THEME — DARK ZONES. A few components are DESIGNED dark (the live equity
   widget, the Monte-Carlo hero/result/empty panels, the plan commit banners).
   The force-dark engine above washes them out, so re-assert dark surface + light
   text here so they read cleanly as deliberate dark accents on the white theme.
   ============================================================================ */
html[data-theme="daylight"] body :is(.equity-preview,.plans-today-banner,.plan-lock-msg,.mc-hero,.mc-empty,.mc-chart-card){
  background-color:#10111f !important; border-color:#28284258 !important; box-shadow:0 6px 22px rgba(16,24,40,0.14) !important;
}
html[data-theme="daylight"] body :is(.equity-preview,.plans-today-banner,.plan-lock-msg,.mc-hero,.mc-empty,.mc-chart-card) *:not(svg):not(path):not(canvas){ color:#e9edf7 !important; text-shadow:none !important; }
html[data-theme="daylight"] body :is(.equity-preview,.plans-today-banner,.plan-lock-msg,.mc-hero,.mc-empty,.mc-chart-card) :is(.lbl,.sub,.muted,small,[class*="-sub"],[class*="-lbl"],[class*="-meta"],[class*="-mut"]){ color:#9aa3b8 !important; }
/* coloured values inside dark zones -> LIGHT semantic (readable on dark) */
html[data-theme="daylight"] body :is(.equity-preview,.mc-hero,.mc-empty,.mc-chart-card) :is([style*="22c55e" i],[style*="4ade80" i],[style*="34d399" i],[style*="16a34a" i],[style*="86efac" i]){ color:#4ade80 !important; }
html[data-theme="daylight"] body :is(.equity-preview,.mc-hero,.mc-empty,.mc-chart-card) :is([style*="ef4444" i],[style*="f87171" i],[style*="dc2626" i]){ color:#fb7185 !important; }
html[data-theme="daylight"] body :is(.equity-preview,.mc-hero,.mc-empty,.mc-chart-card) :is([style*="7c5cfc" i],[style*="a78bfa" i],[style*="c4b5fd" i]){ color:#c4b5fd !important; }
/* Monte-Carlo preset pills: dark, light label; active = violet highlight */
html[data-theme="daylight"] body .mc-preset{ background:#15151f !important; border-color:#2a2a3e !important; color:#c7c7da !important; }
html[data-theme="daylight"] body .mc-preset.active{ background:rgba(79,70,229,0.16) !important; border-color:#4f46e5 !important; color:#4f46e5 !important; }

/* ============================================================================
   DAYLIGHT — remaining dark inline/class elements -> light. Form inputs (incl.
   inline dark-gradient ones like #gtTarget), the sidebar user pill, and the
   tcp/save buttons were still dark on the white theme. Made them light & crisp.
   ============================================================================ */
/* every form field -> white (catches inline dark-gradient inputs) */
html[data-theme="daylight"] body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
html[data-theme="daylight"] body select, html[data-theme="daylight"] body textarea{
  background:#ffffff !important; background-image:none !important; border:1px solid #d2d8e4 !important; color:#0d1017 !important; box-shadow:inset 0 1px 2px rgba(16,24,40,0.06) !important;
}
html[data-theme="daylight"] body input::placeholder, html[data-theme="daylight"] body textarea::placeholder{ color:#9aa0ad !important; }
/* sidebar user pill (was a dark card with faded email) */
html[data-theme="daylight"] body .user-pill{ background:#f1f3f8 !important; border-color:#e3e7f0 !important; box-shadow:0 1px 2px rgba(16,24,40,0.05) !important; }
html[data-theme="daylight"] body .user-pill .user-name{ color:#0d1017 !important; }
html[data-theme="daylight"] body .user-pill .user-email{ color:#5a6173 !important; }
html[data-theme="daylight"] body .user-pill .logout-btn{ background:#e7eaf1 !important; color:#454c5c !important; border:1px solid #d2d8e4 !important; }
/* sidebar daily-limit bar track -> light */
html[data-theme="daylight"] body #sidebarLimitBar{ background:#e1e5ee !important; }
/* tcp tool + goal Save buttons -> indigo accent, white text */
html[data-theme="daylight"] body .tcp-btn, html[data-theme="daylight"] body #gtSave{ background:linear-gradient(180deg,#6366f1,#4f46e5) !important; color:#ffffff !important; border:1px solid #4f46e5 !important; box-shadow:0 4px 12px rgba(79,70,229,0.25) !important; }
html[data-theme="daylight"] body .tcp-btn *, html[data-theme="daylight"] body #gtSave *{ color:#ffffff !important; }
/* white theme: the silver metallic LIVE-EQUITY number is invisible on white →
   render it as a rich GOLD gradient (premium + clearly visible). */
html[data-theme="daylight"] .hero-banner .hero-stat .val.eq-silver-4k,
html[data-theme="daylight"] body #heroEquity,
html[data-theme="daylight"] body #heroEquity.eq-silver-4k{
  background:linear-gradient(180deg,#f3d27a 0%,#d9b13e 26%,#b8860b 50%,#e8c75e 74%,#a87f0a 100%) !important;
  background-size:200% 100% !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,0.6)) drop-shadow(0 2px 5px rgba(140,100,10,0.30)) !important;
}