.legacy-metric-page {
  --legacy-page-card: linear-gradient(135deg, #1e2a4a 0%, #1b1d3c 42%, #162040 100%);
  --legacy-page-border: rgba(126, 148, 198, 0.26);
  --legacy-page-text: #f8fafc;
  --legacy-page-muted: rgba(226, 232, 240, 0.72);
  --legacy-page-accent: #18f0ff;
  --legacy-page-gap: clamp(0.9rem, 1.8vw, 1.5rem);
  color: var(--legacy-page-text);
}

.legacy-metric-page .tile-card {
  background: var(--legacy-page-card) !important;
  border: 1px solid var(--legacy-page-border) !important;
  border-radius: 0.7rem !important;
  box-shadow: 0 1.15rem 2.8rem rgba(0, 0, 0, 0.18) !important;
}

.legacy-metric-page .tile-card .card-body { min-width: 0; }
.legacy-metric-page .tile-card h5,
.legacy-metric-page .tile-card h6 { color: var(--legacy-page-text); font-weight: 600; letter-spacing: 0; }
.legacy-metric-page .tile-card p,
.legacy-metric-page .tile-card span { color: inherit; }
.legacy-metric-page .dash-graph { min-width: 0; }

.legacy-metric-page .nav-tabs { border-bottom: 1px solid var(--legacy-page-border); gap: 0.25rem; }
.legacy-metric-page .nav-tabs .nav-link {
  color: var(--legacy-page-muted);
  border: 1px solid transparent;
  border-radius: 0.35rem 0.35rem 0 0;
  background: transparent;
}
.legacy-metric-page .nav-tabs .nav-link:hover { border-color: var(--legacy-page-border); color: var(--legacy-page-text); }
.legacy-metric-page .nav-tabs .nav-link.active {
  color: var(--legacy-page-text);
  border-color: var(--legacy-page-border) var(--legacy-page-border) transparent;
  background: rgba(24, 240, 255, 0.08);
}

.legacy-metric-page .Select-control,
.legacy-metric-page .Select-menu-outer,
.legacy-metric-page .Select-value,
.legacy-metric-page .Select-placeholder {
  background: rgba(8, 14, 34, 0.88);
  color: var(--legacy-page-text);
}
.legacy-metric-page .Select-control { border: 1px solid rgba(126, 148, 198, 0.48); border-radius: 5px; box-shadow: none; }
.legacy-metric-page .is-focused .Select-control { border-color: var(--legacy-page-accent); box-shadow: 0 0 0 2px rgba(24, 240, 255, 0.14); }
.legacy-metric-page .VirtualizedSelectOption { background: rgba(8, 14, 34, 0.98); color: var(--legacy-page-text); }
.legacy-metric-page .VirtualizedSelectFocusedOption { background: rgba(24, 240, 255, 0.16); color: #ffffff; }

.legacy-metric-page .mantine-Carousel-root { min-width: 0; }
.legacy-metric-page .mantine-Carousel-control { border-color: var(--legacy-page-border); background: rgba(8, 14, 34, 0.82); color: var(--legacy-page-text); }
.legacy-metric-page .mantine-Carousel-indicator { background: rgba(226, 232, 240, 0.45); }
.legacy-metric-page .mantine-Carousel-indicator[data-active] { background: var(--legacy-page-accent); }

@media (max-width: 991.98px) {
  .legacy-metric-page { --legacy-page-gap: 1rem; }
  .legacy-metric-page .tile-card { border-radius: 0.55rem !important; }
}