/* Plain Civics shared styles. Tokens match the tax receipt. */
@import url('chrome.css');
@import url('fonts.css');
:root {
  --bg:#eef1f4; --surface:#fff; --paper:#fbfbf8; --fg:#11202f; --muted:#5a6b7b; --line:#d5dce3;
  --accent:#0c6b58; --accent-fg:#fff; --accent-soft:#dff1ec; --warn:#a4580b; --warn-soft:#fbeedd; --bad:#b3261e; --bad-soft:#fbe4e2; --good:#1b7a3a;
  --shadow:0 1px 2px rgba(17,32,47,.06),0 6px 20px rgba(17,32,47,.06);
  --c1:#1f5fa8; --c2:#c2410c; --c3:#0f8a6d; --c4:#7a3fb5; --c5:#b8860b; --c6:#c0265b; --c7:#2b8aa8; --c8:#6b7f1a; --c9:#8a5a3c; --c10:#4a5fc1; --c11:#d1731a; --c12:#3d7a4f; --c13:#7b8794; --c14:#a8324a;
  --font-body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif; --font-mono:"IBM Plex Mono",ui-monospace,"Cascadia Mono",Consolas,monospace;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  --bg:#0b141d; --surface:#122030; --paper:#16222f; --fg:#e6edf3; --muted:#93a4b5; --line:#243548; --accent:#4fd1ae; --accent-fg:#06231c; --accent-soft:#12372f; --warn:#f0a458; --warn-soft:#3a2a14; --bad:#ff8a80; --bad-soft:#3b1b19; --good:#6fd38b;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);
  --c1:#5b9bec; --c2:#f08a4b; --c3:#3fd1a8; --c4:#b48af0; --c5:#e6b94a; --c6:#f06a9a; --c7:#5cc4e0; --c8:#b3cc4a; --c9:#c79a78; --c10:#8d9cf5; --c11:#f4a24d; --c12:#74c48a; --c13:#a3afbb; --c14:#ee7d92; color-scheme:dark; } }
:root[data-theme="dark"] {
  --bg:#0b141d; --surface:#122030; --paper:#16222f; --fg:#e6edf3; --muted:#93a4b5; --line:#243548; --accent:#4fd1ae; --accent-fg:#06231c; --accent-soft:#12372f; --warn:#f0a458; --warn-soft:#3a2a14; --bad:#ff8a80; --bad-soft:#3b1b19; --good:#6fd38b;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);
  --c1:#5b9bec; --c2:#f08a4b; --c3:#3fd1a8; --c4:#b48af0; --c5:#e6b94a; --c6:#f06a9a; --c7:#5cc4e0; --c8:#b3cc4a; --c9:#c79a78; --c10:#8d9cf5; --c11:#f4a24d; --c12:#74c48a; --c13:#a3afbb; --c14:#ee7d92; color-scheme:dark; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font-family:var(--font-body); font-size:15px; line-height:1.5; padding:0 max(16px,env(safe-area-inset-right,0px)) 56px max(16px,env(safe-area-inset-left,0px)); }
.wrap { max-width:1180px; margin:0 auto; }
h1,h2,h3 { text-wrap:balance; margin:0; line-height:1.15; }
h1 { font-size:clamp(26px,4vw,40px); font-weight:800; letter-spacing:-.03em; }
h2 { font-size:19px; font-weight:700; letter-spacing:-.01em; }
h3 { font-size:15px; font-weight:700; }
p { margin:0; }
a { color:var(--accent); }
button,input,select,textarea { font:inherit; color:inherit; }
button { cursor:pointer; }
:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.mono,.num { font-family:var(--font-mono); font-variant-numeric:tabular-nums; }
.muted { color:var(--muted); } .small { font-size:12.5px; }
header.page { padding:22px 0 16px; }
header.page p { color:var(--muted); max-width:70ch; margin-top:8px; }
.card { background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:20px; box-shadow:var(--shadow); min-width:0; }
.card + .card { margin-top:16px; }
.grid > .card + .card { margin-top:0; } /* grid gap already spaces cards; the margin made the first card taller than the rest */
.sub { color:var(--muted); font-size:13.5px; margin-top:4px; }
.grid { display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); }
.inputs { display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); margin-top:14px; }
.field label { display:block; font-weight:600; font-size:13px; margin-bottom:4px; }
.field .hint { color:var(--muted); font-size:12px; margin-top:4px; }
.field input,.field select,.field textarea,.toolbar input { width:100%; border:1px solid var(--line); background:var(--bg); border-radius:8px; padding:10px 12px; font-size:15px; }
.field input.m,.field input.num { font-family:var(--font-mono); }
.field input:focus,.field select:focus,.field textarea:focus { border-color:var(--accent); }
.field.span2 { grid-column:span 2; } @media (max-width:520px){ .field.span2 { grid-column:auto; } }
.btn { border:1px solid var(--line); background:var(--surface); border-radius:8px; padding:9px 14px; font-size:14px; font-weight:600; }
.btn:hover { border-color:var(--accent); } .btn.solid { background:var(--accent); border-color:var(--accent); color:var(--accent-fg); }
.btn:disabled { opacity:.5; cursor:not-allowed; }
.row { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:14px; }
.stats { display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); margin:16px 0; }
.stat { background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:14px; min-width:0; }
.stat .k { font-size:11.5px; text-transform:uppercase; letter-spacing:.07em; color:var(--muted); }
.stat .v { font-family:var(--font-mono); font-size:22px; font-weight:600; margin-top:4px; overflow-wrap:anywhere; }
.stat .d { font-size:12px; color:var(--muted); margin-top:2px; }
.stat.hero { background:var(--accent); border-color:var(--accent); color:var(--accent-fg); } .stat.hero .k,.stat.hero .d { color:inherit; opacity:.85; }
.tbl { overflow-x:auto; } table { border-collapse:collapse; width:100%; font-size:13px; }
th,td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); } th { font-size:11.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); white-space:nowrap; }
td.r,th.r { text-align:right; } .nowrap { white-space:nowrap; }
.callout { background:var(--warn-soft); border-radius:8px; padding:10px 12px; font-size:13px; margin-top:12px; }
.callout.bad { background:var(--bad-soft); } .callout.ok { background:var(--accent-soft); }
.pill { display:inline-block; font-family:var(--font-mono); font-size:11px; padding:2px 8px; border-radius:999px; background:var(--accent-soft); color:var(--accent); white-space:nowrap; }
.pill.warn { background:var(--warn-soft); color:var(--warn); } .pill.bad { background:var(--bad-soft); color:var(--bad); }
.bar { height:8px; background:var(--line); border-radius:4px; overflow:hidden; } .bar > i { display:block; height:100%; background:var(--accent); }
.chart svg { width:100%; height:auto; display:block; overflow:visible; } svg text { fill:var(--fg); font-family:var(--font-body); } svg .mutedt { fill:var(--muted); }
.legend { display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:10px; font-size:12.5px; } .legend i { display:inline-block; width:11px; height:11px; border-radius:3px; margin-right:6px; vertical-align:-1px; }
.src { margin-top:18px; font-size:12.5px; color:var(--muted); } .src li { margin-bottom:4px; }
.spin { display:inline-block; width:14px; height:14px; border:2px solid var(--line); border-top-color:var(--accent); border-radius:50%; animation:sp .8s linear infinite; vertical-align:-2px; } @keyframes sp { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .spin { animation:none; } }

