:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#f5f7f2;color:#16201f;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.42}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.status-message{padding:7px 16px;background:#e6f3ea;border-bottom:1px solid #bfd3c5;text-align:center;font-weight:700}.app-shell{min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}.topbar{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;background:#fffdf8;border-bottom:1px solid #d8ddd2}.eyebrow{margin:0 0 3px;color:#387064;font-size:.76rem;font-weight:800;text-transform:uppercase}.brand-tagline{margin:3px 0 0;color:#387064;font-size:.82rem;font-style:italic;font-weight:700}h1 sup{font-size:.62em}h1,h2,p{margin-top:0}h1{margin-bottom:0;font-size:1.35rem}h2{margin-bottom:0;font-size:.95rem}.toolbar,.tray-list{display:flex;gap:8px}.toolbar{flex-wrap:wrap;justify-content:flex-end}.icon-button,.tray-item{min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid #bfc8bc;border-radius:8px;background:#fff;color:#17201c;font-weight:750}.icon-button{padding:0 12px}.icon-button:not(.subtle){background:#215f56;color:#fff;border-color:#215f56}.icon-button:focus-visible,.tray-item:focus-visible,.component-node:focus-visible{outline:3px solid #ecb84d;outline-offset:2px}.lab-grid{flex:1;display:grid;grid-template-columns:220px minmax(320px,1fr) 300px;min-height:0;width:100%;min-width:0}.component-tray,.side-panel{padding:14px;background:#eef1e9;border-color:#d5dbcf;min-width:0}.component-tray{border-right:1px solid #d5dbcf}.side-panel{border-left:1px solid #d5dbcf;overflow:auto}.panel-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px}.panel-heading span,.muted{color:#67716c;font-size:.86rem}.tray-list{flex-direction:column}.tray-item{justify-content:flex-start;padding:12px}.workspace{position:relative;overflow:hidden;min-height:calc(100vh - 76px);background-color:#f9fbf7;background-image:linear-gradient(#dfe5da 1px,transparent 1px),linear-gradient(90deg,#dfe5da 1px,transparent 1px);background-size:28px 28px}.wiring-help{position:absolute;z-index:4;top:14px;left:50%;transform:translate(-50%);padding:8px 12px;border:1px solid #9da99d;border-radius:999px;background:#fffdf8f5;color:#34413b;font-size:.85rem;font-weight:700;pointer-events:none}.wiring-help.active{border-color:#d38b1f;background:#fff0c7}.empty-canvas{position:absolute;left:50%;top:50%;translate:-50% -50%;padding:16px 18px;border:1px dashed #9da998;border-radius:8px;background:#fffdf8;color:#5f6c64;font-weight:700;display:grid;gap:7px;min-width:min(310px,calc(100% - 30px))}.empty-canvas span{font-size:.86rem;font-weight:650}.help-backdrop{position:fixed;z-index:50;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:18px;background:#0e18158c}.help-dialog{position:relative;width:min(650px,100%);max-height:calc(100vh - 36px);overflow:auto;padding:24px;border-radius:12px;background:#fffdf8;box-shadow:0 20px 60px #0000004d}.help-dialog h2,.help-dialog h3{margin:0 38px 12px 0}.help-dialog li+li{margin-top:8px}.help-dialog dl{display:grid;gap:8px}.help-dialog dl div{display:grid;grid-template-columns:75px 1fr;gap:10px}.help-dialog dt{font-weight:850}.help-dialog dd{margin:0}.help-close{position:absolute;top:14px;right:14px;display:grid;width:40px;height:40px;place-items:center;border:1px solid #bdc6ba;border-radius:50%;background:#fff}.help-note{margin:16px 0 0;padding:10px;border-radius:8px;background:#edf6f3;font-weight:700}.wire-layer{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1}.wire{fill:none;stroke:#27312d;stroke-width:5;stroke-linecap:round;pointer-events:stroke;cursor:pointer}.wire.selected{stroke:#e29a2f;stroke-width:8}.wire.flowing{stroke:#d45d3a;stroke-dasharray:12 12;animation:flow .8s linear infinite}@keyframes flow{to{stroke-dashoffset:-24}}@media(prefers-reduced-motion:reduce){.wire.flowing{animation:none}}.component-node{position:absolute;z-index:2;width:132px;min-height:88px;display:grid;place-items:center;gap:3px;padding:10px 16px;border:2px solid #25302c;border-radius:8px;background:#fff;color:#13211d;box-shadow:0 8px 18px #16201f1f;-webkit-user-select:none;user-select:none;touch-action:none}.component-node.selected{border-color:#e29a2f;box-shadow:0 0 0 4px #e29a2f33}.component-node.battery{background:#fef1ca}.component-node.bulb.normal,.component-node.bulb.overloaded{background:#ffe07c}.component-node.resistor{background:#e9f0ff}.component-node.switch{background:#e5f6ef}.component-node.led{background:#ffe8ee}.component-node.led.on{box-shadow:0 0 18px #ef4c70}.component-node.motor.slow,.component-node.motor.normal,.component-node.buzzer.sounding{background:#dff4ee}.component-node.fuse.blown,.component-node.overloaded{border-color:#b2382f;background:#ffe1dc}.component-label{font-weight:850}.component-icon{display:grid;place-items:center;line-height:1}.component-rating{color:#55645e;font-size:.72rem;font-weight:750}.switch-toggle{display:inline-flex;align-items:center;gap:4px;min-height:28px;padding:2px 7px;border:1px solid #4d7167;border-radius:999px;background:#fff;color:#254e45;font-size:.7rem;font-weight:800}.component-node.switch{min-height:112px}.component-node.switch .terminal{top:47px}.reading{color:#4a5a54;font-size:.78rem;font-weight:800}.terminal{position:absolute;top:35px;width:17px;height:17px;border:3px solid #17201c;border-radius:50%;background:#fff;padding:0}.terminal:hover,.terminal:focus-visible,.terminal.active{background:#ecb84d;transform:scale(1.25);outline:none}.danger-button{margin-top:14px;padding:8px 10px;border:1px solid #a33b32;border-radius:8px;background:#fff3f1;color:#7c241d}.terminal.left{left:-9px}.terminal.right{right:-9px}.properties,.explanation,.challenge-panel{margin-bottom:14px;padding:14px;border:1px solid #d2d9cc;border-radius:8px;background:#fffdf8}.challenge-list{display:grid;gap:6px;min-width:0}.challenge-button{min-height:38px;padding:7px 9px;border:1px solid #c5cec1;border-radius:7px;background:#fff;text-align:left;width:100%;min-width:0;overflow-wrap:anywhere}.challenge-button.active{border-color:#287265;background:#e4f3ee}.challenge-button span{display:inline-grid;width:22px;height:22px;place-items:center;border-radius:50%;background:#dfe9e2}.challenge-details{display:grid;gap:10px;margin-top:12px;font-size:.86rem}.challenge-details details p,.challenge-details .prediction{margin:7px 0 0}.solution-steps ol{margin:8px 0 0;padding-left:20px}.solution-steps li+li{margin-top:5px}.challenge-details fieldset{display:grid;gap:7px;margin:0;padding:9px;border:1px solid #ccd5c8;border-radius:7px}.prediction.correct{color:#17634f;font-weight:800}.explanation.ok{border-color:#7cb79b}.explanation.warning{border-color:#e0b44d}.explanation.error{border-color:#cf7168}.field-list{display:grid;gap:12px}.field,.toggle-field{display:grid;gap:6px;color:#4d5a54;font-size:.84rem;font-weight:760}.toggle-field{grid-template-columns:1fr auto;align-items:center}.field input{width:100%;min-height:38px;border:1px solid #bfc8bc;border-radius:8px;padding:8px 10px;background:#fff;color:#16201f}.toggle-field input{width:22px;height:22px;accent-color:#215f56}.measurements{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0 0}.measurements div{padding:9px;border-radius:8px;background:#edf6f3}.measurements dt{color:#60716b;font-size:.72rem;font-weight:800}.measurements dd{margin:2px 0 0;color:#14221e;font-size:.82rem;font-weight:850}.diagnostic strong{display:block;margin-bottom:6px}.diagnostic p{margin-bottom:0;color:#4c5b55}@media(max-width:900px){.topbar{align-items:flex-start;flex-direction:column}.lab-grid{grid-template-columns:1fr;width:100%;min-width:0}.component-tray,.side-panel{border:0}.tray-list{flex-direction:row;overflow-x:auto}.tray-item{min-width:120px}.workspace{min-height:56vh;width:100%;min-width:0}.side-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}}@media(max-width:600px){.topbar{padding:10px}.toolbar{width:100%;justify-content:flex-start}.icon-button{min-width:44px;min-height:44px;padding:0 9px}.icon-button span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.tray-item,.terminal{min-height:44px}.terminal{width:28px;height:28px;top:30px}.terminal.left{left:-14px}.terminal.right{right:-14px}.side-panel{display:block}.wiring-help{width:calc(100% - 24px);border-radius:8px;text-align:center}.workspace{min-height:420px;height:52vh;max-height:560px}.empty-canvas{left:15px;right:15px;width:auto;min-width:0;translate:0 -50%}.component-tray,.side-panel,.challenge-panel,.properties,.explanation{width:100%;max-width:100%;min-width:0}.challenge-details,.challenge-details fieldset,.help-dialog{min-width:0;overflow-wrap:anywhere}.help-dialog{padding:20px 16px}.help-dialog dl div,.measurements{grid-template-columns:1fr}}
