@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --bg:#0E0F11;
  --panel:#191C20;
  --workbench:#17191C;
  --border:#30343A;
  --border-soft:#272B30;
  --text:#F3F4F6;
  --muted:#A9B0B7;
  --blue:#F47B20;
  --blue-dim:#35251B;
  --fault:#F07870;
  --fault-dim:#382326;
  --success:#79CDA8;
  --success-dim:#1B352D;
  color:var(--text);
  background:var(--bg);
  font-family:'Inter',system-ui,sans-serif;
  font-synthesis:none;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-width:320px;background:var(--bg);color:var(--text)}
button,input,select{font:inherit}
button,a,input,select{touch-action:manipulation}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.42}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
a{color:inherit}
[hidden]{display:none!important}
.topbar{
  position:relative;z-index:20;height:58px;display:flex;align-items:center;justify-content:space-between;
  gap:18px;padding:0 18px;border-bottom:1px solid var(--border);background:#10161B
}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand-mark{
  width:31px;height:31px;display:grid;place-items:center;border:1px solid var(--blue);
  color:var(--blue);font:600 12px 'IBM Plex Mono',monospace
}
.brand strong{display:block;font:700 20px/1 'Barlow Condensed',sans-serif;letter-spacing:1.2px}
.brand small{display:block;margin-top:4px;color:var(--muted);font:500 8px 'IBM Plex Mono',monospace;letter-spacing:1.2px}
.top-context{display:flex;align-items:center;gap:22px;color:var(--muted);font:500 9px 'IBM Plex Mono',monospace;letter-spacing:.6px}
.system-status{color:var(--success)}
.system-status i,.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:7px;background:var(--success)}
.team{text-align:right;font:600 10px 'IBM Plex Mono',monospace;letter-spacing:.5px}
.team small{display:block;margin-top:3px;color:var(--muted);font-weight:400;font-size:8px}
.kicker,.section-tag{margin:0;color:var(--blue);font:500 9px/1.5 'IBM Plex Mono',monospace;letter-spacing:1.15px}

