/* ============================================================
   The Atlas — Body-map treatment compendium
   Ported from the design handoff (Atlas Compendium.html), scoped
   under .atlas-screen so it never collides with the app's global
   tokens / .cmp-* styles. Compendium (direction B) layout only.
   Fonts self-hosted (CSP: font-src 'self').
   ============================================================ */

/* ── Self-hosted fonts ─────────────────────────────────────── */
@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/instrumentserif.woff2") format("woff2");}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;
  src:url("../fonts/instrumentserif-italic.woff2") format("woff2");}
@font-face{font-family:"Geist";font-style:normal;font-weight:100 900;font-display:swap;
  src:url("../fonts/geist.woff2") format("woff2");}
@font-face{font-family:"Geist Mono";font-style:normal;font-weight:100 900;font-display:swap;
  src:url("../fonts/geistmono.woff2") format("woff2");}

/* ── Tokens (scoped) ───────────────────────────────────────── */
.atlas-screen{
  --ink-950:oklch(0.14 0.035 250); --ink-900:oklch(0.21 0.042 250);
  --ink-800:oklch(0.30 0.058 245); --ink-700:oklch(0.40 0.072 240);
  --ink-600:oklch(0.48 0.06 238); --ink-500:oklch(0.55 0.045 235);
  --ink-400:oklch(0.66 0.03 235); --ink-300:oklch(0.80 0.02 235);
  --ink-200:oklch(0.89 0.014 235); --ink-100:oklch(0.94 0.010 235);
  --ink-50:oklch(0.975 0.006 235);
  --paper:oklch(0.987 0.006 85); --bone:oklch(0.967 0.012 85); --ash:oklch(0.93 0.012 85);
  --f-display:"Instrument Serif","Times New Roman",Georgia,serif;
  --f-sans:"Geist",-apple-system,"Segoe UI",system-ui,sans-serif;
  --f-mono:"Geist Mono","SF Mono",ui-monospace,monospace;
  --c-accent:#1f4e79; --c-feature:#0c2540;
  --safe:#2e8b57; --safe-bg:#e8f5ee; --caution:#c98a00; --avoid:#991b1b;
  --gentle:#2e7d51; --gentle-bg:oklch(0.965 0.03 150);
  --row-pad-y:18px;
}
.atlas-screen{font-family:var(--f-sans);font-size:15px;line-height:1.5;color:var(--ink-900);
  background:var(--bone);min-height:calc(100vh - var(--header-h));}
.atlas-screen *{box-sizing:border-box;}
.atlas-screen button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;}
.atlas-screen [hidden]{display:none!important;}
.atlas-screen ::selection{background:color-mix(in oklch,var(--c-accent) 22%,transparent);}

/* ── Layout ────────────────────────────────────────────────── */
.atlas-screen .layout{display:grid;grid-template-columns:340px minmax(0,1fr);}
.atlas-screen .sidebar{background:linear-gradient(180deg,color-mix(in oklch,var(--c-accent) 7%,var(--bone)),var(--bone) 55%);
  border-right:1px solid var(--ink-200);padding:28px 24px 60px;display:flex;flex-direction:column;gap:24px;}
.atlas-screen .main{padding:38px 46px 110px;max-width:1140px;}

