/* Final PC dashboard layer. Load after both legacy stylesheets: the unified
   card rules in desktop-early-warning.css otherwise win the cascade.
   Keep every rule gated so the mobile dashboard and shared menu are unchanged. */
@media (min-width: 851px) {
  body[data-page="dashboard"] {
    --dashboard-surface: #101c2a;
    --dashboard-line: rgba(137, 160, 190, .2);
    --dashboard-accent: #86a4ca;
    background: #09121e;
  }
  body[data-page="dashboard"]::before,
  body[data-page="dashboard"] .ambient-grid { display: none; }
  body[data-page="dashboard"] .dashboard-main {
    --cyan: var(--dashboard-accent);
    --teal: #86ada9;
    color: #d6dfea;
    font-family: var(--sans);
  }
  body[data-page="dashboard"] .dashboard-main .panel,
  body[data-page="dashboard"] .dashboard-main .situation-brief {
    background: var(--dashboard-surface);
    border-color: var(--dashboard-line) !important;
    box-shadow: none;
  }
  body[data-page="dashboard"] .dashboard-main .panel::after,
  body[data-page="dashboard"] .dashboard-main .situation-brief::after { display: none; }
  body[data-page="dashboard"] .situation-brief { padding-top: 24px; }
  body[data-page="dashboard"] .situation-brief > .gauge-panel { background: transparent; }
  body[data-page="dashboard"] .situation-brief__body {
    border-left-color: var(--dashboard-line) !important;
    padding-bottom: 24px;
  }
  body[data-page="dashboard"] #situationTitle,
  body[data-page="dashboard"] .dashboard-main .panel-heading h2 {
    margin-top: 0 !important;
    color: #b7c7da;
    font: 650 18px/1.4 var(--sans);
    letter-spacing: -.015em;
    text-shadow: none;
  }
  body[data-page="dashboard"] #situationConclusion {
    margin-top: 16px;
    color: #e0e7ef;
    font: 700 clamp(24px, 1.8vw, 29px)/1.5 var(--sans);
    letter-spacing: -.025em;
    text-wrap: balance;
  }
  body[data-page="dashboard"] .situation-brief #situationExplanation {
    margin-top: 14px;
    color: #b7c5d4;
    font: 480 16px/1.8 var(--sans);
  }
  body[data-page="dashboard"] .situation-brief #situationMobileUpdated {
    margin-top: 12px;
    color: #93a7bd;
    font: 500 12px/1.5 var(--sans);
  }
  body[data-page="dashboard"] .situation-lower-row {
    padding-top: 24px;
    gap: 24px;
  }
  body[data-page="dashboard"] .situation-causes > span {
    color: #a4b6cc;
    font: 650 13px/1.5 var(--sans);
  }
  body[data-page="dashboard"] .situation-lower-row .situation-causes li {
    min-height: 40px;
    padding: 10px 0;
    color: #c7d3df;
    font: 500 14px/1.6 var(--sans);
    border-bottom-color: var(--dashboard-line) !important;
  }
  body[data-page="dashboard"] .situation-lower-row .situation-causes li strong {
    color: #d6dfea;
    font: 650 14px/1.6 var(--sans);
  }
  body[data-page="dashboard"] .situation-cause-rank {
    filter: brightness(.85);
    text-shadow: none;
  }

  /* The visible four metrics use mobile-risk-summary even on the PC layout;
     styling the hidden situation-metrics does not change the screen. */
  body[data-page="dashboard"] .situation-brief > .gauge-panel .mobile-risk-summary dt {
    color: #a0b1c4;
    font: 550 12px/1.5 var(--sans);
    white-space: normal;
    word-break: keep-all;
  }
  body[data-page="dashboard"] .situation-brief > .gauge-panel .mobile-risk-summary dd {
    color: #d6dfea !important;
    font: 650 20px/1.4 var(--sans);
  }
  body[data-page="dashboard"] .situation-brief > .gauge-panel .mobile-risk-summary__icon {
    color: #9baec2;
    filter: none;
    width: 28px;
    height: 28px;
    flex-basis: 28px;
  }
  body[data-page="dashboard"] .situation-brief > .gauge-panel .mobile-risk-summary__icon svg {
    width: 28px;
    height: 28px;
  }
  body[data-page="dashboard"] .mobile-risk-summary__icon .icon-bracket { display: none; }
  body[data-page="dashboard"] .situation-brief > .gauge-panel .gauge-panel__meta .classification {
    min-height: 0;
    height: auto;
    padding: 0;
    align-items: center;
    font: 550 9px/1.4 var(--sans);
    letter-spacing: .03em;
  }
  body[data-page="dashboard"] .situation-brief > .gauge-panel .gauge-value-arc,
  body[data-page="dashboard"] .situation-brief > .gauge-panel .gauge-marker { filter: none; animation: none; }
  body[data-page="dashboard"] .gauge-track { stroke: #213040; }
  body[data-page="dashboard"] .gauge-ticks text { fill: #93a7bd; font: 550 11px var(--sans); }
  body[data-page="dashboard"] .situation-brief > .gauge-panel .gauge-score {
    top: 47%;
    display: grid;
    grid-template-columns: auto auto;
    justify-content: center;
    align-items: baseline;
    column-gap: 8px;
    row-gap: 12px;
  }
  body[data-page="dashboard"] .situation-brief > .gauge-panel .gauge-score strong {
    font: 650 clamp(84px, 6vw, 96px)/1 var(--sans);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.045em;
    text-shadow: none;
  }
  body[data-page="dashboard"] .gauge-score span { margin: 0; color: #95a9be; font: 550 14px/1.4 var(--sans); }
  body[data-page="dashboard"] .situation-brief > .gauge-panel .gauge-score small {
    position: static;
    inset: auto;
    grid-column: 1 / -1;
    justify-self: center;
    transform: none;
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 9px;
    font: 650 11px/1.4 var(--sans);
    letter-spacing: 0;
    box-shadow: none;
  }
  body[data-page="dashboard"] #globalStatus.is-critical { box-shadow: none !important; }
  body[data-page="dashboard"] #globalStatus.is-critical::before {
    box-shadow: none !important;
    vertical-align: initial;
    margin: 0 6px 0 0;
    align-self: center;
  }

  /* Natural height, no separate box. A vertical flow never leaves an arrow
     alone at the start of a wrapped line in this compact lower-row slot. */
  body[data-page="dashboard"] .desktop-analysis-status.situation-risk-transmission {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
    min-height: 0;
    padding: 0;
    border: 0 !important;
    background: transparent;
    box-shadow: none;
  }
  body[data-page="dashboard"] .situation-risk-transmission h3 {
    margin: 0;
    color: #a4b6cc;
    font: 650 13px/1.5 var(--sans);
    letter-spacing: 0;
  }
  body[data-page="dashboard"] .risk-transmission-flow {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  body[data-page="dashboard"] .risk-transmission-flow li {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    min-width: 0;
    color: #c8d5e4;
    font: 550 14px/1.6 var(--sans);
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: keep-all;
  }
  body[data-page="dashboard"] .risk-transmission-flow li + li::before {
    content: "↓";
    color: #7893b4;
    font-weight: 400;
    line-height: 1;
    margin-top: 4px;
  }
  body[data-page="dashboard"] .risk-transmission-empty {
    margin: 0;
    color: #91a6be;
    font: 500 13px/1.6 var(--sans);
  }
  body[data-page="dashboard"] .situation-risk-transmission [hidden] { display: none; }

  body[data-page="dashboard"] .dashboard-main .eyebrow { color: #90a7c1; font: 600 11px/1.5 var(--sans); letter-spacing: .04em; }
  body[data-page="dashboard"] .trend-summary { color: #a9bbcd; font: 500 14px/1.6 var(--sans); }
  body[data-page="dashboard"] .trend-stats { margin-top: 20px; }
  body[data-page="dashboard"] .trend-stats small { color: #9caec2; font: 550 12px/1.5 var(--sans); }
  body[data-page="dashboard"] .trend-stats strong { color: #d5dfeb; font: 650 17px/1.5 var(--sans); font-variant-numeric: tabular-nums; }
  body[data-page="dashboard"] .range-tabs button { padding: 7px 10px; color: #a2b3c7; font: 550 12px/1.5 var(--sans); }
  body[data-page="dashboard"] .range-tabs button.active { color: #d9e4f1; background: rgba(134,164,202,.13); box-shadow: none; }
  body[data-page="dashboard"] .chart-axis { color: #94a9c0; font: 500 12px/1.5 var(--sans); }
  body[data-page="dashboard"] .chart-wrap { background: none; }
  body[data-page="dashboard"] .chart-tooltip { font: 550 12px/1.6 var(--sans); }
  body[data-page="dashboard"] .desktop-radar-ring { fill: rgba(134,164,202,.025); stroke: rgba(134,164,202,.2); }
  body[data-page="dashboard"] .desktop-radar-axis { stroke: rgba(134,164,202,.16); stroke-dasharray: none; }
  body[data-page="dashboard"] .desktop-radar-value { fill: rgba(134,164,202,.12); stroke: var(--dashboard-accent); filter: none; }
  body[data-page="dashboard"] .desktop-radar-node {
    r: 5.1px;
    fill: color-mix(in srgb, var(--node-color), #101c2a 18%);
    fill-opacity: 1;
    stroke: color-mix(in srgb, var(--node-color), #101c2a 18%);
    stroke-width: 1.5;
    filter: none;
  }
  body[data-page="dashboard"] .dashboard-main .desktop-radar-label,
  body[data-page="dashboard"] .dashboard-main .desktop-radar-label tspan {
    stroke: none;
    stroke-width: 0;
    text-shadow: none;
    filter: none;
  }
  body[data-page="dashboard"] .dashboard-main .desktop-radar-label__title { fill: #d0d4d8; font: 550 13px var(--sans) !important; }
  body[data-page="dashboard"] .dashboard-main .desktop-radar-label__value,
  body[data-page="dashboard"] .dashboard-main .desktop-radar-label__value tspan {
    fill: #b7bec5 !important;
  }
  body[data-page="dashboard"] .dashboard-main .desktop-radar-label__value { font: 450 11px var(--sans) !important; }
  body[data-page="dashboard"] .dashboard-main .desktop-radar-label__score { font-weight: 650; }
  body[data-page="dashboard"] .dashboard-main .desktop-radar-label__prefix { font-weight: 450; }
  body[data-page="dashboard"] .dashboard-main .desktop-radar-label__confidence { fill: #929ca5 !important; }
  body[data-page="dashboard"] .dashboard-main .desktop-radar-label__level,
  body[data-page="dashboard"] .dashboard-main .desktop-radar-label__gap {
    display: none;
  }
  body[data-page="dashboard"] .dashboard-main .signals-panel .signal-state--inline {
    color: #b7bec5 !important;
    font: 600 9px/1.4 var(--sans);
  }
  body[data-page="dashboard"] .desktop-radar-label__tag {
    display: none;
    fill: #929ca5 !important;
    fill-opacity: .1 !important;
    stroke: #929ca5 !important;
    stroke-opacity: .25 !important;
    opacity: 1;
  }
  body[data-page="dashboard"] .desktop-radar-node-tag {
    pointer-events: none;
  }
  body[data-page="dashboard"] .desktop-radar-node-tag__text {
    fill: color-mix(in srgb, var(--node-color), #101c2a 18%);
    stroke: none;
    font: 550 8.5px var(--sans);
  }
  body[data-page="dashboard"] .desktop-radar-node-tag__background {
    fill: #101c2a;
    fill-opacity: .9;
    stroke: color-mix(in srgb, var(--node-color), #101c2a 18%);
    stroke-opacity: .35;
    stroke-width: .5;
  }
  body[data-page="dashboard"] .desktop-signal-radar__legend,
  body[data-page="dashboard"] .desktop-signal-radar__legend small { color: #929ca5; font: 500 12px/1.5 var(--sans); }
  body[data-page="dashboard"] .desktop-signal-radar__legend { flex-wrap: wrap; row-gap: 2px; }
  body[data-page="dashboard"] .desktop-signal-radar__legend .desktop-signal-radar__hint {
    flex-basis: 100%;
    color: #929ca5;
    font: 450 11px/1.5 var(--sans);
    text-align: center;
  }
  body[data-page="dashboard"] .signals-panel > .panel-heading h2 { color: #c2c9d0; }
  body[data-page="dashboard"] .signals-panel > .panel-heading .signal-radar-open { color: #adb5bd; font: 550 12px/1.5 var(--sans); }
  body[data-page="dashboard"] .signals-panel .signal-radar-detail .signal-item { background: transparent; box-shadow: none; }
  body[data-page="dashboard"] .signals-panel .signal-radar-detail .signal-item h3 { color: #d0d4d8; font: 650 16px/1.5 var(--sans); }
  body[data-page="dashboard"] .signals-panel .signal-radar-detail .signal-item p { color: #b7bec5; font: 500 14px/1.7 var(--sans); }
  body[data-page="dashboard"] .signals-panel .signal-radar-detail .signal-item__stats,
  body[data-page="dashboard"] .signals-panel .signal-radar-detail .signal-item__stat { color: #adb5bd; font: 550 12px/1.5 var(--sans); }
  body[data-page="dashboard"] .signals-panel .signal-radar-detail .signal-item__stat b,
  body[data-page="dashboard"] .signals-panel .signal-rank,
  body[data-page="dashboard"] .signals-panel .signal-time,
  body[data-page="dashboard"] .signals-panel .signal-radar-detail__back {
    color: #adb5bd !important;
  }
  body[data-page="dashboard"] .signal-meter { display: none; }
}

@media (min-width: 1181px) {
  /* Preserve one outer card and its dividers; add space inside each section. */
  body[data-page="dashboard"] main > .situation-brief ~ .trend-signals-grid {
    background: var(--dashboard-surface);
    border-color: var(--dashboard-line) !important;
    box-shadow: none;
    min-height: 480px;
  }
  body[data-page="dashboard"] .trend-signals-grid > .trend-panel,
  body[data-page="dashboard"] .trend-signals-grid > .intelligence-grid,
  body[data-page="dashboard"] .trend-signals-grid > .desktop-events-panel {
    height: 480px !important;
    min-height: 480px !important;
    border-color: var(--dashboard-line) !important;
  }
  body[data-page="dashboard"] .trend-signals-grid > .trend-panel { padding: 24px; }
  body[data-page="dashboard"] .trend-signals-grid > .trend-panel > .panel-heading { flex-wrap: wrap; gap: 12px; }
  body[data-page="dashboard"] .trend-signals-grid > .trend-panel .trend-summary { max-width: none; white-space: normal; font-size: 14px; line-height: 1.6; }
  body[data-page="dashboard"] .trend-signals-grid > .trend-panel .trend-stats { margin-top: 20px; }
  body[data-page="dashboard"] .trend-signals-grid > .trend-panel .range-tabs button { padding: 6px 10px; }
  body[data-page="dashboard"] .trend-signals-grid > .trend-panel .chart-wrap { height: 220px !important; min-height: 220px; margin-top: 16px; }
  body[data-page="dashboard"] .trend-signals-grid .signals-panel > .panel-heading { top: 24px; right: 24px; left: 24px; padding: 0; }
  body[data-page="dashboard"] .trend-signals-grid .signals-panel .desktop-signal-radar__chart { top: 20px; height: calc(100% - 32px); }
  body[data-page="dashboard"] .trend-signals-grid .signals-panel .desktop-signal-radar__legend { bottom: 16px; }
  body[data-page="dashboard"] .trend-signals-grid .signals-panel .signal-radar-detail { padding: 72px 24px 16px; }
  body[data-page="dashboard"] .trend-signals-grid > .desktop-events-panel { padding: 0 24px 16px; }
  body[data-page="dashboard"] .desktop-events-tabs { margin: 0 0 8px; }
  body[data-page="dashboard"] .desktop-events-tab { min-height: 61px; padding-top: 24px; }
  body[data-page="dashboard"] .desktop-events-tab b { color: #95abc7; font: 550 12px/1.5 var(--sans); }
  body[data-page="dashboard"] .desktop-events-tab.active::after { background: var(--dashboard-accent); box-shadow: none; }
  body[data-page="dashboard"] .desktop-events-tab.active b { color: #c2d1e5; }
  body[data-page="dashboard"] .desktop-events-content { scrollbar-color: #536981 transparent; }
  body[data-page="dashboard"] .desktop-events-content .event-card { padding: 18px 0; }
  body[data-page="dashboard"] .desktop-events-content .event-card h3 { color: #d6e0ec; font: 650 16px/1.65 var(--sans) !important; }
  body[data-page="dashboard"] .desktop-events-content .event-card__kind,
  body[data-page="dashboard"] .desktop-events-content .event-card__region,
  body[data-page="dashboard"] .desktop-events-content .event-card__time,
  body[data-page="dashboard"] .desktop-events-content .event-card__time strong { color: #a0b2c8; font: 550 12px/1.5 var(--sans); }
  body[data-page="dashboard"] .desktop-events-content .event-video-copy b { color: #8fa9cb; font-size: 11px; }
  body[data-page="dashboard"] .desktop-events-content .event-video-copy strong { color: #aabdd1; font-size: 13px; line-height: 1.5; }
  body[data-page="dashboard"] .desktop-events-content .event-card__details .event-related-video { background: transparent; }
}

@media (min-width: 851px) and (max-width: 1180px) {
  body[data-page="dashboard"] .situation-lower-row { grid-template-columns: minmax(0, 1fr); }
}

/* One pill group, no outer box or internal separators. */
@media (min-width: 851px) {
  body[data-page="dashboard"] .trend-signals-grid .range-tabs {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    border: 0 !important;
    border-radius: 999px;
    background: rgba(72, 121, 137, .09);
    box-shadow: none;
  }
  body[data-page="dashboard"] .trend-signals-grid .range-tabs button {
    color: #879aad;
    min-width: 44px;
    min-height: 30px;
    padding: 6px 12px;
    border: 0 !important;
    border-radius: 999px;
    background: transparent;
    box-shadow: none;
    font: 500 12px/1.4 var(--sans);
    letter-spacing: 0;
  }
  body[data-page="dashboard"] .trend-signals-grid .range-tabs button::before,
  body[data-page="dashboard"] .trend-signals-grid .range-tabs button::after {
    display: none;
  }
  body[data-page="dashboard"] .trend-signals-grid .range-tabs button.active {
    color: #c9e6eb;
    background: #295460;
    font-weight: 650;
  }
  body[data-page="dashboard"] .trend-signals-grid .range-tabs button:focus-visible {
    outline: 2px solid #78afb9;
    outline-offset: 2px;
  }
}
