:root{
  --bg:#f4f6f5; --card:#ffffff; --ink:#14201d; --muted:#5d6b67; --line:#dfe5e3;
  --brand:#0e6b5c; --brand-ink:#ffffff; --brand-soft:#e3f1ee; --accent:#c2410c;
  --ok:#15803d; --ok-soft:#e7f6ec; --warn:#a16207; --warn-soft:#fdf6e3; --bad:#b91c1c;
  --cell:#f7faf9; --hl:#0e6b5c; --shadow:0 1px 2px rgba(16,24,22,.06),0 4px 14px rgba(16,24,22,.05);
  --r:14px; --tabh:64px;
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#0f1514; --card:#18211f; --ink:#e7eeec; --muted:#9aa9a5; --line:#2a3633;
    --brand:#3fb39c; --brand-ink:#06201b; --brand-soft:#173a33; --accent:#fb923c;
    --ok:#4ade80; --ok-soft:#14301f; --warn:#facc15; --warn-soft:#332a0f; --bad:#f87171; --cell:#1d2725; --hl:#3fb39c;
    --shadow:none; }
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.45;-webkit-text-size-adjust:100%}
button,input,select{font:inherit;color:inherit}
a{color:var(--brand)}
.hidden{display:none!important}

/* header */
.top{position:sticky;top:0;z-index:20;padding-top:env(safe-area-inset-top);background:var(--card);border-bottom:1px solid var(--line)}
.top-in{max-width:980px;margin:0 auto;display:flex;align-items:center;gap:16px;padding:10px 16px}
.brand{display:flex;align-items:baseline;gap:8px;white-space:nowrap}
.brand b{font-size:18px;letter-spacing:-.01em;color:var(--brand)}
.brand span{color:var(--muted);font-size:12.5px}
.tabs{display:flex;gap:4px;margin-left:auto}
.tab{border:0;background:transparent;padding:8px 12px;border-radius:10px;cursor:pointer;color:var(--muted);font-weight:600;display:flex;align-items:center;gap:6px}
.tab svg{width:18px;height:18px}
.tab.on{background:var(--brand-soft);color:var(--brand)}
@media (max-width:760px){
  .brand span{display:none}
  .tabs{position:fixed;left:0;right:0;bottom:0;margin:0;background:var(--card);border-top:1px solid var(--line);
    padding:6px 6px calc(6px + env(safe-area-inset-bottom));justify-content:space-around;z-index:30}
  .tab{flex-direction:column;gap:2px;font-size:11.5px;padding:6px 4px;flex:1}
  .tab svg{width:22px;height:22px}
  body{padding-bottom:calc(var(--tabh) + env(safe-area-inset-bottom))}
}

/* patient bar */
.ptbar{max-width:980px;margin:0 auto;padding:8px 16px 0}
.ptbar-in{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px 10px;font-size:13.5px}
.pill{background:var(--cell);border:1px solid var(--line);border-radius:999px;padding:2px 9px;white-space:nowrap}
.pill b{font-variant-numeric:tabular-nums}
.ptbar .empty{color:var(--muted)}
.linkbtn{margin-left:auto;border:0;background:transparent;color:var(--brand);font-weight:600;cursor:pointer;padding:4px 6px}

main{max-width:980px;margin:0 auto;padding:12px 16px 32px}
h2{font-size:20px;margin:6px 0 10px;letter-spacing:-.01em}
h3{font-size:15px;margin:18px 0 8px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px;box-shadow:var(--shadow)}
.muted{color:var(--muted)}
.small{font-size:12.5px}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}

/* search + chips */
.search{width:100%;padding:11px 14px;border-radius:12px;border:1px solid var(--line);background:var(--card);font-size:16px}
.search:focus,.inp:focus,select:focus{outline:2px solid var(--brand);outline-offset:0;border-color:transparent}
.chips{display:flex;gap:6px;overflow-x:auto;padding:10px 0 4px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:6px 12px;white-space:nowrap;cursor:pointer;font-size:13.5px}
.chip.on{background:var(--brand);border-color:var(--brand);color:var(--brand-ink);font-weight:600}
.glinks{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 2px;align-items:center;font-size:13px}
.glinks a{border:1px solid var(--line);border-radius:8px;padding:3px 9px;text-decoration:none;background:var(--card);font-weight:600}

