/* ===== HemeOncBuddy note tables (hx) =====
   Class-based so note HTML in the Sheet stays small (50k cell limit).
   Responsive to the note column itself (container queries), light + dark. */
.note-body .hx-wrap{
  --hx-ink:#1f2633; --hx-soft:#4b5565; --hx-faint:#6b7483;
  --hx-rule:#dfe4ec; --hx-rule-strong:#b9c3d3; --hx-head:#0d1f4d; --hx-head-ink:#ffffff;
  --hx-band:#f5f7fb; --hx-zebra:#fafbfd;
  --pv:#9e2b3a; --pv-t:#fbf1f2; --et:#5a4596; --et-t:#f4f1fa; --mf:#2d6c70; --mf-t:#eef6f6;
  --lo:#1e6b40; --lo-t:#e6f3eb; --int:#8a5700; --int-t:#fcf1dc; --hi:#a3232e; --hi-t:#fbe7e8; --vlo:#3b4a60; --vlo-t:#edf1f6;
  --jak2:#2d5fa8; --calr:#c23b35; --mpl:#2f8a55; --tn:#a3abb8;
  --pearl:#9a5b00; --pearl-t:#fffaf1;
  container-type:inline-size; container-name:hx; clear:both;
  margin:20px 0 26px; font-family:var(--sans); color:var(--hx-ink);
  overflow-wrap:break-word; word-break:normal; hyphens:manual;
  font-variant-numeric:tabular-nums lining-nums;
}
.note-body .hx-cap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 16px;
  padding:0 0 7px;margin:0;border-bottom:2px solid var(--hx-head)}
.note-body .hx-cap .t{font-size:15.5px;font-weight:700;color:var(--hx-head);letter-spacing:.005em}
.note-body .hx-cap .s{font-size:11.5px;color:var(--hx-faint)}
.note-body .hx-foot{font-size:11.5px;color:var(--hx-faint);padding:7px 2px 0;line-height:1.5}

.note-content .note-body .hx-wrap table.hx{display:table;width:100%;max-width:100%;margin:0;border-radius:0;
  border-collapse:separate;border-spacing:0;font-size:13.25px;line-height:1.48;table-layout:auto}
.note-content .note-body .hx-wrap table.hx th,
.note-content .note-body .hx-wrap table.hx td{border:0;border-bottom:1px solid var(--hx-rule);padding:9px 11px;vertical-align:top;text-align:left}
.note-content .note-body .hx-wrap table.hx thead th{background:var(--hx-head);color:var(--hx-head-ink);font-size:11px;font-weight:700;
  letter-spacing:.07em;text-transform:uppercase;padding:8px 11px;white-space:nowrap;border-bottom:0}
.note-body table.hx td + td,.note-body table.hx th + th{border-left:1px solid var(--hx-rule)}
.note-body table.hx tr.g1 > td{border-top:2px solid var(--hx-rule-strong)}
.note-body table.hx tbody tr:first-child > td{border-top:0}
.note-body table.hx p{margin:0 0 4px}
.note-body table.hx p:last-child{margin-bottom:0}
.note-body table.hx ul{margin:2px 0 0;padding-left:16px}
.note-body table.hx li{margin:1px 0}
.note-body table.hx b,.note-body table.hx strong{font-weight:650;color:inherit}

.note-body table.hx th.w15{width:15%} .note-body table.hx th.w20{width:20%} .note-body table.hx th.w22{width:22%}
.note-body table.hx th.w25{width:25%} .note-body table.hx th.w30{width:30%} .note-body table.hx th.w35{width:35%} .note-body table.hx th.w40{width:40%}
/* entity (row-group) cell */
.note-body table.hx td.ent{width:128px;min-width:118px;border-left:4px solid var(--c);background:var(--ct)}
.note-body table.hx td.ent .nm{display:block;font-size:17px;font-weight:750;color:var(--c);letter-spacing:.01em;line-height:1.2}
.note-body table.hx td.ent .full{display:block;font-size:11.5px;color:var(--hx-soft);margin:1px 0 8px}
.note-body table.hx td.ent .kv{display:block;font-size:12px;color:var(--hx-soft);margin:2px 0}
.note-body table.hx td.ent .kv b{color:var(--hx-ink)}
.note-body .pv{--c:var(--pv);--ct:var(--pv-t)} .note-body .et{--c:var(--et);--ct:var(--et-t)} .note-body .mf{--c:var(--mf);--ct:var(--mf-t)}