/* ── Figure / index / meds (sidebar) ───────────────────────── */
.atlas-screen .figure-wrap svg{display:block;width:100%;height:auto;overflow:visible;max-height:330px;}
.atlas-screen .fig-body{fill:color-mix(in oklch,var(--ink-300) 40%,var(--paper));}
.atlas-screen .fig-leader{stroke:var(--ink-300);stroke-width:1;}
.atlas-screen .fig-label{font-family:var(--f-display);font-style:italic;font-size:14px;fill:var(--ink-700);}
.atlas-screen .fig-marker{cursor:pointer;} .atlas-screen .fig-marker .mk-ring{fill:var(--paper);stroke-width:1.5;transition:r .2s;}
.atlas-screen .fig-marker .mk-num{font-family:var(--f-mono);font-size:11px;font-weight:500;text-anchor:middle;dominant-baseline:central;}
.atlas-screen .fig-marker.active .mk-ring{stroke-width:2.5;}
.atlas-screen .mk-halo{opacity:0;transition:opacity .2s;} .atlas-screen .fig-marker.active .mk-halo{opacity:1;}
.atlas-screen .idx-label{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-500);margin-bottom:4px;}
.atlas-screen .idx-group{border-top:1px solid var(--ink-200);} .atlas-screen .idx-group:first-child{border-top:0;}
.atlas-screen .idx-row{display:grid;grid-template-columns:26px 1fr auto;align-items:baseline;gap:10px;width:100%;padding:11px 8px;border-radius:8px;text-align:left;transition:background .14s;}
.atlas-screen .idx-row .ix-num{font-family:var(--f-mono);font-size:11px;color:var(--ink-400);}
.atlas-screen .idx-row .ix-name{font-family:var(--f-display);font-style:italic;font-size:19px;color:var(--ink-800);}
.atlas-screen .idx-row .ix-count{font-family:var(--f-mono);font-size:12px;color:var(--ink-400);}
.atlas-screen .idx-row:hover{background:color-mix(in oklch,var(--c-accent) 6%,transparent);} .atlas-screen .idx-row.open .ix-name{color:var(--c-accent);}
.atlas-screen .idx-conds{display:flex;flex-direction:column;gap:2px;padding:0 8px 10px 36px;}
.atlas-screen .idx-cond{display:flex;align-items:center;gap:8px;text-align:left;font-size:13.5px;color:var(--ink-600);padding:6px 8px;border-radius:7px;transition:.12s;width:100%;}
.atlas-screen .idx-cond:hover{background:var(--ink-100);color:var(--ink-900);}
.atlas-screen .idx-cond.active{color:var(--c-accent);font-weight:500;background:color-mix(in oklch,var(--c-accent) 9%,transparent);}
.atlas-screen .idx-hero{font-family:var(--f-mono);font-size:8.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--c-accent);border:1px solid color-mix(in oklch,var(--c-accent) 35%,var(--ink-200));border-radius:5px;padding:1px 5px;margin-left:auto;}
.atlas-screen .mymeds{background:var(--paper);border:1px solid var(--ink-200);border-radius:14px;padding:16px;box-shadow:0 2px 10px -6px color-mix(in oklch,var(--ink-950) 30%,transparent);}
.atlas-screen .meds-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;}
.atlas-screen .meds-label{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-700);}
.atlas-screen .meds-clear{font-family:var(--f-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-400);} .atlas-screen .meds-clear:hover{color:var(--avoid);}
.atlas-screen .meds-note{font-size:12.5px;line-height:1.45;color:var(--ink-500);margin:0 0 12px;text-wrap:pretty;}
.atlas-screen .med-chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:10px;}
.atlas-screen .med-chip{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-800);background:color-mix(in oklch,var(--c-accent) 9%,var(--paper));border:1px solid color-mix(in oklch,var(--c-accent) 24%,var(--ink-200));border-radius:9999px;padding:5px 8px 5px 12px;}
.atlas-screen .med-x{width:16px;height:16px;display:grid;place-items:center;border-radius:50%;color:var(--ink-400);font-size:10px;} .atlas-screen .med-x:hover{background:color-mix(in oklch,var(--avoid) 14%,transparent);color:var(--avoid);}
.atlas-screen .med-add input{width:100%;height:38px;padding:0 14px;font:inherit;font-size:13.5px;color:var(--ink-900);background:var(--bone);border:1px dashed var(--ink-300);border-radius:9px;outline:none;}
.atlas-screen .med-add input:focus{border-style:solid;border-color:var(--c-accent);background:var(--paper);}