/* Library home */
.home{max-width:1420px;min-height:calc(100vh - 99px);margin:auto;padding:clamp(34px,6vw,82px) clamp(20px,5vw,72px) 70px}
.home-intro{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(260px,.55fr);align-items:end;gap:70px;padding-bottom:48px}
.home-intro h1{margin:12px 0 0;font:600 clamp(55px,7.3vw,112px)/.82 'Barlow Condensed',sans-serif;letter-spacing:-1px;text-transform:uppercase}
.home-intro h1 span{color:var(--blue)}
.home-intro>p{max-width:420px;margin:0 0 5px;color:#AAB3B9;font-size:16px;line-height:1.65}
.library-header{display:flex;justify-content:space-between;align-items:end;gap:20px;padding:15px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.library-header>div{display:flex;align-items:center;gap:13px;font:600 12px 'IBM Plex Mono',monospace}
.library-header small{padding:4px 7px;border:1px solid #315446;color:var(--success);font:500 8px 'IBM Plex Mono',monospace}
.library-header p{margin:0;color:var(--muted);font-size:12px}
.experiment-list{display:grid;grid-template-columns:1fr 1fr}
.home-lab{
  min-height:164px;display:grid;grid-template-columns:64px minmax(0,1fr) 26px;gap:19px;
  align-items:center;padding:25px 24px;border-bottom:1px solid var(--border);text-decoration:none
}
.home-lab:nth-child(odd){border-right:1px solid var(--border)}
.home-lab:hover{background:var(--panel)}
.home-lab .number{font:500 31px 'Barlow Condensed',sans-serif;color:#5D6A74}
.home-lab .subject{color:var(--blue);font:500 9px 'IBM Plex Mono',monospace;letter-spacing:1px;text-transform:uppercase}
.home-lab h2{margin:7px 0 7px;font:600 28px/1 'Barlow Condensed',sans-serif;letter-spacing:.2px;text-transform:uppercase}
.home-lab p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}
.home-lab .meta{display:flex;gap:12px;margin-top:13px;color:#A9B3BA;font:500 9px 'IBM Plex Mono',monospace}
.home-lab .arrow{font:28px 'Barlow Condensed',sans-serif;color:var(--blue)}
.roadmap{display:grid;grid-template-columns:280px 1fr;gap:32px;padding:46px 0 0}
.roadmap h2{margin:8px 0 0;font:600 28px 'Barlow Condensed',sans-serif;text-transform:uppercase}
.roadmap-list{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--border)}
.roadmap-list span{display:flex;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px solid var(--border);color:#A9B3BA;font-size:12px}
.roadmap-list span:nth-child(odd){padding-right:20px}
.roadmap-list span:nth-child(even){padding-left:20px;border-left:1px solid var(--border)}
.roadmap-list b{color:#66737C;font:500 8px 'IBM Plex Mono',monospace}

/* Workspace frame */
.workspace-shell{
  min-height:calc(100vh - 99px);display:grid;
  grid-template-columns:286px minmax(520px,1fr) 306px;
  align-items:stretch
}
.home-mode .workspace-shell,.home-mode footer{display:none}
body:not(.home-mode) .home{display:none}
.guide,.inspector{min-width:0;background:var(--panel)}
.guide{border-right:1px solid var(--border);transition:width .15s}
.inspector{border-left:1px solid var(--border)}
.panel-bar{
  height:39px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;
  border-bottom:1px solid var(--border);color:#AAB3B9;font:500 9px 'IBM Plex Mono',monospace;letter-spacing:.8px
}
.panel-bar button{width:25px;height:25px;border:1px solid var(--border);background:transparent;color:var(--text);font:18px/1 sans-serif}
.panel-bar>span:last-child{color:var(--success)}
.guide-body{height:calc(100vh - 97px);display:flex;flex-direction:column;overflow:auto}
.back-home{display:block;padding:15px 15px 12px;border-bottom:1px solid var(--border);color:var(--muted);font:500 10px 'IBM Plex Mono',monospace;text-decoration:none}
.back-home:hover{color:var(--blue)}
#lab-nav{display:grid;padding:8px;border-bottom:1px solid var(--border)}
.lab-link{
  display:grid;grid-template-columns:27px 1fr 8px;gap:8px;align-items:center;
  padding:10px 8px;border:1px solid transparent;text-decoration:none
}
.lab-link:hover{background:#1B232A}
.lab-link.active{border-color:#46556A;background:var(--blue-dim)}
.lab-icon{color:#65727C;font:500 11px 'IBM Plex Mono',monospace}
.lab-link.active .lab-icon,.lab-link.active .arrow{color:var(--blue)}
.lab-link strong{display:block;font-size:11px;font-weight:600}
.lab-link small{display:block;margin-top:3px;color:var(--muted);font:400 8px/1.3 'IBM Plex Mono',monospace;text-transform:uppercase}
.lab-link .arrow{color:#62707A}
.notebook{display:flex;flex-direction:column;min-height:0;flex:1}
.notebook-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:15px 13px 10px}
.notebook-heading span{display:block;color:var(--muted);font:500 8px 'IBM Plex Mono',monospace;letter-spacing:1px}
.notebook-heading strong{display:block;margin-top:5px;font:600 17px 'Barlow Condensed',sans-serif;text-transform:uppercase}
.icon-button,.syllabus-button{border:1px solid var(--border);background:transparent;color:#AEB8BF;font:500 9px 'IBM Plex Mono',monospace}
.icon-button{padding:7px}
.tabs{display:grid;grid-template-columns:repeat(2,1fr);gap:0;padding:0 12px}
.tabs button{
  padding:8px 7px;border:1px solid var(--border);margin:-1px 0 0 -1px;background:transparent;
  color:var(--muted);font-size:10px;text-align:left
}
.tabs button[aria-selected=true]{position:relative;z-index:1;border-color:var(--blue);background:var(--blue-dim);color:var(--text)}
.tabs span{font:500 8px 'IBM Plex Mono',monospace;color:var(--blue)}
#notebook-content{padding:14px 13px 22px;overflow:auto}
.objective,.theory{margin:0 0 15px;color:#B8C0C5;font-size:11px;line-height:1.62}
.procedure{display:grid;gap:13px}
.procedure article{display:grid;grid-template-columns:25px 1fr;gap:9px;padding-top:12px;border-top:1px solid var(--border-soft)}
.procedure b{color:var(--blue);font:500 9px 'IBM Plex Mono',monospace}
.procedure p{margin:0;color:#B8C0C5;font-size:11px;line-height:1.55}
.model-note{padding:10px;border:1px solid var(--border);background:#11171C;color:#AEB7BD;font-size:10px;line-height:1.6}
.graph{width:100%;height:180px;border:1px solid var(--border);background:#10161B}
.graph-note{margin:8px 0;color:var(--muted);font:9px/1.6 'IBM Plex Mono',monospace}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse;white-space:nowrap;font:9px 'IBM Plex Mono',monospace}
th,td{padding:8px 6px;border-bottom:1px solid var(--border);text-align:left}
th{color:var(--muted);font-weight:500}
.empty{padding:22px 8px;text-align:center;color:var(--muted);font:10px/1.5 'IBM Plex Sans',sans-serif}
.table-actions{display:flex;justify-content:space-between;gap:8px;margin-top:8px}
.table-actions button{border:0;background:none;color:var(--blue);font-size:9px}
.quiz{padding:0 0 13px;margin:0 0 13px;border-bottom:1px solid var(--border)}
.quiz strong{font-size:11px;line-height:1.5}
.quiz .answers{display:grid;gap:5px;margin-top:8px}
.quiz button{padding:7px;border:1px solid var(--border);background:#11171C;color:var(--text);font-size:10px;text-align:left}
.quiz button.correct{border-color:var(--success);background:var(--success-dim)}
.quiz button.wrong{border-color:var(--fault);background:var(--fault-dim)}
.quiz p{color:var(--muted);font-size:10px;line-height:1.5}
.syllabus-button{margin:auto 12px 14px;padding:10px;text-align:left}
.syllabus-button:hover,.icon-button:hover{border-color:var(--blue);color:var(--blue)}
.guide-collapsed .workspace-shell{grid-template-columns:42px minmax(520px,1fr) 306px}
.guide-collapsed .guide-body{display:none}
.guide-collapsed .guide .panel-bar{padding:0;justify-content:center}
.guide-collapsed .guide .panel-bar>span{display:none}
.guide-collapsed #guide-toggle{transform:rotate(180deg)}

/* Main workbench */
.workspace{min-width:0;padding:18px;background:var(--bg)}
.workspace-title{min-height:68px;display:flex;align-items:end;justify-content:space-between;gap:15px;margin-bottom:14px}
.workspace-title h1{margin:3px 0 3px;font:600 clamp(27px,3vw,41px)/1 'Barlow Condensed',sans-serif;letter-spacing:.3px;text-transform:uppercase}
.workspace-title>div>p:last-child{margin:0;color:var(--muted);font-size:12px}
.workspace-meta{display:flex;align-items:center;gap:10px;padding-bottom:5px}
.workspace-meta span{font:600 23px 'Barlow Condensed',sans-serif;color:#6D7A83}
.workspace-meta span small{font:500 10px 'IBM Plex Mono',monospace}
.workspace-meta b{padding:5px 7px;border:1px solid #315446;color:var(--success);font:500 8px 'IBM Plex Mono',monospace}
.workbench{position:relative;overflow:hidden;border:1px solid var(--border);background:var(--workbench)}
.bench-toolbar{height:40px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:15px;padding:0 10px;border-bottom:1px solid var(--border);background:#11171C}
.bench-toolbar>span:first-child{font:500 9px 'IBM Plex Mono',monospace;white-space:nowrap}
.bench-toolbar>span:nth-child(2){overflow:hidden;color:#7E8B94;font:400 9px 'IBM Plex Mono',monospace;text-align:center;text-overflow:ellipsis;white-space:nowrap}
.bench-toolbar>div{display:flex;gap:5px}
.bench-toolbar button{padding:5px 7px;border:1px solid var(--border);background:transparent;color:#B6C0C6;font:500 9px 'IBM Plex Mono',monospace}
.bench-toolbar button:hover,.bench-toolbar button[aria-pressed=true]{border-color:var(--blue);color:var(--blue)}
#scene{height:clamp(490px,calc(100vh - 288px),720px);touch-action:none}
#scene canvas{display:block;width:100%;height:100%}
.bench-caption{height:27px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;border-top:1px solid var(--border);background:#11171C;color:#75838C;font:500 8px 'IBM Plex Mono',monospace}
#loading{position:absolute;inset:40px 0 27px;display:grid;place-items:center;background:var(--workbench);color:var(--blue);font:500 10px 'IBM Plex Mono',monospace}
.readings{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:10px;border:1px solid var(--border);background:#11171C}
.readings>div{min-width:0;padding:10px 12px;border-right:1px solid var(--border)}
.readings>div:last-child{border:0}
.readings small{display:block;color:#74818A;font:500 8px 'IBM Plex Mono',monospace;letter-spacing:.6px}
.readings strong{display:block;margin-top:5px;color:var(--text);font:500 clamp(17px,2vw,24px) 'IBM Plex Mono',monospace;white-space:nowrap}
.readings i{font:400 10px 'IBM Plex Mono',monospace;color:var(--muted);font-style:normal}
.diagnostic{position:absolute;z-index:5;left:12px;top:54px;width:min(700px,calc(100% - 24px));display:flex;gap:12px;align-items:flex-start;margin:0;padding:11px 14px;border:1px solid #493236;border-left:3px solid var(--fault);border-radius:11px;background:#17191DEB;box-shadow:0 8px 24px #0003;backdrop-filter:blur(8px);pointer-events:none}
.diagnostic.good{border-color:#315446;border-left-color:var(--success);background:#17201CEB}
.diagnostic-symbol{width:20px;height:20px;display:grid;place-items:center;flex-shrink:0;border:1px solid #8F514F;border-radius:50%;color:#FF8E86;font:700 11px 'Inter',sans-serif}
.diagnostic.good .diagnostic-symbol{border-color:var(--success);color:var(--success)}
.diagnostic-copy{min-width:0}
.diagnostic strong{color:#FF8E86;font:800 10px 'Manrope',sans-serif;letter-spacing:.045em}
.diagnostic.good strong{color:var(--success)}
.diagnostic p{margin:4px 0 0;color:#E1E3E5;font:500 12px/1.5 'Inter',sans-serif}
.diagnostic-fix{display:block;margin-top:5px;color:#B8C0C5;font:600 10px/1.4 'Manrope',sans-serif}
#precision-view{overflow:auto;margin-top:10px;border:1px solid var(--border);background:#10161B}
.section-label{display:flex;justify-content:space-between;gap:10px;padding:9px 11px;border-bottom:1px solid var(--border);color:var(--muted);font:500 9px 'IBM Plex Mono',monospace}
#precision-canvas{display:block;width:100%;height:180px;touch-action:none;filter:brightness(.72) contrast(1.08)}
#precision-help{margin:0;padding:8px 11px 11px;color:var(--muted);font-size:10px;line-height:1.5}

/* Inspector */
.inspector-body{height:calc(100vh - 97px);overflow:auto;padding:14px}
.inspect-card{padding:12px;border:1px solid var(--border);background:#11171C}
.inspect-card h2{margin:8px 0 6px;font:600 19px/1.1 'Barlow Condensed',sans-serif;text-transform:uppercase}
.inspect-card p,.control-heading p{margin:0;color:var(--muted);font-size:10px;line-height:1.55}
.control-heading{padding:20px 0 10px}
.control-heading p{margin-top:6px}
.control{padding:12px 0;border-top:1px solid var(--border-soft)}
.control label,.control>strong{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#D8DDE0;font-size:11px;font-weight:500}
.control output{color:var(--blue);font:500 9px 'IBM Plex Mono',monospace;white-space:nowrap}
.control p,.control-note{margin:6px 0 0;color:var(--muted);font-size:10px;line-height:1.5}
.control input[type=range]{width:100%;height:4px;margin:13px 0 1px;accent-color:var(--blue)}
.control input[type=checkbox]{width:17px;height:17px;margin:0;accent-color:var(--blue)}
.control input[type=number],.control select{width:100%;margin-top:8px;padding:8px;border:1px solid var(--border);border-radius:0;background:#0F1419;color:var(--text);font:10px 'IBM Plex Mono',monospace}
.control button{padding:8px;border:1px solid var(--border);border-radius:0;background:#11171C;color:#CBD2D6;font-size:10px}
.control button:hover{border-color:var(--blue);color:var(--blue)}
.control button.wide{width:100%;margin-top:7px}
.control .row{display:flex;gap:6px;margin-top:8px}
.control .row>*{flex:1;min-width:0}
.control details{margin-top:8px}
.control summary{cursor:pointer}
.wire-guide{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:9px}
.wire-guide button{padding:6px 4px;text-align:left;white-space:nowrap;font:500 8px 'IBM Plex Mono',monospace}
.wire-guide button.connected{border-color:#39745C;background:var(--success-dim);color:var(--success)}
.primary{width:100%;display:flex;justify-content:space-between;padding:11px 12px;margin-top:14px;border:1px solid var(--blue);border-radius:0;background:var(--blue);color:#10151A;font:600 10px 'IBM Plex Mono',monospace}
.primary:not(:disabled):hover{background:#A6BAFC}
.reset-button{width:100%;padding:10px 0;margin-top:8px;border:0;border-bottom:1px solid var(--border);background:none;color:#7D8991;font:500 9px 'IBM Plex Mono',monospace;text-align:left}
.toast{color:var(--blue)!important}

footer{height:41px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 18px;border-top:1px solid var(--border);background:#10161B;color:#68757E;font:500 8px 'IBM Plex Mono',monospace;letter-spacing:.7px}
dialog{width:calc(100% - 30px);max-width:690px;padding:25px;border:1px solid var(--border);background:var(--panel);color:var(--text);box-shadow:0 25px 80px #000b}
dialog::backdrop{background:#05080bdd}
dialog h2{margin:9px 0;font:600 32px 'Barlow Condensed',sans-serif;text-transform:uppercase}
dialog p{color:#AEB7BD;font-size:12px;line-height:1.6}
.dialog-close{float:right;border:1px solid var(--border);background:transparent;color:var(--text);font-size:20px}
#curriculum-list article{padding:12px 0;border-top:1px solid var(--border)}
#curriculum-list h3{margin:5px 0;font:600 17px 'Barlow Condensed',sans-serif;text-transform:uppercase}
#curriculum-list small{color:var(--blue);font:500 9px 'IBM Plex Mono',monospace}
dialog a{color:var(--blue);font:500 10px 'IBM Plex Mono',monospace}

@media(max-width:1180px){
  .workspace-shell{grid-template-columns:250px minmax(470px,1fr) 270px}
  .guide-collapsed .workspace-shell{grid-template-columns:42px minmax(470px,1fr) 270px}
  .workspace{padding:13px}
  #scene{height:clamp(440px,calc(100vh - 275px),650px)}
}
@media(max-width:930px){
  .top-context{display:none}
  .workspace-shell,.guide-collapsed .workspace-shell{grid-template-columns:1fr}
  .guide{border:0;border-bottom:1px solid var(--border)}
  .guide .panel-bar{display:flex}
  .guide-body{height:auto;max-height:460px}
  .guide-collapsed .guide-body{display:none}
  .guide-collapsed .guide .panel-bar{justify-content:space-between;padding:0 12px}
  .guide-collapsed .guide .panel-bar>span{display:block}
  .inspector{border-left:0;border-top:1px solid var(--border)}
  .inspector-body{height:auto}
  #lab-nav{grid-template-columns:1fr 1fr}
  .notebook{min-height:330px}
  .home-intro{grid-template-columns:1fr;gap:28px}
  .home-intro>p{max-width:650px}
}
@media(max-width:620px){
  .topbar{height:54px;padding:0 11px}
  .brand-mark{width:28px;height:28px}
  .brand strong{font-size:17px}
  .brand small{font-size:7px}
  .team{font-size:8px}.team small{display:none}
  .home{padding:34px 14px 45px}
  .home-intro{padding-bottom:31px}
  .home-intro h1{font-size:58px}
  .home-intro>p{font-size:14px}
  .library-header{align-items:start}
  .library-header p{display:none}
  .experiment-list{grid-template-columns:1fr}
  .home-lab,.home-lab:nth-child(odd){min-height:134px;padding:19px 10px;border-right:0}
  .home-lab{grid-template-columns:42px 1fr 20px}
  .home-lab h2{font-size:24px}
  .roadmap{grid-template-columns:1fr;gap:20px}
  .roadmap-list{grid-template-columns:1fr}
  .roadmap-list span:nth-child(even){padding-left:0;border-left:0}
  .workspace{padding:10px}
  .workspace-title{align-items:start}
  .workspace-title h1{font-size:29px}
  .workspace-title>div>p:last-child{font-size:10px}
  .workspace-meta b{display:none}
  .bench-toolbar{height:auto;min-height:63px;grid-template-columns:1fr auto;padding:7px}
  .bench-toolbar>span:nth-child(2){grid-column:1/-1;grid-row:2;text-align:left}
  #scene{height:390px}
  #loading{inset:63px 0 27px}
  .readings{grid-template-columns:1fr 1fr}
  .readings>div:nth-child(2){border-right:0}
  .readings>div:nth-child(-n+2){border-bottom:1px solid var(--border)}
  .readings strong{font-size:18px}
  #lab-nav{grid-template-columns:1fr}
  .wire-guide button{font-size:8px}
  footer{font-size:7px}
  footer span:last-child{display:none}
  #precision-view[data-kind=mechanical] #precision-canvas{min-width:700px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.guide{transition:none}}

/* LabFault catalog refinement */
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,sans-serif;font-size:14px;line-height:1.55}
button,input,select{font-family:'Manrope',sans-serif}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline-color:var(--blue)}
h1,h2,h3,.brand strong,.home-lab h2,.notebook-heading strong{font-family:'Manrope',sans-serif;text-transform:none;letter-spacing:-.025em}
.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}
.topbar{height:70px;padding:0 clamp(18px,3vw,48px);background:#131519;border-color:#292D32}
.brand{gap:12px}
.brand-mark{width:37px;height:37px;border-radius:11px;border-color:#704026;background:#2D211B;color:var(--blue);font:700 12px 'Manrope',sans-serif}
.brand strong{font-size:18px;line-height:1.1;letter-spacing:-.03em}
.brand small{font:600 9px 'Manrope',sans-serif;letter-spacing:.08em;color:var(--muted)}
.site-nav{display:flex;align-items:center;gap:30px;margin-right:auto;margin-left:clamp(30px,5vw,84px)}
.site-nav a{font:600 13px 'Manrope',sans-serif;text-decoration:none;color:#D2D6DA}
.site-nav a:hover{color:var(--blue)}
.top-context{font:500 10px 'Manrope',sans-serif;letter-spacing:0}
.system-status{color:var(--success)}
.team{font:700 11px 'Manrope',sans-serif;letter-spacing:0}
.team small{font:500 9px 'Inter',sans-serif}
.kicker,.section-tag{color:var(--blue);font:700 10px/1.4 'Manrope',sans-serif;letter-spacing:.13em}

/* Apparatus-led homepage */
.home{max-width:none;min-height:calc(100vh - 70px);padding:0 0 75px}
.home-hero{position:relative;min-height:530px;overflow:hidden;background:#121416;border-bottom:1px solid #282D32}
#hero-scene{position:absolute;inset:0 0 0 38%;background:#17191C}
#hero-scene canvas{display:block;width:100%;height:100%;cursor:grab}
#hero-scene canvas:active{cursor:grabbing}
.hero-copy{position:relative;z-index:2;width:43%;min-height:530px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:50px 4vw 80px 5vw;background:#121416}
.hero-copy h1{max-width:650px;margin:19px 0 19px;font:800 clamp(44px,5vw,76px)/1.07 'Manrope',sans-serif;letter-spacing:-.06em}
.hero-copy>p:last-child{max-width:470px;margin:0;color:var(--muted);font-size:16px;line-height:1.7}
.hero-badge{position:absolute;z-index:2;right:26px;bottom:26px;display:flex;flex-direction:column;gap:3px;padding:12px 16px;border:1px solid #414248;border-radius:12px;background:#15171BEC;color:#A9B0B7;font:600 9px 'Manrope',sans-serif;letter-spacing:.07em}
.hero-badge strong{color:var(--text);font-size:12px;letter-spacing:0}
.hero-badge span{font:400 10px 'Inter',sans-serif;letter-spacing:0}
.hero-open{position:absolute;z-index:3;left:5vw;bottom:36px;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:13px 17px;border-radius:11px;background:var(--blue);color:#15110F;font:800 12px 'Manrope',sans-serif;text-decoration:none}
.hero-open:hover{background:#FF954B;box-shadow:0 8px 28px #0005}
.lab-search{position:relative;z-index:4;max-width:690px;display:flex;align-items:center;gap:12px;margin:-31px auto 30px;padding:7px 8px 7px 20px;border:1px solid #474B50;border-radius:999px;background:#F3F4F6;box-shadow:0 17px 40px #0006}
.lab-search>span{color:#515B63;font:30px/1 'Manrope',sans-serif}
.lab-search input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#1B2024;font:500 15px 'Inter',sans-serif}
.lab-search input::placeholder{color:#7B858D}
.lab-search button{padding:11px 19px;border:0;border-radius:999px;background:#191C20;color:var(--text);font:700 12px 'Manrope',sans-serif}
.lab-search button:hover{background:#343A40}
.subject-categories{max-width:1240px;display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:0 auto;padding:0 24px 39px;border-bottom:1px solid var(--border)}
.subject-categories button{min-width:124px;display:flex;align-items:center;justify-content:center;gap:10px;padding:11px 16px;border:1px solid #373C42;border-radius:12px;background:#1B1E22;color:#C9CED2;font:700 12px 'Manrope',sans-serif}
.subject-categories button span{color:var(--blue);font:23px/1 'Manrope',sans-serif}
.subject-categories button:hover{border-color:#8B5634;background:#28221F}
.subject-categories button[aria-pressed=true]{border-color:#9A5A2F;background:#35251B;color:var(--text)}
.library-header{max-width:1240px;align-items:center;margin:0 auto;padding:51px 0 22px;border:0}
.library-header>div{gap:14px;font:800 25px 'Manrope',sans-serif;letter-spacing:-.035em}
.library-header small{padding:6px 10px;border-color:#4B3A2E;border-radius:999px;background:#30231C;color:#F6A065;font:700 10px 'Manrope',sans-serif}
.library-header p{font-size:13px;color:var(--muted)}
.experiment-list{max-width:1240px;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:0 auto}
.home-lab,.home-lab:nth-child(odd){min-height:0;display:block;padding:15px;border:1px solid #34383D;border-radius:14px;background:var(--panel);box-shadow:0 12px 28px #0002;text-decoration:none}
.home-lab:hover{border-color:#86553A;background:#1E2125;box-shadow:0 16px 38px #0005;transform:translateY(-2px)}
.card-top,.card-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px}
.card-top{padding:0 2px 12px}
.home-lab .number{font:800 13px 'Manrope',sans-serif;color:#AAB1B6}
.card-status{padding:5px 9px;border-radius:999px;background:#23332C;color:#96D6B3;font:700 9px 'Manrope',sans-serif}
.card-visual{height:190px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;border:1px solid #3B4148;border-radius:11px;background:#20252A center/cover no-repeat}
.card-visual::after{content:'';position:absolute;inset:auto 0 0;height:37px;background:#13171AD9}
.card-visual>span:last-child{position:absolute;z-index:1;bottom:9px;left:13px;color:#DBE0E2;font:700 9px 'Manrope',sans-serif;letter-spacing:.08em}
.visual-glyph{color:#A36845;font:100px/1 'Manrope',sans-serif}
.card-visual.has-preview .visual-glyph{display:none}
.home-lab .subject{display:block;margin-top:17px;color:#F3A46E;font:700 10px 'Manrope',sans-serif;letter-spacing:.07em}
.home-lab h2{margin:7px 0 6px;font:800 23px/1.3 'Manrope',sans-serif}
.home-lab p{min-height:42px;margin:0;color:var(--muted);font-size:13px;line-height:1.58}
.card-bottom{margin-top:17px;padding:13px 2px 1px;border-top:1px solid var(--border);color:var(--muted);font-size:11px}
.card-bottom strong{color:var(--blue);font:700 12px 'Manrope',sans-serif}
.search-empty{max-width:1240px;margin:0 auto;padding:35px;border:1px dashed var(--border);border-radius:12px;color:var(--muted);text-align:center}
.roadmap{max-width:1240px;grid-template-columns:250px 1fr;margin:52px auto 0;padding:31px 0 0;border-top:1px solid var(--border)}
.roadmap h2{font:800 21px 'Manrope',sans-serif;letter-spacing:-.03em}
.roadmap-list{border:0;gap:8px 16px}
.roadmap-list span,.roadmap-list span:nth-child(even),.roadmap-list span:nth-child(odd){align-items:center;padding:11px 13px;border:1px solid var(--border);border-radius:10px;background:#181B1F;color:var(--muted);font-size:12px}
.roadmap-list b{color:#B8BEC3;font:700 9px 'Manrope',sans-serif}

/* Softer workstation */
.workspace-shell{grid-template-columns:286px minmax(470px,1fr) 306px;gap:10px;padding:10px;background:var(--bg)}
.guide,.inspector{overflow:hidden;border:1px solid var(--border);border-radius:12px;background:var(--panel)}
.panel-bar{height:43px;padding:0 13px;color:#CED3D7;font:700 10px 'Manrope',sans-serif;letter-spacing:.03em}
.panel-bar button{width:27px;height:27px;border-radius:8px;background:#25292E;font-size:17px}
.panel-bar button:hover{border-color:var(--blue);color:var(--blue)}
.guide-body,.inspector-body{height:calc(100vh - 123px)}
.back-home{font:600 11px 'Manrope',sans-serif}
#lab-nav{gap:3px;padding:9px}
.lab-link{border-radius:9px;padding:11px 9px}
.lab-link:hover{background:#262A2F}
.lab-link.active{border-color:#684531;background:#32251D}
.lab-icon,.lab-link small,.lab-link .arrow{color:#A5ADB4}
.lab-link.active .lab-icon,.lab-link.active .arrow{color:var(--blue)}
.lab-link strong{font:700 12px 'Manrope',sans-serif}
.lab-link small{font:500 9px/1.4 'Inter',sans-serif}
.notebook-heading{padding:17px 13px 12px}
.notebook-heading span{font:700 9px 'Manrope',sans-serif}
.notebook-heading strong{font-size:14px;line-height:1.3}
.icon-button,.syllabus-button{border-radius:8px;font:700 10px 'Manrope',sans-serif}
.tabs{gap:4px;padding:0 11px}
.tabs button{margin:0;padding:9px 8px;border-radius:8px;font:600 11px 'Manrope',sans-serif}
.tabs span{font-size:9px}
#notebook-content{padding:16px 13px 22px}
.objective,.theory,.procedure p{color:#C4CAD0;font-size:12px;line-height:1.65}
.procedure b{color:var(--blue)}
.model-note,.graph,.quiz button{border-radius:9px;background:#21252A}
.quiz button{font-size:11px}
.workspace{padding:8px 10px 18px;background:var(--bg)}
.workspace-title{margin:4px 0 15px}
.workspace-title h1{font:800 clamp(24px,2.6vw,33px)/1.2 'Manrope',sans-serif;letter-spacing:-.04em}
.workspace-title>div>p:last-child{font-size:13px}
.workspace-meta span{font:800 22px 'Manrope',sans-serif}
.workspace-meta b{border-radius:999px;padding:6px 9px;font:700 9px 'Manrope',sans-serif}
.workbench{border-radius:13px}
.bench-toolbar{height:44px;background:#202328}
.bench-toolbar>span:first-child,.bench-toolbar>span:nth-child(2){font:600 10px 'Manrope',sans-serif;color:#C4CACF}
.bench-toolbar button{border-radius:7px;padding:6px 9px;font:700 10px 'Manrope',sans-serif}
#scene{height:clamp(480px,calc(100vh - 275px),760px)}
.bench-caption{height:30px;background:#202328;font:700 9px 'Manrope',sans-serif}
#loading{inset:44px 0 30px}
.readings{gap:8px;margin-top:10px;border:0;background:none}
.readings>div,.readings>div:last-child{padding:12px 13px;border:1px solid var(--border);border-radius:10px;background:var(--panel)}
.readings small{color:var(--muted);font:700 9px 'Manrope',sans-serif}
.readings strong{font-family:'IBM Plex Mono',monospace;font-size:20px}
.diagnostic{border-radius:10px;padding:13px}
.diagnostic strong{font:800 10px 'Manrope',sans-serif}
.diagnostic p{font-size:12px;line-height:1.55}
#precision-view{border-radius:11px}
.inspector-body{padding:13px}
.inspect-card{padding:14px;border-radius:10px;background:#22262B}
.inspect-card h2{font:800 15px/1.35 'Manrope',sans-serif}
.inspect-card p,.control-heading p,.control p,.control-note{font-size:11px;line-height:1.6}
.control{padding:14px 0}
.control label,.control>strong{font:700 12px 'Manrope',sans-serif}
.control output{font:600 11px 'IBM Plex Mono',monospace}
.control input[type=number],.control select,.control button{border-radius:8px;background:#22262B;color:#DBE0E3;font-size:11px}
.control input[type=number],.control select{padding:10px}
.control button{padding:9px}
.wire-guide{gap:6px}
.wire-guide button{font:600 9px 'Manrope',sans-serif}
.primary{border-radius:9px;background:var(--blue);font:800 11px 'Manrope',sans-serif}
.primary:not(:disabled):hover{background:#FF9550}
.reset-button{font:700 10px 'Manrope',sans-serif}
.guide-collapsed .workspace-shell{grid-template-columns:42px minmax(470px,1fr) 306px}
.inspector-collapsed .workspace-shell{grid-template-columns:286px minmax(470px,1fr) 42px}
.guide-collapsed.inspector-collapsed .workspace-shell{grid-template-columns:42px minmax(470px,1fr) 42px}
.inspector-collapsed .inspector-body{display:none}
.inspector-collapsed .inspector .panel-bar{padding:0;justify-content:center}
.inspector-collapsed .inspector .panel-bar>span{display:none}
.inspector-collapsed #inspector-toggle{transform:rotate(180deg)}
dialog{border-radius:14px}
dialog h2,#curriculum-list h3{font-family:'Manrope',sans-serif}
.dialog-close{border-radius:8px}
footer{height:43px;background:#15171A;color:#A9B0B7;font:600 9px 'Manrope',sans-serif}

@media(max-width:1250px){
  .library-header,.experiment-list,.roadmap{margin-left:28px;margin-right:28px}
  .workspace-shell{grid-template-columns:238px minmax(430px,1fr) 264px}
  .guide-collapsed .workspace-shell{grid-template-columns:42px minmax(430px,1fr) 264px}
  .inspector-collapsed .workspace-shell{grid-template-columns:238px minmax(430px,1fr) 42px}
  .guide-collapsed.inspector-collapsed .workspace-shell{grid-template-columns:42px minmax(430px,1fr) 42px}
}
@media(max-width:950px){
  .site-nav{margin-left:25px;gap:14px}
  .hero-copy{width:53%}
  #hero-scene{left:45%}
  .workspace-shell,.guide-collapsed .workspace-shell,.inspector-collapsed .workspace-shell,.guide-collapsed.inspector-collapsed .workspace-shell{grid-template-columns:1fr}
  .guide-collapsed .guide,.inspector-collapsed .inspector{min-height:43px}
  .inspector-collapsed .inspector .panel-bar{justify-content:space-between;padding:0 13px}
  .inspector-collapsed .inspector .panel-bar>span{display:block}
  .readings>div:nth-child(2){border:1px solid var(--border)}
  .readings>div:nth-child(-n+2){border:1px solid var(--border)}
}
@media(max-width:680px){
  .topbar{height:62px;padding:0 14px}
  .site-nav,.top-context{display:none}
  .home-hero{min-height:610px}
  #hero-scene{inset:0 0 170px 0}
  .hero-copy{width:100%;min-height:0;padding:35px 24px 18px;background:#121416E8}
  .hero-copy h1{font-size:41px;max-width:360px}
  .hero-copy>p:last-child{max-width:340px;font-size:13px}
  .hero-badge{right:14px;bottom:92px}
  .hero-open{left:20px;bottom:19px}
  .lab-search{margin:-25px 14px 23px;padding-left:13px}
  .lab-search input{font-size:13px}
  .lab-search button{padding:10px 12px;font-size:10px}
  .subject-categories{gap:7px;padding:0 12px 24px}
  .subject-categories button{min-width:0;padding:9px 11px;font-size:10px}
  .subject-categories button span{font-size:18px}
  .library-header{margin:0 16px;padding:33px 0 18px}
  .library-header>div{font-size:21px}
  .experiment-list{grid-template-columns:1fr;gap:13px;margin:0 14px}
  .card-visual{height:170px}
  .roadmap{grid-template-columns:1fr;gap:20px;margin:39px 16px 0}
  .roadmap-list{grid-template-columns:1fr}
  .workspace-shell{padding:7px;gap:7px}
  .workspace{padding:4px}
  #scene{height:400px}
  .readings{grid-template-columns:1fr 1fr}
  .readings strong{font-size:17px}
  footer{font-size:8px}
}
@media(prefers-reduced-motion:reduce){.home-lab:hover{transform:none}}

/* Supplied LabFault wordmark */
.brand{width:210px;height:58px;flex:none;display:grid;place-items:center;overflow:hidden;border:0;border-radius:0;background:transparent}
.brand-logo{display:block;width:210px;height:68px;object-fit:cover;object-position:center}
@media(max-width:680px){
  .brand{width:170px;height:48px}
  .brand-logo{width:170px;height:55px}
}

/* Apparatus learning and restrained interaction feedback */
#scene{position:relative;min-height:460px}
#scene canvas{display:block;touch-action:none}
#part-hint{position:absolute;bottom:16px;left:16px;z-index:2;pointer-events:none;background:#131619ed;color:#F3F4F6;border:1px solid #393e44;border-radius:10px;padding:9px 13px;font-size:12px;max-width:calc(100% - 32px)}
.part-picker{display:block;font-size:12px;font-weight:600;color:#A9B0B7;margin-bottom:14px}
.part-picker select{display:block;width:100%;margin-top:8px;padding:12px 10px;border:1px solid #3b4148;border-radius:10px;background:#191C20;color:#F3F4F6;font:12px 'Inter',sans-serif}
.inspect-card h2{font-size:18px;line-height:1.4;text-transform:none}
.inspect-card p{font-size:13px;line-height:1.7;color:#c5cbd1}
.inspect-card h3{font:600 12px 'Manrope',sans-serif;color:#F47B20;margin:18px 0 6px}
.inspector{scroll-margin-top:12px}
button,a,select{transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease}
button:active{transform:translateY(1px)}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #F47B20;outline-offset:3px}
@media(max-width:950px){.guide-body{max-height:280px}.inspector-body{height:auto;max-height:none}#scene{height:460px;min-height:0}.bench-toolbar{flex-wrap:wrap;gap:8px}.bench-toolbar>span:nth-child(2){display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}button:active{transform:none}}

#mobile-inspection{display:none}
@media(max-width:950px){#mobile-inspection:not([hidden]){display:block;position:absolute;bottom:12px;left:12px;right:12px;padding:14px;z-index:3;background:#191c20f5;border:1px solid #50565e;border-radius:12px;box-shadow:0 8px 28px #0004}#mobile-inspection strong{font-size:14px}#mobile-inspection p{font-size:13px;line-height:1.5;margin:7px 25px 10px 0}#mobile-inspection button{padding:6px 9px;border:1px solid #464c54;border-radius:8px;background:#252a30;color:#f3f4f6}#mobile-inspection-close{position:absolute;right:8px;top:8px}}

/* Keep each workstation rail to one predictable, polished scroll region. */
@media(min-width:951px){
  .guide,.inspector{
    align-self:start;position:sticky;top:68px;display:flex;flex-direction:column;
    height:calc(100vh - 78px);height:calc(100dvh - 78px)
  }
  .guide-body,.inspector-body{height:auto;min-height:0;flex:1 1 auto;overflow-y:auto;overflow-x:hidden}
  #notebook-content{overflow:visible}
}
.guide-body,.inspector-body{
  scrollbar-width:thin;scrollbar-color:#5B6269 transparent;scrollbar-gutter:stable
}
.guide-body::-webkit-scrollbar,.inspector-body::-webkit-scrollbar{width:8px}
.guide-body::-webkit-scrollbar-track,.inspector-body::-webkit-scrollbar-track{background:transparent}
.guide-body::-webkit-scrollbar-thumb,.inspector-body::-webkit-scrollbar-thumb{
  min-height:38px;border:2px solid var(--panel);border-radius:999px;background:#5B6269
}
.guide-body::-webkit-scrollbar-thumb:hover,.inspector-body::-webkit-scrollbar-thumb:hover{background:#7A828A}
@media(max-width:950px){
  .workspace-shell{align-items:start;min-height:0}
  .guide,.inspector{position:static;height:auto;display:block}
  .guide,.workspace,.inspector{width:100%;align-self:start}
  .guide-body,.inspector-body{height:auto;max-height:none;overflow:visible;scrollbar-gutter:auto}
  #notebook-content{overflow:visible}
}

/* The lab record uses the full workbench column for legible experiment notes. */
.workspace>.notebook{
  display:block;min-height:0;flex:none;margin-top:20px;overflow:hidden;
  border:1px solid var(--border);border-radius:12px;background:var(--panel)
}
.workspace>.notebook .notebook-heading{padding:17px 18px 14px}
.workspace>.notebook .notebook-heading span{font:700 10px 'Manrope',sans-serif;color:var(--blue)}
.workspace>.notebook .notebook-heading strong{font:700 17px/1.35 'Manrope',sans-serif;color:var(--text)}
.workspace>.notebook .icon-button{padding:8px 11px;border-radius:8px}
.workspace>.notebook .tabs{grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;padding:0 17px 13px}
.workspace>.notebook .tabs button{min-width:0;margin:0;padding:10px 12px;border:1px solid var(--border);border-radius:9px;background:#1B1F23;color:#BCC3C8;font:600 12px 'Manrope',sans-serif;text-align:center}
.workspace>.notebook .tabs button[aria-selected=true]{border-color:#8B5634;background:#35251B;color:var(--text)}
.workspace>.notebook .tabs span{font:600 10px 'IBM Plex Mono',monospace}
.workspace>.notebook #notebook-content{min-height:210px;padding:19px 18px 22px;border-top:1px solid var(--border);overflow:visible}
.workspace>.notebook .objective,.workspace>.notebook .theory,.workspace>.notebook .procedure p{font-size:14px;line-height:1.7;color:#C4CAD0}
.workspace>.notebook .objective{max-width:760px;margin-bottom:20px}
.workspace>.notebook .procedure{max-width:900px;gap:14px}
.workspace>.notebook .procedure article{grid-template-columns:34px minmax(0,1fr);gap:12px;padding-top:14px}
.workspace>.notebook .procedure b{font:600 11px 'IBM Plex Mono',monospace}
.workspace>.notebook .model-note{max-width:900px;padding:14px;border-radius:10px;font-size:12px}
.workspace>.notebook .graph{height:270px;border-radius:10px}
.workspace>.notebook .graph-note,.workspace>.notebook .quiz p{font-size:11px;line-height:1.65}
.workspace>.notebook .table-wrap{border:1px solid var(--border);border-radius:9px}
.workspace>.notebook .table-actions button,.workspace>.notebook .quiz button{font:600 11px 'Manrope',sans-serif}
.workspace>.notebook .quiz{padding-bottom:16px;margin-bottom:17px}
@media(max-width:950px){
  .workspace>.notebook{margin-top:18px}
  .workspace>.notebook .tabs{grid-template-columns:repeat(3,minmax(0,1fr));padding:0 12px 12px}
  .workspace>.notebook .tabs button{padding:10px 6px;font-size:11px}
  .workspace>.notebook #notebook-content{padding:16px 14px 20px}
}
@media(max-width:540px){
  .workspace>.notebook .tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .workspace>.notebook .notebook-heading{padding:15px 14px 12px}
  .workspace>.notebook .objective,.workspace>.notebook .theory,.workspace>.notebook .procedure p{font-size:13px}
  .workspace>.notebook .graph{height:230px}
}

/* Step-by-step electrical wiring guide */
.wire-guide-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}
.wire-guide-heading>strong{font:700 13px 'Manrope',sans-serif;color:var(--text)}
.wire-guide-heading>span,.wire-step-tag{color:var(--blue);font:700 9px 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.04em}
.control .wire-safety{margin:5px 0 8px;color:#E7B787;font-size:10px;font-weight:600}
.circuit-diagram{display:block;width:100%;height:auto;max-height:132px;padding:7px 4px;border:1px solid var(--border);border-radius:9px;background:#11171C}
.circuit-diagram .diagram-wire{fill:none;stroke:#7C8B93;stroke-width:2}
.circuit-diagram .diagram-branch{fill:none;stroke:#8FAAFB;stroke-width:1.6;stroke-dasharray:3 3}
.circuit-diagram .diagram-part{fill:#273039;stroke:#D7A76B;stroke-width:1.5}
.circuit-diagram .diagram-meter{fill:#1D2630;stroke:#8FAAFB;stroke-width:1.7}
.circuit-diagram .diagram-battery{fill:none;stroke:#F07870;stroke-width:2}
.circuit-diagram text{fill:#E4E9EC;font:600 10px 'IBM Plex Mono',monospace;text-anchor:middle}
.circuit-diagram .diagram-current{fill:#A9B0B7;font-size:8px}
.wire-current{display:grid;gap:5px;margin-top:9px;padding:10px;border:1px solid #3A4650;border-radius:9px;background:#1D242A}
.wire-current>strong{color:var(--text);font:700 12px/1.4 'Manrope',sans-serif}
.wire-current>small{color:#BAC3C9;font:500 10px/1.5 'Inter',sans-serif}
.wire-current .wire-codes{color:#82919A;font:500 9px 'IBM Plex Mono',monospace}
.wire-current .wire-prompt{color:var(--blue);font-weight:600}
.wire-step-tag.complete{color:var(--success)}
.wire-guide{display:grid;grid-template-columns:1fr;gap:4px;max-height:178px;margin-top:8px;overflow:auto;overscroll-behavior:contain}
.control .wire-step{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:start;gap:7px;width:100%;padding:7px 8px;border:1px solid transparent;border-radius:8px;background:#171D22;color:#D4DBDF;text-align:left;white-space:normal;font:600 10px/1.35 'Manrope',sans-serif}
.control .wire-step:hover{border-color:#59666E;color:var(--text)}
.control .wire-step.active{border-color:#8B5634;background:#30251F;color:var(--text)}
.control .wire-step.connected{color:var(--success)}
.wire-step-number{display:grid;width:20px;height:20px;place-items:center;border-radius:50%;background:#283039;color:#AAB5BC;font:600 9px 'IBM Plex Mono',monospace}
.wire-step.connected .wire-step-number{background:#1D392F;color:var(--success)}
.wire-step>span:last-child{min-width:0}
.control .wire-step small{display:block;margin-top:2px;color:#87939B;font:500 8px/1.35 'IBM Plex Mono',monospace}
.control .wire-step.connected small{color:#80AA96}
.control .wire-step.active small{color:#B5C1C8}
@media(max-width:620px){
  .circuit-diagram{max-height:118px}
  .wire-guide{max-height:155px}
  .wire-current{padding:9px}
  .wire-current>strong{font-size:11px}
}

.mode-switch{display:flex;gap:2px;padding:2px;border:1px solid var(--border);border-radius:10px;background:#14171a}
.bench-toolbar .mode-switch button{border:0;border-radius:7px}
.bench-toolbar .mode-switch button[aria-pressed=true]{background:#3b281b;color:#ff9c51}
body:not(.inspection-mode) .part-picker,body:not(.inspection-mode) .inspect-card{display:none}
.inspection-mode .guide,.inspection-mode #readings,.inspection-mode #precision-view,.inspection-mode .notebook,.inspection-mode #diagnostic,.inspection-mode .control-heading,.inspection-mode #controls,.inspection-mode #record,.inspection-mode #record-note,.inspection-mode #reset{display:none!important}
.inspection-mode .workspace-shell,.inspection-mode.guide-collapsed .workspace-shell{grid-template-columns:minmax(470px,1fr) 310px}
@media(max-width:950px){.inspection-mode .workspace-shell,.inspection-mode.guide-collapsed .workspace-shell{grid-template-columns:1fr}}

.apparatus-tooltip{position:absolute;z-index:6;pointer-events:none;max-width:240px;padding:7px 10px;border:1px solid #424950;border-radius:8px;background:#14181ef5;color:#f3f4f6;box-shadow:0 4px 16px #0004;font:600 12px/1.4 'Manrope',sans-serif}
.apparatus-tooltip[hidden]{display:none}

.practice-mode .guide,.practice-mode .wire-guide-heading,.practice-mode .wire-safety,.practice-mode #wire-current,.practice-mode #wire-guide,.practice-mode #guided,.practice-mode .circuit-diagram,.practice-mode #diagnostic,.practice-mode #part-hint,.practice-mode #precision-help,.practice-mode #calibration-status,.practice-mode .control-heading p{display:none!important}
.practice-mode .workspace-shell,.practice-mode.guide-collapsed .workspace-shell{grid-template-columns:minmax(470px,1fr) 310px}
.practice-mode .notebook [data-tab="procedure"],.practice-mode .notebook [data-tab="theory"],.practice-mode .notebook [data-tab="viva"]{display:none}
.practice-mode #notebook-content[aria-labelledby="tab-procedure"],.practice-mode #notebook-content[aria-labelledby="tab-theory"],.practice-mode #notebook-content[aria-labelledby="tab-viva"]{display:none}
@media(max-width:950px){.practice-mode .workspace-shell,.practice-mode.guide-collapsed .workspace-shell{grid-template-columns:1fr}}

.practice-mode #record-note,.practice-mode #lab-subtitle{display:none}

/* Compact apparatus catalog: clear type, quieter surfaces, and an unobstructed bench. */
.home{padding:24px 28px 64px}
.home-hero{max-width:1320px;margin:0 auto;min-height:430px;border:1px solid #2d3238;border-radius:14px;background:#15181b}
.hero-copy{width:44%;min-height:430px;padding:42px 30px 105px 38px;background:#15181b}
.hero-copy h1{margin:15px 0 19px;font-size:clamp(34px,3.8vw,54px);line-height:1.12;letter-spacing:-.045em;font-weight:750}
.hero-copy .kicker{font-size:10px;letter-spacing:.11em}
.hero-copy>p:last-child{max-width:350px;font-size:15px;line-height:1.75;color:#b5bdc4}
#hero-scene{inset:0 0 0 44%;border-left:1px solid #2d3238;background:#202428}
.hero-open{left:38px;bottom:35px;min-width:210px;padding:14px 18px;font-size:13px;font-weight:700}
.hero-badge{right:18px;bottom:18px;padding:10px 13px;border-color:#3e454c;background:#171b20ee;box-shadow:none}
.hero-badge strong{font-size:12px;font-weight:600}
.lab-search{max-width:780px;margin:28px auto 20px;background:#191c20;border-color:#383e45;box-shadow:none;padding:8px 9px 8px 21px;min-height:58px}
.lab-search>span{color:#a9b0b7}
.lab-search input{color:#f3f4f6;font-size:14px}
.lab-search input::placeholder{color:#a9b0b7}
.lab-search:focus-within{border-color:#d87936;box-shadow:0 0 0 2px #f47b2014}
.lab-search button{background:#30363c;font-weight:600}
.subject-categories{gap:8px;padding:0 0 25px;border:0}
.subject-categories button{min-width:0;padding:10px 15px;background:transparent;border-color:#30363c;font-size:12px;font-weight:600}
.subject-categories button span{font-size:19px;color:#adb5bc}
.subject-categories button[aria-pressed=true]{background:#30241d;border-color:#805031}
.subject-categories button[aria-pressed=true] span{color:#f47b20}
.library-header{padding:22px 0 20px;border-top:1px solid #2b3035}
.library-header>div{font-size:24px;font-weight:700;letter-spacing:-.03em}
.library-header small{background:#1d2923;color:#93c7aa;border-color:#33443b;font-weight:600}
.experiment-list{gap:18px}
.home-lab,.home-lab:nth-child(odd){padding:16px;background:#191c20;border-color:#30363c;box-shadow:none}
.home-lab:hover{transform:none;background:#1d2126;border-color:#5d646b;box-shadow:none}
.card-visual{height:230px;background-color:#252a30;border-color:#353c43}
.card-visual::after{height:32px;background:#15191de8}
.home-lab h2{font-size:21px;font-weight:700;letter-spacing:-.025em}
.home-lab .subject{font-size:10px;color:#b5bdc4;letter-spacing:.08em}
.home-lab p{font-size:13px;line-height:1.7}
.card-status{background:#202e26;color:#a1ceb4;letter-spacing:.03em}
.card-bottom{margin-top:19px;padding-top:14px}
.card-bottom strong{font-weight:600}
.roadmap{margin-top:36px;gap:28px}
.roadmap-list span{background:transparent}
.home-mode .topbar{padding-left:clamp(24px,4vw,60px);padding-right:clamp(24px,4vw,60px)}
.home-mode .team{font-size:10px;font-weight:600;color:#a9b0b7;letter-spacing:.06em}
@media(max-width:950px){.hero-copy{width:44%;padding-left:26px;padding-right:20px}.hero-open{left:26px}.hero-copy h1{font-size:36px}.hero-copy>p:last-child{font-size:14px}.library-header p{max-width:240px;text-align:right}}
@media(max-width:650px){.home{padding:16px 14px 40px}.home-hero{display:flex;flex-direction:column;min-height:0;padding-bottom:0}.hero-copy{width:100%;min-height:0;padding:28px 24px 90px;background:#15181b}.hero-copy h1{font-size:36px;max-width:none}.hero-copy>p:last-child{max-width:370px}#hero-scene{position:relative;inset:auto;width:100%;height:290px;border-left:0;border-top:1px solid #2d3238}.hero-open{left:24px;top:252px;bottom:auto;padding:12px 16px;min-width:200px}.hero-badge{right:12px;bottom:12px}.lab-search{margin:20px 0 16px;padding-left:15px;gap:7px}.lab-search input{font-size:12px}.lab-search button{padding:10px 12px;font-size:11px}.subject-categories{justify-content:flex-start;gap:7px;padding-bottom:20px}.subject-categories button{padding:8px 10px;font-size:11px}.library-header{padding:20px 0 16px}.library-header>div{font-size:21px;gap:9px}.library-header p{display:none}.experiment-list{grid-template-columns:1fr}.card-visual{height:220px}.roadmap{grid-template-columns:1fr}.home-mode .topbar{padding-left:18px;padding-right:18px}}

@media(max-width:650px){.hero-copy{order:0;padding-bottom:25px}#hero-scene{order:1}.hero-copy .hero-open{position:static;margin-top:23px;min-width:200px}.hero-badge{bottom:12px}.hero-copy h1{margin-bottom:15px}}

/* Touch-first layouts keep the bench ahead of the controls and lab record. */
@media(max-width:950px){
 .workspace-shell,.guide-collapsed .workspace-shell,.inspector-collapsed .workspace-shell,.guide-collapsed.inspector-collapsed .workspace-shell,.practice-mode .workspace-shell,.inspection-mode .workspace-shell{grid-template-columns:minmax(0,1fr);padding:12px;gap:12px}
 .workspace{display:contents}
 .guide{order:0}.workspace-title{order:1;margin:0;padding:4px 2px}.workbench{order:2}.inspector{order:3}.readings{order:4;margin:0}#precision-view{order:5;margin:0}.workspace>.notebook{order:6;margin:0}
 .guide .panel-bar{display:none}.guide-body{padding:0!important}.guide-body .back-home,.guide-body .syllabus-button{display:none}
 #lab-nav{display:flex;overflow-x:auto;padding:6px;gap:5px;scrollbar-width:none}
 .lab-link{flex:0 0 auto;min-width:132px;padding:10px;min-height:48px}.lab-link .arrow{display:none}.lab-link strong{font-size:12px}.lab-link small{font-size:9px}
 .bench-toolbar{display:flex;flex-wrap:wrap;height:auto;padding:10px;gap:9px}.bench-toolbar>span:first-child{width:100%;font-size:11px}.bench-toolbar>span:nth-child(2){display:none}
 .bench-toolbar>div{display:flex;flex-wrap:wrap;gap:5px;width:100%}.mode-switch{flex:1;justify-content:space-between}.mode-switch button{flex:1}
 .bench-toolbar button{min-height:40px;padding:8px 10px;font-size:11px}
 #scene{height:clamp(320px,52svh,520px);min-height:0;touch-action:none}
 .diagnostic{left:10px;right:10px;top:10px;max-width:none;padding:10px;gap:9px}.diagnostic strong{font-size:11px}.diagnostic p,.diagnostic small{font-size:11px;line-height:1.45}
 .inspector-body{padding:14px}.inspector .panel-bar{min-height:44px}.inspector .panel-bar>span{font-size:11px}
 #controls button,.inspector .primary,.inspector .reset-button,.tabs button,.icon-button{min-height:44px;font-size:13px}
 #controls select,#controls input[type=number],#controls input[type=text]{min-height:44px;font-size:16px}
 #controls input[type=range]{height:32px}#controls label,.control-note{font-size:13px;line-height:1.6}
 .wire-step{padding:11px;font-size:13px}.wire-step small{font-size:11px}.wire-current strong{font-size:14px}.wire-current small{font-size:12px}
 .readings{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.readings>div{min-width:0;padding:13px}.readings small{font-size:10px}.readings strong{font-size:21px}
 .notebook-heading{padding:16px}.notebook-heading strong{font-size:17px}.tabs{display:flex;overflow-x:auto;gap:6px;padding:0 12px 10px}.tabs button{flex:0 0 auto;padding:10px 13px;white-space:nowrap}
 #notebook-content{padding:16px}.objective,.theory,.procedure p{font-size:14px;line-height:1.75}.table-wrap{max-width:100%;overscroll-behavior-x:contain}table{min-width:520px}
 .inspect-card p,.inspect-card h3{font-size:14px;line-height:1.7}.inspect-card h2{font-size:20px}
 #mobile-inspection:not([hidden]){padding:12px;max-height:42%;overflow:auto}#mobile-inspection button{min-height:40px}
 .home-lab,.home-lab:nth-child(odd){padding:14px}.home-lab h2{font-size:21px}.home-lab p{font-size:14px}.card-bottom{font-size:12px}.card-bottom strong{font-size:13px}
}
@media(max-width:680px){
 .topbar,.home-mode .topbar{height:auto;min-height:64px;display:flex;flex-wrap:wrap;padding:12px 16px;gap:8px 15px}.brand-logo{width:160px;height:auto}.team{margin-left:auto;font-size:9px}
 .site-nav{display:flex;order:3;width:100%;margin:0;gap:20px;padding-top:6px}.site-nav a{font-size:12px;min-height:32px;display:flex;align-items:center}
 .home{padding:14px 12px 36px}.hero-copy{padding:25px 21px}.hero-copy h1{font-size:clamp(29px,8.5vw,38px)}.hero-copy>p:last-child{font-size:14px}#hero-scene{height:260px}.hero-badge{padding:8px 11px}
 .experiment-list{margin:0}.library-header{margin:0}.roadmap{margin:30px 0 0}.lab-search{min-height:54px}.lab-search input{font-size:16px}.lab-search button{font-size:11px;padding:11px}
 .subject-categories{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;padding-bottom:15px}.subject-categories button{flex:0 0 auto;min-height:44px;padding:9px 12px}
 .workspace-shell{padding:8px;gap:10px}.workspace-title h1{font-size:25px;line-height:1.25}.workspace-title>div>p:last-child{font-size:13px}.workspace-meta{display:none}
 .bench-toolbar .mode-switch button{padding:8px 7px}.bench-toolbar>div{gap:4px}.bench-toolbar>div>button{padding:8px;font-size:10px}
 #part-hint{font-size:11px;padding:7px 9px;bottom:10px;left:10px}.apparatus-tooltip{font-size:12px;max-width:190px}
 .roadmap h2{font-size:20px}.roadmap-list span{font-size:13px}
}

#scene>.diagnostic{top:12px}
