:root{--ink:#203044;--muted:#7b8796;--line:#e4e8ed;--orange:#ee702c;--navy:#172b40}*{box-sizing:border-box}body{margin:0;background:#f6f8fa;color:var(--ink);font:14px system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,select{font:inherit}button{background:#fff;border:1px solid var(--line);color:var(--ink);border-radius:6px;padding:9px 13px;cursor:pointer;white-space:nowrap}button:hover{border-color:#ef9d70;background:#fff8f3}button:focus-visible,input:focus-visible{outline:2px solid var(--orange);outline-offset:2px}button.primary{background:var(--orange);color:white;border-color:var(--orange);font-weight:600}header{height:72px;background:var(--navy);color:white;display:flex;align-items:center;padding:0 26px;gap:25px}.brand{display:flex;align-items:center;gap:12px;color:white;text-decoration:none;font-size:15px;letter-spacing:2px}.brand b{font-weight:400;color:#a3b2c2;font-size:11px;display:block;letter-spacing:2.5px;margin-top:3px}.logo{background:var(--orange);font-size:25px;font-weight:800;width:38px;height:38px;display:grid;place-items:center;border-radius:8px;letter-spacing:-4px;padding-right:4px}.prototype{font-size:9px;border:1px solid #486074;color:#afbdca;border-radius:4px;padding:5px 7px;letter-spacing:1px}.head-actions{margin-left:auto;display:flex;align-items:center;gap:22px}.head-actions span{font-size:11px;color:#a9b9c9}.head-actions button{background:#2c4053;color:#fff;border-color:#405365}.projectbar{min-height:112px;padding:22px 26px;display:flex;align-items:center;justify-content:space-between;gap:18px;background:white;border-bottom:1px solid var(--line)}.eyebrow{font-size:9px;letter-spacing:1.5px;font-weight:700;color:var(--muted)}#projectName{display:block;font-size:23px;font-weight:600;border:0;background:transparent;width:480px;max-width:100%;padding:5px 0;color:var(--ink)}.project-meta{font-size:11px;color:var(--muted)}.actions{display:flex;gap:8px}main{display:grid;grid-template-columns:224px minmax(350px,1fr) 278px;min-height:calc(100vh - 220px)}aside{background:white;padding:22px 18px}.library{border-right:1px solid var(--line)}.section-title{font-size:14px;font-weight:650;display:flex;align-items:center;justify-content:space-between}.muted{font-size:11px;line-height:1.7;color:var(--muted)}input,select{border:1px solid #dce2e8;border-radius:5px;padding:9px;color:var(--ink);background:white;width:100%}#search{font-size:12px;background:#f8fafc;margin:7px 0 22px}.palette-label{margin-bottom:12px}.equipment{width:100%;display:flex;align-items:center;text-align:left;gap:12px;padding:12px 9px;margin-bottom:7px;background:#fff;border:1px solid #e9edf1}.equipment svg{width:32px;height:32px;color:#3e596b}.equipment strong{font-size:12px;font-weight:600;display:block}.equipment small{color:var(--muted);font-size:10px}.equipment:hover{background:#fff7f1;border-color:#f3bd9b}.library-note{background:#f7f9fb;border-radius:7px;padding:14px;margin-top:25px;font-size:11px;line-height:1.7}.library-note .orange{display:block;font-size:23px}.library-note p{margin-bottom:0;color:var(--muted)}.full{width:100%;margin-top:12px;font-size:11px}.orange{color:var(--orange)}.workspace{min-width:0;display:flex;flex-direction:column}.tools{height:53px;background:#fff;border-bottom:1px solid var(--line);padding:8px 14px;display:flex;align-items:center;justify-content:space-between}.tools button{border:0;font-size:11px;padding:7px 9px}.tools button.active{background:#fff0e5;color:#c85e21}.tools span{font-size:10px;display:inline-block;min-width:36px;text-align:center}.canvas-wrap{position:relative;flex:1;min-height:460px;overflow:hidden;background:#f8fafc}#canvas{display:block;width:100%;height:100%;position:absolute;touch-action:none}.canvas-caption{position:absolute;bottom:14px;left:17px;font-size:10px;color:#6a7c8d;background:#ffffffed;padding:8px 11px;border-radius:5px;pointer-events:none}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#66a18a;margin-right:7px}.canvas-key{position:absolute;top:15px;left:18px;font-size:9px;letter-spacing:1px;color:#8997a4;pointer-events:none}.canvas-key span{padding:0 7px}.bottom{background:white;border-top:1px solid var(--line);padding:16px 20px}.bottom-title{display:flex;align-items:center;gap:12px;font-size:12px}.pill{background:#f0f3f6;padding:3px 7px;border-radius:4px;color:#788796;font-size:9px}#networkStats{margin-left:auto;font-size:10px;color:var(--muted)}#checks{max-height:160px;overflow:auto;font-size:12px;color:#6b7b8b;line-height:1.6}#checks p{margin:13px 0}.issue{padding:5px 0;border-bottom:1px solid #f0f2f4}.solver-note{font-size:10px;color:#8a96a3;padding-top:9px}.properties{border-left:1px solid var(--line)}.prop-symbol{background:#fff5ed;border:1px solid #ffe3d0;border-radius:9px;width:57px;height:57px;display:grid;place-items:center;margin:28px 0 12px;color:var(--orange)}.prop-symbol svg{width:42px;height:42px}.properties h2{font-size:17px;margin:6px 0}.tag{font-size:9px;background:#f0f3f6;padding:4px 6px;border-radius:3px;color:#6d7e8e;display:inline-block;margin:6px 0 20px}.field{display:block;margin-bottom:15px;font-size:11px;color:#66798c}.field input{display:block;margin-top:7px;font-size:12px}.field-note{font-size:10px;line-height:1.6;color:#8b97a4;margin-top:20px}.danger{color:#c35b50}.properties .full{padding:10px}footer{background:white;border-top:1px solid var(--line);height:36px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;font-size:10px;color:#8a97a4}footer b{padding:0 8px;color:#ee702c}dialog{border:1px solid var(--line);border-radius:12px;max-width:600px;width:90%;padding:24px;box-shadow:0 25px 80px #172b4033}dialog::backdrop{background:#172b4070}.dialog-head{display:flex;justify-content:space-between;align-items:center}.dialog-head h2{font-size:20px}.template-row{padding:13px 0;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:10px}.template-row small{display:block;color:var(--muted);font-size:10px;margin-top:4px}#toast{position:fixed;bottom:50px;left:50%;transform:translateX(-50%);background:var(--navy);color:white;border-radius:6px;padding:12px 20px;opacity:0;pointer-events:none;transition:opacity .2s;font-size:12px;z-index:10}.node{cursor:grab}.node.selected .halo{stroke:#ee702c;fill:#fff9f4}.node text{pointer-events:none}.edge{cursor:pointer}.empty-message{padding-top:30px;color:var(--muted);line-height:1.8;font-size:12px}@media(min-width:1550px){main{grid-template-columns:250px 1fr 300px}.canvas-wrap{min-height:600px}}@media(max-width:1100px){.projectbar{align-items:flex-start;flex-direction:column}main{grid-template-columns:180px minmax(300px,1fr) 235px}aside{padding:18px 12px}.brand{font-size:13px}#projectName{font-size:20px}.tools{padding:8px}.tools button{padding:7px 5px}}@media(max-width:760px){header{padding:0 14px}.prototype,.head-actions span{display:none}.projectbar{padding:18px}.actions{flex-wrap:wrap}.actions button{font-size:11px}main{grid-template-columns:140px minmax(220px,1fr)}.properties{grid-column:1/-1;border-top:1px solid var(--line)}.properties #props{max-width:500px}.canvas-wrap{min-height:480px}.equipment{gap:5px;padding:8px 5px}.equipment svg{width:25px}.equipment small,.library-note{display:none}.tools{height:auto;flex-wrap:wrap;gap:6px}.bottom-title{flex-wrap:wrap}footer span:last-child{display:none}.canvas-key{font-size:8px}.bottom{padding:12px}.head-actions{margin-left:auto}.brand{letter-spacing:1px}}
.node text{pointer-events:auto;cursor:pointer}

/* Connection affordances */
.port{cursor:crosshair;outline:none}.port-dot{fill:white;stroke:#688797;stroke-width:1.6;pointer-events:none}.port.connected .port-dot{fill:#496778;stroke:#496778}.port-label{font-size:8px;font-weight:700;fill:#8a684e;opacity:0;pointer-events:none}.node:hover .port-label,.connecting .port-label,.port:focus .port-label{opacity:1}.port:hover .port-dot,.port:focus .port-dot,.port.target .port-dot{fill:#ee702c;stroke:#c75317;stroke-width:2.5}.connecting .node{cursor:crosshair}.connecting .port-dot{r:6;stroke:#d57941}.node.wire-source .halo{stroke:#ee702c;fill:#fff5ec}.cable-help{font-size:11px;line-height:1.65;background:#fff4e9;border-left:2px solid #ee702c;padding:10px;color:#87522f}.tools [hidden]{display:none}.canvas-caption{max-width:calc(100% - 34px);line-height:1.5}.tools{height:auto;min-height:53px;gap:8px;flex-wrap:wrap}.tools>div:first-child{display:flex;flex-wrap:wrap}.node .equipment-symbol{pointer-events:none}
/* Keep the drawing coordinate system stable while inspecting different equipment. */
main{height:max(700px,calc(100vh - 220px));min-height:0}.library,.properties{min-height:0;overflow-y:auto}.workspace{min-height:0;overflow:hidden}.canvas-wrap{min-height:320px}.bottom{flex-shrink:0}
@media(max-width:760px){main{height:auto}.workspace{height:700px}.library{height:700px}.properties{overflow:visible}.canvas-wrap{min-height:320px}}

/* OpenDSS integration */
#frequency{width:auto;display:inline-block;padding:3px 20px 3px 6px;border-color:#e0e4e8;background:white;font-size:11px;color:#435669}.frequency-label{white-space:nowrap}.project-meta{display:inline-block}.study-heading{border-top:1px solid var(--line);display:flex;align-items:center;gap:10px;margin-top:14px;padding-top:10px;font-size:12px}.study-heading button{margin-left:auto;font-size:11px;padding:6px 9px}.study-heading button:disabled,#runLoadFlow:disabled{opacity:.55;cursor:wait}#results{max-height:225px;overflow:auto;font-size:11px;padding-top:8px}#results .muted{margin:5px 0 10px}.study-summary{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}.study-summary span{background:#f1f7f5;border:1px solid #e0efea;padding:8px;border-radius:6px;color:#3a6858}.study-summary strong{font-size:13px}.results-scroll{overflow-x:auto}.results-table{width:100%;border-collapse:collapse;font-size:11px;text-align:left;min-width:450px}.results-table th{background:#f4f7f9;color:#607182;padding:7px 8px;position:sticky;top:0}.results-table td{padding:6px 8px;border-bottom:1px solid #edf1f4}.results-table td:not(:first-child){font-variant-numeric:tabular-nums}.node-link{background:none;border:none;padding:0;color:#33647e;font-size:11px;text-align:left;white-space:normal}.node-link:hover{text-decoration:underline}.overloaded{color:#b32929;font-weight:bold}.result-warning{font-size:10px;color:#9a6e41;line-height:1.6}.node .solution-value{pointer-events:none}.projectbar .actions{flex-wrap:wrap}.bottom{max-height:48%;overflow:auto}
/* Canvas-first study review */
.workspace .tools{flex-shrink:0;position:relative;z-index:2}.tools>div{display:flex;align-items:center;gap:2px;flex-wrap:wrap}.tools button{border:1px solid #e4e8ed;font-size:12px}.tools #zoomLabel{min-width:45px}.canvas-wrap{flex:1 1 0;min-height:240px}.canvas-key{background:#f8fafce8;padding:6px;border-radius:4px}.canvas-caption{font-size:11px}#canvas{cursor:grab}#canvas.pan-mode,#canvas.pan-mode .node,#canvas.pan-mode .port{cursor:grab}#canvas.panning,#canvas.panning *{cursor:grabbing!important}.solution-value text{paint-order:stroke;stroke:#f8fafc;stroke-width:4px;stroke-linejoin:round;pointer-events:none}.panel-heading{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:35px;font-size:12px}.panel-heading>strong{margin-right:auto}.panel-heading button{font-size:11px;padding:7px 10px}.bottom{padding:10px 14px;max-height:40%;overflow:hidden;display:flex;flex-direction:column}.bottom.collapsed{max-height:none;flex:0 0 auto}.panel-heading{flex-shrink:0}#resultsBody{overflow:auto;min-height:0;padding-top:12px}#resultsBody[hidden],#warningsPanel[hidden]{display:none}.bottom-title{flex-wrap:wrap}#results{max-height:none;overflow:visible}.results-scroll{max-height:210px;overflow:auto}.results-table{font-size:12px}.results-table th{z-index:1}.study-heading{flex-wrap:wrap}.study-heading button{margin-left:0}.study-summary span{padding:6px}#warningsPanel{border:1px solid #efd7bd;background:#fffbf5;border-radius:7px;padding:12px;margin-bottom:14px}#warningsPanel h3{font-size:13px;margin:0}.has-warnings{color:#a83a13;background:#fff1e6;border-color:#f3c69e}.warning-item{display:block;text-align:left;white-space:normal;width:100%;margin:6px 0;font-size:12px;line-height:1.6}.warning-item.overload{color:#b42318}.warning-item.voltage{color:#9b520b}.warning-item span{font-size:10px;font-weight:600}.model-notes{font-size:11px;color:#6a7481;margin-top:10px}.model-notes summary{cursor:pointer}.no-warnings{color:#21664e;font-size:12px}.workspace.canvas-fullscreen,.workspace:fullscreen{position:fixed;inset:0;z-index:1000;width:100vw;height:100dvh;background:#f8fafc;display:flex;flex-direction:column}.canvas-expanded{overflow:hidden}.canvas-fullscreen .canvas-wrap{min-height:0}.canvas-fullscreen .tools{padding:12px 20px}.canvas-fullscreen .bottom{max-height:40%}.canvas-fullscreen .bottom.collapsed{max-height:none}@media(max-width:760px){.tools button{font-size:11px}.panel-heading>strong{width:100%}.canvas-caption{font-size:9px}.canvas-wrap{min-height:240px}.bottom{max-height:38%}}

.risk-notice{font-size:12px;line-height:1.6;color:#70451f;background:#fff8ed;border-left:3px solid #ee702c;padding:9px 12px;margin:12px 0 0}