/* ── Header ────────────────────────────────────────────────── */
.atlas-screen .crumb{font-family:var(--f-mono);font-size:12px;letter-spacing:.10em;text-transform:uppercase;color:var(--c-accent);margin-bottom:14px;}
.atlas-screen .head-row{display:flex;justify-content:space-between;align-items:flex-start;gap:32px;}
.atlas-screen .title{font-family:var(--f-display);font-weight:400;font-size:64px;line-height:1.0;letter-spacing:-0.01em;margin:0;color:var(--ink-900);max-width:15ch;text-wrap:balance;}
.atlas-screen .head-meta{font-family:var(--f-mono);font-size:12px;line-height:1.7;text-align:right;color:var(--ink-400);white-space:nowrap;letter-spacing:.04em;padding-top:10px;} .atlas-screen .head-meta b{color:var(--ink-800);font-weight:500;}
.atlas-screen .aka{display:block;font-family:var(--f-display);font-style:italic;font-size:21px;color:var(--ink-500);margin-top:14px;}
.atlas-screen .rule{height:2px;background:var(--ink-900);margin:22px 0 26px;}
.atlas-screen .lede{font-family:var(--f-display);font-style:italic;font-size:25px;line-height:1.32;color:var(--ink-700);margin:0;max-width:52ch;text-wrap:pretty;}
.atlas-screen .ladder-note{display:flex;gap:14px;align-items:baseline;margin-top:24px;padding:16px 20px;background:color-mix(in oklch,var(--c-accent) 6%,var(--paper));border:1px solid color-mix(in oklch,var(--c-accent) 18%,var(--ink-200));border-radius:13px;font-size:15.5px;line-height:1.5;color:var(--ink-800);text-wrap:pretty;}
.atlas-screen .ln-mark{flex:none;font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--c-accent);padding-top:3px;}
.atlas-screen .pbanner{display:flex;gap:14px;align-items:center;width:100%;text-align:left;margin-top:16px;padding:15px 18px;border-radius:13px;border:1px dashed var(--ink-300);background:var(--paper);color:var(--ink-700);font-size:14px;line-height:1.45;transition:.14s;}
.atlas-screen .pbanner:hover{border-color:var(--c-accent);background:color-mix(in oklch,var(--c-accent) 5%,var(--paper));}
.atlas-screen .pbanner.on{border-style:solid;border-color:color-mix(in oklch,var(--safe) 45%,var(--ink-200));background:color-mix(in oklch,var(--safe) 8%,var(--paper));cursor:default;}
.atlas-screen .pbanner b{color:var(--ink-900);}
.atlas-screen .pb-ic{flex:none;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-size:15px;background:color-mix(in oklch,var(--c-accent) 12%,var(--paper));color:var(--c-accent);}
.atlas-screen .pbanner.on .pb-ic{background:color-mix(in oklch,var(--safe) 16%,var(--paper));color:var(--safe);}

/* ── Type tags + grade + band pill ─────────────────────────── */
.atlas-screen .ttag{display:inline-flex;align-items:center;gap:5px;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;padding:3px 9px;border-radius:9999px;border:1px solid;white-space:nowrap;line-height:1;}
.atlas-screen .ttag-dot{width:5px;height:5px;border-radius:50%;background:currentColor;}
.atlas-screen .t-gentle,.atlas-screen .t-food,.atlas-screen .t-herb{color:var(--gentle);border-color:color-mix(in oklch,var(--gentle) 40%,var(--ink-200));background:color-mix(in oklch,var(--gentle) 8%,var(--paper));}
.atlas-screen .t-otc,.atlas-screen .t-pharm{color:var(--c-accent);border-color:color-mix(in oklch,var(--c-accent) 38%,var(--ink-200));background:color-mix(in oklch,var(--c-accent) 6%,var(--paper));}
.atlas-screen .t-rx{color:#a6790f;border-color:color-mix(in oklch,#c98a00 45%,var(--ink-200));background:color-mix(in oklch,#c98a00 9%,var(--paper));}
.atlas-screen .t-ctrl{color:var(--avoid);border-color:color-mix(in oklch,var(--avoid) 42%,var(--ink-200));background:color-mix(in oklch,var(--avoid) 8%,var(--paper));}
.atlas-screen .grade{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:7px;border:1.5px solid;font-family:var(--f-display);font-size:17px;line-height:1;background:var(--paper);}
.atlas-screen .band-pill{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;font-weight:500;}
.atlas-screen .band-pill.sm{font-size:10px;} .atlas-screen .band-dot{width:9px;height:9px;border-radius:50%;flex:none;}

/* ── Featured spotlight ────────────────────────────────────── */
.atlas-screen .feat{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:start;width:100%;text-align:left;margin-top:22px;padding:24px 26px;border-radius:18px;cursor:pointer;
  background:linear-gradient(135deg,var(--bandbg),color-mix(in oklch,var(--bandbg) 30%,var(--paper)));border:1px solid color-mix(in oklch,var(--bandc) 30%,var(--ink-200));transition:.16s;}
.atlas-screen .feat:hover{border-color:color-mix(in oklch,var(--bandc) 55%,var(--ink-200));box-shadow:0 16px 40px -22px color-mix(in oklch,var(--bandc) 80%,transparent);}
.atlas-screen .feat-art{width:84px;height:84px;border-radius:18px;display:grid;place-items:center;background:var(--paper);border:1px solid color-mix(in oklch,var(--bandc) 24%,var(--ink-200));}
.atlas-screen .feat-art svg{width:42px;height:42px;}
.atlas-screen .feat-eyebrow{display:flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:color-mix(in oklch,var(--bandc) 60%,var(--ink-700));flex-wrap:wrap;}
.atlas-screen .feat-name{font-family:var(--f-display);font-size:40px;line-height:1.02;color:var(--ink-900);margin-top:8px;}
.atlas-screen .feat-eg{font-family:var(--f-display);font-style:italic;font-size:18px;color:var(--ink-500);margin-top:3px;}
.atlas-screen .feat-tags{display:flex;gap:10px;align-items:center;margin-top:12px;flex-wrap:wrap;}
.atlas-screen .feat-evi{font-size:15px;line-height:1.55;color:var(--ink-700);margin:14px 0 0;max-width:64ch;text-wrap:pretty;}
.atlas-screen .feat-go{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--c-accent);}
.atlas-screen .feat:hover .feat-go{gap:10px;}

