/* Native scrolling explains relationships in three readable chapters.
   Optional playback and chapter controls live in a closed disclosure.
   No looping decoration, animated dimensions or paint effects. */
.biomarker-visual{margin-block:42px 46px;scroll-margin-top:28px;--visual-motion:cubic-bezier(.65,0,.35,1);--visual-press:cubic-bezier(.22,1,.36,1)}
.biomarker-visual>.eyebrow{margin-bottom:10px}
.biomarker-visual .visual-intro{font-size:18px;line-height:1.95;margin-bottom:22px}
.visual-experience{border:1px solid #194d402b;border-radius:16px;overflow:hidden;background:#f1f2e9}
.visual-controls{padding:14px;border-bottom:1px solid #194d4021;background:#ffffff70}
.visual-step-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.visual-step-button{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--forest);padding:10px 12px;min-height:64px;text-align:start;font-size:12px;font-weight:500;line-height:1.65;transition:transform 140ms var(--visual-press)}
.visual-step-button>span{font-size:11px;line-height:1.4;font-variant-numeric:tabular-nums;opacity:.7}
.visual-step-button[aria-pressed=true]{background:var(--forest);color:white}
.visual-step-button:focus-visible,.visual-play-button:focus-visible{outline:2px solid var(--forest);outline-offset:3px}
.visual-step-button:active,.visual-play-button:active{transform:scale(.97)}
.visual-figure{margin:0}
.visual-stage{position:relative;isolation:isolate;overflow:hidden;background:#f3f2e9;direction:ltr}
.visual-svg{display:block;width:100%;height:auto}
.visual-svg text{fill:#335647;font:500 20px 'IBM Plex Sans Arabic',sans-serif;direction:ltr}
.visual-compartment,.visual-organ{position:absolute;color:#42604e;font-size:12px;font-weight:500;line-height:1.65;max-width:34%;pointer-events:none}
.visual-compartment{left:22px;padding:4px 10px;border:1px solid #194d4026;border-radius:20px;background:#f8f7f27d;max-width:62%}
.visual-compartment-blood{top:17px}.visual-compartment-cell{bottom:17px}
.visual-organ{left:4%;max-width:26%;text-align:center;background:#f3f2e9d9;padding:3px 6px;border-radius:4px}
.visual-organ-pituitary{top:19%}.visual-organ-thyroid{top:70%}
[dir=rtl] .visual-compartment,[dir=rtl] .visual-organ{direction:rtl}
.visual-legend{list-style:none;padding:20px 22px 0;margin:0;display:flex;flex-wrap:wrap;gap:10px 22px;border-top:1px solid #194d401c;background:#f8f7f2}
.visual-legend li{display:flex;align-items:center;gap:8px;font-size:12px;line-height:1.75;color:#395746;min-width:0}
.visual-key{display:inline-block;flex-shrink:0;width:13px;height:13px;border:1.5px solid #557b5c;background:#dce6cc;border-radius:3px}
.visual-key-insulin{border-radius:50% 40% 50% 30%;background:#e9a07a;border-color:#a25f40;transform:rotate(25deg)}
.visual-key-glucose{background:#f1cd84;border-color:#98733a;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.visual-key-receptor{background:transparent;border-width:0 3px 3px;border-color:#725940;border-radius:0 0 6px 6px}
.visual-key-glut4{background:linear-gradient(90deg,#35665a 0 35%,transparent 35% 65%,#35665a 65%);border:0;border-radius:3px}
.visual-key-blood{background:#f0e6d7;border-color:#c0b095}.visual-key-cell{background:#e0e8d5;border-color:#97a587}
.visual-key-sample{height:4px;background:#315b48;border:0;border-radius:1px}.visual-key-field{width:8px;height:8px;margin-inline:2px;background:#607958;border:0;border-radius:50%}
.visual-key-bands{background:linear-gradient(90deg,#315b48 0 20%,transparent 20% 40%,#315b48 40% 60%,transparent 60% 80%,#315b48 80%);border:0;border-radius:0}
.visual-key-pituitary{background:#edc5ac;border-color:#a47457;border-radius:7px}.visual-key-tsh{background:#b4c796;border-color:#567141;border-radius:50%}.visual-key-thyroid{background:#ccad87;border-color:#9b7953;border-radius:50% 30%}
.visual-key-t4{background:#618472;border-color:#345a48;transform:rotate(45deg);border-radius:1px;width:11px;height:11px;margin-inline:1px}.visual-key-feedback{background:none;border-color:#987044;border-radius:50%;position:relative}.visual-key-feedback:after{position:absolute;content:'';height:1px;background:#987044;inset:5px 2px}
.visual-key-total{background:none;border-color:#476c58}.visual-key-free{background:#e9b689;border-color:#9e6843;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}.visual-key-albumin{border-radius:8px 4px;background:#b9cda1}.visual-key-shbg{border-radius:5px;background:#446857;border-color:#365a48}
.visual-figure figcaption{background:#f8f7f2;font-size:12px;line-height:1.9;color:var(--muted);padding:14px 22px 20px}
.visual-playback{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;padding:13px 20px;background:#e8eddf;border-top:1px solid #194d4021}
.visual-play-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:9px 15px;border-radius:24px;border:1px solid #194d404f;background:transparent;color:var(--forest);font-size:12px;font-weight:500;line-height:1.7;transition:transform 140ms var(--visual-press)}
.visual-play-icon{width:12px;height:12px;display:inline-block;position:relative;flex-shrink:0}
.visual-play-icon:before{content:'';position:absolute;inset:1px 0 1px 2px;clip-path:polygon(0 0,100% 50%,0 100%);background:var(--forest)}
[data-playing=true] .visual-play-icon:before{clip-path:none;inset:1px;background:linear-gradient(90deg,var(--forest) 0 35%,transparent 35% 65%,var(--forest) 65%)}
.visual-status{font-size:11px;line-height:1.85;color:#47634e;flex:1;min-width:110px}.visual-reduced-note{display:none;font-size:12px;line-height:1.8;color:var(--muted)}
.biomarker-visual .visual-scope{font-size:12px;line-height:1.9;color:var(--muted);margin:12px 0 24px}
.visual-steps{list-style:none;padding:0;margin:0}
.visual-step-copy{display:grid;grid-template-columns:32px minmax(0,1fr);gap:15px;padding:20px 0;border-top:1px solid var(--line)}
.visual-step-number{display:grid;place-items:center;align-self:start;width:32px;height:32px;background:#e8ecdf;border:1px solid #194d401c;border-radius:50%;font-size:11px;font-variant-numeric:tabular-nums;color:#537046;margin-top:3px}
.visual-step-copy h3{font-size:18px;font-weight:500;line-height:1.8;margin:0 0 7px}.visual-step-copy p{font-size:16px;line-height:1.95;margin:0}
[data-visual-enhanced=true][data-state="0"] [data-visual-copy="0"] .visual-step-number,[data-visual-enhanced=true][data-state="1"] [data-visual-copy="1"] .visual-step-number,[data-visual-enhanced=true][data-state="2"] [data-visual-copy="2"] .visual-step-number{background:var(--forest);color:white;border-color:var(--forest)}
.biomarker-visual .visual-takeaway{padding:20px 23px;background:#e8eddd;border-inline-start:3px solid #89a078;border-radius:0 8px 8px 0;font-size:16px;line-height:1.95;margin:8px 0 0}.visual-takeaway strong{display:block;font-size:12px;margin-bottom:5px;font-weight:600}
[dir=rtl] .visual-takeaway{border-radius:8px 0 0 8px}
.v-move{transition:transform 800ms var(--visual-motion),opacity 180ms ease}.v-fade{transition:opacity 220ms ease}
.v-orbit{stroke:#bfcdb3;stroke-width:1;stroke-dasharray:2 8;opacity:.6}.v-axis,.v-axis-head{stroke:#719360;stroke-width:1.8}.v-pituitary{stroke:#a47457;stroke-width:1.5;fill:#edc5ac}.v-pituitary>path:first-child{stroke-width:5;stroke-linecap:round}.v-thyroid{fill:#d1b18b;stroke:#a2845f;stroke-width:1.5}.v-tsh{fill:#b4c796;stroke:#567141;stroke-width:1.5;transform:translateY(65px)}.v-tsh path{stroke-width:1.5}.v-t4{fill:#618472;stroke:#345a48;stroke-width:1.5;transform:translate(89px,-122px)}.v-feedback{stroke:#987044;stroke-width:1.8}.v-feedback circle{fill:#f3f2e9}.v-feedback-minus{stroke-width:2}.visual-svg .v-science-label{font-size:20px}
[data-state="0"] .v-tsh{transform:translateY(0)}[data-state="0"] .v-t4{opacity:0;transform:translate(0,0)}[data-state="1"] .v-t4{transform:translate(0,0)}[data-state="0"] .v-feedback,[data-state="1"] .v-feedback{opacity:0}
.v-total-bracket{stroke:#57775e;stroke-width:1.5}.v-pool-boundary{fill:#f9f8f288;stroke:#ced7c4;stroke-width:1;stroke-dasharray:3 5}.v-hormone{fill:#e9b689;stroke:#9e6843;stroke-width:1.5}.v-albumin-protein{fill:#b9cda1;stroke:#81966a;stroke-width:1.5}.v-shbg-protein{fill:#446857;stroke:#365a48;stroke-width:1.5}.v-binding-line{stroke:#678254;stroke-width:2.5;stroke-linecap:round}.v-binding-line-dark{stroke:#d8e3c7}.v-free-pool,.v-albumin-pool,.v-shbg-pool{opacity:1}.visual-svg .v-pool-letters{font-size:19px}
.visual-citations{margin-top:10px;font-size:12px;line-height:1.8}
[data-state="1"] .v-albumin-pool,[data-state="1"] .v-shbg-pool{opacity:.35}[data-state="2"] .v-free-pool{opacity:.55}
[data-instant=true] .v-move,[data-instant=true] .v-fade,[data-instant=true] .visual-step-button,[data-instant=true] .visual-play-button{transition:none!important}
[data-reduced-motion=true] .v-move,[data-reduced-motion=true] .v-fade{transition:opacity 100ms ease}
[data-reduced-motion=true] .visual-step-button,[data-reduced-motion=true] .visual-play-button{transition:none}
[data-reduced-motion=true] .visual-step-button:active,[data-reduced-motion=true] .visual-play-button:active{transform:none}
[data-reduced-motion=true] .visual-play-button{display:none}[data-reduced-motion=true] .visual-reduced-note{display:block}
@media(hover:hover) and (pointer:fine){.visual-step-button:not([aria-pressed=true]):hover{background:#e6eadb}.visual-play-button:hover{background:#dae3cc}}
@media(max-width:600px){.biomarker-visual{margin-block:32px}.visual-controls{padding:9px}.visual-step-controls{gap:4px}.visual-step-button{padding:9px 8px;font-size:11px;min-height:70px}.visual-compartment{left:12px;font-size:11px;padding:3px 8px}.visual-compartment-blood{top:10px}.visual-compartment-cell{bottom:10px}.visual-organ{font-size:11px;left:2%;max-width:29%;padding:2px 3px}.visual-legend{padding:16px 16px 0;gap:9px 16px}.visual-legend li{font-size:11px}.visual-figure figcaption{padding:12px 16px 17px;font-size:11px}.visual-playback{padding:10px 14px}.visual-step-copy{gap:11px;grid-template-columns:29px minmax(0,1fr);padding:18px 0}.visual-step-number{width:29px;height:29px}.visual-step-copy h3{font-size:17px}.visual-step-copy p{font-size:16px}.biomarker-visual .visual-takeaway{padding:18px}.visual-experience{border-radius:12px}}
@media(prefers-reduced-motion:reduce){.v-move,.v-fade{transition:opacity 100ms ease}.visual-step-button,.visual-play-button{transition:none}.visual-step-button:active,.visual-play-button:active{transform:none}}
@media print{.visual-controls,.visual-playback{display:none!important}.visual-experience,.visual-step-copy{break-inside:avoid}.v-move,.v-fade{transition:none!important}}

/* The figure and its reading guide share the paper, ink and sage of the atlas. */
.visual-step-button b{font-weight:500}
.feature-visual .biomarker-visual{margin-block:0 68px}
.feature-visual .visual-introduction{max-width:820px;margin-block:0 26px}
.feature-visual .visual-introduction>.eyebrow{margin-bottom:12px}
.feature-visual .visual-introduction h2{font-size:clamp(24px,3vw,36px);font-weight:500;line-height:1.5;margin:0 0 10px;letter-spacing:-.025em}
.feature-visual .visual-intro{font-size:17px;line-height:1.95;margin:0;color:#52624f;max-width:760px}
.feature-visual .visual-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:28px}
.feature-visual .visual-step-copy{grid-template-columns:24px minmax(0,1fr);gap:12px;padding:20px 0 0;border-color:#52664b30}
.feature-visual .visual-step-number{width:24px;height:24px;border-radius:5px;background:#e9ebdd;font:10px/1.5 ui-monospace,monospace}
.feature-visual .visual-step-copy h3{font-size:16px;line-height:1.8;margin:0 0 9px;color:#315b48}
.feature-visual .visual-step-copy p{font-size:14px;line-height:1.95;color:#52624f}
.feature-visual .visual-takeaway{margin-top:30px;background:#e5ead8;border:1px solid #52664b29;border-radius:7px;padding:19px 22px;font-size:15px;line-height:1.9;color:#385538}
.feature-visual .visual-takeaway strong{font-size:11px;color:#49663e}
.feature-visual .visual-citations{font-size:11px;line-height:1.8;color:#637162;margin-top:13px}
.feature-visual .biomarker-visual:not(.anatomy-visual) .visual-experience{max-width:780px;margin-inline:auto}

@media(max-width:700px){.feature-visual .biomarker-visual{margin-block:0 42px}.feature-visual .visual-intro{font-size:15px}.feature-visual .visual-steps{grid-template-columns:1fr;gap:0;margin-top:22px}.feature-visual .visual-step-copy{padding:18px 0}.feature-visual .visual-step-copy p{font-size:15px}.feature-visual .visual-takeaway{margin-top:8px;font-size:14px;padding:18px}}

/* Three-step explainers share the quiet scroll-first controls of the anatomy stories. */
.visual-experience{position:relative;overflow:visible}
.visual-stage{border-radius:15px 15px 0 0}
.visual-control-menu{position:absolute;z-index:8;width:calc(100% - 24px);pointer-events:none;inset-block-start:10px;inset-inline-end:12px}
.visual-control-menu>summary{pointer-events:auto;margin-inline-start:auto;display:grid;place-items:center;width:44px;height:44px;cursor:pointer;list-style:none;color:#315b48;background:#fbfaf4ed;border:1px solid #77856c4d;border-radius:50%;box-shadow:0 2px 8px #304c3a0a}
.visual-control-menu>summary::-webkit-details-marker{display:none}
.visual-control-menu>summary svg{fill:#fbfaf4;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.visual-control-menu>summary:focus-visible,.visual-follow-button:focus-visible{outline:2px solid #315b48;outline-offset:3px}
.visual-control-panel{box-sizing:border-box;pointer-events:auto;position:absolute;inset-block-start:52px;inset-inline-end:0;width:min(420px,100%);max-height:65svh;overflow:auto;overscroll-behavior:contain;border:1px solid #77856c66;border-radius:10px;background:#f8f6ee;box-shadow:0 16px 40px #304c3a26;text-align:start}
.visual-control-title{display:block;padding:15px 18px 0;font-size:12px;font-weight:600;color:#315b48}
.visual-follow-button{display:block;min-height:44px;margin:4px 18px 0;padding:4px 0;font:inherit;font-size:11px;color:#315b48;text-decoration:underline;text-underline-offset:4px;background:none;border:0;cursor:pointer}
.visual-scroll-cue{display:none}
[data-visual-scroll=true] .visual-scroll-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,1fr);gap:32px;align-items:start}
.feature-visual [data-visual-scroll=true] .visual-experience{max-width:none;margin:0;position:sticky;top:16px}
.feature-visual [data-visual-scroll=true] .visual-steps{display:block;margin:0}
.feature-visual [data-visual-scroll=true] .visual-step-copy{min-height:clamp(220px,32vh,320px);min-height:clamp(220px,32svh,320px);align-content:center;padding-block:24px}
[data-visual-scroll=true] .visual-scroll-cue{display:flex;justify-content:space-between;gap:12px;padding:12px 18px;font-size:11px;line-height:1.8;color:#526848;border-top:1px solid #77856c2e;border-radius:0 0 16px 16px;background:#f8f6ee}
[data-visual-following=false] .visual-scroll-cue{visibility:hidden}
.visual-control-menu[hidden],.visual-follow-button[hidden]{display:none!important}
.visual-step-button:active:focus-visible,.visual-play-button:active:focus-visible{transform:none}
@media(max-width:700px){
  [data-visual-scroll=true] .visual-scroll-layout{display:block}
  .feature-visual [data-visual-scroll=true] .visual-experience{top:0;z-index:3;box-shadow:0 12px 18px -18px #304c3a80}
  .feature-visual [data-visual-scroll=true] .visual-step-copy{min-height:clamp(220px,32vh,300px);min-height:clamp(220px,32svh,300px);padding:24px 12px}
  .visual-control-menu{inset-block-start:8px;inset-inline-end:9px}
  .visual-control-panel{width:100%}
}
@media print{.visual-control-menu,.visual-scroll-cue{display:none!important}[data-visual-scroll=true] .visual-scroll-layout{display:block}.feature-visual [data-visual-scroll=true] .visual-experience{position:static}.feature-visual [data-visual-scroll=true] .visual-step-copy{min-height:0}}
