@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@500;600;650;700;750&display=swap');
:root{--ink:#152d43;--muted:#536a7d;--line:#d7e2eb;--paper:#f3f7fa;--surface:#fff;--accent:#106a67;--accent-soft:#e2f3f0;--indigo:#4955b6;--night:#10263d;--focus:#f0bc65;font-family:'DM Sans',system-ui,sans-serif;color:var(--ink);background:var(--paper);font-size:16px}
*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,select{min-height:42px}button{border:1px solid var(--line);border-radius:9px;padding:9px 14px;background:var(--surface);color:var(--ink);font-weight:600;cursor:pointer;transition:background .16s,box-shadow .16s}button:hover{background:#edf3f7}button:disabled{opacity:.43;cursor:default}button.primary{background:var(--ink);border-color:var(--ink);color:white}button.primary:hover{background:#23455f}button.subtle{background:#eaf0f5;border-color:transparent}button.quiet{background:transparent;border-color:transparent}button[aria-pressed=true]{background:var(--accent-soft);border-color:#94c7bd;color:#075854}button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,svg:focus-visible{outline:3px solid var(--focus);outline-offset:3px}select,input[type=number],textarea{border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);padding:9px 11px;max-width:100%}select{width:100%;font-size:.9rem}input[type=number]{width:76px}input[type=range]{accent-color:var(--accent);width:100%}input[type=checkbox]{accent-color:var(--accent);width:17px;height:17px;flex-shrink:0}textarea{width:100%;resize:vertical;font-size:1rem}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:'Manrope',system-ui,sans-serif;font-weight:750;letter-spacing:-.025em}h1{font-size:1.65rem;line-height:1.2}h2{font-size:1.1rem;line-height:1.35}h3{font-size:1rem;line-height:1.4}p{line-height:1.55}label{font-size:.9rem}a{color:var(--accent)}.app-header{background:#fff;border-bottom:1px solid var(--line);padding:17px 26px;display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--ink);font:750 1.35rem 'Manrope',sans-serif;white-space:nowrap}.brand-mark{background:var(--ink);color:#86e2d0;padding:10px 8px;border-radius:12px;font:650 1rem 'DM Sans',sans-serif}.brand-sub{display:block;color:var(--muted);font:400 .76rem 'DM Sans',sans-serif;letter-spacing:.025em;margin-top:3px}.app-header nav{display:flex;gap:8px;align-items:center}.app-header select{width:218px}.workspace{display:grid;grid-template-columns:210px minmax(0,1fr) 300px;gap:24px;max-width:1640px;margin:auto;padding:27px 26px 34px;align-items:start}.eyebrow{font-size:.71rem;font-weight:700;letter-spacing:.1em;line-height:1.5;color:var(--muted);margin-bottom:8px}.materials h2{margin-bottom:8px}.materials>p{font-size:.9rem;color:var(--muted);margin-bottom:25px}.material-card{background:#fff;border:1px solid var(--line);padding:16px;border-radius:13px;margin-bottom:14px}.material-card.draggable{cursor:grab}.material-card.selected{border-color:#60a699;background:var(--accent-soft)}.material-symbol{font:700 1.65rem 'Manrope',sans-serif;letter-spacing:-.04em;margin-bottom:7px}.material-card p{font-size:.86rem;color:var(--muted)}.quantity{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:15px 0}.wide{width:100%}.small{font-size:.78rem;line-height:1.5;color:var(--muted)}.aside-bottom{margin-top:27px}.aside-bottom>p{margin:10px 0 22px}details{border-top:1px solid var(--line);padding-top:14px;margin-top:16px}summary{font-size:.88rem;font-weight:600;cursor:pointer;margin-bottom:13px}details label{display:block;margin:12px 0 7px}.check{display:flex!important;align-items:center;gap:8px;font-size:.82rem;line-height:1.4}.scene-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px}.scene-heading .eyebrow{margin-bottom:6px}.scene-heading button{white-space:nowrap;font-size:.8rem}.stage-wrap{background:var(--night);color:#d9eaf1;border-radius:15px;overflow:hidden;box-shadow:0 9px 26px #0f2d4512}.stage-status{display:flex;justify-content:space-between;gap:12px;padding:16px 19px 0;font-size:.78rem;min-height:37px;color:#b8cddc}.stage-status #counts{color:#e2edf6;text-align:right}.stage-wrap svg{display:block;width:100%;height:auto;touch-action:none;user-select:none}.stage-footer{display:flex;gap:18px;padding:12px 19px 17px;font-size:.72rem;align-items:center;flex-wrap:wrap;color:#b8cddc}.stage-footer>span{display:flex;gap:7px;align-items:center}.legend-dot{width:10px;height:10px;border-radius:50%;display:inline-block}.legend-dot.carbon{background:#42474d;border:1px solid #99a1aa}.legend-dot.hydrogen{background:#f6f7f8;border:1px solid #05080c}.legend-ring{width:12px;height:12px;border:2px solid #6bdfc8;border-radius:50%;display:inline-block}.transport{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:15px}.transport button{font-size:.84rem}.transport-spacer{flex:1}.status{font-size:.86rem;color:var(--muted);min-height:3.3em;margin-top:13px}.focus-panel{background:#fff;border:1px solid var(--line);border-radius:13px;margin-top:13px;padding:18px 20px}.focus-header{display:flex;gap:16px;justify-content:space-between;align-items:center}.focus-header .eyebrow{margin-bottom:3px}.segmented{display:flex;background:#edf2f6;border-radius:8px;padding:3px;gap:2px}.segmented button{font-size:.75rem;padding:7px 9px;min-height:34px;border-color:transparent;border-radius:6px;background:transparent}.segmented button[aria-pressed=true]{background:#fff;color:var(--ink);box-shadow:0 1px 4px #18365116}.focus-content{display:grid;grid-template-columns:minmax(130px,1fr) 1.1fr;gap:16px;align-items:center;margin-top:13px}.focus-content svg{width:100%;height:auto}.focus-content p{font-size:.86rem;margin-top:6px}.focus-content .small{font-size:.76rem}.history{margin-top:22px}.history summary{display:flex;justify-content:space-between}.history summary span{font-weight:400;color:var(--muted)}.history ol{padding-left:23px;font-size:.85rem;line-height:1.6;color:var(--muted)}.history li{padding:5px}.guide{background:#fff;border:1px solid var(--line);border-radius:15px;padding:21px 20px}.guide>.eyebrow{font-size:.65rem}.guide select{font-weight:600}.lab-meta{display:flex;justify-content:space-between;align-items:center;font-size:.75rem;color:var(--muted);margin:8px 0}.lab-meta button{font-size:.77rem;padding:5px;min-height:30px}.progress{height:4px;background:#e7eef3;border-radius:3px;margin:10px 0 20px;overflow:hidden}.progress>div{height:100%;background:var(--accent);width:16.6%;transition:width .2s}.step-label{font-size:.74rem;color:var(--accent);font-weight:700}.guide h2{font-size:1.24rem;margin:7px 0 12px}.guide #labText{font-size:.91rem}.question{border-left:3px solid #6caaa1;padding:2px 0 2px 13px;margin:22px 0}.question .eyebrow{font-size:.65rem;margin-bottom:6px;color:var(--accent)}.question p{font-size:.94rem;font-weight:550}.guide-tools{display:flex;gap:6px;margin-top:10px}.guide-tools button{font-size:.76rem;flex:1;padding:8px}.step-nav{display:flex;justify-content:space-between;margin-top:23px}.step-nav button{font-size:.82rem}.hint,.answer{font-size:.85rem;margin-top:13px;padding:12px;border-radius:9px;background:#fff6df;color:#705315}.answer{background:var(--accent-soft);color:#175b54}.notes{margin-top:24px}.notes button{font-size:.8rem;margin-top:10px}.notes .small{margin-top:8px}.site-footer{display:flex;gap:17px;align-items:center;max-width:1640px;margin:auto;padding:0 26px 25px;font-size:.76rem;color:var(--muted)}.site-footer>a{margin-left:auto}.site-footer>span{color:#718696}dialog{border:1px solid var(--line);border-radius:18px;max-width:680px;width:calc(100% - 32px);padding:26px;max-height:88vh;color:var(--ink);box-shadow:0 25px 80px #0d253840}dialog::backdrop{background:#0a233c85}.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:18px}dialog h3{margin:20px 0 7px}dialog p,dialog li{font-size:.95rem;line-height:1.6}dialog li{margin:8px 0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}.atom{cursor:grab}.atom.dragging{cursor:grabbing}.atom-label{font:600 15px 'DM Sans',sans-serif;pointer-events:none}.bond-hit{cursor:pointer}.guide-hidden .workspace{grid-template-columns:210px minmax(0,1fr);max-width:1250px}.guide-hidden .guide{display:none}.teacher .workspace{grid-template-columns:minmax(0,1fr) 320px;max-width:1560px}.teacher .materials{display:none}.teacher .stage-wrap{max-width:1050px}.teacher .guide{font-size:1.1rem}.teacher h1{font-size:2rem}.teacher.guide-hidden .workspace{grid-template-columns:1fr}.teacher .focus-content p{font-size:1rem}.preset-row{display:grid;gap:8px;margin:15px 0}.preset-row button{text-align:left;font-size:.85rem}.energy-controls{border-top:1px solid var(--line);padding-top:13px;margin-top:15px;display:flex;align-items:center;gap:15px;flex-wrap:wrap}.energy-controls p{flex:1;font-size:.82rem}.energy-controls button{font-size:.8rem}.atom-picker{margin-top:14px}.atom-picker select{font-size:.8rem}.chip{font-size:.73rem;border-radius:5px;padding:4px 6px;background:var(--accent-soft);color:var(--accent);display:inline-block;margin-top:10px}
@media(min-width:1450px){.workspace{grid-template-columns:230px minmax(0,1fr) 320px;gap:30px}.stage-wrap{margin-top:4px}}
@media(max-width:1120px){.workspace{grid-template-columns:180px minmax(0,1fr) 270px;gap:17px;padding:22px 18px}.app-header{padding:14px 18px}.app-header nav{gap:2px}.app-header nav button{font-size:.8rem;padding:8px}.app-header select{width:185px}h1{font-size:1.4rem}.guide{padding:18px 15px}.focus-content{grid-template-columns:1fr}.focus-content svg{max-height:120px}.transport .check{flex-basis:100%}.focus-header{align-items:start;flex-direction:column;gap:10px}.stage-status{font-size:.7rem}.stage-footer{gap:12px}}
@media(max-width:900px){.workspace{grid-template-columns:160px minmax(0,1fr)}.guide{grid-column:1/-1;max-width:none;display:grid;grid-template-columns:1fr 1fr;gap:8px 24px}.guide>.eyebrow,.guide>select,.guide>.lab-meta,.guide>.progress,.guide>.step-label,.guide>h2,.guide>#labText,.guide>.question{grid-column:1}.guide>.notes{grid-column:2;grid-row:3/12;margin:0}.guide>.step-nav{grid-column:1}.guide>.guide-tools,.guide>#prepareLab,.guide>#hintText,.guide>#answerText{grid-column:1}.guide .progress{margin:4px 0 10px}.guide .question{margin:10px 0}.app-header{flex-wrap:wrap;gap:12px}.app-header nav{margin-left:auto;flex-wrap:wrap}.focus-content{grid-template-columns:1fr 1.1fr}.teacher .workspace{grid-template-columns:1fr}.teacher .guide{display:block}.teacher .guide .notes{margin-top:16px}}
@media(max-width:600px){.app-header{padding:14px}.brand{font-size:1.15rem}.app-header nav{width:100%;margin:0;display:grid;grid-template-columns:1fr auto auto}.app-header select{width:100%;min-width:0}.app-header nav button{font-size:.73rem}.workspace{display:flex;flex-direction:column;padding:20px 13px;gap:20px}.experiment{order:0;width:100%}.materials{order:1;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:0 15px}.materials>.eyebrow,.materials>h2,.materials>p{grid-column:1/-1}.materials>p{margin-bottom:12px}#materialsBody{grid-column:1}.aside-bottom{grid-column:2;margin-top:0}.guide{order:2;display:block;width:100%}.scene-heading{gap:6px;margin-bottom:14px}.scene-heading h1{font-size:1.3rem}.scene-heading button{padding:6px;font-size:.7rem}.stage-status{padding:12px 12px 0}.stage-footer{padding:10px 12px;font-size:.65rem}.transport{gap:6px}.transport button{font-size:.79rem;padding:9px}.transport-spacer{display:none}.transport .check{flex-basis:auto}.focus-panel{padding:15px}.focus-header{display:flex;flex-direction:column}.focus-content{grid-template-columns:1fr}.focus-content svg{max-height:130px}.status{min-height:0}.guide .notes{margin-top:22px}.site-footer{padding:0 14px 20px;flex-wrap:wrap;gap:8px}.site-footer>a{margin-left:0;width:100%}.teacher h1{font-size:1.5rem}.material-card{padding:12px}.quantity{flex-wrap:wrap}.materials button{font-size:.8rem;padding:10px}.guide-hidden .workspace{display:flex}.guide-hidden .guide{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.interaction-tip{font-size:.8rem;color:var(--muted);margin:-6px 0 12px}.zoom-controls{display:flex;gap:3px;margin-left:auto}.zoom-controls button{min-height:32px;width:32px;padding:3px;font-size:1.2rem}.material-help{margin:10px 0 17px}.repeat-info{margin-top:17px;padding:14px 0;border-top:1px solid var(--line)}.repeat-info strong{font-size:1.2rem;letter-spacing:.035em}.repeat-info span,.repeat-info small{display:block;margin-top:6px}.repeat-info span{font-size:.83rem;color:var(--accent)}.repeat-info small{font-size:.72rem;color:var(--muted);line-height:1.6}.with-switch{position:relative;padding-bottom:5px}.event-switch{grid-column:1;grid-row:2;display:flex;justify-content:center;gap:6px}.event-switch button{font-size:.8rem;min-height:32px;padding:5px 18px}.focus-content>div:last-child{grid-column:2;grid-row:1/3}.energy-details{margin-top:15px}.energy-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:18px;align-items:center}.energy-grid svg{width:100%}.energy-grid p{font-size:.82rem;margin-bottom:10px}.energy-grid button{font-size:.8rem}.teacher .interaction-tip{font-size:1rem}
@media(max-width:1120px){.focus-content>div:last-child{grid-column:1;grid-row:auto}.event-switch{grid-row:auto}.energy-grid{grid-template-columns:1fr}}
@media(min-width:601px) and (max-width:900px){.focus-content>div:last-child{grid-column:2;grid-row:1/3}.energy-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.zoom-controls{display:none}.scene-heading{align-items:start}.scene-heading>div:first-child{flex:1}.app-header #aboutOpen{display:block}.app-header nav{grid-template-columns:1fr auto auto}.app-header nav #aboutOpen{grid-column:1;text-align:left}.focus-content>div:last-child{grid-column:1;grid-row:auto}.event-switch{grid-row:auto}.energy-grid{grid-template-columns:1fr}.teacher .materials{display:none}}

@media(max-width:600px){.scene-heading{flex-wrap:wrap}.scene-heading>div:first-child{flex-basis:100%}.zoom-controls{display:flex;margin-left:0}.scene-heading #fit{margin-left:auto}.scene-heading .zoom-controls button{min-height:38px;width:38px}.interaction-tip{font-size:.77rem}}

.reaction-panel{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 18px;margin:5px 0 16px}.reaction-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.reaction-top h2{font-size:1rem}.reaction-top label{display:flex;align-items:center;gap:8px;font-size:.76rem;color:var(--muted)}.reaction-top select{min-height:34px;font-size:.77rem;width:auto;padding:6px}.reaction-phases{list-style:none;display:grid;grid-template-columns:1fr 1.5fr 1.2fr;gap:6px;padding:0;margin:12px 0 8px}.reaction-phases li{background:#edf2f6;border-radius:6px;padding:7px 9px;font-size:.73rem;color:var(--muted)}.reaction-phases li[aria-current]{background:#dbf4ed;color:#07594b;box-shadow:inset 0 0 0 1px #68b69f;font-weight:700}.reaction-phases li.done{color:#07594b;background:#e8f4ef}#reactionProgress{display:block;width:100%;height:4px;appearance:none;border:none;background:#e7eef3;border-radius:4px;overflow:hidden}#reactionProgress::-webkit-progress-bar{background:#e7eef3}#reactionProgress::-webkit-progress-value{background:#16856e}#reactionCaption{font-size:.82rem;line-height:1.5;margin-top:10px;color:var(--muted);min-height:2.5em}.reaction-options{display:flex;gap:10px 18px;flex-wrap:wrap;margin-top:10px}.reaction-options .check{font-size:.74rem}.electron-pair-icon{width:12px;height:5px;display:inline-block;background:radial-gradient(circle at 2.5px 2.5px,#ffe396 2.5px,transparent 3px),radial-gradient(circle at 9px 2.5px,#ffe396 2.5px,transparent 3px)}.unpaired-icon{display:inline-block;width:6px;height:6px;background:#69e0c4;border-radius:50%;margin-left:7px}
@media(max-width:600px){.reaction-panel{padding:12px}.reaction-top{align-items:start;flex-direction:column;gap:8px}.reaction-phases{grid-template-columns:1fr 1.4fr 1.2fr}.reaction-phases li{font-size:.68rem;padding:6px}.stage-footer{gap:10px}}

.focus-panel .reaction-panel{border:0;border-top:1px solid var(--line);border-radius:0;padding:13px 0 0;margin:14px 0 0}.focus-panel .reaction-top h2{font-size:.85rem;color:var(--muted)}

button.primary[aria-pressed=true],button.primary[aria-pressed=true]:hover{background:#e2f3f0;color:#075854;border-color:#94c7bd}

/* Molecular geometry controls */
.geometry-panel{border:1px solid var(--line,#dbe3e8);border-radius:0 0 14px 14px;background:#f7fafb;padding:12px 15px;margin-top:-4px}.geometry-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.rotate-tools{display:flex;align-items:center;gap:5px}.rotate-tools span{font-size:12px;color:#536a7d;margin-right:4px}.rotate-tools button{min-width:32px;padding:5px 8px}.geometry-reading{display:flex;gap:8px;justify-content:space-between;flex-wrap:wrap;font-size:12px;margin-top:10px}.geometry-reading strong{color:#175f63}.geometry-panel p{margin:6px 0 0}.geometry-tools .segmented button{font-size:12px;padding:7px 10px}@media(max-width:600px){.geometry-reading{display:block}.geometry-reading span{display:block;margin-top:5px}}

.force-controls{margin-top:12px;border-top:1px solid #d9e4e9;padding-top:10px}.force-controls summary{font-weight:650;color:#24485e;font-size:13px;cursor:pointer}.force-controls summary span{font-weight:400;font-size:11px;color:#667d8c;margin-left:8px}.force-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px 22px;margin:14px 0}.force-control label{display:flex;justify-content:space-between;gap:8px;font-size:12px;font-weight:650}.force-control output{font-variant-numeric:tabular-nums;color:#126b68;font-weight:700}.force-control input[type=range]{width:100%;margin:10px 0 6px;accent-color:#15796f;min-height:20px;padding:0;cursor:pointer}.force-control small{display:block;line-height:1.4;font-size:11px;color:#587183}.force-controls button{font-size:12px}@media(max-width:600px){.force-grid{grid-template-columns:1fr;gap:14px}}

/* 3D inspection: a quiet canvas with a separate information surface. */
#inspectorRoot{margin-top:20px;container-type:inline-size}
.inspect-shell{border:1px solid #dde5eb;border-radius:16px;overflow:hidden;background:#fff}
.inspect-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid #e6ecf0;background:#f8fafc}
.inspect-toolbar .segmented{background:#e8edf2;padding:3px;border-radius:9px}.inspect-toolbar .segmented button{font-size:.875rem;min-width:72px;min-height:36px;padding:6px 14px}.inspect-toolbar>button{font-size:.875rem;min-height:38px;background:transparent;border-color:transparent;padding:6px 10px}.inspect-toolbar>button:hover{background:#e9eff4}
.inspect-layout{display:grid;min-width:0}.inspect-view{min-width:0;background:#141f2d}.inspect-stage{position:relative;height:460px;overflow:hidden;background:radial-gradient(ellipse at 42% 36%,#243448 0%,#151f2d 62%,#101823 100%);isolation:isolate}
.inspect-stage canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab;outline-offset:-4px}.inspect-stage canvas:active{cursor:grabbing}.inspect-stage canvas.pulling{cursor:crosshair}.inspect-stage canvas:focus-visible{outline:2px solid #69d5e7}
.inspect-overlay{position:absolute;inset:17px 20px auto;display:flex;justify-content:space-between;align-items:center;gap:12px;color:#aebecd;font-size:.75rem;pointer-events:none}.inspect-overlay>span:first-child{font-size:.75rem;font-weight:600;letter-spacing:.12em;color:#c0d3df}.inspect-overlay>span:last-child{text-align:right;max-width:82%}.inspect-canvas-caption{position:absolute;bottom:18px;left:15px;right:15px;text-align:center;color:#aebecd;font-size:.75rem;pointer-events:none}
.inspect-controls{padding:10px 14px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;border-top:1px solid #ffffff12;color:#e0e8ef;background:#162230}
.inspect-controls button{font-size:.875rem;min-height:38px;padding:6px 10px;background:transparent;color:#cedbe5;border-color:#ffffff1c;border-radius:8px}.inspect-controls button:hover{background:#243649}.inspect-controls button[aria-pressed=true]{color:#b6f0f7;background:#23434e;border-color:#5eb4c1}.inspect-controls button:disabled{opacity:.4}.inspect-controls :focus-visible{outline:2px solid #80e2f2;outline-offset:3px}
.inspect-switch{display:flex;gap:8px;align-items:center;position:relative;cursor:pointer;font-size:.875rem;white-space:nowrap;margin-right:4px}.inspect-switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.inspect-switch-track{height:20px;width:34px;border-radius:12px;background:#4b5d6b;position:relative;transition:background .2s;flex-shrink:0}.inspect-switch-track:after{content:'';position:absolute;width:14px;height:14px;background:#f4f7fa;border-radius:50%;left:3px;top:3px;transition:transform .2s}.inspect-switch input:checked+.inspect-switch-track{background:#397e8a}.inspect-switch input:checked+.inspect-switch-track:after{transform:translateX(14px)}.inspect-switch input:focus-visible+.inspect-switch-track{outline:2px solid #80e2f2;outline-offset:4px}
.inspect-camera{display:flex;gap:2px;align-items:center;margin-left:auto}.inspect-camera button{width:36px;padding:6px;min-height:38px;border-color:transparent;font-size:1.15rem}.inspect-camera svg{width:19px;height:19px;display:block;margin:auto;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.inspect-help{margin:0;color:#aec0ce;background:#162230;padding:0 15px 12px;font-size:.75rem;border:0}.inspect-help summary{font-size:.75rem;font-weight:400;color:#adc0d0;padding:0;cursor:pointer}.inspect-help p{font-size:.875rem;line-height:1.6;padding-top:10px;color:#cedbe5}
.inspect-details{padding:22px;background:#fafcfd;min-width:0}.inspect-title{display:flex;flex-direction:column;gap:6px}.inspect-kicker{font-size:.75rem;letter-spacing:.1em;font-weight:600;color:#657d8d}.inspect-title h3{font-size:1.1rem;line-height:1.4;margin:0}.inspect-title #inspectState{font-size:.8125rem;color:#57707f}.inspect-reading{display:flex;flex-direction:column;gap:9px;margin-top:20px}.inspect-reading strong{font-size:.875rem;line-height:1.6;color:#215c66;font-weight:600}.inspect-reading span{font-size:.875rem;line-height:1.5;color:#3c5669}#inspectExplanation{font-size:.875rem;line-height:1.65;color:#5c7384;margin:12px 0 14px}#inspectReset{font-size:.8125rem;padding:7px 10px;min-height:36px;background:transparent}
.inspect-neighbors{margin-top:22px;padding-top:18px;border-top:1px solid #dde6ec}.inspect-neighbors h4{font-size:.875rem;font-weight:650;margin:0 0 6px}.inspect-neighbors>p{font-size:.8125rem;color:#637a8b;line-height:1.6}
#inspectNeighborList{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px;font-size:.875rem}#inspectNeighborList button{min-width:0;text-align:left;display:flex;flex-direction:column;align-items:start;gap:5px;padding:12px;background:#fff;border-color:#dfe7ed;border-radius:10px}#inspectNeighborList button:hover{background:#edf6f8;border-color:#a8c8cf}#inspectNeighborList strong{font-size:.875rem;font-weight:650}#inspectNeighborList span{font-size:.8125rem;color:#346b73;font-weight:500}#inspectNeighborList small{font-size:.8125rem;line-height:1.5;color:#637a8b;font-weight:400;overflow-wrap:anywhere}
.inspect-forces{padding:16px 20px;margin:0;border-top:1px solid #dfe7ed;background:#fff}.inspect-forces summary{font-size:.875rem;font-weight:600;cursor:pointer}.inspect-forces summary span{font-size:.8125rem;font-weight:400;color:#68808f;margin-left:8px}.inspect-forces>p{font-size:.875rem;line-height:1.6;color:#5c7384;margin-top:12px}.inspect-forces .force-grid{gap:18px 28px;margin:20px 0}.inspect-forces .force-control label{font-size:.875rem}.inspect-forces button{font-size:.875rem}
.focus-content.simple-copy{display:block;border-top:1px solid #e0e8ed;padding-top:12px}.focus-content.simple-copy>svg{display:none}.simple-copy h3{font-size:.875rem}.simple-copy p{font-size:.875rem}#inspectError{position:absolute;inset:35% 20px auto;color:#fff;background:#24374b;padding:18px;border-radius:10px;font-size:.875rem}
@container(min-width:780px){.inspect-layout{grid-template-columns:minmax(0,1fr) 260px}.inspect-details{border-left:1px solid #e0e8ed;padding:20px;max-height:570px;overflow:auto}#inspectNeighborList{grid-template-columns:1fr}.inspect-stage{height:480px}}
/* Native fullscreen and a full-window fallback share the same layout. */
.fullscreen-host:fullscreen,.fullscreen-host.window-fullscreen{box-sizing:border-box;width:100%;height:100%;margin:0;padding:20px;background:#f3f7fa;border:0;border-radius:0;overflow:auto;color:var(--ink)}.fullscreen-host.window-fullscreen{position:fixed;inset:0;z-index:10000;width:100vw;height:100dvh}.fullscreen-host:fullscreen::backdrop{background:#10283e}
#vatPanel:is(:fullscreen,.window-fullscreen) .stage-wrap{max-width:none;margin:0}#vatPanel:is(:fullscreen,.window-fullscreen) .stage-wrap svg{width:100%;height:max(320px,calc(100dvh - 360px))}#vatPanel:is(:fullscreen,.window-fullscreen) .scene-heading{margin-bottom:10px}#vatPanel:is(:fullscreen,.window-fullscreen) .interaction-tip{margin:0 0 10px}#vatPanel:is(:fullscreen,.window-fullscreen) .status{min-height:0}
#inspectorPanel:is(:fullscreen,.window-fullscreen){background:#eef3f7;padding:20px 24px}#inspectorPanel:is(:fullscreen,.window-fullscreen) .inspect-stage{height:max(360px,calc(100dvh - 270px))}#inspectorPanel:is(:fullscreen,.window-fullscreen) .inspect-details{max-height:max(460px,calc(100dvh - 180px))}#inspectorPanel:is(:fullscreen,.window-fullscreen) #inspectorRoot{margin-top:16px}#inspectorPanel:is(:fullscreen,.window-fullscreen) .reaction-panel,#inspectorPanel:is(:fullscreen,.window-fullscreen) .focus-content,#inspectorPanel:is(:fullscreen,.window-fullscreen) #energyPanel{display:none}
@media(max-width:600px){#inspectorRoot{margin-top:16px}.inspect-stage{height:350px}.inspect-toolbar{padding:10px;gap:6px}.inspect-toolbar .segmented button{min-width:64px;padding:6px 10px}.inspect-toolbar>button{padding:6px}.inspect-controls{padding:10px;gap:6px}.inspect-controls button{padding:6px 8px;font-size:.8125rem}.inspect-camera button{width:32px;font-size:1.1rem;padding:5px}.inspect-switch{font-size:.8125rem;gap:6px}.inspect-overlay{inset:14px 14px auto;font-size:.75rem}.inspect-details{padding:18px}.inspect-forces{padding:16px}.inspect-forces .force-grid{grid-template-columns:1fr}#inspectNeighborList{grid-template-columns:1fr}.fullscreen-host:fullscreen,.fullscreen-host.window-fullscreen{padding:12px}.scene-heading{flex-wrap:wrap}.scene-heading>div:first-child{flex:1;min-width:180px}#inspectorPanel:is(:fullscreen,.window-fullscreen){padding:12px}#inspectorPanel:is(:fullscreen,.window-fullscreen) .inspect-stage{height:max(320px,calc(100dvh - 270px))}}

.library-nav-link{display:inline-flex;align-items:center;padding:9px 12px;min-height:42px;border-radius:8px;font-size:.82rem;font-weight:600;text-decoration:none;white-space:nowrap;background:#e2f3f0;color:#075854}.library-nav-link:hover{background:#cde9e3}.library-nav-link:focus-visible{outline:3px solid var(--focus);outline-offset:3px}@media(max-width:600px){.app-header .library-nav-link{font-size:.73rem;padding:8px;justify-content:center}}

.inspect-layout{grid-template-columns:minmax(0,1fr)}.inspect-toolbar>strong{margin-right:auto}.inspect-shell>#inspectExplanation{padding:4px 20px 14px}

.focus-explanation>summary{padding:16px 20px;font-size:.85rem}.focus-panel{overflow:hidden}