/**
 * Dashboard desktop premium hierarchy — unlayered, load AFTER dashboard*.css,
 * daily-review.css, panel.css, finance-tables.css so cascade wins vs @layer pages
 * and vs early unlayered style.css where specificity allows.
 * Scope: body.use-new-ui.route-dashboard, viewport ≥769px only.
 */

@media (min-width: 769px) {
  /* —— Page chrome —— */
  body.use-new-ui.route-dashboard #contentScroll.content-scroll {
    background: transparent;
  }

  body.dark.use-new-ui.route-dashboard #contentScroll.content-scroll {
    background: #0b1220;
    background-image: linear-gradient(180deg, #0f172a 0%, #0b1220 42%, #0b1220 100%);
  }

  /* Vertical rhythm: less air between major blocks */
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-premium-wrap.dashboard-owner-v2 {
    gap: 10px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-premium-wrap.dashboard-owner-v2 > .toolbar.dashboard-toolbar-premium {
    margin-top: 0;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-toolbar-premium {
    gap: 10px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-mid-grid {
    gap: 10px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-lower-grid {
    margin-top: 6px;
    gap: 10px;
  }

  /* —— Toolbar chips & segmented filter —— */
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout #hydraDashQuickStats .quick-chip {
    background: #f8fafc;
    border: 1px solid rgba(226, 232, 240, 0.95);
    padding: 8px 10px;
    border-radius: 12px;
    box-shadow: 0 1px 1px rgba(15, 23, 42, 0.03);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout #hydraDashQuickStats .quick-chip span {
    font-size: var(--type-kpi-label);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-secondary, #5f6b7c);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout #hydraDashQuickStats .quick-chip strong {
    font-size: var(--fs-lg);
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
    color: #0f172a;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .segment-control {
    background: #eef2f7;
    border: 1px solid rgba(203, 213, 225, 0.95);
    border-radius: 999px;
    padding: 5px;
    gap: 3px;
    box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.65);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .segment-btn {
    min-height: 34px;
    padding: 0 14px;
    font-size: var(--type-chip);
    font-weight: 650;
    letter-spacing: 0.01em;
    color: #475569;
    transition: background-color 120ms ease, color 120ms ease, box-shadow 180ms ease;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .segment-btn.active {
    background: #0f172a;
    color: #f8fafc;
    font-weight: 750;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-period-filter-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-filter-tabs {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    max-width: 100%;
    min-width: 0;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-filter-tabs::-webkit-scrollbar {
    display: none;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-filter-tabs .segment-btn,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-filter-tabs .dashboard-period-btn {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-month-tabs {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    max-width: 100%;
    min-width: 0;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-month-tabs::-webkit-scrollbar {
    display: none;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-month-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    min-width: 0;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-month-chip {
    flex: 0 0 auto;
    min-height: 34px;
    min-width: 36px;
    padding: 0 8px;
    border: 1px solid rgba(203, 213, 225, 0.95);
    border-radius: 8px;
    background: #ffffff;
    color: #475569;
    font-size: 12px;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    cursor: pointer;
    transition: background-color 120ms ease, color 120ms ease, border-color 120ms ease, box-shadow 180ms ease;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-month-chip:hover {
    border-color: #94a3b8;
    color: #0f172a;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-month-chip.is-soft {
    background: #f8fafc;
    color: #64748b;
    border-color: rgba(226, 232, 240, 0.95);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-month-chip.is-active,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-month-row.is-period-month .dashboard-month-chip.is-active {
    background: linear-gradient(120deg, #3b82f6, #2563eb);
    border-color: transparent;
    color: #ffffff;
    box-shadow: 0 6px 14px rgba(37, 99, 235, 0.22);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-period-btn.is-active,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-period-btn.active {
    background: linear-gradient(120deg, #1e3a5f, #0f172a);
    color: #f8fafc;
    font-weight: 750;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-year-select {
    flex: 0 0 auto;
    min-height: 34px;
    max-width: 88px;
    margin-left: 4px;
    padding: 0 28px 0 10px;
    font-size: var(--fs-sm);
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    border-radius: 8px;
    border: 1px solid rgba(203, 213, 225, 0.95);
    background: #ffffff;
    color: #0f172a;
    cursor: pointer;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-range-row.dashboard-custom-range:not(.dashboard-range-row--mobile) {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 12px;
    align-items: end;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(203, 213, 225, 0.85);
    background: rgba(248, 250, 252, 0.92);
    max-width: 100%;
    min-width: 0;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-range-row.dashboard-custom-range .dashboard-range-fields {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 8px 10px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-range-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-range-label {
    font-size: 12px;
    font-weight: 650;
    color: #64748b;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-date-input {
    min-height: 34px;
    padding: 4px 10px;
    border-radius: 8px;
    border: 1px solid rgba(203, 213, 225, 0.95);
    background: #ffffff;
    color: #0f172a;
    font-size: 13px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-range-sep {
    color: #94a3b8;
    font-size: 14px;
    font-weight: 700;
    padding-bottom: 6px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-range-summary {
    flex: 1 1 auto;
    min-width: 140px;
    font-size: 13px;
    font-weight: 700;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-range-summary--empty {
    color: #64748b;
    font-weight: 600;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-range-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-left: auto;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-toggle-group {
    gap: 6px;
    padding: 4px;
    border-radius: 10px;
    background: #eef2f7;
    border: 1px solid rgba(203, 213, 225, 0.85);
    box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.55);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-toggle-group .btn {
    min-height: 34px;
    padding: 0 12px;
    font-size: var(--type-chip);
    font-weight: 650;
    border-radius: 8px;
    transition: background-color 120ms ease, color 120ms ease, border-color 120ms ease, box-shadow 180ms ease;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-toggle-group .btn.secondary {
    background: transparent;
    border: 1px solid transparent;
    color: #475569;
    box-shadow: none;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-toggle-group .btn.primary {
    background: #0f172a;
    border-color: #0f172a;
    color: #f8fafc;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-toggle-group .btn.secondary:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.55);
    color: #0f172a;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-toggle-group .btn.primary:hover:not(:disabled) {
    background: #1e293b;
    border-color: #1e293b;
    color: #f8fafc;
  }

  /* —— Daily review —— stronger hierarchy, same vertical budget —— */
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.daily-review-shell {
    background: #ffffff;
    border: 1px solid rgba(203, 213, 225, 0.95);
    border-radius: 14px;
    box-shadow:
      0 1px 2px rgba(15, 23, 42, 0.04),
      inset 0 1px 0 rgba(255, 255, 255, 0.85);
    overflow: hidden;
    transition: box-shadow 180ms ease;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-head {
    padding: 9px 14px 6px;
    gap: 8px 12px;
    border-bottom: 1px solid rgba(203, 213, 225, 0.95);
    background: #ffffff;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-head h2 {
    font-size: var(--type-section-title);
    font-weight: 700;
    line-height: var(--lh-tight);
    letter-spacing: -0.02em;
    color: #0f172a;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-sub {
    margin: 2px 0 0;
    font-size: var(--type-kpi-meta);
    line-height: var(--lh-normal);
    font-weight: 500;
    color: var(--text-secondary, #5f6b7c);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-badge {
    padding: 3px 9px;
    font-size: var(--fs-sm);
    font-weight: 700;
    letter-spacing: 0.02em;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-badge--neutral {
    border: 1px solid rgba(129, 140, 248, 0.38);
    background: linear-gradient(135deg, rgba(238, 242, 255, 0.98), rgba(239, 246, 255, 0.95));
    color: #4338ca;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-badge--good {
    border-color: rgba(34, 197, 94, 0.42);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-badge--warn {
    border-color: rgba(245, 158, 11, 0.48);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-metrics {
    gap: 8px;
    padding: 8px 14px 4px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-metric {
    padding: 6px 8px 5px;
    border-radius: 10px;
    background: #f1f5f9;
    border: 1px solid rgba(203, 213, 225, 0.88);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-metric .lbl {
    font-size: var(--type-kpi-label);
    letter-spacing: 0.06em;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--text-secondary, #5f6b7c);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-metric .val {
    font-size: var(--type-kpi-value-sm);
    margin-top: 2px;
    line-height: 1.15;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
    color: #0f172a;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-metric .sub {
    font-size: var(--type-kpi-meta);
    margin-top: 1px;
    color: var(--text-secondary, #5f6b7c);
    font-weight: 600;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-compare {
    padding: 0 14px 5px;
    font-size: var(--type-kpi-meta);
    gap: 6px 10px;
    line-height: 1.32;
    font-weight: 600;
    color: #334155;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-trends {
    padding: 4px 14px 6px;
    gap: 3px;
    border-top: 1px dashed rgba(203, 213, 225, 0.75);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-trend-row {
    font-size: var(--type-kpi-meta);
    gap: 6px 10px;
    color: #475569;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-trend-row .spark {
    opacity: 0.72;
    font-size: var(--fs-sm);
    font-variant-numeric: tabular-nums;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-insights {
    padding: 6px 14px 8px 24px;
    font-size: var(--type-kpi-meta);
    line-height: 1.36;
    background: #f8fafc;
    border-top: 1px solid rgba(203, 213, 225, 0.88);
    color: #334155;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-insights li {
    margin-bottom: 3px;
  }

  /* —— Hero KPI —— typography + tone (no full-bleed color) —— */
  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi.dashboard-kpi-grid {
    gap: 12px;
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card {
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(205, 214, 228, 0.72);
    border-radius: 22px;
    box-shadow:
      0 1px 2px rgba(15, 23, 42, 0.03),
      0 12px 28px rgba(15, 23, 42, 0.04);
    padding: 18px 20px 16px;
    min-height: 136px;
    box-sizing: border-box;
    border-top: 2px solid transparent;
    transition: box-shadow 180ms ease;
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card--secondary {
    background: #f8fafc;
    border-top-color: transparent;
    box-shadow: none;
    border-color: rgba(226, 232, 240, 0.88);
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card.kpi-tone-revenue {
    border-top-color: rgba(59, 130, 246, 0.78);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 12px 28px rgba(59, 130, 246, 0.11);
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card.kpi-tone-profit {
    border-top-color: rgba(16, 185, 129, 0.75);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 12px 28px rgba(16, 185, 129, 0.11);
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card.kpi-tone-cod {
    border-top-color: rgba(245, 158, 11, 0.78);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 12px 28px rgba(245, 158, 11, 0.12);
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card.kpi-tone-orders {
    border-top-color: rgba(99, 102, 241, 0.75);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 12px 28px rgba(99, 102, 241, 0.12);
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-head .card-title {
    font-size: var(--type-kpi-label);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-secondary, #5f6b7c);
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    font-size: 20px;
    line-height: 1;
    opacity: 1;
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card.kpi-tone-revenue .premium-kpi-icon {
    background: rgba(59, 130, 246, 0.16);
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card.kpi-tone-profit .premium-kpi-icon {
    background: rgba(16, 185, 129, 0.16);
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card.kpi-tone-cod .premium-kpi-icon {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.18), rgba(6, 182, 212, 0.12));
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card.kpi-tone-orders .premium-kpi-icon {
    background: rgba(99, 102, 241, 0.17);
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card--secondary .premium-kpi-icon {
    background: rgba(100, 116, 139, 0.12);
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card:not(.premium-kpi-card--secondary) .card-value {
    font-size: var(--type-kpi-value);
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.05;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
    color: #0f172a;
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card--secondary .card-value {
    font-size: var(--type-kpi-value-sm);
    font-weight: 800;
    line-height: 1.05;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
    color: #0f172a;
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-foot {
    margin-top: 8px;
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-foot .kpi-trend {
    font-size: var(--type-kpi-meta);
    font-weight: 500;
    letter-spacing: 0;
    color: var(--text-secondary, #5f6b7c);
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card:not(.premium-kpi-card--secondary) .kpi-sparkline {
    opacity: 0.58;
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card--secondary .kpi-sparkline {
    opacity: 0.45;
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card.kpi-tone-revenue .kpi-sparkline path {
    stroke: rgba(59, 130, 246, 0.58);
    stroke-width: 1.85;
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card.kpi-tone-profit .kpi-sparkline path {
    stroke: rgba(16, 185, 129, 0.58);
    stroke-width: 1.85;
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card.kpi-tone-cod .kpi-sparkline path {
    stroke: rgba(217, 119, 6, 0.62);
    stroke-width: 1.85;
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card.kpi-tone-orders .kpi-sparkline path {
    stroke: rgba(99, 102, 241, 0.58);
    stroke-width: 1.85;
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card--secondary .kpi-sparkline path {
    stroke: rgba(100, 116, 139, 0.45);
    stroke-width: 1.65;
  }

  /* —— Operational insight strip —— */
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-insight-row {
    gap: 10px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-insight-card {
    padding: 7px 10px;
    gap: 8px;
    border-radius: 12px;
    background: #f8fafc;
    border: 1px solid rgba(226, 232, 240, 0.95);
    box-shadow: 0 1px 1px rgba(15, 23, 42, 0.03);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-insight-icon {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    font-size: 14px;
    background: rgba(100, 116, 139, 0.1);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-insight-main {
    gap: 1px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-insight-title {
    font-size: var(--type-kpi-label);
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-secondary, #5f6b7c);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-insight-value {
    font-size: var(--fs-lg);
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
    color: #0f172a;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-insight-meta,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-insight-note {
    font-size: var(--type-kpi-meta);
    line-height: 1.28;
    color: var(--text-secondary, #5f6b7c);
  }

  /* —— Mid grid: snapshot + warnings —— */
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.owner-snapshot-panel,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.owner-warning-panel {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.95);
    border-radius: 14px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    padding: 10px 12px;
    transition: box-shadow 180ms ease;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-timeline {
    gap: 6px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-timeline-item {
    padding: 6px 8px;
    gap: 8px;
    border-radius: 10px;
    background: #f8fafc;
    border: 1px solid rgba(226, 232, 240, 0.88);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-warning-count {
    font-size: var(--fs-sm);
    margin-bottom: 4px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-warning-item {
    padding: 6px 9px;
    font-size: var(--type-kpi-meta);
    border-radius: 9px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-warning-healthy {
    padding: 6px 0;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-health-box {
    padding: 8px;
    gap: 8px;
  }

  /* —— Main white panels (source, top products, profit, activity) —— */
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.dashboard-source-panel,
  body.use-new-ui.route-dashboard .app-layout #hydraDashTopProducts > .panel,
  body.use-new-ui.route-dashboard .app-layout #hydraDashProfitPanels > .panel,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.premium-activity-panel,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.premium-inventory-alerts {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.95);
    border-radius: 14px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.045);
    transition: box-shadow 180ms ease;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .activity-item {
    background: #f8fafc;
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 12px;
    box-shadow: none;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .activity-item:hover {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
  }

  /* —— Chart zone (muted well) —— */
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-wrapper,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-wrapper--compact {
    height: 220px;
    max-height: 220px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-wrapper {
    background: #eef2f7;
    border: 1px solid rgba(226, 232, 240, 0.88);
    border-radius: 12px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-wrapper canvas {
    height: 220px !important;
  }

  /* —— Dashboard typography (panels) —— */
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel h3,
  body.use-new-ui.route-dashboard .app-layout #hydraDashTopProducts > .panel h3,
  body.use-new-ui.route-dashboard .app-layout #hydraDashProfitPanels > .panel h3 {
    font-size: var(--type-section-title);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: var(--lh-tight);
    color: #0f172a;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .compact-list-head .card-title,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel .card-title {
    font-size: var(--type-kpi-label);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-secondary, #5f6b7c);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .muted,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-source-data-note {
    color: var(--text-secondary, #5f6b7c);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .money-col {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
  }

  /* —— Actionable rows: micro-lift 120ms (data-owner-* only) —— */
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-insight-card[data-owner-route],
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-warning-item[data-owner-route],
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-activity-row[data-owner-act] {
    transition: transform 120ms ease, box-shadow 180ms ease;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-insight-card[data-owner-route]:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-warning-item[data-owner-route]:hover {
    transform: translateY(-1px);
    box-shadow: 0 3px 12px rgba(15, 23, 42, 0.08);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-activity-row[data-owner-act]:hover {
    transform: translateY(-1px);
    box-shadow: 0 3px 12px rgba(15, 23, 42, 0.07);
  }

  /* —— Dark mode —— */
  body.dark.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card {
    background: rgba(15, 23, 42, 0.78);
    border-color: rgba(51, 65, 85, 0.55);
  }

  body.dark.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card--secondary {
    background: rgba(15, 23, 42, 0.52);
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout #hydraDashQuickStats .quick-chip,
  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .segment-control {
    background: rgba(15, 23, 42, 0.55);
    border-color: rgba(51, 65, 85, 0.55);
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.daily-review-shell {
    background: linear-gradient(155deg, rgba(15, 23, 42, 0.96), rgba(30, 41, 59, 0.92));
    border-color: rgba(71, 85, 105, 0.55);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-head {
    background: transparent;
    border-bottom-color: rgba(71, 85, 105, 0.45);
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-metric {
    background: rgba(15, 23, 42, 0.38);
    border-color: rgba(71, 85, 105, 0.42);
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-insights {
    background: rgba(15, 23, 42, 0.3);
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-insight-card {
    background: rgba(15, 23, 42, 0.55);
    border-color: rgba(51, 65, 85, 0.55);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-insight-card[data-owner-route]:hover {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.28);
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-head h2,
  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel h3,
  body.dark.use-new-ui.route-dashboard .app-layout #hydraDashTopProducts > .panel h3,
  body.dark.use-new-ui.route-dashboard .app-layout #hydraDashProfitPanels > .panel h3 {
    color: #f1f5f9;
  }

  body.dark.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card:not(.premium-kpi-card--secondary) .card-value,
  body.dark.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card--secondary .card-value {
    color: #f8fafc;
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout #hydraDashQuickStats .quick-chip strong {
    color: #f1f5f9;
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .daily-review-badge--neutral {
    border-color: rgba(129, 140, 248, 0.35);
    background: linear-gradient(135deg, rgba(49, 46, 129, 0.45), rgba(30, 41, 59, 0.55));
    color: #c7d2fe;
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-toggle-group {
    background: rgba(15, 23, 42, 0.55);
    border-color: rgba(51, 65, 85, 0.55);
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-toggle-group .btn.secondary {
    color: #cbd5e1;
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-toggle-group .btn.primary {
    background: #e2e8f0;
    border-color: #e2e8f0;
    color: #0f172a;
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .dashboard-filter-inputs input {
    background: rgba(15, 23, 42, 0.55);
    border-color: rgba(51, 65, 85, 0.55);
    color: #f1f5f9;
  }
  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.owner-warning-panel,
  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.dashboard-source-panel,
  body.dark.use-new-ui.route-dashboard .app-layout #hydraDashTopProducts > .panel,
  body.dark.use-new-ui.route-dashboard .app-layout #hydraDashProfitPanels > .panel,
  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.premium-activity-panel,
  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.premium-inventory-alerts {
    background: rgba(15, 23, 42, 0.78);
    border-color: rgba(51, 65, 85, 0.55);
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .owner-timeline-item {
    background: rgba(15, 23, 42, 0.45);
    border-color: rgba(51, 65, 85, 0.5);
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .activity-item {
    background: rgba(15, 23, 42, 0.45);
    border-color: rgba(51, 65, 85, 0.5);
  }

  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .chart-wrapper {
    background: rgba(15, 23, 42, 0.38);
    border-color: rgba(51, 65, 85, 0.45);
  }
}

/* —— Hard wins vs style.css .app-layout (unlayered + !important hover) —— */
@media (min-width: 769px) {
  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card {
    min-height: 120px !important;
    padding: 16px 18px 14px !important;
  }

  body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card:hover {
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08) !important;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.daily-review-shell:hover,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.dashboard-source-panel:hover,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.owner-snapshot-panel:hover,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.owner-warning-panel:hover,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.premium-activity-panel:hover,
  body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.premium-inventory-alerts:hover,
  body.use-new-ui.route-dashboard .app-layout #hydraDashTopProducts > .panel:hover,
  body.use-new-ui.route-dashboard .app-layout #hydraDashProfitPanels > .panel:hover {
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.07) !important;
  }

  body.dark.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-card:hover,
  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.dashboard-source-panel:hover,
  body.dark.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel.daily-review-shell:hover {
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.35) !important;
  }
}

/* —— Compact overview strip (desktop enterprise density) —— */
@media (min-width: 769px) {
  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact-wrap--desktop {
    margin-top: 12px;
    max-height: 180px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px 18px;
    max-height: 180px;
    box-sizing: border-box;
    border-radius: 14px;
    border: 1px solid rgba(226, 232, 240, 0.95);
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    overflow: hidden;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .dashboard-overview-compact-head {
    display: flex;
    flex-wrap: nowrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
    margin: 0;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .dashboard-overview-compact-title {
    margin: 0;
    font-size: 15px;
    font-weight: 750;
    line-height: 1.25;
    color: #0f172a;
    letter-spacing: -0.01em;
    white-space: nowrap;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .dashboard-overview-compact-date {
    margin-left: auto;
    font-size: 12px;
    font-weight: 500;
    color: #64748b;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    flex-shrink: 0;
  }

  /* Insight — thin line, no nested card */
  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .hydra-daily-insight-summary {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    border-radius: 0;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .hydra-daily-insight-summary__text {
    margin: 0;
    padding: 5px 10px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.35;
    color: #475569;
    background: rgba(248, 250, 252, 0.95);
    border: 1px solid rgba(226, 232, 240, 0.85);
    border-radius: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* Alert chips — single compact row */
  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .hydra-smart-insight-bar {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 0;
    min-height: 0;
    max-height: 36px;
    overflow: hidden;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .hydra-smart-insight {
    flex: 1 1 0;
    min-width: 0;
    max-width: none;
    height: 34px;
    padding: 0 12px;
    margin: 0;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .hydra-smart-insight__dot {
    width: 5px;
    height: 5px;
    flex-shrink: 0;
  }

  /* KPI strip — unified row */
  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .dashboard-overview-strip {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    min-height: 56px;
    max-height: 64px;
    height: 60px;
    overflow: hidden;
    margin: 0;
    border-radius: 10px;
    border: 1px solid rgba(226, 232, 240, 0.9);
    background: #f8fafc;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .dashboard-overview-strip-item {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    padding: 6px 10px;
    border-right: 1px solid rgba(226, 232, 240, 0.75);
    background: transparent;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .dashboard-overview-strip-item:last-child {
    border-right: 0;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .dashboard-overview-strip-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .dashboard-overview-strip-value {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .dashboard-overview-strip-value--truncate {
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-premium-wrap.dashboard-owner-v2 > .dashboard-hero {
    margin-top: 12px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-premium-wrap.dashboard-owner-v2 > .toolbar.dashboard-toolbar-premium {
    margin-bottom: 0;
  }

  /* Legacy fallback for overview without --desktop class */
  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact-wrap:not(.mobile-month-summary):not(.dashboard-overview-compact-wrap--desktop) {
    margin-top: 16px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact:not(.dashboard-overview-compact--desktop):not(.mobile-month-summary) {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid rgba(226, 232, 240, 0.95);
    background: linear-gradient(180deg, #fafbfc 0%, #f8fafc 100%);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  }
}

@media (min-width: 769px) and (max-width: 1100px) {
  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .dashboard-overview-strip {
    flex-wrap: nowrap;
    overflow-x: auto;
    max-height: 64px;
    min-height: 56px;
    scrollbar-width: thin;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact--desktop .dashboard-overview-strip-item {
    flex: 1 1 0;
    min-width: 88px;
    border-bottom: 0;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact:not(.dashboard-overview-compact--desktop) .dashboard-overview-strip {
    flex-wrap: wrap;
    max-height: none;
    min-height: 0;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact:not(.dashboard-overview-compact--desktop) .dashboard-overview-strip-item {
    flex: 1 1 calc(33.333% - 1px);
    min-width: 120px;
    border-bottom: 1px solid rgba(226, 232, 240, 0.75);
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact:not(.dashboard-overview-compact--desktop) .dashboard-overview-strip-item:nth-child(3n) {
    border-right: 0;
  }
}

@media (max-width: 768px) {
  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact-wrap {
    margin-top: 12px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact {
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(226, 232, 240, 0.95);
    background: #f8fafc;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact-head {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 8px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact-title {
    margin: 0;
    font-size: 13px;
    font-weight: 750;
    color: #0f172a;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-compact-date {
    font-size: 11px;
    color: #64748b;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-strip {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    padding-bottom: 4px;
    margin: 0 -4px;
    padding-left: 4px;
    padding-right: 4px;
  }

  body.use-new-ui.route-dashboard .app-layout .dashboard-overview-strip-item {
    flex: 0 0 auto;
    min-width: 108px;
    scroll-snap-align: start;
    padding: 8px 10px;
    border-radius: 10px;
    border: 1px solid rgba(226, 232, 240, 0.9);
    background: #ffffff;
    border-right: 1px solid rgba(226, 232, 240, 0.9);
  }
}