/* mutation bar */
.note-body .mut{margin:9px 0 2px}
.note-body .mut .bar{display:flex;height:9px;border-radius:2px;overflow:hidden;background:var(--hx-rule)}
.note-body .mut .bar i{display:block;height:100%}
.note-body .mut .j{background:var(--jak2)} .note-body .mut .c{background:var(--calr)} .note-body .mut .m{background:var(--mpl)} .note-body .mut .n{background:var(--tn)}
.note-body .mut .lg{display:block;font-size:11px;line-height:1.55;margin-top:4px;color:var(--hx-soft)}
.note-body .mut .lg span{display:inline-block;margin-right:7px;white-space:nowrap}
.note-body .mut .lg span::before{content:"";display:inline-block;width:7px;height:7px;border-radius:1px;margin-right:4px;vertical-align:0;background:var(--tn)}
.note-body .mut .lg .lj::before{background:var(--jak2)} .note-body .mut .lg .lc::before{background:var(--calr)} .note-body .mut .lg .lm::before{background:var(--mpl)} .note-body .mut .lg .ln::before{background:var(--tn)}
.note-body .mut .lg b{color:var(--hx-ink);font-weight:600}
.note-body .mut-key{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:11.5px;color:var(--hx-soft)}
.note-body .mut-key span::before{content:"";display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px;background:var(--k)}

/* diagnostic criteria */
.note-body .lbl{display:block;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--hx-faint);margin:0 0 3px}
.note-body .lbl + ol,.note-body .lbl + ul{margin-top:0}
.note-body ol.crit{list-style:none;counter-reset:c;margin:0 0 8px;padding:0}
.note-body ol.crit > li{counter-increment:c;position:relative;padding-left:23px;margin:3px 0}
.note-body ol.crit > li::before{content:counter(c);position:absolute;left:0;top:1px;width:16px;height:16px;border-radius:50%;
  border:1.5px solid var(--c,var(--hx-head));color:var(--c,var(--hx-head));font-size:10px;font-weight:700;line-height:13.5px;text-align:center}
.note-body ol.crit.minor > li::before{border-style:dashed}
.note-body .rule{display:block;font-size:12px;color:var(--hx-soft);background:var(--hx-band);border-radius:3px;padding:5px 8px;margin:4px 0 6px}
.note-body .rule b{color:var(--hx-ink)}

/* risk tiers */
.note-body .tier{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  padding:2px 7px;border-radius:3px;margin:0 0 5px;white-space:nowrap;color:var(--tc);background:var(--tt)}
.note-body .vlo{--tc:var(--vlo);--tt:var(--vlo-t)} .note-body .lo{--tc:var(--lo);--tt:var(--lo-t)}
.note-body .int{--tc:var(--int);--tt:var(--int-t)} .note-body .hi{--tc:var(--hi);--tt:var(--hi-t)}
.note-body table.hx td.rk{border-left:3px solid var(--tc)!important;background:color-mix(in srgb,var(--tt) 55%,transparent)}
.note-body .def{display:block;font-size:12.75px;color:var(--hx-ink)}

/* score box */
.note-content .note-body .hx-wrap table.sc{font-size:12.25px!important;line-height:1.4;display:table!important;width:100%;margin:4px 0 6px!important;border-collapse:collapse;font-size:12.25px;border-radius:0!important}
.note-body table.sc td{border:0!important;border-bottom:1px dotted var(--hx-rule-strong)!important;padding:2px 0!important;background:none!important}
.note-body table.sc td:last-child{text-align:right;white-space:nowrap;font-weight:650;padding-left:10px!important}
.note-body table.sc tr:last-child td{border-bottom:0!important}

/* pearls */
.note-body .pearl{display:block;font-size:12.25px;line-height:1.45;color:var(--hx-ink);background:var(--pearl-t);
  border-left:3px solid var(--pearl);padding:4px 8px;margin:6px 0 0;border-radius:0 3px 3px 0}
