/* Floating instruments share a footprint; the experiment owns the background. */
:root{--preview:236px;--inset:28px;--rail:294px}
#scene-space{position:absolute;inset:0;pointer-events:none}.instrument-rail{display:none}
#experiments{left:24px;right:24px;top:18px;grid-auto-columns:143px;gap:10px;padding:2px 0 12px;scroll-behavior:auto}
.top-shade{height:146px;background:linear-gradient(#071119 15%,#071119dc 58%,#07111900)}
.experiment{padding:6px 5px 8px;border:1px solid transparent;border-radius:9px;transition:border-color .24s,background .24s,color .24s}.experiment[aria-pressed=true]{border-color:#83bdce50;background:linear-gradient(145deg,#83c8de12,#83c8de03)}.experiment img{height:80px}.experiment span{font-size:10px;padding:5px 5px 0}.experiment:hover{border-color:#83bdce23}.experiment[aria-busy=true] img{opacity:.6}
.scene-controls{position:absolute;left:auto;right:var(--inset);top:153px;bottom:auto;transform:none;width:var(--preview);padding:0;border:0;box-shadow:none;background:none;backdrop-filter:none;display:block}
.scene-actions{display:flex;justify-content:space-between;gap:10px;border:0;padding:0}.scene-actions .icon{width:42px;height:42px;padding:12px;border-radius:50%;background:#172a346b;box-shadow:inset 0 1px #badce70a,0 3px 14px #0001;backdrop-filter:blur(14px);transition:background .16s,color .16s,transform .16s}.scene-actions .icon:hover{background:#23404d9e;transform:translateY(-1px)}.scene-actions .icon[aria-pressed=true],#settings-toggle[aria-expanded=true]{background:#85c8d52b;color:#d0f2f4}.scene-actions #sweep{order:-3}.scene-actions #reset{order:-2}.scene-actions #details{order:-1}
.detector-ui{width:var(--preview);right:var(--inset);bottom:22px;z-index:4;opacity:1;visibility:visible;pointer-events:auto;transition:none}.settings-open .detector-ui{opacity:1;visibility:visible;pointer-events:auto}
#detector-image{width:100%;margin:0;aspect-ratio:1;border-radius:4px;outline:0;box-shadow:0 0 0 1px #8bb6c41b,0 10px 35px #0002;overflow:hidden}
.view-modes{display:flex;align-items:center;justify-content:space-between;padding:0 0 9px;gap:5px;border:0;background:none}.view-modes button{flex:1;position:relative;padding:9px 0;gap:6px;font-size:10px;color:#7e9ba9;box-shadow:none!important;background:none!important;border-radius:6px}.view-modes button[aria-pressed=true]{color:#e2f2f5}.view-modes button[aria-pressed=true] .mode-symbol{opacity:1;box-shadow:0 0 10px #9fc8e570;transform:scale(1.15)}.mode-symbol{width:7px;height:7px;opacity:.45;transition:opacity .2s,transform .2s,box-shadow .2s}
.detector-heading{height:0;min-height:0;margin:0;position:relative;font-size:9px;pointer-events:none}.detector-heading #detector-quantity{position:absolute;left:9px;top:9px;z-index:2;background:#08121a90;padding:3px 5px;border-radius:3px;pointer-events:none}.detector-heading #clear-probe{position:absolute;right:4px;top:4px;z-index:5;pointer-events:auto}
.distance-control{position:relative;width:100%;left:auto;bottom:auto;transform:none;border:0;padding:6px 0 0;background:none;box-shadow:none;backdrop-filter:none}.distance-heading{min-height:25px;justify-content:flex-end;font-size:9px;color:#91aeba}#distance{height:44px;width:100%;margin:0;display:block}.distance-heading .katex{font-size:1.1em}
.settings-panel{right:var(--inset);top:209px;bottom:calc(var(--preview) + 113px);width:var(--preview);border:1px solid #96c6d71b;border-radius:12px;background:#101f29e8;backdrop-filter:blur(22px);box-shadow:0 14px 45px #0003;transform:translateY(-6px) scale(.985);transform-origin:top right;z-index:7;max-height:none}
.settings-heading{height:40px;padding:0 13px;font-size:11px;border-bottom:1px solid #92b9c512}.settings-heading .icon{width:26px;height:26px}.settings-content{padding:14px;max-height:calc(100% - 40px);scrollbar-width:thin;scrollbar-color:#4b74833d transparent;scrollbar-gutter:stable}.setting{margin-bottom:15px}.setting-label,.setting>label{font-size:10px}.setting output{font-size:9px}.setting-note{font-size:9px;line-height:1.5}.palette-choices{gap:4px;margin-top:3px}.palette-choices button{flex-direction:row;gap:5px;padding:7px 3px;font-size:9px}.swatch{width:23px;height:10px}.swatch.ice{background:linear-gradient(100deg,#996eff,#33dbf2,#ffdb8a)}
.field-switches{display:flex;gap:8px;margin:3px 0 14px}.field-switches button{flex:1;display:flex;align-items:center;justify-content:space-between;padding:9px 12px;border-radius:7px;color:#5e7b8b;background:#6a9fa807;transition:color .16s,background .16s}.field-switches button[aria-pressed=true]{background:#80cada12;color:var(--electric)}.field-switches button:last-child[aria-pressed=true]{color:var(--magnetic)}.field-switches i{height:5px;width:5px;border-radius:50%;background:currentColor;opacity:.25}.field-switches button[aria-pressed=true] i{opacity:1;box-shadow:0 0 6px currentColor}.cycle-heading{display:flex;justify-content:space-between;align-items:center;font-size:10px}.switch{font-size:10px;min-height:29px}.settings-section summary{font-size:10px;min-height:40px}.segmented button{font-size:9px}.camera-choices{gap:3px;margin-bottom:12px}.camera-choices button{font-size:9px}.settings-footer button{font-size:9px}
#probe-readout{position:absolute;right:calc(100% + 15px);bottom:55px;width:250px;padding:14px;border:1px solid #7396aa26;border-radius:10px;background:#0b1922ed;font-size:8px;box-shadow:0 8px 25px #0004}.settings-open #probe-readout{display:none}
#loading{left:calc((100% - var(--rail))/2)}#loading.refining{left:24px;bottom:20px}
button:focus,input:focus,summary:focus,[tabindex]:focus,.switch input:focus-visible+i{outline:0!important}button:focus-visible,summary:focus-visible{background-color:#81bacb20}input[type=range]:focus-visible{filter:brightness(1.25)}button,input,summary{transition-duration:.16s}
dialog .element-card{padding:18px;background:#091822;border:1px solid #82b3cb20;border-radius:7px;margin:22px 0}dialog .element-card canvas{width:145px;height:145px}dialog[open]{animation:dialog-enter .26s var(--ease)}@keyframes dialog-enter{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
@media(min-width:1500px){:root{--preview:278px;--inset:34px;--rail:350px}#experiments{grid-auto-columns:160px;gap:14px;top:24px}.experiment img{height:92px}.experiment span{font-size:11px}.scene-controls{top:168px}.settings-panel{top:228px;bottom:calc(var(--preview) + 125px)}.detector-ui{bottom:29px}.view-modes button{font-size:11px}}
@media(max-width:900px) and (min-width:651px){:root{--preview:200px;--inset:18px;--rail:245px}#experiments{grid-auto-columns:126px;gap:6px}.experiment img{height:72px}.scene-controls{top:142px}.scene-actions{gap:7px}.scene-actions .icon{width:38px;height:38px;padding:10px}.settings-panel{top:192px}.view-modes button{font-size:9px}}
@media(max-width:650px){:root{--preview:158px;--inset:16px;--rail:0px}#scene-space{inset:0 0 258px}#experiments{left:10px;right:10px;top:9px;grid-auto-columns:115px;gap:5px}.experiment img{height:64px}.experiment span{font-size:9px}.top-shade{height:120px}.scene-controls{right:auto;left:16px;top:auto;bottom:29px;width:calc(100% - 206px);height:48px}.scene-actions{flex-wrap:wrap;justify-content:center;gap:7px}.scene-actions .icon{width:34px;height:34px;padding:9px}.detector-ui{right:16px;bottom:12px}.view-modes{padding-bottom:7px;gap:1px}.view-modes button{font-size:8px;gap:4px;padding:7px 0}.mode-symbol{width:5px;height:5px}.distance-heading{min-height:21px;font-size:8px}#distance{height:42px}.settings-panel{left:12px;right:calc(var(--preview) + 30px);top:auto;bottom:83px;width:auto;height:180px;max-height:calc(100% - 240px);transform:translateY(5px)}.settings-heading{height:30px;padding:0 9px;font-size:10px}.settings-content{padding:9px;max-height:calc(100% - 30px)}.field-switches{gap:3px}.field-switches button{padding:7px 9px}.palette-choices{flex-wrap:wrap;gap:2px}.palette-choices button{font-size:8px}.swatch{width:15px}.setting-label,.setting>label,.setting output,.switch,.segmented button,.camera-choices button{font-size:8px}.world-label{font-size:8px}.incident-label{display:none}#loading.refining{bottom:280px}#probe-readout{right:0;bottom:calc(100% + 5px);width:230px}.settings-open .scene-controls{opacity:1;pointer-events:auto;transform:none}}
@media(max-width:360px){:root{--preview:140px}.scene-controls{width:calc(100% - 182px);left:10px}.scene-actions{gap:4px}.settings-panel{right:166px}.view-modes button{font-size:7px}}

@media(min-width:651px){.scene-controls{right:calc(var(--inset) + var(--preview) + 18px);top:auto;bottom:29px;width:190px}.scene-actions{gap:7px}.settings-panel{right:calc(var(--inset) + var(--preview) + 18px);top:auto;bottom:86px;width:258px;height:min(458px,calc(100% - 240px));transform-origin:bottom right;transform:translateY(6px) scale(.985)}}
#scene-space{inset:0}
html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
#app{position:fixed;inset:0;overflow:hidden}
.settings-panel{overflow:hidden;display:flex;flex-direction:column}
.settings-heading{flex:0 0 auto}
.settings-content{flex:1;min-height:0;max-height:none}
#app:not([data-ready=true]) .world-label,#app:not([data-ready=true]) .axis-label,#app:not([data-ready=true]) #detector-handle{visibility:hidden;pointer-events:none}
.world-label{font-size:10px;color:#a6c5ce;text-shadow:0 1px 8px #071119,0 0 14px #071119;letter-spacing:.01em}
.component-label{font-size:9px;color:#89a9b6}
.world-label{left:0;top:0;white-space:nowrap;max-width:none;justify-content:center;text-align:center}
#optic-label{pointer-events:auto}#label-links{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;stroke:#87aeb849;stroke-width:.7;fill:none}
#app:not([data-ready=true]) #label-links{visibility:hidden}
.thumbnail-export #app>:not(#stage):not(#scene-space):not(#error){display:none!important}
@media(max-width:420px) and (orientation:portrait){.scene-controls{left:12px;bottom:12px;width:calc(100% - var(--preview) - 42px);height:94px}.scene-actions{display:grid;grid-template-columns:repeat(2,44px);gap:6px;justify-content:end}.scene-actions .icon{width:44px;height:44px;padding:13px}.settings-panel{right:calc(var(--preview) + 30px);bottom:116px;height:min(310px,calc(100% - 315px))}}
@media(max-width:900px){#object-light-label,#reference-light-label,#incident-label{display:none}.world-label{font-size:9px}}
@media(max-width:650px){.segmented{flex-wrap:wrap}.segmented button{min-width:0;white-space:normal}.settings-panel{height:min(310px,calc(100% - 290px));min-height:150px}.world-label{font-size:8px}}
@media(max-height:540px) and (min-aspect-ratio:1/1){
 :root{--preview:clamp(112px,35vh,170px);--inset:16px}
 #experiments{left:12px;right:12px;top:7px;grid-auto-columns:112px;gap:6px;padding-bottom:6px}.experiment img{height:48px}.experiment span{font-size:9px;padding-top:2px}.top-shade{height:100px}
 .detector-ui{right:16px;bottom:8px;width:var(--preview)}.view-modes{padding-bottom:3px}.view-modes button{font-size:8px;gap:3px;padding:6px 0}.distance-heading{min-height:20px}#distance{height:36px}
 .scene-controls{left:auto;right:calc(var(--preview) + 30px);bottom:18px;top:auto;width:166px;height:auto}.scene-actions{flex-wrap:nowrap;gap:6px}.scene-actions .icon{width:36px;height:36px;padding:10px}
 .settings-panel{left:auto;right:calc(var(--preview) + 30px);bottom:66px;top:auto;width:240px;height:calc(100% - 165px);min-height:120px;max-height:none;transform-origin:bottom right}.settings-heading{height:34px}.settings-content{max-height:none;padding:12px}
 #object-light-label,#reference-light-label,#incident-label{display:none}
}