/* clinical-reference/reference.css
   The clinical reference browser, design "C1 Warm Rail" (picked by Ryan 2026-09-28). Every
   rule is scoped under .cr-root so it cannot touch the portal's own styles, and every class
   carries the cr- prefix because the portal has bare rules on short names (.chip, .rail, .btn,
   .notes, and even plain nav, a, h2, input and table) that would otherwise reach in.

   The layout follows the width the portal gives the module, which reference.js writes to
   data-cr-size on the root: "sm" one column, "md" two panes, "lg" two panes plus the pinned
   Quick answer card on an entry page. The portal's sticky top bar height is --hdrH (set by the
   portal) and its phone tab bar height is --cr-tabs (set by reference.js).

   Light colors are the brand palette (Psych #E8451F, Rounds #602D36, Clinical #FAF8EE,
   Mentality #E1E782); dark follows the portal v2 dark theme. Text shades are contrast-checked
   against the surface they sit on.

   Hand-written. The data/ folder next to this file is generated and wiped by
   Sigmund Data/rewrite/build_reference_bundle.py; nothing hand-written belongs in there. */

.cr-root {
  --cr-page: #FFFFFF;
  --cr-surface: #FFFFFF;
  --cr-cream: #FAF8EE;         /* page map, list pane, dose boxes */
  --cr-hover: #F7F4EA;
  --cr-cream-hover: #F1ECDD;
  --cr-line: #E3DCC8;
  --cr-line-2: #EEE8D8;
  --cr-text: #2B2B2B;
  --cr-strong: #602D36;        /* headings and names */
  --cr-muted: #6B6155;         /* 5.9:1 on white, 5.5:1 on cream */
  --cr-faint: #B9AF9B;         /* decoration only */
  --cr-link: #B8350F;          /* 5.9:1 on white */
  --cr-link-line: rgba(184, 53, 15, .35);
  --cr-accent: #E8451F;
  --cr-action: #C93C18;        /* white text 5.1:1 */
  --cr-action-h: #A9310F;
  --cr-sel: #EEF1BA;           /* picked row, active section */
  --cr-lime: #E1E782;
  --cr-on-lime: #2A1418;
  --cr-pressed-edge: #602D36;
  --cr-track: #ECE5D1;
  --cr-chip-bg: #F3EFE3;
  --cr-chip-line: #D6CCB3;
  --cr-field: #FFFFFF;
  --cr-field-line: #CFC5AC;
  --cr-warn: #B42B12;
  --cr-warn-solid: #B42B12;
  --cr-warn-deep: #7A2410;
  --cr-warn-bg: #FDF0EB;
  --cr-warn-line: #F1CDBF;
  --cr-warn-row: #FFF8F5;
  --cr-calm-bg: #F2F2FF;
  --cr-calm-line: #CDCCFF;
  --cr-calm-text: #3F3A8F;
  --cr-blush-bg: #FFCEEC;
  --cr-blush-text: #602D36;
  --cr-tag-bg: #602D36;
  --cr-tag-text: #FAF8EE;
  --cr-card-shadow: 0 14px 30px -24px rgba(96, 45, 54, .55);
  --cr-sticky: var(--hdrH, 0px);
  --cr-tool-bg: #FBE3F7;       /* calculator tile (soft magenta) */
  --cr-tool-ink: #8E2A7E;      /* 6.3:1 on the tile */
  color-scheme: light;

  font-family: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--cr-text);
  font-size: 16px;
  line-height: 1.6;
}

.cr-root[data-theme="dark"] {
  --cr-page: #231215;
  --cr-surface: #2B161A;
  --cr-cream: #1B0D10;
  --cr-hover: #33191E;
  --cr-cream-hover: #2B161A;
  --cr-line: rgba(250, 248, 238, .14);
  --cr-line-2: rgba(250, 248, 238, .08);
  --cr-text: #F2ECE4;
  --cr-strong: #FAF8EE;
  --cr-muted: #CDBFC1;
  --cr-faint: rgba(250, 248, 238, .3);
  --cr-link: #FF9373;
  --cr-link-line: rgba(255, 147, 115, .4);
  --cr-accent: #FF7A52;
  --cr-action: #C93C18;
  --cr-action-h: #E8451F;
  --cr-sel: rgba(225, 231, 130, .14);
  --cr-lime: #E1E782;
  --cr-on-lime: #231215;
  --cr-pressed-edge: #E1E782;
  --cr-track: rgba(250, 248, 238, .14);
  --cr-chip-bg: rgba(250, 248, 238, .08);
  --cr-chip-line: rgba(250, 248, 238, .24);
  --cr-field: #1B0D10;
  --cr-field-line: rgba(250, 248, 238, .28);
  --cr-warn: #FFB49E;
  --cr-warn-solid: #D0401C;
  --cr-warn-deep: #FFCDBE;
  --cr-warn-bg: rgba(232, 69, 31, .14);
  --cr-warn-line: rgba(232, 69, 31, .45);
  --cr-warn-row: rgba(232, 69, 31, .08);
  --cr-calm-bg: rgba(205, 204, 255, .11);
  --cr-calm-line: #8F8CE0;
  --cr-calm-text: #DCDBFF;
  --cr-blush-bg: rgba(255, 206, 236, .16);
  --cr-blush-text: #FFD9F0;
  --cr-tag-bg: #E1E782;
  --cr-tag-text: #231215;
  --cr-card-shadow: 0 14px 30px -20px rgba(0, 0, 0, .6);
  --cr-tool-bg: #311534;
  --cr-tool-ink: #F2A4E6;
  color-scheme: dark;
}

/* ---- resets against the portal's bare element rules ------------------------ */
/* :where() keeps these at plain-element strength, so any class rule below still wins. The
   file loads after the portal's own styles, which settles the tie with its bare rules. */
.cr-root *, .cr-root *::before, .cr-root *::after { box-sizing: border-box; }
:where(.cr-root) :is(input, textarea, select, button) { margin: 0; font: inherit; color: inherit; }
:where(.cr-root) :is(p, ul, ol, h1, h2, h3, h4, dl, dd, figure) { margin: 0; }
:where(.cr-root) nav { max-width: none; margin: 0; padding: 0; display: block; gap: 0; overflow: visible; }
:where(.cr-root) a { color: var(--cr-link); text-decoration: underline; text-underline-offset: 3px; }
:where(.cr-root) button { cursor: pointer; }
.cr-root :focus-visible { outline: 3px solid var(--cr-accent); outline-offset: 2px; border-radius: 6px; }
.cr-root [hidden] { display: none !important; }
.cr-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: -1px; padding: 0; border: 0; }
.cr-root .cr-mark { background: var(--cr-lime); color: var(--cr-on-lime); border-radius: 3px; padding: 0 1px; }
.cr-root .cr-ic { flex: none; }

.cr-wrap { padding: 4px 0 40px; }

/* counts: "96", "12 items" */
.cr-root .cr-n {
  display: inline-block; font-size: 12px; font-weight: 600; line-height: 1.5; padding: 1px 9px;
  border-radius: 999px; background: var(--cr-chip-bg); color: var(--cr-strong);
  letter-spacing: 0; text-transform: none; white-space: nowrap;
}
.cr-root .cr-n-lg { font-size: 13px; padding: 2px 10px; }

.cr-root .cr-code {
  display: inline-block; font-variant-numeric: tabular-nums; font-weight: 600; font-size: .86em; line-height: 1.5;
  padding: 0 7px; border-radius: 6px; background: var(--cr-chip-bg); color: var(--cr-strong);
  border: 1px solid var(--cr-line); white-space: nowrap;
}

/* ---- the banner (always shown) ---------------------------------------------- */
.cr-draft {
  display: flex; align-items: flex-start; gap: 10px; margin: 4px 0 16px; padding: 10px 14px;
  background: var(--cr-cream); border: 1px solid var(--cr-line); border-radius: 10px;
  font-size: 13px; line-height: 1.55; max-width: 84ch; color: var(--cr-text);
}
.cr-draft-tag {
  flex: none; font-size: 10.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
  background: var(--cr-tag-bg); color: var(--cr-tag-text); padding: 2px 8px; border-radius: 5px; margin-top: 1px;
}
.cr-draft-text { flex: 1; min-width: 0; }
/* The standing disclaimer is permanent, not an alarm, so it sits quieter than the draft
   banner it replaced while staying legible. */
.cr-disclaimer .cr-draft-tag { background: var(--cr-chip-bg); color: var(--cr-strong); border: 1px solid var(--cr-line); }
.cr-disclaimer { color: var(--cr-muted); }

