:root{color-scheme:dark;--bg:#031222;--panel:#042034;--edge:#137d9c;--cyan:#29dcf4;--muted:#afcbdf;--pink:#e397e8}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 80% 0,#08254a 0,transparent 50%),var(--bg);color:#edf6ff;font:14px/1.45 "Segoe UI",Arial,sans-serif}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button,select{color:inherit;border:1px solid #267b9a;background:linear-gradient(#073049,#041b2c);border-radius:7px}button{padding:8px 12px;cursor:pointer}button:hover{border-color:var(--cyan);background:#0b3850}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #ffda79;outline-offset:3px}a{color:#6ceaff;text-decoration:none}a:hover{text-decoration:underline}input[type=range]{accent-color:var(--cyan);width:100%;min-height:28px;cursor:pointer}input[type=checkbox]{accent-color:var(--cyan)}select{padding:7px;min-width:0;max-width:100%}h1,h2,h3,p{margin:0}h2{font-size:22px;line-height:1.2}h3{font-size:15px;margin:12px 0 7px}p{margin:9px 0}strong{font-weight:650}[hidden]{display:none!important}.skip{position:absolute;left:10px;top:-60px;z-index:30;background:#052035;padding:10px}.skip:focus{top:10px}header{height:59px;border-bottom:1px solid #146882;display:flex;align-items:center;gap:20px;padding:0 2.3%;background:#011525e8}header .brand img{display:block;width:210px;height:49px;object-fit:contain}header nav{display:flex;gap:25px;flex:1}header nav a{color:#e7f6ff;font-size:13px}header nav a:nth-child(2){color:var(--cyan)}header button{border:0;background:transparent;font-size:23px;padding:6px}main{max-width:1660px;margin:auto;padding:0 20px 90px}.breadcrumbs{font-size:11px;margin:12px 0;display:flex;gap:9px;flex-wrap:wrap}.hero{min-height:168px;position:relative;padding:6px 0 12px;background:linear-gradient(90deg,#031222 0%,#031222ed 30%,#03122266 58%,transparent),url('assets/hero.webp') right center/auto 100% no-repeat}.eyebrow{color:#74dcff;font-size:12px;letter-spacing:.1em}.hero h1{font-size:38px;line-height:1.18;max-width:1000px;letter-spacing:-.8px;margin:4px 0 8px}.lead{max-width:760px;font-size:17px;line-height:1.3}.badges{display:flex;gap:10px;margin-top:11px}.badges span{border:1px solid #9a6be2;border-radius:22px;background:#321c4c80;padding:4px 16px;font-size:12px}.badges span:first-child{border-color:#00dca7;background:#003b3880}.tabs{display:grid;grid-template-columns:1.15fr 1fr 1fr 1fr;gap:4px;margin:0 0 10px}.tabs button{border-color:#126b8b;border-radius:8px;height:46px;font-size:15px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:12px}.tabs button>span{font-size:28px}.tabs [aria-selected=true]{color:#002436;background:linear-gradient(100deg,#15cae6,#05728c);box-shadow:inset 0 0 12px #31efffaa,0 0 12px #00c6ec3b;border-color:#4aeeff}.panel{border:1px solid var(--edge);border-radius:11px;background:linear-gradient(130deg,#062c42aa,#031728e8);overflow:hidden}.anatomy-grid{display:grid;grid-template-columns:270px minmax(0,1fr) 490px;gap:8px}.anatomy-grid>aside,.body-panel{height:510px}.glands{padding:6px}.glands summary{font-size:14px;font-weight:700;list-style:none;padding:2px 7px 8px}.glands details>div{display:grid;gap:5px}.glands button{height:53px;padding:3px 8px;display:flex;align-items:center;gap:10px;text-align:left;border-color:#15536b;background:#041d2e}.glands button svg{width:43px;height:43px;flex:0 0 43px;fill:currentColor;fill-opacity:.15;stroke:currentColor;stroke-width:2;filter:drop-shadow(0 0 6px currentColor)}.glands button small{font-size:11px;color:var(--muted);display:block;line-height:1.2}.glands button strong{font-size:13px;display:block;line-height:1.2}.glands button[aria-pressed=true]{border-color:#28e4f5;background:linear-gradient(90deg,#0c5774,#042638);box-shadow:inset 0 0 10px #12dffb70}.body-panel{position:relative;display:flex;flex-direction:column}.scene-tools{display:flex;gap:5px;padding:7px;align-items:center;z-index:3}.scene-tools label{font-size:10px;display:flex;gap:7px;align-items:center;flex:1}.scene-tools select{font-size:11px}.scene-tools button{padding:5px 7px;font-size:11px}.model-wrap{position:relative;flex:1;min-height:0;background:radial-gradient(ellipse at 50% 45%,#0c417b65,transparent 66%)}.body-scene{position:absolute;inset:0;overflow:hidden;touch-action:none}.body-scene canvas{display:block;width:100%;height:100%;touch-action:none}.body-scene canvas:focus-visible{outline-offset:-4px}.zoom-tools{position:absolute;left:8px;bottom:8px;display:grid;gap:3px;z-index:4}.zoom-tools button{width:32px;height:32px;padding:0;font-size:21px}.display-tools{padding:5px 9px;display:flex;gap:12px;align-items:center;font-size:10px;border-top:1px solid #0c455b}.display-tools>label:first-child{display:flex;align-items:center;gap:7px;flex:1}.display-tools input[type=range]{width:70px}.display-tools label{white-space:nowrap}#scene-caption{font-size:9px;color:#b9dbed;padding:0 8px;margin:1px 0 5px}#scene-status{position:absolute;inset:40% 10%;text-align:center;color:#9be7ff;pointer-events:none}.model-callouts{position:absolute;inset:0;pointer-events:none;overflow:hidden}.model-callouts>svg{position:absolute;inset:0;width:100%;height:100%}.model-label{position:absolute;pointer-events:auto;max-width:140px;background:#02152b9c;border:0;font-size:11px;line-height:1.1;padding:4px 5px;text-shadow:0 1px 4px #00101e}.model-label.left{left:4px;text-align:left}.model-label.right{right:4px;text-align:right}.model-label:hover{background:#0b435c}.organ-panel{padding:10px 12px;overflow:auto;scrollbar-width:thin;scrollbar-color:#21799b #031424}.organ-top{display:grid;grid-template-columns:1fr 140px;gap:10px}.organ-top h2{font-size:23px}.organ-top p{font-size:12px;line-height:1.35}#preview-button{padding:0;overflow:hidden;font-size:9px;background:#03203c}#organ-preview{display:block;width:100%;height:108px;object-fit:contain}#preview-button span{display:block;border-top:1px solid #1c5a77;padding:2px}.organ-panel>p{font-size:12px;line-height:1.4}.hormone-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.hormone-card{padding:7px;border:1px solid #1c76ab;border-radius:9px;background:linear-gradient(130deg,#14395b,#06223e);font-size:10px}.hormone-card strong{display:block;color:#bcf3ff;font-size:11px;margin-bottom:5px}.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:6px}.info-grid>section{border:1px solid #164d68;border-radius:9px;padding:5px 8px}.info-grid h3{margin:0 0 4px}.info-grid ul{list-style:none;margin:0;padding:0;font-size:11px}.info-grid li{margin:5px 0;padding-left:14px;position:relative}.info-grid li:before{content:'✓';position:absolute;left:0;color:#4ff1c9}.takeaway{background:linear-gradient(100deg,#07516b70,#04314477);border:1px solid #136b86;border-radius:8px;padding:10px;font-size:13px;line-height:1.4}.takeaway strong{display:block;color:#6cf3f3;margin-bottom:5px}.quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:10px 0 18px}.quick{display:flex;flex-direction:column;gap:8px;align-items:stretch;text-align:left;padding:11px;min-width:0;transition:translate .18s,border-color .18s}.quick:hover{translate:0 -2px}.quick>strong{display:flex;align-items:center;gap:8px;font-size:16px;white-space:normal;line-height:1.2}.quick>strong>b{border:1px solid var(--cyan);border-radius:50%;color:var(--cyan);padding:1px 8px;font-weight:500}.quick>strong>span{margin-left:auto;font-size:22px;color:#a3e9ff}.quick>span:not(.quick-visual){font-size:12px}.quick .quick-visual{height:110px;display:flex;overflow:hidden;border-radius:9px;background:#021a32;border:1px solid #1f4b6c}.anatomy-mini img{width:42%;object-fit:cover}.anatomy-mini>span{font-size:11px;padding:10px;line-height:1.5}.quick:nth-child(2){border-color:#307cba}.quick:nth-child(3){border-color:#337cc7}.quick:nth-child(4){border-color:#8062b0}.quick em{font-style:normal;font-size:13px;text-align:center;margin-top:auto;padding:8px;border:1px solid #36cce2;border-radius:7px;background:linear-gradient(#0a5576,#073554);color:#aef5ff}.quick:last-child em{border-color:#9c78f1;background:linear-gradient(#3b2874,#251746)}.mini-tasks{display:grid;gap:3px;font-size:11px;padding:0 7px}.mini-progress{display:flex;gap:8px;align-items:center;margin-top:5px}progress{accent-color:var(--cyan);width:65%;height:10px}.quick-visual svg{width:100%;height:100%}.mode-panel{padding:20px;scroll-margin-top:10px}.mode-panel h2{font-size:27px}.mode-panel>p{max-width:1100px}.segmented{display:flex;gap:5px;margin:16px 0}.segmented button{flex:1}.segmented button[aria-pressed=true],.task-tabs button[aria-pressed=true]{border-color:#29dfed;background:#0c526b}.signal-diagram{height:320px;border:1px solid #235c76;border-radius:10px;overflow:hidden;background:radial-gradient(ellipse,#0d3e62,#021526)}.signal-diagram svg{height:100%;width:100%}.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:14px 0}.toolbar>label{font-size:12px;display:flex;gap:10px;align-items:center;margin-left:14px;max-width:420px}.toolbar input{width:160px}.primary{border-color:#39ddec;background:linear-gradient(#0babc3,#075b7c);font-weight:650}.cell-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0}.cell-options button{display:flex;align-items:center;gap:10px;text-align:left}.cell-options button>span{font-size:45px;color:#c9a3ff}.cell-options button[aria-pressed=true]{outline:2px solid #d0a0ff;outline-offset:1px}.experiment-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:22px;margin-top:18px}.presets{display:flex;gap:5px;flex-wrap:wrap}.presets button{font-size:12px}.control{display:grid;grid-template-columns:1.1fr 1fr 40px;gap:12px;align-items:center;margin:18px 0;font-size:13px}.control output{color:var(--cyan);font-weight:700}.graph{border:1px solid #1a6481;border-radius:10px;background:#021b30;overflow:hidden}.graph svg{width:100%;height:auto;display:block}.legend{display:flex;gap:18px;font-size:12px;flex-wrap:wrap;margin:10px 0}.legend span:before{content:'━ ';color:var(--series-color)}.regulation-scheme{min-height:120px}.regulation-scheme svg{width:100%;height:150px}.time-control{display:block;font-size:12px}.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0}.metric{border:1px solid #225d75;border-radius:9px;padding:12px;background:#082d42}.metric strong{font-size:27px;color:#52e1ee;display:block}.metric span{font-size:12px}.task-tabs{display:flex;gap:5px;flex-wrap:wrap;margin:17px 0}.task-tabs button{font-size:12px}.task-options{display:grid;gap:8px;margin:16px 0;max-width:850px}.task-options label{padding:14px;border:1px solid #206581;border-radius:8px;cursor:pointer;display:flex;gap:10px}.task-options input{accent-color:var(--cyan)}.chain{display:grid;gap:7px;padding-left:24px;max-width:900px}.chain li{padding:8px;border:1px solid #23566c;border-radius:6px;background:#073147}.chain li>span{display:inline-block;width:calc(100% - 90px)}.chain button{padding:4px 10px;margin-left:3px}.match-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:18px 0}.match-grid label{display:grid;gap:7px}#task-feedback[data-correct=true],#cell-feedback[data-correct=true]{color:#70edb5}#task-feedback[data-correct=false],#cell-feedback[data-correct=false]{color:#ffc17a}details.educational{padding:14px 18px;margin-top:18px}summary{cursor:pointer;color:#aee9ff}.educational>section{display:inline-block;vertical-align:top;width:48%;padding-right:20px}.lab-nav{display:flex;justify-content:space-between;gap:20px;margin:30px 0}footer{border-top:1px solid #175674;padding:15px 0;font-size:12px;color:#bad8eb}footer details{max-width:1150px}dialog{border:1px solid #309ab8;border-radius:14px;background:#042037;color:#edf6ff;padding:24px;max-width:750px;width:90%;max-height:85dvh;overflow:auto;box-shadow:0 15px 80px #000b}dialog::backdrop{background:#00101bcf}dialog [data-close]{float:right}#storage-notice{color:#ffce91}.fallback-anatomy{width:100%;height:100%;display:block}.fallback-anatomy [role=button]{cursor:pointer}.fallback-anatomy [role=button]:focus{stroke:white;stroke-width:.04}.flowing .hormone-particle{offset-path:path('M120 150C300 180 440 95 680 150');animation:flow 3s linear infinite;animation-delay:var(--delay)}.flowing .signal-response{animation:respond 1.7s ease-in-out infinite}@keyframes flow{from{offset-distance:0%;opacity:.1}20%{opacity:1}to{offset-distance:100%;opacity:.2}}@keyframes respond{50%{opacity:.4}}.paused .hormone-particle,.paused .signal-response{animation-play-state:paused}.signal-zero .hormone-particle{display:none}
@media(max-width:1300px){.anatomy-grid{grid-template-columns:230px minmax(0,1fr) 370px}.organ-top{grid-template-columns:1fr 110px}.organ-top h2{font-size:20px}.hormone-cards{grid-template-columns:1fr}.hormone-card{padding:5px}.hormone-card strong{display:inline;margin-right:5px}.hero h1{font-size:34px}.model-label{font-size:10px;max-width:110px}.glands button strong{font-size:12px}.quick>strong{font-size:14px}.quick .quick-visual{height:95px}}
@media(max-width:1050px){header nav a:last-child{display:none}.anatomy-grid{grid-template-columns:240px 1fr}.organ-panel{grid-column:1/-1;height:auto!important}.hormone-cards{grid-template-columns:repeat(3,1fr)}.organ-top{grid-template-columns:1fr 180px}.organ-top h2{font-size:24px}.organ-top p{font-size:14px}.quick-grid{grid-template-columns:1fr 1fr}.hero .lead{max-width:620px}.experiment-grid{grid-template-columns:1fr}.model-label{font-size:12px;max-width:140px}.cell-options{grid-template-columns:1fr 1fr}}
@media(max-width:700px){body{font-size:14px}main{padding:0 11px 100px}header{height:55px;gap:6px;padding:0 10px}header .brand img{width:155px;height:42px}header nav{justify-content:end;gap:10px}header nav a{font-size:11px}header nav a:first-child,header nav a:nth-child(3){display:none}header button{font-size:21px}.breadcrumbs{font-size:10px;margin:9px 0;gap:5px}.hero{min-height:240px;padding-bottom:10px;background-position:right bottom;background-size:auto 100%}.hero h1{font-size:31px;margin-top:8px;max-width:440px}.lead{font-size:14px;max-width:400px;background:#03122266}.badges{gap:6px;flex-wrap:wrap}.badges span{font-size:10px;padding:4px 10px}.tabs{grid-template-columns:1fr 1fr;gap:4px}.tabs button{height:48px;font-size:11px;gap:6px;padding:6px}.tabs button>span{font-size:22px}.anatomy-grid{display:flex;flex-direction:column;gap:8px}.body-panel{order:0;height:490px}.glands{order:1;height:auto!important}.organ-panel{order:2;max-height:750px}.glands summary{padding:6px 8px}.glands details>div{grid-template-columns:1fr 1fr}.glands button{height:65px;gap:6px}.glands button svg{width:30px;height:35px;flex-basis:30px}.glands button strong{font-size:11px}.glands button small{font-size:9px}.scene-tools{gap:4px}.scene-tools label{display:grid;gap:1px;font-size:9px}.scene-tools button{font-size:10px}.display-tools{gap:7px;font-size:9px}.display-tools>label:first-child{display:grid;gap:0}.display-tools input[type=range]{width:85px}.model-label{max-width:106px;font-size:10px;line-height:1.15}.organ-top{grid-template-columns:1fr 112px}.organ-top h2{font-size:22px}.organ-top p{font-size:12px}.organ-panel>p{font-size:13px}.hormone-cards{grid-template-columns:1fr}.hormone-card{font-size:12px;padding:8px}.hormone-card strong{font-size:13px}.info-grid{grid-template-columns:1fr 1fr}.info-grid ul{font-size:12px}.quick-grid{grid-template-columns:1fr}.quick>strong{font-size:17px}.quick .quick-visual{height:150px}.quick>span:not(.quick-visual){font-size:13px}.anatomy-mini>span{font-size:14px;padding-top:20px}.quick em{font-size:14px}.mode-panel{padding:14px 11px}.mode-panel h2{font-size:24px}.segmented{gap:4px;flex-wrap:wrap}.segmented button{flex:1 1 40%;font-size:12px;padding:10px 5px}.signal-diagram{height:230px}.toolbar>label{margin-left:0;display:grid;flex:1 1 100%;max-width:100%}.toolbar input{width:100%}.cell-options button{display:block;font-size:12px}.cell-options button>span{display:block;font-size:32px}.control{grid-template-columns:1fr 1fr 33px;gap:8px;font-size:12px;margin:17px 0}.metrics{grid-template-columns:1fr 1fr}.metric strong{font-size:24px}.match-grid{grid-template-columns:1fr}.task-tabs button{flex:1 1 30%;font-size:10px;padding:7px 4px}.educational>section{display:block;width:100%;padding:0}.lab-nav{font-size:12px}dialog{width:94%;padding:18px}.chain li>span{width:calc(100% - 85px);font-size:12px}.model-wrap{min-height:350px}.hero .eyebrow{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.hero .eyebrow{margin:0 0 4px}.hero h1{margin-top:0}.hero{min-height:156px}.zoom-tools{left:auto;right:8px}#gland-structure svg{width:100%;height:105px}.flowing .nuclear-particle{offset-path:path("M690 150L720 154L750 157L775 160");animation:flow 2s linear infinite}.paused .nuclear-particle{animation-play-state:paused}

/* Controls overlay the scene so the anatomical reference uses the full panel. */
.body-panel{display:block}.body-panel .model-wrap{position:absolute;inset:0;min-height:0}.scene-tools{position:absolute;top:2px;left:0;right:0;z-index:5;background:linear-gradient(#042337df,#04233740);border-radius:10px 10px 0 0}.scene-tools .zoom-tools{position:static;display:flex;gap:3px}.scene-tools .zoom-tools button{width:27px;height:28px;font-size:20px}.display-tools{position:absolute;bottom:16px;left:0;right:0;z-index:4;background:#032134b8}#scene-caption{position:absolute;bottom:0;left:0;right:0;z-index:4;background:#031b2cc9;font-size:8px;line-height:1.2;margin:0;padding:2px 8px}@media(max-width:700px){.scene-tools{display:grid;grid-template-columns:1fr auto auto}.scene-tools .zoom-tools{position:absolute;top:43px;right:7px}.scene-tools .zoom-tools button{width:27px}.display-tools{bottom:24px}#scene-caption{min-height:22px}.body-panel{height:510px}}

.quick:hover #signal-mini .hormone-particle,.quick:focus-visible #signal-mini .hormone-particle{animation-play-state:running}
