:root{color-scheme:dark;--bg:#030a12;--panel:#0a1723;--border:#253a4b;--soft:#182b3a;--text:#eef5fb;--muted:#9eacb9;--blue:#1599ff;--green:#78c43a;--red:#f04444;--amber:#ffc04d}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;color:var(--text);background:radial-gradient(circle at 60% 20%,#0b1e2e 0,var(--bg) 45%);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}button,input{font:inherit}button{color:inherit}.skip-link{position:fixed;top:-4rem;left:1rem;z-index:100;padding:.7rem 1rem;background:#fff;color:#06101b}.skip-link:focus{top:1rem}
.app-header{height:66px;display:flex;align-items:center;gap:14px;padding:8px 14px;border:1px solid var(--border);border-radius:5px;margin:5px 8px 0;background:linear-gradient(#0b1824,#07121d);box-shadow:0 8px 24px #0008}.icon-button,.header-button{border:1px solid var(--soft);border-radius:5px;background:linear-gradient(#142434,#0b1723);cursor:pointer}.icon-button{width:40px;height:40px;font-size:20px}.menu-button{display:grid;place-content:center;gap:4px}.menu-button span{display:block;width:20px;height:2px;background:white}.shield-mark{display:grid;place-items:center;width:46px;height:46px;color:white;font-size:20px;border:3px solid #28aaff;border-radius:52% 52% 60% 60%/35% 35% 72% 72%;box-shadow:inset 0 0 16px #148cff33}.title-lockup h1{margin:0;font-size:clamp(17px,2vw,23px);font-weight:650}.title-lockup p{margin:0;color:#28aaff;font-size:13px}.header-actions{margin-left:auto;display:flex;gap:10px}.header-button{height:40px;padding:0 18px;text-transform:uppercase;font-size:12px}.safety-strip{margin:0;padding:5px 12px;text-align:center;color:#d6b777;background:#2b210e;border-bottom:1px solid #59451c;font-size:11px}
.sim-grid{display:grid;grid-template-columns:350px minmax(520px,1fr) 300px;grid-template-rows:minmax(570px,calc(100vh - 220px)) 160px;gap:8px;padding:8px}.panel{min-width:0;overflow:hidden;border:1px solid var(--border);border-radius:4px;background:linear-gradient(145deg,#0b1b28f7,#07121cf7);box-shadow:inset 0 1px #ffffff08,0 10px 30px #0006}.panel-title{min-height:40px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px}.panel-title h2{margin:0;color:#28aaff;font-size:12px;text-transform:uppercase}.lock-pill{padding:3px 7px;color:#aeb9c3;border:1px solid #304556;border-radius:99px;font-size:9px;text-transform:uppercase}
.breaker-panel{grid-column:1;grid-row:1;padding:0 8px 8px}.control-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.control-card{position:relative;min-height:176px;display:flex;flex-direction:column;align-items:center;padding:10px 8px;border:1px solid #294052;border-radius:3px;background:linear-gradient(145deg,#0d1f2d,#08141f);cursor:pointer}.control-card.active{border-color:var(--blue);box-shadow:inset 0 0 0 1px #1599ff55,0 0 16px #1599ff22}.control-card:focus-visible,button:focus-visible{outline:3px solid #54b9ff88;outline-offset:2px}.control-name{min-height:32px;text-align:center;font-size:11px}.control-status{margin:4px 0 8px;color:#c8d2db;font-size:10px;text-transform:uppercase}.control-status i{display:inline-block;width:9px;height:9px;margin-right:5px;border-radius:50%;background:var(--red);box-shadow:0 0 7px var(--red)}.control-status.is-open i{background:var(--green);box-shadow:0 0 7px #7cc43a}.switch-visual{position:relative;width:112px;height:94px;display:block;margin-top:auto;border:1px solid #465765;border-radius:2px;background:linear-gradient(90deg,#1a2933,#33414a 48%,#17242c);box-shadow:inset 0 0 0 5px #0a141a,inset 0 0 16px #000}.switch-visual b{position:absolute;left:35px;top:24px;width:42px;height:59px;border:1px solid #94a0a6;border-radius:3px;background:linear-gradient(90deg,#aab0b0,#eff0e9 50%,#9aa0a2);box-shadow:0 4px 8px #0009;transform:translateY(5px)}.switch-visual.on b{transform:translateY(-13px)}.switch-visual em,.switch-visual small{position:absolute;right:8px;color:#8fd55b;font-size:10px;font-style:normal}.switch-visual em{top:14px}.switch-visual small{bottom:10px}.push-buttons{display:flex;gap:12px;margin:26px 0;padding:17px;background:#aaa}.push-buttons b{width:38px;height:38px;border:5px solid #222;border-radius:50%;background:radial-gradient(circle at 40% 35%,#eee,#999 45%,#333)}.locked-control{cursor:not-allowed}.panel-note{margin:8px 2px 0;color:#8192a1;font-size:9px;line-height:1.4}.panel-note span{color:var(--amber)}
.diagram-panel{grid-column:2;grid-row:1;padding-bottom:8px}.legend{display:flex;gap:13px;color:var(--muted);font-size:9px}.legend span{display:flex;align-items:center;gap:4px}.legend i{width:16px;height:2px;background:#7e8f9d}.legend i.live{background:var(--blue);box-shadow:0 0 6px var(--blue)}.one-line{position:relative;height:calc(100% - 42px);min-height:500px;margin:0 10px;overflow:hidden;background-image:radial-gradient(#46607022 1px,transparent 1px);background-size:18px 18px}.wire{position:absolute;height:2px;background:#d9e2e8;transform-origin:left center;transition:.2s}.node{position:absolute;z-index:3;width:11px;height:11px;border-radius:50%;background:#e6edf2}.bypass-feed{left:3%;top:24%;width:24%}.bypass-node{left:26.4%;top:calc(24% - 4px)}.rectifier-feed{left:3%;top:59%;width:29%}.rectifier-node{left:31%;top:calc(59% - 4px)}.maintenance-top{left:27%;top:9%;width:60%}.maintenance-drop-left{left:27%;top:9%;width:15%;transform:rotate(90deg)}.maintenance-drop-right{left:87%;top:9%;width:50%;transform:rotate(90deg)}.ups-feed{left:32%;top:59%;width:25%}.ups-output{left:57%;top:59%;width:26%}.load-feed{left:83%;top:59%;width:14%}.static-feed{left:27%;top:24%;width:42%}.static-drop{left:69%;top:24%;width:35%;transform:rotate(90deg)}.diagram-label{position:absolute;z-index:3;padding:2px 4px;background:#0b1b28;color:#d8e0e6;font-size:10px;text-transform:uppercase}.bypass-supply{left:2%;top:20%}.rectifier-supply{left:2%;top:55%}.maintenance-path-label{left:49%;top:4%;transform:translateX(-50%)}.static-path-label{left:55%;top:19%}.ups-boundary{position:absolute;left:35%;top:18%;width:48%;height:63%;border:1px dashed var(--blue)}.ups-boundary>span{position:absolute;left:50%;top:-11px;padding:0 8px;color:var(--blue);background:#0a1926;transform:translateX(-50%)}.breaker-symbol{position:absolute;z-index:4;width:70px;height:45px;color:#dce5eb;font-size:9px;text-align:center}.breaker-symbol i{display:block;width:36px;height:2px;margin:10px auto 7px;background:white;transform:rotate(-38deg);transform-origin:right}.breaker-bypass{left:24%;top:20%}.breaker-rectifier{left:29%;top:55%}.breaker-maintenance{left:55%;top:5%}.breaker-output{left:80%;top:55%}
.conversion-block{position:absolute;z-index:4;width:100px;height:80px;padding:10px;border:1px solid #d5e0e6;background:#0b1c29}.conversion-block span{position:absolute;top:-22px;left:10px;font-size:10px;text-transform:uppercase}.conversion-block b,.conversion-block em{position:absolute;color:var(--blue);font-size:14px;font-style:normal}.conversion-block b{left:8px;top:12px}.conversion-block em{right:8px;bottom:12px}.conversion-block i{position:absolute;inset:0;background:linear-gradient(141deg,transparent 49%,#e0e7eb 49.5%,#e0e7eb 50.5%,transparent 51%)}.rectifier-block{left:37%;top:52%}.inverter-block{left:63%;top:52%}.static-block{position:absolute;z-index:4;left:53%;top:28%;width:130px;height:53px;display:grid;place-items:center;border:1px solid #cfdce5;background:#0b1b28}.static-block span{position:absolute;top:-20px;font-size:10px;text-transform:uppercase}.static-block b{width:70px;padding:4px;color:var(--blue);text-align:center;border:1px solid var(--blue)}.battery{position:absolute;z-index:4;left:54%;top:72%;display:grid;justify-items:center;gap:4px}.battery span{display:block;width:34px;height:5px;border-radius:9px;background:var(--blue)}.battery span:nth-child(2){width:27px}.battery span:nth-child(3){width:18px}.battery b{margin-top:4px;font-size:10px;font-weight:500;text-transform:uppercase}.load-box{position:absolute;z-index:4;right:1%;top:53%;width:90px;padding:13px 7px;text-align:center;border:1px solid #d9e2e8;background:#0a1824;text-transform:uppercase;font-size:10px}.load-box small{display:block;margin-top:5px;color:var(--muted);font-size:7px;text-transform:none}.one-line[data-current-mode=normal] :is(.rectifier-feed,.ups-feed,.ups-output,.load-feed),.one-line[data-current-mode=static] :is(.bypass-feed,.static-feed,.static-drop,.ups-output,.load-feed),.one-line[data-current-mode=maintenance] :is(.bypass-feed,.maintenance-top,.maintenance-drop-left,.maintenance-drop-right,.load-feed){background:var(--blue);box-shadow:0 0 8px var(--blue)}
.right-rail{grid-column:3;grid-row:1;display:grid;grid-template-rows:1fr auto;gap:8px}.checkpoint-list{list-style:none;margin:0 8px 8px;padding:0;border:1px solid var(--soft)}.checkpoint-list li{min-height:59px;display:grid;grid-template-columns:36px 1fr;gap:10px;align-items:center;padding:8px;border-bottom:1px solid var(--soft);background:#0c1b28}.checkpoint-list li>span{display:grid;place-items:center;width:29px;height:29px;color:#9dafbd;border:1px solid #718493;border-radius:50%}.checkpoint-list li.active>span{color:white;border-color:var(--blue);box-shadow:0 0 10px #1599ff55}.checkpoint-list strong,.checkpoint-list small{display:block}.checkpoint-list strong{font-size:11px;font-weight:550}.checkpoint-list small{margin-top:4px;color:var(--muted);font-size:9px}.objective-panel{padding:0 14px 14px}.objective-panel .panel-title{padding-left:0}.objective-panel>p{margin:0;color:#b8c3cc;font-size:10px;line-height:1.6}.progress-label{display:flex;justify-content:space-between;margin-top:10px;color:var(--muted);font-size:9px;text-transform:uppercase}.progress-bar{height:6px;margin-top:8px;overflow:hidden;border-radius:99px;background:#263744}.progress-bar span{display:block;width:33.3%;height:100%;background:var(--blue);transition:.2s}
.status-panel{grid-column:1/3;grid-row:2}.status-grid{height:calc(100% - 40px);display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:0 8px 8px}.status-grid article{min-width:0;display:flex;align-items:center;gap:9px;padding:10px;border:1px solid var(--soft);background:#0b1925;opacity:.58;transition:border-color .18s ease,background .18s ease,opacity .18s ease,box-shadow .18s ease}.load-state-light{flex:0 0 auto;width:18px;height:18px;border:2px solid #526273;border-radius:50%;background:#172330;box-shadow:inset 0 0 5px #000}.status-grid article.is-active{border-color:#21a4ff;background:#0b2031;opacity:1;box-shadow:inset 0 0 16px #078fff18}.status-grid article.is-active .load-state-light{border-color:#52c3ff;background:#19a9ff;box-shadow:0 0 10px #19a9ff,inset 0 0 4px #dff7ff}.status-grid article.load-dropped.is-active{border-color:#ff4949;background:#2a1014;box-shadow:inset 0 0 16px #ff242422}.status-grid article.load-dropped.is-active .load-state-light{border-color:#ff6a6a;background:#f52f39;box-shadow:0 0 10px #ff2834,inset 0 0 4px #fff}.status-grid small,.status-grid strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-grid strong{font-size:9px;font-weight:600}.status-grid small{margin-top:5px;font-size:8px;text-transform:uppercase;color:#8fa3b5}.status-grid article.is-active small{color:#78cdfd}.status-grid article.load-dropped.is-active small{color:#ff8b91}.sim-controls{grid-column:3;grid-row:2;padding:0 8px 8px}.sim-controls>button{width:100%;height:35px;margin-bottom:5px;border:0;border-radius:3px;background:#172a3b;font-size:10px;text-transform:uppercase;cursor:pointer}.sim-controls .primary-action{background:linear-gradient(#248dff,#0566db)}.sim-controls .disabled-action{opacity:.45;cursor:not-allowed}
.safety-gate{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:16px;background:#020811e8;backdrop-filter:blur(14px)}.safety-gate.hidden{display:none}.safety-dialog{width:min(560px,100%);max-height:calc(100vh - 32px);overflow-y:auto;padding:34px;border:1px solid #38526c;border-radius:8px;background:#0d1b2d;box-shadow:0 30px 100px #000}.safety-symbol{display:grid;place-items:center;width:46px;height:46px;margin-bottom:18px;border-radius:50%;background:var(--amber);color:#191001;font-size:22px;font-weight:900}.kicker{margin:0;color:#28aaff;font-size:10px;font-weight:800;text-transform:uppercase}.safety-dialog h2{margin:8px 0 12px;font-size:clamp(27px,5vw,42px);line-height:1.03}.safety-dialog>p:not(.kicker){color:var(--muted);line-height:1.6}.acknowledgement{display:grid;grid-template-columns:18px 1fr;gap:10px;margin:20px 0;padding:15px;border:1px solid #32485f;border-radius:5px;font-size:12px;line-height:1.5}.acknowledgement input{width:16px;height:16px;accent-color:var(--blue)}.safety-dialog>button{width:100%;padding:13px;color:white;border:0;border-radius:4px;background:var(--blue);font-weight:800}.safety-dialog>button:disabled{opacity:.35}.safety-dialog>a{display:block;margin-top:14px;color:#a9bfce;text-align:center;font-size:11px}
.trainee-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0 10px}.trainee-fields label{display:grid;gap:6px;color:#d9e6ef;font-size:11px}.trainee-fields label span{display:flex;justify-content:space-between;gap:8px}.trainee-fields b{color:#59baff;font-size:8px;text-transform:uppercase}.trainee-fields small{color:#8195a5;font-size:8px;text-transform:uppercase}.trainee-fields input{width:100%;padding:11px 12px;border:1px solid #3b5368;border-radius:4px;background:#07131e;color:#fff;outline:none}.trainee-fields input:focus{border-color:#4bb2ff;box-shadow:0 0 0 3px #1599ff22}.safety-dialog .tracking-notice{margin:8px 0 0;color:#8295a5;font-size:10px;line-height:1.45}.tracking-status{min-height:18px;margin:-12px 0 8px!important;color:#ffb0ac!important;font-size:10px}.tracking-status.is-local{color:#ffd27b!important}.tracking-status.is-ready{color:#9ce591!important}@media(max-width:520px){.trainee-fields{grid-template-columns:1fr}.safety-dialog{padding:24px}.safety-dialog h2{font-size:27px}}
@media(max-width:1180px){.sim-grid{grid-template-columns:290px minmax(500px,1fr);grid-template-rows:auto auto auto}.breaker-panel{grid-column:1}.diagram-panel{grid-column:2;min-height:620px}.right-rail{grid-column:1/-1;grid-row:2;grid-template-columns:1fr 1fr;grid-template-rows:auto}.status-panel{grid-column:1/-1;grid-row:3}.status-grid{grid-template-columns:repeat(5,1fr)}.sim-controls{grid-column:1/-1;grid-row:4}.sim-controls>button{width:calc(33.333% - 5px);margin-right:4px}}
@media(max-width:760px){.app-header{height:auto;min-height:62px}.header-button{display:none}.title-lockup h1{font-size:15px}.sim-grid{display:flex;flex-direction:column}.diagram-panel{order:1;min-height:540px;overflow-x:auto}.breaker-panel{order:2}.right-rail{display:contents}.learning-panel{order:3}.objective-panel{order:4}.status-panel{order:5}.sim-controls{order:6}.one-line{min-width:690px;transform:scale(.68);transform-origin:left top;width:147%;height:700px}.status-grid{grid-template-columns:1fr 1fr}.sim-controls>button{width:100%;margin-right:0}}
@media(max-width:430px){.shield-mark{display:none}.header-actions .icon-button:last-child{display:none}.status-grid{grid-template-columns:1fr}}

.load-drop-warning{position:fixed;z-index:90;top:50%;left:50%;display:flex;flex-direction:column;align-items:center;gap:14px;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.72);filter:drop-shadow(0 0 18px #ff2020);color:#fff;text-align:center;text-transform:uppercase}.load-drop-warning.is-visible{animation:load-drop-alert 1.6s ease-out both}.warning-triangle{position:relative;display:grid;place-items:center;width:0;height:0;border-left:66px solid transparent;border-right:66px solid transparent;border-bottom:116px solid #f2242f}.warning-triangle::after{content:"";position:absolute;top:10px;left:-51px;width:0;height:0;border-left:51px solid transparent;border-right:51px solid transparent;border-bottom:90px solid #55080e}.warning-triangle b{position:absolute;z-index:1;top:44px;left:-9px;font-size:48px;line-height:1}.load-drop-warning strong{padding:7px 14px;border:1px solid #ff5961;background:#39070bd9;font-size:18px;letter-spacing:.12em;box-shadow:0 0 18px #ff202055}@keyframes load-drop-alert{0%{opacity:0;transform:translate(-50%,-50%) scale(.72)}12%,62%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.08)}}@media(prefers-reduced-motion:reduce){.load-drop-warning.is-visible{animation-duration:.8s;animation-timing-function:linear}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

/* Single-screen dashboard on computer and tablet-sized browser windows. */
@media(min-width:761px){
html,body{height:100%;overflow:hidden}
body{display:flex;flex-direction:column}
.app-header{flex:0 0 58px;height:58px;margin-top:4px;padding-top:6px;padding-bottom:6px}
.shield-mark{width:42px;height:42px}.icon-button,.header-button{height:36px}.icon-button{width:36px}
.safety-strip{flex:0 0 auto;padding:4px 10px;line-height:1.15}
.sim-grid{flex:1 1 auto;height:auto;min-height:0;grid-template-columns:clamp(260px,22vw,350px) minmax(0,1fr) clamp(235px,19vw,300px);grid-template-rows:minmax(0,1fr) 126px;gap:6px;padding:6px;overflow:hidden}
.breaker-panel{grid-column:1;grid-row:1;min-height:0;overflow-y:auto}.diagram-panel{grid-column:2;grid-row:1;min-height:0}.right-rail{grid-column:3;grid-row:1;min-height:0;grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}.status-panel{grid-column:1/3;grid-row:2}.sim-controls{grid-column:3;grid-row:2}
.diagram-stage{flex:1 1 0;min-height:0;display:flex;align-items:center;justify-content:center}
.diagram-stage .reference-one-line{width:100%!important;max-width:100%!important;height:auto!important;max-height:100%!important;aspect-ratio:1456/1082}
.ups-control-group{flex:0 0 auto;margin-bottom:6px;padding-top:5px;padding-bottom:5px}.ups-control-group .panel-title{min-height:28px}.ups-control-group .control-card{min-height:166px}.ups-control-group .switch-visual,.ups-control-group .push-buttons{height:96px}
.static-bypass-indicator{min-height:58px;margin-bottom:7px;padding:8px 12px}.static-bypass-indicator>i{width:23px;height:23px}
.checkpoint-list li{min-height:clamp(46px,6.2vh,59px);padding:6px}
.status-panel .panel-title,.sim-controls .panel-title{min-height:32px;padding-top:7px;padding-bottom:7px}.status-grid{height:calc(100% - 32px)}
.sim-controls>button{width:100%;height:25px;margin:0 0 3px}
}

/* Training objective precedes the checkpoint list at every responsive size. */
.right-rail{grid-template-rows:auto 1fr}
@media(max-width:760px){.objective-panel{order:3}.learning-panel{order:4}}
@media(min-width:761px){.right-rail{grid-template-rows:auto minmax(0,1fr)}}

.objective-panel .panel-title h2{font-size:14px}.objective-panel>p{font-size:13px;line-height:1.55}

.learning-panel{min-height:0;display:flex;flex-direction:column}.learning-panel .panel-title{flex:0 0 auto}.learning-panel .panel-title h2{line-height:1.25}.learning-panel .checkpoint-list{flex:1 1 auto;min-height:0;overflow-y:auto;scrollbar-color:#3c627c #08131e}.learning-panel .checkpoint-list li{height:auto}.learning-panel .checkpoint-list small{line-height:1.35}

.checkpoint-list li{transition:border-color .18s ease,background-color .18s ease,box-shadow .18s ease}.checkpoint-list li.active{border-left:3px solid var(--blue);background:#0d2538;box-shadow:inset 0 0 16px #1599ff20}.checkpoint-list li.active>span{color:#fff;border-color:var(--blue);background:#0b3150;box-shadow:0 0 10px #1599ff88}.checkpoint-list li.completed{border-left:3px solid #65d455;background:#102419}.checkpoint-list li.completed>span{color:#e8ffe3;border-color:#65d455;background:#1d5c22;box-shadow:0 0 9px #65d45566}.checkpoint-list li.completed strong{color:#dfffd8}.checkpoint-list li.completed small{color:#9dca94}

.sim-controls>button.active{border:1px solid #58b8ff;background:linear-gradient(#248dff,#0566db);box-shadow:0 0 12px #1599ff55,inset 0 1px #ffffff55}.sim-controls>button[aria-pressed=false]{color:#b7c4ce}

.retransfer-button{flex:0 0 auto;margin:0 8px 8px;padding:10px 14px;border:1px solid #58b8ff;border-radius:4px;background:linear-gradient(#248dff,#0566db);color:#fff;font-size:11px;font-weight:750;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 0 14px #1599ff55;cursor:pointer}.retransfer-button:hover{filter:brightness(1.12)}.retransfer-button:focus-visible{outline:3px solid #8bd0ff;outline-offset:2px}
.restart-simulation-button{flex:0 0 auto;display:grid;gap:3px;margin:0 8px 8px;padding:11px 14px;border:1px solid #75dc68;border-radius:5px;background:linear-gradient(180deg,#218f3a,#116727);color:#fff;text-align:left;box-shadow:0 0 18px #65d45555;cursor:pointer}.restart-simulation-button strong{font-size:11px;letter-spacing:.05em;text-transform:uppercase}.restart-simulation-button small{color:#d9ffd4;font-size:9px}.restart-simulation-button:hover{filter:brightness(1.12)}.restart-simulation-button:focus-visible{outline:3px solid #a9ff9d;outline-offset:2px}.restart-simulation-button[hidden]{display:none}
.recover-system-button{flex:0 0 auto;display:grid;gap:3px;margin:0 8px 8px;padding:11px 14px;border:1px solid #ff6b66;border-radius:5px;background:linear-gradient(180deg,#d93430,#8f1714);color:#fff;text-align:left;box-shadow:0 0 18px #ff3b3555;cursor:pointer;animation:recovery-pulse 1.2s ease-in-out infinite}.recover-system-button strong{font-size:11px;letter-spacing:.06em;text-transform:uppercase}.recover-system-button small{color:#ffe2e0;font-size:9px}.recover-system-button:hover{filter:brightness(1.12)}.recover-system-button:focus-visible{outline:3px solid #ffaaa6;outline-offset:2px}.recover-system-button[hidden]{display:none}@keyframes recovery-pulse{50%{box-shadow:0 0 25px #ff3b3599}}@media(prefers-reduced-motion:reduce){.recover-system-button{animation:none}}

/* Local reference-matched one-line. This branch is intentionally not published. */
.reference-one-line{min-height:520px;background:radial-gradient(circle at 52% 48%,#102536 0,#0a1926 52%,#07131e 100%);font-size:12px}
.reference-one-line .diagram-label{padding:0;background:transparent;font-size:11px;line-height:1.35;text-align:center}
.reference-one-line .bypass-supply{left:0;top:24.5%}
.reference-one-line .rectifier-supply{left:0;top:55%}
.reference-one-line .maintenance-path-label{left:45%;top:1%;width:190px;transform:translateX(-50%)}
.reference-one-line .static-path-label{left:49%;top:21%;width:120px}
.reference-one-line .ups-boundary{left:26.5%;top:18%;width:51.5%;height:71%;border-color:#078df5}
.reference-one-line .ups-boundary>span{top:-12px;font-size:17px;background:#0b1c2a}
.reference-one-line .bypass-feed{left:0;top:27%;width:43%}
.reference-one-line .bypass-node{left:13.25%;top:calc(27% - 5px)}
.reference-one-line .rectifier-feed{left:0;top:57%;width:52%}
.reference-one-line .maintenance-top{left:13.8%;top:10%;width:73%}
.reference-one-line .maintenance-drop-left{left:13.8%;top:10%;width:10.5%;transform:rotate(90deg)}
.reference-one-line .maintenance-drop-right{left:86.8%;top:10%;width:32%;transform:rotate(90deg)}
.reference-one-line .ups-feed{left:39%;top:57%;width:16%}
.reference-one-line .ups-output{left:55%;top:57%;width:29%}
.reference-one-line .load-feed{left:84%;top:57%;width:12%}
.reference-one-line .static-feed{left:43%;top:27%;width:13%}
.reference-one-line .static-drop{left:56%;top:27%;width:30%;transform:rotate(90deg)}
.reference-one-line .battery-drop{left:47%;top:57%;width:14.5%;transform:rotate(90deg)}
.reference-one-line .dc-node{left:46.3%;top:calc(57% - 5px)}
.reference-one-line .inverter-node{left:73.5%;top:calc(57% - 5px)}
.reference-one-line .breaker-symbol{width:96px;height:66px;font-size:11px;line-height:1.25}
.reference-one-line .breaker-symbol i{width:34px;margin:8px auto 8px}
.reference-one-line .breaker-bypass{left:14%;top:23%}
.reference-one-line .breaker-rectifier{left:13%;top:53%}
.reference-one-line .breaker-maintenance{left:40.5%;top:6%}
.reference-one-line .breaker-output{left:79%;top:53%}
.reference-one-line .breaker-battery{left:42%;top:67%}
.reference-one-line .conversion-block{width:82px;height:67px}
.reference-one-line .conversion-block span{top:-20px;font-size:11px}
.reference-one-line .conversion-block b,.reference-one-line .conversion-block em{font-size:15px}
.reference-one-line .rectifier-block{left:28.5%;top:51%}
.reference-one-line .inverter-block{left:55%;top:51%}
.reference-one-line .static-block{left:42%;top:27%;width:113px;height:49px}
.reference-one-line .static-block b{position:relative;width:68px;height:24px;padding:0}
.reference-one-line .static-block b i{position:absolute;color:#087fff;font-size:18px;font-style:normal;line-height:20px}
.reference-one-line .static-block b i:first-child{left:25px;top:-6px}.reference-one-line .static-block b i:last-child{left:25px;top:6px}
.reference-one-line .battery{left:44%;top:78%}
.reference-one-line .battery b{font-size:11px}
.reference-one-line .load-arrow{position:absolute;z-index:4;left:91%;top:calc(57% - 5px);width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:10px solid #e4edf2}
.reference-one-line .load-box{right:0;top:52%;width:65px;padding:10px 4px;font-size:10px}
.reference-one-line .load-box small{display:none}
.reference-one-line[data-current-mode=normal] :is(.rectifier-feed,.ups-feed,.ups-output,.load-feed){background:#d9e2e8;box-shadow:none}

@media(max-width:760px){.diagram-panel{min-height:570px;overflow:hidden}.reference-one-line{min-width:760px;width:760px;height:560px;margin:0 10px -34px;transform:scale(.94);transform-origin:left top}}
@media(max-width:600px){.diagram-panel{min-height:445px}.reference-one-line{margin-bottom:-168px;transform:scale(.70)}}
@media(max-width:430px){.diagram-panel{min-height:320px}.reference-one-line{margin-bottom:-302px;transform:scale(.46)}}

/* Local reference-matched breaker panel. Original CSS artwork; no third-party marks. */
.breaker-panel{display:flex;flex-direction:column;gap:10px}
.diagram-panel{display:flex;flex-direction:column}
.diagram-panel>.reference-one-line{flex:1 1 auto;height:auto;min-height:500px}
.breaker-panel .control-group,.ups-control-group{padding:7px;border:1px solid #203a4e;border-radius:4px;background:linear-gradient(145deg,#091824cc,#06121dcc)}
.ups-control-group{flex:0 0 auto;margin:0 10px 10px}
.control-surface .panel-title{margin:0 0 7px;padding:0 3px 6px;border-bottom:1px solid #1b668f}
.control-surface .panel-title h2{font-size:12px;letter-spacing:.035em}
.control-surface .control-grid{gap:10px 12px}
.breaker-panel .control-grid{grid-template-columns:1fr}
.ups-control-group .control-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.control-surface .control-card{min-height:181px;padding:9px 8px 7px;background:linear-gradient(145deg,#0d1d29,#08141e);border-color:#304758}
.control-surface .control-name{min-height:35px;font-size:12px;line-height:1.35;text-transform:none}
.control-surface .control-status{margin:2px 0 7px;font-size:11px}
.control-surface .switch-visual{width:128px;height:112px;overflow:hidden;border:2px solid #727775;border-radius:5px;background:linear-gradient(#d91b2b 0 0) 0 28px/100% 5px no-repeat,linear-gradient(#f3dc00 0 0) 0 61px/100% 5px no-repeat,linear-gradient(#14b85a 0 0) 0 91px/100% 5px no-repeat,linear-gradient(90deg,#333a3d 0 29%,#161b1e 29% 76%,#303638 76% 100%);box-shadow:inset 0 0 0 4px #161a1c,inset 0 0 16px #000,0 3px 7px #000b}
.control-surface .switch-visual:before{content:"";position:absolute;z-index:1;right:6px;top:9px;width:23px;height:94px;border-left:1px solid #080b0d;background:repeating-linear-gradient(90deg,transparent 0 4px,#090c0e 4px 7px),repeating-linear-gradient(0deg,#555b5c 0 3px,#111517 3px 7px);box-shadow:inset 2px 0 4px #0008}
.control-surface .switch-visual:after{content:"";position:absolute;z-index:2;left:31px;top:8px;width:68px;height:96px;border:1px solid #111;border-radius:4px;background:linear-gradient(90deg,#0b0d0e,#272b2c 13%,transparent 13% 87%,#090b0c);box-shadow:inset 0 0 7px #000,0 0 0 1px #5558;pointer-events:none}
.control-surface .switch-visual b{z-index:3;left:40px;top:29px;width:50px;height:70px;border:1px solid #777;border-radius:5px;background:linear-gradient(90deg,#aaa8a2,#f5f3ec 42%,#d5d2ca 72%,#8a8985);box-shadow:inset 0 0 5px #fff8,0 4px 7px #000b;transform:translateY(0);transition:transform .18s ease}
.control-surface .switch-visual b:before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:25px;border:1px solid #777;border-radius:5px 5px 2px 2px;background:linear-gradient(#eee,#c7c5c0 45%,#83817e 52%,#aaa8a3);box-shadow:0 2px 3px #0008;opacity:0}
.control-surface .switch-visual b:after{content:"";position:absolute;left:11px;right:11px;bottom:8px;height:5px;border:1px solid #111;border-radius:2px;background:linear-gradient(#0b0d0e,#535759);box-shadow:0 1px 0 #fff8}
.control-surface .switch-visual.on b{transform:translateY(-13px)}
.control-surface .switch-visual.on b:before{opacity:1}
.control-surface .switch-visual.on b:after{opacity:0}
.control-surface .switch-visual em,.control-surface .switch-visual small{z-index:4;left:9px;right:auto;color:#f2f2ed;font-size:10px;font-weight:700;text-transform:none;text-shadow:0 1px 2px #000}
.control-surface .switch-visual em{top:34px}.control-surface .switch-visual small{bottom:7px}
.control-surface .inverter-indicators{width:100%;display:flex;justify-content:center;gap:12px;margin:4px 0 7px;color:#83919e;font-size:9px;text-transform:uppercase}
.control-surface .inverter-indicator{display:flex;align-items:center;gap:5px;white-space:nowrap}
.control-surface .inverter-indicator i{width:9px;height:9px;border-radius:50%;background:#4c5760;box-shadow:inset 0 0 3px #000}
.control-surface .inverter-indicator.active{color:#dbeeff}
.control-surface .inverter-indicator.active i{background:#2b83ff;box-shadow:0 0 9px 2px #2b83ff}
.control-surface .push-buttons{width:128px;height:112px;display:flex;align-items:center;justify-content:center;gap:8px;margin:auto 0 0;padding:14px 7px 9px;border:2px solid #d4d6d4;border-radius:7px;background:repeating-linear-gradient(0deg,#aaa 0 1px,#c4c5c3 1px 2px,#aaa 2px 3px);box-shadow:inset 0 0 0 2px #777,0 4px 8px #000c}
.control-surface .inverter-button{display:flex;flex-direction:column;align-items:center;gap:9px;padding:0;border:0;background:transparent;color:#16191c;text-shadow:0 1px #eee;text-transform:uppercase;cursor:pointer}
.control-surface .inverter-button b{position:relative;width:42px;height:42px;border:5px solid #212426;border-radius:50%;background:radial-gradient(circle at 40% 32%,#e4e4e1,#aaa 52%,#5d6060 72%);box-shadow:0 0 0 2px #888,0 3px 4px #0008,inset 0 1px 3px #fff}
.control-surface .inverter-button b:after{content:"";position:absolute;inset:3px;border-radius:50%;background:linear-gradient(145deg,#fafafa44,transparent 55%)}
.control-surface .inverter-button.active b{border-color:#12223d;background:radial-gradient(circle at 40% 32%,#eef6ff,#bad3ff 49%,#609eff 72%);box-shadow:0 0 0 2px #237cff,0 0 13px 4px #237cff99,0 3px 4px #0008,inset 0 1px 4px #fff}
.control-surface .inverter-button small{width:48px;color:#181b1e;font-size:7px;font-weight:800;line-height:1.1;white-space:nowrap;text-align:center}
.control-surface .inverter-button:disabled{opacity:.38;filter:grayscale(1);cursor:not-allowed}
.control-surface .inverter-button:disabled b{box-shadow:0 0 0 2px #666,0 3px 4px #0008,inset 0 1px 3px #fff}
.control-surface .inverter-control{cursor:default}
.ups-isolated-indicator{min-height:40px;display:flex;align-items:center;justify-content:center;gap:9px;margin:0 0 7px;padding:6px 10px;border:1px solid #354858;border-radius:4px;background:#091722;color:#71808d;text-transform:uppercase;transition:.18s ease}.ups-isolated-indicator i{width:16px;height:16px;border:2px solid #46535e;border-radius:50%;background:#18232b;box-shadow:inset 0 0 5px #000}.ups-isolated-indicator strong{font-size:11px;letter-spacing:.06em}.ups-isolated-indicator small{font-size:8px;letter-spacing:.08em}.ups-isolated-indicator.is-active{border-color:#65d455;background:#102411;color:#dcffd5;box-shadow:0 0 14px #58d84235,inset 0 0 12px #58d84218}.ups-isolated-indicator.is-active i{border-color:#a5ef98;background:#65d455;box-shadow:0 0 11px 3px #65d45599,inset 0 0 4px #fff}
@media(max-width:1180px){.control-surface .switch-visual{width:112px}.control-surface .switch-visual b{left:32px}.control-surface .switch-visual:after{left:23px}.control-surface .switch-visual:before{width:20px}}
@media(max-width:760px){.ups-control-group{overflow-x:auto}.ups-control-group .control-grid{min-width:520px}}
@media(max-width:430px){.control-surface .control-grid{gap:8px}.control-surface .control-card{min-height:176px}.control-surface .switch-visual{width:128px}.control-surface .switch-visual b{left:40px}.control-surface .switch-visual:after{left:31px}.control-surface .switch-visual:before{width:23px}}

/* Fixed-ratio one-line canvas: all geometry scales together. */
.diagram-stage{container-type:inline-size;flex:0 0 auto;width:calc(100% - 20px);margin:0 10px;overflow:hidden}
.diagram-stage .reference-one-line{position:relative;width:100%!important;min-width:0!important;height:auto!important;min-height:0!important;aspect-ratio:1456/1082;margin:0!important;overflow:hidden;transform:none!important;background:radial-gradient(circle at 52% 48%,#102536 0,#081a2a 53%,#03111e 100%);font-size:1.32cqw}
.diagram-stage .wire{height:max(1px,.18cqw)}
.diagram-stage .node{width:1.05cqw;height:1.05cqw}
.diagram-stage .reference-one-line .diagram-label{font-size:1.35cqw;line-height:1.35}
.diagram-stage .reference-one-line .bypass-supply{left:0;top:27%}
.diagram-stage .reference-one-line .rectifier-supply{left:0;top:53%}
.diagram-stage .reference-one-line .maintenance-path-label{left:48%;top:3%;width:22%;font-size:1.4cqw}
.diagram-stage .reference-one-line .static-path-label{left:43%;top:23.5%;width:14%}
.diagram-stage .reference-one-line .ups-boundary{left:26.5%;top:20%;width:47%;height:71%;border-width:max(1px,.14cqw)}
.diagram-stage .reference-one-line .ups-boundary>span{top:-1.15cqw;padding:0 1.1cqw;font-size:2cqw;background:#091b2b}
.diagram-stage .reference-one-line .bypass-feed{left:12%;top:28%;width:30%}
.diagram-stage .reference-one-line .bypass-node{left:15.55%;top:calc(28% - .43cqw)}
.diagram-stage .reference-one-line .rectifier-feed{left:12%;top:55%;width:27.9%}
.diagram-stage .reference-one-line .maintenance-top{left:15.8%;top:13.8%;width:68%}
.diagram-stage .reference-one-line .maintenance-drop-left{left:15.8%;top:13.8%;width:10.6cqw;transform:rotate(90deg)}
.diagram-stage .reference-one-line .maintenance-drop-right{left:83.8%;top:13.8%;width:30.6cqw;transform:rotate(90deg)}
.diagram-stage .reference-one-line .ups-feed{left:39.9%;top:55%;width:6.8%}
.diagram-stage .reference-one-line .dc-to-inverter{left:46.7%;top:55%;width:7.2%}
.diagram-stage .reference-one-line .ups-output{left:53.9%;top:55%;width:15.9%}
.diagram-stage .reference-one-line .source-to-output{left:69.8%;top:55%;width:4.2%}
.diagram-stage .reference-one-line .output-to-junction{left:74%;top:55%;width:9.7%}
.diagram-stage .reference-one-line .load-feed{left:83.7%;top:55%;width:7.9%}
.diagram-stage .reference-one-line .static-feed{left:23%;top:28%;width:19%}
.diagram-stage .reference-one-line .static-drop{display:none}
.diagram-stage .reference-one-line .battery-drop{left:46.7%;top:55%;width:8.5cqw;transform:rotate(90deg)}
.diagram-stage .reference-one-line .dc-node{left:46.2%;top:calc(55% - .43cqw)}
.diagram-stage .reference-one-line .inverter-node{left:69.8%;top:calc(55% - .43cqw)}
.diagram-stage .reference-one-line .breaker-symbol{width:9cqw;height:6.5cqw;font-size:1.32cqw;line-height:1.3}
.diagram-stage .reference-one-line .breaker-symbol i{position:relative;width:3.6cqw;height:max(1px,.18cqw);margin:.8cqw auto .9cqw;background:#edf3f7;transform:rotate(-34deg);transform-origin:center}
.diagram-stage .reference-one-line .breaker-symbol i:before,.diagram-stage .reference-one-line .breaker-symbol i:after{content:"";position:absolute;top:50%;width:.9cqw;height:.9cqw;border:max(1px,.18cqw) solid #edf3f7;border-radius:50%;background:#0a1b2a;transform:translateY(-50%)}
.diagram-stage .reference-one-line .breaker-symbol i:before{left:-.9cqw}.diagram-stage .reference-one-line .breaker-symbol i:after{right:-.9cqw}
.diagram-stage .reference-one-line .breaker-bypass{left:14.8%;top:25.3%}
.diagram-stage .reference-one-line .breaker-rectifier{left:14.8%;top:52.3%}
.diagram-stage .reference-one-line .breaker-maintenance{left:44%;top:11.1%}
.diagram-stage .reference-one-line .breaker-output{left:74%;top:52.3%}
.diagram-stage .reference-one-line .breaker-battery{left:42.2%;top:66.4%}
.diagram-stage .reference-one-line .conversion-block{width:9.5%;height:12.5%;padding:1cqw;border-width:max(1px,.14cqw)}
.diagram-stage .reference-one-line .conversion-block span{top:-2.4cqw;left:1.2cqw;font-size:1.4cqw}
.diagram-stage .reference-one-line .conversion-block b,.diagram-stage .reference-one-line .conversion-block em{font-size:1.55cqw}
.diagram-stage .reference-one-line .conversion-block b{left:1.2cqw;top:1.4cqw}.diagram-stage .reference-one-line .conversion-block em{right:1.2cqw;bottom:1.4cqw}
.diagram-stage .reference-one-line .rectifier-block{left:30.5%;top:50.4%}
.diagram-stage .reference-one-line .inverter-block{left:53.8%;top:50.4%}
.diagram-stage .reference-one-line .static-block{left:41.8%;top:27%;width:14.3%;height:9%;border-width:max(1px,.14cqw)}
.diagram-stage .reference-one-line .static-block:after{content:"";position:absolute;left:100%;top:50%;width:14.4cqw;height:max(1px,.18cqw);background:#edf3f7}
.diagram-stage .reference-one-line .static-block:before{content:"";position:absolute;left:calc(100% + 14.4cqw);top:50%;width:17.5cqw;height:max(1px,.18cqw);background:#edf3f7;transform:rotate(90deg);transform-origin:left center}
.diagram-stage .reference-one-line .static-block b{position:relative;width:7.6cqw;height:4.3cqw;padding:0;border:0}
.diagram-stage .reference-one-line .static-block b i{position:absolute;width:0;height:0;color:transparent;font-size:0;border-top:.9cqw solid transparent;border-bottom:.9cqw solid transparent;border-left:1.35cqw solid #edf3f7}
.diagram-stage .reference-one-line .static-block b i:after{content:"";position:absolute;left:-1.55cqw;top:-1.05cqw;width:max(1px,.18cqw);height:2.1cqw;background:#edf3f7}
.diagram-stage .reference-one-line .static-block b i:first-child{left:2.8cqw;top:.2cqw;transform:rotate(180deg)}.diagram-stage .reference-one-line .static-block b i:last-child{left:2.8cqw;top:2.1cqw}
.diagram-stage .reference-one-line .battery{left:44.5%;top:77%;gap:.35cqw}
.diagram-stage .reference-one-line .battery:before{content:"";position:absolute;left:50%;bottom:100%;width:max(1px,.18cqw);height:3cqw;background:#edf3f7;transform:translateX(-50%)}
.diagram-stage .reference-one-line .battery span{width:4.6cqw;height:max(1px,.22cqw);background:#edf3f7}.diagram-stage .reference-one-line .battery span:nth-child(2){width:3.4cqw}.diagram-stage .reference-one-line .battery span:nth-child(3){width:2.2cqw}
.diagram-stage .reference-one-line .battery b{margin-top:.6cqw;font-size:1.35cqw}
.diagram-stage .reference-one-line .load-arrow{display:none}
.diagram-stage .reference-one-line .load-box{right:0;top:51.2%;width:8.5%;padding:1.25cqw .3cqw;font-size:1.3cqw;border-width:max(1px,.14cqw)}
.diagram-stage .reference-one-line .load-box small{display:none}
.diagram-stage .reference-one-line[data-current-mode=normal] :is(.rectifier-feed,.ups-feed,.ups-output,.load-feed){background:#d9e2e8;box-shadow:none}
@media(max-width:760px){.diagram-panel{min-height:0}.diagram-stage{width:calc(100% - 12px);margin:0 6px}.diagram-stage .reference-one-line{min-width:0!important}.ups-control-group{margin-top:8px}}

/* IEEE-style two-contact switch symbols. */
.diagram-stage .reference-one-line .breaker-symbol:before{content:"";position:absolute;z-index:0;left:calc(50% + .42cqw);top:0;width:4.35cqw;height:1.35cqw;background:#0a1c2b;transform:translate(-50%,-50%)}
.diagram-stage .reference-one-line .breaker-symbol i{position:relative;z-index:1;left:-1.75cqw;display:block;width:1cqw;height:1cqw;margin:0 auto 1cqw;border:max(1px,.2cqw) solid #f4f7f9;border-radius:50%;background:#0a1c2b;transform:translateY(-50%)}
.diagram-stage .reference-one-line .breaker-symbol i:before{content:"";position:absolute;left:.55cqw;top:.42cqw;width:4cqw;height:max(1px,.22cqw);border:0;border-radius:99px;background:#f4f7f9;box-shadow:0 0 .25cqw #fff4;transform:rotate(-29deg);transform-origin:left center}
.diagram-stage .reference-one-line .breaker-symbol i:after{content:"";position:absolute;left:4.35cqw;top:50%;width:1cqw;height:1cqw;border:max(1px,.2cqw) solid #f4f7f9;border-radius:50%;background:#0a1c2b;transform:translateY(-50%)}
.diagram-stage .reference-one-line .breaker-symbol.closed i:before{width:4.2cqw;transform:rotate(0)}
.diagram-stage .reference-one-line .breaker-bypass{top:28%}
.diagram-stage .reference-one-line .breaker-rectifier,.diagram-stage .reference-one-line .breaker-output{top:55%}
.diagram-stage .reference-one-line .breaker-maintenance{top:13.8%}
.diagram-stage .reference-one-line .breaker-battery{top:66.4%}
.diagram-stage .reference-one-line .breaker-battery:before{left:50%;top:2.15cqw;width:1.35cqw;height:4.35cqw}
.diagram-stage .reference-one-line .breaker-battery i{left:0;transform:translateY(-50%) rotate(90deg)}
.diagram-stage .reference-one-line .breaker-battery span{position:absolute;left:5.7cqw;top:.6cqw;width:7cqw;text-align:left}

/* Reference-matched static-bypass enclosure and opposing diode branches. */
.diagram-stage .reference-one-line .static-block{display:block;background:linear-gradient(to bottom,transparent calc(50% - .1cqw),#edf3f7 calc(50% - .1cqw),#edf3f7 calc(50% + .1cqw),transparent calc(50% + .1cqw)),#0a1b2a}
.diagram-stage .reference-one-line .static-block b{position:absolute;left:50%;top:50%;width:7.6cqw;height:3.5cqw;border:max(1px,.18cqw) solid #edf3f7;background:#0a1b2a;transform:translate(-50%,-50%)}
.diagram-stage .reference-one-line .static-block b i{width:1.7cqw;height:1.6cqw;border:0;background:#edf3f7;clip-path:polygon(0 0,100% 50%,0 100%)}
.diagram-stage .reference-one-line .static-block b i:before{content:"";position:absolute;left:.23cqw;top:.3cqw;width:1.08cqw;height:1cqw;background:#0a1b2a;clip-path:polygon(0 0,100% 50%,0 100%)}
.diagram-stage .reference-one-line .static-block b i:after{left:1.55cqw;top:-.15cqw;width:max(1px,.2cqw);height:1.9cqw}
.diagram-stage .reference-one-line .static-block b i:first-child{left:2.95cqw;top:-.8cqw;transform:rotate(180deg)}
.diagram-stage .reference-one-line .static-block b i:last-child{left:2.95cqw;top:2.7cqw}

/* Reference-matched vertical battery breaker and alternating battery plates. */
.diagram-stage .reference-one-line .battery{left:43.7%;top:77%;width:6cqw;height:11.5cqw;display:block}
.diagram-stage .reference-one-line .battery:before{left:50%;bottom:100%;height:3.4cqw}
.diagram-stage .reference-one-line .battery:after{content:"";position:absolute;left:50%;top:4.3cqw;width:max(1px,.18cqw);height:2.5cqw;background:#edf3f7;transform:translateX(-50%)}
.diagram-stage .reference-one-line .battery span{position:absolute;left:50%;height:max(1px,.22cqw);border-radius:0;transform:translateX(-50%)}
.diagram-stage .reference-one-line .battery span:nth-child(1){top:0;width:5cqw}
.diagram-stage .reference-one-line .battery span:nth-child(2){top:1.4cqw;width:2.6cqw}
.diagram-stage .reference-one-line .battery span:nth-child(3){top:2.8cqw;width:4.2cqw}
.diagram-stage .reference-one-line .battery span:nth-child(4){top:4.2cqw;width:2.3cqw}
.diagram-stage .reference-one-line .battery b{position:absolute;left:0;top:8.1cqw;width:6cqw;margin:0;text-align:center}
.control-surface .control-card[data-breaker]{cursor:pointer}
.control-surface .control-card[data-breaker].is-open{border-color:#6a3d3d;box-shadow:inset 0 0 0 1px #f0444426}

/* Prominent Static Bypass state above the maintenance controls. */
.breaker-panel{overflow-y:auto}
.static-bypass-indicator{min-height:72px;display:flex;align-items:center;justify-content:center;gap:14px;margin:0 4px 10px;padding:12px 16px;border:1px solid #394958;border-radius:5px;background:linear-gradient(145deg,#0b1823,#07111b);color:#71808d;text-transform:uppercase;transition:.18s ease}
.static-bypass-indicator>i{width:28px;height:28px;border:3px solid #414d57;border-radius:50%;background:#18222a;box-shadow:inset 0 0 8px #000}
.static-bypass-indicator span{display:flex;flex-direction:column;gap:3px}.static-bypass-indicator strong{font-size:14px;letter-spacing:.06em}.static-bypass-indicator small{font-size:9px;letter-spacing:.12em}
.static-bypass-indicator.is-active{border-color:#ffc04d;background:linear-gradient(145deg,#2d220c,#171105);color:#ffe2a1;box-shadow:0 0 18px #ffc04d44,inset 0 0 18px #ffc04d18}
.static-bypass-indicator.is-active>i{border-color:#ffe09a;background:#ffc04d;box-shadow:0 0 16px 5px #ffc04daa,inset 0 0 6px #fff8}

/* Inverter command state and energized static-bypass indication. */
.diagram-stage .reference-one-line[data-inverter-state=static] .static-feed{background:var(--blue);box-shadow:0 0 .7cqw var(--blue)}
.diagram-stage .reference-one-line .static-block.is-active{border-color:var(--blue);background:linear-gradient(to bottom,transparent calc(50% - .1cqw),var(--blue) calc(50% - .1cqw),var(--blue) calc(50% + .1cqw),transparent calc(50% + .1cqw)),#0a1b2a;box-shadow:0 0 1.1cqw #1599ffaa,inset 0 0 .8cqw #1599ff33}
.diagram-stage .reference-one-line .static-block.is-active:before,.diagram-stage .reference-one-line .static-block.is-active:after{background:var(--blue);box-shadow:0 0 .7cqw var(--blue)}
.diagram-stage .reference-one-line .static-block.is-active b{border-color:var(--blue);box-shadow:0 0 .65cqw #1599ffaa}
.diagram-stage .reference-one-line .static-block.is-active b i{background:var(--blue)}
.diagram-stage .reference-one-line .static-block.is-active b i:after{background:var(--blue);box-shadow:0 0 .45cqw var(--blue)}

/* RIB state drives the rectifier's energized indication. */
.diagram-stage .reference-one-line .rectifier-block{transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}
.diagram-stage .reference-one-line .rectifier-block.is-active{border-color:#35a7ff;background:#0b2134;box-shadow:0 0 1.1cqw #1599ffaa,inset 0 0 .8cqw #1599ff2e}
.diagram-stage .reference-one-line .rectifier-block.is-active span,.diagram-stage .reference-one-line .rectifier-block.is-active b,.diagram-stage .reference-one-line .rectifier-block.is-active em{color:#58b8ff;text-shadow:0 0 .55cqw #1599ff}

/* Battery breaker state drives the battery's energized indication. */
.diagram-stage .reference-one-line .battery:before,.diagram-stage .reference-one-line .battery:after,.diagram-stage .reference-one-line .battery span{transition:background-color .18s ease,box-shadow .18s ease}
.diagram-stage .reference-one-line .battery.is-active:before,.diagram-stage .reference-one-line .battery.is-active:after,.diagram-stage .reference-one-line .battery.is-active span{background:var(--blue);box-shadow:0 0 .7cqw var(--blue)}
.diagram-stage .reference-one-line .battery.is-active b{color:#58b8ff;text-shadow:0 0 .55cqw #1599ff}

/* Inverter command state drives the inverter's energized indication. */
.diagram-stage .reference-one-line .inverter-block{transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}
.diagram-stage .reference-one-line .inverter-block.is-active{border-color:#35a7ff;background:#0b2134;box-shadow:0 0 1.1cqw #1599ffaa,inset 0 0 .8cqw #1599ff2e}
.diagram-stage .reference-one-line .inverter-block.is-active span,.diagram-stage .reference-one-line .inverter-block.is-active b,.diagram-stage .reference-one-line .inverter-block.is-active em{color:#58b8ff;text-shadow:0 0 .55cqw #1599ff}

/* Energized conductors follow the online state of their associated equipment. */
.diagram-stage .reference-one-line[data-rectifier-online=false] :is(.rectifier-feed,.ups-feed),
.diagram-stage .reference-one-line[data-dc-online=false] :is(.battery-drop,.dc-to-inverter),
.diagram-stage .reference-one-line[data-inverter-circuit-online=false] .ups-output,
.diagram-stage .reference-one-line[data-internal-source-online=false] .source-to-output{background:#d9e2e8;box-shadow:none}
.diagram-stage .reference-one-line[data-rectifier-online=true] :is(.rectifier-feed,.ups-feed),
.diagram-stage .reference-one-line[data-dc-online=true] :is(.battery-drop,.dc-to-inverter),
.diagram-stage .reference-one-line[data-inverter-circuit-online=true] .ups-output,
.diagram-stage .reference-one-line[data-internal-source-online=true] .source-to-output{background:var(--blue);box-shadow:0 0 .7cqw var(--blue)}

/* BIB availability gates the downstream static-bypass path. */
.diagram-stage .reference-one-line[data-static-bypass-online=false] .static-feed{background:#d9e2e8;box-shadow:none}
.diagram-stage .reference-one-line[data-static-bypass-online=true] .static-feed{background:var(--blue);box-shadow:0 0 .7cqw var(--blue)}

/* A closed MBB energizes the complete external maintenance-bypass path. */
.diagram-stage .reference-one-line[data-mbb-closed=false] :is(.maintenance-top,.maintenance-drop-left,.maintenance-drop-right){background:#d9e2e8;box-shadow:none}
.diagram-stage .reference-one-line[data-mbb-closed=true] :is(.bypass-feed,.maintenance-top,.maintenance-drop-left,.maintenance-drop-right){background:var(--blue);box-shadow:0 0 .7cqw var(--blue)}
.diagram-stage .reference-one-line[data-mbb-closed=true] .breaker-maintenance i,.diagram-stage .reference-one-line[data-mbb-closed=true] .breaker-maintenance i:after{border-color:var(--blue);box-shadow:0 0 .5cqw #1599ffaa}
.diagram-stage .reference-one-line[data-mbb-closed=true] .breaker-maintenance i:before{background:var(--blue);box-shadow:0 0 .55cqw var(--blue)}

/* Every switch carried by an energized circuit shares the circuit glow. */
.diagram-stage .reference-one-line .breaker-symbol.is-energized i,.diagram-stage .reference-one-line .breaker-symbol.is-energized i:after{border-color:var(--blue);box-shadow:0 0 .5cqw #1599ffaa}
.diagram-stage .reference-one-line .breaker-symbol.is-energized i:before{background:var(--blue);box-shadow:0 0 .55cqw var(--blue)}

/* The final conductor and Critical Load illuminate only when a complete supply path exists. */
.diagram-stage .reference-one-line[data-internal-output-online=false] .output-to-junction{background:#d9e2e8;box-shadow:none}
.diagram-stage .reference-one-line[data-internal-output-online=true] .output-to-junction{background:var(--blue);box-shadow:0 0 .7cqw var(--blue)}
.diagram-stage .reference-one-line[data-load-online=false] .load-feed{background:#d9e2e8;box-shadow:none}
.diagram-stage .reference-one-line[data-load-online=true] .load-feed{background:var(--blue);box-shadow:0 0 .7cqw var(--blue)}
.diagram-stage .reference-one-line .load-box{transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease,color .18s ease}
.diagram-stage .reference-one-line .load-box.is-active{border-color:#35a7ff;background:#0b2134;color:#58b8ff;box-shadow:0 0 1.1cqw #1599ffaa,inset 0 0 .8cqw #1599ff2e;text-shadow:0 0 .55cqw #1599ff}