:root {
  --bg:#f6f5f2; --panel:#fff; --ink:#1d1f23; --muted:#6a6f78; --line:#e2e0db;
  --accent:#1f5fbf; --accent-ink:#fff; --good:#1b7a43; --bad:#b3261e; --warn:#9a6200; --soft:#eef2f9;
  color-scheme:light;
}
@media (prefers-color-scheme:dark) {
  :root:not([data-theme="light"]) {
    --bg:#15171a; --panel:#1e2125; --ink:#e8e9eb; --muted:#9aa0a8; --line:#30343a;
    --accent:#6ea2f5; --accent-ink:#0d1420; --good:#58c088; --bad:#ef7a72; --warn:#e3b05a; --soft:#22293a;
    color-scheme:dark;
  }
}
:root[data-theme="dark"] {
  --bg:#15171a; --panel:#1e2125; --ink:#e8e9eb; --muted:#9aa0a8; --line:#30343a;
  --accent:#6ea2f5; --accent-ink:#0d1420; --good:#58c088; --bad:#ef7a72; --warn:#e3b05a; --soft:#22293a;
  color-scheme:dark;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; }
.bar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; border-bottom:1px solid var(--line); background:var(--panel); flex-wrap:wrap; }
.brand { font-weight:700; color:var(--ink); text-decoration:none; }
nav { display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
nav a { color:var(--accent); text-decoration:none; }
main { max-width:1100px; margin:0 auto; padding:20px 16px 40px; }
h1 { font-size:22px; margin:0 0 4px; } h2 { font-size:17px; margin:24px 0 8px; } h3 { font-size:15px; margin:12px 0 4px; }
.muted { color:var(--muted); } .foot { text-align:center; font-size:13px; padding:0 16px 24px; }
.card { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:16px; margin:12px 0; }
.row { display:flex; gap:12px; flex-wrap:wrap; align-items:end; }
label { display:block; font-size:13px; color:var(--muted); margin-bottom:4px; }
input,select,textarea { font:inherit; color:var(--ink); background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:7px 9px; max-width:100%; }
textarea { width:100%; min-height:38px; }
button { font:inherit; border-radius:6px; padding:7px 14px; border:1px solid var(--accent); background:var(--accent); color:var(--accent-ink); cursor:pointer; }
button.ghost { background:transparent; color:var(--accent); }
button.link { border:0; background:none; color:var(--accent); padding:0; }
button.danger { border-color:var(--bad); background:var(--bad); color:#fff; }
button:disabled { opacity:.5; cursor:default; }
.err { color:var(--bad); }
.grid2 { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; }
@media (max-width:800px) { .grid2 { grid-template-columns:1fr; } }
.screen { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px; }
.screen .who { font-weight:700; margin-top:10px; }
.screen ul { list-style:none; margin:4px 0; padding:0; }
.screen li { padding:1px 0; border-bottom:1px dotted var(--line); }
details summary { cursor:pointer; color:var(--accent); font-size:13px; }
.state { display:inline-block; padding:2px 8px; border-radius:99px; background:var(--soft); font-size:13px; }
.stats { display:flex; gap:20px; flex-wrap:wrap; } .stat b { display:block; font-size:22px; }
.good { color:var(--good); } .bad { color:var(--bad); } .warn { color:var(--warn); }
table { width:100%; border-collapse:collapse; } th,td { text-align:left; padding:6px 8px; border-bottom:1px solid var(--line); vertical-align:top; }
th { font-size:13px; color:var(--muted); font-weight:600; }
.scroll { overflow-x:auto; }
.issue { border-top:1px solid var(--line); padding:12px 0; }
.issue:first-child { border-top:0; }
.quote { background:var(--soft); border-radius:6px; padding:6px 10px; margin:6px 0; }
.transcript p { margin:4px 0; } .transcript .agent b { color:var(--accent); } .transcript .user b { color:var(--good); }
.saved { font-size:13px; color:var(--good); margin-left:8px; }
audio { height:32px; vertical-align:middle; max-width:100%; }
[hidden] { display:none !important; }
button.link { text-align:left; }
.call { background:var(--panel); border:1px solid var(--line); border-radius:10px; margin:10px 0; }
.call > summary { list-style:none; padding:12px 16px; display:flex; gap:12px; align-items:center; flex-wrap:wrap; color:var(--ink); font-size:15px; }
.call > summary::-webkit-details-marker { display:none; }
.call > summary::before { content:"▸"; color:var(--muted); }
.call[open] > summary::before { content:"▾"; }
.call > summary b { font-weight:600; }
.call .body { padding:0 16px 16px; }
.answers td:first-child { width:38%; }
.answers .patient td { font-weight:700; background:var(--soft); }
.answers .heard { display:block; font-size:13px; color:var(--muted); }
.sheet td:first-child { color:var(--muted); }
.sheet th:not(:first-child),.sheet td:not(:first-child) { font-weight:600; }
.sheet .id td { background:var(--soft); }