/* ── Filter chips ──────────────────────────────────────────── */
.atlas-screen .chips{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:28px 0 6px;flex-wrap:wrap;}
.atlas-screen .chips-set{display:flex;gap:8px;flex-wrap:wrap;}
.atlas-screen .chip{display:inline-flex;align-items:center;gap:7px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-600);padding:8px 14px;border-radius:9999px;border:1px solid var(--ink-200);background:var(--paper);transition:.14s;}
.atlas-screen .chip:hover{border-color:var(--ink-300);color:var(--ink-900);}
.atlas-screen .chip.on{background:var(--c-accent);color:var(--paper);border-color:var(--c-accent);}
.atlas-screen .chip-dot{width:7px;height:7px;border-radius:50%;}
.atlas-screen .chip.quick.on{background:color-mix(in oklch,var(--safe) 16%,var(--paper));color:var(--safe);border-color:color-mix(in oklch,var(--safe) 45%,var(--ink-200));}

/* ── Sections (shared) ─────────────────────────────────────── */
.atlas-screen .results{margin-top:10px;}
.atlas-screen .lsec{margin-top:30px;}
.atlas-screen .lsec-head{display:flex;align-items:baseline;gap:14px;padding:0 4px 9px;border-bottom:1.5px solid var(--ink-300);flex-wrap:wrap;}
.atlas-screen .lsec-name{font-family:var(--f-display);font-style:italic;font-size:23px;color:var(--ink-800);white-space:nowrap;flex:none;}
.atlas-screen .lsec.gentle .lsec-name{color:var(--gentle);}
.atlas-screen .lsec-sub{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-400);margin-left:auto;}
.atlas-screen .empty{padding:54px 8px;color:var(--ink-400);font-family:var(--f-mono);font-size:13px;letter-spacing:.04em;}