/* regimen list */
.group{margin-top:14px}
.group-h{font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 6px 2px;font-weight:700}
.list{display:grid;gap:8px;grid-template-columns:1fr}
@media (min-width:760px){.list{grid-template-columns:1fr 1fr}}
.item{display:block;text-align:left;width:100%;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:11px 13px;cursor:pointer}
.item:hover{border-color:var(--brand)}
.item .t{font-weight:650}
.item .s{color:var(--muted);font-size:13px;margin-top:2px}
.badge{display:inline-block;font-size:11px;font-weight:700;border-radius:6px;padding:1px 6px;margin-left:6px;vertical-align:1px}
.b-ok{background:var(--ok-soft);color:var(--ok)}
.b-warn{background:var(--warn-soft);color:var(--warn)}

/* sheet */
.sheet{position:fixed;inset:0;z-index:50;background:rgba(10,16,15,.45);display:flex;align-items:flex-end;justify-content:center}
.sheet-in{background:var(--bg);width:100%;max-width:760px;max-height:94vh;overflow:auto;border-radius:18px 18px 0 0;padding:0 0 calc(18px + env(safe-area-inset-bottom))}
@media (min-width:760px){.sheet{align-items:center}.sheet-in{border-radius:18px;max-height:90vh}}
.sheet-h{position:sticky;top:0;background:var(--bg);padding:14px 16px 10px;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:flex-start;z-index:2}
.sheet-h h2{margin:0;font-size:18px}
.x{margin-left:auto;border:0;background:var(--card);border:1px solid var(--line);width:36px;height:36px;border-radius:10px;cursor:pointer;font-size:18px;flex:none}
.sheet-b{padding:12px 16px}
.meta{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 10px}
.ctrl{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}
.ctrl label{font-size:12px;color:var(--muted);display:block;margin-bottom:3px}
select,.inp{width:100%;padding:9px 10px;border-radius:10px;border:1px solid var(--line);background:var(--card);font-size:15px}
.notice{border-radius:10px;padding:9px 12px;font-size:13.5px;margin:8px 0}
.n-warn{background:var(--warn-soft);color:var(--ink);border:1px solid color-mix(in srgb,var(--warn) 30%,transparent)}
.n-info{background:var(--brand-soft)}

.drug{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:8px 0;display:grid;grid-template-columns:1fr auto;gap:2px 12px}
.drug.off{opacity:.5}
.drug .nm{font-weight:650;display:flex;gap:8px;align-items:center}
.drug .nm input{width:18px;height:18px;accent-color:var(--brand)}
.drug .std{color:var(--muted);font-size:13px}
.drug .res{grid-row:1 / span 2;grid-column:2;text-align:right;align-self:center}
.drug .res .mg{font-size:20px;font-weight:750;font-variant-numeric:tabular-nums;color:var(--brand);white-space:nowrap}
.drug .res .dt{font-size:11.5px;color:var(--muted)}
.drug .ex{grid-column:1 / -1;font-size:12.5px;color:var(--muted)}
.drug .ex.tab{color:var(--ink)}
.auc{width:70px;padding:3px 6px;border-radius:7px;border:1px solid var(--line);background:var(--cell);font-size:14px}
ul.notes{margin:6px 0;padding-left:18px}
ul.notes li{margin:3px 0}
.srcs a{display:block;margin:4px 0;font-size:13.5px;word-break:break-word}
.btn{border:0;background:var(--brand);color:var(--brand-ink);font-weight:650;border-radius:11px;padding:10px 14px;cursor:pointer}
.btn.ghost{background:var(--card);color:var(--brand);border:1px solid var(--line)}