/* ---- buttons ------------------------------------------------------------------ */
.cr-root .cr-btn {
  display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 22px; border-radius: 999px;
  border: 0; background: var(--cr-action); color: #fff; font-weight: 600; font-size: 15px;
}
.cr-root .cr-btn:hover { background: var(--cr-action-h); }
.cr-root .cr-ghost {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 999px;
  border: 1.5px solid currentColor; background: transparent; color: var(--cr-strong); font-weight: 600; font-size: 14px;
}
.cr-root .cr-chev { color: var(--cr-muted); transition: transform .18s ease; }
/* Handouts: "Download PDF" beside "Open full page", and on the handout's own page (2026-09-30) */
.cr-root .cr-pv-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.cr-root .cr-pdf { gap: 8px; min-height: 48px; }
.cr-root .cr-pdf:disabled { opacity: .75; cursor: progress; }
.cr-root .cr-page-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.cr-root[data-cr-size="sm"] .cr-row-pv .cr-pv-actions > * { width: 100%; justify-content: center; }

/* ---- search -------------------------------------------------------------------- */
.cr-searchwrap { position: relative; }
.cr-root .cr-search {
  width: 100%; min-height: 50px; border: 1.5px solid var(--cr-field-line); border-radius: 12px;
  padding: 12px 46px; font-size: 16px; /* 16px stops iOS zooming on focus */
  background: var(--cr-field); color: var(--cr-text); -webkit-appearance: none; appearance: none;
}
.cr-root .cr-search::placeholder { color: var(--cr-muted); opacity: 1; }
.cr-root .cr-search::-webkit-search-cancel-button { display: none; }
.cr-root .cr-search:focus { outline: none; border-color: var(--cr-accent); box-shadow: 0 0 0 3px rgba(232, 69, 31, .28); }
.cr-search-ic { position: absolute; left: 15px; top: 50%; transform: translateY(-50%); color: var(--cr-muted); pointer-events: none; }
.cr-root .cr-search-x {
  position: absolute; right: 5px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px;
  border: 0; border-radius: 8px; background: none; color: var(--cr-muted); display: grid; place-items: center;
}
.cr-root .cr-search-x:hover { background: var(--cr-hover); }

/* ---- filter chips and A to Z ----------------------------------------------------- */
.cr-chips {
  display: flex; gap: 8px; overflow-x: auto; padding: 10px 0 4px; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.cr-chips::-webkit-scrollbar { display: none; }
.cr-root .cr-chip {
  flex: none; display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 0 15px;
  border-radius: 999px; border: 1px solid var(--cr-chip-line); background: transparent; color: var(--cr-strong);
  font-size: 14px; font-weight: 500; white-space: nowrap;
}
.cr-root .cr-chip:hover { border-color: var(--cr-strong); }
.cr-chip-n { font-size: 12px; opacity: .8; }
.cr-root .cr-chip[aria-pressed="true"] { background: var(--cr-lime); border-color: var(--cr-lime); color: var(--cr-on-lime); font-weight: 600; }
.cr-root .cr-chip-review { border-color: var(--cr-warn-line); color: var(--cr-warn); background: var(--cr-warn-bg); font-weight: 600; }
.cr-root .cr-chip-review[aria-pressed="true"] { background: var(--cr-warn-solid); border-color: var(--cr-warn-solid); color: #fff; }

.cr-root .cr-az { display: flex; gap: 2px; overflow-x: auto; padding: 4px 0 2px; scrollbar-width: none; }
.cr-root .cr-az::-webkit-scrollbar { display: none; }
.cr-root .cr-az-b {
  flex: none; width: 44px; height: 44px; border: 0; border-radius: 8px; background: transparent;
  color: var(--cr-strong); font-weight: 600; font-size: 14px;
}
.cr-root .cr-az-b:hover:not(:disabled) { background: var(--cr-cream-hover); }
.cr-root .cr-az-b:disabled { color: var(--cr-faint); cursor: default; }

/* ---- master-detail (home and lists) ----------------------------------------------- */
.cr-md { display: block; }
.cr-master { min-width: 0; }
.cr-m-head { padding: 6px 0 4px; }
.cr-kick { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--cr-link); font-weight: 700; }
.cr-m-h1 { margin-top: 2px; font-size: 26px; line-height: 1.2; font-weight: 700; color: var(--cr-strong); display: flex; align-items: center; gap: 10px; letter-spacing: -.01em; }
.cr-root .cr-m-back {
  display: inline-flex; align-items: center; gap: 4px; min-height: 44px; margin-left: -6px; padding: 0 6px;
  border: 0; background: none; color: var(--cr-strong); font-size: 14px; font-weight: 500; border-radius: 8px;
}
.cr-root .cr-m-back:hover { background: var(--cr-hover); }
.cr-m-tools { padding: 6px 0 4px; }
.cr-m-label { margin: 18px 0 4px; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--cr-muted); }
.cr-m-status { margin: 6px 0 4px; font-size: 13px; color: var(--cr-muted); }
.cr-m-status:empty { display: none; }
.cr-m-empty { padding: 22px 0; }
.cr-m-empty p { margin: 0 0 12px; }

.cr-rows { list-style: none; margin: 0; padding: 0; }
.cr-root .cr-row {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 60px; padding: 10px 4px;
  border: 0; border-top: 1px solid var(--cr-line); background: transparent; color: var(--cr-text);
  text-align: left; position: relative;
}
.cr-root .cr-row:hover { background: var(--cr-hover); }
.cr-row-main { min-width: 0; flex: 1; }
.cr-row-kind { display: block; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; font-weight: 700; color: var(--cr-muted); }
.cr-row-name { display: block; font-weight: 600; font-size: 15px; line-height: 1.35; color: var(--cr-strong); }
.cr-row-sub { display: block; font-size: 13px; line-height: 1.4; color: var(--cr-muted); margin-top: 2px; overflow-wrap: anywhere; }
.cr-rowli.is-sel > .cr-row { background: var(--cr-sel); }
.cr-rowli.is-sel > .cr-row::before {
  content: ""; position: absolute; left: 0; top: 7px; bottom: 7px; width: 4px; border-radius: 0 4px 4px 0; background: var(--cr-accent);
}
.cr-rowli.is-sel > .cr-row .cr-chev { color: var(--cr-accent); }
.cr-row-pv { padding: 6px 12px 20px 14px; background: var(--cr-cream); border-top: 1px solid var(--cr-line); }
.cr-grp-h {
  margin: 0; padding: 14px 4px 4px; font-size: 13px; font-weight: 700; letter-spacing: .08em; color: var(--cr-link);
}

.cr-secs { list-style: none; margin: 0; padding: 0 0 8px; }
.cr-root .cr-sec-row {
  display: grid; grid-template-columns: 1fr auto auto; align-items: center; column-gap: 12px; width: 100%;
  min-height: 72px; padding: 14px 4px; border: 0; border-top: 1px solid var(--cr-line); background: none;
  color: var(--cr-text); text-align: left;
}
.cr-root .cr-sec-row:hover { background: var(--cr-hover); }
.cr-sec-name { font-weight: 600; font-size: 16px; color: var(--cr-strong); }
.cr-sec-blurb { grid-column: 1 / -1; font-size: 13.5px; line-height: 1.45; color: var(--cr-muted); margin-top: 3px; max-width: 46ch; }

.cr-detail { min-width: 0; }

