/* v1294 — Smart Insights Phase 2 workspace shell + reset-order fix */
.phase4-smart-insights-page.active{display:block;}
.smart-insights-workspace-v2{display:grid;gap:16px;max-width:100%;}
.smart-insights-hero-v2{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;border-radius:20px;}
.smart-insights-hero-copy{min-width:0;}
.smart-insights-hero-copy h3,.smart-insights-section-head h3{margin:2px 0 0;color:var(--accent-text);font-size:1.02rem;font-weight:850;letter-spacing:-.02em;}
.smart-insights-hero-copy p{margin:6px 0 0;max-width:720px;color:var(--muted);font-size:.74rem;line-height:1.45;}
.smart-insights-hero-actions{display:grid;gap:8px;justify-items:end;align-content:center;flex-shrink:0;}
.smart-insights-reset-order{border:1px solid var(--line);background:var(--panel);color:var(--accent-text);border-radius:999px;padding:7px 12px;font:inherit;font-size:.66rem;font-weight:750;cursor:pointer;box-shadow:0 1px 0 rgba(255,255,255,.7) inset;}
.smart-insights-reset-order:hover{background:var(--panel-2);border-color:rgba(99,102,241,.25);}
.smart-insights-exec-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
.smart-insights-signal{position:relative;overflow:hidden;min-width:0;padding:14px 15px;border-radius:18px;display:grid;gap:4px;}
.smart-insights-signal::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#cbd5e1,#64748b,#334155);}
.smart-insights-signal[data-si-signal="forecast"]::before{background:linear-gradient(90deg,#86efac,#16a34a,#166534);}
.smart-insights-signal[data-si-signal="budget"]::before{background:linear-gradient(90deg,#fcd34d,#f59e0b,#b45309);}
.smart-insights-signal[data-si-signal="subscriptions"]::before{background:linear-gradient(90deg,#fb7185,#f97316,#b45309);}
.smart-insights-signal[data-si-signal="actions"]::before{background:linear-gradient(90deg,#c4b5fd,#8b5cf6,#475569);}
.si-signal-label{color:var(--muted);font-size:.57rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase;}
.si-signal-value{color:var(--accent-text);font-family:var(--font-mono);font-size:1.04rem;font-weight:900;line-height:1.12;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.si-signal-sub{color:var(--muted);font-size:.63rem;font-weight:600;line-height:1.35;min-height:1.35em;}
.smart-insights-briefing{padding:16px 18px;border-radius:20px;display:grid;gap:12px;}
.smart-insights-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;}
.smart-insights-section-pill{display:inline-flex;align-items:center;justify-content:center;min-height:24px;padding:4px 10px;border-radius:999px;border:1px solid var(--line);background:var(--panel-2);color:var(--muted);font-size:.61rem;font-weight:750;white-space:nowrap;}
.smart-insights-briefing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
.si-briefing-card{min-width:0;padding:12px 13px;border-radius:14px;border:1px solid rgba(100,116,139,.16);background:rgba(255,255,255,.64);box-shadow:0 7px 16px rgba(30,64,120,.045);display:grid;gap:4px;}
.si-briefing-card span{color:var(--muted);font-size:.57rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase;}
.si-briefing-card strong{color:var(--accent-text);font-size:.82rem;font-weight:850;line-height:1.22;overflow-wrap:anywhere;}
.si-briefing-card small{color:var(--muted);font-size:.62rem;line-height:1.35;font-weight:600;}
.smart-insights-grid-shell{display:grid;gap:10px;}
.smart-insights-grid-head{padding:0 2px;}
.smart-insights-body{padding:0;background:transparent;overflow:visible;}
.smart-insights-body #insightGrid,
#insightGrid.smart-insights-adaptive-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important;align-items:stretch;}
.smart-insights-body #insightGrid > [data-insight-key],
#insightGrid.smart-insights-adaptive-grid > [data-insight-key]{grid-column:auto!important;min-width:0;min-height:100%;}
.smart-insights-body #insightGrid[data-ig-custom] > [data-insight-key],
#insightGrid.smart-insights-adaptive-grid[data-ig-custom] > [data-insight-key]{order:initial!important;}
.smart-insights-body #insightGrid .ig-combined-card{height:100%;}
.smart-insights-body #insightGrid .ig-sub-section{padding:12px;}
@media (max-width:1280px){.smart-insights-exec-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.smart-insights-body #insightGrid,#insightGrid.smart-insights-adaptive-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}}
@media (max-width:780px){.smart-insights-hero-v2,.smart-insights-section-head{flex-direction:column;align-items:stretch;}.smart-insights-hero-actions{justify-items:start;}.smart-insights-exec-grid,.smart-insights-briefing-grid,.smart-insights-body #insightGrid,#insightGrid.smart-insights-adaptive-grid{grid-template-columns:1fr!important;}.smart-insights-section-pill{width:fit-content;}.si-signal-value{white-space:normal;}}

/* === Smart Insights Dark Mode Full Rework v1333 ===
   Scope: Smart Insights tab only. This fixes the light KPI tiles, briefing cards,
   analytical cards, trend panels, dropdowns, popups, and internal metric tiles. */

html[data-theme="dark"] [data-view="smart-insights"] {
  color-scheme: dark;
  --si-bg: #070b14;
  --si-card: #101827;
  --si-card-2: #142033;
  --si-card-3: #17243a;
  --si-border: rgba(148, 163, 184, 0.24);
  --si-border-soft: rgba(148, 163, 184, 0.14);
  --si-text: #eaf1fb;
  --si-text-strong: #f8fafc;
  --si-muted: #a8b6ca;
  --si-muted-2: #7f8da3;
  --si-green: #86efac;
  --si-red: #fca5a5;
  --si-amber: #fcd34d;
  --si-purple: #a78bfa;
  background: #070b14 !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-workspace-v2,
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-grid-shell,
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-card-body,
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-body {
  background: transparent !important;
}

/* Top KPI tiles + briefing panel */
html[data-theme="dark"] [data-view="smart-insights"] .ui-3d-panel,
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-signal,
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-briefing,
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-section-pill {
  background:
    radial-gradient(circle at 100% 0%, rgba(96, 165, 250, 0.10), transparent 34%),
    linear-gradient(145deg, rgba(20, 32, 51, 0.98), rgba(10, 15, 26, 0.98)) !important;
  border-color: var(--si-border) !important;
  color: var(--si-text) !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .si-briefing-card {
  background: rgba(15, 23, 42, 0.92) !important;
  border-color: var(--si-border-soft) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.035), 0 8px 20px rgba(0,0,0,0.18) !important;
}

/* All Smart Insight analytical cards */
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid > .ui-3d-insight,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid > .insight-card,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid > .ui-3d-panel,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .ig-sub-section {
  background:
    radial-gradient(circle at 94% -12%, rgba(148, 163, 184, 0.12), transparent 38%),
    linear-gradient(145deg, #101827 0%, #0d1423 58%, #080d18 100%) !important;
  border-color: var(--si-border) !important;
  color: var(--si-text) !important;
  box-shadow: 0 20px 48px rgba(0,0,0,0.38), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] #insightGrid > .forecast-card.ui-3d-insight {
  background:
    radial-gradient(circle at 96% -12%, rgba(16, 185, 129, 0.18), transparent 38%),
    linear-gradient(145deg, #10251f 0%, #0d1724 58%, #080d18 100%) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] #insightGrid > .mix-behavior-card.ui-3d-insight,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .subscription-burden-card {
  background:
    radial-gradient(circle at 96% -12%, rgba(139, 92, 246, 0.18), transparent 38%),
    linear-gradient(145deg, #151a35 0%, #0d1423 58%, #080d18 100%) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] #insightGrid > .reallocation-card.ui-3d-insight {
  background:
    radial-gradient(circle at 96% -12%, rgba(245, 158, 11, 0.16), transparent 38%),
    linear-gradient(145deg, #231b11 0%, #0d1423 58%, #080d18 100%) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] #insightGrid > .burn-subs-card.ui-3d-insight {
  background:
    radial-gradient(circle at 96% -12%, rgba(249, 115, 22, 0.16), transparent 38%),
    linear-gradient(145deg, #251717 0%, #0d1423 58%, #080d18 100%) !important;
}

/* Typography contrast */
html[data-theme="dark"] [data-view="smart-insights"] h1,
html[data-theme="dark"] [data-view="smart-insights"] h2,
html[data-theme="dark"] [data-view="smart-insights"] h3,
html[data-theme="dark"] [data-view="smart-insights"] h4,
html[data-theme="dark"] [data-view="smart-insights"] strong,
html[data-theme="dark"] [data-view="smart-insights"] .si-signal-value,
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-section-head h3,
html[data-theme="dark"] [data-view="smart-insights"] .insight-main,
html[data-theme="dark"] [data-view="smart-insights"] .guidance-hero,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-metric strong,
html[data-theme="dark"] [data-view="smart-insights"] .advisor-item-main,
html[data-theme="dark"] [data-view="smart-insights"] .burn-stat-value,
html[data-theme="dark"] [data-view="smart-insights"] .subscription-burden-main,
html[data-theme="dark"] [data-view="smart-insights"] .subscription-burden-metric strong,
html[data-theme="dark"] [data-view="smart-insights"] .behavior-hero-main,
html[data-theme="dark"] [data-view="smart-insights"] .tile-copy,
html[data-theme="dark"] [data-view="smart-insights"] .mix-label,
html[data-theme="dark"] [data-view="smart-insights"] .mix-value {
  color: var(--si-text-strong) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .si-signal-label,
html[data-theme="dark"] [data-view="smart-insights"] .si-signal-sub,
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-kicker,
html[data-theme="dark"] [data-view="smart-insights"] .si-briefing-card span,
html[data-theme="dark"] [data-view="smart-insights"] .si-briefing-card small,
html[data-theme="dark"] [data-view="smart-insights"] .logic-kicker,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-metric-label,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-metric small,
html[data-theme="dark"] [data-view="smart-insights"] .tile-label,
html[data-theme="dark"] [data-view="smart-insights"] .advisor-category,
html[data-theme="dark"] [data-view="smart-insights"] .advisor-eur,
html[data-theme="dark"] [data-view="smart-insights"] .advisor-confidence,
html[data-theme="dark"] [data-view="smart-insights"] .burn-stat-label,
html[data-theme="dark"] [data-view="smart-insights"] .burn-stat-sub,
html[data-theme="dark"] [data-view="smart-insights"] .subscription-burden-sub,
html[data-theme="dark"] [data-view="smart-insights"] .subscription-burden-metric span,
html[data-theme="dark"] [data-view="smart-insights"] .subscription-burden-metric small,
html[data-theme="dark"] [data-view="smart-insights"] .behavior-hero-sub,
html[data-theme="dark"] [data-view="smart-insights"] .intel-behavior-kicker,
html[data-theme="dark"] [data-view="smart-insights"] .evolution-chart-title,
html[data-theme="dark"] [data-view="smart-insights"] .evolution-legend-item {
  color: var(--si-muted) !important;
}

/* Internal tiles/cards that were still light */
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .forecast-metric,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .forecast-summary-note,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .forecast-driver-row,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .guidance-tile,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .behavior-guidance-tile,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .advisor-item,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .burn-state-row,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .burn-stat,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .subscription-burden-metric,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .reallocation-hero,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .guidance-track-card,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .behavior-hero,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .burn-interpretation {
  background: rgba(15, 23, 42, 0.86) !important;
  border-color: var(--si-border) !important;
  color: var(--si-text) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.035) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .guidance-tile.good,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .behavior-guidance-tile.good {
  background: rgba(20, 83, 45, 0.20) !important;
  border-color: rgba(134, 239, 172, 0.35) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .guidance-tile.warn,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .behavior-guidance-tile.warn {
  background: rgba(146, 64, 14, 0.22) !important;
  border-color: rgba(252, 211, 77, 0.34) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .guidance-tile.bad,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .behavior-guidance-tile.bad {
  background: rgba(127, 29, 29, 0.24) !important;
  border-color: rgba(252, 165, 165, 0.35) !important;
}

/* Trends charts: remove white chart blocks and keep dropdowns dark */
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .evolution-card-body,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .evolution-chart-stack,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .evolution-chart-block,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .evolution-chart-canvas,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .evolution-svg,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .evolution-series {
  background: rgba(15, 23, 42, 0.88) !important;
  border-color: var(--si-border) !important;
  color: var(--si-text) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .evolution-legend,
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid .evolution-legend-item {
  background: rgba(30, 41, 59, 0.92) !important;
  border-color: var(--si-border-soft) !important;
  color: var(--si-muted) !important;
}

/* Dropdowns and popups */
html[data-theme="dark"] [data-view="smart-insights"] select,
html[data-theme="dark"] [data-view="smart-insights"] .filter-dropdown-trigger,
html[data-theme="dark"] [data-view="smart-insights"] .filter-dropdown-menu,
html[data-theme="dark"] [data-view="smart-insights"] .filter-dropdown-option,
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-reset-order,
html[data-theme="dark"] [data-view="smart-insights"] .tiny-btn,
html[data-theme="dark"] [data-view="smart-insights"] .ghost-btn,
html[data-theme="dark"] [data-view="smart-insights"] .feature-action-btn {
  background: #111827 !important;
  color: var(--si-text) !important;
  border-color: var(--si-border) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .filter-dropdown-option:hover,
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-reset-order:hover,
html[data-theme="dark"] [data-view="smart-insights"] .tiny-btn:hover,
html[data-theme="dark"] [data-view="smart-insights"] .ghost-btn:hover {
  background: #1e293b !important;
  color: #f8fafc !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .inline-info-tooltip,
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-reset-tooltip,
html[data-theme="dark"] [data-view="smart-insights"] .evolution-chart-tooltip {
  background: #0f172a !important;
  color: #eaf1fb !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  box-shadow: 0 18px 46px rgba(0,0,0,0.48) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .inline-info-trigger {
  background: #1e293b !important;
  color: #dbeafe !important;
  border-color: rgba(148, 163, 184, 0.32) !important;
}

/* Badges/chips */
html[data-theme="dark"] [data-view="smart-insights"] .tone-chip,
html[data-theme="dark"] [data-view="smart-insights"] .behavior-state-badge,
html[data-theme="dark"] [data-view="smart-insights"] .burn-state-badge,
html[data-theme="dark"] [data-view="smart-insights"] .subscription-burden-badge,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-badge,
html[data-theme="dark"] [data-view="smart-insights"] .note-ac-chip-tab,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-driver-badge,
html[data-theme="dark"] [data-view="smart-insights"] .behavior-signal-chip {
  background: rgba(15, 23, 42, 0.92) !important;
  border-color: var(--si-border) !important;
  color: var(--si-text) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .income-positive,
html[data-theme="dark"] [data-view="smart-insights"] .value-positive,
html[data-theme="dark"] [data-view="smart-insights"] .good,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-metric.good strong {
  color: var(--si-green) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .value-negative,
html[data-theme="dark"] [data-view="smart-insights"] .bad,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-metric.bad strong,
html[data-theme="dark"] [data-view="smart-insights"] .advisor-item.trim .advisor-percent {
  color: var(--si-red) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .warn,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-metric.warn strong {
  color: var(--si-amber) !important;
}

/* Progress bars / tracks */
html[data-theme="dark"] [data-view="smart-insights"] .mix-track,
html[data-theme="dark"] [data-view="smart-insights"] .guidance-track,
html[data-theme="dark"] [data-view="smart-insights"] .burn-triangle-rail,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-bar,
html[data-theme="dark"] [data-view="smart-insights"] .progress-track {
  background: rgba(203, 213, 225, 0.18) !important;
}

/* Force any leftover white/light analytical blocks inside Smart Insights to dark surfaces. */
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid [style*="background: #fff"],
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid [style*="background:#fff"],
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid [style*="background: white"],
html[data-theme="dark"] [data-view="smart-insights"] #insightGrid [style*="background:white"] {
  background: rgba(15, 23, 42, 0.90) !important;
  color: var(--si-text) !important;
  border-color: var(--si-border) !important;
}


/* === Monthly Forecast / WHY tile dark-mode correction v1334 ===
   Fixes the remaining light "WHY / AT LOCK" tile inside Monthly Forecast. */
html[data-theme="dark"] [data-view="smart-insights"] .forecast-why,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-why-block,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-reason-block,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-lock-breakdown,
html[data-theme="dark"] [data-view="smart-insights"] .locked-forecast-why,
html[data-theme="dark"] [data-view="smart-insights"] .locked-breakdown-card,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"],
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] {
  background:
    radial-gradient(circle at 100% 0%, rgba(134, 239, 172, 0.06), transparent 36%),
    linear-gradient(145deg, rgba(15, 23, 42, 0.94), rgba(8, 13, 24, 0.96)) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  color: #eaf1fb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.035) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] h4,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] h5,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] strong,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] h4,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] h5,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] strong {
  color: #f8fafc !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .logic-kicker,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .tile-label,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] small,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .logic-kicker,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .tile-label,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] small {
  color: #a8b6ca !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .forecast-driver-row,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .forecast-breakdown-row,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .lock-row,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .forecast-driver-row,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .forecast-breakdown-row,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .lock-row {
  background: rgba(30, 41, 59, 0.82) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  color: #eaf1fb !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .forecast-driver-row:hover,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .forecast-breakdown-row:hover,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .lock-row:hover,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .forecast-driver-row:hover,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .forecast-breakdown-row:hover,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .lock-row:hover {
  background: rgba(38, 52, 75, 0.92) !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .forecast-driver-label,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .forecast-breakdown-label,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .lock-row-label,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .forecast-driver-label,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .forecast-breakdown-label,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .lock-row-label {
  color: #f1f5f9 !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .forecast-driver-value,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .forecast-breakdown-value,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .lock-row-value,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .forecast-driver-value,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .forecast-breakdown-value,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .lock-row-value {
  color: #eaf1fb !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .forecast-driver-percent,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .forecast-breakdown-percent,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .lock-row-percent,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .forecast-driver-percent,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .forecast-breakdown-percent,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .lock-row-percent {
  color: #a8b6ca !important;
}

html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .forecast-driver-badge,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="why"] .lock-row-badge,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .forecast-driver-badge,
html[data-theme="dark"] [data-view="smart-insights"] .forecast-card [class*="lock-breakdown"] .lock-row-badge {
  background: rgba(16, 185, 129, 0.10) !important;
  border-color: rgba(134, 239, 172, 0.34) !important;
  color: #86efac !important;
}


/* === v1335 exact fix: Smart Insights Monthly Forecast WHY / AT LOCK block ===
   The actual element is .forecast-driver-box, not a "*why*" class. */
body.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-box,
body.dark-mode #insightGrid .forecast-card .forecast-driver-box,
html[data-theme="dark"] .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-box,
html[data-theme="dark"] #insightGrid .forecast-card .forecast-driver-box,
.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-box,
.dark-mode #insightGrid .forecast-card .forecast-driver-box {
  margin-top: 10px !important;
  padding: 14px 16px !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(134,239,172,0.055), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,0.98) 0%, rgba(9,14,25,0.98) 100%) !important;
  border: 1px solid rgba(148,163,184,0.26) !important;
  color: #eaf1fb !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    0 10px 24px rgba(0,0,0,0.22) !important;
}

body.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-box .logic-kicker,
body.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-head,
html[data-theme="dark"] .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-box .logic-kicker,
html[data-theme="dark"] .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-head,
.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-box .logic-kicker,
.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-head {
  color: #8fa3bc !important;
  opacity: 1 !important;
}

body.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-list,
html[data-theme="dark"] .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-list,
.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-list {
  display: grid !important;
  gap: 8px !important;
}

body.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-row,
body.dark-mode #insightGrid .forecast-card .forecast-driver-row,
html[data-theme="dark"] .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-row,
html[data-theme="dark"] #insightGrid .forecast-card .forecast-driver-row,
.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-row,
.dark-mode #insightGrid .forecast-card .forecast-driver-row {
  min-height: 38px !important;
  padding: 8px 12px !important;
  border-radius: 12px !important;
  background: rgba(30,41,59,0.88) !important;
  border: 1px solid rgba(148,163,184,0.20) !important;
  color: #f1f5f9 !important;
}

body.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-label,
html[data-theme="dark"] .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-label,
.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-label {
  color: #f8fafc !important;
  font-weight: 700 !important;
}

body.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-amount,
body.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-share,
html[data-theme="dark"] .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-amount,
html[data-theme="dark"] .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-share,
.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-amount,
.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-share {
  color: #eaf1fb !important;
}

body.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-share,
html[data-theme="dark"] .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-share,
.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-share {
  color: #a8b6ca !important;
}

body.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-badge,
html[data-theme="dark"] .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-badge,
.dark-mode .smart-insights-card-body #insightGrid .forecast-card .forecast-driver-badge {
  background: rgba(16,185,129,0.12) !important;
  border: 1px solid rgba(134,239,172,0.38) !important;
  color: #86efac !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05) !important;
}


/* === v1336 exact fix: Adjustment Advisor dark-mode chip + rank cleanup ===
   Fixes the light percentage chips and the inconsistent #2/#3 rank badges. */
body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-item,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-item,
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-item {
  background:
    radial-gradient(circle at 100% 0%, rgba(96,165,250,0.055), transparent 36%),
    linear-gradient(145deg, rgba(15,23,42,0.96), rgba(9,14,25,0.98)) !important;
  border: 1px solid rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.035), 0 10px 24px rgba(0,0,0,0.20) !important;
}

body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-rank,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-rank,
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-rank {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(139,92,246,0.16) !important;
  border: 1px solid rgba(167,139,250,0.34) !important;
  color: #a78bfa !important;
  font-weight: 800 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05) !important;
}

body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-item:first-child .advisor-rank,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-item:first-child .advisor-rank,
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-item:first-child .advisor-rank {
  background: rgba(248,113,113,0.14) !important;
  border-color: rgba(248,113,113,0.34) !important;
  color: #fca5a5 !important;
}

body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-current,
body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-target,
body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-rate-current,
body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-rate-target,
body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-pill,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-current,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-target,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-rate-current,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-rate-target,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-pill,
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-current,
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-target,
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-rate-current,
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-rate-target,
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-pill {
  min-width: 64px !important;
  height: 30px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(15,23,42,0.92) !important;
  border: 1px solid rgba(148,163,184,0.28) !important;
  color: #f8fafc !important;
  font-weight: 800 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-target,
body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-rate-target,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-target,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-rate-target,
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-target,
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-rate-target {
  background: rgba(127,29,29,0.28) !important;
  border-color: rgba(248,113,113,0.42) !important;
  color: #fca5a5 !important;
}

body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-arrow,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-arrow,
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-arrow {
  color: #9ca3af !important;
  opacity: 1 !important;
}

body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-impact,
body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-confidence,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-impact,
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-confidence,
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-impact,
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-confidence {
  background: rgba(15,23,42,0.72) !important;
  border: 1px solid rgba(148,163,184,0.26) !important;
  color: #cbd5e1 !important;
  border-radius: 999px !important;
}

/* Catch the actual generated percentage/badge spans even if class names change. */
body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-item span[class*="current"],
body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-item span[class*="target"],
body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-item span[class*="rate"],
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-item span[class*="current"],
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-item span[class*="target"],
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-item span[class*="rate"],
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-item span[class*="current"],
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-item span[class*="target"],
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-item span[class*="rate"] {
  background-color: rgba(15,23,42,0.92) !important;
  border-color: rgba(148,163,184,0.28) !important;
  color: #f8fafc !important;
}

body.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-item span[class*="target"],
html[data-theme="dark"] [data-view="smart-insights"] .reallocation-card .advisor-item span[class*="target"],
.dark-mode [data-view="smart-insights"] .reallocation-card .advisor-item span[class*="target"] {
  background-color: rgba(127,29,29,0.28) !important;
  border-color: rgba(248,113,113,0.42) !important;
  color: #fca5a5 !important;
}


/* === v1337 Achievements tab dark-mode rework ===
   Fixes the remaining light/grey Achievement surfaces shown in screenshots:
   KPI cards, check-in panel, progress stat tiles, recent achievements,
   targets, completed badges, insight strip, needs-attention panel, history. */

/* Page + shared Achievement surface */
body.dark-mode [data-view="achievements"],
html[data-theme="dark"] [data-view="achievements"],
.dark-mode [data-view="achievements"] {
  color-scheme: dark;
  --ach-dark-bg: #070b14;
  --ach-card: #101827;
  --ach-card-2: #142033;
  --ach-card-3: #18243a;
  --ach-border: rgba(148,163,184,0.24);
  --ach-border-soft: rgba(148,163,184,0.14);
  --ach-text: #eaf1fb;
  --ach-strong: #f8fafc;
  --ach-muted: #a8b6ca;
  --ach-muted-2: #7f8da3;
  --ach-green: #86efac;
  --ach-red: #fca5a5;
  --ach-amber: #fcd34d;
  --ach-purple: #a78bfa;
  background: #070b14 !important;
  color: #eaf1fb !important;
}

/* Main cards and panels */
body.dark-mode [data-view="achievements"] .phase4-achievement-kpi,
body.dark-mode [data-view="achievements"] .phase4-achievement-panel,
body.dark-mode [data-view="achievements"] .phase4-achievement-insight-strip,
body.dark-mode [data-view="achievements"] .achievements-section,
body.dark-mode [data-view="achievements"] .financial-progress-card,
body.dark-mode [data-view="achievements"] .history-year-group,
body.dark-mode [data-view="achievements"] .checkin-card,
body.dark-mode [data-view="achievements"] .weekly-checkin-card,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-kpi,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-panel,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-insight-strip,
html[data-theme="dark"] [data-view="achievements"] .achievements-section,
html[data-theme="dark"] [data-view="achievements"] .financial-progress-card,
html[data-theme="dark"] [data-view="achievements"] .history-year-group,
html[data-theme="dark"] [data-view="achievements"] .checkin-card,
html[data-theme="dark"] [data-view="achievements"] .weekly-checkin-card,
.dark-mode [data-view="achievements"] .phase4-achievement-kpi,
.dark-mode [data-view="achievements"] .phase4-achievement-panel,
.dark-mode [data-view="achievements"] .phase4-achievement-insight-strip,
.dark-mode [data-view="achievements"] .achievements-section,
.dark-mode [data-view="achievements"] .financial-progress-card,
.dark-mode [data-view="achievements"] .history-year-group,
.dark-mode [data-view="achievements"] .checkin-card,
.dark-mode [data-view="achievements"] .weekly-checkin-card {
  background:
    radial-gradient(circle at 96% -10%, rgba(148,163,184,0.12), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
  box-shadow: 0 18px 44px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

/* Special top KPI tinting without light gradients */
body.dark-mode [data-view="achievements"] .phase4-achievement-kpi.primary,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-kpi.primary,
.dark-mode [data-view="achievements"] .phase4-achievement-kpi.primary {
  background:
    radial-gradient(circle at 100% 0%, rgba(16,185,129,0.16), transparent 38%),
    linear-gradient(145deg, #10251f, #0d1423 58%, #080d18) !important;
  border-color: rgba(16,185,129,0.34) !important;
}
body.dark-mode [data-view="achievements"] .phase4-achievement-kpi.reward,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-kpi.reward,
.dark-mode [data-view="achievements"] .phase4-achievement-kpi.reward {
  background:
    radial-gradient(circle at 100% 0%, rgba(249,115,22,0.16), transparent 38%),
    linear-gradient(145deg, #211714, #0d1423 58%, #080d18) !important;
  border-color: rgba(249,115,22,0.30) !important;
}

/* Typography */
body.dark-mode [data-view="achievements"] h1,
body.dark-mode [data-view="achievements"] h2,
body.dark-mode [data-view="achievements"] h3,
body.dark-mode [data-view="achievements"] h4,
body.dark-mode [data-view="achievements"] strong,
body.dark-mode [data-view="achievements"] .phase4-achievement-panel-head h3,
body.dark-mode [data-view="achievements"] .phase4-achievement-kpi-value,
body.dark-mode [data-view="achievements"] .phase4-achievement-recent-title,
body.dark-mode [data-view="achievements"] .badge-name,
body.dark-mode [data-view="achievements"] .completed-badge-title,
body.dark-mode [data-view="achievements"] .completed-badge-modal-tile-title,
html[data-theme="dark"] [data-view="achievements"] h1,
html[data-theme="dark"] [data-view="achievements"] h2,
html[data-theme="dark"] [data-view="achievements"] h3,
html[data-theme="dark"] [data-view="achievements"] h4,
html[data-theme="dark"] [data-view="achievements"] strong,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-panel-head h3,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-kpi-value,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-recent-title,
html[data-theme="dark"] [data-view="achievements"] .badge-name,
html[data-theme="dark"] [data-view="achievements"] .completed-badge-title,
html[data-theme="dark"] [data-view="achievements"] .completed-badge-modal-tile-title,
.dark-mode [data-view="achievements"] h1,
.dark-mode [data-view="achievements"] h2,
.dark-mode [data-view="achievements"] h3,
.dark-mode [data-view="achievements"] h4,
.dark-mode [data-view="achievements"] strong,
.dark-mode [data-view="achievements"] .phase4-achievement-panel-head h3,
.dark-mode [data-view="achievements"] .phase4-achievement-kpi-value,
.dark-mode [data-view="achievements"] .phase4-achievement-recent-title,
.dark-mode [data-view="achievements"] .badge-name,
.dark-mode [data-view="achievements"] .completed-badge-title,
.dark-mode [data-view="achievements"] .completed-badge-modal-tile-title {
  color: #f8fafc !important;
}

body.dark-mode [data-view="achievements"] p,
body.dark-mode [data-view="achievements"] span,
body.dark-mode [data-view="achievements"] small,
body.dark-mode [data-view="achievements"] label,
body.dark-mode [data-view="achievements"] .phase4-achievement-kpi-label,
body.dark-mode [data-view="achievements"] .phase4-achievement-kpi-sub,
body.dark-mode [data-view="achievements"] .phase4-achievement-panel-head p,
body.dark-mode [data-view="achievements"] .phase4-achievement-recent-sub,
body.dark-mode [data-view="achievements"] .badge-meta-label,
body.dark-mode [data-view="achievements"] .completed-badge-sub,
body.dark-mode [data-view="achievements"] .history-year-meta,
body.dark-mode [data-view="achievements"] .history-weekly-entry-sub,
html[data-theme="dark"] [data-view="achievements"] p,
html[data-theme="dark"] [data-view="achievements"] span,
html[data-theme="dark"] [data-view="achievements"] small,
html[data-theme="dark"] [data-view="achievements"] label,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-kpi-label,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-kpi-sub,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-panel-head p,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-recent-sub,
html[data-theme="dark"] [data-view="achievements"] .badge-meta-label,
html[data-theme="dark"] [data-view="achievements"] .completed-badge-sub,
html[data-theme="dark"] [data-view="achievements"] .history-year-meta,
html[data-theme="dark"] [data-view="achievements"] .history-weekly-entry-sub,
.dark-mode [data-view="achievements"] p,
.dark-mode [data-view="achievements"] span,
.dark-mode [data-view="achievements"] small,
.dark-mode [data-view="achievements"] label,
.dark-mode [data-view="achievements"] .phase4-achievement-kpi-label,
.dark-mode [data-view="achievements"] .phase4-achievement-kpi-sub,
.dark-mode [data-view="achievements"] .phase4-achievement-panel-head p,
.dark-mode [data-view="achievements"] .phase4-achievement-recent-sub,
.dark-mode [data-view="achievements"] .badge-meta-label,
.dark-mode [data-view="achievements"] .completed-badge-sub,
.dark-mode [data-view="achievements"] .history-year-meta,
.dark-mode [data-view="achievements"] .history-weekly-entry-sub {
  color: #a8b6ca !important;
}

/* KPI and progress stat tiles that were still pale */
body.dark-mode [data-view="achievements"] .phase4-achievement-progress-meta > div,
body.dark-mode [data-view="achievements"] .phase4-achievement-recent-card,
body.dark-mode [data-view="achievements"] .phase4-achievement-help,
body.dark-mode [data-view="achievements"] .checkin-confirm-panel,
body.dark-mode [data-view="achievements"] .checkin-lock-message,
body.dark-mode [data-view="achievements"] .fp-delta-block,
body.dark-mode [data-view="achievements"] .fp-goal-block,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-progress-meta > div,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-recent-card,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-help,
html[data-theme="dark"] [data-view="achievements"] .checkin-confirm-panel,
html[data-theme="dark"] [data-view="achievements"] .checkin-lock-message,
html[data-theme="dark"] [data-view="achievements"] .fp-delta-block,
html[data-theme="dark"] [data-view="achievements"] .fp-goal-block,
.dark-mode [data-view="achievements"] .phase4-achievement-progress-meta > div,
.dark-mode [data-view="achievements"] .phase4-achievement-recent-card,
.dark-mode [data-view="achievements"] .phase4-achievement-help,
.dark-mode [data-view="achievements"] .checkin-confirm-panel,
.dark-mode [data-view="achievements"] .checkin-lock-message,
.dark-mode [data-view="achievements"] .fp-delta-block,
.dark-mode [data-view="achievements"] .fp-goal-block {
  background:
    radial-gradient(circle at 100% 0%, rgba(96,165,250,0.07), transparent 35%),
    linear-gradient(145deg, rgba(15,23,42,0.94), rgba(9,14,25,0.96)) !important;
  border-color: rgba(148,163,184,0.22) !important;
  color: #eaf1fb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.035) !important;
}

/* Check-in card internal strip */
body.dark-mode [data-view="achievements"] .checkin-cadence-inline,
body.dark-mode [data-view="achievements"] .weekly-card-head,
body.dark-mode [data-view="achievements"] .checkin-card-head,
body.dark-mode [data-view="achievements"] .checkin-footer,
html[data-theme="dark"] [data-view="achievements"] .checkin-cadence-inline,
html[data-theme="dark"] [data-view="achievements"] .weekly-card-head,
html[data-theme="dark"] [data-view="achievements"] .checkin-card-head,
html[data-theme="dark"] [data-view="achievements"] .checkin-footer,
.dark-mode [data-view="achievements"] .checkin-cadence-inline,
.dark-mode [data-view="achievements"] .weekly-card-head,
.dark-mode [data-view="achievements"] .checkin-card-head,
.dark-mode [data-view="achievements"] .checkin-footer {
  background: rgba(15,23,42,0.72) !important;
  border-color: rgba(148,163,184,0.16) !important;
}

/* Targets block header, target cards, and empty slots */
body.dark-mode [data-view="achievements"] .badge-system-stack,
body.dark-mode [data-view="achievements"] .phase4-achievement-targets-wrap,
body.dark-mode [data-view="achievements"] .badge-grid,
body.dark-mode [data-view="achievements"] .badge-grid-seq,
html[data-theme="dark"] [data-view="achievements"] .badge-system-stack,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-targets-wrap,
html[data-theme="dark"] [data-view="achievements"] .badge-grid,
html[data-theme="dark"] [data-view="achievements"] .badge-grid-seq,
.dark-mode [data-view="achievements"] .badge-system-stack,
.dark-mode [data-view="achievements"] .phase4-achievement-targets-wrap,
.dark-mode [data-view="achievements"] .badge-grid,
.dark-mode [data-view="achievements"] .badge-grid-seq {
  background: transparent !important;
  border-color: rgba(148,163,184,0.16) !important;
}

body.dark-mode [data-view="achievements"] .badge-tile,
body.dark-mode [data-view="achievements"] .badge-tile-seq,
body.dark-mode [data-view="achievements"] .badge-empty-slot,
body.dark-mode [data-view="achievements"] .badge-empty-slot-custom,
html[data-theme="dark"] [data-view="achievements"] .badge-tile,
html[data-theme="dark"] [data-view="achievements"] .badge-tile-seq,
html[data-theme="dark"] [data-view="achievements"] .badge-empty-slot,
html[data-theme="dark"] [data-view="achievements"] .badge-empty-slot-custom,
.dark-mode [data-view="achievements"] .badge-tile,
.dark-mode [data-view="achievements"] .badge-tile-seq,
.dark-mode [data-view="achievements"] .badge-empty-slot,
.dark-mode [data-view="achievements"] .badge-empty-slot-custom {
  background:
    radial-gradient(circle at 100% 0%, rgba(16,185,129,0.12), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 12px 26px rgba(0,0,0,0.22) !important;
}

body.dark-mode [data-view="achievements"] .badge-empty-slot,
body.dark-mode [data-view="achievements"] .badge-empty-slot-custom,
html[data-theme="dark"] [data-view="achievements"] .badge-empty-slot,
html[data-theme="dark"] [data-view="achievements"] .badge-empty-slot-custom,
.dark-mode [data-view="achievements"] .badge-empty-slot,
.dark-mode [data-view="achievements"] .badge-empty-slot-custom {
  background:
    radial-gradient(circle at 100% 0%, rgba(148,163,184,0.08), transparent 38%),
    linear-gradient(145deg, rgba(30,41,59,0.72), rgba(15,23,42,0.88)) !important;
  border-color: rgba(148,163,184,0.18) !important;
}

/* Completed badge list rows */
body.dark-mode [data-view="achievements"] .completed-badge-row,
body.dark-mode [data-view="achievements"] .completed-badge-modal-tile,
html[data-theme="dark"] [data-view="achievements"] .completed-badge-row,
html[data-theme="dark"] [data-view="achievements"] .completed-badge-modal-tile,
.dark-mode [data-view="achievements"] .completed-badge-row,
.dark-mode [data-view="achievements"] .completed-badge-modal-tile {
  background: rgba(15,23,42,0.70) !important;
  border-color: rgba(148,163,184,0.16) !important;
  color: #eaf1fb !important;
}

/* Lower hidden logic: Needs Attention, goal, history */
body.dark-mode [data-view="achievements"] .phase4-achievement-hidden-logic .achievements-section,
body.dark-mode [data-view="achievements"] .phase4-achievement-hidden-logic .financial-progress-card,
body.dark-mode [data-view="achievements"] .history-tree,
body.dark-mode [data-view="achievements"] .history-month-body,
body.dark-mode [data-view="achievements"] .history-monthly-summary,
body.dark-mode [data-view="achievements"] .history-weekly-subgroup,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-hidden-logic .achievements-section,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-hidden-logic .financial-progress-card,
html[data-theme="dark"] [data-view="achievements"] .history-tree,
html[data-theme="dark"] [data-view="achievements"] .history-month-body,
html[data-theme="dark"] [data-view="achievements"] .history-monthly-summary,
html[data-theme="dark"] [data-view="achievements"] .history-weekly-subgroup,
.dark-mode [data-view="achievements"] .phase4-achievement-hidden-logic .achievements-section,
.dark-mode [data-view="achievements"] .phase4-achievement-hidden-logic .financial-progress-card,
.dark-mode [data-view="achievements"] .history-tree,
.dark-mode [data-view="achievements"] .history-month-body,
.dark-mode [data-view="achievements"] .history-monthly-summary,
.dark-mode [data-view="achievements"] .history-weekly-subgroup {
  background:
    radial-gradient(circle at 96% -10%, rgba(148,163,184,0.10), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.22) !important;
  color: #eaf1fb !important;
}

/* Financial progress internal metrics and goal row from screenshot */
body.dark-mode [data-view="achievements"] .fp-delta-row > div,
body.dark-mode [data-view="achievements"] .fp-goal-block,
body.dark-mode [data-view="achievements"] .fp-benchmark-chip,
body.dark-mode [data-view="achievements"] .fp-highlight-chip,
html[data-theme="dark"] [data-view="achievements"] .fp-delta-row > div,
html[data-theme="dark"] [data-view="achievements"] .fp-goal-block,
html[data-theme="dark"] [data-view="achievements"] .fp-benchmark-chip,
html[data-theme="dark"] [data-view="achievements"] .fp-highlight-chip,
.dark-mode [data-view="achievements"] .fp-delta-row > div,
.dark-mode [data-view="achievements"] .fp-goal-block,
.dark-mode [data-view="achievements"] .fp-benchmark-chip,
.dark-mode [data-view="achievements"] .fp-highlight-chip {
  background: rgba(15,23,42,0.86) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
}

body.dark-mode [data-view="achievements"] .fp-goal-bar,
body.dark-mode [data-view="achievements"] .phase4-achievement-progress-track,
body.dark-mode [data-view="achievements"] .badge-prog-wrap,
html[data-theme="dark"] [data-view="achievements"] .fp-goal-bar,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-progress-track,
html[data-theme="dark"] [data-view="achievements"] .badge-prog-wrap,
.dark-mode [data-view="achievements"] .fp-goal-bar,
.dark-mode [data-view="achievements"] .phase4-achievement-progress-track,
.dark-mode [data-view="achievements"] .badge-prog-wrap {
  background: rgba(203,213,225,0.16) !important;
  border-color: rgba(148,163,184,0.18) !important;
}

/* Buttons, chips and controls */
body.dark-mode [data-view="achievements"] .feature-action-btn,
body.dark-mode [data-view="achievements"] .phase4-achievement-link,
body.dark-mode [data-view="achievements"] .completed-badges-all-btn,
body.dark-mode [data-view="achievements"] .cbm-btn-ghost,
body.dark-mode [data-view="achievements"] .cbm-btn-primary,
body.dark-mode [data-view="achievements"] .checkin-cta-btn,
body.dark-mode [data-view="achievements"] .checkin-confirm-btn,
body.dark-mode [data-view="achievements"] .checkin-undo-btn,
html[data-theme="dark"] [data-view="achievements"] .feature-action-btn,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-link,
html[data-theme="dark"] [data-view="achievements"] .completed-badges-all-btn,
html[data-theme="dark"] [data-view="achievements"] .cbm-btn-ghost,
html[data-theme="dark"] [data-view="achievements"] .cbm-btn-primary,
html[data-theme="dark"] [data-view="achievements"] .checkin-cta-btn,
html[data-theme="dark"] [data-view="achievements"] .checkin-confirm-btn,
html[data-theme="dark"] [data-view="achievements"] .checkin-undo-btn,
.dark-mode [data-view="achievements"] .feature-action-btn,
.dark-mode [data-view="achievements"] .phase4-achievement-link,
.dark-mode [data-view="achievements"] .completed-badges-all-btn,
.dark-mode [data-view="achievements"] .cbm-btn-ghost,
.dark-mode [data-view="achievements"] .cbm-btn-primary,
.dark-mode [data-view="achievements"] .checkin-cta-btn,
.dark-mode [data-view="achievements"] .checkin-confirm-btn,
.dark-mode [data-view="achievements"] .checkin-undo-btn {
  background: rgba(15,23,42,0.84) !important;
  border: 1px solid rgba(148,163,184,0.24) !important;
  color: #86efac !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.035) !important;
}

/* Positive/negative readable accents */
body.dark-mode [data-view="achievements"] .val-good,
body.dark-mode [data-view="achievements"] .fp-pos,
body.dark-mode [data-view="achievements"] .phase4-achievement-kpi.primary .phase4-achievement-kpi-value,
body.dark-mode [data-view="achievements"] .phase4-achievement-insight-strip strong,
html[data-theme="dark"] [data-view="achievements"] .val-good,
html[data-theme="dark"] [data-view="achievements"] .fp-pos,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-kpi.primary .phase4-achievement-kpi-value,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-insight-strip strong,
.dark-mode [data-view="achievements"] .val-good,
.dark-mode [data-view="achievements"] .fp-pos,
.dark-mode [data-view="achievements"] .phase4-achievement-kpi.primary .phase4-achievement-kpi-value,
.dark-mode [data-view="achievements"] .phase4-achievement-insight-strip strong {
  color: #86efac !important;
}
body.dark-mode [data-view="achievements"] .val-bad,
body.dark-mode [data-view="achievements"] .fp-neg,
body.dark-mode [data-view="achievements"] .kpi-bad,
html[data-theme="dark"] [data-view="achievements"] .val-bad,
html[data-theme="dark"] [data-view="achievements"] .fp-neg,
html[data-theme="dark"] [data-view="achievements"] .kpi-bad,
.dark-mode [data-view="achievements"] .val-bad,
.dark-mode [data-view="achievements"] .fp-neg,
.dark-mode [data-view="achievements"] .kpi-bad {
  color: #fca5a5 !important;
}
body.dark-mode [data-view="achievements"] .val-warn,
body.dark-mode [data-view="achievements"] .fp-warn,
html[data-theme="dark"] [data-view="achievements"] .val-warn,
html[data-theme="dark"] [data-view="achievements"] .fp-warn,
.dark-mode [data-view="achievements"] .val-warn,
.dark-mode [data-view="achievements"] .fp-warn {
  color: #fcd34d !important;
}

/* Kill leftover inline/light surfaces within Achievements */
body.dark-mode [data-view="achievements"] [style*="background: #fff"],
body.dark-mode [data-view="achievements"] [style*="background:#fff"],
body.dark-mode [data-view="achievements"] [style*="background: white"],
body.dark-mode [data-view="achievements"] [style*="background:white"],
html[data-theme="dark"] [data-view="achievements"] [style*="background: #fff"],
html[data-theme="dark"] [data-view="achievements"] [style*="background:#fff"],
html[data-theme="dark"] [data-view="achievements"] [style*="background: white"],
html[data-theme="dark"] [data-view="achievements"] [style*="background:white"],
.dark-mode [data-view="achievements"] [style*="background: #fff"],
.dark-mode [data-view="achievements"] [style*="background:#fff"],
.dark-mode [data-view="achievements"] [style*="background: white"],
.dark-mode [data-view="achievements"] [style*="background:white"] {
  background: rgba(15,23,42,0.90) !important;
  color: #eaf1fb !important;
  border-color: rgba(148,163,184,0.24) !important;
}


/* === v1338 Achievements title-bar dark-mode fix ===
   Fixes the remaining light/grey Targets and History header bars. */
body.dark-mode [data-view="achievements"] .badge-system-stack > .achievements-section-head,
body.dark-mode [data-view="achievements"] .phase4-achievement-targets-wrap > .achievements-section-head,
body.dark-mode [data-view="achievements"] .targets-section-head,
body.dark-mode [data-view="achievements"] .targets-header,
body.dark-mode [data-view="achievements"] .history-section-head,
body.dark-mode [data-view="achievements"] .history-header,
body.dark-mode [data-view="achievements"] .history-tree > .achievements-section-head,
body.dark-mode [data-view="achievements"] .financial-progress-card .history-year-header:first-child,
html[data-theme="dark"] [data-view="achievements"] .badge-system-stack > .achievements-section-head,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-targets-wrap > .achievements-section-head,
html[data-theme="dark"] [data-view="achievements"] .targets-section-head,
html[data-theme="dark"] [data-view="achievements"] .targets-header,
html[data-theme="dark"] [data-view="achievements"] .history-section-head,
html[data-theme="dark"] [data-view="achievements"] .history-header,
html[data-theme="dark"] [data-view="achievements"] .history-tree > .achievements-section-head,
html[data-theme="dark"] [data-view="achievements"] .financial-progress-card .history-year-header:first-child,
.dark-mode [data-view="achievements"] .badge-system-stack > .achievements-section-head,
.dark-mode [data-view="achievements"] .phase4-achievement-targets-wrap > .achievements-section-head,
.dark-mode [data-view="achievements"] .targets-section-head,
.dark-mode [data-view="achievements"] .targets-header,
.dark-mode [data-view="achievements"] .history-section-head,
.dark-mode [data-view="achievements"] .history-header,
.dark-mode [data-view="achievements"] .history-tree > .achievements-section-head,
.dark-mode [data-view="achievements"] .financial-progress-card .history-year-header:first-child {
  background:
    radial-gradient(circle at 100% 0%, rgba(167,139,250,0.10), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.22) !important;
  color: #f8fafc !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

/* The actual title strip in this build is sometimes rendered as the first child
   inside the targets/history containers, so force only that header-looking row dark. */
body.dark-mode [data-view="achievements"] .badge-system-stack > div:first-child,
body.dark-mode [data-view="achievements"] .phase4-achievement-targets-wrap > div:first-child,
body.dark-mode [data-view="achievements"] .history-tree > div:first-child,
html[data-theme="dark"] [data-view="achievements"] .badge-system-stack > div:first-child,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-targets-wrap > div:first-child,
html[data-theme="dark"] [data-view="achievements"] .history-tree > div:first-child,
.dark-mode [data-view="achievements"] .badge-system-stack > div:first-child,
.dark-mode [data-view="achievements"] .phase4-achievement-targets-wrap > div:first-child,
.dark-mode [data-view="achievements"] .history-tree > div:first-child {
  background:
    radial-gradient(circle at 100% 0%, rgba(167,139,250,0.10), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.22) !important;
  color: #f8fafc !important;
}

/* Keep labels and action buttons readable inside those bars. */
body.dark-mode [data-view="achievements"] .badge-system-stack > div:first-child h3,
body.dark-mode [data-view="achievements"] .badge-system-stack > div:first-child h4,
body.dark-mode [data-view="achievements"] .badge-system-stack > div:first-child span,
body.dark-mode [data-view="achievements"] .phase4-achievement-targets-wrap > div:first-child h3,
body.dark-mode [data-view="achievements"] .phase4-achievement-targets-wrap > div:first-child h4,
body.dark-mode [data-view="achievements"] .phase4-achievement-targets-wrap > div:first-child span,
body.dark-mode [data-view="achievements"] .history-tree > div:first-child h3,
body.dark-mode [data-view="achievements"] .history-tree > div:first-child h4,
body.dark-mode [data-view="achievements"] .history-tree > div:first-child span,
html[data-theme="dark"] [data-view="achievements"] .badge-system-stack > div:first-child h3,
html[data-theme="dark"] [data-view="achievements"] .badge-system-stack > div:first-child h4,
html[data-theme="dark"] [data-view="achievements"] .badge-system-stack > div:first-child span,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-targets-wrap > div:first-child h3,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-targets-wrap > div:first-child h4,
html[data-theme="dark"] [data-view="achievements"] .phase4-achievement-targets-wrap > div:first-child span,
html[data-theme="dark"] [data-view="achievements"] .history-tree > div:first-child h3,
html[data-theme="dark"] [data-view="achievements"] .history-tree > div:first-child h4,
html[data-theme="dark"] [data-view="achievements"] .history-tree > div:first-child span,
.dark-mode [data-view="achievements"] .badge-system-stack > div:first-child h3,
.dark-mode [data-view="achievements"] .badge-system-stack > div:first-child h4,
.dark-mode [data-view="achievements"] .badge-system-stack > div:first-child span,
.dark-mode [data-view="achievements"] .phase4-achievement-targets-wrap > div:first-child h3,
.dark-mode [data-view="achievements"] .phase4-achievement-targets-wrap > div:first-child h4,
.dark-mode [data-view="achievements"] .phase4-achievement-targets-wrap > div:first-child span,
.dark-mode [data-view="achievements"] .history-tree > div:first-child h3,
.dark-mode [data-view="achievements"] .history-tree > div:first-child h4,
.dark-mode [data-view="achievements"] .history-tree > div:first-child span {
  color: #f8fafc !important;
}

/* Stronger catch for grey header bars generated with inline/legacy section classes. */
body.dark-mode [data-view="achievements"] [class*="target"][class*="head"],
body.dark-mode [data-view="achievements"] [class*="target"][class*="header"],
body.dark-mode [data-view="achievements"] [class*="history"][class*="head"],
body.dark-mode [data-view="achievements"] [class*="history"][class*="header"],
html[data-theme="dark"] [data-view="achievements"] [class*="target"][class*="head"],
html[data-theme="dark"] [data-view="achievements"] [class*="target"][class*="header"],
html[data-theme="dark"] [data-view="achievements"] [class*="history"][class*="head"],
html[data-theme="dark"] [data-view="achievements"] [class*="history"][class*="header"],
.dark-mode [data-view="achievements"] [class*="target"][class*="head"],
.dark-mode [data-view="achievements"] [class*="target"][class*="header"],
.dark-mode [data-view="achievements"] [class*="history"][class*="head"],
.dark-mode [data-view="achievements"] [class*="history"][class*="header"] {
  background:
    radial-gradient(circle at 100% 0%, rgba(167,139,250,0.10), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.22) !important;
  color: #f8fafc !important;
}


/* === v1339 exact Achievements header strip fix ===
   Targets the actual rendered elements:
   - .phase4-achievement-targets-wrap .achievements-section-head
   - .ui-3d-ach-history > .achievements-section-head
   The prior fix missed these because the visible bars are nested inside generated panels. */

/* Targets + History title bars */
body.dark-mode #achievementsTabLayout .phase4-achievement-targets-wrap .achievements-section-head,
body.dark-mode #achievementsTabLayout .ui-3d-ach-history > .achievements-section-head,
body.dark-mode #achievementsTabLayout .completed-badges-section > .achievements-section-head,
html[data-theme="dark"] #achievementsTabLayout .phase4-achievement-targets-wrap .achievements-section-head,
html[data-theme="dark"] #achievementsTabLayout .ui-3d-ach-history > .achievements-section-head,
html[data-theme="dark"] #achievementsTabLayout .completed-badges-section > .achievements-section-head{
  background:
    radial-gradient(circle at 100% 0%, rgba(99,102,241,0.10), transparent 36%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-bottom: 1px solid rgba(148,163,184,0.22) !important;
  border-top: 0 !important;
  color: #f8fafc !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

/* Round the header strip with the parent card instead of leaving a grey band */
body.dark-mode #achievementsTabLayout .phase4-achievement-targets-wrap .achievements-section-head,
html[data-theme="dark"] #achievementsTabLayout .phase4-achievement-targets-wrap .achievements-section-head{
  border-radius: 14px 14px 0 0 !important;
}

body.dark-mode #achievementsTabLayout .ui-3d-ach-history > .achievements-section-head,
html[data-theme="dark"] #achievementsTabLayout .ui-3d-ach-history > .achievements-section-head{
  border-radius: 14px 14px 0 0 !important;
}

/* Header text and secondary label */
body.dark-mode #achievementsTabLayout .phase4-achievement-targets-wrap .achievements-section-head h4,
body.dark-mode #achievementsTabLayout .ui-3d-ach-history > .achievements-section-head h4,
body.dark-mode #achievementsTabLayout .completed-badges-section > .achievements-section-head h4,
html[data-theme="dark"] #achievementsTabLayout .phase4-achievement-targets-wrap .achievements-section-head h4,
html[data-theme="dark"] #achievementsTabLayout .ui-3d-ach-history > .achievements-section-head h4,
html[data-theme="dark"] #achievementsTabLayout .completed-badges-section > .achievements-section-head h4{
  color: #f8fafc !important;
  text-shadow: none !important;
}

body.dark-mode #achievementsTabLayout .ui-3d-ach-history > .achievements-section-head .achievements-section-sub,
html[data-theme="dark"] #achievementsTabLayout .ui-3d-ach-history > .achievements-section-head .achievements-section-sub{
  color: #a8b6ca !important;
}

/* Keep action buttons dark inside the Targets bar */
body.dark-mode #achievementsTabLayout .phase4-achievement-targets-wrap .achievements-section-head .feature-action-btn,
html[data-theme="dark"] #achievementsTabLayout .phase4-achievement-targets-wrap .achievements-section-head .feature-action-btn{
  background: rgba(30,41,59,0.96) !important;
  border: 1px solid rgba(148,163,184,0.28) !important;
  color: #86efac !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

body.dark-mode #achievementsTabLayout .phase4-achievement-targets-wrap .achievements-section-head .feature-action-btn.is-primary,
html[data-theme="dark"] #achievementsTabLayout .phase4-achievement-targets-wrap .achievements-section-head .feature-action-btn.is-primary{
  background: rgba(37,99,235,0.92) !important;
  border-color: rgba(147,197,253,0.38) !important;
  color: #eff6ff !important;
}

/* Parent shells: remove the old pale header bleed caused by panel gradients */
body.dark-mode #achievementsTabLayout .phase4-achievement-targets-wrap .achievements-section,
body.dark-mode #achievementsTabLayout .ui-3d-ach-history,
html[data-theme="dark"] #achievementsTabLayout .phase4-achievement-targets-wrap .achievements-section,
html[data-theme="dark"] #achievementsTabLayout .ui-3d-ach-history{
  background:
    radial-gradient(circle at 96% -10%, rgba(148,163,184,0.10), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.24) !important;
  overflow: hidden !important;
}

/* If an older rule paints every .achievements-section-head light, kill it in the page. */
body.dark-mode #achievementsTabLayout .achievements-section-head,
html[data-theme="dark"] #achievementsTabLayout .achievements-section-head{
  color: #f8fafc !important;
}


/* === v1340 Income & Savings dark-mode rework ===
   Scope: Income & Savings page + its Income/Savings row popups,
   Manage Structure modals, and Savings Distribution manager. */

body.dark-mode [data-view="income-savings"],
html[data-theme="dark"] [data-view="income-savings"],
.dark-mode [data-view="income-savings"] {
  color-scheme: dark;
  --is-bg: #070b14;
  --is-card: #101827;
  --is-card-2: #142033;
  --is-card-3: #18243a;
  --is-border: rgba(148,163,184,0.24);
  --is-border-soft: rgba(148,163,184,0.14);
  --is-text: #eaf1fb;
  --is-strong: #f8fafc;
  --is-muted: #a8b6ca;
  --is-muted-2: #7f8da3;
  --is-green: #86efac;
  --is-red: #fca5a5;
  --is-blue: #93c5fd;
  background: #070b14 !important;
  color: #eaf1fb !important;
}

/* Main tab sections */
body.dark-mode [data-view="income-savings"] .phase4-money-section,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-section,
.dark-mode [data-view="income-savings"] .phase4-money-section {
  background:
    radial-gradient(circle at 96% -10%, rgba(148,163,184,0.10), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
  box-shadow: 0 18px 44px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

body.dark-mode [data-view="income-savings"] .phase4-money-section-head h3,
body.dark-mode [data-view="income-savings"] .phase4-money-section h3,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-section-head h3,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-section h3,
.dark-mode [data-view="income-savings"] .phase4-money-section-head h3,
.dark-mode [data-view="income-savings"] .phase4-money-section h3 {
  color: #f8fafc !important;
  text-shadow: none !important;
}

body.dark-mode [data-view="income-savings"] .phase4-money-section-head p,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-section-head p,
.dark-mode [data-view="income-savings"] .phase4-money-section-head p {
  color: #a8b6ca !important;
}

/* Main income/savings tiles */
body.dark-mode [data-view="income-savings"] .phase4-money-tile,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-tile,
.dark-mode [data-view="income-savings"] .phase4-money-tile {
  background:
    radial-gradient(circle at 100% 0%, rgba(16,185,129,0.10), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 12px 28px rgba(0,0,0,0.24) !important;
}

body.dark-mode [data-view="income-savings"] .phase4-savings-tile,
html[data-theme="dark"] [data-view="income-savings"] .phase4-savings-tile,
.dark-mode [data-view="income-savings"] .phase4-savings-tile {
  background:
    radial-gradient(circle at 100% 0%, rgba(96,165,250,0.09), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
}

body.dark-mode [data-view="income-savings"] .phase4-money-kicker,
body.dark-mode [data-view="income-savings"] .phase4-money-footer,
body.dark-mode [data-view="income-savings"] .phase4-money-type,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-kicker,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-footer,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-type,
.dark-mode [data-view="income-savings"] .phase4-money-kicker,
.dark-mode [data-view="income-savings"] .phase4-money-footer,
.dark-mode [data-view="income-savings"] .phase4-money-type {
  color: #a8b6ca !important;
}

body.dark-mode [data-view="income-savings"] .phase4-money-name,
body.dark-mode [data-view="income-savings"] .phase4-money-main,
body.dark-mode [data-view="income-savings"] .phase4-money-stat-value,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-name,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-main,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-stat-value,
.dark-mode [data-view="income-savings"] .phase4-money-name,
.dark-mode [data-view="income-savings"] .phase4-money-main,
.dark-mode [data-view="income-savings"] .phase4-money-stat-value {
  color: #f8fafc !important;
}

body.dark-mode [data-view="income-savings"] .phase4-money-main.is-positive,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-main.is-positive,
.dark-mode [data-view="income-savings"] .phase4-money-main.is-positive {
  color: #86efac !important;
}

body.dark-mode [data-view="income-savings"] .phase4-money-stat,
body.dark-mode [data-view="income-savings"] .phase4-money-type,
body.dark-mode [data-view="income-savings"] .phase4-money-cta,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-stat,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-type,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-cta,
.dark-mode [data-view="income-savings"] .phase4-money-stat,
.dark-mode [data-view="income-savings"] .phase4-money-type,
.dark-mode [data-view="income-savings"] .phase4-money-cta {
  background: rgba(15,23,42,0.78) !important;
  border-color: rgba(148,163,184,0.22) !important;
  color: #eaf1fb !important;
}

body.dark-mode [data-view="income-savings"] .phase4-money-stat-label,
html[data-theme="dark"] [data-view="income-savings"] .phase4-money-stat-label,
.dark-mode [data-view="income-savings"] .phase4-money-stat-label {
  color: #a8b6ca !important;
}

/* Income/Savings category row popup modal */
body.dark-mode .cashflow-group-modal-centered,
body.dark-mode .expense-group-modal-centered,
body.dark-mode .expense-modal,
html[data-theme="dark"] .cashflow-group-modal-centered,
html[data-theme="dark"] .expense-group-modal-centered,
html[data-theme="dark"] .expense-modal,
.dark-mode .cashflow-group-modal-centered,
.dark-mode .expense-group-modal-centered,
.dark-mode .expense-modal {
  background:
    radial-gradient(circle at 96% -10%, rgba(148,163,184,0.10), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.26) !important;
  color: #eaf1fb !important;
  box-shadow: 0 24px 70px rgba(0,0,0,0.58), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

body.dark-mode .cashflow-group-modal-centered .expense-modal-head,
body.dark-mode .expense-group-modal-centered .expense-modal-head,
body.dark-mode .cashflow-group-modal-centered .expense-modal-foot,
body.dark-mode .expense-group-modal-centered .expense-modal-foot,
html[data-theme="dark"] .cashflow-group-modal-centered .expense-modal-head,
html[data-theme="dark"] .expense-group-modal-centered .expense-modal-head,
html[data-theme="dark"] .cashflow-group-modal-centered .expense-modal-foot,
html[data-theme="dark"] .expense-group-modal-centered .expense-modal-foot,
.dark-mode .cashflow-group-modal-centered .expense-modal-head,
.dark-mode .expense-group-modal-centered .expense-modal-head,
.dark-mode .cashflow-group-modal-centered .expense-modal-foot,
.dark-mode .expense-group-modal-centered .expense-modal-foot {
  background: rgba(15,23,42,0.94) !important;
  border-color: rgba(148,163,184,0.22) !important;
  color: #eaf1fb !important;
}

body.dark-mode .cashflow-group-modal-centered .cashflow-row-stack > *,
body.dark-mode .cashflow-group-modal-centered .row-card,
body.dark-mode .cashflow-group-modal-centered .entry-row,
html[data-theme="dark"] .cashflow-group-modal-centered .cashflow-row-stack > *,
html[data-theme="dark"] .cashflow-group-modal-centered .row-card,
html[data-theme="dark"] .cashflow-group-modal-centered .entry-row,
.dark-mode .cashflow-group-modal-centered .cashflow-row-stack > *,
.dark-mode .cashflow-group-modal-centered .row-card,
.dark-mode .cashflow-group-modal-centered .entry-row {
  background: rgba(15,23,42,0.86) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
}

body.dark-mode .cashflow-group-modal-centered input,
body.dark-mode .cashflow-group-modal-centered textarea,
body.dark-mode .cashflow-group-modal-centered select,
html[data-theme="dark"] .cashflow-group-modal-centered input,
html[data-theme="dark"] .cashflow-group-modal-centered textarea,
html[data-theme="dark"] .cashflow-group-modal-centered select,
.dark-mode .cashflow-group-modal-centered input,
.dark-mode .cashflow-group-modal-centered textarea,
.dark-mode .cashflow-group-modal-centered select {
  background: #0f172a !important;
  border-color: rgba(148,163,184,0.26) !important;
  color: #eaf1fb !important;
}

/* Structure modals + Savings Distribution modal */
body.dark-mode .chart-modal-card,
body.dark-mode .expense-structure-modal-card,
body.dark-mode .dictionary-card,
html[data-theme="dark"] .chart-modal-card,
html[data-theme="dark"] .expense-structure-modal-card,
html[data-theme="dark"] .dictionary-card,
.dark-mode .chart-modal-card,
.dark-mode .expense-structure-modal-card,
.dark-mode .dictionary-card {
  background:
    radial-gradient(circle at 96% -10%, rgba(96,165,250,0.12), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.26) !important;
  color: #eaf1fb !important;
  box-shadow: 0 24px 70px rgba(0,0,0,0.58), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

body.dark-mode .chart-modal-card .chart-modal-head,
body.dark-mode .dictionary-card .dictionary-head,
body.dark-mode .chart-modal-card .planner-sub,
body.dark-mode .manage-subheader,
html[data-theme="dark"] .chart-modal-card .chart-modal-head,
html[data-theme="dark"] .dictionary-card .dictionary-head,
html[data-theme="dark"] .chart-modal-card .planner-sub,
html[data-theme="dark"] .manage-subheader,
.dark-mode .chart-modal-card .chart-modal-head,
.dark-mode .dictionary-card .dictionary-head,
.dark-mode .chart-modal-card .planner-sub,
.dark-mode .manage-subheader {
  background: rgba(15,23,42,0.92) !important;
  border-color: rgba(148,163,184,0.22) !important;
  color: #eaf1fb !important;
}

body.dark-mode .chart-modal-card h3,
body.dark-mode .chart-modal-card h4,
body.dark-mode .dictionary-card h3,
body.dark-mode .dictionary-card h4,
body.dark-mode .manage-item-name,
html[data-theme="dark"] .chart-modal-card h3,
html[data-theme="dark"] .chart-modal-card h4,
html[data-theme="dark"] .dictionary-card h3,
html[data-theme="dark"] .dictionary-card h4,
html[data-theme="dark"] .manage-item-name,
.dark-mode .chart-modal-card h3,
.dark-mode .chart-modal-card h4,
.dark-mode .dictionary-card h3,
.dark-mode .dictionary-card h4,
.dark-mode .manage-item-name {
  color: #f8fafc !important;
}

body.dark-mode .chart-modal-card p,
body.dark-mode .chart-modal-card .muted,
body.dark-mode .chart-modal-card .planner-sub,
body.dark-mode .manage-item-meta,
body.dark-mode .manage-subheader p,
html[data-theme="dark"] .chart-modal-card p,
html[data-theme="dark"] .chart-modal-card .muted,
html[data-theme="dark"] .chart-modal-card .planner-sub,
html[data-theme="dark"] .manage-item-meta,
html[data-theme="dark"] .manage-subheader p,
.dark-mode .chart-modal-card p,
.dark-mode .chart-modal-card .muted,
.dark-mode .chart-modal-card .planner-sub,
.dark-mode .manage-item-meta,
.dark-mode .manage-subheader p {
  color: #a8b6ca !important;
}

/* Structure manager rows/cards */
body.dark-mode .manage-panel,
body.dark-mode .manage-list,
html[data-theme="dark"] .manage-panel,
html[data-theme="dark"] .manage-list,
.dark-mode .manage-panel,
.dark-mode .manage-list {
  background: rgba(9,14,25,0.38) !important;
  border-color: rgba(148,163,184,0.18) !important;
}

body.dark-mode .manage-item,
body.dark-mode .manage-item.is-custom-category,
html[data-theme="dark"] .manage-item,
html[data-theme="dark"] .manage-item.is-custom-category,
.dark-mode .manage-item,
.dark-mode .manage-item.is-custom-category {
  background: rgba(15,23,42,0.84) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
}

body.dark-mode .manage-item:hover,
html[data-theme="dark"] .manage-item:hover,
.dark-mode .manage-item:hover {
  background: rgba(30,41,59,0.92) !important;
  border-color: rgba(148,163,184,0.34) !important;
}

body.dark-mode .manage-item.active,
body.dark-mode .manage-item.is-custom-category.active,
html[data-theme="dark"] .manage-item.active,
html[data-theme="dark"] .manage-item.is-custom-category.active,
.dark-mode .manage-item.active,
.dark-mode .manage-item.is-custom-category.active {
  background: rgba(30,41,59,0.96) !important;
  border-color: rgba(134,239,172,0.34) !important;
  box-shadow: 0 0 0 2px rgba(16,185,129,0.12) !important;
}

/* Savings Distribution manager summary tiles and rows */
body.dark-mode .chart-modal-card .planner-card,
body.dark-mode .chart-modal-card .ui-3d-planning,
body.dark-mode .chart-modal-card .manage-list .manage-item,
html[data-theme="dark"] .chart-modal-card .planner-card,
html[data-theme="dark"] .chart-modal-card .ui-3d-planning,
html[data-theme="dark"] .chart-modal-card .manage-list .manage-item,
.dark-mode .chart-modal-card .planner-card,
.dark-mode .chart-modal-card .ui-3d-planning,
.dark-mode .chart-modal-card .manage-list .manage-item {
  background:
    radial-gradient(circle at 100% 0%, rgba(96,165,250,0.10), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,0.94), rgba(9,14,25,0.96)) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
}

body.dark-mode .target-input,
body.dark-mode .chart-modal-card input,
body.dark-mode .chart-modal-card textarea,
body.dark-mode .chart-modal-card select,
html[data-theme="dark"] .target-input,
html[data-theme="dark"] .chart-modal-card input,
html[data-theme="dark"] .chart-modal-card textarea,
html[data-theme="dark"] .chart-modal-card select,
.dark-mode .target-input,
.dark-mode .chart-modal-card input,
.dark-mode .chart-modal-card textarea,
.dark-mode .chart-modal-card select {
  background: #0f172a !important;
  color: #eaf1fb !important;
  border-color: rgba(148,163,184,0.26) !important;
}

/* Modal buttons */
body.dark-mode .chart-modal-card .tiny-btn,
body.dark-mode .chart-modal-card .ghost-btn,
body.dark-mode .dictionary-card .ghost-btn,
body.dark-mode .manage-item-controls button,
html[data-theme="dark"] .chart-modal-card .tiny-btn,
html[data-theme="dark"] .chart-modal-card .ghost-btn,
html[data-theme="dark"] .dictionary-card .ghost-btn,
html[data-theme="dark"] .manage-item-controls button,
.dark-mode .chart-modal-card .tiny-btn,
.dark-mode .chart-modal-card .ghost-btn,
.dark-mode .dictionary-card .ghost-btn,
.dark-mode .manage-item-controls button {
  background: rgba(30,41,59,0.96) !important;
  border: 1px solid rgba(148,163,184,0.26) !important;
  color: #eaf1fb !important;
}

body.dark-mode .chart-modal-card .tiny-btn:hover,
body.dark-mode .chart-modal-card .ghost-btn:hover,
html[data-theme="dark"] .chart-modal-card .tiny-btn:hover,
html[data-theme="dark"] .chart-modal-card .ghost-btn:hover,
.dark-mode .chart-modal-card .tiny-btn:hover,
.dark-mode .chart-modal-card .ghost-btn:hover {
  background: rgba(37,99,235,0.90) !important;
  color: #eff6ff !important;
}

/* General text contrast in Income & Savings modals */
body.dark-mode .cashflow-group-modal-centered h3,
body.dark-mode .cashflow-group-modal-centered h4,
body.dark-mode .cashflow-group-modal-centered strong,
body.dark-mode .cashflow-group-modal-centered .row-title,
html[data-theme="dark"] .cashflow-group-modal-centered h3,
html[data-theme="dark"] .cashflow-group-modal-centered h4,
html[data-theme="dark"] .cashflow-group-modal-centered strong,
html[data-theme="dark"] .cashflow-group-modal-centered .row-title,
.dark-mode .cashflow-group-modal-centered h3,
.dark-mode .cashflow-group-modal-centered h4,
.dark-mode .cashflow-group-modal-centered strong,
.dark-mode .cashflow-group-modal-centered .row-title {
  color: #f8fafc !important;
}

body.dark-mode .cashflow-group-modal-centered p,
body.dark-mode .cashflow-group-modal-centered span,
body.dark-mode .cashflow-group-modal-centered small,
body.dark-mode .cashflow-group-modal-centered .muted,
html[data-theme="dark"] .cashflow-group-modal-centered p,
html[data-theme="dark"] .cashflow-group-modal-centered span,
html[data-theme="dark"] .cashflow-group-modal-centered small,
html[data-theme="dark"] .cashflow-group-modal-centered .muted,
.dark-mode .cashflow-group-modal-centered p,
.dark-mode .cashflow-group-modal-centered span,
.dark-mode .cashflow-group-modal-centered small,
.dark-mode .cashflow-group-modal-centered .muted {
  color: #a8b6ca !important;
}

/* Catch leftover white/light surfaces inside this tab and these modal types. */
body.dark-mode [data-view="income-savings"] [style*="background: #fff"],
body.dark-mode [data-view="income-savings"] [style*="background:#fff"],
body.dark-mode [data-view="income-savings"] [style*="background: white"],
body.dark-mode [data-view="income-savings"] [style*="background:white"],
body.dark-mode .cashflow-group-modal-centered [style*="background: #fff"],
body.dark-mode .cashflow-group-modal-centered [style*="background:#fff"],
body.dark-mode .chart-modal-card [style*="background: #fff"],
body.dark-mode .chart-modal-card [style*="background:#fff"],
html[data-theme="dark"] [data-view="income-savings"] [style*="background: #fff"],
html[data-theme="dark"] [data-view="income-savings"] [style*="background:#fff"],
html[data-theme="dark"] [data-view="income-savings"] [style*="background: white"],
html[data-theme="dark"] [data-view="income-savings"] [style*="background:white"],
html[data-theme="dark"] .cashflow-group-modal-centered [style*="background: #fff"],
html[data-theme="dark"] .cashflow-group-modal-centered [style*="background:#fff"],
html[data-theme="dark"] .chart-modal-card [style*="background: #fff"],
html[data-theme="dark"] .chart-modal-card [style*="background:#fff"] {
  background: rgba(15,23,42,0.90) !important;
  color: #eaf1fb !important;
  border-color: rgba(148,163,184,0.24) !important;
}


/* === v1341 Dark-mode button refinement ===
   Improves visibility/contrast for all primary action buttons, pills,
   modal controls and CTA buttons across dark mode. */

body.dark-mode button,
body.dark-mode .feature-action-btn,
body.dark-mode .tiny-btn,
body.dark-mode .ghost-btn,
body.dark-mode .phase4-money-cta,
body.dark-mode .planner-chip,
body.dark-mode [role="button"],
html[data-theme="dark"] button,
html[data-theme="dark"] .feature-action-btn,
html[data-theme="dark"] .tiny-btn,
html[data-theme="dark"] .ghost-btn,
html[data-theme="dark"] .phase4-money-cta,
html[data-theme="dark"] .planner-chip,
html[data-theme="dark"] [role="button"],
.dark-mode button,
.dark-mode .feature-action-btn,
.dark-mode .tiny-btn,
.dark-mode .ghost-btn,
.dark-mode .phase4-money-cta,
.dark-mode .planner-chip,
.dark-mode [role="button"] {
  color: #f8fafc !important;
  border-color: rgba(148,163,184,0.34) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 4px 14px rgba(0,0,0,0.24) !important;
  transition:
    background .18s ease,
    border-color .18s ease,
    transform .18s ease,
    box-shadow .18s ease !important;
}

/* Secondary / neutral buttons */
body.dark-mode .feature-action-btn,
body.dark-mode .ghost-btn,
body.dark-mode .phase4-money-cta,
html[data-theme="dark"] .feature-action-btn,
html[data-theme="dark"] .ghost-btn,
html[data-theme="dark"] .phase4-money-cta,
.dark-mode .feature-action-btn,
.dark-mode .ghost-btn,
.dark-mode .phase4-money-cta {
  background:
    linear-gradient(145deg, rgba(30,41,59,0.96), rgba(15,23,42,0.98)) !important;
  color: #eaf1fb !important;
}

/* Primary actions */
body.dark-mode .feature-action-btn.is-primary,
body.dark-mode .tiny-btn,
html[data-theme="dark"] .feature-action-btn.is-primary,
html[data-theme="dark"] .tiny-btn,
.dark-mode .feature-action-btn.is-primary,
.dark-mode .tiny-btn {
  background:
    linear-gradient(145deg, rgba(59,130,246,0.96), rgba(37,99,235,0.98)) !important;
  border-color: rgba(147,197,253,0.55) !important;
  color: #f8fbff !important;
  text-shadow: 0 1px 1px rgba(0,0,0,0.24) !important;
}

/* Success / green buttons */
body.dark-mode .phase4-money-cta,
body.dark-mode .planner-chip.is-good,
html[data-theme="dark"] .phase4-money-cta,
html[data-theme="dark"] .planner-chip.is-good,
.dark-mode .phase4-money-cta,
.dark-mode .planner-chip.is-good {
  background:
    linear-gradient(145deg, rgba(5,150,105,0.92), rgba(4,120,87,0.96)) !important;
  border-color: rgba(110,231,183,0.42) !important;
  color: #ecfdf5 !important;
}

/* Danger / delete controls */
body.dark-mode .danger-btn,
body.dark-mode .remove-btn,
body.dark-mode button[aria-label*="Delete"],
body.dark-mode button[aria-label*="Remove"],
html[data-theme="dark"] .danger-btn,
html[data-theme="dark"] .remove-btn,
html[data-theme="dark"] button[aria-label*="Delete"],
html[data-theme="dark"] button[aria-label*="Remove"],
.dark-mode .danger-btn,
.dark-mode .remove-btn,
.dark-mode button[aria-label*="Delete"],
.dark-mode button[aria-label*="Remove"] {
  background:
    linear-gradient(145deg, rgba(220,38,38,0.92), rgba(153,27,27,0.98)) !important;
  border-color: rgba(252,165,165,0.45) !important;
  color: #fff5f5 !important;
}

/* Hover states */
body.dark-mode button:hover,
body.dark-mode .feature-action-btn:hover,
body.dark-mode .tiny-btn:hover,
body.dark-mode .ghost-btn:hover,
body.dark-mode .phase4-money-cta:hover,
html[data-theme="dark"] button:hover,
html[data-theme="dark"] .feature-action-btn:hover,
html[data-theme="dark"] .tiny-btn:hover,
html[data-theme="dark"] .ghost-btn:hover,
html[data-theme="dark"] .phase4-money-cta:hover,
.dark-mode button:hover,
.dark-mode .feature-action-btn:hover,
.dark-mode .tiny-btn:hover,
.dark-mode .ghost-btn:hover,
.dark-mode .phase4-money-cta:hover {
  filter: brightness(1.08) !important;
  transform: translateY(-1px) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 8px 20px rgba(0,0,0,0.34) !important;
}

/* Disabled buttons */
body.dark-mode button:disabled,
body.dark-mode .feature-action-btn:disabled,
body.dark-mode .tiny-btn:disabled,
body.dark-mode .ghost-btn:disabled,
html[data-theme="dark"] button:disabled,
html[data-theme="dark"] .feature-action-btn:disabled,
html[data-theme="dark"] .tiny-btn:disabled,
html[data-theme="dark"] .ghost-btn:disabled,
.dark-mode button:disabled,
.dark-mode .feature-action-btn:disabled,
.dark-mode .tiny-btn:disabled,
.dark-mode .ghost-btn:disabled {
  opacity: 0.52 !important;
  filter: grayscale(0.15) !important;
  cursor: not-allowed !important;
}

/* Small icon controls / x buttons */
body.dark-mode .icon-btn,
body.dark-mode .manage-item-controls button,
html[data-theme="dark"] .icon-btn,
html[data-theme="dark"] .manage-item-controls button,
.dark-mode .icon-btn,
.dark-mode .manage-item-controls button {
  min-width: 30px !important;
  min-height: 30px !important;
  border-radius: 10px !important;
  background: rgba(30,41,59,0.96) !important;
  color: #f8fafc !important;
}

/* Improve text readability inside CTA bars */
body.dark-mode .feature-action-btn span,
body.dark-mode .tiny-btn span,
body.dark-mode .ghost-btn span,
html[data-theme="dark"] .feature-action-btn span,
html[data-theme="dark"] .tiny-btn span,
html[data-theme="dark"] .ghost-btn span,
.dark-mode .feature-action-btn span,
.dark-mode .tiny-btn span,
.dark-mode .ghost-btn span {
  color: inherit !important;
}


/* === v1342 Structure modal dark-mode footer + cancel-button fix ===
   Fixes Manage Income/Savings Structure modal bottom bar and all X/delete controls. */

/* Dark footer strip in structure modals */
body.dark-mode .chart-modal-card .structure-modal-foot,
body.dark-mode .chart-modal-card .modal-foot,
body.dark-mode .chart-modal-card .expense-modal-foot,
body.dark-mode .chart-modal-card [class*="foot"],
body.dark-mode .expense-structure-modal-card .structure-modal-foot,
body.dark-mode .expense-structure-modal-card .modal-foot,
body.dark-mode .expense-structure-modal-card [class*="foot"],
html[data-theme="dark"] .chart-modal-card .structure-modal-foot,
html[data-theme="dark"] .chart-modal-card .modal-foot,
html[data-theme="dark"] .chart-modal-card .expense-modal-foot,
html[data-theme="dark"] .chart-modal-card [class*="foot"],
html[data-theme="dark"] .expense-structure-modal-card .structure-modal-foot,
html[data-theme="dark"] .expense-structure-modal-card .modal-foot,
html[data-theme="dark"] .expense-structure-modal-card [class*="foot"],
.dark-mode .chart-modal-card .structure-modal-foot,
.dark-mode .chart-modal-card .modal-foot,
.dark-mode .chart-modal-card .expense-modal-foot,
.dark-mode .chart-modal-card [class*="foot"],
.dark-mode .expense-structure-modal-card .structure-modal-foot,
.dark-mode .expense-structure-modal-card .modal-foot,
.dark-mode .expense-structure-modal-card [class*="foot"] {
  background: rgba(15,23,42,0.96) !important;
  border-top: 1px solid rgba(148,163,184,0.22) !important;
  color: #eaf1fb !important;
}

/* The actual generated bottom row is inline-styled, so target last direct child. */
body.dark-mode .expense-structure-modal-card > div:last-child,
body.dark-mode .chart-modal-card.expense-structure-modal-card > div:last-child,
html[data-theme="dark"] .expense-structure-modal-card > div:last-child,
html[data-theme="dark"] .chart-modal-card.expense-structure-modal-card > div:last-child,
.dark-mode .expense-structure-modal-card > div:last-child,
.dark-mode .chart-modal-card.expense-structure-modal-card > div:last-child {
  background: rgba(15,23,42,0.96) !important;
  border-top: 1px solid rgba(148,163,184,0.22) !important;
  color: #eaf1fb !important;
}

/* Remove the pale block behind footer action zones in two-column manager. */
body.dark-mode .expense-structure-modal-card .expense-structure-grid + div,
body.dark-mode .chart-modal-card .expense-structure-grid + div,
html[data-theme="dark"] .expense-structure-modal-card .expense-structure-grid + div,
html[data-theme="dark"] .chart-modal-card .expense-structure-grid + div,
.dark-mode .expense-structure-modal-card .expense-structure-grid + div,
.dark-mode .chart-modal-card .expense-structure-grid + div {
  background: rgba(15,23,42,0.96) !important;
  border-top: 1px solid rgba(148,163,184,0.22) !important;
}

/* Red X / cancel / delete square buttons inside structure manager */
body.dark-mode .expense-structure-modal-card button[data-remove],
body.dark-mode .expense-structure-modal-card button[data-delete],
body.dark-mode .expense-structure-modal-card button[data-remove-category],
body.dark-mode .expense-structure-modal-card button[data-remove-subcategory],
body.dark-mode .expense-structure-modal-card button[data-delete-category],
body.dark-mode .expense-structure-modal-card button[data-delete-subcategory],
body.dark-mode .expense-structure-modal-card .manage-item-controls button:last-child,
body.dark-mode .expense-structure-modal-card .delete-btn,
body.dark-mode .expense-structure-modal-card .remove-btn,
body.dark-mode .expense-structure-modal-card .danger-btn,
html[data-theme="dark"] .expense-structure-modal-card button[data-remove],
html[data-theme="dark"] .expense-structure-modal-card button[data-delete],
html[data-theme="dark"] .expense-structure-modal-card button[data-remove-category],
html[data-theme="dark"] .expense-structure-modal-card button[data-remove-subcategory],
html[data-theme="dark"] .expense-structure-modal-card button[data-delete-category],
html[data-theme="dark"] .expense-structure-modal-card button[data-delete-subcategory],
html[data-theme="dark"] .expense-structure-modal-card .manage-item-controls button:last-child,
html[data-theme="dark"] .expense-structure-modal-card .delete-btn,
html[data-theme="dark"] .expense-structure-modal-card .remove-btn,
html[data-theme="dark"] .expense-structure-modal-card .danger-btn,
.dark-mode .expense-structure-modal-card button[data-remove],
.dark-mode .expense-structure-modal-card button[data-delete],
.dark-mode .expense-structure-modal-card button[data-remove-category],
.dark-mode .expense-structure-modal-card button[data-remove-subcategory],
.dark-mode .expense-structure-modal-card button[data-delete-category],
.dark-mode .expense-structure-modal-card button[data-delete-subcategory],
.dark-mode .expense-structure-modal-card .manage-item-controls button:last-child,
.dark-mode .expense-structure-modal-card .delete-btn,
.dark-mode .expense-structure-modal-card .remove-btn,
.dark-mode .expense-structure-modal-card .danger-btn {
  background: rgba(127,29,29,0.88) !important;
  border: 1px solid rgba(248,113,113,0.50) !important;
  color: #fecaca !important;
  text-shadow: none !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 4px 12px rgba(127,29,29,0.24) !important;
}

/* Keep ordering arrows neutral, not red. */
body.dark-mode .expense-structure-modal-card .manage-item-controls button:first-child,
body.dark-mode .expense-structure-modal-card .manage-item-controls button:nth-child(2),
html[data-theme="dark"] .expense-structure-modal-card .manage-item-controls button:first-child,
html[data-theme="dark"] .expense-structure-modal-card .manage-item-controls button:nth-child(2),
.dark-mode .expense-structure-modal-card .manage-item-controls button:first-child,
.dark-mode .expense-structure-modal-card .manage-item-controls button:nth-child(2) {
  background: rgba(30,41,59,0.96) !important;
  border-color: rgba(148,163,184,0.30) !important;
  color: #eaf1fb !important;
}

/* White/pale X button next to subcategory row in right panel */
body.dark-mode .expense-structure-modal-card .manage-panel:last-child button,
html[data-theme="dark"] .expense-structure-modal-card .manage-panel:last-child button,
.dark-mode .expense-structure-modal-card .manage-panel:last-child button {
  border-color: rgba(148,163,184,0.30) !important;
}

body.dark-mode .expense-structure-modal-card .manage-panel:last-child button:last-child,
html[data-theme="dark"] .expense-structure-modal-card .manage-panel:last-child button:last-child,
.dark-mode .expense-structure-modal-card .manage-panel:last-child button:last-child {
  background: rgba(127,29,29,0.88) !important;
  border: 1px solid rgba(248,113,113,0.50) !important;
  color: #fecaca !important;
}

/* Button hover for red X controls */
body.dark-mode .expense-structure-modal-card .manage-item-controls button:last-child:hover,
body.dark-mode .expense-structure-modal-card .manage-panel:last-child button:last-child:hover,
html[data-theme="dark"] .expense-structure-modal-card .manage-item-controls button:last-child:hover,
html[data-theme="dark"] .expense-structure-modal-card .manage-panel:last-child button:last-child:hover,
.dark-mode .expense-structure-modal-card .manage-item-controls button:last-child:hover,
.dark-mode .expense-structure-modal-card .manage-panel:last-child button:last-child:hover {
  background: rgba(185,28,28,0.96) !important;
  border-color: rgba(252,165,165,0.62) !important;
  color: #fff1f2 !important;
}

/* Inputs/selects in the structure modal right row */
body.dark-mode .expense-structure-modal-card .manage-panel input,
body.dark-mode .expense-structure-modal-card .manage-panel select,
html[data-theme="dark"] .expense-structure-modal-card .manage-panel input,
html[data-theme="dark"] .expense-structure-modal-card .manage-panel select,
.dark-mode .expense-structure-modal-card .manage-panel input,
.dark-mode .expense-structure-modal-card .manage-panel select {
  background: rgba(15,23,42,0.96) !important;
  border-color: rgba(148,163,184,0.28) !important;
  color: #eaf1fb !important;
}

/* Add buttons in the footer */
body.dark-mode .expense-structure-modal-card [class*="add"],
body.dark-mode .expense-structure-modal-card button[data-add],
body.dark-mode .expense-structure-modal-card .ghost-btn,
html[data-theme="dark"] .expense-structure-modal-card [class*="add"],
html[data-theme="dark"] .expense-structure-modal-card button[data-add],
html[data-theme="dark"] .expense-structure-modal-card .ghost-btn,
.dark-mode .expense-structure-modal-card [class*="add"],
.dark-mode .expense-structure-modal-card button[data-add],
.dark-mode .expense-structure-modal-card .ghost-btn {
  color: #eaf1fb !important;
}


/* === v1343 Savings Distribution cleanup ===
   Removes duplicated helper sentence and improves Remaining tile readability. */

/* Hide duplicated secondary helper sentence */
body.dark-mode .chart-modal-card .planner-sub + .planner-sub,
body.dark-mode .chart-modal-card .planner-copy-secondary,
body.dark-mode .chart-modal-card .duplicate-helper-copy,
html[data-theme="dark"] .chart-modal-card .planner-sub + .planner-sub,
html[data-theme="dark"] .chart-modal-card .planner-copy-secondary,
html[data-theme="dark"] .chart-modal-card .duplicate-helper-copy,
.dark-mode .chart-modal-card .planner-sub + .planner-sub,
.dark-mode .chart-modal-card .planner-copy-secondary,
.dark-mode .chart-modal-card .duplicate-helper-copy {
  display: none !important;
}

/* Fallback: hide the second descriptive line under the modal title only in this modal */
body.dark-mode .chart-modal-card h3 + p + p,
html[data-theme="dark"] .chart-modal-card h3 + p + p,
.dark-mode .chart-modal-card h3 + p + p {
  display: none !important;
}

/* Improve Remaining / Fully assigned tile */
body.dark-mode .chart-modal-card .planner-card:last-child,
body.dark-mode .chart-modal-card .planner-summary-card:last-child,
html[data-theme="dark"] .chart-modal-card .planner-card:last-child,
html[data-theme="dark"] .chart-modal-card .planner-summary-card:last-child,
.dark-mode .chart-modal-card .planner-card:last-child,
.dark-mode .chart-modal-card .planner-summary-card:last-child {
  background:
    radial-gradient(circle at 100% 0%, rgba(16,185,129,0.16), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border: 1px solid rgba(110,231,183,0.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 10px 28px rgba(0,0,0,0.24) !important;
}

/* Remaining title */
body.dark-mode .chart-modal-card .planner-card:last-child .planner-label,
body.dark-mode .chart-modal-card .planner-summary-card:last-child .planner-label,
html[data-theme="dark"] .chart-modal-card .planner-card:last-child .planner-label,
html[data-theme="dark"] .chart-modal-card .planner-summary-card:last-child .planner-label,
.dark-mode .chart-modal-card .planner-card:last-child .planner-label,
.dark-mode .chart-modal-card .planner-summary-card:last-child .planner-label {
  color: #cbd5e1 !important;
}

/* Fully assigned text */
body.dark-mode .chart-modal-card .planner-card:last-child .planner-value,
body.dark-mode .chart-modal-card .planner-summary-card:last-child .planner-value,
body.dark-mode .chart-modal-card .planner-card:last-child strong,
body.dark-mode .chart-modal-card .planner-summary-card:last-child strong,
html[data-theme="dark"] .chart-modal-card .planner-card:last-child .planner-value,
html[data-theme="dark"] .chart-modal-card .planner-summary-card:last-child .planner-value,
html[data-theme="dark"] .chart-modal-card .planner-card:last-child strong,
html[data-theme="dark"] .chart-modal-card .planner-summary-card:last-child strong,
.dark-mode .chart-modal-card .planner-card:last-child .planner-value,
.dark-mode .chart-modal-card .planner-summary-card:last-child .planner-value,
.dark-mode .chart-modal-card .planner-card:last-child strong,
.dark-mode .chart-modal-card .planner-summary-card:last-child strong {
  color: #86efac !important;
  font-weight: 700 !important;
  text-shadow: 0 0 12px rgba(16,185,129,0.18) !important;
}

/* Increase contrast for all top summary cards in this modal */
body.dark-mode .chart-modal-card .planner-card,
body.dark-mode .chart-modal-card .planner-summary-card,
html[data-theme="dark"] .chart-modal-card .planner-card,
html[data-theme="dark"] .chart-modal-card .planner-summary-card,
.dark-mode .chart-modal-card .planner-card,
.dark-mode .chart-modal-card .planner-summary-card {
  color: #f8fafc !important;
}

body.dark-mode .chart-modal-card .planner-card small,
body.dark-mode .chart-modal-card .planner-summary-card small,
html[data-theme="dark"] .chart-modal-card .planner-card small,
html[data-theme="dark"] .chart-modal-card .planner-summary-card small,
.dark-mode .chart-modal-card .planner-card small,
.dark-mode .chart-modal-card .planner-summary-card small {
  color: #a8b6ca !important;
}


/* === v1344 actual Savings Distribution modal fix ===
   Directly supports the generated markup with savings-budget-* classes. */
body.dark-mode .chart-modal-card .savings-budget-summary-card,
html[data-theme="dark"] .chart-modal-card .savings-budget-summary-card,
.dark-mode .chart-modal-card .savings-budget-summary-card {
  background:
    radial-gradient(circle at 100% 0%, rgba(96,165,250,0.10), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,0.98), rgba(9,14,25,0.98)) !important;
  border: 1px solid rgba(148,163,184,0.26) !important;
  color: #f8fafc !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 10px 24px rgba(0,0,0,0.24) !important;
}

body.dark-mode .chart-modal-card .savings-budget-remaining,
html[data-theme="dark"] .chart-modal-card .savings-budget-remaining,
.dark-mode .chart-modal-card .savings-budget-remaining {
  background:
    radial-gradient(circle at 100% 0%, rgba(16,185,129,0.18), transparent 38%),
    linear-gradient(145deg, rgba(13,43,34,0.98), rgba(9,14,25,0.98)) !important;
  border-color: rgba(110,231,183,0.42) !important;
}

body.dark-mode .chart-modal-card .savings-budget-summary-label,
html[data-theme="dark"] .chart-modal-card .savings-budget-summary-label,
.dark-mode .chart-modal-card .savings-budget-summary-label {
  color: #cbd5e1 !important;
  opacity: 1 !important;
}

body.dark-mode .chart-modal-card .savings-budget-summary-value,
html[data-theme="dark"] .chart-modal-card .savings-budget-summary-value,
.dark-mode .chart-modal-card .savings-budget-summary-value {
  color: #f8fafc !important;
  font-weight: 850 !important;
}

body.dark-mode .chart-modal-card #sbd-remaining,
html[data-theme="dark"] .chart-modal-card #sbd-remaining,
.dark-mode .chart-modal-card #sbd-remaining {
  color: #86efac !important;
  font-weight: 900 !important;
  text-shadow: 0 0 14px rgba(16,185,129,0.22) !important;
}

/* Make the savings distribution modal body itself consistently dark. */
body.dark-mode .chart-modal-card .manage-list,
html[data-theme="dark"] .chart-modal-card .manage-list,
.dark-mode .chart-modal-card .manage-list {
  background: rgba(7,11,20,0.60) !important;
  border-color: rgba(148,163,184,0.16) !important;
}


/* === v1345 Expenses tab dark-mode rework ===
   Fixes Expense main tiles, category modal, selected subcategory editor,
   log rows, and the remaining Manage Expense Structure shared-expenses field. */

body.dark-mode [data-view="expenses"],
html[data-theme="dark"] [data-view="expenses"],
.dark-mode [data-view="expenses"] {
  color-scheme: dark;
  --ex-bg: #070b14;
  --ex-card: #101827;
  --ex-card-2: #142033;
  --ex-border: rgba(148,163,184,0.24);
  --ex-text: #eaf1fb;
  --ex-strong: #f8fafc;
  --ex-muted: #a8b6ca;
  --ex-green: #86efac;
  --ex-red: #fca5a5;
  background:#070b14 !important;
  color:#eaf1fb !important;
}

/* Main board and KPI surfaces */
body.dark-mode [data-view="expenses"] .phase4-expense-board,
body.dark-mode [data-view="expenses"] .phase4-expense-hero-card,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-board,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-hero-card,
.dark-mode [data-view="expenses"] .phase4-expense-board,
.dark-mode [data-view="expenses"] .phase4-expense-hero-card {
  background:
    radial-gradient(circle at 96% -10%, rgba(148,163,184,0.10), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color:rgba(148,163,184,0.24) !important;
  color:#eaf1fb !important;
  box-shadow:0 18px 44px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

body.dark-mode [data-view="expenses"] .phase4-expense-hero-card.primary,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-hero-card.primary,
.dark-mode [data-view="expenses"] .phase4-expense-hero-card.primary {
  background:
    radial-gradient(circle at 100% 0%, rgba(16,185,129,0.16), transparent 38%),
    linear-gradient(145deg, #10251f, #0d1423 58%, #080d18) !important;
}

body.dark-mode [data-view="expenses"] .phase4-expense-board-title,
body.dark-mode [data-view="expenses"] .phase4-expense-value,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-board-title,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-value,
.dark-mode [data-view="expenses"] .phase4-expense-board-title,
.dark-mode [data-view="expenses"] .phase4-expense-value {
  color:#f8fafc !important;
  text-shadow:none !important;
}

body.dark-mode [data-view="expenses"] .phase4-expense-label,
body.dark-mode [data-view="expenses"] .phase4-expense-sub,
body.dark-mode [data-view="expenses"] .phase4-expense-board-sub,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-label,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-sub,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-board-sub,
.dark-mode [data-view="expenses"] .phase4-expense-label,
.dark-mode [data-view="expenses"] .phase4-expense-sub,
.dark-mode [data-view="expenses"] .phase4-expense-board-sub {
  color:#a8b6ca !important;
}

/* Expense category tiles */
body.dark-mode [data-view="expenses"] .phase4-expense-tile,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-tile,
.dark-mode [data-view="expenses"] .phase4-expense-tile {
  background:
    radial-gradient(circle at 100% 0%, rgba(96,165,250,0.09), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color:rgba(148,163,184,0.24) !important;
  color:#eaf1fb !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04), 0 12px 28px rgba(0,0,0,0.24) !important;
}

body.dark-mode [data-view="expenses"] .phase4-expense-tile.is-alert,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-tile.is-alert,
.dark-mode [data-view="expenses"] .phase4-expense-tile.is-alert {
  background:
    radial-gradient(circle at 100% 0%, rgba(248,113,113,0.12), transparent 38%),
    linear-gradient(145deg, rgba(31,20,25,0.98), rgba(9,14,25,0.98)) !important;
}

body.dark-mode [data-view="expenses"] .phase4-expense-name,
body.dark-mode [data-view="expenses"] .phase4-expense-main,
body.dark-mode [data-view="expenses"] .phase4-expense-stat-value,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-name,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-main,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-stat-value,
.dark-mode [data-view="expenses"] .phase4-expense-name,
.dark-mode [data-view="expenses"] .phase4-expense-main,
.dark-mode [data-view="expenses"] .phase4-expense-stat-value {
  color:#f8fafc !important;
}

body.dark-mode [data-view="expenses"] .phase4-expense-main.is-live,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-main.is-live,
.dark-mode [data-view="expenses"] .phase4-expense-main.is-live {
  color:#fca5a5 !important;
}

body.dark-mode [data-view="expenses"] .phase4-expense-kicker,
body.dark-mode [data-view="expenses"] .phase4-expense-count,
body.dark-mode [data-view="expenses"] .phase4-expense-stat-label,
body.dark-mode [data-view="expenses"] .phase4-expense-progress-row,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-kicker,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-count,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-stat-label,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-progress-row,
.dark-mode [data-view="expenses"] .phase4-expense-kicker,
.dark-mode [data-view="expenses"] .phase4-expense-count,
.dark-mode [data-view="expenses"] .phase4-expense-stat-label,
.dark-mode [data-view="expenses"] .phase4-expense-progress-row {
  color:#a8b6ca !important;
}

body.dark-mode [data-view="expenses"] .phase4-expense-stat,
body.dark-mode [data-view="expenses"] .phase4-expense-cta,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-stat,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-cta,
.dark-mode [data-view="expenses"] .phase4-expense-stat,
.dark-mode [data-view="expenses"] .phase4-expense-cta {
  background:rgba(15,23,42,0.80) !important;
  border-color:rgba(148,163,184,0.22) !important;
  color:#eaf1fb !important;
}

body.dark-mode [data-view="expenses"] .phase4-expense-progress-track,
html[data-theme="dark"] [data-view="expenses"] .phase4-expense-progress-track,
.dark-mode [data-view="expenses"] .phase4-expense-progress-track {
  background:rgba(203,213,225,0.16) !important;
}

/* Expense category detail modal */
body.dark-mode .expense-group-modal-centered,
body.dark-mode .expense-group-modal,
html[data-theme="dark"] .expense-group-modal-centered,
html[data-theme="dark"] .expense-group-modal,
.dark-mode .expense-group-modal-centered,
.dark-mode .expense-group-modal {
  background:
    radial-gradient(circle at 96% -10%, rgba(148,163,184,0.10), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color:rgba(148,163,184,0.26) !important;
  color:#eaf1fb !important;
  box-shadow:0 24px 70px rgba(0,0,0,0.58), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

body.dark-mode .expense-group-modal-centered .expense-modal-head,
body.dark-mode .expense-group-modal-centered .expense-modal-body,
body.dark-mode .expense-group-modal-centered .expense-modal-foot,
html[data-theme="dark"] .expense-group-modal-centered .expense-modal-head,
html[data-theme="dark"] .expense-group-modal-centered .expense-modal-body,
html[data-theme="dark"] .expense-group-modal-centered .expense-modal-foot,
.dark-mode .expense-group-modal-centered .expense-modal-head,
.dark-mode .expense-group-modal-centered .expense-modal-body,
.dark-mode .expense-group-modal-centered .expense-modal-foot {
  background:rgba(15,23,42,0.94) !important;
  border-color:rgba(148,163,184,0.22) !important;
  color:#eaf1fb !important;
}

body.dark-mode .expense-group-modal-centered h3,
body.dark-mode .expense-group-modal-centered h4,
body.dark-mode .expense-group-modal-centered .expense-selected-title,
body.dark-mode .expense-group-modal-centered .expense-subcat-name,
body.dark-mode .expense-group-modal-centered .expense-subcat-amount,
html[data-theme="dark"] .expense-group-modal-centered h3,
html[data-theme="dark"] .expense-group-modal-centered h4,
html[data-theme="dark"] .expense-group-modal-centered .expense-selected-title,
html[data-theme="dark"] .expense-group-modal-centered .expense-subcat-name,
html[data-theme="dark"] .expense-group-modal-centered .expense-subcat-amount,
.dark-mode .expense-group-modal-centered h3,
.dark-mode .expense-group-modal-centered h4,
.dark-mode .expense-group-modal-centered .expense-selected-title,
.dark-mode .expense-group-modal-centered .expense-subcat-name,
.dark-mode .expense-group-modal-centered .expense-subcat-amount {
  color:#f8fafc !important;
}

body.dark-mode .expense-group-modal-centered .expense-modal-subcopy,
body.dark-mode .expense-group-modal-centered .expense-panel-label,
body.dark-mode .expense-group-modal-centered .expense-subcat-meta,
body.dark-mode .expense-group-modal-centered .expense-subcat-foot,
body.dark-mode .expense-group-modal-centered .expense-log-sub,
html[data-theme="dark"] .expense-group-modal-centered .expense-modal-subcopy,
html[data-theme="dark"] .expense-group-modal-centered .expense-panel-label,
html[data-theme="dark"] .expense-group-modal-centered .expense-subcat-meta,
html[data-theme="dark"] .expense-group-modal-centered .expense-subcat-foot,
html[data-theme="dark"] .expense-group-modal-centered .expense-log-sub,
.dark-mode .expense-group-modal-centered .expense-modal-subcopy,
.dark-mode .expense-group-modal-centered .expense-panel-label,
.dark-mode .expense-group-modal-centered .expense-subcat-meta,
.dark-mode .expense-group-modal-centered .expense-subcat-foot,
.dark-mode .expense-group-modal-centered .expense-log-sub {
  color:#a8b6ca !important;
}

body.dark-mode .expense-left-panel-card,
body.dark-mode .expense-log-card-large,
body.dark-mode .expense-selected-editor,
html[data-theme="dark"] .expense-left-panel-card,
html[data-theme="dark"] .expense-log-card-large,
html[data-theme="dark"] .expense-selected-editor,
.dark-mode .expense-left-panel-card,
.dark-mode .expense-log-card-large,
.dark-mode .expense-selected-editor {
  background:
    radial-gradient(circle at 100% 0%, rgba(96,165,250,0.08), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,0.96), rgba(9,14,25,0.98)) !important;
  border-color:rgba(148,163,184,0.24) !important;
  color:#eaf1fb !important;
}

body.dark-mode .expense-subcat-tile,
body.dark-mode .expense-log-row,
body.dark-mode .expense-entry-row,
body.dark-mode .expense-selected-kpis div,
html[data-theme="dark"] .expense-subcat-tile,
html[data-theme="dark"] .expense-log-row,
html[data-theme="dark"] .expense-entry-row,
html[data-theme="dark"] .expense-selected-kpis div,
.dark-mode .expense-subcat-tile,
.dark-mode .expense-log-row,
.dark-mode .expense-entry-row,
.dark-mode .expense-selected-kpis div {
  background:rgba(15,23,42,0.86) !important;
  border-color:rgba(148,163,184,0.22) !important;
  color:#eaf1fb !important;
}

body.dark-mode .expense-subcat-tile.is-active,
html[data-theme="dark"] .expense-subcat-tile.is-active,
.dark-mode .expense-subcat-tile.is-active {
  background:rgba(30,41,59,0.96) !important;
  border-color:rgba(134,239,172,0.34) !important;
}

body.dark-mode .expense-selected-chip,
body.dark-mode .expense-tile-meta-inline .pill,
body.dark-mode .expense-tile-meta-inline span,
html[data-theme="dark"] .expense-selected-chip,
html[data-theme="dark"] .expense-tile-meta-inline .pill,
html[data-theme="dark"] .expense-tile-meta-inline span,
.dark-mode .expense-selected-chip,
.dark-mode .expense-tile-meta-inline .pill,
.dark-mode .expense-tile-meta-inline span {
  background:rgba(30,41,59,0.86) !important;
  border-color:rgba(148,163,184,0.22) !important;
  color:#cbd5e1 !important;
}

/* Expense modal inputs and selector */
body.dark-mode .expense-group-modal-centered input,
body.dark-mode .expense-group-modal-centered textarea,
body.dark-mode .expense-group-modal-centered select,
html[data-theme="dark"] .expense-group-modal-centered input,
html[data-theme="dark"] .expense-group-modal-centered textarea,
html[data-theme="dark"] .expense-group-modal-centered select,
.dark-mode .expense-group-modal-centered input,
.dark-mode .expense-group-modal-centered textarea,
.dark-mode .expense-group-modal-centered select {
  background:#0f172a !important;
  border-color:rgba(148,163,184,0.30) !important;
  color:#eaf1fb !important;
}

/* Manage Expense Structure shared expenses field */
body.dark-mode .expense-structure-modal-card .manage-splitwise-setting,
body.dark-mode .expense-structure-modal-card .alloc-focus-splitwise,
html[data-theme="dark"] .expense-structure-modal-card .manage-splitwise-setting,
html[data-theme="dark"] .expense-structure-modal-card .alloc-focus-splitwise,
.dark-mode .expense-structure-modal-card .manage-splitwise-setting,
.dark-mode .expense-structure-modal-card .alloc-focus-splitwise {
  background:rgba(15,23,42,0.90) !important;
  border:1px solid rgba(148,163,184,0.26) !important;
  color:#eaf1fb !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

body.dark-mode .expense-structure-modal-card .manage-splitwise-title,
html[data-theme="dark"] .expense-structure-modal-card .manage-splitwise-title,
.dark-mode .expense-structure-modal-card .manage-splitwise-title {
  color:#f8fafc !important;
}

body.dark-mode .expense-structure-modal-card .manage-splitwise-toggle,
html[data-theme="dark"] .expense-structure-modal-card .manage-splitwise-toggle,
.dark-mode .expense-structure-modal-card .manage-splitwise-toggle {
  color:#a8b6ca !important;
}

body.dark-mode .expense-structure-modal-card .manage-splitwise-toggle input,
html[data-theme="dark"] .expense-structure-modal-card .manage-splitwise-toggle input,
.dark-mode .expense-structure-modal-card .manage-splitwise-toggle input {
  accent-color:#86efac !important;
  background:#0f172a !important;
  border-color:rgba(148,163,184,0.35) !important;
}

/* The bottom bars in Expense structure modal */
body.dark-mode .expense-structure-modal-card .expense-structure-grid + div,
body.dark-mode .expense-structure-modal-card > div:last-child,
html[data-theme="dark"] .expense-structure-modal-card .expense-structure-grid + div,
html[data-theme="dark"] .expense-structure-modal-card > div:last-child,
.dark-mode .expense-structure-modal-card .expense-structure-grid + div,
.dark-mode .expense-structure-modal-card > div:last-child {
  background:rgba(15,23,42,0.96) !important;
  border-top:1px solid rgba(148,163,184,0.22) !important;
}

/* Catch remaining light surfaces */
body.dark-mode [data-view="expenses"] [style*="background: #fff"],
body.dark-mode [data-view="expenses"] [style*="background:#fff"],
body.dark-mode [data-view="expenses"] [style*="background: white"],
body.dark-mode [data-view="expenses"] [style*="background:white"],
body.dark-mode .expense-group-modal-centered [style*="background: #fff"],
body.dark-mode .expense-group-modal-centered [style*="background:#fff"],
html[data-theme="dark"] [data-view="expenses"] [style*="background: #fff"],
html[data-theme="dark"] [data-view="expenses"] [style*="background:#fff"],
html[data-theme="dark"] [data-view="expenses"] [style*="background: white"],
html[data-theme="dark"] [data-view="expenses"] [style*="background:white"],
html[data-theme="dark"] .expense-group-modal-centered [style*="background: #fff"],
html[data-theme="dark"] .expense-group-modal-centered [style*="background:#fff"] {
  background:rgba(15,23,42,0.90) !important;
  color:#eaf1fb !important;
  border-color:rgba(148,163,184,0.24) !important;
}


/* === v1346 Debt tab dark-mode rework ===
   Covers Debt main page, Add/Edit Debt, Portfolio Analytics,
   Strategy Engine, Debt Details, and Repayment Simulation surfaces. */

body.dark-mode [data-view="debt"],
html[data-theme="dark"] [data-view="debt"],
.dark-mode [data-view="debt"] {
  color-scheme: dark;
  --debt-bg:#070b14;
  --debt-card:#101827;
  --debt-card-2:#142033;
  --debt-border:rgba(148,163,184,0.24);
  --debt-text:#eaf1fb;
  --debt-strong:#f8fafc;
  --debt-muted:#a8b6ca;
  --debt-blue:#93c5fd;
  --debt-green:#86efac;
  --debt-red:#fca5a5;
  --debt-amber:#fcd34d;
  --debt-purple:#c4b5fd;
  background:#070b14 !important;
  color:#eaf1fb !important;
}

/* Main Debt page KPI cards and board */
body.dark-mode [data-view="debt"] .phase4-debt-kpi,
body.dark-mode [data-view="debt"] .phase4-debt-board,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-kpi,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-board,
.dark-mode [data-view="debt"] .phase4-debt-kpi,
.dark-mode [data-view="debt"] .phase4-debt-board {
  background:
    radial-gradient(circle at 96% -10%, rgba(148,163,184,0.10), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color:rgba(148,163,184,0.24) !important;
  color:#eaf1fb !important;
  box-shadow:0 18px 44px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}
body.dark-mode [data-view="debt"] .phase4-debt-kpi.primary,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-kpi.primary,
.dark-mode [data-view="debt"] .phase4-debt-kpi.primary {
  background:
    radial-gradient(circle at 100% 0%, rgba(56,189,248,0.16), transparent 38%),
    linear-gradient(145deg, #0f2635, #0d1423 58%, #080d18) !important;
  border-color:rgba(56,189,248,0.34) !important;
}
body.dark-mode [data-view="debt"] .phase4-debt-kpi-value,
body.dark-mode [data-view="debt"] .phase4-debt-board-title,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-kpi-value,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-board-title,
.dark-mode [data-view="debt"] .phase4-debt-kpi-value,
.dark-mode [data-view="debt"] .phase4-debt-board-title {
  color:#f8fafc !important;
  text-shadow:none !important;
}
body.dark-mode [data-view="debt"] .phase4-debt-kpi-label,
body.dark-mode [data-view="debt"] .phase4-debt-kpi-sub,
body.dark-mode [data-view="debt"] .phase4-debt-board-sub,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-kpi-label,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-kpi-sub,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-board-sub,
.dark-mode [data-view="debt"] .phase4-debt-kpi-label,
.dark-mode [data-view="debt"] .phase4-debt-kpi-sub,
.dark-mode [data-view="debt"] .phase4-debt-board-sub {
  color:#a8b6ca !important;
}

/* Debt profile tiles */
body.dark-mode [data-view="debt"] .phase4-debt-profile-card,
body.dark-mode [data-view="debt"] .debt-profile-card,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-card,
html[data-theme="dark"] [data-view="debt"] .debt-profile-card,
.dark-mode [data-view="debt"] .phase4-debt-profile-card,
.dark-mode [data-view="debt"] .debt-profile-card {
  background:
    radial-gradient(circle at 100% 0%, rgba(245,158,11,0.09), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color:rgba(148,163,184,0.24) !important;
  color:#eaf1fb !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04), 0 12px 28px rgba(0,0,0,0.24) !important;
}
body.dark-mode [data-view="debt"] .phase4-debt-profile-name,
body.dark-mode [data-view="debt"] .phase4-debt-profile-value,
body.dark-mode [data-view="debt"] .debt-profile-name,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-name,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-value,
html[data-theme="dark"] [data-view="debt"] .debt-profile-name,
.dark-mode [data-view="debt"] .phase4-debt-profile-name,
.dark-mode [data-view="debt"] .phase4-debt-profile-value,
.dark-mode [data-view="debt"] .debt-profile-name {
  color:#f8fafc !important;
}
body.dark-mode [data-view="debt"] .phase4-debt-profile-meta,
body.dark-mode [data-view="debt"] .phase4-debt-profile-label,
body.dark-mode [data-view="debt"] .phase4-debt-profile-sub,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-meta,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-label,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-sub,
.dark-mode [data-view="debt"] .phase4-debt-profile-meta,
.dark-mode [data-view="debt"] .phase4-debt-profile-label,
.dark-mode [data-view="debt"] .phase4-debt-profile-sub {
  color:#a8b6ca !important;
}
body.dark-mode [data-view="debt"] .phase4-debt-profile-stat,
body.dark-mode [data-view="debt"] .debt-profile-stat,
body.dark-mode [data-view="debt"] .phase4-debt-profile-chip,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-stat,
html[data-theme="dark"] [data-view="debt"] .debt-profile-stat,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-chip,
.dark-mode [data-view="debt"] .phase4-debt-profile-stat,
.dark-mode [data-view="debt"] .debt-profile-stat,
.dark-mode [data-view="debt"] .phase4-debt-profile-chip {
  background:rgba(15,23,42,0.80) !important;
  border-color:rgba(148,163,184,0.22) !important;
  color:#eaf1fb !important;
}

/* Shared debt modal shell */
body.dark-mode .debt-modal,
body.dark-mode .debt-setup-modal,
body.dark-mode .debt-detail-modal,
body.dark-mode .debt-analytics-modal,
body.dark-mode .debt-strategy-modal,
html[data-theme="dark"] .debt-modal,
html[data-theme="dark"] .debt-setup-modal,
html[data-theme="dark"] .debt-detail-modal,
html[data-theme="dark"] .debt-analytics-modal,
html[data-theme="dark"] .debt-strategy-modal,
.dark-mode .debt-modal,
.dark-mode .debt-setup-modal,
.dark-mode .debt-detail-modal,
.dark-mode .debt-analytics-modal,
.dark-mode .debt-strategy-modal {
  background:
    radial-gradient(circle at 96% -10%, rgba(148,163,184,0.10), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.98), rgba(9,14,25,0.98)) !important;
  border-color:rgba(148,163,184,0.26) !important;
  color:#eaf1fb !important;
  box-shadow:0 24px 70px rgba(0,0,0,0.58), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}
body.dark-mode .debt-modal-head,
body.dark-mode .debt-modal-foot,
body.dark-mode .debt-strategy-modal .chart-modal-head,
body.dark-mode .debt-strategy-modal .expense-modal-foot,
html[data-theme="dark"] .debt-modal-head,
html[data-theme="dark"] .debt-modal-foot,
html[data-theme="dark"] .debt-strategy-modal .chart-modal-head,
html[data-theme="dark"] .debt-strategy-modal .expense-modal-foot,
.dark-mode .debt-modal-head,
.dark-mode .debt-modal-foot,
.dark-mode .debt-strategy-modal .chart-modal-head,
.dark-mode .debt-strategy-modal .expense-modal-foot {
  background:rgba(15,23,42,0.94) !important;
  border-color:rgba(148,163,184,0.22) !important;
  color:#eaf1fb !important;
}

/* Forms and setup cards */
body.dark-mode .debt-form-field label,
body.dark-mode .debt-modal label,
html[data-theme="dark"] .debt-form-field label,
html[data-theme="dark"] .debt-modal label,
.dark-mode .debt-form-field label,
.dark-mode .debt-modal label {
  color:#a8b6ca !important;
}
body.dark-mode .debt-modal input,
body.dark-mode .debt-modal select,
body.dark-mode .debt-modal textarea,
body.dark-mode .debt-strategy-modal input,
body.dark-mode .debt-strategy-modal select,
body.dark-mode .debt-strategy-modal textarea,
html[data-theme="dark"] .debt-modal input,
html[data-theme="dark"] .debt-modal select,
html[data-theme="dark"] .debt-modal textarea,
html[data-theme="dark"] .debt-strategy-modal input,
html[data-theme="dark"] .debt-strategy-modal select,
html[data-theme="dark"] .debt-strategy-modal textarea,
.dark-mode .debt-modal input,
.dark-mode .debt-modal select,
.dark-mode .debt-modal textarea,
.dark-mode .debt-strategy-modal input,
.dark-mode .debt-strategy-modal select,
.dark-mode .debt-strategy-modal textarea {
  background:#0f172a !important;
  border-color:rgba(148,163,184,0.30) !important;
  color:#eaf1fb !important;
}
body.dark-mode .debt-modal-note,
body.dark-mode .debt-empty-state,
body.dark-mode .debt-extra-check,
body.dark-mode .debt-early-box,
body.dark-mode .debt-penalty-box,
html[data-theme="dark"] .debt-modal-note,
html[data-theme="dark"] .debt-empty-state,
html[data-theme="dark"] .debt-extra-check,
html[data-theme="dark"] .debt-early-box,
html[data-theme="dark"] .debt-penalty-box,
.dark-mode .debt-modal-note,
.dark-mode .debt-empty-state,
.dark-mode .debt-extra-check,
.dark-mode .debt-early-box,
.dark-mode .debt-penalty-box {
  background:
    radial-gradient(circle at 100% 0%, rgba(245,158,11,0.10), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,0.94), rgba(9,14,25,0.96)) !important;
  border-color:rgba(245,158,11,0.28) !important;
  color:#eaf1fb !important;
}

/* Portfolio analytics and strategy cards */
body.dark-mode .debt-analytics-body,
body.dark-mode .debt-strategy-body,
html[data-theme="dark"] .debt-analytics-body,
html[data-theme="dark"] .debt-strategy-body,
.dark-mode .debt-analytics-body,
.dark-mode .debt-strategy-body {
  background:rgba(7,11,20,0.96) !important;
  color:#eaf1fb !important;
}
body.dark-mode .debt-analytics-card,
body.dark-mode .debt-analytics-tile,
body.dark-mode .debt-analytics-row,
body.dark-mode .debt-analytics-suggestion,
body.dark-mode .debt-strategy-hero,
body.dark-mode .debt-strategy-card,
body.dark-mode .debt-strategy-row,
body.dark-mode .debt-strategy-result,
html[data-theme="dark"] .debt-analytics-card,
html[data-theme="dark"] .debt-analytics-tile,
html[data-theme="dark"] .debt-analytics-row,
html[data-theme="dark"] .debt-analytics-suggestion,
html[data-theme="dark"] .debt-strategy-hero,
html[data-theme="dark"] .debt-strategy-card,
html[data-theme="dark"] .debt-strategy-row,
html[data-theme="dark"] .debt-strategy-result,
.dark-mode .debt-analytics-card,
.dark-mode .debt-analytics-tile,
.dark-mode .debt-analytics-row,
.dark-mode .debt-analytics-suggestion,
.dark-mode .debt-strategy-hero,
.dark-mode .debt-strategy-card,
.dark-mode .debt-strategy-row,
.dark-mode .debt-strategy-result {
  background:
    radial-gradient(circle at 100% 0%, rgba(139,92,246,0.10), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,0.96), rgba(9,14,25,0.98)) !important;
  border-color:rgba(148,163,184,0.24) !important;
  color:#eaf1fb !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04), 0 12px 28px rgba(0,0,0,0.22) !important;
}
body.dark-mode .debt-analytics-title,
body.dark-mode .debt-analytics-main-title,
body.dark-mode .debt-analytics-name,
body.dark-mode .debt-strategy-title,
body.dark-mode .debt-strategy-card-title,
body.dark-mode .debt-strategy-row-title,
html[data-theme="dark"] .debt-analytics-title,
html[data-theme="dark"] .debt-analytics-main-title,
html[data-theme="dark"] .debt-analytics-name,
html[data-theme="dark"] .debt-strategy-title,
html[data-theme="dark"] .debt-strategy-card-title,
html[data-theme="dark"] .debt-strategy-row-title,
.dark-mode .debt-analytics-title,
.dark-mode .debt-analytics-main-title,
.dark-mode .debt-analytics-name,
.dark-mode .debt-strategy-title,
.dark-mode .debt-strategy-card-title,
.dark-mode .debt-strategy-row-title {
  color:#f8fafc !important;
}
body.dark-mode .debt-analytics-copy,
body.dark-mode .debt-analytics-main-copy,
body.dark-mode .debt-analytics-eyebrow,
body.dark-mode .debt-strategy-copy,
body.dark-mode .debt-strategy-eyebrow,
body.dark-mode .debt-strategy-row-copy,
html[data-theme="dark"] .debt-analytics-copy,
html[data-theme="dark"] .debt-analytics-main-copy,
html[data-theme="dark"] .debt-analytics-eyebrow,
html[data-theme="dark"] .debt-strategy-copy,
html[data-theme="dark"] .debt-strategy-eyebrow,
html[data-theme="dark"] .debt-strategy-row-copy,
.dark-mode .debt-analytics-copy,
.dark-mode .debt-analytics-main-copy,
.dark-mode .debt-analytics-eyebrow,
.dark-mode .debt-strategy-copy,
.dark-mode .debt-strategy-eyebrow,
.dark-mode .debt-strategy-row-copy {
  color:#a8b6ca !important;
}

/* Debt Details and Simulation internal cards */
body.dark-mode .debt-mock-card,
body.dark-mode .debt-detail-card,
body.dark-mode .debt-detail-hero,
body.dark-mode .debt-detail-section,
body.dark-mode .debt-detail-metric,
body.dark-mode .debt-simulator-card,
body.dark-mode .debt-sim-panel,
body.dark-mode .debt-sim-result,
body.dark-mode .debt-sim-section,
body.dark-mode .debt-sim-answer-card,
body.dark-mode .debt-sim-decision-panel,
html[data-theme="dark"] .debt-mock-card,
html[data-theme="dark"] .debt-detail-card,
html[data-theme="dark"] .debt-detail-hero,
html[data-theme="dark"] .debt-detail-section,
html[data-theme="dark"] .debt-detail-metric,
html[data-theme="dark"] .debt-simulator-card,
html[data-theme="dark"] .debt-sim-panel,
html[data-theme="dark"] .debt-sim-result,
html[data-theme="dark"] .debt-sim-section,
html[data-theme="dark"] .debt-sim-answer-card,
html[data-theme="dark"] .debt-sim-decision-panel,
.dark-mode .debt-mock-card,
.dark-mode .debt-detail-card,
.dark-mode .debt-detail-hero,
.dark-mode .debt-detail-section,
.dark-mode .debt-detail-metric,
.dark-mode .debt-simulator-card,
.dark-mode .debt-sim-panel,
.dark-mode .debt-sim-result,
.dark-mode .debt-sim-section,
.dark-mode .debt-sim-answer-card,
.dark-mode .debt-sim-decision-panel {
  background:
    radial-gradient(circle at 100% 0%, rgba(96,165,250,0.09), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,0.96), rgba(9,14,25,0.98)) !important;
  border-color:rgba(148,163,184,0.24) !important;
  color:#eaf1fb !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04), 0 12px 28px rgba(0,0,0,0.22) !important;
}
body.dark-mode .debt-card-title,
body.dark-mode .debt-detail-title,
body.dark-mode .debt-detail-main-title,
body.dark-mode .debt-sim-panel-title,
body.dark-mode .debt-sim-answer-title,
html[data-theme="dark"] .debt-card-title,
html[data-theme="dark"] .debt-detail-title,
html[data-theme="dark"] .debt-detail-main-title,
html[data-theme="dark"] .debt-sim-panel-title,
html[data-theme="dark"] .debt-sim-answer-title,
.dark-mode .debt-card-title,
.dark-mode .debt-detail-title,
.dark-mode .debt-detail-main-title,
.dark-mode .debt-sim-panel-title,
.dark-mode .debt-sim-answer-title {
  color:#f8fafc !important;
}
body.dark-mode .debt-card-copy,
body.dark-mode .debt-detail-copy,
body.dark-mode .debt-sim-step-label,
body.dark-mode .debt-sim-panel-copy,
html[data-theme="dark"] .debt-card-copy,
html[data-theme="dark"] .debt-detail-copy,
html[data-theme="dark"] .debt-sim-step-label,
html[data-theme="dark"] .debt-sim-panel-copy,
.dark-mode .debt-card-copy,
.dark-mode .debt-detail-copy,
.dark-mode .debt-sim-step-label,
.dark-mode .debt-sim-panel-copy {
  color:#a8b6ca !important;
}

/* Generic Debt modal text and leftover light surface guard */
body.dark-mode .debt-modal h1,
body.dark-mode .debt-modal h2,
body.dark-mode .debt-modal h3,
body.dark-mode .debt-modal h4,
body.dark-mode .debt-modal strong,
html[data-theme="dark"] .debt-modal h1,
html[data-theme="dark"] .debt-modal h2,
html[data-theme="dark"] .debt-modal h3,
html[data-theme="dark"] .debt-modal h4,
html[data-theme="dark"] .debt-modal strong,
.dark-mode .debt-modal h1,
.dark-mode .debt-modal h2,
.dark-mode .debt-modal h3,
.dark-mode .debt-modal h4,
.dark-mode .debt-modal strong {
  color:#f8fafc !important;
}
body.dark-mode .debt-modal p,
body.dark-mode .debt-modal span,
body.dark-mode .debt-modal small,
body.dark-mode .debt-modal .muted,
html[data-theme="dark"] .debt-modal p,
html[data-theme="dark"] .debt-modal span,
html[data-theme="dark"] .debt-modal small,
html[data-theme="dark"] .debt-modal .muted,
.dark-mode .debt-modal p,
.dark-mode .debt-modal span,
.dark-mode .debt-modal small,
.dark-mode .debt-modal .muted {
  color:#a8b6ca !important;
}
body.dark-mode .debt-modal [style*="background: #fff"],
body.dark-mode .debt-modal [style*="background:#fff"],
body.dark-mode .debt-modal [style*="background: white"],
body.dark-mode .debt-modal [style*="background:white"],
body.dark-mode .debt-strategy-modal [style*="background: #fff"],
body.dark-mode .debt-strategy-modal [style*="background:#fff"],
body.dark-mode [data-view="debt"] [style*="background: #fff"],
body.dark-mode [data-view="debt"] [style*="background:#fff"],
html[data-theme="dark"] .debt-modal [style*="background: #fff"],
html[data-theme="dark"] .debt-modal [style*="background:#fff"],
html[data-theme="dark"] .debt-modal [style*="background: white"],
html[data-theme="dark"] .debt-modal [style*="background:white"],
html[data-theme="dark"] .debt-strategy-modal [style*="background: #fff"],
html[data-theme="dark"] .debt-strategy-modal [style*="background:#fff"],
html[data-theme="dark"] [data-view="debt"] [style*="background: #fff"],
html[data-theme="dark"] [data-view="debt"] [style*="background:#fff"] {
  background:rgba(15,23,42,0.90) !important;
  color:#eaf1fb !important;
  border-color:rgba(148,163,184,0.24) !important;
}


/* === v1347 Debt readability exact fixes ===
   Fixes actual debt profile cards and Add Debt early repayment conditions tile. */

/* Actual debt profile card shell used on the main page */
body.dark-mode [data-view="debt"] .debt-profile-tile,
body.dark-mode [data-view="debt"] .phase4-debt-profile-tile,
body.dark-mode [data-view="debt"] .phase4-debt-profile-card,
body.dark-mode [data-view="debt"] .debt-profile-card,
html[data-theme="dark"] [data-view="debt"] .debt-profile-tile,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-tile,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-card,
html[data-theme="dark"] [data-view="debt"] .debt-profile-card,
.dark-mode [data-view="debt"] .debt-profile-tile,
.dark-mode [data-view="debt"] .phase4-debt-profile-tile,
.dark-mode [data-view="debt"] .phase4-debt-profile-card,
.dark-mode [data-view="debt"] .debt-profile-card {
  background:
    radial-gradient(circle at 100% 0%, rgba(245,158,11,0.10), transparent 38%),
    linear-gradient(145deg, rgba(17,24,39,0.98), rgba(8,13,24,0.98)) !important;
  border: 1px solid rgba(148,163,184,0.26) !important;
  color: #eaf1fb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 14px 30px rgba(0,0,0,0.26) !important;
}

/* Catch the actual generated card if class name differs */
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid > *,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid > *,
.dark-mode [data-view="debt"] .phase4-debt-profile-grid > * {
  background:
    radial-gradient(circle at 100% 0%, rgba(245,158,11,0.10), transparent 38%),
    linear-gradient(145deg, rgba(17,24,39,0.98), rgba(8,13,24,0.98)) !important;
  border-color: rgba(148,163,184,0.26) !important;
  color: #eaf1fb !important;
}

/* Debt card internal metric tiles */
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid .debt-profile-metric,
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid .phase4-debt-profile-stat,
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="stat"],
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="metric"],
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid .debt-profile-metric,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid .phase4-debt-profile-stat,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid [class*="stat"],
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid [class*="metric"],
.dark-mode [data-view="debt"] .phase4-debt-profile-grid .debt-profile-metric,
.dark-mode [data-view="debt"] .phase4-debt-profile-grid .phase4-debt-profile-stat,
.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="stat"],
.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="metric"] {
  background: rgba(15,23,42,0.82) !important;
  border: 1px solid rgba(148,163,184,0.22) !important;
  color: #eaf1fb !important;
}

/* Debt card text contrast */
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid h3,
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid h4,
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid strong,
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid .phase4-debt-profile-name,
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid .phase4-debt-profile-balance,
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid .phase4-debt-profile-value,
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="value"],
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="balance"],
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="name"],
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid h3,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid h4,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid strong,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid .phase4-debt-profile-name,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid .phase4-debt-profile-balance,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid .phase4-debt-profile-value,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid [class*="value"],
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid [class*="balance"],
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid [class*="name"],
.dark-mode [data-view="debt"] .phase4-debt-profile-grid h3,
.dark-mode [data-view="debt"] .phase4-debt-profile-grid h4,
.dark-mode [data-view="debt"] .phase4-debt-profile-grid strong,
.dark-mode [data-view="debt"] .phase4-debt-profile-grid .phase4-debt-profile-name,
.dark-mode [data-view="debt"] .phase4-debt-profile-grid .phase4-debt-profile-balance,
.dark-mode [data-view="debt"] .phase4-debt-profile-grid .phase4-debt-profile-value,
.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="value"],
.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="balance"],
.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="name"] {
  color: #f8fafc !important;
  text-shadow: none !important;
}

body.dark-mode [data-view="debt"] .phase4-debt-profile-grid span,
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid small,
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid p,
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="label"],
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="sub"],
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="meta"],
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid span,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid small,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid p,
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid [class*="label"],
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid [class*="sub"],
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid [class*="meta"],
.dark-mode [data-view="debt"] .phase4-debt-profile-grid span,
.dark-mode [data-view="debt"] .phase4-debt-profile-grid small,
.dark-mode [data-view="debt"] .phase4-debt-profile-grid p,
.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="label"],
.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="sub"],
.dark-mode [data-view="debt"] .phase4-debt-profile-grid [class*="meta"] {
  color: #a8b6ca !important;
}

/* Keep action buttons readable on the dark card */
body.dark-mode [data-view="debt"] .phase4-debt-profile-grid button:not(.danger-btn):not([class*="delete"]),
html[data-theme="dark"] [data-view="debt"] .phase4-debt-profile-grid button:not(.danger-btn):not([class*="delete"]),
.dark-mode [data-view="debt"] .phase4-debt-profile-grid button:not(.danger-btn):not([class*="delete"]) {
  background: rgba(30,41,59,0.96) !important;
  border-color: rgba(148,163,184,0.30) !important;
  color: #eaf1fb !important;
}

/* Add Debt: actual Early Repayment Conditions block */
body.dark-mode .debt-early-conditions-block,
html[data-theme="dark"] .debt-early-conditions-block,
.dark-mode .debt-early-conditions-block {
  background:
    radial-gradient(circle at 100% 0%, rgba(245,158,11,0.13), transparent 38%),
    linear-gradient(145deg, rgba(31,25,16,0.98), rgba(9,14,25,0.98)) !important;
  border: 1px solid rgba(245,158,11,0.36) !important;
  color: #eaf1fb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 10px 24px rgba(0,0,0,0.22) !important;
}

body.dark-mode .debt-early-conditions-title,
html[data-theme="dark"] .debt-early-conditions-title,
.dark-mode .debt-early-conditions-title {
  color: #f8fafc !important;
}

body.dark-mode .debt-penalty-pill,
html[data-theme="dark"] .debt-penalty-pill,
.dark-mode .debt-penalty-pill {
  background: rgba(245,158,11,0.14) !important;
  border: 1px solid rgba(245,158,11,0.42) !important;
  color: #fcd34d !important;
}

body.dark-mode .debt-early-conditions-block label,
html[data-theme="dark"] .debt-early-conditions-block label,
.dark-mode .debt-early-conditions-block label {
  color: #cbd5e1 !important;
}

body.dark-mode .debt-early-conditions-block input,
body.dark-mode .debt-early-conditions-block select,
html[data-theme="dark"] .debt-early-conditions-block input,
html[data-theme="dark"] .debt-early-conditions-block select,
.dark-mode .debt-early-conditions-block input,
.dark-mode .debt-early-conditions-block select {
  background: #0f172a !important;
  border-color: rgba(148,163,184,0.30) !important;
  color: #eaf1fb !important;
}

body.dark-mode .debt-penalty-summary,
html[data-theme="dark"] .debt-penalty-summary,
.dark-mode .debt-penalty-summary {
  background: rgba(127,29,29,0.26) !important;
  border: 1px solid rgba(248,113,113,0.34) !important;
  color: #fecaca !important;
}


/* === v1348 Debt Portfolio Analytics + Strategy Engine tile refinement ===
   Fixes Analyze Portfolio Main Answer tile and Strategy Engine light cards. */

/* Portfolio Analytics: Main Answer hero tile */
body.dark-mode .debt-analytics-card.decision,
body.dark-mode .debt-analytics-card.answer,
body.dark-mode .debt-analytics-main-answer,
body.dark-mode .debt-analytics-card .debt-analytics-answer,
body.dark-mode .debt-analytics-card [class*="main-answer"],
html[data-theme="dark"] .debt-analytics-card.decision,
html[data-theme="dark"] .debt-analytics-card.answer,
html[data-theme="dark"] .debt-analytics-main-answer,
html[data-theme="dark"] .debt-analytics-card .debt-analytics-answer,
html[data-theme="dark"] .debt-analytics-card [class*="main-answer"],
.dark-mode .debt-analytics-card.decision,
.dark-mode .debt-analytics-card.answer,
.dark-mode .debt-analytics-main-answer,
.dark-mode .debt-analytics-card .debt-analytics-answer,
.dark-mode .debt-analytics-card [class*="main-answer"] {
  background:
    radial-gradient(circle at 100% 0%, rgba(139,92,246,0.16), transparent 38%),
    linear-gradient(145deg, rgba(23,21,45,0.98), rgba(9,14,25,0.98)) !important;
  border: 1px solid rgba(167,139,250,0.36) !important;
  color: #eaf1fb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 12px 28px rgba(0,0,0,0.26) !important;
}

/* Actual light title/value band inside Main Answer */
body.dark-mode .debt-analytics-card.decision .debt-analytics-main,
body.dark-mode .debt-analytics-card.decision .debt-analytics-hero,
body.dark-mode .debt-analytics-card.decision .debt-analytics-highlight,
body.dark-mode .debt-analytics-card.decision .debt-analytics-answer-row,
body.dark-mode .debt-analytics-card.decision [class*="hero"],
body.dark-mode .debt-analytics-card.decision [class*="highlight"],
html[data-theme="dark"] .debt-analytics-card.decision .debt-analytics-main,
html[data-theme="dark"] .debt-analytics-card.decision .debt-analytics-hero,
html[data-theme="dark"] .debt-analytics-card.decision .debt-analytics-highlight,
html[data-theme="dark"] .debt-analytics-card.decision .debt-analytics-answer-row,
html[data-theme="dark"] .debt-analytics-card.decision [class*="hero"],
html[data-theme="dark"] .debt-analytics-card.decision [class*="highlight"],
.dark-mode .debt-analytics-card.decision .debt-analytics-main,
.dark-mode .debt-analytics-card.decision .debt-analytics-hero,
.dark-mode .debt-analytics-card.decision .debt-analytics-highlight,
.dark-mode .debt-analytics-card.decision .debt-analytics-answer-row,
.dark-mode .debt-analytics-card.decision [class*="hero"],
.dark-mode .debt-analytics-card.decision [class*="highlight"] {
  background: rgba(15,23,42,0.88) !important;
  border: 1px solid rgba(167,139,250,0.28) !important;
  color: #f8fafc !important;
}

body.dark-mode .debt-analytics-card.decision h3,
body.dark-mode .debt-analytics-card.decision strong,
body.dark-mode .debt-analytics-card.decision .debt-analytics-main-title,
body.dark-mode .debt-analytics-card.decision .debt-analytics-value,
html[data-theme="dark"] .debt-analytics-card.decision h3,
html[data-theme="dark"] .debt-analytics-card.decision strong,
html[data-theme="dark"] .debt-analytics-card.decision .debt-analytics-main-title,
html[data-theme="dark"] .debt-analytics-card.decision .debt-analytics-value,
.dark-mode .debt-analytics-card.decision h3,
.dark-mode .debt-analytics-card.decision strong,
.dark-mode .debt-analytics-card.decision .debt-analytics-main-title,
.dark-mode .debt-analytics-card.decision .debt-analytics-value {
  color: #f8fafc !important;
  text-shadow: none !important;
}

body.dark-mode .debt-analytics-card.decision p,
body.dark-mode .debt-analytics-card.decision span,
body.dark-mode .debt-analytics-card.decision small,
body.dark-mode .debt-analytics-card.decision .debt-analytics-main-copy,
html[data-theme="dark"] .debt-analytics-card.decision p,
html[data-theme="dark"] .debt-analytics-card.decision span,
html[data-theme="dark"] .debt-analytics-card.decision small,
html[data-theme="dark"] .debt-analytics-card.decision .debt-analytics-main-copy,
.dark-mode .debt-analytics-card.decision p,
.dark-mode .debt-analytics-card.decision span,
.dark-mode .debt-analytics-card.decision small,
.dark-mode .debt-analytics-card.decision .debt-analytics-main-copy {
  color: #cbd5e1 !important;
}

/* Strategy Engine: strategy option rows and comparison cards */
body.dark-mode .debt-strategy-modal .debt-strategy-option,
body.dark-mode .debt-strategy-modal .debt-strategy-comparison-row,
body.dark-mode .debt-strategy-modal .debt-strategy-comparison-card,
body.dark-mode .debt-strategy-modal .debt-strategy-bank-row,
body.dark-mode .debt-strategy-modal .debt-strategy-improvement-card,
body.dark-mode .debt-strategy-modal .debt-strategy-action-row,
body.dark-mode .debt-strategy-modal [class*="comparison"] > article,
body.dark-mode .debt-strategy-modal [class*="option"],
body.dark-mode .debt-strategy-modal [class*="improvement"],
body.dark-mode .debt-strategy-modal [class*="restriction"],
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-option,
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-comparison-row,
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-comparison-card,
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-bank-row,
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-improvement-card,
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-action-row,
html[data-theme="dark"] .debt-strategy-modal [class*="comparison"] > article,
html[data-theme="dark"] .debt-strategy-modal [class*="option"],
html[data-theme="dark"] .debt-strategy-modal [class*="improvement"],
html[data-theme="dark"] .debt-strategy-modal [class*="restriction"],
.dark-mode .debt-strategy-modal .debt-strategy-option,
.dark-mode .debt-strategy-modal .debt-strategy-comparison-row,
.dark-mode .debt-strategy-modal .debt-strategy-comparison-card,
.dark-mode .debt-strategy-modal .debt-strategy-bank-row,
.dark-mode .debt-strategy-modal .debt-strategy-improvement-card,
.dark-mode .debt-strategy-modal .debt-strategy-action-row,
.dark-mode .debt-strategy-modal [class*="comparison"] > article,
.dark-mode .debt-strategy-modal [class*="option"],
.dark-mode .debt-strategy-modal [class*="improvement"],
.dark-mode .debt-strategy-modal [class*="restriction"] {
  background:
    radial-gradient(circle at 100% 0%, rgba(167,139,250,0.10), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,0.96), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 10px 24px rgba(0,0,0,0.22) !important;
}

/* Strategy Engine yellow/beige warning cards */
body.dark-mode .debt-strategy-modal .debt-strategy-card.warning,
body.dark-mode .debt-strategy-modal .debt-strategy-row.warning,
body.dark-mode .debt-strategy-modal .is-warning,
body.dark-mode .debt-strategy-modal .warning,
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-card.warning,
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-row.warning,
html[data-theme="dark"] .debt-strategy-modal .is-warning,
html[data-theme="dark"] .debt-strategy-modal .warning,
.dark-mode .debt-strategy-modal .debt-strategy-card.warning,
.dark-mode .debt-strategy-modal .debt-strategy-row.warning,
.dark-mode .debt-strategy-modal .is-warning,
.dark-mode .debt-strategy-modal .warning {
  background:
    radial-gradient(circle at 100% 0%, rgba(245,158,11,0.13), transparent 38%),
    linear-gradient(145deg, rgba(31,25,16,0.96), rgba(9,14,25,0.98)) !important;
  border-color: rgba(245,158,11,0.32) !important;
  color: #eaf1fb !important;
}

/* Strategy Engine success/green cards */
body.dark-mode .debt-strategy-modal .debt-strategy-card.good,
body.dark-mode .debt-strategy-modal .debt-strategy-row.good,
body.dark-mode .debt-strategy-modal .is-good,
body.dark-mode .debt-strategy-modal .good,
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-card.good,
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-row.good,
html[data-theme="dark"] .debt-strategy-modal .is-good,
html[data-theme="dark"] .debt-strategy-modal .good,
.dark-mode .debt-strategy-modal .debt-strategy-card.good,
.dark-mode .debt-strategy-modal .debt-strategy-row.good,
.dark-mode .debt-strategy-modal .is-good,
.dark-mode .debt-strategy-modal .good {
  background:
    radial-gradient(circle at 100% 0%, rgba(16,185,129,0.13), transparent 38%),
    linear-gradient(145deg, rgba(13,43,34,0.96), rgba(9,14,25,0.98)) !important;
  border-color: rgba(110,231,183,0.30) !important;
  color: #eaf1fb !important;
}

/* Strategy text contrast */
body.dark-mode .debt-strategy-modal h3,
body.dark-mode .debt-strategy-modal h4,
body.dark-mode .debt-strategy-modal strong,
body.dark-mode .debt-strategy-modal [class*="title"],
body.dark-mode .debt-strategy-modal [class*="value"],
html[data-theme="dark"] .debt-strategy-modal h3,
html[data-theme="dark"] .debt-strategy-modal h4,
html[data-theme="dark"] .debt-strategy-modal strong,
html[data-theme="dark"] .debt-strategy-modal [class*="title"],
html[data-theme="dark"] .debt-strategy-modal [class*="value"],
.dark-mode .debt-strategy-modal h3,
.dark-mode .debt-strategy-modal h4,
.dark-mode .debt-strategy-modal strong,
.dark-mode .debt-strategy-modal [class*="title"],
.dark-mode .debt-strategy-modal [class*="value"] {
  color: #f8fafc !important;
  text-shadow: none !important;
}

body.dark-mode .debt-strategy-modal p,
body.dark-mode .debt-strategy-modal span,
body.dark-mode .debt-strategy-modal small,
body.dark-mode .debt-strategy-modal [class*="copy"],
body.dark-mode .debt-strategy-modal [class*="sub"],
body.dark-mode .debt-strategy-modal [class*="label"],
html[data-theme="dark"] .debt-strategy-modal p,
html[data-theme="dark"] .debt-strategy-modal span,
html[data-theme="dark"] .debt-strategy-modal small,
html[data-theme="dark"] .debt-strategy-modal [class*="copy"],
html[data-theme="dark"] .debt-strategy-modal [class*="sub"],
html[data-theme="dark"] .debt-strategy-modal [class*="label"],
.dark-mode .debt-strategy-modal p,
.dark-mode .debt-strategy-modal span,
.dark-mode .debt-strategy-modal small,
.dark-mode .debt-strategy-modal [class*="copy"],
.dark-mode .debt-strategy-modal [class*="sub"],
.dark-mode .debt-strategy-modal [class*="label"] {
  color: #cbd5e1 !important;
}

/* Remaining light-card fallback inside strategy modal */
body.dark-mode .debt-strategy-modal [style*="background: #fff"],
body.dark-mode .debt-strategy-modal [style*="background:#fff"],
body.dark-mode .debt-strategy-modal [style*="background: white"],
body.dark-mode .debt-strategy-modal [style*="background:white"],
html[data-theme="dark"] .debt-strategy-modal [style*="background: #fff"],
html[data-theme="dark"] .debt-strategy-modal [style*="background:#fff"],
html[data-theme="dark"] .debt-strategy-modal [style*="background: white"],
html[data-theme="dark"] .debt-strategy-modal [style*="background:white"] {
  background: rgba(15,23,42,0.92) !important;
  color: #eaf1fb !important;
  border-color: rgba(148,163,184,0.24) !important;
}


/* === v1349 Debt remaining popups dark-mode completion ===
   Covers remaining light cards in Strategy Engine, Loan Details, and Repayment Simulation. */

/* Strategy Engine: any remaining pale cards/rows in the right column and next-actions blocks */
body.dark-mode .debt-strategy-modal .debt-strategy-card *,
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-card *,
.dark-mode .debt-strategy-modal .debt-strategy-card * {
  text-shadow: none !important;
}

body.dark-mode .debt-strategy-modal .debt-strategy-card [class*="summary"],
body.dark-mode .debt-strategy-modal .debt-strategy-card [class*="answer"],
body.dark-mode .debt-strategy-modal .debt-strategy-card [class*="result"],
body.dark-mode .debt-strategy-modal .debt-strategy-card [class*="action"],
body.dark-mode .debt-strategy-modal .debt-strategy-card [class*="step"],
body.dark-mode .debt-strategy-modal .debt-strategy-card [class*="option"],
body.dark-mode .debt-strategy-modal .debt-strategy-card [class*="tile"],
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-card [class*="summary"],
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-card [class*="answer"],
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-card [class*="result"],
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-card [class*="action"],
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-card [class*="step"],
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-card [class*="option"],
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-card [class*="tile"],
.dark-mode .debt-strategy-modal .debt-strategy-card [class*="summary"],
.dark-mode .debt-strategy-modal .debt-strategy-card [class*="answer"],
.dark-mode .debt-strategy-modal .debt-strategy-card [class*="result"],
.dark-mode .debt-strategy-modal .debt-strategy-card [class*="action"],
.dark-mode .debt-strategy-modal .debt-strategy-card [class*="step"],
.dark-mode .debt-strategy-modal .debt-strategy-card [class*="option"],
.dark-mode .debt-strategy-modal .debt-strategy-card [class*="tile"] {
  background: rgba(15,23,42,0.88) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
}

body.dark-mode .debt-strategy-modal .debt-strategy-card [class*="badge"],
body.dark-mode .debt-strategy-modal .debt-strategy-card [class*="chip"],
body.dark-mode .debt-strategy-modal .debt-strategy-card [class*="pill"],
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-card [class*="badge"],
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-card [class*="chip"],
html[data-theme="dark"] .debt-strategy-modal .debt-strategy-card [class*="pill"],
.dark-mode .debt-strategy-modal .debt-strategy-card [class*="badge"],
.dark-mode .debt-strategy-modal .debt-strategy-card [class*="chip"],
.dark-mode .debt-strategy-modal .debt-strategy-card [class*="pill"] {
  background: rgba(30,41,59,0.96) !important;
  border-color: rgba(148,163,184,0.28) !important;
  color: #cbd5e1 !important;
}

/* Loan Details modal: force remaining large pale detail sections/cards dark */
body.dark-mode .debt-detail-modal .debt-detail-body,
html[data-theme="dark"] .debt-detail-modal .debt-detail-body,
.dark-mode .debt-detail-modal .debt-detail-body {
  background: rgba(7,11,20,0.96) !important;
  color: #eaf1fb !important;
}

body.dark-mode .debt-detail-modal .debt-detail-setup-card,
body.dark-mode .debt-detail-modal .debt-detail-source-card,
body.dark-mode .debt-detail-modal .debt-detail-activity-card,
body.dark-mode .debt-detail-modal .debt-detail-history-card,
body.dark-mode .debt-detail-modal .debt-detail-linked-card,
body.dark-mode .debt-detail-modal .debt-detail-extra-card,
body.dark-mode .debt-detail-modal .debt-detail-panel,
body.dark-mode .debt-detail-modal [class*="linked"],
body.dark-mode .debt-detail-modal [class*="activity"],
body.dark-mode .debt-detail-modal [class*="timeline"],
body.dark-mode .debt-detail-modal [class*="history"],
body.dark-mode .debt-detail-modal [class*="setup"],
html[data-theme="dark"] .debt-detail-modal .debt-detail-setup-card,
html[data-theme="dark"] .debt-detail-modal .debt-detail-source-card,
html[data-theme="dark"] .debt-detail-modal .debt-detail-activity-card,
html[data-theme="dark"] .debt-detail-modal .debt-detail-history-card,
html[data-theme="dark"] .debt-detail-modal .debt-detail-linked-card,
html[data-theme="dark"] .debt-detail-modal .debt-detail-extra-card,
html[data-theme="dark"] .debt-detail-modal .debt-detail-panel,
html[data-theme="dark"] .debt-detail-modal [class*="linked"],
html[data-theme="dark"] .debt-detail-modal [class*="activity"],
html[data-theme="dark"] .debt-detail-modal [class*="timeline"],
html[data-theme="dark"] .debt-detail-modal [class*="history"],
html[data-theme="dark"] .debt-detail-modal [class*="setup"],
.dark-mode .debt-detail-modal .debt-detail-setup-card,
.dark-mode .debt-detail-modal .debt-detail-source-card,
.dark-mode .debt-detail-modal .debt-detail-activity-card,
.dark-mode .debt-detail-modal .debt-detail-history-card,
.dark-mode .debt-detail-modal .debt-detail-linked-card,
.dark-mode .debt-detail-modal .debt-detail-extra-card,
.dark-mode .debt-detail-modal .debt-detail-panel,
.dark-mode .debt-detail-modal [class*="linked"],
.dark-mode .debt-detail-modal [class*="activity"],
.dark-mode .debt-detail-modal [class*="timeline"],
.dark-mode .debt-detail-modal [class*="history"],
.dark-mode .debt-detail-modal [class*="setup"] {
  background:
    radial-gradient(circle at 100% 0%, rgba(96,165,250,0.09), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,0.96), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
}

body.dark-mode .debt-detail-modal .debt-detail-row,
body.dark-mode .debt-detail-modal .debt-detail-metric,
body.dark-mode .debt-detail-modal .debt-detail-stat,
body.dark-mode .debt-detail-modal [class*="metric"],
body.dark-mode .debt-detail-modal [class*="stat"],
body.dark-mode .debt-detail-modal [class*="row"],
html[data-theme="dark"] .debt-detail-modal .debt-detail-row,
html[data-theme="dark"] .debt-detail-modal .debt-detail-metric,
html[data-theme="dark"] .debt-detail-modal .debt-detail-stat,
html[data-theme="dark"] .debt-detail-modal [class*="metric"],
html[data-theme="dark"] .debt-detail-modal [class*="stat"],
html[data-theme="dark"] .debt-detail-modal [class*="row"],
.dark-mode .debt-detail-modal .debt-detail-row,
.dark-mode .debt-detail-modal .debt-detail-metric,
.dark-mode .debt-detail-modal .debt-detail-stat,
.dark-mode .debt-detail-modal [class*="metric"],
.dark-mode .debt-detail-modal [class*="stat"],
.dark-mode .debt-detail-modal [class*="row"] {
  background: rgba(15,23,42,0.84) !important;
  border-color: rgba(148,163,184,0.20) !important;
  color: #eaf1fb !important;
}

body.dark-mode .debt-detail-modal h3,
body.dark-mode .debt-detail-modal h4,
body.dark-mode .debt-detail-modal strong,
body.dark-mode .debt-detail-modal [class*="title"],
body.dark-mode .debt-detail-modal [class*="value"],
html[data-theme="dark"] .debt-detail-modal h3,
html[data-theme="dark"] .debt-detail-modal h4,
html[data-theme="dark"] .debt-detail-modal strong,
html[data-theme="dark"] .debt-detail-modal [class*="title"],
html[data-theme="dark"] .debt-detail-modal [class*="value"],
.dark-mode .debt-detail-modal h3,
.dark-mode .debt-detail-modal h4,
.dark-mode .debt-detail-modal strong,
.dark-mode .debt-detail-modal [class*="title"],
.dark-mode .debt-detail-modal [class*="value"] {
  color: #f8fafc !important;
  text-shadow: none !important;
}

body.dark-mode .debt-detail-modal p,
body.dark-mode .debt-detail-modal span,
body.dark-mode .debt-detail-modal small,
body.dark-mode .debt-detail-modal [class*="label"],
body.dark-mode .debt-detail-modal [class*="sub"],
body.dark-mode .debt-detail-modal [class*="copy"],
html[data-theme="dark"] .debt-detail-modal p,
html[data-theme="dark"] .debt-detail-modal span,
html[data-theme="dark"] .debt-detail-modal small,
html[data-theme="dark"] .debt-detail-modal [class*="label"],
html[data-theme="dark"] .debt-detail-modal [class*="sub"],
html[data-theme="dark"] .debt-detail-modal [class*="copy"],
.dark-mode .debt-detail-modal p,
.dark-mode .debt-detail-modal span,
.dark-mode .debt-detail-modal small,
.dark-mode .debt-detail-modal [class*="label"],
.dark-mode .debt-detail-modal [class*="sub"],
.dark-mode .debt-detail-modal [class*="copy"] {
  color: #cbd5e1 !important;
}

/* Repayment Simulation: remaining pale graph/compare/info cards */
body.dark-mode .debt-simulator-card .debt-sim-compare-card,
body.dark-mode .debt-simulator-card .debt-sim-chart-card,
body.dark-mode .debt-simulator-card .debt-sim-chart,
body.dark-mode .debt-simulator-card .debt-sim-info,
body.dark-mode .debt-simulator-card .debt-sim-support,
body.dark-mode .debt-simulator-card .debt-sim-possible,
body.dark-mode .debt-simulator-card .debt-sim-investing,
body.dark-mode .debt-simulator-card [class*="comparison"],
body.dark-mode .debt-simulator-card [class*="chart"],
body.dark-mode .debt-simulator-card [class*="support"],
body.dark-mode .debt-simulator-card [class*="possible"],
body.dark-mode .debt-simulator-card [class*="invest"],
html[data-theme="dark"] .debt-simulator-card .debt-sim-compare-card,
html[data-theme="dark"] .debt-simulator-card .debt-sim-chart-card,
html[data-theme="dark"] .debt-simulator-card .debt-sim-chart,
html[data-theme="dark"] .debt-simulator-card .debt-sim-info,
html[data-theme="dark"] .debt-simulator-card .debt-sim-support,
html[data-theme="dark"] .debt-simulator-card .debt-sim-possible,
html[data-theme="dark"] .debt-simulator-card .debt-sim-investing,
html[data-theme="dark"] .debt-simulator-card [class*="comparison"],
html[data-theme="dark"] .debt-simulator-card [class*="chart"],
html[data-theme="dark"] .debt-simulator-card [class*="support"],
html[data-theme="dark"] .debt-simulator-card [class*="possible"],
html[data-theme="dark"] .debt-simulator-card [class*="invest"],
.dark-mode .debt-simulator-card .debt-sim-compare-card,
.dark-mode .debt-simulator-card .debt-sim-chart-card,
.dark-mode .debt-simulator-card .debt-sim-chart,
.dark-mode .debt-simulator-card .debt-sim-info,
.dark-mode .debt-simulator-card .debt-sim-support,
.dark-mode .debt-simulator-card .debt-sim-possible,
.dark-mode .debt-simulator-card .debt-sim-investing,
.dark-mode .debt-simulator-card [class*="comparison"],
.dark-mode .debt-simulator-card [class*="chart"],
.dark-mode .debt-simulator-card [class*="support"],
.dark-mode .debt-simulator-card [class*="possible"],
.dark-mode .debt-simulator-card [class*="invest"] {
  background:
    radial-gradient(circle at 100% 0%, rgba(139,92,246,0.10), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,0.96), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
}

body.dark-mode .debt-simulator-card .debt-sim-compare-card *,
body.dark-mode .debt-simulator-card .debt-sim-chart-card *,
body.dark-mode .debt-simulator-card .debt-sim-info *,
body.dark-mode .debt-simulator-card .debt-sim-possible *,
body.dark-mode .debt-simulator-card .debt-sim-investing *,
html[data-theme="dark"] .debt-simulator-card .debt-sim-compare-card *,
html[data-theme="dark"] .debt-simulator-card .debt-sim-chart-card *,
html[data-theme="dark"] .debt-simulator-card .debt-sim-info *,
html[data-theme="dark"] .debt-simulator-card .debt-sim-possible *,
html[data-theme="dark"] .debt-simulator-card .debt-sim-investing *,
.dark-mode .debt-simulator-card .debt-sim-compare-card *,
.dark-mode .debt-simulator-card .debt-sim-chart-card *,
.dark-mode .debt-simulator-card .debt-sim-info *,
.dark-mode .debt-simulator-card .debt-sim-possible *,
.dark-mode .debt-simulator-card .debt-sim-investing * {
  color: inherit !important;
  text-shadow: none !important;
}

/* Warning/info bands in Simulation */
body.dark-mode .debt-simulator-card .debt-sim-warning,
body.dark-mode .debt-simulator-card .debt-sim-note,
body.dark-mode .debt-simulator-card .debt-sim-timing,
body.dark-mode .debt-simulator-card [class*="warning"],
body.dark-mode .debt-simulator-card [class*="note"],
body.dark-mode .debt-simulator-card [class*="timing"],
html[data-theme="dark"] .debt-simulator-card .debt-sim-warning,
html[data-theme="dark"] .debt-simulator-card .debt-sim-note,
html[data-theme="dark"] .debt-simulator-card .debt-sim-timing,
html[data-theme="dark"] .debt-simulator-card [class*="warning"],
html[data-theme="dark"] .debt-simulator-card [class*="note"],
html[data-theme="dark"] .debt-simulator-card [class*="timing"],
.dark-mode .debt-simulator-card .debt-sim-warning,
.dark-mode .debt-simulator-card .debt-sim-note,
.dark-mode .debt-simulator-card .debt-sim-timing,
.dark-mode .debt-simulator-card [class*="warning"],
.dark-mode .debt-simulator-card [class*="note"],
.dark-mode .debt-simulator-card [class*="timing"] {
  background: rgba(30,41,59,0.92) !important;
  border-color: rgba(148,163,184,0.26) !important;
  color: #cbd5e1 !important;
}

/* Deep fallback for any leftover very pale debt popup surfaces */
body.dark-mode .debt-detail-modal [style*="background: rgba(255"],
body.dark-mode .debt-detail-modal [style*="background:rgba(255"],
body.dark-mode .debt-simulator-card [style*="background: rgba(255"],
body.dark-mode .debt-simulator-card [style*="background:rgba(255"],
body.dark-mode .debt-strategy-modal [style*="background: rgba(255"],
body.dark-mode .debt-strategy-modal [style*="background:rgba(255"],
html[data-theme="dark"] .debt-detail-modal [style*="background: rgba(255"],
html[data-theme="dark"] .debt-detail-modal [style*="background:rgba(255"],
html[data-theme="dark"] .debt-simulator-card [style*="background: rgba(255"],
html[data-theme="dark"] .debt-simulator-card [style*="background:rgba(255"],
html[data-theme="dark"] .debt-strategy-modal [style*="background: rgba(255"],
html[data-theme="dark"] .debt-strategy-modal [style*="background:rgba(255"] {
  background: rgba(15,23,42,0.92) !important;
  color: #eaf1fb !important;
  border-color: rgba(148,163,184,0.24) !important;
}


/* === v1350 Debt Simulation popup dedicated dark-mode fix ===
   Scope only: Repayment Simulation modal/card.
   Fixes side gutters, pills, method note text, scenario comparison, action plan,
   opportunity comparison, and remaining light simulation cards. */

/* Modal/body container: remove bright side gutters */
body.dark-mode .debt-modal:has(.debt-simulator-card),
body.dark-mode .debt-detail-modal:has(.debt-simulator-card),
html[data-theme="dark"] .debt-modal:has(.debt-simulator-card),
html[data-theme="dark"] .debt-detail-modal:has(.debt-simulator-card),
.dark-mode .debt-modal:has(.debt-simulator-card),
.dark-mode .debt-detail-modal:has(.debt-simulator-card) {
  background:
    radial-gradient(circle at 96% -10%, rgba(148,163,184,0.10), transparent 38%),
    linear-gradient(145deg, rgba(16,24,39,0.99), rgba(7,11,20,0.99)) !important;
  border-color: rgba(148,163,184,0.28) !important;
}

body.dark-mode .debt-modal:has(.debt-simulator-card) .expense-modal-body,
body.dark-mode .debt-modal:has(.debt-simulator-card) .debt-modal-body,
body.dark-mode .debt-detail-modal:has(.debt-simulator-card) .expense-modal-body,
body.dark-mode .debt-detail-modal:has(.debt-simulator-card) .debt-modal-body,
html[data-theme="dark"] .debt-modal:has(.debt-simulator-card) .expense-modal-body,
html[data-theme="dark"] .debt-modal:has(.debt-simulator-card) .debt-modal-body,
html[data-theme="dark"] .debt-detail-modal:has(.debt-simulator-card) .expense-modal-body,
html[data-theme="dark"] .debt-detail-modal:has(.debt-simulator-card) .debt-modal-body,
.dark-mode .debt-modal:has(.debt-simulator-card) .expense-modal-body,
.dark-mode .debt-modal:has(.debt-simulator-card) .debt-modal-body,
.dark-mode .debt-detail-modal:has(.debt-simulator-card) .expense-modal-body,
.dark-mode .debt-detail-modal:has(.debt-simulator-card) .debt-modal-body {
  background: #070b14 !important;
  color: #eaf1fb !important;
}

/* Main simulation card */
body.dark-mode .debt-simulator-card,
html[data-theme="dark"] .debt-simulator-card,
.dark-mode .debt-simulator-card {
  background:
    radial-gradient(circle at 96% -10%, rgba(56,189,248,0.10), transparent 38%),
    linear-gradient(145deg, rgba(13,20,34,0.99), rgba(7,11,20,0.99)) !important;
  border: 1px solid rgba(148,163,184,0.26) !important;
  color: #eaf1fb !important;
}

/* Panel shells */
body.dark-mode .debt-simulator-card .debt-sim-panel,
body.dark-mode .debt-simulator-card .debt-sim-build-panel,
body.dark-mode .debt-simulator-card .debt-sim-chart-panel,
body.dark-mode .debt-simulator-card .debt-sim-answer-panel,
html[data-theme="dark"] .debt-simulator-card .debt-sim-panel,
html[data-theme="dark"] .debt-simulator-card .debt-sim-build-panel,
html[data-theme="dark"] .debt-simulator-card .debt-sim-chart-panel,
html[data-theme="dark"] .debt-simulator-card .debt-sim-answer-panel,
.dark-mode .debt-simulator-card .debt-sim-panel,
.dark-mode .debt-simulator-card .debt-sim-build-panel,
.dark-mode .debt-simulator-card .debt-sim-chart-panel,
.dark-mode .debt-simulator-card .debt-sim-answer-panel {
  background:
    radial-gradient(circle at 100% 0%, rgba(96,165,250,0.08), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,0.96), rgba(9,14,25,0.98)) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 12px 28px rgba(0,0,0,0.24) !important;
}

body.dark-mode .debt-simulator-card .debt-sim-answer-panel,
html[data-theme="dark"] .debt-simulator-card .debt-sim-answer-panel,
.dark-mode .debt-simulator-card .debt-sim-answer-panel {
  background:
    radial-gradient(circle at 100% 0%, rgba(139,92,246,0.12), transparent 38%),
    linear-gradient(145deg, rgba(23,21,45,0.96), rgba(9,14,25,0.98)) !important;
}

/* Step pills */
body.dark-mode .debt-simulator-card .debt-sim-step-chip,
body.dark-mode .debt-simulator-card .debt-phase-chip,
html[data-theme="dark"] .debt-simulator-card .debt-sim-step-chip,
html[data-theme="dark"] .debt-simulator-card .debt-phase-chip,
.dark-mode .debt-simulator-card .debt-sim-step-chip,
.dark-mode .debt-simulator-card .debt-phase-chip {
  background: rgba(30,41,59,0.96) !important;
  border: 1px solid rgba(148,163,184,0.32) !important;
  color: #dbeafe !important;
  text-shadow: none !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

body.dark-mode .debt-simulator-card .debt-sim-answer-panel .debt-sim-step-chip,
html[data-theme="dark"] .debt-simulator-card .debt-sim-answer-panel .debt-sim-step-chip,
.dark-mode .debt-simulator-card .debt-sim-answer-panel .debt-sim-step-chip {
  background: rgba(88,28,135,0.34) !important;
  border-color: rgba(196,181,253,0.40) !important;
  color: #ddd6fe !important;
}

/* Method note / timing row */
body.dark-mode .debt-simulator-card .debt-sim-method-note,
html[data-theme="dark"] .debt-simulator-card .debt-sim-method-note,
.dark-mode .debt-simulator-card .debt-sim-method-note {
  background: rgba(30,41,59,0.86) !important;
  border: 1px solid rgba(148,163,184,0.24) !important;
  color: #cbd5e1 !important;
}
body.dark-mode .debt-simulator-card .debt-sim-method-note strong,
html[data-theme="dark"] .debt-simulator-card .debt-sim-method-note strong,
.dark-mode .debt-simulator-card .debt-sim-method-note strong {
  color: #eaf1fb !important;
}
body.dark-mode .debt-simulator-card .debt-sim-method-icon,
html[data-theme="dark"] .debt-simulator-card .debt-sim-method-icon,
.dark-mode .debt-simulator-card .debt-sim-method-icon {
  background: rgba(96,165,250,0.16) !important;
  color: #bfdbfe !important;
}

/* Scenario comparison and visual cards */
body.dark-mode .debt-simulator-card .debt-sim-visual,
body.dark-mode .debt-simulator-card .debt-balance-chart,
body.dark-mode .debt-simulator-card .debt-sim-compare-card,
body.dark-mode .debt-simulator-card .debt-sim-chart-card,
body.dark-mode .debt-simulator-card [class*="visual"],
body.dark-mode .debt-simulator-card [class*="comparison"],
body.dark-mode .debt-simulator-card [class*="chart"],
html[data-theme="dark"] .debt-simulator-card .debt-sim-visual,
html[data-theme="dark"] .debt-simulator-card .debt-balance-chart,
html[data-theme="dark"] .debt-simulator-card .debt-sim-compare-card,
html[data-theme="dark"] .debt-simulator-card .debt-sim-chart-card,
html[data-theme="dark"] .debt-simulator-card [class*="visual"],
html[data-theme="dark"] .debt-simulator-card [class*="comparison"],
html[data-theme="dark"] .debt-simulator-card [class*="chart"],
.dark-mode .debt-simulator-card .debt-sim-visual,
.dark-mode .debt-simulator-card .debt-balance-chart,
.dark-mode .debt-simulator-card .debt-sim-compare-card,
.dark-mode .debt-simulator-card .debt-sim-chart-card,
.dark-mode .debt-simulator-card [class*="visual"],
.dark-mode .debt-simulator-card [class*="comparison"],
.dark-mode .debt-simulator-card [class*="chart"] {
  background:
    radial-gradient(circle at 100% 0%, rgba(56,189,248,0.08), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,0.92), rgba(9,14,25,0.96)) !important;
  border-color: rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
}

/* Details summary: Show supporting numbers */
body.dark-mode .debt-simulator-card .debt-sim-details summary,
html[data-theme="dark"] .debt-simulator-card .debt-sim-details summary,
.dark-mode .debt-simulator-card .debt-sim-details summary {
  background: rgba(30,41,59,0.96) !important;
  border: 1px solid rgba(148,163,184,0.30) !important;
  color: #d8b4fe !important;
  border-radius: 999px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

/* Action plan block */
body.dark-mode .debt-simulator-card .debt-action-plan,
html[data-theme="dark"] .debt-simulator-card .debt-action-plan,
.dark-mode .debt-simulator-card .debt-action-plan {
  background:
    radial-gradient(circle at 100% 0%, rgba(139,92,246,0.14), transparent 38%),
    linear-gradient(145deg, rgba(30,27,75,0.94), rgba(9,14,25,0.98)) !important;
  border: 1px solid rgba(196,181,253,0.34) !important;
  color: #eaf1fb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 10px 24px rgba(0,0,0,0.24) !important;
}
body.dark-mode .debt-simulator-card .debt-action-plan-title,
html[data-theme="dark"] .debt-simulator-card .debt-action-plan-title,
.dark-mode .debt-simulator-card .debt-action-plan-title {
  color: #ddd6fe !important;
}
body.dark-mode .debt-simulator-card .debt-action-plan-copy,
body.dark-mode .debt-simulator-card .debt-action-plan-copy strong,
html[data-theme="dark"] .debt-simulator-card .debt-action-plan-copy,
html[data-theme="dark"] .debt-simulator-card .debt-action-plan-copy strong,
.dark-mode .debt-simulator-card .debt-action-plan-copy,
.dark-mode .debt-simulator-card .debt-action-plan-copy strong {
  color: #f8fafc !important;
}

/* Opportunity comparison panel */
body.dark-mode .debt-simulator-card #opportunitySection,
body.dark-mode .debt-simulator-card .sim-card-decision,
html[data-theme="dark"] .debt-simulator-card #opportunitySection,
html[data-theme="dark"] .debt-simulator-card .sim-card-decision,
.dark-mode .debt-simulator-card #opportunitySection,
.dark-mode .debt-simulator-card .sim-card-decision {
  background:
    radial-gradient(circle at 100% 0%, rgba(139,92,246,0.10), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,0.94), rgba(9,14,25,0.98)) !important;
  border: 1px solid rgba(148,163,184,0.24) !important;
  color: #eaf1fb !important;
}
body.dark-mode .debt-simulator-card .sim-input-row,
html[data-theme="dark"] .debt-simulator-card .sim-input-row,
.dark-mode .debt-simulator-card .sim-input-row {
  background: rgba(15,23,42,0.64) !important;
  border-color: rgba(148,163,184,0.18) !important;
}
body.dark-mode .debt-simulator-card .sim-input-row label,
html[data-theme="dark"] .debt-simulator-card .sim-input-row label,
.dark-mode .debt-simulator-card .sim-input-row label {
  color: #cbd5e1 !important;
}
body.dark-mode .debt-simulator-card #opportunitySection input,
html[data-theme="dark"] .debt-simulator-card #opportunitySection input,
.dark-mode .debt-simulator-card #opportunitySection input {
  background: #0f172a !important;
  border-color: rgba(148,163,184,0.30) !important;
  color: #eaf1fb !important;
}

/* Text contrast for entire sim popup */
body.dark-mode .debt-simulator-card h3,
body.dark-mode .debt-simulator-card h4,
body.dark-mode .debt-simulator-card strong,
body.dark-mode .debt-simulator-card .debt-card-title,
body.dark-mode .debt-simulator-card .debt-sim-panel-title,
body.dark-mode .debt-simulator-card .debt-sim-section-title,
body.dark-mode .debt-simulator-card .debt-sim-value,
html[data-theme="dark"] .debt-simulator-card h3,
html[data-theme="dark"] .debt-simulator-card h4,
html[data-theme="dark"] .debt-simulator-card strong,
html[data-theme="dark"] .debt-simulator-card .debt-card-title,
html[data-theme="dark"] .debt-simulator-card .debt-sim-panel-title,
html[data-theme="dark"] .debt-simulator-card .debt-sim-section-title,
html[data-theme="dark"] .debt-simulator-card .debt-sim-value,
.dark-mode .debt-simulator-card h3,
.dark-mode .debt-simulator-card h4,
.dark-mode .debt-simulator-card strong,
.dark-mode .debt-simulator-card .debt-card-title,
.dark-mode .debt-simulator-card .debt-sim-panel-title,
.dark-mode .debt-simulator-card .debt-sim-section-title,
.dark-mode .debt-simulator-card .debt-sim-value {
  color: #f8fafc !important;
  text-shadow: none !important;
}

body.dark-mode .debt-simulator-card p,
body.dark-mode .debt-simulator-card span,
body.dark-mode .debt-simulator-card small,
body.dark-mode .debt-simulator-card label,
body.dark-mode .debt-simulator-card .debt-card-copy,
body.dark-mode .debt-simulator-card .debt-sim-step-label,
body.dark-mode .debt-simulator-card .debt-sim-section-note,
body.dark-mode .debt-simulator-card .debt-sim-helper,
html[data-theme="dark"] .debt-simulator-card p,
html[data-theme="dark"] .debt-simulator-card span,
html[data-theme="dark"] .debt-simulator-card small,
html[data-theme="dark"] .debt-simulator-card label,
html[data-theme="dark"] .debt-simulator-card .debt-card-copy,
html[data-theme="dark"] .debt-simulator-card .debt-sim-step-label,
html[data-theme="dark"] .debt-simulator-card .debt-sim-section-note,
html[data-theme="dark"] .debt-simulator-card .debt-sim-helper,
.dark-mode .debt-simulator-card p,
.dark-mode .debt-simulator-card span,
.dark-mode .debt-simulator-card small,
.dark-mode .debt-simulator-card label,
.dark-mode .debt-simulator-card .debt-card-copy,
.dark-mode .debt-simulator-card .debt-sim-step-label,
.dark-mode .debt-simulator-card .debt-sim-section-note,
.dark-mode .debt-simulator-card .debt-sim-helper {
  color: #cbd5e1 !important;
}

/* Keep inputs/selects aligned with dark UI */
body.dark-mode .debt-simulator-card input,
body.dark-mode .debt-simulator-card select,
html[data-theme="dark"] .debt-simulator-card input,
html[data-theme="dark"] .debt-simulator-card select,
.dark-mode .debt-simulator-card input,
.dark-mode .debt-simulator-card select {
  background: #0f172a !important;
  border-color: rgba(148,163,184,0.30) !important;
  color: #eaf1fb !important;
}

/* Most aggressive fallback for simulation only: neutralize remaining pale rgba/white blocks */
body.dark-mode .debt-simulator-card [style*="background: rgba(255"],
body.dark-mode .debt-simulator-card [style*="background:rgba(255"],
body.dark-mode .debt-simulator-card [style*="background: #fff"],
body.dark-mode .debt-simulator-card [style*="background:#fff"],
body.dark-mode .debt-simulator-card [style*="background: white"],
body.dark-mode .debt-simulator-card [style*="background:white"],
html[data-theme="dark"] .debt-simulator-card [style*="background: rgba(255"],
html[data-theme="dark"] .debt-simulator-card [style*="background:rgba(255"],
html[data-theme="dark"] .debt-simulator-card [style*="background: #fff"],
html[data-theme="dark"] .debt-simulator-card [style*="background:#fff"],
html[data-theme="dark"] .debt-simulator-card [style*="background: white"],
html[data-theme="dark"] .debt-simulator-card [style*="background:white"] {
  background: rgba(15,23,42,0.92) !important;
  color: #eaf1fb !important;
  border-color: rgba(148,163,184,0.24) !important;
}


/* === v1351 Final simulator outer-frame dark mode fix === */

/* Remove remaining light frame/background around simulator popup */
body.dark-mode .debt-modal-overlay:has(.debt-simulator-card),
body.dark-mode .modal-overlay:has(.debt-simulator-card),
html[data-theme="dark"] .debt-modal-overlay:has(.debt-simulator-card),
html[data-theme="dark"] .modal-overlay:has(.debt-simulator-card),
.dark-mode .debt-modal-overlay:has(.debt-simulator-card),
.dark-mode .modal-overlay:has(.debt-simulator-card) {
  background: rgba(2,6,23,0.78) !important;
  backdrop-filter: blur(10px) !important;
}

/* White framing / inner wrapper cleanup */
body.dark-mode .debt-modal:has(.debt-simulator-card) > *,
body.dark-mode .debt-detail-modal:has(.debt-simulator-card) > *,
html[data-theme="dark"] .debt-modal:has(.debt-simulator-card) > *,
html[data-theme="dark"] .debt-detail-modal:has(.debt-simulator-card) > *,
.dark-mode .debt-modal:has(.debt-simulator-card) > *,
.dark-mode .debt-detail-modal:has(.debt-simulator-card) > * {
  background-color: transparent !important;
}

/* Remove bright outer gutters specifically visible at left/right */
body.dark-mode .debt-simulator-card::before,
body.dark-mode .debt-simulator-card::after,
html[data-theme="dark"] .debt-simulator-card::before,
html[data-theme="dark"] .debt-simulator-card::after,
.dark-mode .debt-simulator-card::before,
.dark-mode .debt-simulator-card::after {
  background: transparent !important;
}

/* Any remaining pale containers inside simulator modal */
body.dark-mode .debt-modal:has(.debt-simulator-card) .modal-body,
body.dark-mode .debt-modal:has(.debt-simulator-card) .modal-content,
body.dark-mode .debt-modal:has(.debt-simulator-card) .expense-modal-content,
body.dark-mode .debt-detail-modal:has(.debt-simulator-card) .modal-body,
body.dark-mode .debt-detail-modal:has(.debt-simulator-card) .modal-content,
body.dark-mode .debt-detail-modal:has(.debt-simulator-card) .expense-modal-content,
html[data-theme="dark"] .debt-modal:has(.debt-simulator-card) .modal-body,
html[data-theme="dark"] .debt-modal:has(.debt-simulator-card) .modal-content,
html[data-theme="dark"] .debt-modal:has(.debt-simulator-card) .expense-modal-content,
html[data-theme="dark"] .debt-detail-modal:has(.debt-simulator-card) .modal-body,
html[data-theme="dark"] .debt-detail-modal:has(.debt-simulator-card) .modal-content,
html[data-theme="dark"] .debt-detail-modal:has(.debt-simulator-card) .expense-modal-content,
.dark-mode .debt-modal:has(.debt-simulator-card) .modal-body,
.dark-mode .debt-modal:has(.debt-simulator-card) .modal-content,
.dark-mode .debt-modal:has(.debt-simulator-card) .expense-modal-content,
.dark-mode .debt-detail-modal:has(.debt-simulator-card) .modal-body,
.dark-mode .debt-detail-modal:has(.debt-simulator-card) .modal-content,
.dark-mode .debt-detail-modal:has(.debt-simulator-card) .expense-modal-content {
  background:
    radial-gradient(circle at 100% 0%, rgba(56,189,248,0.06), transparent 40%),
    linear-gradient(145deg, rgba(11,18,32,0.995), rgba(5,8,16,0.995)) !important;
  color: #eaf1fb !important;
}


/* ══════════════════════════════════════════════════════════════════════
   v758 · SMART INSIGHTS KPI TILES → OVERVIEW-KPI TREATMENT, IN PURPLE
   Re-skins the four signal tiles (forecast / budget / subscriptions / actions)
   to match the Overview KPI tiles: saturated dark gradient, white text, glow
   shadow, hover lift, glassy icon badge — same in light and dark mode, but
   purple instead of blue. Pure UI: values are set via safeText (no semantic
   classes), so uniform-white matches current behaviour. Icon badges are
   CSS-only (::after keyed on data-si-signal); no HTML/JS touched.
   ────────────────────────────────────────────────────────────────────── */

/* Tile shell — purple gradient + white text + glow (light / default) */
[data-view="smart-insights"] .smart-insights-signal{
  border-radius:16px !important;
  padding:15px 48px 15px 16px !important;
  color:#fff !important;
  border:1px solid rgba(167,139,250,0.30) !important;
  background:
    linear-gradient(160deg, rgba(255,255,255,0.10), transparent 34%),
    radial-gradient(440px 220px at 88% -35%, rgba(167,139,250,0.30), transparent 60%),
    linear-gradient(140deg, #251357 0%, #3c2090 55%, #1b0f44 100%) !important;
  box-shadow:0 2px 6px rgba(15,23,42,0.12), 0 18px 40px -16px rgba(94,23,235,0.50) !important;
  transition:transform .18s, box-shadow .18s !important;
}
[data-view="smart-insights"] .smart-insights-signal:hover{
  transform:translateY(-3px) !important;
  box-shadow:0 4px 10px rgba(15,23,42,0.14), 0 26px 54px -16px rgba(94,23,235,0.60) !important;
}
/* drop the coloured top bar — the Overview KPI tiles have none */
[data-view="smart-insights"] .smart-insights-signal::before{display:none !important;}

/* glassy icon badge (replaces the ui-3d corner-glow ::after), one per signal */
[data-view="smart-insights"] .smart-insights-signal::after{
  top:12px; right:12px; left:auto; bottom:auto;
  width:30px; height:30px; border-radius:10px;
  display:grid; place-items:center; line-height:1; font-size:.95rem;
  z-index:2; pointer-events:none;
  background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.22);
}
[data-view="smart-insights"] .smart-insights-signal[data-si-signal="forecast"]::after{content:"🔮";}
[data-view="smart-insights"] .smart-insights-signal[data-si-signal="budget"]::after{content:"📊";}
[data-view="smart-insights"] .smart-insights-signal[data-si-signal="subscriptions"]::after{content:"🔁";}
[data-view="smart-insights"] .smart-insights-signal[data-si-signal="actions"]::after{content:"🎯";}

/* legible text on the purple fill (light / default) */
[data-view="smart-insights"] .smart-insights-signal .si-signal-label{color:rgba(255,255,255,0.64) !important;}
[data-view="smart-insights"] .smart-insights-signal .si-signal-value{color:#ffffff !important;}
[data-view="smart-insights"] .smart-insights-signal .si-signal-sub{color:rgba(255,255,255,0.64) !important;}

/* DARK MODE — same purple treatment (supersedes the existing dark navy rule) */
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-signal{
  border:1px solid rgba(167,139,250,0.28) !important;
  background:
    linear-gradient(160deg, rgba(255,255,255,0.08), transparent 34%),
    radial-gradient(440px 220px at 88% -35%, rgba(167,139,250,0.26), transparent 60%),
    linear-gradient(140deg, #221250 0%, #341c80 55%, #170d3a 100%) !important;
  box-shadow:0 2px 6px rgba(0,0,0,0.30), 0 18px 42px -16px rgba(94,23,235,0.55) !important;
  color:#fff !important;
}
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-signal .si-signal-value{color:#ffffff !important;}
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-signal .si-signal-label,
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-signal .si-signal-sub{color:rgba(255,255,255,0.64) !important;}
/* ── end v758 ── */

/* ══════════════════════════════════════════════════════════════════════
   v759 · "WHAT CHANGED" (Month briefing) CARD → PURPLE, MATCHING THE KPIs
   Same saturated-purple treatment as the v758 KPI tiles, sized up for the
   wider briefing panel: purple gradient shell + white header + frosted-glass
   sub-cards with light text. Applies in light and dark mode. All briefing
   text is set via safeText (no semantic colour), so uniform-light is safe.
   Scoped to .smart-insights-briefing so the "Insight cards" header below —
   which reuses .smart-insights-section-head/.kicker/.pill — is untouched.
   ────────────────────────────────────────────────────────────────────── */

/* Shell — purple gradient + glow (light / default) */
[data-view="smart-insights"] .smart-insights-briefing{
  color:#fff !important;
  border:1px solid rgba(167,139,250,0.28) !important;
  background:
    linear-gradient(160deg, rgba(255,255,255,0.10), transparent 30%),
    radial-gradient(680px 320px at 92% -30%, rgba(167,139,250,0.30), transparent 60%),
    linear-gradient(140deg, #2a1762 0%, #43269c 55%, #1c1046 100%) !important;
  box-shadow:0 4px 10px rgba(15,23,42,0.10), 0 22px 50px -18px rgba(94,23,235,0.50) !important;
}
/* drop the leftover ui-3d top bar (KPI tiles have none) */
[data-view="smart-insights"] .smart-insights-briefing::before{display:none !important;}
/* Header text + month pill */
[data-view="smart-insights"] .smart-insights-briefing .smart-insights-kicker{color:rgba(255,255,255,0.62) !important;}
[data-view="smart-insights"] .smart-insights-briefing .smart-insights-section-head h3{color:#ffffff !important;}
[data-view="smart-insights"] .smart-insights-briefing .smart-insights-section-pill{
  background:rgba(255,255,255,0.12) !important;
  border:1px solid rgba(255,255,255,0.22) !important;
  color:rgba(255,255,255,0.85) !important;
}
/* Sub-cards — frosted glass on the purple shell */
[data-view="smart-insights"] .smart-insights-briefing .si-briefing-card{
  background:rgba(255,255,255,0.08) !important;
  border:1px solid rgba(255,255,255,0.14) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.06), 0 8px 18px rgba(20,10,50,0.18) !important;
}
[data-view="smart-insights"] .smart-insights-briefing .si-briefing-card span{color:rgba(255,255,255,0.60) !important;}
[data-view="smart-insights"] .smart-insights-briefing .si-briefing-card strong{color:#ffffff !important;}
[data-view="smart-insights"] .smart-insights-briefing .si-briefing-card small{color:rgba(255,255,255,0.76) !important;}

/* DARK MODE — same purple (supersedes the existing dark navy briefing rules) */
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-briefing{
  border:1px solid rgba(167,139,250,0.26) !important;
  background:
    linear-gradient(160deg, rgba(255,255,255,0.07), transparent 30%),
    radial-gradient(680px 320px at 92% -30%, rgba(167,139,250,0.24), transparent 60%),
    linear-gradient(140deg, #241356 0%, #3a2089 55%, #180e3e 100%) !important;
  box-shadow:0 4px 10px rgba(0,0,0,0.30), 0 22px 50px -18px rgba(94,23,235,0.50) !important;
}
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-briefing .si-briefing-card{
  background:rgba(255,255,255,0.06) !important;
  border:1px solid rgba(255,255,255,0.12) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.05), 0 8px 18px rgba(0,0,0,0.26) !important;
}
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-briefing .si-briefing-card span{color:rgba(255,255,255,0.58) !important;}
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-briefing .si-briefing-card strong{color:#ffffff !important;}
html[data-theme="dark"] [data-view="smart-insights"] .smart-insights-briefing .si-briefing-card small{color:rgba(255,255,255,0.74) !important;}
/* ── end v759 ── */