/* forms */
.form{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media (min-width:760px){.form{grid-template-columns:repeat(5,1fr)}}
.f label{display:block;font-size:12px;color:var(--muted);margin-bottom:3px}
.seg{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--card)}
.seg button{flex:1;border:0;background:transparent;padding:9px 0;cursor:pointer}
.seg button.on{background:var(--brand);color:var(--brand-ink);font-weight:650}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:12px}
@media (min-width:760px){.stats{grid-template-columns:repeat(4,1fr)}}
.stat{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.stat .k{font-size:12px;color:var(--muted)}
.stat .v{font-size:22px;font-weight:750;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.stat .v small{font-size:12px;font-weight:500;color:var(--muted)}
.stat .d{font-size:11.5px;color:var(--muted)}
.stat.main{border-color:var(--brand);background:var(--brand-soft)}
details.adv{margin-top:10px}
details.adv summary{cursor:pointer;color:var(--brand);font-weight:600;font-size:14px}
.formula{font-family:var(--mono);font-size:12.5px;background:var(--cell);border:1px solid var(--line);border-radius:8px;padding:8px 10px;margin:6px 0;overflow-x:auto}

/* TNM */
.tnmsel{display:grid;grid-template-columns:1fr;gap:8px}
@media (min-width:760px){.tnmsel{grid-template-columns:1fr 1fr 1fr}}
.result{display:flex;align-items:center;gap:14px;margin:12px 0;background:var(--brand);color:var(--brand-ink);border-radius:var(--r);padding:14px 16px}
.result .st{font-size:34px;font-weight:800;letter-spacing:-.02em;line-height:1}
.result .lb{font-size:12px;opacity:.85}
.result .code{font-family:var(--mono);font-size:14px}
.result.na{background:var(--cell);color:var(--muted);border:1px dashed var(--line)}
.defs{font-size:13.5px}
.defs div{padding:4px 0;border-bottom:1px dashed var(--line)}
.defs b{display:inline-block;min-width:46px}
.mx{overflow-x:auto;margin-top:8px}
.mx table{border-collapse:separate;border-spacing:3px;font-size:13px}
.mx th{font-weight:650;color:var(--muted);padding:3px 6px;text-align:center;white-space:nowrap}
.mx td{background:var(--cell);border-radius:6px;padding:5px 8px;text-align:center;font-weight:650;min-width:44px;cursor:pointer;white-space:nowrap}
.mx td.na{color:var(--muted);font-weight:400;cursor:default}
.mx td.sel{background:var(--hl);color:var(--brand-ink)}
.figo button{display:flex;gap:10px;width:100%;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:9px 11px;margin:5px 0;cursor:pointer}
.figo button b{min-width:72px;color:var(--brand)}
.figo button.sel{border-color:var(--brand);background:var(--brand-soft)}

/* tables */
table.t{width:100%;border-collapse:collapse;font-size:13.5px}
table.t th,table.t td{border-bottom:1px solid var(--line);padding:7px 6px;text-align:left;vertical-align:top}
table.t th{color:var(--muted);font-weight:600;font-size:12px}
table.t td.n{text-align:right;font-variant-numeric:tabular-nums;font-weight:650}
.crow{display:grid;grid-template-columns:1.4fr 1fr 1fr auto;gap:6px;margin:6px 0;align-items:center}
.crow .out{grid-column:1 / -1;font-size:13px;color:var(--muted);margin-top:-2px}
.crow .out b{color:var(--brand);font-size:15px}
.rm{border:1px solid var(--line);background:var(--card);border-radius:8px;width:34px;height:38px;cursor:pointer}

footer{max-width:980px;margin:0 auto;padding:0 16px 24px;color:var(--muted);font-size:12px}
.toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:8px 14px;border-radius:10px;font-size:14px;z-index:60}
@media print{.top,.ptbar,.tabs,footer,.x,.btn{display:none!important}.sheet{position:static;background:none}.sheet-in{max-height:none}}

.meta .pill{white-space:normal}
.ptbar-in{flex-wrap:nowrap}
.ptbar-in .pills{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;min-width:0}
.ptbar-in .pills::-webkit-scrollbar{display:none}
.linkbtn{flex:none}

/* ===== Trang đăng nhập / tài khoản / quản trị (bản máy chủ) ===== */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px}
.auth-card{width:100%;max-width:400px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:var(--shadow)}
.auth-card h1{font-size:22px;margin:0 0 4px;color:var(--brand)}
.auth-card .sub{color:var(--muted);font-size:13.5px;margin:0 0 18px}
.field{margin:0 0 12px}
.field label{display:block;font-size:12.5px;color:var(--muted);margin-bottom:4px}
.btn.block{width:100%;padding:12px}
.err{background:color-mix(in srgb,var(--bad) 12%,transparent);color:var(--bad);border-radius:10px;padding:8px 12px;font-size:13.5px;margin:0 0 12px}
.ok{background:var(--ok-soft);color:var(--ok);border-radius:10px;padding:8px 12px;font-size:13.5px;margin:0 0 12px}
.linkish{background:none;border:0;color:var(--brand);cursor:pointer;padding:0;font:inherit;text-decoration:underline}
.page{max-width:980px;margin:0 auto;padding:16px}
.page .card+.card{margin-top:12px}
.usermenu{position:relative;margin-left:8px}
.userbtn{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:5px 10px 5px 5px;display:flex;align-items:center;gap:6px;cursor:pointer;font-size:13px;max-width:180px}
.avatar{width:26px;height:26px;border-radius:50%;background:var(--brand);color:var(--brand-ink);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;flex:none}
.userbtn .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.menu{position:absolute;right:0;top:calc(100% + 6px);background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.12);min-width:220px;padding:6px;z-index:40}
.menu .who{padding:8px 10px;border-bottom:1px solid var(--line);margin-bottom:4px;font-size:13px}
.menu a,.menu button{display:block;width:100%;text-align:left;padding:9px 10px;border-radius:8px;border:0;background:none;color:var(--ink);text-decoration:none;cursor:pointer;font-size:14px}
.menu a:hover,.menu button:hover{background:var(--cell)}
.tag{white-space:nowrap;display:inline-block;font-size:11.5px;border-radius:6px;padding:1px 6px;background:var(--cell);border:1px solid var(--line);margin:1px 2px 1px 0}
.tag.on{background:var(--brand-soft);border-color:transparent;color:var(--brand)}
.tag.warn{background:var(--warn-soft);border-color:transparent;color:var(--warn)}
.qr{background:#fff;border-radius:12px;padding:8px;display:inline-block;line-height:0}
.qr svg{width:200px;height:200px}
.mono{font-family:var(--mono)}
.codes{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;font-family:var(--mono);font-size:14px;margin:8px 0}
.codes span{background:var(--cell);border:1px solid var(--line);border-radius:8px;padding:6px 8px;text-align:center}
.grid2{display:grid;grid-template-columns:1fr;gap:10px}
@media (min-width:760px){.grid2{grid-template-columns:1fr 1fr}}
.checks{display:flex;flex-wrap:wrap;gap:10px;font-size:14px}
.checks label{display:flex;gap:6px;align-items:center}
.modal{position:fixed;inset:0;background:rgba(10,16,15,.45);display:flex;align-items:center;justify-content:center;z-index:60;padding:16px}
.modal>.card{width:100%;max-width:520px;max-height:90vh;overflow:auto}
table.t td .btn{padding:5px 9px;font-size:12.5px;border-radius:8px}
@media (max-width:760px){.top-in .usermenu{margin-left:auto}}
.offline-chip{margin-left:8px;font-size:12px;border-radius:999px;padding:3px 9px;background:var(--warn-soft);color:var(--warn)}
.navbadge{display:inline-block;min-width:18px;height:18px;line-height:18px;padding:0 5px;border-radius:999px;background:var(--bad);color:#fff;font-size:11px;font-weight:800;text-align:center;margin-left:6px}
.userbtn{position:relative}

/* ---- Thuốc & kế hoạch truyền ---- */
.dseg{display:flex;flex-wrap:wrap;margin:10px 0}
.dseg button{flex:1 1 auto}
.item .tags,.meta .tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.tag.em-cao,.tag.em-ac{background:#fde2e1;color:#9b1c1c}
.tag.em-tb,.tag.em-carbo{background:#fdecc8;color:#8a4b00}
.tag.em-thap{background:#e6f1fb;color:#1b4f8a}
.tag.em-min{background:var(--brand-soft);color:var(--brand)}
.tag.ext-vdna,.tag.ext-vnon{background:#fde2e1;color:#9b1c1c}
.tag.ext-iwvc,.tag.ext-iwvw{background:#fdecc8;color:#8a4b00}
@media (prefers-color-scheme: dark){.tag.em-cao,.tag.em-ac,.tag.ext-vdna,.tag.ext-vnon{background:#4a1d1d;color:#fbb}.tag.em-tb,.tag.em-carbo,.tag.ext-iwvc,.tag.ext-iwvw{background:#4a3410;color:#fd9}.tag.em-thap{background:#17324d;color:#9cf}}
.emlvl{margin:10px 0;padding:8px 10px;border-radius:10px;background:var(--brand-soft)}
.emlvl.em-cao,.emlvl.em-ac{background:#fde2e1}.emlvl.em-tb,.emlvl.em-carbo{background:#fdecc8}
@media (prefers-color-scheme: dark){.emlvl.em-cao,.emlvl.em-ac{background:#4a1d1d}.emlvl.em-tb,.emlvl.em-carbo{background:#4a3410}}
ol.plan{list-style:none;margin:6px 0;padding:0}
ol.plan li.ph{font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.02em;color:var(--brand);margin:12px 0 4px}
ol.plan li.st{padding:7px 10px;border-left:3px solid var(--line);margin:3px 0;background:var(--card);border-radius:0 8px 8px 0}
ol.plan li.st .sub{font-size:12.5px;color:var(--muted);margin-top:3px}
.plan-d{margin-top:8px}
table.kv th{width:32%;vertical-align:top;text-align:left}
details.topic{margin-top:10px}
details.topic summary{cursor:pointer}
details.topic h4{margin:12px 0 4px;font-size:14px}
@media print{ol.plan li.st{border-left:2px solid #999}}

.badge.b-lib{background:var(--brand-soft);color:var(--brand)}

/* lịch chu kỳ */
.sched{margin:6px 0 10px}
.sched-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:var(--card)}
.sched-t{border-collapse:collapse;font-size:12px;min-width:100%}
.sched-t th,.sched-t td{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:0;text-align:center;min-width:22px;height:26px}
.sched-t thead th{font-weight:600;color:var(--muted);background:var(--cell);padding:3px 1px;line-height:1.1;vertical-align:bottom}
.sched-t thead th .dm{display:block;font-weight:400;font-size:9.5px;color:var(--muted)}
.sched-t thead th.sun{color:var(--bad)}
.sched-t thead th.rest{background:repeating-linear-gradient(135deg,var(--cell),var(--cell) 3px,var(--line) 3px,var(--line) 4px)}
.sched-t thead th.over{color:var(--warn)}
.sched-t .sched-nm{position:sticky;left:0;z-index:1;background:var(--card);text-align:left;padding:3px 8px;min-width:150px;max-width:220px;font-weight:600;color:var(--ink);border-right:2px solid var(--line)}
.sched-t thead .sched-nm{background:var(--cell);color:var(--muted)}
.sched-nm .nm{display:block;font-size:12.5px;line-height:1.2}
.sched-nm .rt{display:block;font-weight:400;font-size:10.5px;color:var(--muted);line-height:1.2}
.sched-t td.rest{background:repeating-linear-gradient(135deg,transparent,transparent 3px,var(--cell) 3px,var(--cell) 5px)}
.sched-t td.on{color:#fff;font-size:9px;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.sched-t td.on.pv{border-left-color:transparent}
.k-iv{background:#0e6b5c}.k-inj{background:#2563eb}.k-pump{background:#7c3aed}.k-oral{background:#d97706}
.sched-t td.on span{opacity:.85}
.sched-leg{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--muted);margin:6px 2px}
.sched-leg i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:5px;vertical-align:-2px;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.sched-leg i.rest{background:repeating-linear-gradient(135deg,var(--card),var(--card) 2px,var(--line) 2px,var(--line) 4px);border:1px solid var(--line)}
.sched-sum{margin:4px 2px;line-height:1.55}
@media print{.sched-scroll{overflow:visible;border-color:#999}.sched-t{font-size:9.5px}.sched-t th,.sched-t td{min-width:0;height:20px;border-color:#bbb}.sched-t .sched-nm{min-width:110px;position:static}}

/* Dòng nhắc sinh nhật (bản máy chủ) */
.bday{background:var(--cell);border-bottom:1px solid var(--line);font-size:13.5px}
.bday.on{background:#fff8e6;border-bottom-color:#ecd9a6}
.bday-in{max-width:980px;margin:0 auto;display:flex;align-items:center;gap:8px;padding:6px 16px}
.bday-tx{flex:1;line-height:1.4}
.bday-x{border:0;background:none;font-size:18px;line-height:1;cursor:pointer;color:var(--muted);padding:2px 6px}
@media print{.bday{display:none!important}}