/* the preview */
.cr-pv-kick { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--cr-muted); }
.cr-pv-title { margin: 4px 0 14px; font-size: 28px; line-height: 1.15; color: var(--cr-strong); font-weight: 700; letter-spacing: -.01em; text-wrap: balance; }
.cr-pv-sum { font-size: 16px; line-height: 1.65; max-width: 62ch; margin: 0 0 18px; }
.cr-row-pv .cr-pv-sum { font-size: 15px; margin: 6px 0 14px; }
.cr-pv-k { font-size: 11px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--cr-muted); margin-bottom: 4px; }
.cr-pv-uses { margin: 0 0 16px; max-width: 62ch; }
.cr-pv-more { font-size: 13px; color: var(--cr-muted); margin-top: 4px; }
.cr-pv-facts {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 0 20px; max-width: 62ch;
  border: 1px solid var(--cr-line); border-radius: 12px; overflow: hidden; background: var(--cr-surface);
}
/* Each cell draws its own right and bottom rule, so a short last row reads as an empty cell. */
.cr-pv-facts > div { padding: 12px 14px; min-width: 0; box-shadow: 1px 0 0 var(--cr-line), 0 1px 0 var(--cr-line); }
.cr-pv-facts .cr-wide { grid-column: 1 / -1; }
.cr-pv-facts .cr-wide2 { grid-column: span 2; }
.cr-pv-facts dt { font-size: 11px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--cr-muted); }
.cr-pv-facts dd { margin: 5px 0 0; font-weight: 500; font-size: 14.5px; line-height: 1.45; overflow-wrap: anywhere; }
.cr-codes { display: flex; flex-wrap: wrap; gap: 6px; }
.cr-warntext { display: inline-flex; align-items: center; gap: 6px; color: var(--cr-warn); font-weight: 700; }
.cr-pv-empty { color: var(--cr-muted); margin: 40px 0; }
.cr-pv-morewrap { margin-top: 36px; max-width: 62ch; }
.cr-pv-more-h { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--cr-muted); }
.cr-pv-morelist { list-style: none; margin: 8px 0 0; padding: 0; border-top: 1px solid var(--cr-line); }
.cr-root .cr-pv-more-b {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 46px; padding: 8px 4px; border: 0;
  border-bottom: 1px solid var(--cr-line-2); background: none; text-align: left; font-size: 15px; font-weight: 500; color: var(--cr-strong);
}
.cr-root .cr-pv-more-b:hover { background: var(--cr-hover); }
.cr-pv-more-b > span:first-child { flex: 1; min-width: 0; }

