/* The dashboard extends the existing midnight/lavender site palette; selectors stay local. */
.app-shell:has(.ops-dashboard) { max-width: 1500px; }
.ops-dashboard { --ops-ink:#e9ecf5; --ops-muted:#aeb6d0; --ops-panel:#171b2b; --ops-line:#343b53; --ops-accent:#a7a4ff; --ops-second:#62cddb; --ops-warn:#e8bd76; color:var(--ops-ink); padding-bottom:1rem; }
.ops-dashboard :is(button,input,select,a,summary,svg):focus-visible { outline:2px solid var(--ops-second); outline-offset:4px; }
.ops-dashboard [hidden] { display:none !important; }
.ops-dashboard a { color:var(--ops-accent); text-underline-offset:.2em; }
.ops-tabs { display:flex; flex-wrap:wrap; gap:.3rem; border-bottom:1px solid var(--ops-line); padding-bottom:.65rem; margin-bottom:1.6rem; }
.ops-tabs a { color:var(--ops-muted); text-decoration:none; padding:.5rem .9rem; border-radius:.4rem; }
.ops-tabs a[aria-current] { color:var(--ops-ink); background:#343456; box-shadow:inset 0 -2px var(--ops-accent); }
.ops-tabs a:last-child { margin-left:auto; }
.ops-heading { display:flex; justify-content:space-between; align-items:start; gap:1.5rem; margin-bottom:1.4rem; }
.ops-heading h1 { font-size:clamp(1.6rem,3vw,2.25rem); font-weight:650; letter-spacing:-.035em; margin:0 0 .5rem; }
.ops-heading p { color:var(--ops-muted); margin:0; max-width:55ch; }
.ops-heading .ops-eyebrow { color:var(--ops-accent); font-size:.72rem; letter-spacing:.11em; text-transform:uppercase; margin-bottom:.45rem; }
.ops-refresh { display:grid; gap:.4rem; text-align:right; flex-shrink:0; font-size:.85rem; }
.ops-refresh div { display:flex; gap:.4rem; justify-content:end; }
.ops-refresh small { color:var(--ops-muted); }
.ops-dashboard button { border:1px solid #51577a; border-radius:.35rem; padding:.46rem .8rem; background:#292e46; color:var(--ops-ink); font-size:.85rem; cursor:pointer; }
.ops-dashboard button:hover { background:#3a3d5b; }
.ops-dashboard button:disabled { opacity:.45; cursor:default; }
.ops-dashboard button[aria-pressed="true"] { border-color:var(--ops-warn); color:var(--ops-warn); }
.ops-controls { display:flex; flex-wrap:wrap; gap:.75rem; align-items:end; margin-bottom:1.5rem; }
.ops-controls label { display:grid; gap:.3rem; font-size:.75rem; color:var(--ops-muted); }
.ops-controls :is(input,select) { background:#171b2b; color:var(--ops-ink); border:1px solid #464e69; border-radius:.35rem; padding:.5rem .6rem; min-height:37px; }
.ops-search { flex:1; min-width:220px; }
.ops-control-note { font-size:.75rem; color:var(--ops-muted); margin-left:auto; align-self:center; }
.ops-panel { border:1px solid var(--ops-line); border-radius:.65rem; background:rgba(23,27,43,.85); margin-bottom:1rem; overflow:hidden; }
.ops-panel-header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.5rem; padding:1rem 1.2rem; border-bottom:1px solid var(--ops-line); }
.ops-panel-header h2,.ops-panel-header h3 { font-size:1rem; margin:0; letter-spacing:-.015em; }
.ops-panel-header p { color:var(--ops-muted); font-size:.78rem; margin:.25rem 0 0; }
.ops-panel-body { padding:1.1rem 1.2rem; }
.ops-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--ops-line); }
.ops-kpi { background:var(--ops-panel); padding:1rem 1.2rem; min-width:0; }
.ops-kpi-label { color:var(--ops-muted); font-size:.75rem; display:block; margin-bottom:.5rem; }
.ops-kpi-value { font-variant-numeric:tabular-nums; font-size:1.7rem; font-weight:600; letter-spacing:-.035em; overflow-wrap:anywhere; }
.ops-kpi-note { display:block; font-size:.72rem; color:var(--ops-muted); margin-top:.3rem; }
.ops-kpi[data-emphasis] .ops-kpi-value { color:var(--ops-second); }
.ops-section-label { font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ops-muted); margin:.6rem 0; }
.ops-usage-note,.ops-footnote { color:var(--ops-muted); font-size:.76rem; line-height:1.65; }
.ops-usage-note { padding:0 1.2rem .8rem; margin:0; }
.ops-footnote { margin-top:1.2rem; }
.ops-chart { position:relative; padding:.8rem 1.2rem 1rem; }
.ops-chart svg { display:block; width:100%; height:auto; overflow:visible; }
.ops-chart .ops-grid { stroke:var(--ops-line); stroke-width:1; }
.ops-chart .ops-axis { fill:var(--ops-muted); font:11px Helvetica,Arial,sans-serif; }
.ops-chart .ops-series { fill:none; stroke-width:2.5; stroke-linejoin:round; stroke-linecap:round; vector-effect:non-scaling-stroke; }
.ops-chart .ops-series-a { stroke:var(--ops-accent); }
.ops-chart .ops-series-b { stroke:var(--ops-second); stroke-dasharray:5 3; }
.ops-chart .ops-point { fill:transparent; stroke:none; cursor:crosshair; }
.ops-chart .ops-point:hover { fill:var(--ops-ink); }
.ops-chart .ops-isolated-point { fill:var(--ops-ink); }
.ops-chart .ops-selected { stroke:var(--ops-muted); stroke-width:1; stroke-dasharray:3 3; }
.ops-chart-readout { color:var(--ops-muted); font-size:.75rem; min-height:1.7rem; margin:.4rem 0; font-variant-numeric:tabular-nums; }
.ops-legend { display:flex; flex-wrap:wrap; gap:1rem; font-size:.78rem; padding:.8rem 1.2rem 0; }
.ops-legend span:before { content:""; display:inline-block; width:18px; height:3px; background:var(--ops-accent); vertical-align:middle; margin-right:.4rem; }
.ops-legend span:nth-child(2):before { background:var(--ops-second); }
.ops-table-wrap { overflow-x:auto; }
.ops-table { width:100%; border-collapse:collapse; font-size:.8rem; text-align:left; }
.ops-table :is(th,td) { padding:.7rem .85rem; border-bottom:1px solid #2c3248; vertical-align:top; }
.ops-table th { color:var(--ops-muted); font-weight:500; white-space:nowrap; font-size:.72rem; }
.ops-table tbody tr:last-child td { border-bottom:0; }
.ops-table tbody tr:hover { background:rgba(167,164,255,.035); }
.ops-table td { font-variant-numeric:tabular-nums; }
.ops-table .ops-number { text-align:right; }
.ops-table .ops-run { white-space:nowrap; }
.ops-table td small { display:block; color:var(--ops-muted); font-size:.7rem; margin-top:.3rem; }
.ops-mono { font-family:"Cascadia Mono",Consolas,monospace; font-size:.76rem; }
.ops-state { display:inline-flex; align-items:center; gap:.3rem; font-size:.72rem; color:var(--ops-muted); border:1px solid #41485e; border-radius:20px; padding:.16rem .5rem; white-space:nowrap; }
.ops-state[data-tone="good"] { color:#a4ddd1; border-color:#375d58; }
.ops-state[data-tone="warn"] { color:var(--ops-warn); border-color:#675641; }
.ops-state[data-tone="bad"] { color:#f4acae; border-color:#69424a; }
.ops-pagination { display:flex; justify-content:space-between; align-items:center; gap:.75rem; flex-wrap:wrap; padding:.85rem 1.2rem; font-size:.8rem; color:var(--ops-muted); }
.ops-pagination div { display:flex; gap:.5rem; }
.ops-detail { margin-top:1rem; border-left:3px solid var(--ops-accent); }
.ops-detail dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin:0; }
.ops-detail dt { font-weight:400; font-size:.73rem; color:var(--ops-muted); margin-bottom:.3rem; }
.ops-detail dd { font-size:.85rem; overflow-wrap:anywhere; margin:0; }
.ops-empty { color:var(--ops-muted); padding:2rem 1.2rem; text-align:center; font-size:.85rem; }
.ops-notice { padding:.85rem 1rem; border:1px solid #675641; background:#332c24; border-radius:.4rem; color:#efd6b1; font-size:.83rem; margin-bottom:1rem; }
.ops-panel[data-stale="true"] { border-color:#675641; }
.ops-panel[data-stale="true"] > .ops-panel-header:after { content:"Update failed · previous data"; font-size:.75rem; color:var(--ops-warn); }
.ops-chart details { border-top:1px solid var(--ops-line); padding-top:.6rem; font-size:.78rem; }
.ops-chart summary { cursor:pointer; color:var(--ops-muted); padding:.25rem 0; }
.ops-chart details .ops-table-wrap { max-height:300px; margin-top:.5rem; }
.ops-summary-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.ops-meter { width:100%; height:.6rem; accent-color:var(--ops-accent); margin:.5rem 0; }
@media (max-width:900px) { .ops-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); } .ops-detail dl { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .ops-heading { flex-direction:column; gap:1rem; } .ops-refresh { text-align:left; } .ops-refresh div { justify-content:start; } .ops-tabs { gap:.15rem; } .ops-tabs a { padding:.45rem .6rem; font-size:.8rem; } .ops-tabs a:last-child { margin-left:0; } .ops-kpi { padding:.8rem; } .ops-kpi-value { font-size:1.35rem; } .ops-detail dl,.ops-summary-grid { grid-template-columns:1fr; } .ops-control-note { margin-left:0; } .ops-panel-header,.ops-panel-body { padding:.85rem; } }
@media (prefers-reduced-motion:reduce) { .ops-dashboard * { scroll-behavior:auto; transition:none; } }