@media (max-width:700px) {
  body { font-size:15px; }
  .field input,.field select,.field textarea,.toolbar input { font-size:16px; }
  .card { padding:16px; border-radius:10px; }
  .stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stat .v { font-size:19px; }
  header.page { padding:16px 0 12px; }
  .row .btn { flex:1 1 auto; }
}
/* Print: always light, no chrome, results only */
@media print {
  :root:root:root, :root[data-theme="dark"]:root:root {
    --bg:#fff; --surface:#fff; --paper:#fff; --fg:#111; --muted:#444; --line:#bbb; --accent:#0c6b58; --accent-fg:#fff; --accent-soft:#eef6f3; --warn:#7a4308; --warn-soft:#f6ecdd; --bad:#b3261e; --bad-soft:#fbe4e2; --good:#1b7a3a; --shadow:none;
    --c1:#1f5fa8; --c2:#c2410c; --c3:#0f8a6d; --c4:#7a3fb5; --c5:#b8860b; --c6:#c0265b; --c7:#2b8aa8; --c8:#6b7f1a; --c9:#8a5a3c; --c10:#4a5fc1; --c11:#d1731a; --c12:#3d7a4f; --c13:#7b8794; --c14:#a8324a;
  }
  html, body { background:#fff !important; color:#111 !important; }
  body { padding:0 !important; font-size:11.5px; }
  .wrap { max-width:none; }
  .card { box-shadow:none; border:1px solid #bbb; break-inside:auto; padding:12px; margin-top:10px !important; }
  .stats { grid-template-columns:repeat(4,1fr); }
  .stat,.rep,tr,.contest,.kpi { break-inside:avoid; }
  h1,h2,h3 { break-after:avoid; }
  svg,.stack,.legend { break-inside:avoid; }
  .btn,button,.row:has(.btn),form button,.chip,.info,.toolbar { display:none !important; }
  .tbl { overflow:visible; } table { font-size:11px; } th,td { white-space:normal; }
  a { color:#111; text-decoration:none; }
  details.sec > summary { list-style:none; }
  .callout { border:1px solid #ccc; }
  input,select,textarea { border:1px solid #bbb !important; background:#fff !important; color:#111 !important; -webkit-appearance:none; appearance:none; }
  input[type=range] { display:none; }
  .grid { display:block; } .grid > * { margin-bottom:10px; }
  header.page p { color:#444; }
}