/* home: "Start here" */
.cr-start-h { font-size: 22px; line-height: 1.25; font-weight: 700; color: var(--cr-strong); }
.cr-start-sub { font-size: 14px; color: var(--cr-muted); margin-top: 2px; }
.cr-d-label {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 12px;
  margin: 26px 0 12px; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--cr-muted);
}
.cr-d-n { font-size: 12.5px; letter-spacing: 0; text-transform: none; font-weight: 500; }
.cr-recent { display: grid; grid-template-columns: 1fr; gap: 12px; }
.cr-root .cr-recent-card {
  display: flex; flex-direction: column; gap: 3px; width: 100%; padding: 16px 44px 16px 18px; border: 1px solid var(--cr-line);
  border-radius: 14px; background: var(--cr-surface); color: var(--cr-text); text-align: left; position: relative;
  transition: border-color .15s, box-shadow .15s;
}
.cr-root .cr-recent-card:hover { border-color: var(--cr-strong); box-shadow: var(--cr-card-shadow); }
.cr-rc-kick { font-size: 11.5px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--cr-muted); }
.cr-rc-title { font-size: 17px; font-weight: 700; color: var(--cr-strong); line-height: 1.25; }
.cr-rc-meta { font-size: 13px; color: var(--cr-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cr-rc-go { position: absolute; right: 16px; top: 18px; color: var(--cr-link); }
.cr-bchips { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.cr-root .cr-bchip {
  display: inline-flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: 0 8px 0 15px;
  border: 1px solid var(--cr-chip-line); border-radius: 999px; background: var(--cr-surface); color: var(--cr-strong);
  font-size: 14px; font-weight: 500; white-space: nowrap;
}
.cr-root .cr-bchip:hover { border-color: var(--cr-strong); background: var(--cr-cream); }
.cr-mg { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--cr-line); }
.cr-root .cr-mg-b {
  display: flex; align-items: center; gap: 10px; width: 100%; min-height: 46px; padding: 8px 4px 8px 2px; border: 0;
  border-bottom: 1px solid var(--cr-line-2); background: none; color: var(--cr-strong); text-align: left;
  font-size: 14.5px; font-weight: 500; line-height: 1.3;
}
.cr-root .cr-mg-b:hover { background: var(--cr-hover); }
.cr-mg-b > span:first-child { flex: 1; min-width: 0; }
.cr-root .cr-mg-toggle { margin-top: 12px; }

/* phone: one column */
.cr-root[data-cr-size="sm"] .cr-m-tools {
  position: sticky; top: var(--cr-sticky); z-index: 5; background: var(--cr-page); padding: 8px 0 4px;
}
.cr-root[data-cr-size="sm"] .cr-rowli.is-sel > .cr-row .cr-chev { transform: rotate(90deg); }
.cr-root[data-cr-size="sm"] .cr-md-list .cr-detail,
.cr-root[data-cr-size="sm"] .cr-md-home.is-searching .cr-detail { display: none; }
.cr-root[data-cr-size="sm"] .cr-md-home .cr-detail { border-top: 8px solid var(--cr-cream); margin: 10px -16px 0; padding: 20px 16px 0; }
.cr-root[data-cr-size="sm"] .cr-row-pv .cr-btn { width: 100%; justify-content: center; }
.cr-root[data-cr-size="sm"] .cr-mg:not(.is-open) li:nth-child(n+9) { display: none; }
.cr-root[data-cr-size="sm"] .cr-bchips {
  display: grid; grid-auto-flow: column; grid-template-rows: repeat(2, auto); justify-content: start; overflow-x: auto;
  margin: 0 -16px; padding: 2px 16px 6px; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.cr-root[data-cr-size="sm"] .cr-bchips::-webkit-scrollbar { display: none; }
.cr-root[data-cr-size="sm"] .cr-bchip { width: 100%; }

/* wider: the list pane becomes a cream panel, the preview sits beside it */
.cr-root:not([data-cr-size="sm"]) .cr-md {
  display: grid; grid-template-columns: minmax(300px, 360px) minmax(0, 1fr); gap: 32px;
}
.cr-root[data-cr-size="lg"] .cr-md { grid-template-columns: minmax(330px, 390px) minmax(0, 1fr); gap: 40px; }
.cr-root:not([data-cr-size="sm"]) .cr-master {
  background: var(--cr-cream); border: 1px solid var(--cr-line); border-radius: 16px; padding-bottom: 10px; align-self: start;
}
.cr-root:not([data-cr-size="sm"]) .cr-m-head { padding: 18px 20px 4px; }
.cr-root:not([data-cr-size="sm"]) .cr-m-tools {
  position: sticky; top: var(--cr-sticky); z-index: 5; background: var(--cr-cream); padding: 6px 20px 6px;
  border-bottom: 1px solid var(--cr-line); border-radius: 16px 16px 0 0;
}
.cr-root:not([data-cr-size="sm"]) .cr-m-tools .cr-search { border-color: var(--cr-chip-line); }
.cr-root:not([data-cr-size="sm"]) .cr-chips { -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
.cr-root:not([data-cr-size="sm"]) .cr-az { display: grid; grid-template-columns: repeat(13, minmax(0, 1fr)); }
.cr-root:not([data-cr-size="sm"]) .cr-az-b { width: auto; height: 30px; font-size: 13px; }
.cr-root:not([data-cr-size="sm"]) .cr-m-label { margin: 18px 20px 4px; }
.cr-root:not([data-cr-size="sm"]) .cr-m-status { margin: 6px 0 2px; }
.cr-root:not([data-cr-size="sm"]) .cr-m-body > .cr-m-status { margin: 10px 20px 4px; }
.cr-root:not([data-cr-size="sm"]) .cr-m-empty { padding: 22px 20px; }
.cr-root:not([data-cr-size="sm"]) .cr-row { padding: 10px 20px; min-height: 62px; }
.cr-root:not([data-cr-size="sm"]) .cr-row:hover { background: var(--cr-cream-hover); }
.cr-root:not([data-cr-size="sm"]) .cr-rowli.is-sel > .cr-row { background: var(--cr-sel); }
.cr-root:not([data-cr-size="sm"]) .cr-grp-h { padding: 14px 20px 4px; }
.cr-root:not([data-cr-size="sm"]) .cr-sec-row { padding: 16px 20px; min-height: 80px; }
.cr-root:not([data-cr-size="sm"]) .cr-sec-row:hover { background: var(--cr-cream-hover); }
.cr-root:not([data-cr-size="sm"]) .cr-row-pv { display: none; }
.cr-root:not([data-cr-size="sm"]) .cr-detail { padding: 10px 0 24px; }
.cr-root:not([data-cr-size="sm"]) .cr-detail-inner {
  position: sticky; top: calc(var(--cr-sticky) + 16px); max-height: calc(100vh - var(--cr-sticky) - 32px);
  overflow-y: auto; scrollbar-width: thin; padding-right: 4px;
}
.cr-root:not([data-cr-size="sm"]) .cr-md-home:not(.is-searching) .cr-detail-inner { position: static; max-height: none; overflow: visible; }
.cr-root:not([data-cr-size="sm"]) .cr-recent { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.cr-root:not([data-cr-size="sm"]) .cr-mg { columns: 2 220px; column-gap: 32px; }
.cr-root:not([data-cr-size="sm"]) .cr-mg li { break-inside: avoid; }
.cr-root:not([data-cr-size="sm"]) .cr-mg-toggle { display: none; }
.cr-root:not([data-cr-size="sm"]) .cr-progress { margin: 10px 20px 4px; }

/* ---- an entry page ---------------------------------------------------------------- */
.cr-doc { display: block; }
.cr-railcol { display: none; }
.cr-docmain { display: block; min-width: 0; }
.cr-center { min-width: 0; }
.cr-glancecol { display: none; }
.cr-glance-inline { margin: 0 0 22px; }
.cr-glance-inline:empty { display: none; }

/* The side columns stretch to the page's full height so the page map and the card inside
   them have room to stay pinned while the page scrolls. */
.cr-root:not([data-cr-size="sm"]) .cr-doc { display: grid; grid-template-columns: 216px minmax(0, 1fr); gap: 32px; }
.cr-root:not([data-cr-size="sm"]) .cr-railcol { display: block; }
.cr-root:not([data-cr-size="sm"]) .cr-glance-inline .cr-glance { max-width: 560px; }
.cr-root[data-cr-size="lg"] .cr-doc { grid-template-columns: 228px minmax(0, 1fr); }
.cr-root[data-cr-size="lg"] .cr-docmain { display: grid; grid-template-columns: minmax(0, 1fr) 284px; gap: 36px; }
.cr-root[data-cr-size="lg"] .cr-docmain.no-glance { grid-template-columns: minmax(0, 1fr); }
.cr-root[data-cr-size="lg"] .cr-glancecol { display: block; }
.cr-root[data-cr-size="lg"] .cr-glancecol .cr-glance {
  position: sticky; top: calc(var(--cr-sticky) + 12px); max-height: calc(100vh - var(--cr-sticky) - 24px);
  overflow-y: auto; scrollbar-width: thin;
}

/* the page map */
.cr-railstick {
  position: sticky; top: calc(var(--cr-sticky) + 12px); max-height: calc(100vh - var(--cr-sticky) - 24px);
  display: flex; flex-direction: column; background: var(--cr-cream); border: 1px solid var(--cr-line); border-radius: 16px; overflow: hidden;
}
.cr-rail { flex: 1; min-height: 0; overflow-y: auto; padding: 8px 8px 14px; scrollbar-width: thin; color: var(--cr-strong); }
.cr-prog { flex: none; height: 4px; background: var(--cr-track); }
.cr-prog-fill { height: 100%; width: 0; background: var(--cr-accent); border-radius: 0 3px 3px 0; transition: width .12s linear; }
.cr-root .cr-rail-back {
  display: flex; align-items: center; gap: 6px; width: 100%; min-height: 44px; padding: 0 8px; border: 0; background: none;
  color: var(--cr-strong); font-size: 14px; font-weight: 500; border-radius: 10px; text-align: left;
}
.cr-root .cr-rail-back:hover { background: var(--cr-cream-hover); }
.cr-rail-kick { margin: 10px 10px 0; font-size: 11px; letter-spacing: .09em; text-transform: uppercase; color: var(--cr-muted); font-weight: 600; }
.cr-rail-title { margin: 2px 10px 4px; font-size: 17px; font-weight: 700; line-height: 1.25; color: var(--cr-strong); overflow-wrap: anywhere; }
.cr-rail-read { margin: 0 10px 8px; font-size: 12.5px; color: var(--cr-muted); }
.cr-toc-group { margin: 0 0 4px; }
.cr-toc-grp {
  margin: 12px 10px 4px; display: flex; align-items: center; gap: 8px; font-size: 10.5px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--cr-muted); font-weight: 700;
}
.cr-toc-grp::after { content: ""; flex: 1; height: 1px; background: var(--cr-line); }
.cr-toc { list-style: none; margin: 0; padding: 0; }
.cr-root .cr-toc-a {
  display: flex; align-items: center; gap: 8px; width: 100%; min-height: 40px; padding: 7px 10px 7px 12px; border: 0;
  background: none; border-radius: 4px 10px 10px 4px; color: var(--cr-strong); font-size: 14px; font-weight: 500;
  line-height: 1.3; text-align: left;
}
.cr-root .cr-toc-a:hover { background: var(--cr-cream-hover); }
.cr-toc-a .cr-ic { color: var(--cr-warn); }
.cr-toc-t { min-width: 0; }
.cr-toc-a .cr-n { margin-left: auto; }
.cr-root .cr-toc-a.is-active { background: var(--cr-sel); font-weight: 600; box-shadow: inset 4px 0 0 var(--cr-accent); }

/* the document */
.cr-crumbs ol { list-style: none; display: flex; flex-wrap: wrap; align-items: center; margin: 0; padding: 0; font-size: 13.5px; }
.cr-crumbs li { display: flex; align-items: center; min-width: 0; }
.cr-crumbs li + li::before { content: "\203A"; margin: 0 8px; color: var(--cr-muted); }
.cr-root .cr-crumb {
  border: 0; background: none; padding: 0; min-height: 44px; color: var(--cr-link); font-size: 13.5px;
  text-decoration: underline; text-underline-offset: 3px;
}
.cr-crumbs [aria-current] { color: var(--cr-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cr-kick-m { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--cr-muted); }
.cr-h1 { font-size: 34px; line-height: 1.15; margin: 4px 0 4px; color: var(--cr-strong); font-weight: 700; letter-spacing: -.015em; text-wrap: balance; overflow-wrap: anywhere; }
.cr-h1:focus { outline: none; }
.cr-page-sub { font-size: 16px; font-weight: 500; color: var(--cr-text); }
.cr-page-meta { margin-top: 2px; color: var(--cr-muted); font-size: 13px; }
.cr-center .cr-draft { margin: 14px 0 20px; }

.cr-grp-div {
  display: flex; align-items: center; gap: 12px; margin: 34px 0 0; padding: 0 0 12px; font-size: 11px; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; color: var(--cr-link); max-width: 70ch;
}
.cr-grp-div::after { content: ""; flex: 1; height: 2px; background: linear-gradient(90deg, var(--cr-lime), transparent); }
.cr-grp-div + .cr-sec { border-top: 0; padding-top: 2px; }
.cr-grp-div + .cr-boxed { margin-top: 0; }
.cr-grp-div.is-first { margin-top: 6px; }
/* Below the widest layout the Quick answer card sits right above, so the first divider would repeat it. */
.cr-root:not([data-cr-size="lg"]) .cr-grp-div.is-first { display: none; }

.cr-sec { padding: 28px 0 8px; border-top: 1px solid var(--cr-line); scroll-margin-top: calc(var(--cr-sticky) + 12px); }
.cr-sec-h {
  display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 0 0 14px; font-size: 22px; line-height: 1.25;
  color: var(--cr-strong); font-weight: 700; letter-spacing: -.01em;
}
.cr-sec-h:focus { outline: none; }
.cr-sec-h:focus-visible { outline: 3px solid var(--cr-accent); outline-offset: 4px; }
.cr-prose { max-width: 68ch; font-size: 15.5px; line-height: 1.65; }
.cr-lead { font-size: 17px; }
.cr-muted { color: var(--cr-muted); }
.cr-sub-h { margin: 22px 0 8px; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--cr-muted); display: flex; align-items: center; gap: 8px; }
.cr-sec-h + div > .cr-sub-h:first-child, .cr-panel-h + .cr-sub-h { margin-top: 12px; }
.cr-sub-h2 { margin: 30px 0 10px; font-size: 17px; font-weight: 600; color: var(--cr-strong); display: flex; align-items: center; gap: 10px; }

.cr-blist { list-style: none; margin: 0; padding: 0; max-width: 68ch; }
.cr-blist li { position: relative; padding: 8px 0 8px 22px; border-bottom: 1px solid var(--cr-line-2); font-size: 15px; line-height: 1.6; }
.cr-blist li:last-child { border-bottom: 0; }
.cr-blist li::before { content: ""; position: absolute; left: 4px; top: 17px; width: 7px; height: 7px; border-radius: 50%; background: var(--cr-strong); }
.cr-blist-tight li { padding: 4px 0 4px 18px; border-bottom: 0; font-size: 14.5px; }
.cr-blist-tight li::before { top: 13px; left: 2px; width: 6px; height: 6px; }
.cr-cols2 { columns: 2 230px; column-gap: 32px; }
.cr-cols2 li { break-inside: avoid; }
.cr-nlist { counter-reset: crn; list-style: none; margin: 0; padding: 0; max-width: 68ch; }
.cr-nlist li { counter-increment: crn; position: relative; padding: 9px 0 9px 42px; border-bottom: 1px solid var(--cr-line-2); font-size: 15px; line-height: 1.6; }
.cr-nlist li:last-child { border-bottom: 0; }
.cr-nlist li::before {
  content: counter(crn); position: absolute; left: 0; top: 9px; width: 27px; height: 27px; border-radius: 50%;
  border: 1.5px solid var(--cr-strong); color: var(--cr-strong); font-size: 13px; font-weight: 600; line-height: 1; display: grid; place-items: center;
}
.cr-checks { list-style: none; margin: 0; padding: 0; max-width: 68ch; }
.cr-checks li { display: flex; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--cr-line-2); font-size: 15px; line-height: 1.6; }
.cr-checks li:last-child { border-bottom: 0; }
.cr-checks .cr-ic { margin-top: 3px; color: var(--cr-strong); }
.cr-flags {
  list-style: none; margin: 0; padding: 4px 18px; max-width: 68ch; background: var(--cr-warn-bg);
  border: 1px solid var(--cr-warn-line); border-left: 5px solid var(--cr-accent); border-radius: 12px;
}
.cr-flags li { display: flex; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--cr-warn-line); font-weight: 500; font-size: 15px; line-height: 1.55; }
.cr-flags li:last-child { border-bottom: 0; }
.cr-flags .cr-ic { color: var(--cr-warn); margin-top: 3px; }
.cr-ddx { margin: 0; max-width: 68ch; }
.cr-ddx > div { display: grid; grid-template-columns: minmax(0, 200px) minmax(0, 1fr); gap: 4px 22px; padding: 12px 0; border-bottom: 1px solid var(--cr-line-2); font-size: 15px; line-height: 1.6; }
.cr-ddx > div:last-child { border-bottom: 0; }
.cr-ddx dt { font-weight: 600; color: var(--cr-strong); line-height: 1.45; }
.cr-ddx dd { margin: 0; }
.cr-ddx > div > dd:only-child { grid-column: 1 / -1; }

.cr-tblwrap { overflow-x: auto; max-width: 68ch; border: 1px solid var(--cr-line); border-radius: 12px; }
.cr-root table.cr-codes-t { border-collapse: collapse; width: 100%; font-size: 14.5px; }
.cr-root .cr-codes-t th, .cr-root .cr-codes-t td {
  text-align: left; padding: 10px 14px; border: 0; border-bottom: 1px solid var(--cr-line-2); vertical-align: top;
  font-size: inherit; letter-spacing: normal; text-transform: none; color: inherit; font-weight: 400;
}
.cr-root .cr-codes-t th { font-size: 11px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--cr-muted); background: var(--cr-hover); }
.cr-root .cr-codes-t tr:last-child td { border-bottom: 0; }
.cr-icd11 { margin: 18px 0 0; padding: 16px 18px; border: 1px solid var(--cr-line); border-radius: 12px; max-width: 68ch; }
.cr-icd11-top { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 0 0 8px; }
.cr-icd11 .cr-prose { font-size: 15px; }
.cr-credit { font-size: 12.5px; color: var(--cr-muted); margin: 10px 0 0; }
.cr-refs { margin: 0; padding-left: 22px; max-width: 68ch; }
.cr-refs li { padding: 6px 0 6px 4px; font-size: 14.5px; line-height: 1.55; overflow-wrap: anywhere; }
.cr-refs li::marker { color: var(--cr-muted); font-weight: 600; }
.cr-ref-title { font-weight: 500; }
.cr-sources { margin: 0; padding-left: 18px; max-width: 68ch; font-size: 14px; line-height: 1.55; color: var(--cr-text); }
.cr-sources li { margin-bottom: 6px; overflow-wrap: anywhere; }
.cr-note {
  background: var(--cr-calm-bg); border: 1px solid var(--cr-calm-line); border-radius: 10px; padding: 10px 13px;
  font-size: 13.5px; line-height: 1.55; color: var(--cr-calm-text); margin: 12px 0 0; max-width: 68ch;
}
.cr-center > .cr-note { margin: 0 0 20px; }
.cr-root .cr-inlink { border: 0; background: none; padding: 0; color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; display: inline; }
.cr-inlink .cr-ic { display: none; }
.cr-handout { padding: 14px 16px; border: 1px dashed var(--cr-chip-line); border-radius: 12px; max-width: 68ch; background: var(--cr-cream); }
.cr-ev { margin: 0 0 10px; }
.cr-ev .cr-tag { font-size: 12px; padding: 3px 10px; }

/* age groups: pills and the panel they switch */
.cr-pills { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; max-width: 72ch; }
.cr-root .cr-pill {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; border-radius: 999px;
  border: 1.5px solid var(--cr-chip-line); background: var(--cr-surface); color: var(--cr-text); font-size: 14px; font-weight: 500; text-align: left;
}
.cr-root .cr-pill:hover { border-color: var(--cr-strong); }
.cr-pill > span { min-width: 0; overflow-wrap: anywhere; }
.cr-pill-ck { display: none; }
.cr-root .cr-pill[aria-pressed="true"] { background: var(--cr-lime); border-color: var(--cr-pressed-edge); color: var(--cr-on-lime); font-weight: 600; }
.cr-pill[aria-pressed="true"] .cr-pill-ck { display: inline-block; }
.cr-panel { border: 1px solid var(--cr-line); border-radius: 14px; padding: 6px 20px 16px; max-width: 68ch; background: var(--cr-surface); }
.cr-panel-h { margin: 14px 0 0; font-size: 17px; font-weight: 700; color: var(--cr-strong); }
.cr-panel-sub { margin-top: 2px; font-size: 13px; color: var(--cr-muted); }
.cr-medbox { margin: 14px 0 4px; padding: 12px 16px; background: var(--cr-calm-bg); border: 1px solid var(--cr-calm-line); border-radius: 12px; }
.cr-medbox-k { margin: 0 0 3px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--cr-calm-text); }
.cr-medbox-v { font-size: 15px; line-height: 1.55; }
.cr-drugs { list-style: none; margin: 0; padding: 0; }
.cr-drug { padding: 10px 0; border-bottom: 1px solid var(--cr-line-2); }
.cr-drug:last-child { border-bottom: 0; }
.cr-drug-top { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.cr-root .cr-drug-name {
  display: inline-flex; align-items: center; gap: 2px; min-height: 36px; border: 0; background: none; padding: 0;
  font-weight: 600; font-size: 15px; color: var(--cr-link); text-decoration: underline; text-underline-offset: 3px; text-align: left;
}
.cr-root .cr-drug-name.is-plain { color: var(--cr-strong); text-decoration: none; }
.cr-drug-meta { font-size: 13.5px; line-height: 1.55; color: var(--cr-muted); margin-top: 3px; max-width: 64ch; }
.cr-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.cr-tag { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 6px; background: var(--cr-chip-bg); border: 1px solid var(--cr-line); color: var(--cr-muted); }
.cr-tag.is-first { background: var(--cr-lime); color: var(--cr-on-lime); border-color: var(--cr-lime); }
.cr-lchips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.cr-root .cr-lchip {
  display: inline-flex; align-items: center; gap: 4px; min-height: 44px; padding: 0 10px 0 14px; border: 1px solid var(--cr-line);
  border-radius: 10px; background: var(--cr-surface); color: var(--cr-link); font-weight: 500; font-size: 14px; text-align: left;
  text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--cr-link-line);
}
.cr-root .cr-lchip:hover { border-color: var(--cr-accent); text-decoration-color: currentColor; }
.cr-root .cr-lchip.is-plain { color: var(--cr-strong); text-decoration: none; padding: 0 14px; }
.cr-lchip .cr-chev { color: inherit; }
.cr-ntags { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 3px; }
.cr-ntag { display: inline-block; font-size: 11px; font-weight: 600; padding: 1px 9px; border-radius: 999px; background: var(--cr-blush-bg); color: var(--cr-blush-text); }
.cr-dose-main { margin: 14px 0 4px; padding: 14px 16px; background: var(--cr-cream); border-left: 4px solid var(--cr-strong); border-radius: 0 10px 10px 0; }
.cr-dose-k { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--cr-muted); }
.cr-dose-v { margin-top: 2px; font-size: 16.5px; font-weight: 600; color: var(--cr-strong); line-height: 1.45; }

