@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');
.wire-line.energized{stroke:#d6b454;filter:drop-shadow(0 0 3px #ffd85b55)}
.current-particles{pointer-events:none;fill:#ffe873;filter:drop-shadow(0 0 3px #ffd85b99)}
.analysis-card[data-card="scope"]{height:144px;max-height:144px}
.analysis-card[data-card="scope"].expanded{height:240px;max-height:min(260px,48vh)}
#scope-card-content{height:calc(100% - 29px);display:flex;flex-direction:column;gap:3px;overflow:hidden}
#scope-card-content .card-context{flex:none;margin-bottom:0}
#scope-card-content .scope-chart{flex:1 1 0;height:0;min-height:20px}
#scope-card-content .card-summary{flex:none;padding-top:0}
.scope-controls{display:flex;align-items:center;gap:4px;flex:none;min-width:0}
.scope-controls button{height:20px;min-width:22px;padding:0 5px;border:1px solid #38516b;border-radius:4px;background:#162b40;color:#c9dbea;font:10px var(--mono);cursor:pointer}
.scope-controls button:hover:not(:disabled){border-color:var(--cyan);color:var(--cyan)}
.scope-controls button:focus-visible{outline:2px solid var(--cyan);outline-offset:1px}
.scope-controls button:disabled{opacity:.35;cursor:default}
.scope-window{font:9px var(--mono);color:#9db4ca;white-space:nowrap;min-width:0;margin-right:auto}
.scope-scale-note{flex:none;font:8px var(--sans);color:#91a6bb}
.scope-voltage{color:#48d7d2}.scope-current{color:#ffb86b}
.analysis-card[data-card="phasors"]{height:144px;max-height:144px}
.analysis-card[data-card="phasors"].expanded{height:240px;max-height:min(260px,48vh)}
#phasors-card-content{height:calc(100% - 29px);display:flex;flex-direction:column;gap:3px;overflow:hidden}
#phasors-card-content .card-context{flex:none;margin-bottom:0}
.phasor-visual-row{display:flex;gap:8px;align-items:stretch;flex:1;min-height:0}
#phasors-card-content .phasor-chart{width:43%;height:100%;min-width:68px;flex:0 0 43%}
.phasor-details{min-width:0;flex:1;overflow:auto;color:#a9bdd1;font:9px var(--mono)}
.phasor-phase{display:block;color:#ead57a;font-size:11px;margin:2px 0 4px}
.phasor-relation{font:9px var(--sans);line-height:1.35;margin-bottom:4px;color:#d1ddea}
.phasor-values{display:flex;flex-direction:column;gap:2px;font-size:9px}
.phasor-values span:last-child{font-size:8px;color:#91a6bb}
.phasor-scale-note{flex:none;font:8px var(--sans);color:#91a6bb;line-height:1.25}
#phasors-card-content .phasor-list{gap:4px}
#phasors-card-content .phasor-chip{font-size:9px;padding:3px 4px;white-space:normal;overflow-wrap:anywhere}
.analysis-card[data-card="analysis"]{height:144px;max-height:144px}
.analysis-card[data-card="analysis"].expanded{height:240px;max-height:min(260px,48vh)}
#analysis-card-content{height:calc(100% - 29px);overflow:auto;display:flex;flex-direction:column;gap:4px}
#analysis-card-content .card-context{flex:none;margin-bottom:0}
.analysis-behavior{flex:none;color:#a9e2d6;font:600 10px var(--sans);line-height:1.35}
#analysis-card-content .card-metrics{flex:none;grid-template-columns:repeat(2,minmax(0,1fr));max-height:none;overflow:visible}
#analysis-card-content .metric{padding:4px 5px;min-width:0}
#analysis-card-content .metric strong{font-size:10px;overflow-wrap:anywhere}
#analysis-card-content .metric label{font-size:8px;margin-bottom:2px}
.analysis-section{flex:none;padding-top:6px;border-top:1px solid #2a3e55}
.analysis-section h3{margin:0 0 5px;color:#d7e6f2;font:700 10px var(--sans)}
.analysis-explanation{margin:4px 0 2px;color:#a5b9cc;font:10px var(--sans);line-height:1.45}
.analysis-state{flex:none;margin-top:0}
:root{color-scheme:dark;--bg:#0b1422;--surface:#101c2c;--surface2:#152438;--line:#26374d;--muted:#8fa1b8;--text:#eaf1f8;--cyan:#48d7d2;--blue:#70aaff;--orange:#ffb86b;--red:#ff7777;--green:#83e0ad;--mono:'DM Mono',monospace;--sans:'Manrope',system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:13px}.topbar{height:58px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 24px;gap:20px;background:#0e1928}.brand{color:var(--text);text-decoration:none;display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.05em;font-size:15px}.brand b{color:var(--cyan);font-size:11px;letter-spacing:.13em}.brand-mark{width:28px;height:28px;border:1px solid #39727d;background:#15343d;color:var(--cyan);border-radius:8px;display:grid;place-items:center;font:20px var(--mono)}.topbar-center{margin:auto;display:flex;gap:9px;align-items:center;color:#a9b9cc;font-size:11px;letter-spacing:.06em;text-transform:uppercase}.status-dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px #48d7d277}.topbar-actions{display:flex;gap:8px}.button,.tool-button,.palette-button,.analysis-tab,.collapse-button{font:600 12px var(--sans);color:var(--text);border:1px solid var(--line);background:var(--surface2);border-radius:7px;padding:8px 12px;cursor:pointer;transition:.15s}.button:hover,.tool-button:hover,.palette-button:hover,.analysis-tab:hover{border-color:#52718f;background:#1b2d43}.button.primary{background:#1b7074;border-color:#31989a;color:#eaffff}.button.stop{background:#522f39;border-color:#874d58}.button.quiet{color:#9dafc3;background:transparent}.hidden{display:none!important}.app-shell{height:calc(100vh - 58px);min-height:500px;display:grid;grid-template-rows:minmax(280px,1fr) 198px}.work-area{min-height:0;display:grid;grid-template-rows:48px minmax(0,1fr) 29px}.work-toolbar{display:flex;align-items:center;gap:8px;padding:0 18px;border-bottom:1px solid #1d2c40;background:#0e1928}.palette{display:flex;gap:6px}.palette-button{padding:6px 9px;color:#bdccdc;font-size:11px}.palette-button .glyph{font:15px var(--mono);color:var(--cyan);margin-right:5px}.toolbar-separator{height:22px;width:1px;background:var(--line);margin:0 4px}.tool-button{font-size:11px;padding:7px 10px}.tool-button.active{color:var(--cyan);border-color:#31868b;background:#12323b}.toolbar-hint{margin-left:auto;color:#8296ad;font-size:11px}.workspace{position:relative;min-height:0;overflow:hidden;background:#0b1523}.workspace-grid{position:absolute;inset:0;background-image:radial-gradient(#304057 1px,transparent 1px);background-size:24px 24px;opacity:.5}.wires-layer,.components-layer{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.wires-layer{pointer-events:none}.wire-line{stroke:#6e8ba7;stroke-width:2.5;fill:none}.wire-line.active{stroke:var(--cyan);filter:drop-shadow(0 0 3px #48d7d288)}.wire-hit{stroke:transparent;stroke-width:14;fill:none;pointer-events:stroke;cursor:pointer}.component{position:absolute;width:112px;height:74px;transform:translate(-50%,-50%);display:grid;place-items:center;cursor:grab;touch-action:none;z-index:2}.component:active{cursor:grabbing}.component.selected .component-card{border-color:var(--cyan);box-shadow:0 0 0 2px #48d7d222,0 8px 25px #0005}.component-card{width:88px;height:52px;border:1px solid #3b526c;border-radius:9px;background:#132236;display:flex;align-items:center;justify-content:center;gap:7px;position:relative;box-shadow:0 6px 14px #0003}.component-glyph{font:24px var(--mono);color:var(--cyan)}.component-id{font:10px var(--mono);color:#c0cedd}.component-value{position:absolute;bottom:-18px;left:0;right:0;text-align:center;color:#9db0c5;font:10px var(--mono);white-space:nowrap}.component.source .component-glyph{color:var(--orange)}.component.inductor .component-glyph{font-size:18px}.component.capacitor .component-glyph{letter-spacing:-5px;margin-right:4px}.component.switch .component-glyph{font-size:20px}.component.meter .component-glyph{border:1.5px solid #b9d0e2;border-radius:50%;width:27px;height:27px;display:grid;place-items:center;font:13px var(--mono);color:#b9d0e2}.terminal{position:absolute;top:30px;width:12px;height:12px;border-radius:50%;border:2px solid #7f9ab3;background:#0c1725;cursor:crosshair;z-index:3}.terminal.left{left:4px}.terminal.right{right:4px}.terminal:hover,.terminal.wire-start{background:var(--cyan);border-color:#c1ffff;box-shadow:0 0 0 4px #48d7d233}.component.drag-disabled{cursor:default}.component.drag-disabled .terminal{cursor:default}.workspace-empty{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;display:grid;gap:8px;justify-items:center;color:#8194aa;pointer-events:none}.empty-symbol{font:40px var(--mono);color:#3a6775}.workspace-empty strong{font-size:14px;color:#b1c1d2}.workspace-empty span{font-size:11px}.workspace-footer{display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-top:1px solid #1d2c40;color:#778ba2;font-size:10px}.workspace-footer kbd{font:10px var(--mono);color:#aabbd0;border:1px solid #2a3a50;border-radius:4px;padding:2px 4px}.floating-panel{position:absolute;z-index:5;top:16px;right:16px;width:228px;background:#152438;border:1px solid #3a536f;border-radius:10px;box-shadow:0 12px 35px #0008;padding:0 12px 12px}.panel-head{height:38px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2a3e56;margin:0 -12px 10px;padding:0 12px;cursor:move;color:#b9c9d8;font-weight:700;font-size:11px}.panel-head button{border:0;background:transparent;color:#93a8bd;font-size:17px;cursor:pointer}.panel-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:8px 0;color:#9eafc2;font-size:10px}.panel-row input{width:98px;background:#0d1928;color:var(--text);border:1px solid #344a62;border-radius:5px;padding:6px;font:11px var(--mono)}.panel-actions{display:flex;gap:6px;margin-top:10px}.panel-actions button{flex:1;border:1px solid #344a62;background:#1a2d43;color:#cbd7e3;border-radius:5px;padding:6px;cursor:pointer;font:10px var(--sans)}.panel-actions .danger{color:#ffaaaa}.toast{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);background:#17283c;border:1px solid #435d79;border-radius:8px;padding:9px 13px;color:#dbe8f4;box-shadow:0 8px 25px #0007;z-index:8;font-size:11px;max-width:min(90%,520px)}.analysis-area{border-top:1px solid var(--line);background:#101b2a;display:grid;grid-template-rows:42px minmax(0,1fr);min-height:0}.analysis-area.collapsed{grid-template-rows:42px 0}.analysis-tabs{display:flex;align-items:center;gap:5px;padding:0 16px;border-bottom:1px solid #223247}.analysis-tab{border:0;background:transparent;color:#90a3b8;border-radius:6px;padding:7px 10px}.analysis-tab.active{background:#192a3e;color:var(--cyan)}.collapse-button{margin-left:auto;border:0;background:transparent;color:#8fa1b8;font-size:17px;padding:3px 8px}.analysis-content{overflow:auto;padding:12px 18px}.empty-analysis{height:100%;display:grid;place-items:center;color:#788ca2;font-size:11px}.metric-grid{display:grid;grid-template-columns:repeat(6,minmax(95px,1fr));gap:8px}.metric{border:1px solid #263a51;background:#132236;border-radius:7px;padding:9px 11px;min-height:55px}.metric label{display:block;font-size:9px;color:#8297ad;text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}.metric strong{font:13px var(--mono);color:#dce8f3}.analysis-note{color:#7f93a9;font-size:10px;margin:8px 2px 0}.scope-layout{display:grid;grid-template-columns:minmax(240px,1fr) 240px;gap:16px;height:100%;min-height:115px}.scope-chart{width:100%;height:100%;min-height:110px;border:1px solid #263a51;border-radius:8px;background:#0d1928}.scope-legend{display:flex;gap:14px;color:#9fb1c5;font:10px var(--mono);margin-top:4px}.legend-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.phasor-layout{display:flex;gap:20px;align-items:center;height:100%}.phasor-chart{width:190px;height:130px;background:#0d1928;border:1px solid #263a51;border-radius:8px}.phasor-list{display:flex;flex-wrap:wrap;gap:8px}.phasor-chip{border:1px solid #2d425a;background:#142439;border-radius:6px;padding:7px 10px;color:#c4d2e0;font:10px var(--mono)}.analysis-head{font-weight:700;color:#d5e2ee;margin-bottom:8px;font-size:11px}.instrument-read{position:absolute;bottom:14px;left:14px;display:flex;gap:8px;z-index:4}.read-chip{background:#132236dd;border:1px solid #2e455e;border-radius:6px;padding:6px 9px;font:10px var(--mono);color:#d7e5f1}
@media(max-width:850px){.metric-grid{grid-template-columns:repeat(3,minmax(90px,1fr))}.toolbar-hint{display:none}.topbar{padding:0 12px}.work-toolbar{padding:0 8px;overflow-x:auto}.palette{flex-shrink:0}.scope-layout{grid-template-columns:1fr 180px}}
@media(max-width:600px){.app-shell{height:calc(100vh - 54px);grid-template-rows:minmax(300px,1fr) 190px}.topbar{height:54px}.topbar-center{display:none}.brand{margin-right:auto}.button{padding:7px 9px}.palette-button{font-size:10px;padding:6px}.palette-button .full-label{display:none}.workspace-footer{padding:0 9px}.analysis-content{padding:8px}.metric-grid{grid-template-columns:repeat(2,minmax(95px,1fr));gap:5px}.metric{padding:7px}.scope-layout{grid-template-columns:1fr}.scope-side{display:none}.phasor-layout{gap:8px}.phasor-chart{width:130px}}
.hover-info{position:absolute;z-index:7;pointer-events:none;min-width:132px;max-width:230px;background:#17283c;border:1px solid #47627e;border-radius:7px;padding:8px 10px;box-shadow:0 8px 22px #0008;color:#dce9f5;font-size:10px;line-height:1.55}.hover-info strong{display:block;color:var(--cyan);font-size:10px;margin-bottom:2px}.hover-info span{display:block;color:#a8bbce;font-family:var(--mono)}
.palette-button:disabled,.tool-button:disabled,.button:disabled{opacity:.4;cursor:not-allowed}
.topbar{height:66px;padding:0 16px;gap:14px}.app-shell{height:calc(100vh - 66px)}.topbar-tools{display:flex;align-items:center;gap:8px;min-width:0;flex:1}.topbar-actions{align-items:center;gap:7px;flex-shrink:0}.mode-indicator{display:flex;align-items:center;gap:6px;color:#9fb2c6;font-size:9px;letter-spacing:.09em;font-weight:700}.mode-indicator .status-dot{width:6px;height:6px}.palette{gap:3px;min-width:0}.palette-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;min-width:40px;height:44px;padding:2px 5px;border:0;background:transparent;color:#b8c8d8;font-size:9px}.palette-button:hover{background:#1b2d43}.symbol-svg{display:block;width:98px;height:40px;overflow:visible}.palette-button .symbol-svg{width:33px;height:22px}.symbol-stroke{fill:none;stroke:#d0dfed;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.symbol-stroke text{fill:#d0dfed;stroke:none;font:700 15px var(--sans)}.symbol-wrap{position:relative;display:grid;place-items:center;width:100px;height:48px}.symbol-wrap .symbol-svg{width:100px;height:42px}.component-card{width:104px;height:59px;display:flex;align-items:center;justify-content:center;background:#101c2c;border:0;border-radius:0;box-shadow:none;overflow:visible}.component.selected .component-card{border:0;box-shadow:none}.component.selected .symbol-stroke{stroke:var(--cyan)}.component-id{position:absolute;top:0;right:0;color:#b5c5d5;background:#0b1523;padding:0 3px;border-radius:3px;font:9px var(--mono)}.component-value{bottom:-16px;color:#c0cfde}.component{width:112px;height:78px}.terminal{top:33px;width:10px;height:10px;background:#0b1523;border-color:#9db2c6}.terminal.left{left:4px}.terminal.right{right:4px}.work-area{grid-template-rows:minmax(0,1fr) 29px}.workspace-footer{font-size:10px}.workspace-footer #tool-hint{color:#9aadc1}.toolbar-hint,.work-toolbar{display:none}
@media(max-width:1000px){.topbar{gap:8px;padding:0 9px}.brand{gap:6px;font-size:13px}.topbar-actions{gap:4px}.palette-button{min-width:34px;padding:2px}.palette-button .full-label{display:none}.symbol-svg{width:88px}.palette-button .symbol-svg{width:27px;height:21px}.tool-button{padding:6px 8px}.mode-indicator{font-size:8px}}
@media(max-width:650px){.topbar{height:60px}.app-shell{height:calc(100vh - 60px)}.brand{font-size:11px}.brand-mark{width:24px;height:24px}.topbar-tools{gap:3px}.topbar-actions .mode-indicator{display:none}.button{padding:6px 7px;font-size:10px}.palette-button{min-width:28px;height:38px}.topbar-actions .button span,.tool-button span{display:none}.tool-button{font-size:15px;padding:5px}.topbar{overflow-x:auto}.app-shell{min-height:440px}}
.topbar-tools{overflow-x:auto;scrollbar-width:none}.topbar-tools::-webkit-scrollbar{display:none}.palette,.toolbar-group,.toolbar-separator,.topbar-actions{flex-shrink:0}.toolbar-group{display:flex;align-items:center;gap:2px}.topbar-tools .tool-button{height:34px;min-width:34px;padding:5px 7px;border-color:transparent;background:transparent;border-radius:6px;font-size:11px;white-space:nowrap}.topbar-tools .tool-button:hover{border-color:#344a62;background:#18283c}.topbar-tools .tool-button.active{color:var(--cyan);border-color:#31868b;background:#12323b}.topbar-tools .command-button{display:flex;align-items:center;gap:4px}.button-icon{font:16px var(--sans);line-height:1}.topbar-tools .icon-button{font:20px var(--sans);padding:2px 6px}.topbar-tools .zoom-level{min-width:44px;font:10px var(--mono);padding:3px 4px}.topbar-tools .toolbar-separator{margin:0 2px;height:20px}.topbar-actions .button{white-space:nowrap}.topbar-tools .tool-button:disabled{opacity:.36}
@media(max-width:1120px){.topbar-tools .command-label{display:none}.topbar-tools .command-button{min-width:34px;justify-content:center}.topbar{gap:8px;padding:0 9px}.mode-indicator{display:none}}
.app-shell{display:block;position:relative;min-height:0}.work-area{position:relative;height:100%;grid-template-rows:minmax(0,1fr) 29px}.analysis-area{position:absolute;z-index:5;left:14px;right:14px;bottom:38px;display:grid;grid-template-rows:20px auto;gap:5px;min-height:0;padding:0;border:0;background:transparent;pointer-events:none}.cards-dock-head{display:flex;justify-content:flex-end;align-items:center;gap:7px;color:#a9bdcf;font-size:9px;pointer-events:auto}.cards-dock-head button{width:22px;height:20px;border:1px solid #31465d;border-radius:5px;background:#142237;color:#a9bdcf;cursor:pointer}.analysis-card-row{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:8px;align-items:end;pointer-events:none}.analysis-area.collapsed{display:grid;grid-template-rows:0 auto;left:auto;width:158px;right:14px;bottom:40px}.analysis-area.collapsed .cards-dock-head{justify-content:flex-end}.analysis-area.collapsed .cards-dock-head strong{display:none}.analysis-area.collapsed .cards-dock-head button{position:absolute;right:0;top:0;width:auto;height:28px;padding:0 9px}.analysis-area.collapsed .analysis-card-row{display:none}.analysis-card{min-width:0;min-height:112px;max-height:132px;overflow:hidden;border:1px solid #344a62;border-radius:9px;background:#111e2fef;box-shadow:0 8px 24px #0007;pointer-events:auto;transition:max-height .16s ease,box-shadow .16s ease}.analysis-card.expanded{height:240px;max-height:min(260px,48vh);box-shadow:0 12px 32px #000a;border-color:#4a7189}.analysis-card-head{width:100%;height:29px;display:flex;justify-content:space-between;align-items:center;padding:0 9px;border:0;border-bottom:1px solid #273b52;background:#16263a;color:#d6e3ef;font:700 10px var(--sans);text-align:left;cursor:pointer}.analysis-card-head span{font-weight:500;color:#8096ad;font-size:9px}.analysis-card-body{padding:5px 8px;overflow:hidden}.card-context{font:9px var(--mono);color:#91a6bb;margin-bottom:3px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.scope-chart{display:block;width:100%;height:47px;min-height:47px;border:1px solid #293d54;border-radius:5px;background:#0d1928}.scope-chart.scope-large{height:104px;min-height:104px}.card-summary{color:#b4c5d5;font:9px var(--mono);padding-top:3px;white-space:normal}.card-visual-row{display:flex;align-items:center;gap:8px}.phasor-chart{width:82px;height:67px;flex:0 0 82px;border-radius:5px}.analysis-card.expanded .phasor-chart{width:122px;height:116px;flex-basis:122px}.phasor-list{display:flex;flex-direction:column;gap:3px}.phasor-chip{padding:3px 5px;font-size:8px}.card-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}.card-metrics .metric{min-height:0;padding:4px 6px;border-radius:5px}.card-metrics .metric label{font-size:8px;margin-bottom:2px}.card-metrics .metric strong{font-size:10px}.analysis-card.expanded .card-metrics{grid-template-columns:repeat(3,minmax(0,1fr));max-height:177px;overflow:auto}.analysis-card.expanded .card-metrics .metric{padding:6px 7px}.analysis-card.expanded .card-metrics .metric label{font-size:8px}.analysis-card.expanded .card-metrics .metric strong{font-size:10px}
@media(max-width:700px){.analysis-area{left:8px;right:8px;bottom:34px}.analysis-card-row{grid-template-columns:repeat(3,minmax(155px,1fr));gap:5px;overflow-x:auto;align-items:end}.analysis-card{min-height:102px;max-height:120px}.analysis-card.expanded{height:220px;max-height:45vh}.analysis-card-head{padding:0 6px;font-size:9px}.analysis-card-body{padding:4px 5px}.analysis-area.collapsed{left:auto;width:136px;right:8px}}
/* Cable anchors are hit targets, not covers over the electrical symbol. */
.terminal{top:32px;width:14px;height:14px;padding:0;border:0;border-radius:50%;background:transparent;opacity:1;box-shadow:none;z-index:4;display:grid;place-items:center}
.terminal.left{left:-1px}.terminal.right{right:-1px}
.terminal::after{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;transform:translate(-50%,-50%);border:1px solid #fff0f2;border-radius:50%;background:#ff4058;box-shadow:0 0 0 2px #ff40584d,0 0 7px #ff405899;transition:width .12s ease,height .12s ease,box-shadow .12s ease}
.component.connect-ready .terminal::after{width:7px;height:7px;box-shadow:0 0 0 3px #ff405866,0 0 10px #ff4058cc}
.component:hover .terminal::after,.terminal:hover::after,.terminal.wire-start::after{width:9px;height:9px;border-color:#fff;background:#ff263f;box-shadow:0 0 0 4px #ff405880,0 0 13px #ff263f}
.junction{position:absolute;width:16px;height:16px;padding:0;transform:translate(-50%,-50%);border:0;border-radius:50%;background:transparent;z-index:4;cursor:crosshair}
.junction::after{content:"";position:absolute;left:50%;top:50%;width:5px;height:5px;transform:translate(-50%,-50%);border:1.5px solid #d4e9f5;border-radius:50%;background:#102034;opacity:.78}
.junction.branched::after{width:7px;height:7px;background:#c3e5f5;border-color:#e8f8ff;opacity:1}
.junction.joined::after{background:#c3e5f5;border-color:#e8f8ff;opacity:1}
.connection-legend{position:absolute;top:10px;left:12px;z-index:3;display:flex;gap:12px;align-items:center;padding:4px 7px;border-radius:5px;background:#0b1523e6;color:#a9bdcf;font:10px var(--sans);pointer-events:none}
.connection-legend span{display:flex;align-items:center;gap:4px}.connection-legend svg{width:26px;height:18px;fill:none;stroke:#b9d4e9;stroke-width:2;stroke-linecap:round}.connection-legend circle{fill:#c3e5f5;stroke:none}
.wire-line{stroke-linecap:round;stroke-linejoin:round}
.junction:hover::after,.junction.wire-start::after{width:9px;height:9px;background:var(--cyan);border-color:#e3ffff;box-shadow:0 0 0 4px #48d7d233;opacity:1}
.components-layer{pointer-events:none}.component,.junction{pointer-events:auto}
.components-layer,.wires-layer{transform-origin:0 0}.wires-layer{transform-box:view-box}
.wire-line.connection-target{stroke:#59eee2;stroke-width:4;filter:drop-shadow(0 0 5px #48d7d2aa)}
.wire-preview,.wire-snap-point{pointer-events:none}
.wire-preview{fill:none;stroke:#ffd06f;stroke-width:3;stroke-dasharray:7 6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px #ffd06f88)}
.wire-snap-point{fill:#ffd06f;stroke:#fff2c7;stroke-width:2;filter:drop-shadow(0 0 5px #ffd06faa)}
.wire-hit{stroke-width:18;vector-effect:non-scaling-stroke}
.wire-line.selected{stroke:#ffc36c;stroke-width:4;filter:drop-shadow(0 0 5px #ffc36caa)}
.junction{cursor:grab;touch-action:none}.junction:active{cursor:grabbing}
.junction.selected::after{width:9px;height:9px;background:#ff4058;border-color:#fff;box-shadow:0 0 0 4px #ff405880,0 0 13px #ff263f;opacity:1}
.analysis-area,.analysis-area.collapsed{inset:0 0 29px;width:auto;display:block;overflow:hidden;pointer-events:none}
.analysis-card-row{position:absolute;inset:0;display:block;overflow:visible;pointer-events:none}
.analysis-card-row .analysis-card{position:absolute;margin:0}
.cards-dock-head{position:absolute;right:8px;bottom:8px;height:22px;z-index:100000;pointer-events:none}
.cards-dock-head strong{pointer-events:none;text-shadow:0 1px 3px #000}
.cards-dock-head button{pointer-events:auto}
#reset-card-positions{width:auto;height:22px;padding:0 7px;font:9px var(--sans)}
.analysis-area.collapsed .cards-dock-head button{position:static;height:22px}
.analysis-area.collapsed #reset-card-positions{display:none}
.analysis-card-bar{display:flex;height:29px;background:#16263a;border-bottom:1px solid #273b52}
.analysis-card-bar .analysis-card-head{flex:1;min-width:0;height:28px;border-bottom:0}
.card-drag-handle{flex:0 0 24px;padding:0;border:0;border-right:1px solid #2d435b;background:transparent;color:#96b2cb;font-size:17px;cursor:grab;touch-action:none;user-select:none}
.card-drag-handle:hover{color:var(--cyan);background:#1c344a}
.card-drag-handle:focus-visible,#reset-card-positions:focus-visible{outline:2px solid var(--cyan);outline-offset:-2px}
.analysis-card.dragging{transition:none;border-color:var(--cyan);box-shadow:0 12px 30px #000a}
.analysis-card.dragging .card-drag-handle{cursor:grabbing;color:var(--cyan)}
.component-value-editor{display:flex;align-items:center;gap:5px;min-width:0}
.component-value-editor #component-value{width:85px;min-width:0}
.component-value-editor select{width:57px;flex:none;padding:6px 3px;background:#0d1928;color:var(--text);border:1px solid #344a62;border-radius:5px;font:11px var(--mono)}
.component-value-editor input:focus-visible,.component-value-editor select:focus-visible{outline:2px solid var(--cyan);outline-offset:1px}
.validation-message{position:absolute;bottom:12px;left:12px;z-index:6;max-width:min(520px,calc(100% - 24px));padding:9px 12px;border:1px solid #d66a79;border-radius:7px;background:#331d2cee;color:#ffe3e8;font:11px var(--sans);line-height:1.45;pointer-events:none}
.component.validation-error .component-card{outline:2px dashed #ff7184;outline-offset:5px}
.terminal.connection-error::after,.junction.validation-error::after{width:10px;height:10px;border:2px solid #fff;background:#ff4058;box-shadow:0 0 0 5px #ff405866,0 0 13px #ff4058;opacity:1}
.wire-line.validation-error{stroke:#ff7184;stroke-width:4;filter:drop-shadow(0 0 4px #ff405888)}
.analysis-card{min-height:0}
.analysis-card .card-context{white-space:normal;overflow-wrap:anywhere;overflow:visible;text-overflow:clip;line-height:1.3}
#scope-card-content,#phasors-card-content{overflow:auto;scrollbar-width:thin}
#scope-card-content .scope-chart{min-height:36px;flex-shrink:0}
.scope-controls{flex-wrap:wrap}.scope-window{white-space:normal;overflow-wrap:anywhere}
.scope-controls button{flex-shrink:0}
.scope-scale-note,.phasor-scale-note,.card-summary{overflow-wrap:anywhere;line-height:1.35}
.phasor-visual-row{flex:1 0 70px}
#phasors-card-content .phasor-chart{min-width:0;min-height:70px}
.phasor-details{overflow-wrap:anywhere;scrollbar-width:thin}
.analysis-card .metric label,.analysis-card .metric strong,.analysis-behavior,.analysis-explanation{overflow-wrap:anywhere}
.analysis-card-bar .analysis-card-head{gap:6px}.analysis-card-head span{flex-shrink:0}
#analysis-card-content{scrollbar-width:thin}
.didactic-help{text-decoration:none;border-bottom:1px dotted #72899f;cursor:help}
.hover-info{max-height:calc(100% - 8px);overflow:auto;overflow-wrap:anywhere}
.card-resize-handle{position:absolute;right:2px;bottom:2px;z-index:2;width:21px;height:21px;padding:0;border:0;border-radius:4px;background:#16263a;color:#a9bdcf;font:17px var(--sans);cursor:nwse-resize;touch-action:none;user-select:none}
.card-resize-handle:hover{background:#24445b;color:var(--cyan)}
.card-resize-handle:focus-visible{outline:2px solid var(--cyan);outline-offset:-2px}
.analysis-card.resizing{transition:none;border-color:var(--cyan);box-shadow:0 12px 30px #000a}
.analysis-card.resizing .card-resize-handle{color:var(--cyan)}
.scope-scale-note,.phasor-scale-note{padding-right:18px}
.analysis-card.expanded .card-context{font-size:11px}
.analysis-card.expanded .card-summary{font-size:12px}
.analysis-card.expanded .scope-window{font-size:11px}
.analysis-card.expanded .scope-controls button{height:24px;font-size:12px}
.analysis-card.expanded .scope-scale-note,.analysis-card.expanded .phasor-scale-note{font-size:10px}
.analysis-card.expanded .phasor-phase{font-size:15px}
.analysis-card.expanded .phasor-relation{font-size:12px}
.analysis-card.expanded #phasors-card-content .phasor-chip{font-size:11px}
.analysis-card.expanded #analysis-card-content .metric strong{font-size:15px}
.analysis-card.expanded #analysis-card-content .metric label{font-size:10px}
.analysis-card.expanded #analysis-card-content .metric{padding:7px 8px}
.analysis-card.expanded .analysis-behavior,.analysis-card.expanded .analysis-section h3{font-size:12px}
.analysis-card.expanded .analysis-explanation{font-size:12px}
#analysis-card-content{padding-bottom:23px}