/* ── Direction B · Compendium list ─────────────────────────── */
.atlas-screen .dir-b.lsec-body{display:flex;flex-direction:column;margin-top:12px;}
.atlas-screen .dir-b.lsec-body.gentle{background:var(--gentle-bg);border:1px solid color-mix(in oklch,var(--gentle) 22%,var(--ink-200));border-radius:14px;padding:4px 4px;}
.atlas-screen .crow{display:flex;align-items:center;gap:16px;padding:15px 14px;border-top:1px solid var(--ink-200);text-align:left;width:100%;transition:.14s;position:relative;}
.atlas-screen .dir-b.lsec-body > .crow:first-child{border-top:0;}
.atlas-screen .crow:hover{background:color-mix(in oklch,var(--c-accent) 5%,transparent);}
.atlas-screen .crow::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:2px;background:var(--bandc);opacity:0;transition:.14s;}
.atlas-screen .crow:hover::before{opacity:1;}
.atlas-screen .crow.gentle::before{background:var(--gentle);opacity:.5;}
.atlas-screen .crow-rank{flex:none;width:26px;font-family:var(--f-mono);font-size:13px;color:var(--ink-400);text-align:center;}
.atlas-screen .crow-ico{flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;}
.atlas-screen .crow-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:5px;}
.atlas-screen .crow-top{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;}
.atlas-screen .crow-name{font-family:var(--f-display);font-size:23px;line-height:1.02;color:var(--ink-900);}
.atlas-screen .crow-eg{font-family:var(--f-display);font-style:italic;font-size:14.5px;color:var(--ink-500);}
.atlas-screen .crow-sub{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.atlas-screen .crow-evi{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-400);}
.atlas-screen .cx-clash{font-family:var(--f-mono);font-size:10px;letter-spacing:.03em;text-transform:uppercase;color:var(--avoid);}
.atlas-screen .crow-right{flex:none;display:flex;align-items:center;gap:14px;}
.atlas-screen .crow-chev{color:var(--ink-300);display:grid;place-items:center;} .atlas-screen .crow:hover .crow-chev{color:var(--c-accent);}

/* ── Home ──────────────────────────────────────────────────── */
.atlas-screen .home-sec{margin-top:48px;}
.atlas-screen .home-sec-head{display:flex;align-items:baseline;gap:14px;margin-bottom:18px;flex-wrap:wrap;}
.atlas-screen .hs-name{font-family:var(--f-display);font-style:italic;font-size:26px;color:var(--ink-800);}
.atlas-screen .hs-sub{font-size:13.5px;color:var(--ink-500);margin-left:auto;text-align:right;max-width:42ch;}

