*{box-sizing:border-box}body{margin:0;background:#f7f9fb;color:#182c3b;font:14px system-ui,sans-serif}header{display:flex;align-items:center;gap:8px;min-height:66px;padding:10px 15px;background:#fff;border-bottom:1px solid #d9e2e8;position:relative;z-index:3;flex-wrap:wrap}header strong{display:block;letter-spacing:.08em;font-size:12px}header small{color:#6a7d88;font-size:10px}header>div{margin-right:10px}button,header input,select,header a{font:inherit;color:#223b4c;background:#fff;border:1px solid #c9d6de;border-radius:7px;padding:8px 10px;text-decoration:none}button,select{cursor:pointer}button:hover,header a:hover{background:#eef3f6}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #8b50c9;outline-offset:2px}#fit{background:#182c3b;color:white}header input{width:185px}#view{height:calc(100dvh - 107px);overflow:hidden;cursor:grab;position:relative}#view.panning{cursor:grabbing}#view>svg{display:block;width:100%;height:100%;touch-action:none}.cable{cursor:pointer}.wire-hit{stroke:transparent;stroke-width:13;fill:none;pointer-events:stroke}.cable.selected>polyline:not(.wire-hit){filter:drop-shadow(0 0 3px #182c3b);stroke-width:6}.device,.device-overlay{cursor:pointer}.device-overlay{fill:transparent;stroke:transparent;stroke-width:3}.device.selected>rect:first-child,.device:focus>rect:first-child,.device-overlay.selected,.device-overlay:focus{stroke:#bd8b25;stroke-width:4}.device:focus,.device-overlay:focus,.cable:focus{outline:none}.cable:focus>polyline:not(.wire-hit){stroke-width:7}.measurement{display:block;width:100%;height:18px;padding:1px 2px;border:1px solid #9caeb9;border-radius:2px;background:#fff;font:10px Arial,sans-serif;color:#182c3b;appearance:textfield;cursor:text}.measurement::-webkit-inner-spin-button{appearance:none}foreignObject{overflow:visible}aside{position:fixed;right:18px;bottom:55px;z-index:4;width:330px;max-height:65vh;overflow:auto;background:#fff;border:1px solid #d5dfe5;border-top:4px solid #8b50c9;border-radius:12px;padding:20px;box-shadow:0 8px 32px #182c3b26}aside h2{font-size:19px;margin:8px 0 12px}aside p{line-height:1.5;font-size:13px}aside small{color:#607481}#close{float:right;border:0;font-size:20px;padding:0 4px}#actions{display:flex;flex-wrap:wrap;gap:8px}#actions button{font-size:12px;text-align:left}footer{min-height:40px;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:9px 16px;border-top:1px solid #d9e2e8;background:#fff;font-size:11px;color:#607481}#matches{position:absolute;z-index:6;top:66px;left:260px;width:330px;max-height:350px;overflow:auto;background:white;box-shadow:0 8px 20px #182c3b26}#matches button{display:block;width:100%;text-align:left;border-radius:0;border:0;border-bottom:1px solid #e2e8eb}#loading{padding:40px}.note{color:#775690} @media(max-width:900px){header>div{display:none}header input{width:145px}header a{display:none}#view{height:calc(100dvh - 150px)}footer{flex-wrap:wrap}#matches{left:10px;top:105px}aside{width:290px;right:10px}}

.flow-layer{pointer-events:none}.flow-arrow{filter:drop-shadow(0 0 1px white)}#solo-circuit .device{cursor:pointer}#solo-circuit .device.selected>g>rect:first-child{stroke:#bd8b25;stroke-width:4}

.calc-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.calc-fields label{font-size:11px;color:#536675}.calc-fields input{display:block;width:100%;padding:7px;border:1px solid #b4c4ce;border-radius:4px;font:14px system-ui}.calculator,.device-spec{border-top:1px solid #d9e2e8;margin-top:16px;padding-top:8px}#calc-result{background:#f0ebf7;padding:12px;margin:12px 0;border-radius:7px}#calc-result p{font-size:12px}aside a{font-size:12px;color:#674195}
body{display:flex;flex-direction:column;height:100dvh;overflow:hidden}header,footer{flex:none}#view{flex:1;min-height:0;height:auto!important}.terminal-photo{display:block;width:100%;max-height:240px;object-fit:contain;background:#f1f4f6;border:1px solid #d9e2e8;border-radius:7px;margin-top:10px}.photo-caption{font-size:11px!important;color:#607481}
.component-embed header>div,.component-embed #search,.component-embed #zone,.component-embed #flow-mode,.component-embed #specs,.component-embed #export,.component-embed header>a,.component-embed footer{display:none!important}.component-embed header{min-height:44px;padding:6px;gap:5px}.component-embed header button{font-size:11px;padding:6px}.component-embed aside{width:min(320px,85%);right:8px;bottom:8px;max-height:78%}

body:not(.component-embed) #connections-toggle{display:none}

#shared-alert{position:fixed;z-index:30;left:12px;right:12px;bottom:48px;padding:12px;background:#fff0d6;border:1px solid #c49b52;border-radius:8px;color:#543f16;font-size:12px;box-shadow:0 4px 15px #0002}#shared-alert button{font-size:11px;margin:5px;padding:7px;background:white}#shared-import{font-size:10px;padding:5px}.component-embed footer{display:flex!important;font-size:10px;padding:6px}.component-embed footer>span:first-child{display:none}
