@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#263b39;--muted:#7a8985;--orange:#dd7945;--line:#dce3dc;--paper:#f9faf6;--blue:#c9e4fa;--green:#47715f}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-size:14px;overflow:hidden}button,input{font:inherit}button{cursor:pointer;color:inherit;transition:background .15s,transform .15s;border:0}button:focus-visible,input:focus-visible{outline:3px solid #7eadd2;outline-offset:3px}button:disabled{opacity:.3;cursor:default}button:hover:not(:disabled){filter:brightness(.97)}button:active:not(:disabled){transform:translateY(1px)}[hidden]{display:none!important}button svg{pointer-events:none}.header{height:94px;display:flex;align-items:center;padding:0 34px;border-bottom:1px solid var(--line);gap:36px;background:#fcfcf9;position:relative;z-index:10}.brand{color:var(--ink);display:flex;text-decoration:none;align-items:center;gap:13px;min-width:245px}.brand-icon{display:grid;place-items:center;background:var(--orange);color:#fff;width:45px;height:49px;font-family:Georgia,serif;font-size:49px;font-style:italic;border-radius:13px 13px 13px 3px;padding:0 5px 4px 0}.brand-kicker{display:block;font-size:9px;letter-spacing:2.1px;font-weight:700}.brand strong{font-family:Georgia,serif;font-size:33px;font-weight:500;line-height:1.1;letter-spacing:-1px}.brand-dot{color:var(--orange)}nav{height:100%;display:flex;align-items:center;gap:9px}.nav-tab{font-size:13px;font-weight:600;background:transparent;height:40px;padding:0 17px;border-radius:7px}.nav-tab.active{background:#e9eee7}.pill{font-size:10px;border:1px solid #d3dcd1;padding:3px 5px;margin-left:6px;border-radius:4px}.header-actions{margin-left:auto;display:flex;align-items:center;gap:13px}.saved{font-size:10px;color:var(--muted);display:flex;align-items:center;gap:6px}.saved i{width:5px;height:5px;background:#73957c;border-radius:50%}.icon-btn{background:transparent;border:1px solid var(--line);border-radius:50%;width:32px;height:32px;font-weight:700;position:relative}.outline-btn{border:1px solid #ced7ce;border-radius:7px;background:#fafbf8;padding:10px 14px;font-size:12px;font-weight:600}.outline-btn>span:first-child{margin-right:7px}.app{display:flex;height:calc(100dvh - 94px)}.sidebar{width:269px;flex-shrink:0;border-right:1px solid var(--line);padding:26px 20px 14px;background:#f9faf6;display:flex;flex-direction:column;min-height:0}.eyebrow{font-size:9px;letter-spacing:1.6px;font-weight:700;color:#829186}.sidebar .eyebrow{font-size:8px;letter-spacing:1.4px}.side-heading{display:flex;align-items:center;justify-content:space-between}.sidebar h2{font-family:Georgia,serif;font-weight:400;font-size:24px;letter-spacing:-.5px;line-height:1.16;margin:12px 0 20px}.orange{color:var(--orange)}.search-box{display:flex;gap:7px;align-items:center;padding:9px 10px;background:#f0f3ed;border:1px solid #e2e7df;border-radius:6px}.search-box>span{font-size:22px;color:#94a292;line-height:18px}.search-box input{width:100%;background:transparent;border:0;outline:none;font-size:11px;color:var(--ink)}.search-box input::placeholder{color:#909c90}.categories{display:flex;gap:5px;overflow:auto;padding:13px 0 14px;flex-shrink:0;scrollbar-width:none}.category{font-size:10px;border:1px solid #dbe2d6;border-radius:5px;background:transparent;padding:5px 8px;white-space:nowrap}.category.active{background:#2f4942;color:#fff;border-color:#2f4942}.palette{overflow-y:auto;min-height:0;scrollbar-width:thin;scrollbar-color:#d1dbcf transparent;padding-right:2px}.category-label{font-size:8px;letter-spacing:1.5px;color:#839180;font-weight:700;margin:2px 0 9px;display:flex;justify-content:space-between}.category-label:not(:first-child){margin-top:17px}.part-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.part-card{position:relative;background:#fff;border:1px solid #e0e6dc;border-radius:8px;padding:6px 4px 9px;min-height:93px;text-align:center}.part-card:hover{background:#eef5eb;border-color:#98b5a3}.part-card .art{height:53px;width:84px;display:block;margin:auto}.part-card .part-name{font-size:10px;font-weight:600;display:block;white-space:nowrap}.part-plus{position:absolute;right:5px;top:4px;font-size:13px;color:#acb8a6}.side-note{display:flex;gap:10px;border-top:1px solid var(--line);padding-top:17px;margin-top:17px;flex-shrink:0;font-size:10px}.side-note>span{font-size:25px;color:#c9a575}.side-note strong{font-weight:500;line-height:1.55}.side-note p{font-size:9px;color:#97a18f;margin:6px 0 0}.studio{display:flex;flex-direction:column;flex:1;min-width:0;padding:28px 28px 0;background:#f4f6f0}.studio-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;gap:10px}.studio-heading .eyebrow{font-size:8px;display:flex;align-items:center;gap:6px;letter-spacing:1.5px}.tiny-line{width:13px;height:1px;background:#92a38e}.studio h1{font-family:Georgia,serif;font-size:30px;letter-spacing:-.8px;font-weight:400;margin:8px 0 5px}.studio-heading p{font-size:11px;color:#8c978a;margin:0}.sim-actions{display:flex;gap:15px;align-items:center}.sim-actions .icon-btn{border:0;font-size:23px;font-weight:400}.mute-line{position:absolute;width:22px;height:1px;background:#708073;transform:rotate(-45deg);left:6px;top:17px}.run-btn{display:flex;align-items:center;gap:10px;border:1px solid #bdcdbb;border-radius:7px;background:#e5eddf;padding:11px 17px;font-size:12px;font-weight:700}.run-btn.paused{background:var(--blue);border-color:#a8c5dc}.workbench{position:relative;flex:1;min-height:230px;border:1px solid #d9e0d6;border-radius:12px;background:#eef1eb;overflow:hidden;box-shadow:0 2px 8px #35483a03}.board-top{position:absolute;top:17px;left:18px;right:18px;display:flex;justify-content:space-between;align-items:center;z-index:3;pointer-events:none}.board-chip{display:flex;gap:7px;align-items:center;border-radius:5px;padding:7px 10px;background:#f9faf6e8;border:1px solid #dce3d7;font-size:10px;pointer-events:auto}.status-dot,.live-dot{width:5px;height:5px;background:#72937a;border-radius:50%}.status-dot.paused{background:var(--orange)}.environment{font-size:9px}.environment strong{font-size:10px;font-weight:600;padding-left:6px;border-left:1px solid #d8e0d2;margin-left:2px}.sun{color:#d7a455;font-size:17px}.sun-popover{position:absolute;z-index:8;right:18px;top:60px;border-radius:8px;background:white;border:1px solid var(--line);padding:16px;width:220px;box-shadow:0 8px 30px #20382b13}.sun-popover label{font-size:12px;display:flex;justify-content:space-between}.sun-popover input{width:100%;margin:13px 0;accent-color:var(--orange)}.sun-popover small{color:var(--muted);font-size:10px}.viewport{position:absolute;inset:0;overflow:hidden;touch-action:none;cursor:grab;background-image:radial-gradient(#b9c7b5 0.7px,transparent .8px);background-size:20px 20px}.viewport.grabbing{cursor:grabbing}.world{position:absolute;left:0;top:0;width:0;height:0;transform-origin:0 0}.wires{position:absolute;width:1px;height:1px;overflow:visible;pointer-events:none;z-index:1}.wire-path{fill:none;stroke-width:3;stroke-linecap:round;pointer-events:stroke;cursor:pointer;filter:drop-shadow(0 2px 1px #243e3414)}.wire-hit{fill:none;stroke:transparent;stroke-width:15;pointer-events:stroke;cursor:pointer}.wire-path.selected{stroke-width:5;filter:drop-shadow(0 0 5px #dd7945)}.wire-flow{fill:none;stroke:#fff9;stroke-width:1.2;stroke-dasharray:3 18;pointer-events:none;animation:flow 1.2s linear infinite}.wire-draft{stroke:#d58a53;stroke-dasharray:5 7;stroke-width:2;fill:none}.component{position:absolute;width:160px;height:130px;touch-action:none;user-select:none;cursor:move;z-index:2;border-radius:12px}.component:hover{background:#ffffff3a}.component.selected{outline:1.5px dashed #8caaa0;background:#ffffff40}.component .part-art{position:absolute;inset:0 13px 30px;width:134px;height:100px;overflow:visible;filter:drop-shadow(0 7px 5px #203d3716)}.component .component-label{position:absolute;top:99px;left:0;right:0;text-align:center;font-size:11px;font-weight:600;color:#465d52;white-space:nowrap;pointer-events:none}.component .component-status{position:absolute;top:116px;left:-8px;right:-8px;text-align:center;font-size:8px;color:#889681;pointer-events:none}.component .component-status.on{color:#60856f}.component .component-status.danger{color:#c25041}.port{position:absolute;top:46px;width:19px;height:19px;padding:0;border:3px solid #eff2eb;border-radius:50%;background:#d7836d;box-shadow:0 0 0 1px #a77d70;z-index:5;cursor:crosshair;touch-action:none}.port.p0{left:-9px}.port.p1{right:-9px;background:#7094b3;box-shadow:0 0 0 1px #6e8a9e}.port.p2{left:71px;top:125px;background:#c6a65e;box-shadow:0 0 0 1px #ac975f}.port:before{content:'';position:absolute;inset:-9px}.port:hover,.port.pending{box-shadow:0 0 0 6px #d8ac6266;transform:scale(1.15)}.port-name{position:absolute;top:32px;left:-4px;font-size:8px;color:#9a7a69;pointer-events:none}.port-name.right{left:auto;right:-4px;color:#66879f}.port-name.base{left:67px;top:147px;color:#96804b}.switch-toggle{position:absolute;inset:14px 39px 46px;background:transparent;z-index:3;border:0;border-radius:8px;cursor:pointer}.starter-note{position:absolute;left:24px;bottom:74px;display:flex;align-items:center;gap:12px;padding:14px;background:#fbfbf5;border:1px solid #e1e5d5;border-radius:8px;z-index:3;box-shadow:0 3px 8px #24432f04}.note-icon{font-size:27px;color:var(--orange);line-height:30px}.starter-note strong{display:block;font-size:10px;font-weight:600;margin-bottom:4px}.starter-note div>span{font-size:9px;color:#8a9782}.starter-note button{align-self:start;background:none;color:#97a08d;margin-left:12px;font-size:16px}.board-tools{position:absolute;z-index:4;bottom:17px;left:18px;right:18px;display:flex;align-items:center;justify-content:space-between;gap:9px;pointer-events:none}.tool-group{display:flex;align-items:center;background:#fcfcf8;border:1px solid #dbe3d5;padding:4px;border-radius:7px;box-shadow:0 2px 4px #193a2305;pointer-events:auto}.tool{height:30px;width:31px;border-radius:4px;font-size:20px;background:transparent;color:#75836f;display:grid;place-items:center}.tool.active{background:#e6ede1;color:#3c5949}.tool-divider{height:17px;width:1px;background:#e4e8df;margin:0 3px}.board-guidance{font-size:8px;color:#94a18c;text-align:center}.zoom-tools span:not(.tool-divider){font-size:10px;min-width:42px;text-align:center;color:#6e7f65}.telemetry{display:flex;align-items:center;height:88px;gap:36px;flex-shrink:0}.metric{display:flex;gap:11px;align-items:center}.metric-symbol{color:#c79d68;background:#eee9db;width:34px;height:34px;display:grid;place-items:center;border-radius:7px;font-size:24px}.metric-symbol.blue{color:#7c9da4;background:#e5eded}.metric-symbol.green{color:#8d9f79;background:#e7ecdf;font-size:19px}.metric-label{display:block;font-size:7px;letter-spacing:1.1px;font-weight:600;color:#929e86;margin-bottom:6px}.metric strong{font-size:18px;font-weight:500;line-height:1;white-space:nowrap}.metric strong small{font-size:10px;color:#8b9882;font-weight:400}.model-note{margin-left:auto;font-size:9px;color:#8c9981;line-height:1.9;white-space:nowrap}.model-note .live-dot{display:inline-block;margin-right:5px}.model-note>span:last-child{display:block;font-size:8px;color:#a4ad9b}.inspector{position:absolute;right:15px;top:62px;z-index:8;width:236px;border:1px solid #d4ded0;background:#fffef9f7;backdrop-filter:blur(12px);border-radius:10px;padding:17px;box-shadow:0 8px 30px #18342515}.inspect-heading{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:600}.inspect-heading button{background:none;font-size:21px;color:#a1ad96}.inspect-desc{font-size:10px;line-height:1.6;color:#8d9983;margin:10px 0 14px}.inspect-value{font-size:11px;display:flex;align-items:center;justify-content:space-between;gap:8px}.inspect-value input[type=number]{width:85px;border:1px solid #d5dfcf;border-radius:5px;padding:5px;color:var(--ink);background:#f9fbf5}.inspect-range{width:100%;accent-color:#7eacbc;margin:10px 0}.readings{display:grid;grid-template-columns:1fr 1fr;gap:6px;border-top:1px solid #e4e9dd;padding-top:12px;margin-top:12px}.readings span{font-size:8px;display:block;color:#9aa68e;margin-bottom:4px}.readings strong{font-size:15px;font-weight:500}.inspect-actions{display:flex;gap:6px;margin-top:15px}.inspect-actions button{background:#edf2e7;border:1px solid #dce4d5;font-size:10px;border-radius:5px;padding:8px;flex:1}.inspect-actions .delete{color:#b65a4e;background:#f9eeea;border-color:#ecd2c9}.inspect-toggle{background:var(--blue);padding:9px;border-radius:5px;width:100%;font-size:11px;font-weight:600;margin-top:8px}.warning{position:absolute;left:16px;bottom:120px;max-width:min(480px,calc(100% - 32px));background:#fff0e6;color:#995734;border:1px solid #e9c6ac;padding:10px 13px;border-radius:6px;z-index:6;font-size:10px;box-shadow:0 3px 12px #623a1210}.connection-hint{position:absolute;top:65px;left:50%;transform:translateX(-50%);background:#2f4942;color:white;padding:10px 14px;border-radius:7px;font-size:11px;z-index:7;white-space:nowrap}.connection-hint button{background:transparent;color:#d4e1cf;margin-left:9px;font-size:16px}.empty-state{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);text-align:center;min-width:250px;pointer-events:none}.empty-state>div{font-size:70px;color:#b9c8ad}.empty-state h2{font-family:Georgia,serif;font-weight:400;font-size:27px;margin:12px 0}.empty-state p{font-size:12px;color:var(--muted)}.empty-state button{pointer-events:auto;margin-top:10px}.challenge-strip{position:absolute;bottom:73px;left:18px;z-index:4;background:#fffdf5f5;border:1px solid #dfdcc5;border-radius:8px;padding:14px 16px;max-width:420px}.challenge-strip .eyebrow{color:#b58a49;font-size:8px}.challenge-strip h3{font-size:12px;margin:6px 0}.challenge-strip p{font-size:10px;line-height:1.6;color:#839175;margin:0}.challenge-strip button{font-size:9px;background:#e8eedf;padding:6px 9px;border-radius:4px;margin-top:9px;margin-right:5px}.challenge-strip.complete{border-color:#81a98d;background:#eff6e9}.challenge-strip.complete h3{color:#4d7a54}.toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,20px);background:#2f4942;color:#f8fbf4;border:1px solid #ffffff30;border-radius:8px;padding:12px 20px;font-size:12px;opacity:0;pointer-events:none;transition:all .2s;z-index:100;max-width:90vw;box-shadow:0 6px 24px #203d3922}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{border:1px solid #d7dfd1;border-radius:16px;background:#fafbf6;color:var(--ink);padding:34px;max-width:720px;width:calc(100% - 32px);max-height:88dvh;box-shadow:0 24px 90px #17382e33}dialog::backdrop{background:#233b3b55;backdrop-filter:blur(4px)}.modal-close{position:absolute;top:16px;right:16px;font-size:22px}.modal-eyebrow{font-size:9px;letter-spacing:2px;color:#b38a58;margin-bottom:13px}.modal-title{font-family:Georgia,serif;font-size:34px;font-weight:400;letter-spacing:-.6px;margin:0 0 12px}.modal-intro{font-size:12px;color:#87957c;line-height:1.8;max-width:550px;margin-bottom:25px}.challenge-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.challenge-card{border:1px solid #dbe3d2;background:#fffef9;border-radius:9px;padding:18px;text-align:left;position:relative;min-height:145px}.challenge-card .num{font-size:10px;letter-spacing:1px;color:#bb996a}.challenge-card h3{font-size:14px;font-weight:500;margin:13px 0 8px}.challenge-card p{font-size:11px;line-height:1.65;color:#89977e;margin:0}.challenge-card .check{position:absolute;right:14px;top:14px;color:#729568}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.project-option{background:#edf2e6;border:1px solid #dce5d3;border-radius:8px;padding:18px;text-align:left;font-size:13px}.project-option span{display:block;font-size:10px;color:#8b997f;margin-top:7px;line-height:1.6}.project-option.danger{color:#ab5a48;background:#faefea;border-color:#ebd7cb}.examples{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.examples button{padding:9px 12px;border:1px solid #d8e0cf;border-radius:5px;background:#fffef8;font-size:11px}.help-steps{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:24px 0}.help-steps strong{font-size:12px;font-weight:600;display:block;margin-bottom:8px}.help-steps p{font-size:11px;line-height:1.7;color:#839376;margin:0}.help-steps b{color:var(--orange);margin-right:8px;font-size:14px}.help-model{padding:16px;background:#edf1e7;border-radius:8px;color:#839273;font-size:10px;line-height:1.8}.primary-btn{background:var(--blue);color:#263b39;font-weight:700;border:1px solid #b3d0e5;border-radius:7px;padding:12px 18px;font-size:12px}.modal-actions{display:flex;gap:10px;margin-top:25px}.mobile-only{display:none}.fan-blades,.motor-rotor{transform-origin:80px 47px}.powered .fan-blades,.powered .motor-rotor{animation:spin var(--speed,1s) linear infinite}.powered.reverse .fan-blades,.powered.reverse .motor-rotor{animation-direction:reverse}.powered .bulb-glow{fill:#ffe39c;filter:drop-shadow(0 0 10px #ffde78)}.powered .led-glow{fill:#ef9b55;filter:drop-shadow(0 0 9px #ed994b)}.overload .led-glow{fill:#e75c4e;filter:drop-shadow(0 0 7px red)}.powered .sound-wave{opacity:1;animation:pulse .8s infinite}.sound-wave{opacity:.1}.charging-battery .battery-fill{fill:#96d38e}.powered .solar-rays{opacity:1}.solar-rays{opacity:.2}.paused-sim *{animation-play-state:paused!important}@keyframes flow{to{stroke-dashoffset:-42}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.2}}@media(min-width:1600px){.sidebar{width:300px;padding:30px 26px}.studio{padding:34px 38px 0}.part-card{min-height:106px}.part-card .art{height:65px}.header{height:102px}.app{height:calc(100dvh - 102px)}.telemetry{height:100px}.studio-heading{margin-bottom:28px}}@media(max-width:1180px){.saved{display:none}.header{padding:0 22px;gap:18px}.brand{min-width:225px}.sidebar{width:235px;padding:23px 15px 14px}.sidebar h2{font-size:23px}.studio{padding:24px 20px 0}.telemetry{gap:20px}.model-note{display:none}.board-guidance{display:none}.metric-label{font-size:6px}.metric{gap:8px}.telemetry .metric{flex:1}}@media(max-width:800px){.header{height:76px;padding:0 16px;gap:12px}.brand{min-width:auto;gap:8px}.brand-icon{width:33px;height:39px;font-size:38px;border-radius:9px}.brand-kicker{font-size:6px;letter-spacing:1.5px}.brand strong{font-size:27px}.nav-tab{font-size:11px;padding:0 10px}.header-actions{gap:8px}.project-label{display:none}.outline-btn{padding:8px 10px}.outline-btn>span:first-child{margin:0}.app{height:calc(100dvh - 76px)}.sidebar{width:205px;padding:20px 12px 12px}.sidebar h2{font-size:21px}.side-note{display:none}.part-card{min-height:86px}.part-card .art{width:77px;height:48px}.part-name{font-size:9px!important}.studio{padding:20px 14px 0}.studio h1{font-size:25px}.studio-heading .eyebrow{font-size:7px}.studio-heading p{font-size:10px}.sim-actions{gap:4px}.run-btn{font-size:10px;padding:9px 10px}.metric-symbol{display:none}.metric-label{letter-spacing:.5px}.telemetry{height:75px;gap:12px}.metric strong{font-size:16px}.metric strong small{font-size:8px}.board-top{left:12px;right:12px}.board-chip{font-size:8px;padding:6px 7px}.environment{font-size:0}.environment .sun,.environment strong{font-size:12px}.starter-note{left:12px;right:12px;bottom:68px;padding:10px}.starter-note strong{font-size:9px}.starter-note div>span{font-size:8px}.starter-note .note-icon{font-size:20px}.board-tools{left:12px;right:12px;bottom:12px}.tool{width:26px;height:29px}.zoom-tools span:not(.tool-divider){min-width:35px}.inspector{width:205px;right:10px}.challenge-strip{left:12px;right:12px;max-width:none;font-size:10px}.challenge-strip h3{font-size:11px}.connection-hint{font-size:9px}}
@media(max-width:600px){.header{height:72px;padding:0 12px;gap:6px}.brand-icon{width:29px;height:35px;font-size:33px}.brand strong{font-size:23px}.brand-kicker{font-size:5px;letter-spacing:1.2px}.brand{gap:6px}.header nav{gap:0;margin-left:auto}.nav-tab{padding:0 8px;font-size:10px}.pill{font-size:8px;margin-left:3px;padding:2px 3px}.header-actions{margin-left:0;gap:4px}.header .icon-btn{width:27px;height:27px;font-size:12px}.header .outline-btn{border:0;padding:7px;font-size:17px}.app{height:calc(100dvh - 72px)}.mobile-only{display:block}.sidebar{display:none;position:fixed;z-index:30;left:0;right:0;bottom:0;width:auto;height:68dvh;border:1px solid #cdd9c9;border-radius:18px 18px 0 0;padding:16px 20px 25px;box-shadow:0 -15px 80px #29413635}.sidebar.open{display:flex}.sidebar h2{font-size:23px;margin:10px 0 15px}.sidebar h2 br{display:none}.categories{padding:12px 0}.part-grid{grid-template-columns:repeat(3,1fr)}.part-card{min-height:93px}.part-card .art{height:55px;width:90px}.side-note{display:none}.studio{padding:18px 10px 0}.studio h1{font-size:25px;margin-top:7px}.studio-heading{margin-bottom:16px}.studio-heading p{font-size:9px}.studio-heading .eyebrow{font-size:6px;letter-spacing:1.2px}.sim-actions{gap:5px}.sim-actions .icon-btn{width:24px;font-size:19px}.run-btn{padding:9px 10px;gap:7px}.workbench{border-radius:10px;min-height:200px}.board-top{top:12px}.board-chip{font-size:8px}.environment{font-size:0}.environment strong{font-size:9px}.environment .sun{font-size:15px}.board-tools{bottom:13px;gap:4px}.tool-group{padding:3px}.tool{width:27px;height:30px}.zoom-tools span:not(.tool-divider){min-width:33px;font-size:9px}.zoom-tools .tool{width:25px}.tool-divider{margin:0 2px}.starter-note{bottom:66px;left:12px;right:auto;max-width:calc(100% - 24px);padding:10px;gap:8px}.starter-note button{margin-left:4px}.telemetry{height:102px;align-items:flex-start;padding-top:15px;padding-bottom:43px;gap:10px}.metric-label{font-size:5px;letter-spacing:.4px}.metric strong{font-size:15px}.metric strong small{font-size:8px}.metric{min-width:0}.pieces{justify-content:flex-end}.mobile-add{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);background:var(--blue);border:1px solid #b2d0e4;padding:10px 20px;border-radius:6px;font-size:10px;font-weight:700;box-shadow:0 2px 6px #28465510;z-index:4;white-space:nowrap}.mobile-add:active{transform:translateX(-50%) translateY(1px)!important}.inspector{top:52px;width:210px;right:10px;max-height:calc(100% - 115px);overflow-y:auto;padding:13px}.inspect-desc{font-size:9px;margin:8px 0}.warning{bottom:115px;font-size:9px}.challenge-strip{bottom:66px;padding:11px 12px}.challenge-strip p{font-size:9px}.challenge-strip h3{margin:5px 0}.challenge-strip button{font-size:8px;margin-top:7px}.challenge-strip .eyebrow{font-size:7px}.modal-title{font-size:29px}.modal-intro{font-size:11px}.challenge-grid{gap:8px}.challenge-card{padding:13px;min-height:154px}.challenge-card h3{font-size:12px}.challenge-card p{font-size:10px}.help-steps{gap:14px}.help-steps p{font-size:10px}dialog{padding:27px 20px}.project-option{font-size:12px;padding:14px}.toast{bottom:65px;font-size:10px;text-align:center}.connection-hint{left:12px;transform:none;top:50px;font-size:9px}.sun-popover{right:12px;top:52px}.board-guidance{display:none}}
@media(prefers-reduced-motion:reduce){*{animation-duration:0s!important;transition:none!important}.wire-flow{display:none}}

.port{transform:scale(var(--port-scale,1))}.port:hover,.port.pending{transform:scale(calc(var(--port-scale,1) * 1.12))}.component-label,.component-status{transform:scale(var(--port-scale,1));transform-origin:50% 0}.component-status{top:120px!important}.viewport{overscroll-behavior:none}

.catalog-back{font-size:11px;color:#47715f;text-decoration:none;border:1px solid #dce3dc;border-radius:6px;padding:8px;white-space:nowrap}.catalog-back:hover{background:#e5eddf}@media(max-width:600px){.catalog-back{font-size:15px;padding:4px 6px;border:0}.catalog-back span{display:none}.header{gap:3px}.header nav .nav-tab{padding-left:5px;padding-right:5px}.header-actions{gap:2px}}

/* Ricardo v2: a workshop with a distinct warehouse, bench and connections. */
:root{--ink:#18353c;--muted:#52696d;--orange:#c55b28;--line:#b6c6c4;--paper:#e6ece9;--blue:#b9dcf4;--green:#26634f}
button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #e09b28;outline-offset:3px}
.header{height:82px;background:#f4f2e9;border-color:#b9c9c4;padding:0 26px;gap:24px}
.app{height:calc(100dvh - 82px)}.nav-tab.active{background:#d7e5d9;color:#1d4637}.saved{color:#456055}.saved i{background:#287447;width:7px;height:7px}
.sidebar{width:280px;background:#203e49;color:#f3f5ea;padding:22px 18px 16px;border-right:1px solid #102d38}
.sidebar .eyebrow{color:#a4c2c6;font-size:9px;letter-spacing:1.3px}.sidebar h2{font-size:27px;margin:10px 0 18px}.sidebar .orange{color:#f2ad73}
.sidebar h2 small{font:11px 'DM Sans',sans-serif;display:block;color:#d0dfdc;letter-spacing:0;margin-top:9px}.sidebar .icon-btn{color:white;border-color:#6d8b90}
.search-box{padding:11px;background:#132f3b;border-color:#6c8c90}.search-box>span{color:#c2d5d3}.search-box input{color:white;font-size:12px}.search-box input::placeholder{color:#b9cfce}
.categories{flex-wrap:wrap;overflow:visible;gap:6px;padding:14px 0}.category{border-color:#6a858a;color:#d6e4df;font-size:10px;padding:7px 9px}.category.active{color:#153139;background:#efd18e;border-color:#efd18e}
.category-label{color:#b9cecd;font-size:9px;margin-bottom:9px;letter-spacing:1px}.category-label span{color:#b4cac8;font-weight:400;letter-spacing:0}.category-label:not(:first-child){margin-top:20px}
.palette{scrollbar-color:#789b9c #203e49;padding-right:4px}.part-grid{gap:9px}.part-card{background:#e9efe6;border:1px solid #c5d9cb;color:#203d3d;min-height:115px;padding:9px 3px 10px;box-shadow:0 3px 0 #102d3840}
.part-card:hover{background:#fcf2ce;border-color:#edc577;transform:translateY(-2px)}.part-card .art{height:65px;width:100px}.part-card .part-name{font-size:11px;font-weight:700;white-space:normal;line-height:1.2;min-height:14px}.part-plus{color:#2a6058;background:#cfded0;width:18px;height:18px;border-radius:50%;line-height:18px;top:6px;right:6px}.part-detail{display:block;font-size:9px;line-height:1.3;margin-top:5px;color:#52675f}.sidebar .inspect-desc{color:#c9dad6}
.warehouse-experiments{flex-shrink:0;margin-top:16px;text-align:left;padding:13px 10px;border:1px solid #6e9295;border-radius:9px;color:#f4f0d7;background:#2d535c}.warehouse-experiments>span{float:left;font-size:28px;margin:0 10px 0 1px;color:#edc580}.warehouse-experiments strong{font-size:12px;display:block}.warehouse-experiments small{display:block;font-size:9px;line-height:1.4;margin-top:5px;color:#d1e1da}.side-note{display:none}.warehouse-closed .sidebar{display:none}
.studio{background:#dce6e2;padding:22px 24px 0}.studio-heading{margin-bottom:15px}.studio-heading .eyebrow{color:#4f6c61;font-size:9px}.studio h1{font-size:32px;margin:7px 0 5px}.studio-heading p{color:#4e6962;font-size:12px}.run-btn{background:#224e40;color:#f1f6df;border-color:#163f32;min-height:42px}.run-btn.paused{background:#f0d18c;color:#253d33;border-color:#bc984b}.sim-actions .icon-btn{color:#36594d}
.assembly-bar{display:flex;gap:8px;align-items:center;margin-bottom:12px;flex-shrink:0}.assembly-bar button{background:#eef3ec;border:1px solid #93aaa2;border-radius:7px;padding:10px 13px;font-size:12px;display:flex;gap:7px;align-items:center;font-weight:600;min-height:40px}.assembly-bar .accent-action{background:#eac887;border-color:#be9a56}.assembly-bar b{border-radius:4px;padding:2px 5px;background:#725420;color:#fff3d5;font-size:9px}.assembly-bar #circuitStatus{margin-left:auto;font-size:10px;color:#426154;white-space:nowrap}
.workbench{background:#183440;border:2px solid #12313c;box-shadow:inset 0 2px 20px #08233340;border-radius:12px}.viewport{background-color:#183440;background-image:radial-gradient(#526e76 .9px,transparent 1px)}
.board-chip{background:#294a57;border-color:#65818b;color:#e4efe9;font-size:11px;padding:8px 10px}.status-dot{background:#95dfa5;width:7px;height:7px}.status-dot.paused{background:#f0ba6a}.environment strong{color:#fff0ba;border-color:#789694;font-size:11px}.sun{color:#f5cb6f}.board-top{top:15px}.sun-popover{background:#f0f3e9;border:1px solid #91aca2;box-shadow:0 8px 30px #071b3280}.sun-popover small{color:#4e6962;font-size:11px}
.wire-path{stroke-width:4;filter:drop-shadow(0 2px 2px #061a24)}.wire-path.selected{stroke-width:6;filter:drop-shadow(0 0 4px #fff1bd)}.wire-hit{stroke-width:20}.wire-flow{stroke:#fff;stroke-width:1.5;stroke-dasharray:4 22;opacity:.7}.wire-draft{stroke:#ffdc80;stroke-width:4;stroke-dasharray:7 5}
.component{height:145px;background:#e9efe4;border:1px solid #acc6bc;box-shadow:0 6px 0 #08232e65,0 8px 18px #08232e30;border-radius:12px}.component:hover{background:#f4f3df;border-color:#e7c078}.component.selected{background:#fff3d5;border:2px solid #efbf68;outline:3px solid #efbf6840}.component .part-art{inset:0 12px 36px;filter:drop-shadow(0 4px 3px #20403418)}
.component .component-label{top:97px;font-size:12px;color:#153c38;font-weight:700;transform:none;white-space:normal;padding:0 5px}.component .component-status{top:119px!important;left:1px;right:1px;font-size:9px;font-weight:500;color:#4c675b;transform:none}.component .component-status.on{color:#1c6b3b}.component .component-status.danger{color:#b33824;font-weight:700}
.port{width:24px;height:24px;border:2px solid #ffecbe;background:#bd513d;box-shadow:0 0 0 2px #15343e;font:bold 10px 'DM Sans',sans-serif;color:#fff;display:grid;place-items:center;line-height:1;transform:scale(var(--port-scale,1));transform-origin:50% 50%;padding:0}.port.p1{background:#31668b;box-shadow:0 0 0 2px #15343e}.port.p2,.port.p3{background:#8e641a;box-shadow:0 0 0 2px #15343e}.port.connected{border-color:#f7f3df}.port:not(.connected){border-style:dashed}.port:before{inset:-8px}.port:hover,.port.pending,.port.snap-target{box-shadow:0 0 0 5px #f4c86b80;transform:scale(calc(var(--port-scale,1)*1.13));border-style:solid}.port.snap-target,.port.pending{background:#f8d47c;color:#183440}.connecting .port{box-shadow:0 0 0 4px #f4c86b55}.connecting .component{border-color:#afc9ba}
.type-junction,.type-transistor{padding-bottom:5px}.type-relay .port{font-size:8px}.push-control{position:absolute;top:30px;left:41px;width:76px;height:42px;color:white;background:#a43c2f;border:2px solid #70271f;border-radius:14px;font-size:10px;font-weight:700;box-shadow:0 5px 0 #73271e;z-index:3;touch-action:none}.pressed .push-control{background:#dd7461;box-shadow:0 1px 0 #73271e;transform:translateY(4px)}.relay-on .relay-contact{stroke:#a7be55}.relay-on{border-color:#91c980}
.starter-note{background:#f3dfab;border:1px solid #cda96b;box-shadow:0 5px 15px #0d263d40}.starter-note strong{font-size:12px;color:#343f35}.starter-note div>span{font-size:11px;color:#5d6045}.starter-note button{color:#5d6045}.board-tools{bottom:16px;left:16px;right:16px}.tool-group{background:#edf1e6;border-color:#b6c7b5;padding:5px;box-shadow:0 4px 12px #061d3290}.tool{color:#395d55;height:32px;width:32px}.tool.active{background:#244d42;color:#eaf5d7}.tool-divider{background:#b7cbbb}.tool span{font-size:10px;font-weight:600}.tool#selectTool,.tool#wireTool{display:flex;align-items:center;justify-content:center;gap:4px;width:68px;font-size:17px}.zoom-tools span:not(.tool-divider){color:#36564a;font-weight:600}.board-guidance{color:#bed4cf;max-width:190px;font-size:9px;line-height:1.5}
.connection-hint{background:#f7d888;color:#263e3d;border:1px solid #bf9c4f;font-weight:600;top:63px;max-width:calc(100% - 24px);white-space:normal;box-shadow:0 3px 16px #08202c50;line-height:1.5;padding:8px 12px}.connection-hint button{color:#405341}.empty-state{color:#d8e8e0}.empty-state p{color:#c0d7cf}.empty-state>div{color:#e9c478}
.inspector{background:#f0f3e9;border:1px solid #adc3b6;box-shadow:0 8px 30px #071e3270;width:249px;padding:16px;max-height:calc(100% - 130px);overflow-y:auto}.inspect-heading{font-size:14px}.inspect-heading button{color:#49695c;width:26px;height:26px}.inspect-desc{color:#496259;font-size:11px;line-height:1.55}.inspect-value{font-size:12px}.inspect-value input[type=number]{padding:8px;background:#fffef4;border-color:#a7beb0}.inspect-range{accent-color:#397d6b;height:20px}.readings{grid-template-columns:1fr 1fr 1fr;border-color:#bacdbd;gap:4px}.readings span{font-size:8px;color:#526c5b}.readings strong{font-size:13px;font-weight:600;white-space:nowrap}.inspect-actions button{font-size:11px;min-height:37px;background:#dce7d4;border-color:#aebfa4}.inspect-toggle{font-size:12px;min-height:39px;background:#c7dfec;border:1px solid #93b6c6}.inspect-toggle.secondary{background:#e7ddbe;border-color:#bcaa7c}.connection-panel{border-top:1px solid #bacdbd;margin-top:14px;padding-top:11px}.connection-panel>span{font-size:9px;font-weight:700;color:#557060;letter-spacing:.5px}.connection-panel>div{display:flex;gap:7px;margin-top:8px}.connection-panel button{background:#244b43;color:#fff7d9;border:1px solid #3c6e5c;border-radius:6px;min-width:41px;height:36px;font-size:12px;font-weight:700}.connection-panel small{color:#c9ddba}.cable-colors{display:flex;gap:12px;margin-top:17px}.cable-colors button{width:28px;height:28px;border:2px solid #34534b;border-radius:50%}
.challenge-strip{background:#e9e6c9;border:1px solid #b5b58c;box-shadow:0 4px 20px #08202e50;max-width:500px;bottom:79px;padding:13px 16px}.challenge-strip .eyebrow{color:#725c27;font-size:9px}.challenge-strip h3{font-size:14px;margin:5px 0}.challenge-strip p{color:#4d5c46;font-size:11px;line-height:1.5}.challenge-strip button{font-size:10px;background:#c9d7b9;border:1px solid #a3b18d;min-height:30px;padding:6px 9px}.challenge-strip button[data-return-bench]{background:#f4f0d8}.warning{background:#ffe0be;color:#763a1b;border-color:#d39a63;font-size:11px}
.telemetry{height:77px;gap:25px}.metric-label{font-size:8px;color:#4b6657;letter-spacing:.6px;margin-bottom:6px}.metric strong{font-size:20px;font-weight:600}.metric strong small{color:#496457;font-size:11px}.metric-symbol{background:#cdbd90;color:#664b28}.metric-symbol.blue{background:#b9d0d0;color:#355b6b}.metric-symbol.green{background:#c3d1b4;color:#516a3e}.model-note{color:#48614e}.model-note>span:last-child{color:#5c705d}
dialog{background:#edf1e7;border-color:#97b2a4;max-width:820px;padding:30px}.modal-eyebrow{color:#775729;font-weight:700}.modal-intro{font-size:12px;color:#4c655a;margin:0 0 22px}.modal-title{font-size:35px}.modal-close{color:#375d50;border-color:#9bb4a3}.experiment-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.experiment-card{background:#f8f5e9;border:1px solid #b6c5af;border-radius:10px;padding:18px;position:relative}.experiment-icon{float:right;background:#d3e4da;border-radius:9px;width:39px;height:39px;display:grid;place-items:center;color:#285a50;font-size:25px}.experiment-card>small{color:#536f5d;font-size:9px;text-transform:uppercase;letter-spacing:1px;font-weight:700}.experiment-card h3{font-size:16px;margin:10px 0;color:#203d36}.experiment-card p{font-size:12px;line-height:1.6;color:#516653;min-height:38px;margin:0 0 15px;max-width:260px}.experiment-card>div{display:flex;gap:8px}.experiment-card button{padding:10px 11px;font-size:11px;flex:1;min-height:40px}.primary-btn{background:#285c4b;color:#fff6d8;border-color:#1c4b3c}.outline-btn{background:#f5f1de;border-color:#acbba3;color:#355443}.challenge-card{background:#f8f5e9;border-color:#b6c5af}.challenge-card p,.project-option span,.help-steps p,.help-model{color:#52674f}.challenge-card .num{color:#84632b}.challenge-card h3{font-weight:600}.project-option{border-color:#b0c2a3}.help-model{background:#d8e3ce;font-size:11px}.help-steps p{font-size:12px}.help-steps strong{font-size:13px}.diagnosis-list p{padding:14px 16px;margin:12px 0;background:#f7f3df;border:1px solid #bfccae;border-left:4px solid #61875b;border-radius:6px;font-size:13px;line-height:1.7}.toast{background:#f1da9f;color:#263c31;border-color:#bfa466;box-shadow:0 5px 24px #112e3a55;font-weight:600}
@media(min-width:1600px){.sidebar{width:310px}.studio{padding:26px 32px 0}}
@media(max-width:1180px){.header{padding:0 20px;gap:16px}.sidebar{width:250px;padding:20px 15px 14px}.sidebar h2{font-size:24px}.part-card .art{width:90px}.studio{padding:20px 18px 0}.assembly-bar #circuitStatus{display:none}.telemetry{gap:17px}.metric strong{font-size:18px}.metric-label{font-size:7px}}
@media(max-width:800px){.header{height:76px;padding:0 12px;gap:10px}.app{height:calc(100dvh - 76px)}.sidebar{width:212px;padding:18px 12px}.sidebar h2{font-size:23px}.sidebar h2 small{font-size:9px;line-height:1.5}.sidebar .eyebrow{font-size:8px}.categories{gap:5px}.category{font-size:9px;padding:6px}.part-grid{gap:7px}.part-card{min-height:103px}.part-card .art{width:78px;height:54px}.part-card .part-name{font-size:10px!important}.part-detail{font-size:8px}.warehouse-experiments{padding:10px 8px}.warehouse-experiments>span{display:none}.warehouse-experiments small{font-size:8px}.studio{padding:17px 12px 0}.studio h1{font-size:27px}.studio-heading p{font-size:10px}.studio-heading .eyebrow{font-size:7px}.sim-actions{gap:4px}.run-btn{padding:9px;font-size:11px;min-height:37px}.assembly-bar{gap:6px}.assembly-bar button{padding:8px 9px;font-size:11px;gap:5px;min-height:37px}.board-chip{font-size:9px;padding:7px}.telemetry{height:76px;gap:10px}.metric strong{font-size:16px}.metric strong small{font-size:9px}.metric-label{font-size:6px}.board-tools{left:10px;right:10px;bottom:12px;gap:5px}.tool-group{padding:3px}.tool#selectTool,.tool#wireTool{width:56px}.tool{width:26px}.zoom-tools span:not(.tool-divider){min-width:35px}.inspector{width:235px;top:57px}.challenge-strip{left:10px;right:10px;bottom:72px;max-width:none}.challenge-strip p{font-size:10px}.challenge-strip h3{font-size:13px}.challenge-strip button{font-size:9px;min-height:30px}.starter-note{bottom:68px;padding:11px}.starter-note strong{font-size:11px}.starter-note div>span{font-size:10px}}
@media(max-width:600px){.header{height:72px;padding:0 10px;gap:4px}.app{height:calc(100dvh - 72px)}.header nav .nav-tab{padding:0 5px}.sidebar,.warehouse-closed .sidebar{display:none;position:fixed;left:0;right:0;bottom:0;width:100%;height:76dvh;padding:17px 18px 22px;box-shadow:0 -15px 70px #0b253ac0;border-color:#719391}.sidebar.open,.warehouse-closed .sidebar.open{display:flex}.sidebar h2{font-size:26px;margin-bottom:14px}.sidebar h2 small{font-size:11px}.sidebar .eyebrow{font-size:9px}.categories{padding:12px 0;gap:7px}.category{padding:7px;font-size:10px}.part-grid{gap:8px}.part-card{min-height:109px}.part-card .art{width:88px;height:61px}.part-card .part-name{font-size:10px!important}.part-detail{font-size:8px}.warehouse-experiments{padding:11px;margin-top:12px}.warehouse-experiments>span{display:block}.warehouse-experiments small{font-size:9px}.studio{padding:14px 10px 0}.studio h1{font-size:25px}.studio-heading{margin-bottom:12px}.studio-heading p{font-size:10px;max-width:225px;line-height:1.45}.studio-heading .eyebrow{font-size:7px}.sim-actions{gap:2px}.run-btn{font-size:10px;gap:5px;padding:8px;min-height:35px}.assembly-bar{gap:5px;margin-bottom:10px}.assembly-bar button{flex:1;justify-content:center;padding:8px 6px;font-size:10px;gap:4px;min-height:37px;white-space:nowrap}.assembly-bar b{font-size:8px;padding:2px 3px}.assembly-bar #inspectCircuitBtn span{font-size:9px}.workbench{min-height:240px}.board-top{top:11px;left:11px;right:11px}.board-chip{font-size:9px;padding:6px 7px}.environment{font-size:0}.environment strong{font-size:10px}.board-tools{left:9px;right:9px;bottom:11px}.tool#selectTool,.tool#wireTool{width:51px;gap:2px;font-size:15px}.tool span{font-size:9px}.tool{width:25px;height:31px}.zoom-tools .tool{width:24px}.zoom-tools span:not(.tool-divider){min-width:30px;font-size:9px}.tool-divider{margin:0 2px}.inspector{top:54px;width:225px;padding:13px;max-height:calc(100% - 117px)}.inspect-desc{font-size:11px}.inspect-actions button{font-size:10px}.connection-hint{left:10px;right:10px;max-width:none;transform:none;top:52px;font-size:10px;padding:8px 10px}.challenge-strip{bottom:68px;left:9px;right:9px;padding:10px 11px}.challenge-strip .eyebrow{font-size:8px}.challenge-strip h3{font-size:12px;margin:4px 0}.challenge-strip p{font-size:10px;line-height:1.4}.challenge-strip button{font-size:9px;margin-top:7px;padding:5px 7px;min-height:30px;margin-right:4px}.starter-note{bottom:68px;padding:10px;left:9px;right:9px;max-width:none}.starter-note strong{font-size:11px}.starter-note div>span{font-size:9px}.telemetry{height:73px;padding:14px 0 0;align-items:flex-start;gap:7px}.metric strong{font-size:17px}.metric strong small{font-size:9px}.metric-label{font-size:6px;letter-spacing:.2px}.mobile-add{display:none}.warning{bottom:115px;font-size:10px}.experiment-grid{grid-template-columns:1fr;gap:12px}.experiment-card{padding:16px}.experiment-card p{min-height:0;max-width:240px}.experiment-card button{min-height:42px;font-size:12px}.modal-title{font-size:28px}.modal-intro{font-size:12px}dialog{padding:28px 20px;max-height:90dvh}.help-steps{grid-template-columns:1fr}.toast{bottom:22px;font-size:11px}.empty-state h2{font-size:23px}.empty-state p{font-size:11px}}
/* Keep terminal labels legible while the circuit is zoomed out. */
.component .component-label{transform:scale(var(--port-scale,1));transform-origin:50% 0;font-size:11px;white-space:nowrap}
.component .component-status{transform:scale(var(--port-scale,1));transform-origin:50% 0;font-size:8px;white-space:nowrap}
.wire-mode .port{box-shadow:0 0 0 4px #f4c86b55}
/* Sound remains explicit and usable on a phone, with a circuit-independent test. */
.sound-btn{display:flex;align-items:center;justify-content:center;gap:7px;min-height:41px;border:1px solid #84a5b5;background:#b9dcf4;color:#17353c;border-radius:7px;padding:9px 12px;font-size:12px;font-weight:700;white-space:nowrap}.sound-btn>span:first-child{font-size:20px}.sound-btn.sound-on{background:#d3e5cd;border-color:#8aac86}.sound-notice{flex-shrink:0;display:flex;align-items:center;gap:10px;background:#e9d7a8;border:1px solid #bba773;border-radius:8px;padding:9px 11px;margin:0 0 11px;font-size:11px;color:#2d4234}.sound-notice>span{flex:1;line-height:1.5}.sound-notice button{background:#b9dcf4;color:#18353c;border:1px solid #82a4b5;border-radius:6px;font-size:11px;font-weight:700;min-height:35px;padding:7px 10px;white-space:nowrap}.sound-notice label{display:flex;align-items:center;gap:6px;font-size:10px}.sound-notice input{width:78px;accent-color:#296451}
@media(max-width:800px){.sim-actions{flex-direction:column;align-items:stretch;gap:6px}.sound-btn{font-size:10px;min-height:33px;padding:5px 8px;gap:4px}.sound-btn>span:first-child{font-size:16px}.sim-actions .run-btn{justify-content:center;min-height:31px;padding:5px 8px}.sound-notice{flex-wrap:wrap;gap:7px}.sound-notice>span{flex-basis:100%;font-size:10px}.sound-notice label{margin-left:auto}.sound-notice button{font-size:10px;min-height:32px}.sound-notice input{width:90px}}
/* v2.1.0 · corriente visible, cables ordenados, primeros pasos y recorrido, paleta Canary */
:root{--c-blue:#1688B4;--c-yellow:#E3BB32;--c-orange:#E17B46;--c-green:#77A56B;--c-coral:#D15B63;--c-violet:#8174B3;--c-grey:#8B929B}
.brand-icon{background:var(--c-orange)}
.port{background:var(--c-coral)}
.port.p1{background:var(--c-blue)}
.port.p2,.port.p3{background:#b8901a}
.wire-path{stroke-width:4.5;stroke-linejoin:round}
.wire-flow{display:block;fill:none;stroke:#fff6cf;stroke-width:5;stroke-linecap:round;stroke-dasharray:0 18;pointer-events:none;animation:flowdots var(--dur,1s) linear infinite;filter:drop-shadow(0 0 3px #ffe58a)}
.wire-flow.rev{animation-direction:reverse}
.wire-flow.off{display:none}
.paused-sim .wire-flow{animation-play-state:paused;opacity:.35!important}
@keyframes flowdots{to{stroke-dashoffset:-18}}
@media(prefers-reduced-motion:reduce){.wire-flow{animation:none}}
.board-left{display:flex;gap:8px;align-items:center;pointer-events:none}
.steps-chip{cursor:pointer;background:var(--c-violet)!important;border-color:#a79de0!important;color:#fff!important;font-weight:600;position:relative}
.steps-chip b{background:#ffffff2e;border-radius:10px;padding:1px 7px;font-size:10px}
.steps-chip:not(.complete)::after{content:'';position:absolute;top:-3px;right:-3px;width:9px;height:9px;border-radius:50%;background:var(--c-yellow);box-shadow:0 0 0 2px #17323d;animation:pulse 1.6s infinite}
.steps-chip.complete{background:#2f5a4a!important;border-color:var(--c-green)!important}
.steps-star{color:var(--c-yellow)}
.steps-panel{position:absolute;z-index:9;left:18px;top:62px;width:300px;max-width:calc(100% - 36px);background:#f6f4ea;border:1px solid #b7c4b3;border-radius:12px;padding:14px;box-shadow:0 12px 34px #071b3290;color:#18353c}
.steps-head{display:flex;justify-content:space-between;align-items:baseline;font-size:14px}
.steps-head span{font-size:11px;color:#52696d}
.steps-bar{height:6px;border-radius:4px;background:#dfe4d8;margin:9px 0 10px;overflow:hidden}
.steps-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--c-violet),var(--c-blue));border-radius:4px;transition:width .4s}
.step-item{display:flex;gap:10px;align-items:flex-start;width:100%;text-align:left;background:none;border:0;border-radius:8px;padding:8px 6px;color:inherit;cursor:pointer}
.step-item:hover{background:#e9e6d6}
.step-item strong{display:block;font-size:12px}
.step-item small{display:block;font-size:11px;color:#5c7073;margin-top:2px}
.step-check{flex:0 0 22px;height:22px;border-radius:50%;border:2px solid var(--c-violet);color:var(--c-violet);display:grid;place-items:center;font-size:11px;font-weight:700}
.step-item.done .step-check{background:var(--c-green);border-color:var(--c-green);color:#fff}
.step-item.done strong{text-decoration:line-through;color:#6d7d78}
.step-tour{width:100%;margin-top:8px;border:1px dashed #9f97cf;background:#ecebf7;color:#4f4594;border-radius:8px;padding:9px;font-size:12px;font-weight:600;cursor:pointer}
.hint-pulse{animation:hintpulse 1.1s ease-in-out 3!important;z-index:20!important}
@keyframes hintpulse{0%,100%{box-shadow:0 0 0 0 #E3BB3200}50%{box-shadow:0 0 0 10px #E3BB32aa}}
.tour-layer{position:fixed;inset:0;z-index:200}
.tour-spot{position:fixed;border-radius:12px;box-shadow:0 0 0 200vmax #061820b8;border:2px solid var(--c-yellow);transition:all .3s ease;pointer-events:none}
.tour-layer.centered .tour-spot{border-color:transparent}
.tour-bubble{position:fixed;background:#f6f4ea;color:#18353c;border-radius:14px;padding:18px;box-shadow:0 16px 40px #0009;border-top:5px solid var(--c-orange);transition:top .3s,left .3s}
.tour-count{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--c-violet);font-weight:700}
.tour-bubble h3{font-family:Georgia,serif;font-weight:400;font-size:22px;margin:4px 0 8px}
.tour-bubble p{font-size:13px;line-height:1.5;margin:0 0 14px;color:#2f4a4f}
.tour-actions{display:flex;gap:8px;align-items:center}
.tour-actions span{flex:1}
.tour-actions button{border-radius:8px;padding:9px 13px;font-size:12px;font-weight:600;cursor:pointer;border:1px solid #c5ceba;background:#fff;color:#2f4a4f}
.tour-actions .tour-skip{border:0;background:none;color:#6d7d78;padding:9px 4px}
.tour-actions .tour-next{background:var(--c-blue);border-color:var(--c-blue);color:#fff}
.challenge-grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
@media(max-width:600px){
 .sim-chip #simLabel{display:none}
 .steps-text{display:none}
 .steps-panel{left:12px;top:54px;width:auto;right:12px;max-width:none}
 .inspector{top:auto!important;bottom:62px;left:10px;right:10px!important;width:auto!important;max-height:48%!important}
 .tour-bubble{padding:15px}
 .challenge-grid{grid-template-columns:1fr 1fr}
 .tour-bubble h3{font-size:19px}
}

/* v2.2.0 · fondo verde claro tipo plataforma de laboratorio, letra más grande, cartel cerrable */
:root{--lab-bg:#d5e8cf;--lab-bg2:#c3dcbc;--lab-panel:#e5f1df;--lab-card:#edf6e8;--lab-line:#8fb787;--lab-ink:#143528;--lab-ink2:#2f5443;--lab-green:#2f6b4f}
html,body{background:var(--lab-bg)}
body{color:var(--lab-ink)}
.header{background:var(--lab-bg2);border-bottom:2px solid var(--lab-line);color:var(--lab-ink)}
.nav-tab{font-size:14px;height:44px;padding:0 18px;color:var(--lab-ink2);border:1px solid transparent}
.nav-tab:hover{background:#d3e8cc;border-color:var(--lab-line)}
.nav-tab.active{background:var(--lab-green);color:#fff;border-color:var(--lab-green)}
.nav-tab.active .pill{background:#ffffff30;color:#fff}
.catalog-back,.header .outline-btn,.icon-btn{background:var(--lab-panel);border:1px solid var(--lab-line);color:var(--lab-ink)}
.catalog-back{font-size:13px;border-radius:8px}
.icon-btn{width:38px;height:38px;font-size:15px}
.studio{background:var(--lab-bg)}
.studio-heading h1{color:var(--lab-ink)}
#boardSubtitle{font-size:14px;color:var(--lab-ink2)}
.eyebrow{color:#4d7a3f}
.assembly-bar button{background:var(--lab-card);border:1px solid var(--lab-line);color:var(--lab-ink);font-size:14px;min-height:46px;padding:10px 16px;border-radius:10px}
.assembly-bar button:hover{background:#f6fbf2;border-color:var(--lab-green)}
.assembly-bar .accent-action{background:#efd272;border-color:#b99a2e}
.assembly-bar #circuitStatus{font-size:13px;color:var(--lab-ink2);font-weight:600}
.assembly-bar #circuitStatus.live{color:#1f6b3a}
.run-btn,.sound-btn{min-height:46px;font-size:14px;border-radius:10px}
.sound-btn{background:var(--lab-card);border:1px solid var(--lab-line);color:var(--lab-ink)}
.component{background:var(--lab-card);border-color:var(--lab-line)}
.component.selected{background:#fff4c7}
.component-label{font-size:13px;color:var(--lab-ink)}
.component-status{font-size:11px;color:var(--lab-ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.board-chip{font-size:12px}
.board-guidance{font-size:12px;color:#cfe5c9;max-width:260px}
.board-tools .tool-group{background:var(--lab-panel);border:1px solid var(--lab-line)}
.tool{width:auto;min-width:40px;height:40px;font-size:20px;padding:0 6px;color:var(--lab-ink);border-radius:8px}
.tool#selectTool,.tool#wireTool{width:auto;min-width:78px;padding:0 10px;font-size:14px;gap:6px;font-weight:600}
.tool.active{background:var(--lab-green);color:#fff}
.tool:disabled{opacity:.4}
.zoom-tools #zoomLabel{font-size:13px;color:var(--lab-ink);min-width:44px;text-align:center;font-weight:600}
.telemetry{color:var(--lab-ink)}
.metric-label{font-size:11px;color:var(--lab-ink2);letter-spacing:.8px}
.metric strong{font-size:24px;color:var(--lab-ink)}
.model-note{font-size:12px;color:var(--lab-ink2)}
.sidebar .category{font-size:13px;padding:8px 12px;border-radius:8px}
.part-name{font-size:13px!important}
.part-detail{font-size:11px;color:#3f5e4f}
.part-card{background:var(--lab-card)}
.search-box input{font-size:14px}
.side-note strong,.warehouse-experiments strong{font-size:14px}
.warehouse-experiments small{font-size:12px}
.inspector{background:var(--lab-panel);border:1px solid var(--lab-line);color:var(--lab-ink)}
.inspect-desc{font-size:13px;line-height:1.55;color:var(--lab-ink2)}
.inspect-heading{font-size:16px}
.inspector .readings span,.connection-panel>span{font-size:10px;color:var(--lab-ink2)}
.inspector .readings strong{font-size:15px}
.inspect-toggle,.inspect-actions button,.connection-panel button{font-size:13px;min-height:40px;border-radius:8px}
dialog{background:var(--lab-panel);border:1px solid var(--lab-line);color:var(--lab-ink)}
dialog .modal-intro,.help-steps p{font-size:14px;line-height:1.6;color:var(--lab-ink2)}
.help-steps strong{font-size:15px}
.help-model{background:#d3e6cb;font-size:13px;line-height:1.6}
.primary-btn{background:var(--lab-green);color:#fff;border-color:#235640;font-size:14px;min-height:46px;border-radius:10px}
.outline-btn{background:var(--lab-card);border-color:var(--lab-line);color:var(--lab-ink);font-size:14px;min-height:46px;border-radius:10px}
.modal-close{width:42px;height:42px;background:var(--lab-card);border:1px solid var(--lab-line);color:var(--lab-ink)}
.experiment-card,.challenge-card,.project-option{background:var(--lab-card);border-color:var(--lab-line)}
.experiment-card p,.challenge-card p,.project-option span{font-size:13px;color:var(--lab-ink2)}
.experiment-card button,.examples button{font-size:13px;min-height:42px}
.sound-notice{font-size:13px}
.sound-notice button{font-size:13px;min-height:40px}
.steps-panel,.tour-bubble{background:var(--lab-panel);border-color:var(--lab-line)}
.steps-chip{font-size:13px}
.step-item strong{font-size:14px}.step-item small{font-size:12px}
.tour-bubble p{font-size:14px}.tour-actions button{font-size:14px;min-height:42px}
.toast{font-size:14px}
/* Cartel de misión / prueba */
.challenge-strip{background:var(--lab-panel);border:1px solid var(--lab-line);border-left:6px solid var(--c-orange);box-shadow:0 8px 26px #0a2a1c55;max-width:480px;padding:16px 52px 16px 18px;color:var(--lab-ink)}
.challenge-strip .eyebrow{font-size:11px;color:#a85a24}
.challenge-strip h3{font-size:17px;margin:4px 0 6px;color:var(--lab-ink)}
.challenge-strip p{font-size:14px;line-height:1.55;color:var(--lab-ink2)}
.challenge-strip .strip-hint{margin-top:10px;padding:10px 12px;background:#f7e9b0;border:1px solid #cdb25a;border-radius:8px;color:#4a3b0d}
.challenge-strip.complete{background:#d4ecd0;border-left-color:var(--c-green)}
.strip-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.challenge-strip .strip-actions button{font-size:13px;font-weight:600;min-height:40px;padding:8px 13px;margin:0;border-radius:8px;background:var(--lab-card);border:1px solid var(--lab-line);color:var(--lab-ink)}
.challenge-strip .strip-actions button:hover{background:#fff;border-color:var(--lab-green)}
.challenge-strip .strip-close{position:absolute;top:8px;right:8px;width:40px;height:40px;margin:0;padding:0;border-radius:50%;font-size:24px;line-height:1;background:var(--lab-card);border:1px solid var(--lab-line);color:var(--lab-ink);display:grid;place-items:center;cursor:pointer}
.challenge-strip .strip-close:hover{background:#f6c9c9;border-color:var(--c-coral)}
.strip-reopen{position:absolute;left:18px;bottom:73px;z-index:4;background:var(--c-orange);color:#fff;border:0;border-radius:22px;min-height:42px;padding:0 18px;font-size:14px;font-weight:700;box-shadow:0 6px 18px #0a2a1c66;cursor:pointer}
@media(max-width:800px){
 .nav-tab{font-size:13px;padding:0 10px}
 .assembly-bar button{font-size:13px;padding:8px 10px}
 .metric strong{font-size:19px}
 .metric-label{font-size:9px;letter-spacing:.3px}
 .tool#selectTool,.tool#wireTool{min-width:44px}
 .tool#selectTool span,.tool#wireTool span{display:none}
}
@media(max-width:600px){
 .nav-tab{font-size:12px;padding:0 7px}
 .challenge-strip{left:10px;right:10px;max-width:none;bottom:66px;padding:12px 48px 12px 14px;max-height:46%;overflow-y:auto}
 .challenge-strip h3{font-size:15px}.challenge-strip p{font-size:13px}
 .strip-reopen{left:10px;bottom:66px}
 .component-label{font-size:12px}
 .component-status{font-size:10px}
 .model-note{display:none}
}
@media(max-width:600px){
 .board-tools{left:8px;right:8px;gap:4px}
 .tool{min-width:34px;height:38px;padding:0 3px;font-size:18px}
 .tool#selectTool,.tool#wireTool{min-width:38px;padding:0 4px}
 .zoom-tools #zoomLabel{min-width:36px;font-size:12px}
 .zoom-tools .tool{width:34px}
 .zoom-tools .tool-divider{display:none}
 .challenge-strip{padding:10px 46px 10px 12px;max-height:40%}
 .challenge-strip .eyebrow{font-size:10px}
 .challenge-strip h3{font-size:14px;margin:2px 0 3px}
 .challenge-strip p{font-size:12.5px;line-height:1.45}
 .challenge-strip .strip-hint{margin-top:6px;padding:7px 9px}
 .strip-actions{gap:6px;margin-top:8px}
 .challenge-strip .strip-actions button{font-size:12px;min-height:36px;padding:6px 10px}
 .challenge-strip .strip-close{width:36px;height:36px;top:6px;right:6px;font-size:22px}
 .assembly-bar button{padding:8px 6px}
 .assembly-bar button span{white-space:nowrap}
}
@media(min-width:801px){
 .challenge-strip{max-width:660px}
 .sidebar{padding-left:30px}
}