/* MedDesk design system: bright, editorial-clinical.
   Fonts: Source Serif 4 (display, the authority of a journal) · Inter (body) · IBM Plex Mono (stamps, data) */
@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,500;8..60,600;8..60,700&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --paper:#ffffff; --mist:#f4f7fa; --mist2:#eaf0f6; --line:#e2e8ef; --line2:#cbd5e0;
  --ink:#0e1b2b; --text:#1f2d3d; --mute:#5b6b7c; --dim:#8a98a8;
  --blue:#0f5fb8; --blue-ink:#0b478a; --blue-tint:#eaf2fb; --blue-tint2:#d9e8f8;
  --onco:#0f766e; --im:#1d4ed8; --em:#b42318; --surg:#15803d; --paeds:#c2410c; --obgyn:#be185d; --psych:#5b4bd6;
  --tools:#b45309; --exam:#0369a1;
  --ok:#15803d; --amber:#b45309; --warn:#b42318;
  --display:'Source Serif 4',Georgia,'Times New Roman',serif;
  --body:'Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --r:16px; --r2:10px; --maxw:1280px;
  --shadow:0 1px 2px rgba(14,27,43,.04),0 8px 24px rgba(14,27,43,.06);
  --shadow2:0 2px 6px rgba(14,27,43,.06),0 18px 40px rgba(14,27,43,.10);
  /* aliases kept for the tool/exam pages */
  --bg:var(--paper); --bg2:var(--mist); --panel:var(--paper); --panel2:var(--mist); --house:var(--blue); --house-ink:#fff;
}
*{box-sizing:border-box}
html{background:var(--paper);color-scheme:light}
body.md{margin:0;background:var(--paper);color:var(--text);font-family:var(--body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.md a{color:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
@media (max-width:640px){.wrap{padding:0 18px}}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:6px}
img{max-width:100%;display:block}

/* ---------- spectrum: the seven desks, as a small identity mark ---------- */
.spectrum{display:flex;height:4px;width:100%;overflow:hidden;border-radius:2px}
.spectrum i{flex:1}
.spectrum i:nth-child(1){background:var(--onco)} .spectrum i:nth-child(2){background:var(--im)}
.spectrum i:nth-child(3){background:var(--em)}   .spectrum i:nth-child(4){background:var(--surg)}
.spectrum i:nth-child(5){background:var(--paeds)} .spectrum i:nth-child(6){background:var(--obgyn)}
.spectrum i:nth-child(7){background:var(--psych)}

/* ---------- top bar (every page) ---------- */
.mdtop{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line);font-family:var(--body)}
.mdtop .in{max-width:var(--maxw);margin:0 auto;padding:0 28px;height:64px;display:flex;align-items:center;gap:22px}
.mdtop .wm{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-family:var(--display);font-weight:700;font-size:22px;letter-spacing:-.01em}
.mdtop .wm .mk{flex:none;display:block}
.mdtop nav{display:flex;gap:2px;margin-left:8px}
.mdtop nav a{text-decoration:none;color:var(--mute);font-size:14.5px;font-weight:500;padding:7px 12px;border-radius:8px}
.mdtop nav a:hover,.mdtop nav a[aria-current]{color:var(--ink);background:var(--mist)}
.mdtop .sp{flex:1}
.mdtop .sbtn{display:flex;align-items:center;gap:10px;background:var(--paper);border:1px solid var(--line2);color:var(--mute);border-radius:10px;padding:8px 10px 8px 12px;font:500 13.5px var(--body);cursor:pointer;min-width:230px}
.mdtop .sbtn:hover{border-color:var(--blue);color:var(--ink)}
.mdtop .sbtn kbd{margin-left:auto;font:500 11px var(--mono);color:var(--dim);border:1px solid var(--line);border-radius:5px;padding:1px 6px;background:var(--mist)}
.mdtop .tag{font:500 11.5px var(--mono);color:var(--dim);letter-spacing:.2px;white-space:nowrap}
@media (max-width:900px){.mdtop .sbtn kbd{display:none}}
@media (max-width:900px){.mdtop nav{display:none}.mdtop .tag{display:none}.mdtop .sbtn{min-width:0}.mdtop .sbtn span{display:none}}
@media (max-width:640px){.mdtop .in{padding:0 18px;height:58px}}

/* ---------- search (hero inline + overlay) ---------- */
.sbox{position:relative}
.sbox .field{display:flex;align-items:center;gap:12px;background:var(--paper);border:1px solid var(--line2);border-radius:14px;padding:0 16px;box-shadow:var(--shadow2);transition:border-color .2s,box-shadow .2s}
.sbox .field:focus-within{border-color:var(--blue);box-shadow:0 0 0 4px var(--blue-tint2),var(--shadow2)}
.sbox .field svg{flex:none;color:var(--blue)}
.sbox input{flex:1;background:none;border:0;outline:0;color:var(--ink);font:500 19px/1 var(--body);padding:19px 0;min-width:0}
.sbox input::placeholder{color:var(--dim)}
.sbox .field kbd{font:500 12px var(--mono);color:var(--dim);border:1px solid var(--line);border-radius:6px;padding:3px 7px;background:var(--mist)}
.sbox .hint{margin:10px 4px 0;font:400 13px var(--body);color:var(--mute)}
.sbox .hint b{color:var(--text);font-weight:500}
.results{margin-top:8px;background:var(--paper);border:1px solid var(--line2);border-radius:14px;overflow:hidden;display:none;box-shadow:var(--shadow2)}
.results.on{display:block}
.results a{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:baseline;padding:12px 16px;text-decoration:none;border-top:1px solid var(--line)}
.results a:first-child{border-top:0}
.results a:hover,.results a.sel{background:var(--blue-tint)}
.results .dk{font:600 11px var(--mono);letter-spacing:.4px;text-transform:uppercase;padding:3px 7px;border-radius:6px;color:#fff;white-space:nowrap}
.results .t{font-weight:600;font-size:15px;color:var(--ink)}
.results .t small{display:block;font-weight:400;color:var(--mute);font-size:13px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.results .t mark{background:none;color:var(--blue);font-weight:700}
.results .go{font:500 11.5px var(--mono);color:var(--dim)}
.results .none{padding:16px;color:var(--mute);font-size:14px}
.results .none b{color:var(--ink)}
.dk-onco{background:var(--onco)} .dk-im{background:var(--im)} .dk-em{background:var(--em)} .dk-surg{background:var(--surg)}
.dk-paeds{background:var(--paeds)} .dk-obgyn{background:var(--obgyn)} .dk-psych{background:var(--psych)} .dk-tools{background:var(--tools)} .dk-exam{background:var(--exam)}
.ovl{position:fixed;inset:0;z-index:100;background:rgba(14,27,43,.42);backdrop-filter:blur(6px);display:none;padding:10vh 18px 0}
.ovl.on{display:block}
.ovl .sbox{max-width:760px;margin:0 auto}
.ovl .sbox input{font-size:18px;padding:16px 0}
.ovl .hint{color:#fff}
.ovl .hint b{color:#fff}

/* ---------- generic blocks ---------- */
.eyebrow{font:600 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
h1.display{font-family:var(--display);font-weight:600;letter-spacing:-.015em;line-height:1.04;font-size:clamp(38px,5.6vw,72px);margin:14px 0 18px;color:var(--ink)}
h1.display em{font-style:italic;color:var(--blue)}
h1.sec,h2.sec{font-family:var(--display);font-weight:600;letter-spacing:-.01em;font-size:clamp(28px,3.2vw,40px);margin:0 0 8px;color:var(--ink);line-height:1.15}
p.lede{font-size:clamp(17px,1.5vw,19px);color:var(--mute);max-width:700px;margin:0 0 26px;line-height:1.6}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:24px 26px;position:relative;overflow:hidden;text-decoration:none;display:block;color:inherit;box-shadow:var(--shadow);transition:transform .18s,box-shadow .18s,border-color .18s}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow2);border-color:var(--line2)}
.card .bar{position:absolute;left:0;top:0;right:0;height:4px;background:var(--c,var(--blue))}
.card h3{font-family:var(--display);font-weight:600;font-size:23px;margin:0 0 6px;letter-spacing:-.01em;color:var(--ink)}
.card p{margin:0;color:var(--mute);font-size:14.5px}
.card .meta{display:flex;gap:12px;margin-top:16px;font:500 12px var(--mono);color:var(--dim)}
.card .meta b{color:var(--c,var(--blue));font-weight:600}
.pill{display:inline-block;font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:6px;border:1px solid var(--line2);color:var(--mute);background:var(--paper)}
.pill.live{border-color:transparent;background:#e6f4ea;color:var(--ok)}
.pill.soon{color:var(--dim);background:var(--mist)}
.stamp{font:500 12px var(--mono);color:var(--dim)}
/* the pocket staleness notice. Two contexts: beside the save button on a desk landing page,
   and as a banner under the sticky top bar on the other 205 pages a desk save covers. */
.pocketnote{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0;padding:11px 20px;background:var(--blue-tint);border-bottom:1px solid var(--blue-tint2);color:var(--blue-ink);font:500 14px/1.45 var(--body)}
.pocketnote .btn{font-size:13px;padding:5px 12px;text-decoration:none}
.deskbar .pocketnote{width:100%;margin-top:8px;border:1px solid var(--blue-tint2);border-radius:9px}

.stamp b{color:var(--mute);font-weight:500}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--blue);color:#fff;font:600 14px var(--body);padding:11px 16px;border-radius:10px;text-decoration:none;border:0;cursor:pointer}
.btn.ghost{background:var(--paper);color:var(--ink);border:1px solid var(--line2)}
.btn:hover{filter:brightness(1.05)}
body.md a.btn{color:#fff}body.md a.btn.ghost{color:var(--ink)}
.notice{background:#fff8ee;border:1px solid #f3dcb8;color:#6b4a12;border-radius:var(--r2);padding:12px 16px;font-size:13.5px}
.notice b{color:#4d340b}
.foot{border-top:1px solid var(--line);margin-top:70px;padding:34px 0 54px;color:var(--mute);font-size:13px;background:var(--paper)}
.foot .in{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.foot p{margin:0 0 8px}
.foot b{color:var(--ink);font-weight:600}
.foot a{color:var(--blue);text-decoration:none}
@media (max-width:760px){.foot .in{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- paper handbook pages keep the print master; the bar sits above ---------- */
body.paper{margin:0}
body.paper .mdnav{display:none}

/* ---------- the answer box: the top hit's own content, cited, before any click ---------- */
.results .answer{padding:18px 20px 16px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#fff,var(--mist))}
.results .answer .ans-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.results .answer .ans-k{font:500 12px var(--mono);color:var(--dim)}
.results .answer .ans-src{margin-left:auto;font:600 11px var(--mono);color:var(--mute);background:var(--paper);border:1px solid var(--line2);border-radius:6px;padding:2px 8px}
.results .answer .ans-chk{font:600 11px var(--mono);color:var(--mute);background:var(--paper);border:1px solid var(--line2);border-radius:6px;padding:2px 8px}
.results .answer .ans-src+.ans-chk{margin-left:6px}
.results .answer .ans-chk:first-of-type{margin-left:auto}
.results .answer h3{font-family:var(--display);font-weight:600;font-size:21px;margin:0 0 8px;color:var(--ink);letter-spacing:-.01em}
.results .answer h3 mark{background:none;color:var(--blue)}
.results .answer p{margin:0 0 8px;font-size:14.5px;line-height:1.55;color:var(--text)}
.results .answer p mark{background:#fff3c4;color:inherit;border-radius:3px;padding:0 2px}
.results .answer .ans-w{color:var(--mute)}
.results .answer .ans-w b,.results .answer .ans-f b{font:600 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--c,var(--blue));margin-right:6px}
.results .answer .ans-f{font-family:var(--mono);font-size:13px;color:var(--mute)}
.results .answer .ans-go{display:inline-block;margin-top:4px;font:600 13.5px var(--body);color:var(--blue);text-decoration:none}
.results .answer .ans-go:hover{text-decoration:underline}
.results .more a:first-child{border-top:0}

/* ---------- desk switcher in the top bar ---------- */
.dmenu{position:relative}
.dmenu > a{display:inline-flex;align-items:center;gap:6px}
.dpanel{position:absolute;top:calc(100% + 8px);left:0;min-width:290px;background:var(--paper);border:1px solid var(--line2);border-radius:14px;box-shadow:var(--shadow2);padding:8px;display:none;z-index:60}
.dmenu:hover .dpanel,.dmenu:focus-within .dpanel{display:block}
.dpanel a{display:grid;grid-template-columns:12px 1fr;gap:2px 12px;align-items:center;padding:8px 10px;border-radius:9px;text-decoration:none;color:var(--ink)}
.dpanel a:hover{background:var(--mist)}
.dpanel a i{width:10px;height:10px;border-radius:50%;background:var(--c);grid-row:span 2}
.dpanel a b{font-weight:600;font-size:14px}
.dpanel a span{font-size:12px;color:var(--mute)}

/* ---------- reading progress (long pages only) ---------- */
.rprog{position:fixed;top:0;left:0;height:3px;width:0;background:var(--c,var(--blue));z-index:70;transition:width .1s linear}

/* ---------- load choreography + hover detail ---------- */
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.rise{animation:rise .7s cubic-bezier(.2,.7,.2,1) backwards}
html.no-motion .rise,html.no-motion .fade{animation:none!important}
.rise.d1{animation-delay:.08s}.rise.d2{animation-delay:.16s}.rise.d3{animation-delay:.24s}.rise.d4{animation-delay:.32s}.rise.d5{animation-delay:.4s}
@keyframes fadein{from{opacity:0}to{opacity:1}}
.fade{animation:fadein 1.2s ease backwards}
.pic img{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.card:hover .pic img,.pic:hover img{transform:scale(1.03)}
.results .more-h{font:600 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);padding:10px 16px 4px}
.results .answer .ans-go.sel{text-decoration:underline}

/* ---------- the tutor (capped AI) ---------- */
.ask{margin-top:14px;background:var(--paper);border:1px solid var(--line2);border-radius:14px;box-shadow:var(--shadow2);overflow:hidden}
.ask .head{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--mist)}
.ask .head b{font:600 12px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}
.ask .head .meter{margin-left:auto;font:500 12px var(--mono);color:var(--dim);white-space:nowrap}
.ask .head .meter i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--line2);margin-left:3px}
.ask .head .meter i.on{background:var(--blue)}
.ask form{display:flex;gap:8px;padding:12px 14px}
.ask textarea{flex:1;resize:none;border:1px solid var(--line2);border-radius:10px;padding:10px 12px;font:500 15px var(--body);color:var(--ink);min-height:44px;max-height:120px;outline:0}
.ask textarea:focus{border-color:var(--blue)}
.ask .btn{align-self:flex-end}
.ask .out{padding:4px 16px 14px;font-size:14.5px;line-height:1.6;color:var(--text);display:none}
.ask .out.on{display:block}
.ask .out .a{white-space:pre-wrap}
.ask .out .a mark{background:none;color:var(--blue);font-weight:600}
.ask .out .srcs{margin:10px 0 0;padding:0;list-style:none;display:grid;gap:4px}
.ask .out .srcs a{display:flex;gap:8px;align-items:baseline;text-decoration:none;font-size:13px;color:var(--mute)}
.ask .out .srcs a b{font:600 11px var(--mono);color:var(--blue)}
.ask .out .srcs a:hover span{text-decoration:underline}
.ask .out .pay{background:var(--blue-tint);border:1px solid var(--blue-tint2);border-radius:10px;padding:14px 16px;margin-top:6px}
.ask .out .pay h4{font-family:var(--display);font-size:20px;margin:0 0 4px;color:var(--ink)}
.ask .out .pay p{margin:0 0 10px;color:var(--mute);font-size:14px}
.ask .out .pay .price{font:600 13px var(--mono);color:var(--blue)}
.ask .out .err{color:var(--warn)}
.ask .foot{padding:0 16px 12px;font:500 11.5px var(--mono);color:var(--dim)}
/* the tutor can be held (production carries no model key): a control that is off
   must look off, and a hold is a status rather than a fault */
.ask textarea:disabled{background:var(--mist);color:var(--dim);cursor:not-allowed}
.ask textarea:disabled::placeholder{color:var(--dim)}
.ask .btn:disabled{background:var(--line2);color:var(--dim);cursor:not-allowed}
.ask .btn:disabled:hover{filter:none}
.ask .out .note{color:var(--mute)}
.ask.busy .btn{opacity:.6;pointer-events:none}
/* top bar, 901 to 1120 px (a tablet on its side, a small laptop): the wordmark, five links, the tag and the search box need 1095 px, so the bar ran 71 px past a 1024 px window and the page scrolled sideways. The tag goes first, as it already does on a phone; the notice and the footer still carry the same words. */
@media (max-width:1120px){.mdtop .tag{display:none}}