/* body atlas */
.atlas-screen .atlas-hero{display:grid;grid-template-columns:minmax(260px,0.82fr) minmax(320px,1fr);gap:36px;align-items:start;}
.atlas-screen .atlas-map{position:relative;background:radial-gradient(120% 90% at 50% 8%,color-mix(in oklch,var(--c-accent) 9%,var(--bone)),var(--bone) 70%);border:1px solid var(--ink-200);border-radius:20px;padding:30px 24px 24px;}
.atlas-screen .map-cap{font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-400);text-align:center;margin-bottom:6px;}
.atlas-screen .atlas-map svg{display:block;width:100%;height:auto;max-height:540px;overflow:visible;}
.atlas-screen .map-fig{fill:color-mix(in oklch,var(--ink-300) 36%,var(--paper));}
.atlas-screen .ail-pin{cursor:pointer;outline:none;}
.atlas-screen .ail-halo{fill:var(--c-accent);opacity:0;transition:opacity .15s;}
.atlas-screen .ail-dot{fill:var(--paper);stroke:var(--c-accent);stroke-width:2;transition:r .15s,stroke-width .15s;}
.atlas-screen .ail-pin:hover .ail-halo,.atlas-screen .ail-pin.hot .ail-halo,.atlas-screen .ail-pin:focus-visible .ail-halo{opacity:.20;}
.atlas-screen .ail-pin:hover .ail-dot,.atlas-screen .ail-pin.hot .ail-dot,.atlas-screen .ail-pin:focus-visible .ail-dot{r:8;stroke-width:2.6;}
.atlas-screen .map-tip{position:absolute;transform:translate(-50%,-100%);padding:5px 10px;border-radius:7px;background:var(--ink-900);color:var(--paper);font-family:var(--f-mono);font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s;z-index:5;box-shadow:0 6px 18px -8px rgba(0,0,0,.4);}
.atlas-screen .map-tip::after{content:"";position:absolute;left:50%;top:100%;transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--ink-900);}
.atlas-screen .map-tip.show{opacity:1;}
.atlas-screen .atlas-index{display:flex;flex-direction:column;gap:22px;}
.atlas-screen .reg-head{display:flex;align-items:baseline;gap:10px;padding-bottom:7px;border-bottom:1.5px solid var(--ink-300);margin-bottom:3px;flex-wrap:nowrap;}
.atlas-screen .reg-name{font-family:var(--f-display);font-style:italic;font-size:20px;color:var(--ink-700);white-space:nowrap;}
.atlas-screen .reg-count{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-400);margin-left:auto;white-space:nowrap;}
.atlas-screen .ail-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:10px 8px;border-radius:9px;transition:background .12s;border-top:1px solid transparent;}
.atlas-screen .ail-row:hover,.atlas-screen .ail-row.hot{background:color-mix(in oklch,var(--c-accent) 7%,transparent);}
.atlas-screen .ail-dot-sm{width:9px;height:9px;border-radius:50%;flex:none;background:var(--c-accent);opacity:.45;transition:opacity .12s;}
.atlas-screen .ail-row:hover .ail-dot-sm,.atlas-screen .ail-row.hot .ail-dot-sm{opacity:1;}
.atlas-screen .ail-name{font-family:var(--f-display);font-size:21px;line-height:1.05;color:var(--ink-900);flex:1;}
.atlas-screen .ail-start{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-500);white-space:nowrap;}
.atlas-screen .ail-arrow{color:var(--ink-300);display:grid;place-items:center;flex:none;} .atlas-screen .ail-row:hover .ail-arrow,.atlas-screen .ail-row.hot .ail-arrow{color:var(--c-accent);}
@media (max-width:1180px){ .atlas-screen .ail-start{display:none;} }
.atlas-screen .cond-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.atlas-screen .cond-card{text-align:left;background:var(--paper);border:1px solid var(--ink-200);border-radius:17px;padding:22px 22px 18px;display:flex;flex-direction:column;gap:9px;transition:.14s;box-shadow:0 2px 10px -8px color-mix(in oklch,var(--ink-950) 30%,transparent);width:100%;}
.atlas-screen .cond-card:hover{border-color:color-mix(in oklch,var(--c-accent) 40%,var(--ink-200));transform:translateY(-2px);box-shadow:0 14px 30px -18px color-mix(in oklch,var(--ink-950) 50%,transparent);}
.atlas-screen .cond-card.hero{background:color-mix(in oklch,var(--c-accent) 5%,var(--paper));}
.atlas-screen .cc-top{display:flex;align-items:center;justify-content:space-between;}
.atlas-screen .cc-area{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-400);}
.atlas-screen .cc-deep{font-family:var(--f-mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--gentle);border:1px solid color-mix(in oklch,var(--gentle) 35%,var(--ink-200));border-radius:5px;padding:1px 6px;}
.atlas-screen .cond-card.hero .cc-deep{color:var(--c-accent);border-color:color-mix(in oklch,var(--c-accent) 35%,var(--ink-200));}
.atlas-screen .cc-name{font-family:var(--f-display);font-size:30px;line-height:1.02;color:var(--ink-900);}
.atlas-screen .cc-aka{font-family:var(--f-display);font-style:italic;font-size:15px;color:var(--ink-500);}
.atlas-screen .cc-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;padding-top:13px;border-top:1px solid var(--ink-200);}
.atlas-screen .cc-gentle{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-600);} .atlas-screen .cc-gentle b{color:var(--ink-900);font-weight:600;}
.atlas-screen .cc-count{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--c-accent);white-space:nowrap;}
.atlas-screen .sys-link{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--c-accent);border:1px solid color-mix(in oklch,var(--c-accent) 30%,var(--ink-200));border-radius:9999px;padding:9px 16px;background:var(--paper);transition:.14s;}
.atlas-screen .sys-link:hover{background:color-mix(in oklch,var(--c-accent) 7%,var(--paper));border-color:var(--c-accent);text-decoration:none;}

.atlas-screen .foot-disc{margin-top:44px;font-family:var(--f-mono);font-size:10.5px;line-height:1.6;letter-spacing:.03em;color:var(--ink-400);text-transform:uppercase;border-top:1px solid var(--ink-200);padding-top:16px;text-wrap:pretty;}