/* boxed warning and interactions */
.cr-boxed {
  margin: 6px 0 10px; padding: 18px 20px; border: 2px solid var(--cr-warn-solid); border-radius: 14px;
  background: var(--cr-warn-bg); max-width: 68ch; scroll-margin-top: calc(var(--cr-sticky) + 12px);
}
.cr-boxed-h {
  display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 14px; letter-spacing: .09em;
  text-transform: uppercase; font-weight: 800; color: var(--cr-warn);
}
.cr-boxed-h:focus { outline: none; }
.cr-boxed-ic { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--cr-warn-solid); color: #fff; }
.cr-boxed p { font-size: 15.5px; line-height: 1.6; }
.cr-boxed p + p { margin-top: 10px; }
.cr-lead-in { font-weight: 600; }
.cr-ix-sum { margin: 0 0 12px; }
.cr-ix-list { list-style: none; margin: 0; padding: 0; max-width: 68ch; }
.cr-ix { padding: 12px 0; border-bottom: 1px solid var(--cr-line-2); scroll-margin-top: calc(var(--cr-sticky) + 90px); transition: background-color .6s, box-shadow .6s; }
.cr-ix:focus { outline: none; }
.cr-ix:focus-visible { outline: 3px solid var(--cr-accent); outline-offset: 2px; }
.cr-ix-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.cr-ix-term { color: var(--cr-strong); font-weight: 600; line-height: 1.45; }
.cr-ix-detail { margin-top: 4px; font-size: 15px; line-height: 1.6; }
.cr-ix.is-contra { padding: 12px 14px; margin: 0 0 8px; border: 1px solid var(--cr-warn-line); border-left: 4px solid var(--cr-warn-solid); border-radius: 10px; background: var(--cr-warn-row); }
.cr-tag-contra {
  flex: none; display: inline-flex; align-items: center; font-size: 11px; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; color: #fff; background: var(--cr-warn-solid); padding: 3px 8px; border-radius: 6px; white-space: nowrap;
}
.cr-root .is-flash { background: var(--cr-sel); box-shadow: 0 0 0 3px var(--cr-lime); }
.cr-pop { max-width: 68ch; padding: 12px 0; border-bottom: 1px solid var(--cr-line-2); }
.cr-pop:last-child { border-bottom: 0; }
.cr-pop h3 { margin: 0 0 4px; font-size: 15px; font-weight: 600; color: var(--cr-strong); }
.cr-pop p { font-size: 15px; line-height: 1.6; }
.cr-facts { margin: 14px 0 0; max-width: 68ch; }
.cr-facts > div { display: grid; grid-template-columns: minmax(0, 170px) minmax(0, 1fr); gap: 4px 22px; padding: 11px 0; border-top: 1px solid var(--cr-line-2); font-size: 15px; line-height: 1.55; }
.cr-facts dt { font-weight: 600; color: var(--cr-strong); }
.cr-facts dd ul { margin: 0; padding-left: 18px; }
.cr-root .cr-src-link { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 600; }

