body{margin:0;font:14px -apple-system,Helvetica,Arial,sans-serif;background:#1f2430;color:#e5e7eb}
header{position:sticky;top:0;z-index:5;background:#111827;padding:8px 10px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
header a{color:#93c5fd}.tag{background:#f59e0b;color:#111;padding:2px 6px;border-radius:4px;font-size:12px}
button{padding:5px 12px;border-radius:6px;border:0;background:#e11d48;color:#fff;font-size:14px}#stat{font-size:13px;color:#a7f3d0}
.help{margin:6px 10px;color:#cbd5e1;font-size:13px}h2{font-size:15px;margin:10px}
.sh{position:relative;background:#fff;margin:0 6px 14px}.sh img{display:block;width:100%;height:auto}.sh svg{position:absolute;inset:0;width:100%;height:100%}
.w{fill:none;stroke:transparent;stroke-width:10;stroke-linecap:round;stroke-linejoin:round}
.w.live{stroke:#22c55e;stroke-width:12;stroke-opacity:.75;filter:url(#glow1)}.w.live.r204{stroke:#22c55e}.w.live.r205{stroke:#f97316}.w.live.r206{stroke:#eab308}
.ct{fill:none;stroke:#8b9ab6;stroke-width:5;stroke-linecap:round}.ct.live{stroke:#16a34a;stroke-width:7}
.coil{fill:transparent;stroke:none}.coil.on{fill:#bbf7d0;fill-opacity:.85;stroke:#15803d;stroke-width:6;filter:url(#glow1)}
.lamp.on{fill:#fde68a;fill-opacity:.85;stroke:#b45309;stroke-width:4;filter:url(#glow1)}.lamp{fill:transparent}
.hit{fill:transparent;cursor:pointer}.hit:hover{fill:#f59e0b22;stroke:#f59e0b;stroke-width:4}
.lbl{font:bold 30px Helvetica,Arial,sans-serif;fill:#b45309}.lbl.trip{fill:#dc2626}
.io rect.box{fill:#fff;stroke:#111;stroke-width:4}.io text{font:24px Helvetica,Arial,sans-serif;fill:#111}.io text.ad{fill:#dc2626;font-size:21px}
.io .tri{fill:#94a3b8;stroke:#334155;stroke-width:3;cursor:pointer}.io .tri:hover{fill:#f59e0b}.io.on .tri{fill:#22c55e;filter:url(#glow1)}.io.on rect.box{fill:#dcfce7}
.io.forced .tri{fill:#f59e0b}
.cbp{fill:#f8fafc;stroke:#334155;stroke-width:5;stroke-dasharray:20 10}.cbt{font:bold 34px Helvetica,Arial,sans-serif;fill:#111}.cbs{font:26px Helvetica,Arial,sans-serif;fill:#334155}.cbs.b{font-weight:bold}.cbs.r{fill:#dc2626;font-weight:bold}.cbs.g{fill:#15803d}
.cbdial{fill:#e5e7eb;stroke:#111;stroke-width:6}.cbh{fill:#1f2937;stroke:#000;stroke-width:3}
.cbst{font:bold 40px Helvetica,Arial,sans-serif}.cbst.on{fill:#15803d}.cbst.off{fill:#475569}.cbst.trip{fill:#dc2626}
.cbb{cursor:pointer}.cbb rect{stroke:#111;stroke-width:4}.cbb text{font:bold 36px Helvetica,Arial,sans-serif;fill:#fff;pointer-events:none}.cbb.on rect{fill:#16a34a}.cbb.off rect{fill:#475569}.cbb.test rect{fill:#f97316}.cbb:hover rect{stroke:#f59e0b;stroke-width:8}

.hcoil{fill:#fff;stroke:#141414;stroke-width:4}.hcoil.on{fill:#22c55e;fill-opacity:.9;stroke:#15803d;stroke-width:5;filter:url(#glow1)}
.hlbl{font:28px Helvetica,Arial,sans-serif;fill:#141414}.hlbl.s{font-size:22px}
.gcoil{fill:transparent;stroke:none;pointer-events:none}.gcoil.on{fill:#22c55e;fill-opacity:.85;stroke:#15803d;stroke-width:5}
.iog{fill:transparent;stroke:none;cursor:pointer}.iog:hover{fill:#f59e0b33}.iog.on{fill:#22c55e;fill-opacity:.35;stroke:#16a34a;stroke-width:6}.iog.forced{fill:#f59e0b;fill-opacity:.35}
.mlbl{font:28px Helvetica,Arial,sans-serif;fill:#141414}
.lamp.g.on{fill:#4ade80;stroke:#15803d}
/* sim comments */
.sh svg.cmov{pointer-events:none}.cmov *{pointer-events:none}body.cmMode .sh svg.cmov{pointer-events:all;cursor:crosshair}
button.cm{background:#334155}button.cm.on{background:#f59e0b;color:#111}button.cm.nina{background:#7c3aed;font-weight:bold}#cmMsg{font-size:13px;color:#fde68a}
#cmPanel{display:none;position:fixed;right:8px;top:52px;z-index:9;width:min(380px,94vw);max-height:75vh;overflow:auto;background:#fffbeb;color:#111;border:2px solid #b45309;border-radius:10px;padding:8px 10px;box-shadow:0 6px 24px #0008}
body.cmOpen #cmPanel{display:block}#cmPanel h3{margin:2px 0 8px;font-size:15px;color:#b45309;display:flex;justify-content:space-between}#cmPanel h3 button{background:#b45309;padding:2px 8px}
#cmList{list-style:none;margin:0;padding:0}#cmList li{display:flex;gap:8px;align-items:flex-start;padding:6px 0;border-bottom:1px solid #f3d9a4}#cmList li.none{color:#64748b}
#cmList a{color:#1d4ed8}button.tick{background:#16a34a;padding:3px 10px;font-weight:bold;flex:none}.hint{font-size:12px;color:#64748b;margin:6px 0 0}

.lamp.o.on{fill:#fb923c;fill-opacity:.95;stroke:#c2410c;stroke-width:5;filter:url(#glow1)}
.iog{pointer-events:none}.iog.forced{fill:#f59e0b;fill-opacity:.25;stroke:#ea580c;stroke-width:8;stroke-dasharray:22 12}
.iot{fill:transparent;cursor:pointer;pointer-events:all}.iot:hover{fill:#f59e0b55}.iot.forced{fill:#f97316;fill-opacity:.75;stroke:#c2410c;stroke-width:6}

/* SIM LOC/AUTO header switch + forcing disabled in LOCAL */
#selsw{display:inline-flex;align-items:center;border:1px solid #475569;border-radius:8px;overflow:hidden;background:#1f2937}#selsw b{padding:0 8px;font-size:13px}
#selsw button{border-radius:0;background:#334155;color:#cbd5e1;padding:5px 12px}#selsw button.on[data-sel=LOCAL]{background:#2563eb;color:#fff;font-weight:bold}#selsw button.on[data-sel=AUTO]{background:#16a34a;color:#fff;font-weight:bold}
.iot.dis{cursor:not-allowed;fill:#64748b;fill-opacity:.35}.iot.dis:hover{fill:#64748b;fill-opacity:.35}
/* Ray 15 Oct 2026: triangles SOLID BLACK in AUTO (forcing available), grey in LOCAL; forced stays orange */
.iot:not(.dis):not(.forced){fill:#111;fill-opacity:1}.iot:not(.dis):not(.forced):hover{fill:#f59e0b}

/* Ray 15 Oct 2026: header E-STOP (red mushroom), same state as the drawn E-STOP */
#estopbtn{display:inline-flex;align-items:center;gap:6px;background:#facc15;color:#111;font-weight:bold;border:2px solid #a16207;border-radius:8px;padding:3px 10px 3px 4px}
#estopbtn i{display:inline-block;width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fca5a5,#dc2626 55%,#7f1d1d);box-shadow:0 3px 0 #450a0a,0 0 0 2px #7f1d1d;transform:translateY(-2px)}
#estopbtn.pressed{background:#dc2626;color:#fff;border-color:#7f1d1d;animation:esb 1s steps(2) infinite}
#estopbtn.pressed i{transform:translateY(1px);box-shadow:0 0 0 2px #fff,inset 0 2px 4px #450a0a}
@keyframes esb{50%{background:#991b1b}}
/* 15 Oct 2026: draggable comment bubbles (any mode) + END USER (blue) */
.sh svg.cmov .cbub .cbody,.sh svg.cmov .cbub .cbody *{pointer-events:all;cursor:grab;touch-action:none}
button.eu{background:#e5e7eb;color:#1565c0;padding:3px 6px;font-size:11px;font-weight:bold;flex:none;border:1px solid #1565c0}button.eu.on{background:#1565c0;color:#fff}
#cmList li.hl{background:#fde68a}

/* 🔗 BRIDGE (16 Oct 2026) – sim only, hidden in print */
#brbtn{background:#facc15;color:#111;font-weight:bold;border:2px solid #a16207}
#bralarm{background:#dc2626;color:#fff;font-weight:bold;padding:4px 10px;border-radius:6px;animation:esb 1s steps(2) infinite}
.bridge .brhit{stroke:transparent;stroke-linecap:round;cursor:move;pointer-events:stroke;touch-action:none}
.bridge .brw{stroke:#713f12;stroke-linecap:round;pointer-events:none}.bridge .brw2{stroke:#facc15;stroke-linecap:round;pointer-events:none}
.bridge .brclip{cursor:grab;touch-action:none}.brjaw{fill:#facc15;stroke:#111;stroke-width:4}.brdot{fill:#111}.brclip.snap .brdot{fill:#16a34a}
.brcliphit{fill:transparent;pointer-events:all}
.brlbl{font-family:Helvetica,Arial,sans-serif;font-weight:bold;fill:#111;stroke:#fff;stroke-width:8px;paint-order:stroke;pointer-events:none}
.bridge.short .brw2,.bridge.short .brjaw{stroke:#dc2626;fill:#ef4444}.bridge.short .brw2{stroke:#ef4444}.bridge.short .brlbl{fill:#dc2626}
#brMenu{display:none;position:fixed;z-index:20;background:#fffbeb;color:#111;border:2px solid #a16207;border-radius:8px;padding:8px;box-shadow:0 6px 20px #0008}
#brMenu .brt{font-weight:bold;margin-bottom:6px}#brMenu button{margin-right:6px}#brMenu .brcx{background:#475569}
@media print{.bridges,#brMenu,#brbtn,#bralarm{display:none!important}}

#selsw button.on[data-sel=OFF]{background:#64748b;color:#fff;font-weight:bold}

/* Rail-colour glow (Ray 15 Oct 2026): 204 green, 205 LOCAL orange, 206 AUTO yellow – wires, contacts, coils, PLC points */
.ct.live.r204{stroke:#22c55e}.ct.live.r205{stroke:#f97316}.ct.live.r206{stroke:#eab308}
/* coils: OUTSIDE rectangle only glows (no fill; KM1 inner rectangle stays unlit) */
.gcoil.on{fill:none;stroke:#22c55e;stroke-width:9;stroke-opacity:.95;filter:url(#glow1)}
.gcoil.on.r204{stroke:#22c55e}.gcoil.on.r205{stroke:#f97316}.gcoil.on.r206{stroke:#eab308}
.iog.on.r204{fill:#22c55e;stroke:#16a34a}.iog.on.r205{fill:#f97316;stroke:#ea580c}.iog.on.r206{fill:#eab308;stroke:#ca8a04}
/* motor animation (presentation only) */
.motor{display:none;pointer-events:none}.motor.on{display:inline}
.motor .rotor{transform-box:view-box;transform-origin:3300px 1460px;animation:mspin .24s linear infinite}
.mspoke{stroke:#15803d;stroke-width:8;stroke-linecap:round}.mhub{fill:#15803d}
.mphase{font:bold 34px Helvetica,Arial,sans-serif;fill:#14532d}.mhz{font:bold 30px Helvetica,Arial,sans-serif;fill:#14532d}
@keyframes mspin{to{transform:rotate(360deg)}}