.note-body .pearl::before{content:"Pearl";font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--pearl);margin-right:6px}
.note-body .pearl.warn::before{content:"Caution"}
.note-body .pearl.new::before{content:"New 2026"}
.note-body .dr{font-weight:650}
.note-body .tr{color:var(--hx-soft);font-size:.94em}
.note-body .new{font-size:10px;font-weight:800;letter-spacing:.06em;color:var(--hi);text-transform:uppercase;margin-left:4px;white-space:nowrap}

/* full-width band row */
.note-body table.hx td.band{background:var(--hx-band);font-size:12.5px;text-align:center;color:var(--hx-ink);border-top:2px solid var(--hx-rule-strong)}

/* matrix tables (drug comparison): sticky first column + horizontal scroll */
.note-body .hx-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.note-content .note-body .hx-wrap table.hx.matrix{min-width:760px}
.note-body table.hx.matrix tbody th{position:sticky;left:0;z-index:1;background:var(--hx-band);font-size:11.5px;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;color:var(--hx-soft);white-space:nowrap;width:1%;border-bottom:1px solid var(--hx-rule)}
.note-content .note-body .hx-wrap table.hx.matrix thead th{white-space:normal;text-transform:none;letter-spacing:0;font-size:12.5px;line-height:1.25;vertical-align:bottom;padding:9px 9px}
.note-content .note-body .hx-wrap table.hx.matrix td{padding:8px 9px;font-size:12.75px}
.note-body table.hx.matrix thead th .br{display:block;font-weight:400;opacity:.78;font-size:11px}
.note-body table.hx.matrix thead th:first-child{position:sticky;left:0;z-index:2}
.note-body table.hx.matrix tbody tr:nth-child(even) td{background:var(--hx-zebra)}
.note-body .y{font-weight:700;color:var(--hi)} .note-body .n0{color:var(--hx-faint)}

/* grouped rows (lab tables) */
.note-body table.hx td.grp{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--hx-soft);
  background:var(--hx-band);width:1%;white-space:nowrap}
.note-body table.hx td.val{white-space:nowrap;font-weight:650}

