.l2studio{background:#111e28;color:#d7e6f0;border:1px solid #263f50;border-radius:8px;overflow:hidden;margin-top:12px;font:12px/1.5 'Segoe UI',sans-serif}.l2studio header{background:linear-gradient(#33566f,#20394b);display:flex;align-items:center;gap:12px;padding:10px;flex-wrap:wrap}.ct-badge{background:#efa638;color:#142331;padding:4px;border-radius:4px}.l2studio header>span{color:#b8cfdf}.l2studio button,.l2studio select{background:#243e50;color:#ecf6ff;border:1px solid #577489;border-radius:4px;padding:6px 10px;font:inherit}.l2studio button{cursor:pointer}.l2studio :focus-visible{outline:2px solid #ffd26b;outline-offset:2px}#l2Full{margin-left:auto}.l2-tools{display:flex;gap:15px;align-items:center;flex-wrap:wrap;padding:8px 12px;background:#233440}.l2-tools label{display:flex;gap:6px;align-items:center}#l2State{margin-left:auto;color:#c9e8cd}.l2-layout{display:grid;grid-template-columns:170px minmax(0,1fr) 255px;min-height:0}.l2-tree,.l2-tags{padding:12px;background:#162630;overflow:auto;max-height:640px;min-height:0}.l2studio h4{margin:0 0 14px;color:#a3bed0;font-size:11px;text-transform:uppercase}.l2-help{margin-top:24px;color:#a3b9c7}.l2-work{min-width:0;min-height:0;display:flex;flex-direction:column}.l2-tab{padding:8px 12px;background:#253e50;display:flex;justify-content:space-between;flex:none}.l2-scroll{overflow:auto;min-height:0;max-height:640px;flex:1;overscroll-behavior:contain}.l2-rungs{list-style:none!important;margin:0!important;padding:12px!important;width:max-content;min-width:100%;box-sizing:border-box}.s-rung{margin:0 0 24px}.s-rung-title{max-width:820px;padding:8px 12px;background:#1b3142;border-left:3px solid #638ba9}.s-rung-title p{color:#b3c8d6;margin:5px 0 0;line-height:1.5}.s-line{display:flex;align-items:stretch;border-left:2px solid #8ba9bc;border-right:2px solid #8ba9bc;min-height:125px}.s-number{width:28px;flex:none;color:#809bad;padding-top:12px}.s-path{display:flex;align-items:center;flex:1}.s-step{display:flex;align-items:center;position:relative}.s-step:before,.s-output:before{content:'';position:absolute;left:0;right:0;top:50%;height:2px;background:#7994a6}.s-flow:before{background:#5ad882}.s-contact,.s-coil{position:relative;background:#111e28;text-align:center;display:flex;flex-direction:column;align-items:center;padding:8px;margin:0 12px;width:132px;box-sizing:border-box}.s-contact b,.s-coil b{font-size:11px;overflow-wrap:anywhere}.s-symbol{font:700 25px/1.5 Consolas,monospace;color:#dbeaf5}.s-contact small,.s-coil small{color:#8faebf;font-size:10px}.s-true .s-symbol{color:#5af18c;text-shadow:0 0 8px #30d46766}.s-output{min-width:184px;display:flex;align-items:center;justify-content:flex-end;position:relative}.s-coil{width:158px}.s-branch{border-left:2px solid #7994a6;border-right:2px solid #7994a6;display:flex;flex-direction:column;margin:8px 0}.s-branch-row{display:flex;align-items:center;min-height:103px;position:relative}.s-branch-row:before{content:'';position:absolute;left:0;right:0;top:50%;height:2px;background:#7994a6}.s-tag{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 8px;padding:8px 0;border-bottom:1px solid #30495a}.s-tag b{overflow-wrap:anywhere;font-size:11px}.s-tag small{grid-column:1/-1;color:#91acbd}.s-tag span{color:#95a6b3}.s-tag .tag-on{color:#5ce48b}.l2studio footer{padding:8px 12px;background:#233440;color:#b1c5d3;font-size:11px;flex:none}.l2-hide-tree .l2-tree{display:none}.l2-hide-tree .l2-layout{grid-template-columns:minmax(0,1fr) 255px}.l2-max{position:fixed;inset:0;z-index:10000;margin:0;border-radius:0;display:flex;flex-direction:column}.l2-max .l2-layout{flex:1;grid-template-rows:minmax(0,1fr);overflow:hidden}.l2-max .l2-scroll,.l2-max .l2-tree,.l2-max .l2-tags{max-height:none}.l2-max .l2-scroll{flex:1 1 0}.l2-max header,.l2-max .l2-tools{flex:none}
@media(max-width:900px){.l2-layout,.l2-hide-tree .l2-layout{grid-template-columns:minmax(0,1fr) 190px}.l2-tree{display:none}#l2Organizer{display:none}}
@media(max-width:600px){.l2-layout,.l2-hide-tree .l2-layout{grid-template-columns:minmax(0,1fr)}.l2-tags{max-height:200px}.l2-max .l2-layout{grid-template-rows:minmax(0,1fr) 130px}.l2studio header>span{display:none}.l2studio header{gap:6px}.l2-tools{gap:6px}.l2studio footer{font-size:10px}}
.l2-rungs{width:100%}.s-line{width:max-content;min-width:100%;box-sizing:border-box}.s-path{background:linear-gradient(#7994a6,#7994a6) left center/100% 2px no-repeat}.s-number{background:linear-gradient(#7994a6,#7994a6) left center/100% 2px no-repeat}
.s-path{background:none}.s-path:after{content:"";flex:1;min-width:12px;height:2px;background:#7994a6}
/* Every conductor and symbol shares an exact centerline; labels never mask wires. */
.s-step{height:104px;flex:0 0 156px}
.s-contact,.s-coil{height:104px;padding:0;background:transparent;margin:0;position:relative;width:100%}
.s-contact b,.s-coil b{position:absolute;top:8px;left:8px;right:8px}
.s-contact .s-symbol,.s-coil .s-symbol{position:absolute;top:52px;left:50%;transform:translate(-50%,-50%);background:#111e28;padding:0 3px;line-height:30px;white-space:nowrap}
.s-contact small,.s-coil small{position:absolute;top:73px;left:6px;right:6px}
.s-coil small+small{top:87px}
.s-step:before,.s-output:before{top:50%;transform:translateY(-50%)}
.s-output{flex:0 0 184px}
.s-branch{border:0;margin:0;position:relative}
.s-branch:before,.s-branch:after{content:'';position:absolute;top:52px;bottom:52px;width:2px;background:#7994a6}
.s-branch:before{left:0}.s-branch:after{right:0}
.s-branch-row{height:104px;min-height:104px}
.s-branch-row:before{transform:translateY(-50%)}

/* ===== Branch layout (Claude, 10/6; John: follow real PLC programming software as the example). The top leg IS the rung:
   it sits on the rung wire and every lower leg hangs 104px below the one above it, as an open box. All legs share one
   grid cell, so the box is as wide as the longest leg; each lower leg is moved down. The rung reserves the drop. ===== */
.s-branch{display:grid}
.s-branch>.s-branch-row{grid-area:1/1}
.s-branch>.s-branch-row:nth-child(2){top:104px}
.s-branch>.s-branch-row:nth-child(3){top:208px}
.s-branch>.s-branch-row:nth-child(4){top:312px}
.s-branch:before,.s-branch:after{bottom:auto;height:104px}
.s-branch:has(>.s-branch-row:nth-child(3)):before,.s-branch:has(>.s-branch-row:nth-child(3)):after{height:208px}
.s-branch:has(>.s-branch-row:nth-child(4)):before,.s-branch:has(>.s-branch-row:nth-child(4)):after{height:312px}
.s-line:has(.s-branch-row:nth-child(2)){padding-bottom:104px}
.s-line:has(.s-branch-row:nth-child(3)){padding-bottom:208px}
.s-line:has(.s-branch-row:nth-child(4)){padding-bottom:312px}