/* Pulse dashboard views, scoped under .dash (ported from prototype v0.1). Uses the Mosaic tokens in styles.css. */
.dash .tracker{font:700 12px/16px var(--font);letter-spacing:.06em;text-transform:uppercase;margin:0 0 var(--s-2)}
.dash .view>h1{font-size:30px;line-height:36px;letter-spacing:-.015em;margin-bottom:var(--s-2)}
.dash .view>.lede{color:var(--text-2);margin-bottom:var(--s-4)}
.dash .grid{display:grid;gap:var(--s-4)}
.dash .kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:var(--s-3);margin-bottom:var(--s-4)}
.dash .kpi{background:var(--surface);border-radius:var(--radius-card);padding:var(--s-4)}
.dash .kpi .l{font:700 11px/14px var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--text-2)}
.dash .kpi .v{font:300 34px/40px var(--font);letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-top:6px}
.dash .kpi .v.focal{color:var(--accent-text)}
.dash .kpi .c{font-size:12px;color:var(--text-2);margin-top:4px}
.dash .panel{background:var(--surface);border-radius:var(--radius-card);padding:var(--s-4);min-width:0}
.dash .panel h3{font:600 16px/22px var(--font);margin-bottom:4px}
.dash .panel .sub{font-size:13px;color:var(--text-2);margin-bottom:var(--s-3)}
.dash .two{grid-template-columns:repeat(auto-fit,minmax(min(100%,480px),1fr))}
.dash .chart svg{width:100%;height:auto;display:block}
.dash .chart text{font-family:var(--font);fill:var(--text-2);font-size:11px}
.dash .table-wrap{overflow-x:auto}
.dash table{border-collapse:collapse;width:100%;font-size:14px}
.dash th{font:600 11px/16px var(--font);letter-spacing:.05em;text-transform:uppercase;color:var(--text-2);text-align:left;padding:8px 10px;border-bottom:2px solid var(--line-strong);white-space:nowrap}
.dash td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.dash th.n,.dash td.n{text-align:right}
.dash tr.focal td{background:var(--accent-tint)}
.dash tbody tr:hover td{background:var(--surface-2)}
.dash .tag{display:inline-block;font:600 11px/16px var(--font);padding:1px 6px;border:1px solid currentColor;border-radius:var(--radius);white-space:nowrap}
.dash .tag.good{color:var(--good)}.tag.warn{color:var(--warn)}.tag.bad{color:var(--bad)}.tag.neutral{color:var(--text-2)}
.dash .callout{background:var(--accent-tint);border-left:3px solid var(--accent-500);padding:var(--s-3);border-radius:var(--radius);font-size:14px}
.dash .callout b{font-weight:600}
.dash .note{font-size:12px;color:var(--text-2);margin-top:var(--s-2)}
.dash .controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--s-3);margin-bottom:var(--s-3)}
.dash .controls label{font:600 13px/18px var(--font);display:block;margin-bottom:6px}
.dash .controls output{font-variant-numeric:tabular-nums;color:var(--accent-text);font-weight:600;margin-left:6px}
.dash input[type=range]{width:100%;accent-color:var(--accent-500)}
.dash .legend{display:flex;gap:var(--s-3);flex-wrap:wrap;font-size:12px;color:var(--text-2);margin-top:var(--s-2)}
.dash .legend i{display:inline-block;width:10px;height:10px;margin-right:6px;vertical-align:-1px}
@media (max-width:760px){.dash .view>h1{font-size:24px;line-height:30px}.dash .kpi .v{font-size:28px;line-height:34px}}
@media (prefers-reduced-motion:reduce){.dash *{transition:none!important;animation:none!important}}
.dash .view-h1,.dash>h1{font-size:30px;line-height:36px}
.dash h1{font-size:30px;line-height:36px;letter-spacing:-.015em;margin-bottom:8px}
.dash .lede{color:var(--text-2);margin-bottom:var(--s-4)}