/* 2 x 2 state grid (prostate) */
.note-body table.hx.grid td.axis{background:var(--hx-band);width:1%;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--hx-soft);vertical-align:middle;text-align:center}
.note-body table.hx.grid td.axis span{display:block;font-size:10.5px;font-weight:500;text-transform:none;letter-spacing:0;margin-top:3px}
.note-body table.hx.grid td.st{width:50%}
.note-body .stn{display:flex;align-items:baseline;gap:8px;margin:0 0 6px}
.note-body .stn b{font-size:15px;font-weight:750;color:var(--sc)}
.note-body .stn span{font-size:11.5px;color:var(--hx-soft)}
.note-body td.st{border-top:3px solid var(--sc)!important}
.note-body .s1{--sc:#3a78b5} .note-body .s2{--sc:#2c5a93} .note-body .s3{--sc:#7a4d9c} .note-body .s4{--sc:#9e2b3a}
.note-body .dfn{display:block;font-size:12.25px;color:var(--hx-soft);border-bottom:1px dashed var(--hx-rule-strong);padding-bottom:6px;margin-bottom:6px}
.note-body .opt{margin:0;padding:0;list-style:none}
.note-body .opt > li{position:relative;padding-left:13px;margin:3px 0}
.note-body .opt > li::before{content:"";position:absolute;left:1px;top:.62em;width:5px;height:5px;background:var(--sc,var(--hx-head));border-radius:1px}
.note-body .hx-fig{display:block;width:100%;height:auto;margin:0 0 4px}
.note-body .hx-fig text{font-family:var(--sans)}

/* ---------- narrow note column: stack rows into cards ---------- */
@container hx (max-width: 760px){
  .note-body table.hx:not(.matrix),.note-body table.hx:not(.matrix) > tbody,
  .note-body table.hx:not(.matrix) > tbody > tr,.note-body table.hx:not(.matrix) > tbody > tr > td{display:block;width:auto!important}
  .note-body table.hx:not(.matrix) > thead{display:none}
  .note-body table.hx:not(.matrix) > tbody > tr > td{border-left:0!important;padding:8px 10px}
  .note-body table.hx:not(.matrix) > tbody > tr > td[data-l]::before{content:attr(data-l);display:block;font-size:10px;font-weight:700;
    letter-spacing:.08em;text-transform:uppercase;color:var(--hx-faint);margin-bottom:3px}
  .note-body table.hx td.ent{border-left:4px solid var(--c)!important;margin-top:14px}
  .note-body table.hx td.rk{border-left:3px solid var(--tc)!important}
  .note-body table.hx td.grp{margin-top:10px}
  .note-body table.hx.grid td.axis{text-align:left;margin-top:12px}
  .note-body table.hx.grid td.axis.corner{display:none}
  /* lab-style tables: test + value on one line, pitfall underneath */
  .note-body table.hx.labs > tbody > tr{display:grid!important;grid-template-columns:1fr auto;border-bottom:1px solid var(--hx-rule)}
  .note-body table.hx.labs > tbody > tr > td{border:0!important;padding:7px 10px 2px}
  .note-body table.hx.labs > tbody > tr > td[data-l]::before{display:none}
  .note-body table.hx.labs td.grp{grid-column:1 / -1;margin-top:0;padding:6px 10px!important}
  .note-body table.hx.labs td.val{text-align:right}
  .note-body table.hx.labs td.pit{grid-column:1 / -1;padding:0 10px 8px!important;font-size:12.5px;color:var(--hx-soft)}
  .note-body table.hx.grid tr.hdr{display:none!important}
  .note-body .hx-figwrap{overflow-x:auto}
  .note-body .hx-figwrap .hx-fig{min-width:620px}
}


/* ---------- landscape layout: entities as columns ---------- */
.note-content .note-body .hx-wrap table.hx.land{table-layout:fixed}
.note-body table.hx.land thead th.col{font-size:12px;text-transform:none;letter-spacing:.01em;border-top:4px solid var(--c);background:var(--hx-head)}
.note-body table.hx.land thead th.col .nm{font-size:18px;font-weight:800;margin-right:8px;letter-spacing:.02em}
.note-body table.hx.land thead th.col .full{font-weight:500;opacity:.85}
.note-body table.hx.land thead th.rl{width:108px}
.note-body table.hx.land td.rl{overflow-wrap:normal;word-break:keep-all;background:var(--hx-band);font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--hx-soft);vertical-align:top}
.note-body table.hx.land td.c{border-top:0}
.note-body table.hx.land td.prof{background:var(--ct)}
.note-body .prof .kv{display:inline-block;font-size:12.5px;color:var(--hx-soft);margin:0 14px 2px 0}
.note-body .prof .kv b{color:var(--hx-ink)}
.note-body .crit2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.note-body .tb{display:grid;grid-template-columns:132px 1fr;gap:0 12px;padding:8px 0;border-top:1px solid var(--hx-rule)}
.note-body .tb:first-child{border-top:0;padding-top:0}
.note-body .tb > .rkx{border-left:3px solid var(--tc);padding-left:8px}
.note-body .tb p{margin:0 0 4px}
.note-body .tb ul{margin:2px 0 0;padding-left:16px}
.note-body table.hx.land td.pearls .pearl:first-child{margin-top:0}
@container hx (max-width: 900px){
  .note-body table.hx.land thead{display:none}
  .note-body table.hx.land,.note-body table.hx.land tbody,.note-body table.hx.land tr,.note-body table.hx.land td{display:block;width:auto!important}
  .note-body table.hx.land td.rl{display:none}
  .note-body .tb{grid-template-columns:1fr}
  .note-body .crit2{grid-template-columns:1fr}
}

/* thick separators between row groups (entities) */
.note-content .note-body .hx-wrap table.hx tr.g1 > td{border-top:4px solid var(--hx-head)}
.note-content .note-body .hx-wrap table.hx tbody tr:first-child > td{border-top:0}
.note-content .note-body .hx-wrap table.hx td.band{border-top:4px solid var(--hx-head)}

/* thick outer outline, same weight as group separators */
.note-content .note-body .hx-wrap table.hx{border:4px solid var(--hx-head)}

