:root {
  --bg: #f4f6f8;
  --surface: #ffffff;
  --surface-alt: #eef2f5;
  --text: #17212b;
  --muted: #5f6f7d;
  --line: #d8e0e6;
  --brand: #004f71;
  --brand-strong: #00384f;
  --accent: #d9a21b;
  --danger: #9d2f2f;
  --warning: #8a5d00;
  --success: #246b45;
  --weekend: rgba(217, 162, 27, 0.10);
  --shadow: 0 14px 38px rgba(24, 42, 55, 0.08);
  --radius: 16px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; background: var(--bg); color: var(--text); line-height: 1.5; }
button, input, select { font: inherit; }
button, input, select { min-height: 42px; }
button:focus-visible, input:focus-visible, select:focus-visible, [tabindex]:focus-visible { outline: 3px solid rgba(0, 79, 113, 0.28); outline-offset: 2px; }

.site-header { display: flex; justify-content: space-between; gap: 24px; padding: 28px clamp(18px, 4vw, 64px); background: linear-gradient(120deg, var(--brand-strong), var(--brand)); color: #fff; }
.site-header h1 { margin: 0; font-size: clamp(1.9rem, 4vw, 3.2rem); line-height: 1; letter-spacing: -0.03em; }
.subtitle { margin: 10px 0 0; max-width: 720px; color: rgba(255,255,255,.82); }
.eyebrow { margin: 0 0 6px; font-size: .76rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--brand); }
.site-header .eyebrow { color: rgba(255,255,255,.72); }
.header-meta { display: flex; align-items: flex-start; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.version-badge, .user-badge, .count-badge { display: inline-flex; align-items: center; min-height: 32px; padding: 5px 10px; border-radius: 999px; font-size: .82rem; font-weight: 700; }
.version-badge, .user-badge { background: rgba(255,255,255,.12); color: #fff; border: 1px solid rgba(255,255,255,.22); }
.count-badge { background: var(--surface-alt); color: var(--brand-strong); }

main { width: min(1480px, calc(100% - 28px)); margin: 24px auto 48px; }
.auth-card, .panel-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.auth-card { max-width: 520px; margin: 80px auto; padding: 30px; }
.auth-card h2 { margin-top: 0; }
.form-grid { display: grid; gap: 16px; }
label { display: grid; gap: 6px; color: var(--muted); font-size: .88rem; font-weight: 700; }
input, select { width: 100%; border: 1px solid #bbc7d0; border-radius: 9px; padding: 9px 11px; background: var(--surface); color: var(--text); }
.primary-button, .secondary-button, .tab-button, .small-button { border-radius: 9px; border: 1px solid transparent; cursor: pointer; font-weight: 800; }
.primary-button { background: var(--brand); color: #fff; padding: 9px 15px; }
.primary-button:hover { background: var(--brand-strong); }
.secondary-button { background: transparent; border-color: currentColor; color: inherit; padding: 8px 13px; }
.panel-card .secondary-button { color: var(--brand); }
.small-button { min-height: 34px; padding: 5px 9px; background: var(--surface-alt); color: var(--brand-strong); border-color: var(--line); }
.form-message { min-height: 24px; margin: 0; color: var(--danger); }
.auth-divider { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; }
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.auth-divider span { padding: 0 4px; }

.tab-bar { display: flex; gap: 8px; overflow-x: auto; padding: 4px 0 18px; }
.tab-button { padding: 9px 15px; background: transparent; color: var(--muted); border-color: transparent; white-space: nowrap; }
.tab-button.active { background: var(--surface); color: var(--brand); border-color: var(--line); box-shadow: 0 5px 16px rgba(24,42,55,.06); }
.section-heading, .panel-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; }
.section-heading { margin: 6px 0 18px; }
.section-heading h2, .panel-card h3 { margin: 0; }
.section-note { max-width: 840px; margin: 6px 0 0; color: var(--muted); }
.panel-heading { margin-bottom: 12px; }
.trend-heading { display: grid; grid-template-columns: minmax(180px, .9fr) minmax(300px, 1.8fr) auto; align-items: start; }
.trend-description { margin: 0; color: var(--muted); font-size: .9rem; line-height: 1.55; }

.metric-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.metric-card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 18px; box-shadow: var(--shadow); }
.metric-card h3 { margin: 0 0 4px; color: var(--muted); font-size: .79rem; text-transform: uppercase; letter-spacing: .05em; }
.metric-value { font-size: clamp(1.55rem, 2.5vw, 2.25rem); font-weight: 850; letter-spacing: -.03em; }
.metric-sub { margin-top: 3px; color: var(--muted); font-size: .78rem; }

.dashboard-grid { display: grid; gap: 16px; margin-bottom: 16px; align-items: start; }
.two-column { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.span-two { grid-column: 1 / -1; }
.panel-card { padding: 20px; min-width: 0; align-self: start; }
.panel-note, .quality-explainer, .explore-description { color: var(--muted); font-size: .86rem; }
.panel-note { margin: 12px 0; }
.inline-controls { display: flex; gap: 10px; flex-wrap: wrap; align-items: end; }
.inline-controls label { min-width: 150px; }
.control-label { display: block; margin-bottom: 6px; color: var(--muted); font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.trend-controls { display: grid; gap: 12px; grid-column: 1 / -1; }
.trend-filter-row { display: flex; gap: 18px; align-items: end; flex-wrap: wrap; }
.trend-filter-row > label { min-width: 130px; }
.button-strip { display: flex; gap: 6px; flex-wrap: wrap; }
.filter-button { min-height: 34px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--muted); cursor: pointer; font-size: .78rem; font-weight: 800; }
.filter-button:hover { border-color: var(--brand); color: var(--brand); }
.filter-button[aria-pressed="true"] { background: var(--brand); border-color: var(--brand); color: #fff; }
.filter-button.diagnostic { border-style: dashed; }
.metric-button-strip { max-width: 100%; }

.chart-frame { min-height: 340px; width: 100%; overflow: hidden; }
.chart-svg { display: block; width: 100%; height: auto; min-height: 280px; }
.chart-grid { stroke: #cbd6dd; stroke-width: 1; }
.chart-v-grid { stroke: #dce4e9; stroke-width: .8; }
.chart-tick { stroke: #9aa9b3; stroke-width: 1; }
.chart-month-line { stroke: #93a4ae; stroke-width: 1.25; }
.chart-month-band { fill: rgba(95,111,125,.055); }
.chart-weekend-band { fill: var(--weekend); }
.chart-background-bar { fill: rgba(67,167,203,.10); }
.chart-background-bar.weekend { fill: rgba(217,162,27,.13); }
.chart-line { fill: none; stroke: var(--brand); stroke-width: 1.9; stroke-linejoin: round; stroke-linecap: round; }
.chart-point { fill: var(--brand); stroke: var(--brand); stroke-width: 1.2; }
.chart-point.weekend { fill: var(--brand); stroke: var(--brand); stroke-width: 1.2; }
.chart-point.clickable { cursor: pointer; }
.chart-point.clickable:hover, .chart-point.clickable:focus { r: 3.4; }
.chart-axis-label { fill: var(--muted); font-size: 11.5px; }
.chart-axis-label.dense { font-size: 9.5px; }
.chart-axis-label.weekend { fill: var(--warning); font-weight: 800; }
.trend-stat-strip { display: flex; gap: 18px; flex-wrap: wrap; margin: 8px 0 2px; padding: 8px 10px; border-radius: 9px; background: var(--surface-alt); color: var(--muted); font-size: .82rem; }
.trend-stat-strip strong { color: var(--text); }
.notable-tag { display: inline-block; margin-left: 6px; padding: 2px 6px; border-radius: 999px; background: rgba(217,162,27,.12); color: var(--warning); font-size: .68rem; font-weight: 800; }
.empty-state { color: var(--muted); padding: 26px 8px; text-align: center; }

.bar-chart { display: grid; gap: 10px; margin-top: 12px; }
.bar-row { display: grid; grid-template-columns: minmax(100px, 1.4fr) minmax(100px, 3fr) minmax(58px, .7fr); gap: 10px; align-items: center; }
.bar-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .88rem; }
.bar-track { height: 12px; border-radius: 999px; background: var(--surface-alt); overflow: hidden; }
.bar-fill { height: 100%; border-radius: inherit; background: var(--brand); }
.bar-value { text-align: right; font-variant-numeric: tabular-nums; font-size: .85rem; font-weight: 800; }
.clickable-bar-row { cursor: pointer; border-radius: 7px; padding: 2px 4px; margin: -2px -4px; }
.clickable-bar-row:hover, .clickable-bar-row:focus { background: var(--surface-alt); outline: 2px solid rgba(67,167,203,.28); }

.table-wrap { width: 100%; overflow-x: auto; margin-top: 10px; }
.trend-data-details { margin-top:12px; border-top:1px solid var(--line); padding-top:10px; }
.trend-data-details > summary { cursor:pointer; color:var(--brand); font-weight:850; user-select:none; }
.trend-data-details[open] > summary { margin-bottom:8px; }
.trend-data-details > summary:hover, .trend-data-details > summary:focus { text-decoration:underline; }
#trendTable table { width: min(760px, 100%); min-width: 0; }
#trendTable th:first-child, #trendTable td:first-child { width: 62%; }
#trendTable th.numeric, #trendTable td.numeric { width: 19%; }
table { width: 100%; border-collapse: collapse; min-width: 620px; font-size: .86rem; }
th, td { padding: 9px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { color: var(--muted); font-size: .76rem; text-transform: uppercase; letter-spacing: .05em; }
td.numeric { text-align: right; font-variant-numeric: tabular-nums; }
.weekend-row { background: var(--weekend); }
.listening-hour-panel { grid-column: 1 / -1; }
.listening-hour-panel.compact-empty { min-height:0; padding-top:14px; padding-bottom:14px; }
.listening-hour-panel.compact-empty .panel-heading { margin-bottom:0; }
.listening-hour-panel.compact-empty .hour-chart,
.listening-hour-panel.compact-empty #nprHourTable { display:none !important; }
.source-range-warning { display:block; margin:0 0 8px; padding:9px 11px; border-left:4px solid var(--warning); background:rgba(217,162,27,.10); border-radius:7px; color:var(--text); }
.schedule-program-filter { min-width: min(320px, 100%); }
.hour-section { margin-top: 18px; }
.hour-section h4 { margin: 0 0 8px; }
.hour-table { min-width: 0; table-layout: fixed; font-size: .78rem; }
.hour-table th { white-space: normal; text-align: center; line-height: 1.2; }
.hour-table td:first-child { width: 64px; font-weight: 800; white-space: nowrap; }
.hour-average { width: 74px; text-align: center; font-variant-numeric: tabular-nums; font-weight: 850; }
.program-line { display: block; line-height: 1.28; margin: 0 0 3px; overflow-wrap: anywhere; }
.program-line:last-child { margin-bottom: 0; }
.program-line.muted { color: var(--muted); }

.quality-explainer { margin: 8px 0 14px; padding: 12px 14px; border-left: 4px solid var(--brand); background: var(--surface-alt); border-radius: 8px; }
.quality-explainer p { margin: 0 0 8px; }
.quality-explainer p:last-child { margin-bottom: 0; }
.anomaly-item { padding: 12px 0; border-bottom: 1px solid var(--line); }
.anomaly-item:last-child { border-bottom: 0; }
.anomaly-head { display: flex; justify-content: space-between; gap: 12px; }
.anomaly-title { font-weight: 850; }
.anomaly-detail { margin: 5px 0 8px; color: var(--muted); font-size: .88rem; }
.severity { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 900; }
.severity.high { color: var(--danger); }
.severity.warning { color: var(--warning); }
.anomaly-actions { display: flex; gap: 8px; flex-wrap: wrap; }

.explore-panel { min-height: 0; }
.explore-heading { align-items: flex-start; }
.explore-button-strip { max-width: 980px; }
.explore-period { display: grid; gap: 3px; color: var(--muted); font-size: .8rem; }
.explore-period strong { color: var(--text); font-size: .95rem; }
.explore-description { max-width: 960px; margin: 4px 0 18px; }

.collection-table-wrap { margin-top: 14px; }
.collection-table { min-width: 760px; }
.collection-table th:nth-child(2),
.collection-table th:nth-child(3),
.collection-table th:nth-child(4),
.collection-table td:nth-child(2),
.collection-table td:nth-child(3),
.collection-table td:nth-child(4) { text-align: center; }
.collection-status { display: inline-flex; align-items: center; justify-content: center; min-width: 84px; padding: 4px 7px; border-radius: 999px; font-size: .74rem; font-weight: 850; white-space: nowrap; }
.collection-status.good { color: var(--success); background: rgba(36,107,69,.10); }
.collection-status.partial { color: var(--warning); background: rgba(138,93,0,.10); }
.collection-status.need { color: var(--danger); background: rgba(157,47,47,.09); }
.collection-gaps { margin-top: 16px; padding: 13px 15px; background: var(--surface-alt); border-radius: 10px; color: var(--muted); font-size: .86rem; }
.collection-gaps p { margin: 0 0 7px; color: var(--text); }
.collection-gaps ul { margin: 0; padding-left: 1.2rem; }
.collection-gaps li { margin: 6px 0; }

.drop-zone { display: grid; place-items: center; min-height: 180px; padding: 22px; border: 2px dashed #9eb1bd; border-radius: 14px; background: var(--surface-alt); color: var(--muted); cursor: pointer; text-align: center; }
.drop-zone strong { color: var(--brand-strong); font-size: 1.08rem; }
.drop-zone.dragging { border-color: var(--brand); background: #e5f1f5; }
.filter-context { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.filter-context h4 { margin: 0; }
.filter-context p { color: var(--muted); font-size: .85rem; }
.import-queue { display: grid; gap: 8px; margin-top: 16px; }
.import-row { display: grid; grid-template-columns: 1fr auto; gap: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; }
.import-row .status { color: var(--muted); font-size: .82rem; text-align: right; }
.import-row.error { border-color: #d7a4a4; background: #fff6f6; }
.import-row.success { border-color: #a8c9b7; background: #f4fbf7; }

footer { display: flex; justify-content: space-between; gap: 16px; padding: 22px clamp(18px, 4vw, 64px); color: var(--muted); border-top: 1px solid var(--line); font-size: .8rem; }

@media (max-width: 1180px) {
  .metric-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .trend-heading { grid-template-columns: 1fr 1.4fr; }
  .trend-heading .inline-controls { grid-column: 1 / -1; }
}

@media (max-width: 980px) {
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .two-column { grid-template-columns: 1fr; }
  .span-two { grid-column: auto; }
  .trend-heading { grid-template-columns: 1fr; }
  .trend-heading .inline-controls { grid-column: auto; }
}

@media (max-width: 640px) {
  .site-header { flex-direction: column; padding: 22px 18px; }
  .header-meta { justify-content: flex-start; }
  main { width: min(100% - 20px, 1480px); margin-top: 12px; }
  .metric-grid { grid-template-columns: 1fr; }
  .section-heading, .panel-heading { flex-direction: column; }
  .inline-controls, .inline-controls label { width: 100%; }
  .bar-row { grid-template-columns: minmax(90px, 1.3fr) minmax(70px, 2fr) 56px; gap: 7px; }
  .panel-card { padding: 16px; }
  footer { flex-direction: column; }
}

@media print {
  :root {
    --bg: #fff;
    --surface: #fff;
    --surface-alt: #f5f5f5;
    --text: #111;
    --muted: #555;
    --line: #bbb;
    --brand: #111;
    --brand-strong: #111;
    --weekend: rgba(0,0,0,.045);
    color-scheme: light;
  }
  body { background: #fff; color: #111; font-size: 10pt; }
  .site-header { background: #fff; color: #111; padding: 0 0 14px; border-bottom: 2px solid #111; }
  .site-header .eyebrow, .subtitle { color: #333; }
  .header-meta, .tab-bar, #refreshButton, .anomaly-actions, .drop-zone, .filter-context { display: none !important; }
  main { width: 100%; margin: 14px 0 0; }
  .panel-card, .metric-card { box-shadow: none; break-inside: avoid; border-color: #aaa; }
  .two-column { grid-template-columns: 1fr 1fr; }
  .chart-frame { min-height: 260px; }
  .chart-svg { min-height: 240px; }
  .table-wrap { overflow: visible; }
  table { min-width: 0; font-size: 8.5pt; }
  th, td { padding: 5px 6px; }
  a { color: #111; text-decoration: none; }
  footer { padding: 12px 0 0; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #11171c;
    --surface: #182129;
    --surface-alt: #202c35;
    --text: #eef4f7;
    --muted: #aebbc4;
    --line: #34434e;
    --brand: #43a7cb;
    --brand-strong: #7fc8e2;
    --weekend: rgba(217, 162, 27, 0.12);
    --shadow: 0 14px 38px rgba(0,0,0,.2);
  }
  .site-header { background: linear-gradient(120deg, #083246, #064f6b); }
  .drop-zone.dragging { background: #153746; }
  .import-row.error { background: #341f22; }
  .import-row.success { background: #193127; }
  .chart-grid { stroke: #60717c; }
  .chart-v-grid { stroke: #33434d; }
  .chart-tick { stroke: #8fa0aa; }
}


.detail-dialog { width: min(980px, calc(100vw - 32px)); max-height: min(88vh, 920px); border: 1px solid var(--line); border-radius: 16px; padding: 0; background: var(--surface); color: var(--text); box-shadow: 0 24px 70px rgba(0,0,0,.35); }
.detail-dialog::backdrop { background: rgba(0,0,0,.58); }
.detail-dialog-shell { padding: 22px; overflow: auto; max-height: min(88vh, 920px); }
.detail-dialog-heading { position: sticky; top: -22px; z-index: 2; display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; padding: 18px 0 14px; background: var(--surface); border-bottom: 1px solid var(--line); }
.detail-dialog-heading h2 { margin: 0; }
.detail-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin: 18px 0; }
.detail-summary > div, .detail-metric { padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-alt); }
.detail-summary span, .detail-metric span { display: block; color: var(--muted); font-size: .75rem; margin-bottom: 4px; }
.detail-summary strong, .detail-metric strong { font-size: 1rem; }
.detail-section { margin-top: 22px; }
.detail-section h3 { margin: 0 0 10px; }
.detail-metric-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.schedule-list { display: grid; gap: 7px; }
.schedule-item { display: grid; grid-template-columns: 120px 1fr; gap: 12px; align-items: baseline; padding: 8px 0; border-bottom: 1px solid var(--line); }
.schedule-item span { color: var(--muted); font-size: .8rem; }
.source-limit { margin: 12px 0 0; padding: 10px 12px; border-left: 4px solid var(--accent); background: var(--surface-alt); color: var(--muted); font-size: .84rem; }


/* Busy state: keep the operating-system progress cursor visible during data loads and expensive filters. */
body.app-busy,
body.app-busy * {
  cursor: wait !important;
}


.startup-card { display:flex; align-items:center; gap:12px; min-height:92px; }
.startup-spinner { width:22px; height:22px; border:3px solid var(--line); border-top-color:var(--brand); border-radius:50%; animation:wnmu-spin .8s linear infinite; }
@keyframes wnmu-spin { to { transform:rotate(360deg); } }

.app-toolbar { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:4px 0 18px; }
.app-toolbar .tab-bar { padding:0; flex:1 1 auto; }
.global-date-range { display:flex; align-items:end; justify-content:flex-end; gap:8px; flex-wrap:wrap; flex:0 1 auto; }
.global-date-range > .control-label { align-self:center; margin:0 4px 0 0; }
.global-date-range label { display:grid; grid-template-columns:auto minmax(132px,165px); align-items:center; gap:6px; font-size:.78rem; }
.global-date-range input { min-height:36px; padding:6px 8px; }
.global-date-range .small-button { min-height:36px; }

.chart-secondary-line { fill:none; stroke:var(--accent); stroke-width:1.8; stroke-dasharray:8 5; stroke-linejoin:round; stroke-linecap:round; }
.chart-secondary-point { fill:var(--accent); stroke:var(--accent); stroke-width:1.2; }
.chart-legend-label { fill:var(--muted); font-size:11px; font-weight:800; }
.chart-index-baseline { stroke:var(--muted); stroke-width:1.1; stroke-dasharray:4 4; opacity:.75; }
.chart-index-label { fill:var(--muted); font-size:10px; font-weight:800; }
.chart-metric-line { fill:none; stroke-width:1.8; stroke-linejoin:round; stroke-linecap:round; }
.chart-metric-point { stroke-width:1.1; }
.chart-metric-point.clickable { cursor:pointer; }
.chart-metric-point.clickable:hover, .chart-metric-point.clickable:focus { r:3.2; }
.chart-metric-line.chart-series-0 { stroke:var(--brand); fill:none; }
.chart-metric-line.chart-series-1 { stroke:var(--accent); fill:none; }
.chart-metric-line.chart-series-2 { stroke:var(--success); fill:none; }
.chart-metric-line.chart-series-3 { stroke:#7655a6; fill:none; }
.chart-metric-line.chart-series-4 { stroke:#c15b2d; fill:none; }
.chart-metric-line.chart-series-5 { stroke:#2f7e7e; fill:none; }
.chart-metric-line.chart-series-6 { stroke:#9a3f73; fill:none; }
.chart-metric-line.chart-series-7 { stroke:#66722c; fill:none; }
.chart-metric-point.chart-series-0 { stroke:var(--brand); fill:var(--brand); }
.chart-metric-point.chart-series-1 { stroke:var(--accent); fill:var(--accent); }
.chart-metric-point.chart-series-2 { stroke:var(--success); fill:var(--success); }
.chart-metric-point.chart-series-3 { stroke:#7655a6; fill:#7655a6; }
.chart-metric-point.chart-series-4 { stroke:#c15b2d; fill:#c15b2d; }
.chart-metric-point.chart-series-5 { stroke:#2f7e7e; fill:#2f7e7e; }
.chart-metric-point.chart-series-6 { stroke:#9a3f73; fill:#9a3f73; }
.chart-metric-point.chart-series-7 { stroke:#66722c; fill:#66722c; }
.multi-metric-table th.numeric { min-width:120px; }
.hour-chart { min-height:300px; margin:6px 0 12px; }
.print-trend-columns { display:none; }

@media (max-width: 980px) {
  .app-toolbar { flex-direction:column; }
  .global-date-range { width:100%; justify-content:flex-start; }
}

@media (max-width: 640px) {
  .global-date-range { display:grid; grid-template-columns:1fr 1fr; }
  .global-date-range > .control-label { grid-column:1 / -1; }
  .global-date-range label { grid-template-columns:1fr; }
  .global-date-range .small-button { align-self:end; }
}

@media print {
  @page { size: letter portrait; margin: .45in; }
  .app-toolbar, .startup-card { display:none !important; }
  #trendTable { display:none !important; }
  .print-trend-columns { display:grid !important; grid-template-columns:1fr 1fr; gap:16px; margin-top:10px; }
  .print-trend-columns.single { grid-template-columns:1fr; }
  .print-trend-columns table { min-width:0; font-size:7.5pt; }
  .print-trend-columns th, .print-trend-columns td { padding:4px 5px; }
  .print-trend-note { grid-column:1 / -1; padding:8px 10px; border:1px solid #bbb; font-size:8pt; }
  .dashboard-grid { align-items:start; }
  .panel-card { align-self:start; break-inside:auto; }
  .metric-card { break-inside:avoid; }
  .chart-frame { width:100%; break-inside:avoid; }
}


.available-range-label { flex-basis:100%; text-align:right; color:var(--muted); font-size:.75rem; }
.range-change-notice { padding:12px 14px; border-left:4px solid var(--accent); background:var(--surface-alt); border-radius:8px; }
@media (max-width: 980px) { .available-range-label { text-align:left; } }

.benchmark-definition { margin:8px 0 2px; padding:9px 11px; border-left:3px solid var(--accent); border-radius:7px; background:var(--surface-alt); color:var(--muted); font-size:.78rem; line-height:1.45; }