@import url('../biowheel/studio.css?v=1');
:root{--sand:#bcb3df}.stage{background:radial-gradient(ellipse at 50% 46%,#44545d,#253943 58%,#152831)}h1 em,h2 em{color:#c6b9ec}.scene-heading .eyebrow,.inspector-heading .eyebrow{color:#bdc2e6}.scene-heading h1{font-size:clamp(32px,3.1vw,50px)}button[aria-pressed=true]{background:#c0b5db;border-color:#c0b5db;color:#243238}.readout{border-color:#b9a6dc;max-width:195px}.readout b{color:#ddd2fa;font-size:29px}.readout span{font-size:8px;line-height:1.4}.readout small{font-size:7px}.part-label{border-color:#aea0cd}.part-label b{color:#d0bbee}#study-banner{border-left-color:#b5a0df}#study-banner b{color:#d1c1ef}.motion-study{border-color:#b3a1d74a;background:linear-gradient(135deg,#ab9ac31b,transparent)}.metrics b{font-size:19px}.metrics span{font-size:10px}.formula{display:flex;align-items:center;justify-content:space-between;gap:9px;padding:20px 0;font-size:11px;color:#d1c0f0}.formula i{font-style:normal;color:#889ca6}.exposure-paths{padding:20px 0}.path-meter{display:grid;grid-template-columns:36px 1fr 45px;gap:10px;align-items:center;font-size:10px;margin:13px 0}.path-meter i{height:5px;background:#324851;border-radius:3px;overflow:hidden}.path-meter i b{display:block;height:100%;background:var(--color)}.path-meter>span{color:var(--color)}.path-meter output{text-align:right}.playback{flex-wrap:wrap;gap:5px}.playback button{font-size:9px;padding:8px 9px}#view-note{font-size:8px;letter-spacing:.08em}.references a{display:block;padding:5px 0}body[data-mode=micro] #labels{display:none}#lesson .lesson-nav{display:flex;gap:8px}.stage:fullscreen #viewport,.stage:fullscreen #labels{bottom:165px}.study-controls button{font-size:11px}#error[hidden],#loading[hidden]{display:none!important}.callout{font-size:12px;line-height:1.65}.part-detail p{line-height:1.75}.inspector-heading h2{font-size:31px}.stage{min-height:750px}#viewport,#labels{bottom:164px}.viewbar{bottom:178px}.transport{min-height:155px}#view-note{bottom:219px}#study-banner{bottom:218px}.scene-heading{pointer-events:none}.part-label{pointer-events:none}.readout{pointer-events:none}
@media(max-width:760px){.stage{height:710px;min-height:710px}.scene-heading h1{font-size:30px}.readout{max-width:133px;min-width:115px;right:12px;top:24px;padding:10px}.readout b{font-size:22px}.readout span{font-size:7px}.readout small{font-size:6px}.scene-heading .subtitle{font-size:6px;max-width:180px}.transport{padding:12px;min-height:170px}.modes button{font-size:8px;padding:10px 5px}.playback button{font-size:8px;padding:8px 7px}#viewport,#labels{bottom:178px}.viewbar{bottom:190px}#view-note{bottom:231px;font-size:6px;left:18px;max-width:240px}#study-banner{bottom:232px}.part-label{font-size:8px}.inspector-heading h2{font-size:30px}}

/* Persistent slider keeps the stage layout steady while scrubbing. */
.explode-control{display:grid;grid-template-columns:100px minmax(0,1fr) 42px;align-items:center;gap:12px;margin:8px 0 12px;min-height:36px}.explode-control label{font-size:10px;color:#d0c7e7}.explode-control input{width:100%;min-width:0;height:32px;margin:0;accent-color:#c0b5db;cursor:ew-resize}.explode-control output{font-size:12px;font-variant-numeric:tabular-nums;text-align:right;color:#d9ccee}.explode-control input:focus-visible{outline:2px solid #d3bffa;outline-offset:3px;border-radius:4px}.stage{--transport-space:220px;min-height:806px}#viewport,#labels,.stage:fullscreen #viewport,.stage:fullscreen #labels{bottom:var(--transport-space)}.viewbar{bottom:calc(var(--transport-space) + 14px)}#view-note{bottom:calc(var(--transport-space) + 55px)}#study-banner{bottom:calc(var(--transport-space) + 54px)}.transport{min-height:211px}
@media(max-width:760px){.stage{--transport-space:234px;height:766px;min-height:766px}.transport{min-height:226px}.explode-control{grid-template-columns:85px minmax(0,1fr) 36px;gap:8px}.explode-control label{font-size:9px}.explode-control output{font-size:11px}.viewbar{bottom:calc(var(--transport-space) + 12px)}#view-note{bottom:calc(var(--transport-space) + 53px)}}

.graphics-control{display:flex;align-items:center;gap:7px}.graphics-control label{font-size:9px;color:#b3c5cd}.graphics-control select{width:auto;max-width:95px;font-size:10px;padding:7px 20px 7px 8px;margin:0;background:#1d343f;border:1px solid #526674;color:#e0e5eb;border-radius:4px}#graphics-status{position:absolute;right:22px;bottom:calc(var(--transport-space) + 54px);font-size:8px;color:#b2c7d0;pointer-events:none}#parcel-panel{margin:14px 0;padding:18px;border:1px solid #9e80594d;background:linear-gradient(130deg,#d7a46912,transparent);border-radius:8px}.parcel-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px}.parcel-metrics span{font-size:10px;color:#b9c5ca}.parcel-metrics b{display:block;margin:8px 0;font-size:25px;color:#efcca1;font-weight:500;font-variant-numeric:tabular-nums}#parcel-progress{display:block;width:100%;height:5px;margin:12px 0;accent-color:#e2b97f}.parcel-footer{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:10px;color:#d9bb98}.parcel-footer button{font-size:10px;padding:6px 10px}.flow-diagram{display:block;width:100%;height:100%}body[data-renderer=diagram] #labels{display:none}body[data-study=water] .readout{border-color:#d9b67f}body[data-study=circuit] #study-banner{max-width:540px}.graphics-control select:focus-visible{outline:2px solid #d6c6f4;outline-offset:3px}
@media(max-width:760px){.viewbar{left:12px;right:12px;gap:6px}.viewbar button{font-size:8px;padding:7px}.graphics-control{gap:4px}.graphics-control label{display:none}.graphics-control select{font-size:9px;max-width:78px;padding:6px}.viewbar>div{gap:3px}#graphics-status{font-size:6px;right:14px;bottom:calc(var(--transport-space) + 53px)}#view-note{max-width:205px}body[data-study] #study-banner{right:14px;max-width:calc(100% - 28px)}body[data-study] #graphics-status{display:none}}

/* Focused studies reuse the transport row; the stage remains a steady height. */
#study-tools[hidden],#study-tools [hidden],#assembly-controls[hidden],#comparison-panel[hidden],#shield-panel[hidden],#challenge-panel[hidden]{display:none!important}
.study-range{display:grid;grid-template-columns:100px minmax(0,1fr) 70px;align-items:center;gap:12px;min-height:56px}.study-range label,.study-choice label,.study-choice>span{font-size:10px;color:#d4c9ea}.study-range input{width:100%;min-width:0;accent-color:#c0b5db}.study-range output{font:11px system-ui;text-align:right;color:#e5c8a5}.service-range{grid-template-columns:100px minmax(0,1fr) 44px auto}.service-range button,.study-choice button{font-size:10px;padding:7px 10px}.study-choice{display:flex;align-items:center;gap:12px;min-height:56px}.study-choice select{flex:1;min-width:0;max-width:300px;margin:0;padding:8px;font-size:11px;background:#20353f;color:#e3dfed;border:1px solid #60727a;border-radius:5px}
.advanced-studies{margin:24px 0;padding-top:20px;border-top:1px solid #62758155}.advanced-studies button{display:block;text-align:left;width:100%;margin:8px 0;padding:12px 14px;font-size:11px;background:linear-gradient(110deg,#82739b22,transparent)}
.comparison-readings{display:grid;grid-template-columns:1fr 1fr;gap:10px}.comparison-readings article{min-width:0;padding:14px 12px;background:#1b303b;border:1px solid #86909d55;border-radius:7px}.comparison-readings article>span{color:#a1dbd1;font-size:10px}.comparison-readings article+article>span{color:#e0b5d2}.comparison-readings h4{font-size:12px;min-height:30px}.comparison-readings b{font-size:25px;font-weight:500;color:#ead1ac}.comparison-readings p{font-size:10px}.comparison-readings progress{width:100%;accent-color:#c6b0d9;height:5px}#comparison-panel>p,#shield-panel p{font-size:11px;line-height:1.7}
body[data-study=compare] .readout,body[data-study=shield] .readout{display:none}body[data-study=compare] #study-banner,body[data-study=shield] #study-banner{max-width:570px}.evidence-buttons,.diagnosis-buttons,.challenge-actions{display:flex;flex-wrap:wrap;gap:8px}.evidence-buttons button,.diagnosis-buttons button,.challenge-actions button{font-size:11px;padding:10px}#challenge-panel{border:1px solid #bca0da66;border-radius:8px;padding:16px;margin:16px 0}#challenge-panel h4{font-size:20px;margin:8px 0}#challenge-panel>p{font-size:12px;line-height:1.65}#challenge-panel fieldset{margin:18px 0;padding:12px;border:1px solid #7b899b55;border-radius:6px}#challenge-panel legend{font-size:11px;padding:0 6px}#challenge-feedback{min-height:42px;color:#d9caec}
body[data-challenge=true] #scenarios,body[data-challenge=true] #ranges,body[data-challenge=true] #panel-lab>.metrics,body[data-challenge=true] .exposure-paths,body[data-challenge=true] #warning,body[data-challenge=true] #scenario-note{display:none}body[data-challenge=true] #exposure{font-size:24px}
@media(max-width:760px){.study-range{grid-template-columns:76px minmax(0,1fr) 60px;gap:6px;min-height:52px}.study-range label,.study-choice label,.study-choice>span{font-size:8px}.service-range{grid-template-columns:64px minmax(0,1fr) 38px auto}.service-range button{font-size:8px;padding:7px 5px}.study-choice{gap:6px;min-height:52px}.study-choice select{font-size:10px;max-width:190px}.study-choice button{font-size:8px;padding:8px 6px}body[data-study=compare] #study-banner,body[data-study=shield] #study-banner{font-size:8px}body[data-study=compare] #study-banner p,body[data-study=shield] #study-banner p{font-size:9px}}