/* thick vertical column lines, same weight as the outline */
.note-content .note-body .hx-wrap table.hx > tbody > tr > td + td,
.note-content .note-body .hx-wrap table.hx > tbody > tr > td.rk{border-left:4px solid var(--hx-head)!important}
.note-content .note-body .hx-wrap table.hx > tbody > tr > td.rk{box-shadow:inset 4px 0 0 var(--tc)}
.note-content .note-body .hx-wrap table.hx > thead > tr > th + th{border-left:4px solid #2a3f73}
.note-content .note-body .hx-wrap table.hx > tbody > tr > td.band{border-left:0!important}
@container hx (max-width: 760px){
  .note-content .note-body .hx-wrap table.hx:not(.matrix) > tbody > tr > td + td{border-left:0!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix) > tbody > tr > td.rk{border-left:4px solid var(--tc)!important;box-shadow:none}
}

/* extra entity color: blue */
.note-body .hx-wrap{--bl:#2c5a93;--bl-t:#eef3fa}
.note-body .bl{--c:var(--bl);--ct:var(--bl-t)}
/* first visible cell of a continuation row under a rowspan entity cell */
.note-content .note-body .hx-wrap table.hx > tbody > tr > td.cl{border-left:4px solid var(--hx-head)!important}
@container hx (max-width: 760px){ .note-content .note-body .hx-wrap table.hx > tbody > tr > td.cl{border-left:0!important} }


/* ---------- dark mode: tables keep their light, colored design ---------- */
html.heb-dark .note-body .hx-wrap{background:#ffffff;border-radius:6px;padding:14px 14px 10px;color-scheme:light}
html.heb-dark .note-body .hx-wrap :is(p,li,td,th,span,div,b,strong,em,i,small,sup,ol,ul){color:var(--hx-ink)!important}
html.heb-dark .note-body .hx-wrap :is(.tr,.lbl,.kv,.full,.hx-foot,.grp,.dfn,.rule,.mut-key span,.mut .lg span,.hx-cap .s,.n0){color:var(--hx-soft)!important}
html.heb-dark .note-body .hx-wrap .hx-cap .t{color:var(--hx-head)!important}
html.heb-dark .note-body .hx-wrap table.hx thead th,html.heb-dark .note-body .hx-wrap table.hx thead th *{color:#ffffff!important}
html.heb-dark .note-body .hx-wrap td.ent .nm{color:var(--c)!important}
html.heb-dark .note-body .hx-wrap .stn b{color:var(--sc)!important}
html.heb-dark .note-body .hx-wrap .tier{color:var(--tc)!important}
html.heb-dark .note-body .hx-wrap :is(.y,.new){color:var(--hi)!important}
html.heb-dark .note-body .hx-wrap a{color:#be123c!important}

/* v1.1: uniform vertical lines. Risk color lives in the chip and cell tint, not an extra strip;
   header separators match the body lines so every column line runs straight top to bottom. */
.note-content .note-body .hx-wrap table.hx > tbody > tr > td.rk{box-shadow:none}
.note-content .note-body .hx-wrap table.hx > thead > tr > th + th{border-left:4px solid var(--hx-head)}

/* v1.2: every body cell except the first column gets the thick column line, so lines stay
   complete in rows under a rowspan group cell (e.g. lab tables grouped by compartment). */
.note-content .note-body .hx-wrap table.hx > tbody > tr > td:not(.ent):not(.grp):not(.band):not(.k):not(.sub){border-left:4px solid var(--hx-head)!important}
@container hx (max-width: 760px){
  .note-content .note-body .hx-wrap table.hx:not(.matrix) > tbody > tr > td:not(.ent):not(.grp):not(.band){border-left:0!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix) > tbody > tr > td.rk{border-left:4px solid var(--tc)!important}
}


/* v1.3: key column, sub-group band rows, narrow tables, tier-tinted columns */
.note-body table.hx td.k{background:var(--hx-band);font-weight:650;white-space:nowrap}
.note-body .hx-wrap.narrow{max-width:none}
/* v2.0: the size limit sits on the children, so the container query sees the full note column (narrow tables stay tables on desktop) */
.note-content .note-body .hx-wrap.narrow > *,.note-content .note-body .hx-wrap.narrow > table.hx{max-width:720px}
.note-content .note-body .hx-wrap table.hx td.sub{background:var(--hx-band);font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--hx-soft);border-top:4px solid var(--hx-head);padding:6px 11px;text-align:left}
.note-body table.hx td.clo{background:#f3f9f5} .note-body table.hx td.cint{background:#fffaf0} .note-body table.hx td.chi{background:#fdf5f5}
.note-body table.hx thead th .tier{margin:0 6px 0 0;vertical-align:1px}
.note-body table.hx td.num{white-space:nowrap}
.note-body table.hx.matrix td.hr{font-weight:700;white-space:nowrap}
.note-body table.hx.matrix.trials tbody th{text-transform:none;letter-spacing:0;font-size:12.75px;color:var(--hx-ink)}
.note-body table.hx.matrix.trials tbody th .n{font-weight:400;color:var(--hx-soft)}

/* v1.4: no lonely last words, fewer squeezed lines */
.note-body .hx-wrap :is(td,th,li,p,.pearl,.def,.rule,.kv,.hx-foot){text-wrap:pretty}
.note-body .hx-wrap :is(thead th,.hx-cap .t,.tier,.full,.lbl){text-wrap:balance}
.note-body .hx-wrap :is(.dr,.tier,.num,.val,.hr,.new){white-space:nowrap}
.note-body .hx-wrap .nw{white-space:nowrap!important}
.note-content .note-body .hx-wrap table.hx :is(th,td){padding-left:10px;padding-right:10px}

/* v1.5: every other note table (not yet rebuilt) gets the same look:
   sans 13.25px, navy header, thick navy outline and column lines, shaded first column.
   !important overrides the old inline styles stored in the Sheet. */
.note-content .note-body table:not(.hx):not(.sc){font-family:var(--sans)!important;font-size:13.25px!important;line-height:1.48!important;
  border:4px solid #0d1f4d!important;border-collapse:collapse!important;width:100%!important;margin:14px 0 20px!important;border-radius:0!important;
  background:#fff;color-scheme:light;font-variant-numeric:tabular-nums lining-nums}
.note-content .note-body table:not(.hx):not(.sc) :is(td,th){border:0!important;border-left:4px solid #0d1f4d!important;border-bottom:1px solid #dfe4ec!important;
  padding:9px 10px!important;vertical-align:top!important;text-align:left!important;font-family:var(--sans)!important;font-size:13.25px!important;
  color:#1f2633!important;background:#fff!important;text-wrap:pretty}
.note-content .note-body table:not(.hx):not(.sc) :is(td,th) *{font-family:inherit!important;font-size:inherit!important;color:inherit!important}
.note-content .note-body table:not(.hx):not(.sc) :is(thead th,thead td,tbody tr:first-child > th){background:#0d1f4d!important;color:#fff!important;
  font-size:11px!important;font-weight:700!important;letter-spacing:.07em;text-transform:uppercase;padding:8px 10px!important;vertical-align:bottom!important;
  border-bottom:0!important;text-wrap:balance}
.note-content .note-body table:not(.hx):not(.sc) :is(thead th,thead td) *{color:#fff!important}
.note-content .note-body table:not(.hx):not(.sc) tbody tr > :first-child{background:#f5f7fb!important;font-weight:650}
.note-content .note-body table:not(.hx):not(.sc) tbody tr:first-child > th:first-child{background:#0d1f4d!important}
.note-content .note-body table:not(.hx):not(.sc) tr > :first-child{border-left:0!important}
.note-content .note-body table:not(.hx):not(.sc) :is(td,th) :is(p,ul,ol){margin:0 0 4px}
.note-content .note-body table:not(.hx):not(.sc) :is(td,th) ul{padding-left:16px}

/* v1.6: Pearl / Caution boxes: yellow background only, no side line */
.note-content .note-body .hx-wrap .pearl{border-left:0!important;border-radius:4px;padding:5px 9px;background:#fff5d1}

/* v1.7: phone layout.
   Tables with up to 3 columns stay real tables on phones.
   Wider tables become compact cards: one card per group, row header with chip, light labels, no inner boxes. */
@container hx (max-width: 760px){
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))){display:table!important;table-layout:auto}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > thead{display:table-header-group!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody{display:table-row-group!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody > tr{display:table-row!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody > tr > td{display:table-cell!important;padding:7px 9px!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody > tr > td[data-l]::before{display:none!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody > tr > td:not(.ent):not(.grp):not(.band):not(.k):not(.sub):not(:first-child),
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody > tr > td.cl{border-left:3px solid var(--hx-head)!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) thead th{padding:7px 9px!important}

  .note-content .note-body .hx-wrap table.hx{border-width:3px}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) > tbody > tr{border-top:1px solid var(--hx-rule)}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) > tbody > tr.g1{border-top:3px solid var(--hx-head)}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) > tbody > tr:first-child{border-top:0}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) > tbody > tr > td{border:0!important;margin:0!important;padding:2px 12px 8px!important;box-shadow:none}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) > tbody > tr > td[data-l]::before{font-size:9.5px;margin:0;letter-spacing:.08em}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) > tbody > tr > td:first-child{padding-top:9px!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) td.ent{padding:10px 12px!important;border-bottom:1px solid var(--hx-rule)!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) td.ent .nm{display:inline;font-size:17px;margin-right:8px}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) td.ent .full{display:inline;margin:0}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) td.ent .kv{display:block;margin:3px 0 0}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) td.ent .mut{max-width:260px}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) td.rk{padding:8px 12px!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) td.rk[data-l]::before{display:none}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) td.rk .tier{margin:0 8px 0 0}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) td.rk .def{display:inline}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) td.grp{padding:7px 12px!important;border-bottom:1px solid var(--hx-rule)!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) td.k{padding:9px 12px 4px!important;white-space:normal}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) td.band{padding:9px 12px!important;border-top:3px solid var(--hx-head)!important}
  .note-content .note-body .hx-wrap table.hx{box-sizing:border-box;max-width:100%}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)){width:100%!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) > tbody > tr > td:has(> .lbl:first-child)::before{display:none}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) > tbody > tr > td:not(.ent):not(.grp):not(.band):not(.k):not(.sub),
  .note-content .note-body .hx-wrap table.hx:not(.matrix):has(> thead > tr > th:nth-child(3)) > tbody > tr > td.cl.cl{border-left:0!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix) :is(td.k,thead th){white-space:normal!important}
}