/* ---- the Quick answer card ------------------------------------------------------ */
.cr-glance { border: 1px solid var(--cr-line); border-radius: 16px; background: var(--cr-surface); overflow: hidden; box-shadow: var(--cr-card-shadow); }
.cr-glance-h {
  margin: 0; padding: 11px 16px; display: flex; align-items: center; gap: 8px; font-size: 12px; letter-spacing: .1em;
  text-transform: uppercase; font-weight: 700; color: var(--cr-strong); background: var(--cr-cream); border-bottom: 1px solid var(--cr-line);
}
.cr-glance-h::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--cr-accent); }
.cr-gl-body { padding: 2px 16px 10px; }
.cr-qa-blk { padding: 12px 0; border-bottom: 1px solid var(--cr-line-2); min-width: 0; }
.cr-qa-blk:last-child { border-bottom: 0; }
.cr-qa-k {
  margin: 0 0 8px; font-size: 11px; line-height: 1.4; letter-spacing: .08em; text-transform: uppercase; color: var(--cr-muted);
  font-weight: 600; display: flex; justify-content: space-between; align-items: baseline; gap: 8px;
}
.cr-qa-kn { text-transform: none; letter-spacing: 0; font-weight: 500; }
.cr-root .cr-qa-link, .cr-root .cr-gl-flag {
  display: inline-flex; align-items: center; gap: 4px; min-height: 44px; border: 0; background: none; padding: 0; text-align: left;
  font-size: 13.5px; font-weight: 600; color: var(--cr-link); text-decoration: underline; text-underline-offset: 3px;
}
.cr-root .cr-gl-flag { color: var(--cr-warn); font-size: 14px; font-weight: 700; }
.cr-qa-link .cr-chev, .cr-gl-flag .cr-chev { color: inherit; }
.cr-cp-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; }
.cr-root .cr-cp {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 9px; width: 100%; min-height: 44px;
  padding: 6px 10px 6px 6px; border: 1px solid var(--cr-line); border-radius: 10px; background: var(--cr-surface);
  text-align: left; color: var(--cr-text); font-size: 12.5px; line-height: 1.35;
}
.cr-root .cr-cp:hover { border-color: var(--cr-strong); background: var(--cr-hover); }
.cr-cp .cr-code { font-size: 13px; -webkit-user-select: text; user-select: text; }
.cr-cp-d { min-width: 0; overflow-wrap: anywhere; }
.cr-cp-pre { color: var(--cr-muted); }
.cr-cp-key { font-weight: 600; color: var(--cr-strong); }
.cr-cp-st { display: inline-flex; align-items: center; gap: 3px; color: var(--cr-muted); font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.cr-cp-done { display: none; }
.cr-root .cr-cp.is-copied { border-color: var(--cr-strong); background: var(--cr-sel); }
.cr-cp.is-copied .cr-cp-idle { display: none; }
.cr-cp.is-copied .cr-cp-done { display: inline-flex; align-items: center; gap: 3px; color: var(--cr-strong); }
.cr-cp-more { margin-top: 5px; }
.cr-cp-more summary {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--cr-link); font-weight: 600; font-size: 13.5px;
  cursor: pointer; list-style: none; text-decoration: underline; text-underline-offset: 3px;
}
.cr-cp-more summary::-webkit-details-marker { display: none; }
.cr-cp-more summary .cr-chev { color: inherit; }
.cr-cp-more[open] summary .cr-chev { transform: rotate(90deg); }
.cr-cp-more[open] .cr-when-closed, .cr-cp-more:not([open]) .cr-when-open { display: none; }
.cr-cp-more[open] summary { margin-bottom: 4px; }
.cr-qa-note { font-size: 13.5px; line-height: 1.55; }
.cr-qa-note strong { color: var(--cr-strong); }
.cr-qa-sub { margin: 0 0 6px; font-size: 12px; color: var(--cr-muted); font-weight: 500; }
.cr-qa-sub b { color: var(--cr-strong); font-weight: 600; }
.cr-qa-mini { margin: 12px 0 6px; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--cr-muted); font-weight: 600; }
.cr-qa-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.cr-root .cr-qa-chip {
  display: inline-flex; align-items: center; gap: 2px; min-height: 40px; padding: 0 6px 0 12px; border: 1px solid var(--cr-line);
  border-radius: 999px; background: var(--cr-surface); color: var(--cr-link); font-weight: 500; font-size: 13px; line-height: 1.25;
  text-align: left; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--cr-link-line);
}
.cr-root .cr-qa-chip:hover { border-color: var(--cr-accent); text-decoration-color: currentColor; }
.cr-root .cr-qa-chip.is-plain { color: var(--cr-strong); text-decoration: none; padding: 0 12px; }
.cr-qa-chip .cr-chev { color: inherit; width: 16px; height: 16px; }
.cr-qa-flags { list-style: none; margin: 0; padding: 0; }
.cr-qa-flags li { display: flex; gap: 9px; padding: 6px 0; font-size: 13.5px; line-height: 1.45; font-weight: 500; }
.cr-qa-flags .cr-ic { color: var(--cr-warn); margin-top: 1px; }
.cr-root .cr-bw-chip {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 2px 10px; width: 100%; min-height: 52px;
  padding: 10px 12px; margin: 12px 0 0; border: 2px solid var(--cr-warn-solid); border-radius: 12px;
  background: var(--cr-warn-bg); color: var(--cr-warn); text-align: left;
}
.cr-root .cr-bw-chip:hover { background: var(--cr-warn-line); }
.cr-bw-ic { grid-row: 1 / span 2; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--cr-warn-solid); color: #fff; }
.cr-bw-t { font-weight: 800; font-size: 13px; letter-spacing: .07em; text-transform: uppercase; }
.cr-bw-s { grid-column: 2; font-size: 13px; color: var(--cr-warn-deep); font-weight: 500; line-height: 1.4; }
.cr-bw-chip > .cr-chev { grid-row: 1 / span 2; grid-column: 3; color: inherit; }
.cr-seg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; }
.cr-root:not([data-cr-size="lg"]) .cr-seg { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cr-root .cr-seg-b {
  position: relative; display: flex; flex-direction: column; justify-content: center; min-height: 48px; padding: 5px 22px 5px 10px;
  border: 1.5px solid var(--cr-chip-line); border-radius: 10px; background: var(--cr-surface); color: var(--cr-strong); text-align: left; line-height: 1.2;
}
.cr-root .cr-seg-b:hover { border-color: var(--cr-strong); }
.cr-seg-n { font-size: 13px; font-weight: 600; }
.cr-seg-r { font-size: 11.5px; color: var(--cr-muted); font-weight: 500; margin-top: 1px; }
.cr-seg-ck { display: none; position: absolute; right: 6px; top: 7px; }
.cr-root .cr-seg-b[aria-pressed="true"] { background: var(--cr-lime); border-color: var(--cr-pressed-edge); color: var(--cr-on-lime); }
.cr-seg-b[aria-pressed="true"] .cr-seg-r { color: var(--cr-on-lime); }
.cr-seg-b[aria-pressed="true"] .cr-seg-ck { display: block; }
.cr-qa-dose { margin: 10px 0 0; padding: 10px 12px; background: var(--cr-cream); border-left: 4px solid var(--cr-strong); border-radius: 0 10px 10px 0; }
.cr-qa-dose-k { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--cr-muted); }
.cr-qa-dose-v { margin-top: 3px; font-size: 14.5px; line-height: 1.45; }
.cr-qa-dose-v strong { color: var(--cr-strong); font-weight: 700; }
.cr-qa-start { margin: 8px 0 0; font-size: 13.5px; line-height: 1.5; }
.cr-qa-start b { display: block; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--cr-muted); margin-bottom: 1px; }
.cr-never { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; }
.cr-root .cr-never-b {
  display: flex; align-items: center; gap: 9px; width: 100%; min-height: 44px; padding: 7px 8px 7px 10px; border: 1px solid var(--cr-warn-line);
  border-left: 4px solid var(--cr-warn-solid); border-radius: 8px; background: var(--cr-warn-row); color: var(--cr-text);
  text-align: left; font-size: 13px; line-height: 1.35; font-weight: 600;
}
.cr-root .cr-never-b:hover { background: var(--cr-warn-bg); }
.cr-never-b > .cr-ic:first-child { color: var(--cr-warn); }
.cr-never-b > span { flex: 1; min-width: 0; }
.cr-never-b .cr-chev { color: var(--cr-warn); }
.cr-gl { margin: 0; display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
.cr-gl-row { padding: 9px 0; min-width: 0; border-bottom: 1px solid var(--cr-line-2); }
.cr-gl-row:nth-last-child(-n+2):nth-child(odd), .cr-gl-row:last-child { border-bottom: 0; }
.cr-gl dt { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--cr-muted); font-weight: 600; }
.cr-gl dd { margin: 3px 0 0; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
.cr-gl .cr-gl-big { font-size: 15px; font-weight: 600; color: var(--cr-strong); }
.cr-gl-1 { grid-template-columns: 1fr; }
.cr-gl-1 .cr-gl-row:nth-last-child(-n+2):nth-child(odd) { border-bottom: 1px solid var(--cr-line-2); }
.cr-gl-1 .cr-gl-row:last-child { border-bottom: 0; }

/* ---- phone: "Jump to" button and sheet --------------------------------------------- */
.cr-root .cr-jump { display: none; }
.cr-root.cr-has-doc[data-cr-size="sm"] .cr-jump {
  position: fixed; right: 16px; bottom: calc(max(var(--cr-tabs, 0px), env(safe-area-inset-bottom, 0px)) + 14px); z-index: 45;
  display: inline-flex; align-items: center; gap: 8px; min-height: 50px; max-width: calc(100vw - 32px); padding: 0 18px 0 14px;
  border: 1px solid var(--cr-chip-line); border-radius: 999px; background: var(--cr-cream); color: var(--cr-strong);
  font-weight: 600; font-size: 14.5px; box-shadow: 0 12px 26px -12px rgba(43, 20, 24, .45); overflow: hidden;
}
.cr-jump .cr-ic { color: var(--cr-accent); }
.cr-jump-l { flex: none; white-space: nowrap; }
.cr-jump-cur { font-weight: 500; color: var(--cr-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; max-width: 46vw; }
.cr-jump-cur:not(:empty)::before { content: "\00B7  "; }
.cr-jump-prog { position: absolute; left: 0; bottom: 0; height: 3px; width: 0; background: var(--cr-accent); transition: width .12s linear; }
.cr-sheetwrap { position: fixed; inset: 0; z-index: 70; }
.cr-scrim { position: absolute; inset: 0; background: rgba(30, 14, 18, .45); }
.cr-sheet {
  position: absolute; left: 0; right: 0; bottom: 0; max-height: 82vh; overflow: auto; background: var(--cr-cream); color: var(--cr-strong);
  border-radius: 20px 20px 0 0; padding: 6px 12px calc(22px + env(safe-area-inset-bottom, 0px)); animation: crSheetUp .22s ease-out;
}
@keyframes crSheetUp { from { transform: translateY(100%); } to { transform: none; } }
.cr-sheet-grab { width: 40px; height: 4px; border-radius: 2px; background: var(--cr-chip-line); margin: 6px auto; }
.cr-sheet-head { display: flex; align-items: center; justify-content: space-between; padding: 0 4px 6px 10px; }
.cr-sheet-t { font-size: 12px; letter-spacing: .09em; text-transform: uppercase; color: var(--cr-muted); font-weight: 600; }
.cr-root .cr-sheet-x { width: 44px; height: 44px; border: 0; background: var(--cr-track); border-radius: 50%; color: var(--cr-strong); display: grid; place-items: center; }
.cr-sheet .cr-prog { margin: 0 10px 8px; border-radius: 3px; overflow: hidden; }
.cr-sheet .cr-toc-a { min-height: 46px; font-size: 15px; }

.cr-toast {
  position: fixed; left: 50%; bottom: calc(max(var(--cr-tabs, 0px), env(safe-area-inset-bottom, 0px)) + 24px); z-index: 80;
  transform: translate(-50%, 16px); opacity: 0; pointer-events: none; background: #2B2B2B; color: #fff; padding: 12px 18px;
  border-radius: 12px; font-size: 14px; font-weight: 500; width: max-content; max-width: calc(100vw - 32px);
  transition: opacity .2s, transform .2s; box-shadow: 0 12px 30px -12px rgba(0, 0, 0, .5);
}
.cr-toast.is-on { opacity: 1; transform: translate(-50%, 0); }

/* ---- phone sizes for the document ---------------------------------------------------- */
.cr-root[data-cr-size="sm"] .cr-h1 { font-size: 29px; }
.cr-root[data-cr-size="sm"] .cr-center { padding-bottom: 70px; }
.cr-root[data-cr-size="sm"] .cr-ddx > div,
.cr-root[data-cr-size="sm"] .cr-facts > div { grid-template-columns: 1fr; gap: 2px; }
.cr-root[data-cr-size="sm"] .cr-panel { padding: 4px 14px 14px; }
.cr-root[data-cr-size="sm"] .cr-boxed { padding: 16px; }
.cr-root[data-cr-size="sm"] .cr-pills { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cr-root[data-cr-size="sm"] .cr-pill { border-radius: 12px; padding: 6px 12px; line-height: 1.3; font-size: 13.5px; }
.cr-root[data-cr-size="sm"] .cr-lead { font-size: 16.5px; }
.cr-root[data-cr-size="sm"] .cr-pv-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cr-root[data-cr-size="lg"] .cr-h1 { font-size: 36px; }
/* Three age buttons in a row do not fit a small phone without breaking words. */
@media (max-width: 480px) {
  .cr-root[data-cr-size="sm"] .cr-seg { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---- shared bits ------------------------------------------------------------------ */
.cr-empty { color: var(--cr-muted); font-size: 14px; padding: 26px 0; text-align: center; }
.cr-empty p + p { margin-top: 6px; }
.cr-spinner { text-align: center; padding: 40px 0; color: var(--cr-muted); font-size: 14px; }
.cr-spinner-sm { text-align: left; padding: 10px 0; }
.cr-foot { margin-top: 34px; padding-top: 16px; border-top: 1px solid var(--cr-line); font-size: 12px; line-height: 1.6; color: var(--cr-muted); max-width: 84ch; }
.cr-foot p + p { margin-top: 4px; }

/* ---- reviewer layer ------------------------------------------------------
   Only ever rendered for an admin: the questions flagged while an entry was
   drafted. Deliberately loud, because the point is that they get answered. */
.cr-badge {
  display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 999px;
  font-size: 11px; font-weight: 700; white-space: nowrap; vertical-align: middle; letter-spacing: 0; text-transform: none;
  background: var(--cr-warn-bg); color: var(--cr-warn); border: 1px solid var(--cr-warn-line);
}
.cr-review {
  margin: 0 0 22px; padding: 14px 16px; border-radius: 12px; max-width: 72ch;
  background: var(--cr-warn-bg); border: 1.5px solid var(--cr-warn-line); scroll-margin-top: calc(var(--cr-sticky) + 12px);
}
.cr-review .cr-review-h { color: var(--cr-warn); margin-bottom: 4px; font-size: 19px; }
.cr-review-lede { font-size: 12.5px; line-height: 1.5; color: var(--cr-warn); margin-bottom: 10px; }
.cr-review-topic { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; font-weight: 700; color: var(--cr-warn); margin: 14px 0 4px; }
.cr-review-list { list-style: none; padding: 0; margin: 0; font-size: 13.5px; line-height: 1.6; color: var(--cr-text); display: flex; flex-direction: column; gap: 10px; }
/* One question, with its answer. An answered question fades back so the eye lands on
   what is still open. */
.cr-q { background: var(--cr-surface); border: 1px solid var(--cr-line); border-radius: 10px; padding: 11px 13px; }
.cr-q-done { opacity: .72; }
.cr-q-done:hover, .cr-q-done:focus-within { opacity: 1; }
.cr-q-text { margin-bottom: 9px; }
.cr-q-buttons { display: flex; flex-wrap: wrap; gap: 6px; }
.cr-root .cr-q-btn {
  font-size: 12.5px; font-weight: 600; padding: 6px 11px; min-height: 36px;
  border-radius: 8px; border: 1.5px solid var(--cr-chip-line); background: var(--cr-field); color: var(--cr-text);
}
.cr-root .cr-q-btn:hover:not(:disabled) { border-color: var(--cr-text); }
.cr-root .cr-q-btn[aria-pressed="true"] { background: var(--cr-lime); border-color: var(--cr-pressed-edge); color: var(--cr-on-lime); }
.cr-root .cr-q-btn:disabled { opacity: .55; cursor: progress; }
.cr-root .cr-q-comment {
  width: 100%; margin-top: 8px; font-size: 13px; line-height: 1.5; padding: 8px 10px; border-radius: 8px; resize: vertical;
  border: 1.5px solid var(--cr-line); background: var(--cr-field); color: var(--cr-text);
}
.cr-root .cr-q-comment:focus-visible { outline: 3px solid var(--cr-accent); outline-offset: 1px; border-color: var(--cr-text); }
.cr-q-status { margin-top: 7px; min-height: 18px; }
.cr-decided { font-size: 12px; font-weight: 600; color: var(--cr-muted); }
.cr-q-open { font-size: 12px; color: var(--cr-warn); font-weight: 600; }
.cr-q-error { font-size: 12.5px; font-weight: 600; color: var(--cr-warn); }
.cr-progress { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 12.5px; color: var(--cr-muted); margin: 10px 0 4px; }
.cr-progress-bar { flex: 1 1 140px; height: 8px; border-radius: 999px; background: var(--cr-track); overflow: hidden; min-width: 100px; }
.cr-progress-fill { height: 100%; background: var(--cr-strong); border-radius: 999px; }

@media (prefers-reduced-motion: reduce) {
  .cr-root *, .cr-root *::before, .cr-root *::after { transition: none !important; animation: none !important; }
}


/* ---- design A "One Box" entry page (Toolkit redesign, Ryan 2026-11-10) ------------------
   One column: "At a glance" first, then this drug's calculators, then a row of section buttons
   that sticks under the Toolkit bar. The old page map (.cr-railcol) and side card column
   (.cr-glancecol) are no longer drawn. */
.cr-root .cr-doc.is-one { display: block; max-width: 880px; margin: 0 auto; }
.cr-root .cr-doc.is-one .cr-docmain { display: block; }
.cr-root .cr-doc.is-one .cr-glance-inline .cr-glance { max-width: none; }
.cr-root .cr-doc.is-one .cr-glance-inline { margin: 0 0 18px; }
.cr-root .cr-page-head { position: relative; }
.cr-root .cr-pin {
  position: absolute; right: 0; top: 0; display: inline-flex; align-items: center; gap: 6px; min-height: 40px;
  padding: 6px 14px; border: 1px solid var(--cr-line); border-radius: 999px; background: var(--cr-surface);
  color: var(--cr-strong); font: 600 14px/1 inherit; cursor: pointer;
}
.cr-root .cr-pin.is-on { background: var(--cr-sel); border-color: transparent; color: var(--cr-on-lime); }
.cr-root .cr-page-head:has(.cr-pin) .cr-h1, .cr-root .cr-page-head:has(.cr-pin) .cr-kick-m { padding-right: 112px; }
.cr-gx { padding: 10px 0; border-top: 1px solid var(--cr-line-2); min-width: 0; }
.cr-gx:first-child { border-top: 0; padding-top: 4px; }
.cr-gx-k { margin: 0 0 3px; display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--cr-strong); }
.cr-gx-v { margin: 0; font-size: 15px; line-height: 1.55; color: var(--cr-text); }
.cr-gx.is-warn { background: var(--cr-warn-bg); border: 1px solid var(--cr-warn-line); border-radius: 12px; padding: 10px 12px; margin: 6px 0; }
.cr-gx.is-warn + .cr-gx { border-top: 0; }
.cr-gx.is-warn .cr-gx-k { color: var(--cr-warn); }
.cr-gx-list { margin-top: 10px; }
.cr-tools { margin: 0 0 18px; }
.cr-tools-h { margin: 0 0 8px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--cr-muted); }
.cr-tools-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 8px; }
.cr-root .cr-tool {
  display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 10px 14px; border: 1px solid var(--cr-line);
  border-radius: 14px; background: var(--cr-surface); color: var(--cr-text); text-decoration: none;
}
.cr-root .cr-tool:hover { border-color: var(--cr-strong); }
.cr-tool-ic { flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: var(--cr-tool-bg); color: var(--cr-tool-ink); }
.cr-tool-t { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.cr-tool-t b { color: var(--cr-strong); font-weight: 600; }
.cr-tool-t small { color: var(--cr-muted); font-size: 13px; }
.cr-root .cr-jumpbar {
  position: sticky; top: var(--hdrH, 0px); z-index: 4; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none;
  margin: 6px 0 4px; padding: 10px 0; background: var(--cr-page); border-bottom: 1px solid var(--cr-line-2);
}
.cr-root .cr-jumpbar::-webkit-scrollbar { display: none; }
.cr-root .cr-jb {
  flex: none; display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 6px 13px; border: 0; border-radius: 999px;
  background: var(--cr-cream); color: var(--cr-strong); font: 600 13px/1.2 inherit; cursor: pointer; white-space: nowrap;
}
.cr-root .cr-jb:hover { background: var(--cr-cream-hover); }
.cr-root .cr-jb.is-active { background: var(--cr-sel); color: var(--cr-on-lime); box-shadow: inset 0 0 0 1px var(--cr-pressed-edge); }
.cr-root[data-cr-size="sm"] .cr-page-head:has(.cr-pin) .cr-h1 { padding-right: 0; }
.cr-root[data-cr-size="sm"] .cr-pin { position: static; align-self: flex-start; margin-bottom: 8px; }
/* the age buttons on the one-column card: one compact row (scrolls sideways on a phone) */
.cr-root .cr-doc.is-one .cr-glance .cr-seg { display: flex; flex-wrap: wrap; gap: 6px; }
.cr-root .cr-doc.is-one .cr-glance .cr-seg-b { flex-direction: row; align-items: baseline; gap: 5px; min-height: 36px; padding: 6px 12px; border-radius: 999px; width: auto; }
.cr-root .cr-doc.is-one .cr-glance .cr-seg-r { margin-top: 0; }
.cr-root .cr-doc.is-one .cr-glance .cr-seg-ck { display: none !important; }
.cr-root[data-cr-size="sm"] .cr-doc.is-one .cr-glance .cr-seg { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -16px; padding: 0 16px 2px; }
.cr-root[data-cr-size="sm"] .cr-doc.is-one .cr-glance .cr-seg::-webkit-scrollbar { display: none; }
.cr-root[data-cr-size="sm"] .cr-doc.is-one .cr-glance .cr-seg-b { flex: none; }