.workspace{grid-template-columns:205px minmax(0,1fr);position:relative}
.canvas-panel{isolation:isolate}
.floating-panel{position:absolute;z-index:8;background:#292929f2;border:1px solid #555;border-radius:9px;box-shadow:0 12px 32px #0008;backdrop-filter:blur(9px);padding:12px;max-height:min(480px,calc(100% - 24px));overflow:auto}
.floating-panel[hidden]{display:none!important}
.inspector{top:56px;right:16px;width:240px;min-height:0}
.circuit-options{top:10px;right:12px;width:250px}
.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px;cursor:move;user-select:none;font-size:12px;letter-spacing:.03em}
.close-panel{background:transparent;color:#d1d5db;border:0;border-radius:5px;width:24px;height:24px;font-size:20px;line-height:20px;cursor:pointer}
.close-panel:hover{background:#444}
.selection-panel{margin:0;min-height:0}
.selection-panel p{margin:8px 0 0}
.selection-panel .pill{font-size:10px}
.circuit-options .section-divider{margin:12px 0}
.circuit-options .privacy-note{font-size:10px}
.component .body{fill:transparent;stroke:transparent}
.component.selected .body{stroke:#60a5fa;stroke-width:1.5;stroke-dasharray:4 4}
.component .symbol{stroke:#e7edf5;stroke-width:2;stroke-linecap:square;stroke-linejoin:miter;fill:none}
.component .symbol-fill{fill:#e7edf5;stroke:none;pointer-events:none}
.component .norm-box{fill:#242c35;stroke:#e7edf5;stroke-width:2;pointer-events:none}
.component .norm-active{fill:#2d4755}
.component .norm-port-line{stroke:#e7edf5;stroke-width:2;fill:none;pointer-events:none}
.component .norm-port-text{fill:#e7edf5;font-size:10px;font-weight:700;pointer-events:none}
.component .port{r:6;fill:#1a1a1a;stroke:#d7e0ea;stroke-width:1.7}
.component .port-label{font-size:10px}
.component .label{font-size:11px;fill:#dbe6ef}
.component .actuator{fill:#273e4e;stroke:#e7edf5;stroke-width:1.7}
.component .actuator.on{fill:#276f8c}
.component .actuator-label{font-size:10px}
.component .piston{fill:#dce5ed;stroke:#dce5ed;stroke-width:1}
.wire.exhaust{animation:flow .85s linear infinite}
.wire.flow-reverse{animation-direction:reverse}
.wire.electrical-wire{stroke:#a78bfa;stroke-width:3;stroke-dasharray:5 5;animation:none}
.wire.electric-active{stroke:#c4b5fd;stroke-width:4;stroke-dasharray:5 5;animation:flow .7s linear infinite}
.wire.preview-wire{stroke:#e5e7eb;stroke-width:2;stroke-dasharray:5 6;pointer-events:none;opacity:.8}
.active-tool{background:#1d4f72!important;color:#fff!important;box-shadow:inset 0 0 0 1px #60a5fa}
.component .electric-port{stroke:#a78bfa}
.component .electric-port.active{fill:#8b5cf6;stroke:#ddd6fe}
.component .note-text{fill:#fde68a;font-size:14px;font-weight:600;pointer-events:none}
.component.annotation .body{fill:#40391f;stroke:#c4a94d;stroke-width:1.5}
.legend .line.electric{background:#a78bfa}
.text-field:focus-visible,.floating-panel button:focus-visible,.toolgroup button:focus-visible,.library-item:focus-visible,.family-toggle:focus-visible{outline:2px solid #93c5fd;outline-offset:2px}
.selection-panel textarea{min-height:58px;resize:vertical}
#circuitCanvas:focus-visible{outline:2px solid #60a5fa;outline-offset:-3px}
@media(prefers-reduced-motion:reduce){.wire.electric-active{animation:none}}
@media(prefers-reduced-motion:reduce){.wire.exhaust,.wire.flow-reverse{animation:none}}
.library-item .glyph{width:55px;height:41px;background:#1a2229}
.library-item .glyph svg{width:49px;height:35px;overflow:visible}
.library-item .glyph .actuator{pointer-events:none}
.library-family{min-width:0}
.family-toggle{width:100%;display:flex;align-items:center;gap:6px;padding:5px 3px;background:transparent;border:0;border-bottom:1px solid #3c4249;color:#dce5ed;text-align:left;font-size:10px;font-weight:700;cursor:pointer}
.family-toggle>span:first-child{flex:1}
.family-toggle small{color:#9daab7;font-size:10px;font-weight:500}
.family-chevron{width:13px;text-align:center;color:#9daab7;font-size:14px}
.family-components{display:grid;gap:6px;padding-top:6px}
.family-components[hidden]{display:none}
@media(max-width:900px){.workspace{grid-template-columns:165px minmax(0,1fr)}.floating-panel{max-height:min(390px,calc(100% - 20px))}}
@media(max-width:610px){.workspace{grid-template-columns:1fr;grid-template-rows:auto minmax(220px,1fr)}.library{max-height:145px;border-right:0;border-bottom:1px solid var(--edge)}.library-items{display:flex;overflow-x:auto;align-items:flex-start}.library-family{width:210px;min-width:210px}.family-components{display:flex;overflow-x:auto}.library-item{min-width:150px}.library-footer{display:flex;margin-top:8px;padding-top:8px}.inspector{top:40px;right:8px;width:min(240px,calc(100% - 16px))}.circuit-options{width:min(250px,calc(100% - 16px))}.floating-panel{max-height:65%}}