:root{--bg:#f6f7f9;--fg:#1d2433;--card:#fff;--ac:#2563eb;--bd:#d9dde5;--err:#b91c1c}
@media(prefers-color-scheme:dark){:root{--bg:#10141c;--fg:#e6e9ef;--card:#1a202c;--bd:#2f384a}}
*{box-sizing:border-box}
body{margin:0;font:16px/1.5 system-ui,sans-serif;background:var(--bg);color:var(--fg)}
.wrap{max-width:1000px;margin:0 auto;padding:16px}.narrow{max-width:560px}
.top{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;padding:10px 16px;background:var(--card);border-bottom:1px solid var(--bd)}
.top nav{display:flex;flex-wrap:wrap;gap:14px;align-items:center}.brand{font-weight:700;text-decoration:none;color:var(--fg)}
a{color:var(--ac)}h1{font-size:1.6rem}h2{margin-top:2rem}
.card{background:var(--card);border:1px solid var(--bd);border-radius:10px;padding:14px;margin:12px 0}
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:end}
label{display:block;font-weight:600;margin:8px 0}
input:not([type=radio],[type=checkbox]),textarea,select{display:block;width:100%;padding:10px;border:1px solid var(--bd);border-radius:8px;font:inherit;background:var(--bg);color:var(--fg)}
.row label{flex:1 1 150px}
.btn{display:inline-block;padding:10px 16px;border:0;border-radius:8px;background:var(--ac);color:#fff;font:inherit;font-weight:600;cursor:pointer;text-decoration:none}
.btn.small{padding:5px 10px;font-size:.9rem}.btn.big{width:100%;padding:16px;font-size:1.1rem;margin:16px 0}
.btn.warn{background:#d97706}.btn.danger{background:var(--err)}
.link-btn,button.link{background:none;border:0;color:var(--ac);font:inherit;cursor:pointer}
form.inline{display:inline}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.kpi{background:var(--card);border:1px solid var(--bd);border-radius:10px;padding:12px}.kpi b{display:block;font-size:1.8rem}.kpi span{font-size:.85rem;opacity:.8}
.hint{font-size:.85rem;opacity:.75}.err{color:var(--err);font-weight:600}
table{width:100%;border-collapse:collapse;display:block;overflow-x:auto}th,td{padding:6px 10px;border-bottom:1px solid var(--bd);text-align:left;white-space:nowrap}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 14px}.chip{padding:6px 12px;border:1px solid var(--ac);border-radius:99px;background:none;color:var(--ac);font:inherit;cursor:pointer}
.chk{display:flex;gap:8px;align-items:center;font-weight:400}.chk input{width:auto}
.link{display:flex;gap:14px;align-items:center}.url{word-break:break-all}
.bar{display:flex;align-items:center;gap:8px;margin:3px 0}.bar span{width:90px;font-size:.85rem;overflow:hidden;text-overflow:ellipsis}
.bar i{display:block;height:14px;background:var(--ac);border-radius:3px;min-width:2px}.bar em{font-style:normal;font-size:.85rem}
.chart{width:100%;max-width:560px;height:auto}.chart .grid{stroke:var(--bd)}.chart .ax{font-size:10px;fill:var(--fg)}
.legend span{margin-right:12px;font-size:.85rem}.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:4px}
.danger{border-color:var(--err)}
/* patient, mobile-first */
.patient fieldset{border:1px solid var(--bd)}.patient legend{font-weight:600;padding:0 6px}.req{color:var(--err)}
.scale{display:flex;flex-wrap:wrap;gap:6px}.scale label,.opt{margin:0;font-weight:400}
.scale input,.opt input{position:absolute;opacity:0}
.scale span{display:flex;min-width:44px;height:44px;align-items:center;justify-content:center;border:1px solid var(--bd);border-radius:8px;cursor:pointer}
.opt span{display:block;padding:12px;border:1px solid var(--bd);border-radius:8px;margin:6px 0;cursor:pointer}
input:checked+span{background:var(--ac);color:#fff;border-color:var(--ac)}
input:focus-visible+span{outline:3px solid #93c5fd}
.ends{display:flex;justify-content:space-between;font-size:.8rem;opacity:.75;margin-top:4px}