/* ── Drawers (appended to body, tagged .atlas-screen) ──────── */
.atlas-screen.scrim{position:fixed;inset:0;z-index:1200;background:color-mix(in oklch,var(--ink-950) 44%,transparent);opacity:0;pointer-events:none;transition:opacity .26s ease;}
.atlas-screen.scrim.show{opacity:1;pointer-events:auto;}
.atlas-screen.drawer{position:fixed;top:0;right:0;z-index:1300;height:100vh;width:min(560px,94vw);background:var(--paper);border-left:1px solid var(--ink-200);box-shadow:-30px 0 70px -24px color-mix(in oklch,var(--ink-950) 50%,transparent);transform:translateX(102%);transition:transform .36s cubic-bezier(.16,1,.3,1);display:flex;flex-direction:column;overflow:hidden;font-family:var(--f-sans);color:var(--ink-900);}
.atlas-screen.drawer.show{transform:translateX(0);}
.atlas-screen .drawer-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px;border-bottom:1px solid var(--ink-200);flex:none;}
.atlas-screen .dt-eyebrow{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--c-accent);}
.atlas-screen .drawer-close{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;color:var(--ink-500);flex:none;} .atlas-screen .drawer-close:hover{background:var(--ink-100);color:var(--ink-900);}
.atlas-screen .drawer-body{overflow-y:auto;padding:28px 30px 64px;flex:1;}
.atlas-screen .fo-head{display:flex;align-items:flex-start;gap:16px;}
.atlas-screen .fo-ico{flex:none;width:62px;height:62px;border-radius:16px;display:grid;place-items:center;}
.atlas-screen .fo-name{font-family:var(--f-display);font-weight:400;font-size:36px;line-height:1;color:var(--ink-900);margin:0;}
.atlas-screen .fo-eg{font-family:var(--f-display);font-style:italic;font-size:17px;color:var(--ink-500);margin-top:5px;}
.atlas-screen .fo-tags{display:flex;gap:10px;align-items:center;margin-top:13px;flex-wrap:wrap;}
.atlas-screen .fo-band{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:#fff;padding:4px 11px;border-radius:9999px;}
.atlas-screen .fo-actions{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap;}
.atlas-screen .fo-sec{margin-top:28px;}
.atlas-screen .fo-sec h4{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-500);margin:0 0 12px;}
.atlas-screen .fo-p{font-size:16px;line-height:1.62;color:var(--ink-800);margin:0;text-wrap:pretty;} .atlas-screen .fo-p.soft{color:var(--ink-500);font-size:14px;}
.atlas-screen .fo-evi{display:flex;gap:16px;align-items:center;padding:16px 18px;border-radius:12px;border:1px solid var(--ink-200);background:var(--bone);flex-wrap:wrap;}
.atlas-screen .fo-evi .ev-grade{font-family:var(--f-display);font-size:34px;line-height:1;}
.atlas-screen .fo-links{display:flex;flex-wrap:wrap;gap:8px;}
.atlas-screen .fo-drug{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--c-accent);background:color-mix(in oklch,var(--c-accent) 8%,var(--paper));border:1px solid color-mix(in oklch,var(--c-accent) 26%,var(--ink-200));border-radius:9999px;padding:6px 13px;transition:.12s;}
.atlas-screen .fo-drug:hover{background:color-mix(in oklch,var(--c-accent) 14%,var(--paper));text-decoration:none;}
.atlas-screen .ff-grid{display:flex;flex-direction:column;gap:1px;border:1px solid var(--ink-200);border-radius:12px;overflow:hidden;}
.atlas-screen .ff-row{display:flex;align-items:center;gap:12px;padding:11px 15px;background:var(--paper);} .atlas-screen .ff-row:nth-child(even){background:var(--bone);}
.atlas-screen .ff-dot{width:9px;height:9px;border-radius:50%;flex:none;} .atlas-screen .ff-name{font-size:14px;color:var(--ink-700);}
.atlas-screen .ff-val{margin-left:auto;font-size:13.5px;color:var(--ink-900);font-weight:500;text-align:right;}
.atlas-screen .fo-inter{display:flex;flex-direction:column;gap:10px;}
.atlas-screen .fo-irow{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;padding:13px 16px;border-radius:12px;background:var(--bone);border:1px solid var(--ink-200);}
.atlas-screen .fo-tier{font-family:var(--f-mono);font-size:10.5px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:#fff;padding:4px 10px;border-radius:9999px;white-space:nowrap;}
.atlas-screen .fo-iwith{font-weight:600;font-size:14px;color:var(--ink-900);} .atlas-screen .fo-inote{font-size:13.5px;line-height:1.5;color:var(--ink-700);margin-top:3px;}
.atlas-screen .refs{display:flex;flex-direction:column;gap:8px;} .atlas-screen .ref{display:flex;gap:11px;align-items:baseline;font-size:13.5px;color:var(--ink-700);}
.atlas-screen .ref-n{flex:none;width:20px;height:20px;border-radius:6px;display:grid;place-items:center;background:color-mix(in oklch,var(--c-accent) 12%,var(--paper));color:var(--c-accent);font-family:var(--f-mono);font-size:11px;}
.atlas-screen .fo-disc{margin-top:32px;font-family:var(--f-mono);font-size:10.5px;line-height:1.6;letter-spacing:.03em;color:var(--ink-400);text-transform:uppercase;border-top:1px solid var(--ink-200);padding-top:16px;}
.atlas-screen .btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;padding:11px 16px;border-radius:9999px;border:1px solid var(--ink-200);background:var(--paper);color:var(--ink-800);transition:.14s;}
.atlas-screen .btn:hover{border-color:var(--ink-300);} .atlas-screen .btn.primary,.atlas-screen .btn[aria-pressed="true"]{background:var(--c-accent);color:var(--paper);border-color:var(--c-accent);}
.atlas-screen .rd-empty{color:var(--ink-400);font-family:var(--f-mono);font-size:13px;line-height:1.6;padding:34px 2px;}
.atlas-screen .rd-row{display:flex;align-items:center;gap:14px;padding:14px 4px;border-top:1px solid var(--ink-200);width:100%;text-align:left;cursor:pointer;} .atlas-screen .rd-row:first-child{border-top:0;}
.atlas-screen .rd-row:hover{background:color-mix(in oklch,var(--c-accent) 5%,transparent);}
.atlas-screen .rd-ico{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;}
.atlas-screen .rd-name{font-family:var(--f-display);font-size:21px;color:var(--ink-900);}
.atlas-screen .rd-sub{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-400);margin-top:2px;}
.atlas-screen .rd-x{margin-left:auto;flex:none;width:30px;height:30px;border-radius:7px;display:grid;place-items:center;color:var(--ink-300);} .atlas-screen .rd-x:hover{color:var(--avoid);background:color-mix(in oklch,var(--avoid) 8%,transparent);}

