:root{color-scheme:dark;--bg:#0c1118;--panel:#121a25;--border:#293345;--text:#e7edf7;--muted:#9baac0;--accent:#70e2c2}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 'Segoe UI',Arial,sans-serif}button,input,select,textarea{font:inherit}button{background:#1c2736;border:1px solid #354258;color:var(--text);border-radius:6px;padding:7px 13px;cursor:pointer;font-size:14px}button:hover{background:#2a3b50}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.primary{background:var(--accent);color:#09271f;border-color:var(--accent);font-weight:650}.primary:hover{background:#a0f3dc}a{color:var(--accent)}header{display:flex;align-items:center;gap:24px;padding:18px 24px;border-bottom:1px solid var(--border);background:#101722}.brand{display:flex;align-items:center;gap:12px;color:var(--accent);text-decoration:none;font-size:28px}.brand span{font-size:18px;letter-spacing:1px;color:var(--text)}.brand b{font-weight:400;color:var(--muted)}.tag,.eyebrow{font-size:12px;letter-spacing:2px;color:var(--accent);font-weight:600}.header-actions{display:flex;gap:8px;margin-left:auto}.projectbar{padding:12px 24px;display:flex;align-items:center;gap:12px}.projectbar input{background:transparent;border:0;width:230px;font-weight:600;font-size:18px;padding:3px}.projectbar span{color:var(--muted);font-size:14px}.spacer{flex:1}nav{display:flex;gap:4px;padding:0 24px;border-bottom:1px solid var(--border)}nav button{border:0;background:transparent;border-radius:0;padding:12px 20px;color:var(--muted);border-bottom:2px solid transparent}nav button.active{color:var(--accent);border-bottom-color:var(--accent)}.model-tag{color:var(--muted);font-size:12px;align-self:center}.view{display:none}.view.active{display:grid}#wiring{grid-template-columns:260px minmax(450px,1fr) 280px;min-height:calc(100vh - 182px)}aside{background:var(--panel);padding:18px;border-right:1px solid var(--border)}.inspector{border-right:0;border-left:1px solid var(--border)}.section-head{font-size:12px;letter-spacing:1.5px;font-weight:600;color:var(--muted);display:flex;justify-content:space-between;margin-bottom:16px}.section-head span{letter-spacing:0;color:var(--accent)}input,select,textarea{width:100%;border:1px solid var(--border);border-radius:5px;padding:9px;background:#0e1520;color:var(--text);font-size:14px}.palette input{margin-bottom:8px}.palette select{margin-bottom:18px}#parts{max-height:57vh;overflow:auto}.part{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:0;border-bottom:1px solid #243043;border-radius:0;background:transparent;padding:10px 2px}.part-icon{width:30px;height:30px;border-radius:6px;display:grid;place-items:center;background:#26364b;color:var(--accent);font-size:18px}.part small{display:block;color:var(--muted);font-size:12px}.wide{width:100%;margin-top:16px}.workspace{min-width:0}.canvasbar{display:flex;gap:10px;align-items:center;padding:10px 16px;background:#111925;color:var(--muted);font-size:13px}.canvasbar button:last-child{margin-left:auto}#canvasWrap{height:57vh;min-height:380px;overflow:hidden;background-color:#0d1420;background-image:radial-gradient(#293347 1px,transparent 1px);background-size:20px 20px}#canvas{width:100%;height:100%;touch-action:none}.device{cursor:grab}.device rect.body{fill:#182434;stroke:#3b4c66;stroke-width:2}.device.selected rect.body{stroke:var(--accent);stroke-width:3}.device text{fill:#e7edf7;pointer-events:none}.device .port-label{font-size:13px;fill:#b2c1d6}.device .device-name{font-size:16px;font-weight:600}.device .device-category{font-size:11px;fill:#8599b5}.port{cursor:crosshair;stroke:#091018;stroke-width:3}.port.pending{stroke:white;stroke-width:5}.wire{cursor:pointer;fill:none;stroke-width:4;opacity:.85}.wire:hover{stroke-width:8}.wire-hit{fill:none;stroke:transparent;stroke-width:18;cursor:pointer}.legend{display:flex;gap:14px;font-size:12px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--border);flex-wrap:wrap}.legend>span[style]:before{content:'';display:inline-block;width:8px;height:8px;background:var(--c);border-radius:50%;margin-right:5px}.legend span:last-child{color:var(--muted)}.diagnostics{padding:16px;max-height:210px;overflow:auto;font-size:14px}.diagnostic{padding:8px 12px;border-left:3px solid #f3c86d;background:#1e2330;margin-bottom:7px}.diagnostic.error{border-color:#ff785a}.diagnostic.ok{border-color:var(--accent)}label{display:block;color:var(--muted);font-size:14px;margin-bottom:13px}label input,label select{margin-top:5px}label input[type=checkbox]{width:auto;margin-right:8px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.muted,.footnote{color:var(--muted);font-size:13px}.footnote{margin-top:18px}.danger{color:#ff9d8b;border-color:#734137}.metrics-head{margin-top:32px}.metric{padding:12px 0;border-bottom:1px solid var(--border)}.metric small{display:block;color:var(--muted);font-size:12px}.metric strong{font-size:25px;font-weight:500}.metric strong em{font-style:normal;font-size:13px;color:var(--muted)}.metric.warning strong{color:#ffb38b}.inspector h3{margin:0 0 4px;font-size:18px}.inspector p{color:var(--muted);font-size:14px}.pill{font-size:12px;border:1px solid var(--border);border-radius:20px;padding:5px 12px;color:var(--muted)}#mechanisms{grid-template-columns:250px minmax(430px,1fr) 290px;min-height:calc(100vh - 182px)}.mechanism-list p{font-size:14px;color:var(--muted)}.mechanism-item{width:100%;text-align:left;margin-bottom:8px;padding:13px}.mechanism-item.active{border-color:var(--accent);background:#1d3c37}.mechanism-item small{display:block;color:var(--muted);font-size:12px}.mechanism-work{padding:24px;min-width:0}.mech-title{display:flex;justify-content:space-between;align-items:center}h1{font-size:28px;line-height:1.2;margin:8px 0 24px;font-weight:550}#mechanismCanvas{width:100%;height:390px;background:#0e1723;border:1px solid var(--border);border-radius:10px}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:20px}.metric-grid .metric{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:14px}.metric-grid strong{font-size:22px}.controlbar{display:flex;align-items:center;gap:20px;margin-top:25px}.controlbar label{display:flex;align-items:center;gap:16px;flex:1;margin:0}.controlbar input{flex:1;width:100px;accent-color:var(--accent)}.controlbar output{min-width:45px;color:var(--accent)}#library{padding:32px 40px;display:none}#library.active{display:block}.library-top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.library-top p{color:var(--muted);max-width:760px}.library-filters{display:flex;gap:12px;margin:24px 0}.library-filters input{max-width:450px}.library-filters select{width:240px}#libraryGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}.library-card{padding:20px;border:1px solid var(--border);border-radius:8px;background:var(--panel)}.library-card h3{margin:9px 0;font-size:18px}.library-card p{font-size:14px;color:var(--muted)}.library-card .ports{font-size:12px;color:#bdc9da;min-height:55px}.library-card button{margin-top:14px}.library-card .eyebrow{font-size:11px}#notes.active{display:block}article{max-width:900px;margin:40px auto;padding:0 24px 50px}article p,article li{color:#b9c7da}article h2{margin-top:30px;font-size:21px}.source-links{display:grid;gap:10px}dialog{color:var(--text);background:var(--panel);border:1px solid #475a74;border-radius:12px;max-width:620px;width:95%;max-height:90vh;overflow:auto;padding:28px}dialog::backdrop{background:#000b}dialog h2{margin-top:0}.dialog-actions{display:flex;justify-content:flex-end;gap:10px}#customError{color:#ff9d8b}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#23473e;color:#d8fff1;border:1px solid #4b9e89;border-radius:8px;padding:12px 22px;z-index:20;display:none;max-width:90vw}.port-list{font-size:12px;color:var(--muted)}@media(max-width:1100px){#wiring{grid-template-columns:220px 1fr}.inspector{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:20px;border-top:1px solid var(--border)}.inspector>.section-head{grid-column:1/-1;margin-bottom:0}.metrics-head{margin-top:0}#mechanisms{grid-template-columns:220px 1fr}.tag{display:none}.metric-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){header{flex-wrap:wrap;padding:14px;gap:12px}.header-actions{width:100%;margin:0;flex-wrap:wrap}.projectbar{flex-wrap:wrap;padding:12px}.projectbar .spacer{display:none}nav{padding:0;overflow:auto}nav button{white-space:nowrap;padding:12px}.model-tag{display:none}#wiring,#mechanisms{grid-template-columns:1fr}.palette{border-bottom:1px solid var(--border)}#parts{display:flex;gap:8px;max-height:none;overflow:auto}.part{min-width:170px;border:1px solid var(--border);padding:8px}.palette .section-head{margin-bottom:8px}.palette select{margin-bottom:8px}.palette input{width:60%}.palette select{width:38%}.wide{margin-top:10px}#canvasWrap{height:55vh}.inspector{display:block}.legend .spacer,.legend span:last-child{display:none}.mechanism-work{padding:14px}#mechanismCanvas{height:290px}.mechanism-list{padding:14px}#mechanismList{display:flex;overflow:auto;gap:8px}.mechanism-item{min-width:180px}.controlbar{flex-wrap:wrap}.controlbar label{min-width:250px}#library{padding:24px 14px}.library-top{display:block}.library-filters{flex-wrap:wrap}.library-filters select{width:100%}}

:root{--hardware-label:#d7e2ef}.hardware-device rect.body{fill:transparent;stroke:transparent}.hardware-device:hover rect.body{fill:#19253644;stroke:#51647c;stroke-dasharray:5 4}.hardware-device.selected rect.body{fill:#1b5b4820;stroke:#70e2c2}.hardware-device .device-name{paint-order:stroke;stroke:#0d1420;stroke-width:5px;fill:var(--hardware-label)}.hardware-device .device-category{paint-order:stroke;stroke:#0d1420;stroke-width:3px}.hardware-device .port-label{display:none;paint-order:stroke;stroke:#0d1420;stroke-width:4px;fill:#edf6ff;font-weight:600}.hardware-device.selected .port-label,.hardware-device:hover .port-label{display:block}.hardware-device .port{stroke:#0b121b;stroke-width:2;opacity:.8}.hardware-device .port:hover,.hardware-device .port:focus{r:10;stroke:white;opacity:1}.hardware-thumb{display:block;width:46px;height:46px;flex-shrink:0}.hardware-thumb img{width:100%;height:100%;object-fit:contain}.atlas-thumb{background-image:url('assets/hardware/generic-atlas.png');background-size:300% 300%;background-repeat:no-repeat}.library-card>.hardware-thumb{width:100%;height:130px;display:block;margin:12px auto}.library-card>.atlas-thumb{width:130px}.wire{stroke-width:3}.canvasbar{flex-wrap:wrap}.canvasbar span{flex:1}.canvasbar button:last-child{margin-left:0}

.pneumatics-toggle{display:flex;align-items:center;gap:8px;margin:0 16px 0 0;white-space:nowrap;align-self:center;color:#c0cfdf;font-size:14px}.pneumatics-toggle input{width:auto;margin:0;accent-color:var(--accent)}.pneumatic-disabled{opacity:.28}.disabled-note{border-left:3px solid #e8b265;padding:8px 12px;background:#332d20}@media(max-width:700px){.pneumatics-toggle{margin-right:12px}}

.templates-dialog{max-width:960px}.template-heading{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.template-heading h2{margin:8px 0}.templates-dialog>p{color:var(--muted);font-size:14px}#templateGrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0}.template-card{background:#0d1622;border:1px solid var(--border);border-radius:9px;padding:20px;display:flex;flex-direction:column}.template-card h3{font-size:19px;margin:10px 0}.template-card p{color:var(--muted);font-size:14px;flex:1}.template-card small{display:block;color:#b4c5db;margin-bottom:18px}.template-card button{align-self:flex-start}@media(max-width:650px){#templateGrid{grid-template-columns:1fr}}

.protocol-key{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:12px 24px;background:#141d2a;border-bottom:1px solid var(--border);font-size:13px;color:#c1cede}.protocol-key strong{font-size:11px;letter-spacing:1.4px;color:var(--muted)}.protocol-key span{display:flex;align-items:center;gap:5px}.protocol-key i{display:block;width:15px;height:4px;border-radius:2px}.protocol-key label{display:flex;gap:6px;align-items:center;margin:0 0 0 auto;font-size:13px}.protocol-key input{width:auto;margin:0;accent-color:var(--accent)}.wire-underlay{fill:none;stroke-width:9;pointer-events:none}.show-port-labels .hardware-device .port-label{display:block}.device-port-buttons{display:grid;gap:5px;margin-top:16px;max-height:260px;overflow:auto}.device-port-buttons button{text-align:left;border-left:3px solid var(--port-color);font-size:13px}.device-port-buttons small{float:right;color:var(--muted);font-size:11px}#connections.active{display:block}.connections-content{max-width:1200px;margin:30px auto;padding:0 24px}.connection-builder{display:grid;grid-template-columns:180px 1fr 1fr auto;gap:14px;align-items:end;background:var(--panel);padding:20px;border:1px solid var(--border);border-radius:8px}.connection-builder label{margin:0}.connection-builder button{margin-bottom:1px}.connection-metrics{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}.connection-metrics span{padding:10px 16px;background:var(--panel);border:1px solid var(--border);border-radius:6px}.connection-table{width:100%;border-collapse:collapse;font-size:14px}.connection-table th,.connection-table td{padding:12px;border-bottom:1px solid var(--border);text-align:left}.connection-table th{color:var(--muted);font-weight:500}.protocol-badge{border-left:3px solid var(--wire-color);padding-left:9px;white-space:nowrap}@media(max-width:800px){.connection-builder{grid-template-columns:1fr}.connection-table{font-size:12px}.protocol-key{gap:12px;padding:12px}}

#simulation{grid-template-columns:250px minmax(430px,1fr) 290px;min-height:calc(100vh - 230px)}.simulation-dashboard{grid-column:1/-1;padding:20px 24px;background:#152335;border-bottom:1px solid #3a526d}.simulation-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.simulation-heading h2{font-size:23px;margin:5px 0 16px}.simulation-readings{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.simulation-readings .metric{padding:8px 12px;border:1px solid var(--border);border-radius:6px;background:#101a28}.simulation-dashboard p{color:#bccde2;font-size:14px;margin:14px 0 0}#simulation .pill{color:var(--accent)}@media(max-width:1100px){#simulation{grid-template-columns:220px 1fr}.simulation-readings{grid-template-columns:repeat(3,1fr)}}@media(max-width:700px){#simulation{grid-template-columns:1fr}.simulation-readings{grid-template-columns:repeat(2,1fr)}.simulation-heading{flex-wrap:wrap}}