:root{
  --bg:#ffffff; --text:#0f172a; --muted:#475569; --border:#e2e8f0; --panel:#ffffff; --ring:#94a3b8;
  --brand:#2e7d32; --brand-strong:#1b5e20; --accent:#f59e0b;
  --good:#16a34a; --bad:#dc2626;
  --radius:16px; --shadow:0 6px 20px rgba(2,6,23,.08); --gap:1rem;
}
/* Dark theme variables */
:root[data-theme="dark"]{
  --bg:#0b1220; --text:#e5e7eb; --muted:#94a3b8; --border:#1f2937; --panel:#0f172a; --ring:#60a5fa;
  --brand:#77c27e; --brand-strong:#b7e1bb; --accent:#fbbf24;
  --good:#22c55e; --bad:#ef4444;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font:16px/1.55 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial, 'Noto Sans';color:var(--text);background:var(--bg)}
.container{width:min(1100px,96%);margin-inline:auto;padding:1.25rem 0}
.section{margin:1rem 0 2rem}
.site-header{border-bottom:1px solid var(--border);padding-bottom:1rem}
.brand{display:flex;gap:.875rem;align-items:center}
.logo{width:44px;height:44px;border-radius:10px;background:linear-gradient(135deg,var(--brand),var(--brand-strong));box-shadow:var(--shadow)}
h1{font-size:1.6rem;margin:.25rem 0 .35rem}
.lede{color:var(--muted);margin:0 0 .5rem}
.statusbar{display:flex;gap:.75rem;align-items:center;padding:.6rem .8rem;border:1px solid var(--border);border-radius:10px;background:#f8fafc;color:var(--muted)}
.statusbar .stale{padding:.2rem .55rem;border-radius:999px;border:1px solid var(--bad);color:var(--bad);background:#fef2f2}
.hidden{display:none}
.muted{color:var(--muted)}

.toolbar-row{display:flex;justify-content:space-between;align-items:center;gap:.75rem;flex-wrap:wrap}
.btn{border:1px solid var(--border);background:#fff;color:var(--text);padding:.5rem .75rem;border-radius:10px;cursor:pointer;box-shadow:var(--shadow)}
.btn:hover{filter:brightness(1.03)} .btn:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
.btn-ghost{background:#f8fafc}
.select{border:1px solid var(--border);background:#fff;color:var(--text);padding:.45rem .6rem;border-radius:10px}
:root[data-theme="dark"] .btn, :root[data-theme="dark"] .select{background:#0b1220}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--gap)}
.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:1rem .95rem .75rem;box-shadow:var(--shadow)}
.card h3{margin:.25rem 0 .5rem;font-weight:600}.unit{font-weight:500;font-size:.9em;color:var(--muted)}
.metric{display:block;font-size:2rem;font-weight:700}
.delta{margin:.25rem 0 .75rem}
.chip{display:inline-block;padding:.2rem .55rem;border-radius:999px;background:#f8fafc;border:1px solid var(--border);color:var(--muted)}
.chip.up{color:var(--good);border-color:var(--good);background:#ecfdf5}.chip.down{color:var(--bad);border-color:var(--bad);background:#fef2f2}

/* YTD */
.ytd{display:grid;grid-template-columns:1fr 1fr;gap:.4rem .6rem}
.ytd dt{color:var(--muted)} .ytd dd{margin:0;font-weight:600}

/* Chart */
.chart-outer{overflow:auto}
.chart-wrap{width:min(100%, 1200px);min-width:800px;min-height:600px;aspect-ratio:4/3;background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:.75rem;box-shadow:var(--shadow);margin-inline:auto;display:grid;place-items:stretch}
#chart{width:100%;height:100%;display:block}

/* Table */
.table-wrap{overflow:auto;background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
table{width:100%;border-collapse:collapse;min-width:720px}
caption{caption-side:top;text-align:left;color:var(--muted);padding:.75rem}
thead th{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--border);text-align:left;padding:.6rem .5rem}
tbody td{padding:.55rem .5rem;border-bottom:1px solid var(--border)}
tbody tr:nth-child(even){background:#f8fafc}

a{color:var(--brand)} a:hover{color:var(--brand-strong)}
.site-footer{border-top:1px solid var(--border);margin-top:1.5rem;padding-top:1rem}

/* Print mode: injected overrides will set @page size. Base rules: */
@media print {
  body { background:#fff; color:#000 }
  .site-header .lede, .toolbar-row, .table-wrap caption { display:none !important; }
  .chart-wrap { width:100% !important; min-width:auto; min-height:auto; aspect-ratio:unset; height:6.5in; }
  #chart { width:100% !important; height:100% !important; }
  .card, .table-wrap, .chart-wrap { box-shadow:none; border-color:#000 }
  a{ color:#000; text-decoration:underline }
}