/* Engineering lab skin. Presentation only; board coordinates and hit areas are unchanged. */
:root{--lab-bg:#e8eff3;--lab-panel:#f6f9fb;--lab-raised:#e0eaf0;--lab-control:#f7fbfd;--lab-border:#9aafbd;--lab-text:#203647;--lab-muted:#526c7e;--lab-accent:#007e96;--lab-active:#007e96;--lab-grid:#95b7c54d;--lab-dot:#608a9e66;--lab-board:#f3f8fa;--lab-shadow:#183b5012}
html:root[data-theme=dark]{--lab-bg:#0b1420;--lab-panel:#101f2e;--lab-raised:#162a3a;--lab-control:#1b3042;--lab-border:#345269;--lab-text:#edf5f9;--lab-muted:#9fb5c5;--lab-accent:#00c8e8;--lab-active:#00bfd9;--lab-grid:#168da51a;--lab-dot:#168da559;--lab-board:#0c1b29;--lab-shadow:#0005}
html:root body{background:var(--lab-bg);color:var(--lab-text)}
html:root :is(button,select,input){color:var(--lab-text);background:var(--lab-control);border-color:var(--lab-border);border-radius:4px}
html:root button{box-shadow:inset 0 1px 0 #ffffff0d,0 2px 3px var(--lab-shadow);transition:background .12s,border-color .12s;}
html:root button:hover:not(:disabled){background:var(--lab-raised);border-color:var(--lab-accent)}
html:root :is(button,select,input,summary):focus-visible{outline:2px solid var(--lab-accent);outline-offset:2px}
html:root :is(button.active,button[aria-selected=true],#tutorialList button[aria-pressed=true],.modes button.active){background:var(--lab-active);color:#fff;border-color:var(--lab-accent);box-shadow:inset 0 1px 0 #ffffff55,0 0 9px #00c8e81a}
html:root[data-theme=dark] :is(button.active,button[aria-selected=true],#tutorialList button[aria-pressed=true],.modes button.active){color:#03202a}
html:root .primary{background:var(--lab-control);color:var(--lab-text);border-color:var(--lab-border)}
html:root .primary.active{background:var(--lab-active);color:#03202a}
html:root input[type=checkbox],html:root input[type=range]{accent-color:var(--lab-accent)}
html:root header{position:relative;background:linear-gradient(120deg,#0c1b29 35%,#173548 70%,#0b1926);border-bottom:1px solid #28758a;overflow:hidden}
html:root header::after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(130deg,transparent 0 13px,#39b6cc16 14px 15px,transparent 16px 24px);mask-image:linear-gradient(90deg,transparent 35%,#000 60%,transparent 78%)}
html:root header>*{position:relative;z-index:1}
html:root .brand{font-style:italic;letter-spacing:1.7px;color:#edf5f9}
html:root .brand .light{color:#00c8e8;font-weight:800}
html:root .brand small{color:#b9ccda;font-style:normal;font-size:10px;letter-spacing:2.4px}
html:root .mark{transform:skew(-9deg);border:2px solid #efc64b;box-shadow:3px -3px 0 #efc64b22;color:#efc64b}
html:root .workspace-tabs{background:var(--lab-panel);border-color:var(--lab-border);box-shadow:0 2px 8px var(--lab-shadow)}
html:root :is(.library,.instruments){background:var(--lab-panel);border-color:var(--lab-border)}
html:root .library>h2{font-size:15px;text-transform:uppercase;letter-spacing:.8px;border-bottom:1px solid var(--lab-border);padding-bottom:12px}
html:root .library>h2::after{content:' ///';color:var(--lab-accent);float:right;font-style:italic}
html:root :is(p,.status,.legend,.eyebrow,.model,#guidesPanel p,#randomPractice>p){color:var(--lab-muted)}
html:root :is(.help,.details,.repair-workflow,.inspector-help){border-color:var(--lab-border)}
html:root .help h3{color:var(--lab-accent);text-transform:uppercase;letter-spacing:.3px}
html:root .catalog-group{border-color:var(--lab-border);border-radius:4px;box-shadow:0 2px 4px var(--lab-shadow)}
html:root .catalog-group summary{background:linear-gradient(115deg,var(--lab-raised),var(--lab-panel));color:var(--lab-text);font-size:12px;text-transform:uppercase;letter-spacing:.35px;border-left:2px solid transparent}
html:root .catalog-group summary:hover,html:root .catalog-group[open] summary{border-left-color:var(--lab-accent);background:var(--lab-raised)}
html:root .catalog-items{background:var(--lab-panel)}
html:root #catalog button{background:var(--lab-control);color:var(--lab-text);border-color:var(--lab-border)}
html:root #catalog button:hover{border-color:var(--lab-accent)}
html:root #catalog button span{color:var(--lab-muted)}
html:root .board-wrap{border:1px solid var(--lab-border);border-top-color:var(--lab-accent);border-radius:8px 2px 8px 2px;background:var(--lab-board);box-shadow:0 0 0 4px var(--lab-panel),0 5px 20px var(--lab-shadow)}
html:root #board{background-color:var(--lab-board);background-image:radial-gradient(var(--lab-dot) .8px,transparent 1px),linear-gradient(var(--lab-grid) 1px,transparent 1px),linear-gradient(90deg,var(--lab-grid) 1px,transparent 1px);background-size:16px 16px,160px 160px,160px 160px}
html:root .toolbar button,html:root #timeSpeed{font-size:13px}
html:root .workshop-panel{background:var(--lab-panel);border-color:var(--lab-border);border-radius:8px 2px 8px 2px;box-shadow:0 3px 9px var(--lab-shadow)}
html:root .panel-head{background:linear-gradient(110deg,var(--lab-raised),var(--lab-panel));border-bottom:1px solid var(--lab-border);border-top:1px solid var(--lab-accent)}
html:root .panel-head button{background:transparent;color:var(--lab-text);box-shadow:none}
html:root .panel-head .panel-toggle{text-transform:uppercase;font-size:12px;letter-spacing:.4px}
html:root .panel-head button:hover{background:var(--lab-control)}
html:root .meter.workshop-panel{background:#0d1d2a;border-color:var(--lab-border);color:#edf5f9}
html:root .meter-title{color:#00c8e8;letter-spacing:.7px}
html:root .meter-title span{color:#c2d2df;letter-spacing:0}
html:root .lcd{background:linear-gradient(135deg,#c9dfb2,#a9c98e);color:#20351f;box-shadow:inset 0 2px 6px #142a3055;border:1px solid #7e9e73}
html:root .lcd small{color:#20351f}
html:root .modes button{background:#1b3042;border-color:#345269;color:#edf5f9}
html:root #resetMeter{background:#162a3a;color:#d9e7ef;border-color:#345269}
html:root .injector-display strong{color:var(--lab-accent)}
html:root :is(.info,#randomPractice,.fuse-slot,.guide-reference thead){background:var(--lab-raised);color:var(--lab-text);border-color:var(--lab-border)}
html:root :is(#lessonPanel,.guide-reference table,.board-popup-card){background:var(--lab-panel);color:var(--lab-text);border-color:var(--lab-border)}
html:root #lessonPanel{border-left-color:var(--lab-accent)}
html:root :is(.guide-reference th,.guide-reference td){border-color:var(--lab-border)}
html:root :is(.inspector a,.guide-reference a,#guideSource a){color:var(--lab-accent)}
html:root #lessonSolution:not(:empty){background:var(--lab-raised);color:var(--lab-text)}
html:root #guideExamples button,html:root #newRandomChallenge{background:var(--lab-control);color:var(--lab-text);border-color:var(--lab-border)}
html:root #guideState{color:var(--lab-accent)!important}
html:root .danger{color:#c94e35}html:root[data-theme=dark] .danger{color:#ff9c88}
html:root .eyebrow{font:11px Consolas,monospace;letter-spacing:1.5px;color:var(--lab-accent)}
html:root .release-version{color:var(--lab-muted);border-top:1px solid var(--lab-border)}
html:root :is(.library,.workspace,.instruments,.board-popup-card){scrollbar-color:var(--lab-border) var(--lab-panel);scrollbar-width:thin}
@media(prefers-reduced-motion:reduce){html:root button{transition:none}}