/* v1.8: never cut a table. Cell-level "keep on one line" hints yield when space runs out;
   on phones everything may wrap (chips excepted). */
.note-content .note-body .hx-wrap table.hx:not(.matrix) td.nw,.note-content .note-body .hx-wrap table.hx:not(.matrix) th.nw{white-space:normal!important;text-wrap:balance}
.note-body table.hx td.k{white-space:normal;text-wrap:balance}
@container hx (max-width: 760px){
  .note-content .note-body .hx-wrap :is(td,th,span,b,strong,div,li,p){white-space:normal!important}
  .note-content .note-body .hx-wrap .tier{white-space:nowrap!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix) :is(td,th){overflow-wrap:break-word}
}
/* v1.8b: headers, values and drug names may wrap when the column needs it (tables must never overflow) */
.note-content .note-body .hx-wrap table.hx thead th{white-space:normal!important;text-wrap:balance}
.note-content .note-body .hx-wrap table.hx :is(td.val,.dr){white-space:normal!important}
@container hx (max-width: 760px){
  .note-content .note-body .hx-wrap .tier{white-space:normal!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix) :is(td,th){overflow-wrap:anywhere}
}
.note-content .note-body .hx-wrap table.hx:has(> thead > tr > th:nth-child(5)) > thead > tr > th{width:auto!important}

/* v1.9: wide tables scroll instead of squeezing; phones show every non-scrolling table as cards */
.note-content .note-body .hx-wrap table.hx.matrix :is(td,th){min-width:140px}
.note-content .note-body .hx-wrap table.hx.matrix > tbody > tr > th{min-width:130px}
@container hx (max-width: 760px){
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))){display:block!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > thead{display:none!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody,
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody > tr{display:block!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody > tr{border-top:1px solid var(--hx-rule)}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody > tr.g1{border-top:3px solid var(--hx-head)}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody > tr:first-child{border-top:0}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody > tr > td{display:block!important;border:0!important;padding:8px 12px!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody > tr > td + td{padding-top:0!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody > tr > td.k{background:none;padding-bottom:2px!important}
  .note-content .note-body .hx-wrap table.hx:not(.matrix):not(:has(> thead > tr > th:nth-child(3))) > tbody > tr > td.rk{padding-bottom:6px!important}
}
.note-content .note-body .hx-wrap table.hx.matrix :is(thead th,td,tbody th).nw{white-space:nowrap!important}
.note-content .note-body .hx-wrap table.hx.matrix thead th{text-wrap:balance}