/* ── My-list badge on the in-screen header ─────────────────── */
.atlas-screen .atlas-bar{display:flex;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap;}
.atlas-screen .atlas-bar .spacer{flex:1;}
.atlas-screen .saved-btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-600);border:1px solid var(--ink-200);background:var(--paper);border-radius:9999px;padding:8px 14px;transition:.14s;}
.atlas-screen .saved-btn:hover{border-color:var(--c-accent);color:var(--c-accent);}
.atlas-screen .rd-badge{display:inline-grid;place-items:center;min-width:16px;height:16px;padding:0 5px;border-radius:9999px;background:var(--c-accent);color:var(--paper);font-family:var(--f-mono);font-size:9.5px;}

/* ── density (optional, not wired to a toggle yet) ─────────── */
.atlas-screen[data-density="compact"]{--row-pad-y:12px;}
.atlas-screen[data-density="compact"] .crow-name{font-size:21px;}

/* ── reduced motion ────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  .atlas-screen *,.atlas-screen.drawer,.atlas-screen.scrim{transition:none!important;}
}

/* ── responsive ────────────────────────────────────────────── */
@media (max-width:1080px){
  .atlas-screen .layout{grid-template-columns:1fr;}
  .atlas-screen .sidebar{flex-direction:row;flex-wrap:wrap;border-right:0;border-bottom:1px solid var(--ink-200);}
  .atlas-screen .figure-wrap{width:240px;} .atlas-screen .mymeds{flex:1;min-width:260px;}
  .atlas-screen .cond-grid{grid-template-columns:1fr;}
  .atlas-screen .atlas-hero{grid-template-columns:1fr;}
  .atlas-screen .title{font-size:48px;} .atlas-screen .feat{grid-template-columns:1fr;}
}
@media (max-width:680px){
  .atlas-screen .main{padding:26px 18px 90px;}
  .atlas-screen .head-meta{display:none;}
}