:root{
  --bg:#e9edf3;--panel:#f7f9fc;--panel2:#eef2f7;--white:#fff;--ink:#152033;--muted:#68758a;
  --line:#cbd4df;--line2:#dde4ec;--navy:#17243a;--navy2:#22324d;--blue:#2f6fed;--blue2:#eaf2ff;
  --green:#1f9d68;--green-bg:#e8f7f0;--orange:#d97706;--orange-bg:#fff3e6;--purple:#7c3aed;--purple-bg:#f3edff;
  --teal:#0f8c83;--teal-bg:#e8f8f6;--pink:#c2417a;--pink-bg:#fff0f6;--red:#c83c4d;--red-bg:#fdecef;
  --amber:#b7791f;--amber-bg:#fff7df;--shadow:0 10px 28px rgba(18,32,54,.12);
  --logic-cell:82px;--action-cell:176px;--cell-h:58px;--row-head:74px;--rail-w:20px;
  --zoom:1;
}
*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--bg);overflow:hidden;font-size:13px}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}
.ide-shell{height:100vh;display:grid;grid-template-rows:48px 28px 58px 66px minmax(0,1fr) 178px 26px;background:var(--bg)}
.titlebar{display:flex;align-items:center;background:linear-gradient(90deg,#122036,#1a2a46);color:#fff;border-bottom:1px solid #0d1728;padding:0 14px;gap:11px;min-width:0}
.brand-mark{width:30px;height:30px;border-radius:7px;background:linear-gradient(135deg,#4f8cff,#2f6fed 56%,#244eac);box-shadow:inset 0 0 0 1px #ffffff33,0 3px 10px #0005;display:grid;place-items:center;font-weight:900;font-size:16px;flex:0 0 auto}.brand-mark span{transform:skew(-7deg)}
.brand-copy{display:flex;flex-direction:column;line-height:1.08;min-width:172px}.brand-copy b{font-size:14px;letter-spacing:.2px}.brand-copy small{font-size:10px;color:#afbdd4;margin-top:3px}
.document-title{height:30px;display:flex;align-items:center;gap:7px;margin-left:20px;color:#dce7f8;min-width:0}.document-title input{width:190px;max-width:28vw;background:transparent;border:1px solid transparent;border-radius:4px;color:#fff;font-weight:600;padding:4px 6px}.document-title input:hover,.document-title input:focus{border-color:#ffffff30;background:#ffffff0d;outline:none}.doc-chip{font:700 10px/1 Consolas,monospace;padding:5px 6px;border-radius:4px;background:#2b4268;color:#cfe0ff}.doc-sep{color:#7789a5}.dirty-mark{color:#f4b740;font-size:9px;visibility:hidden}.dirty-mark.on{visibility:visible}
.target-chip{margin-left:auto;display:flex;align-items:center;gap:8px;border:1px solid #ffffff22;background:#ffffff0b;padding:6px 10px;border-radius:7px;min-width:160px}.target-lamp{width:8px;height:8px;border-radius:50%;background:#8090a7;box-shadow:0 0 0 3px #ffffff10}.target-chip>div{display:flex;flex-direction:column;line-height:1.1}.target-chip b{font-size:12px}.target-chip small{font-size:9px;color:#adbad0;margin-top:2px}
.menubar{display:flex;align-items:center;background:#f6f8fb;border-bottom:1px solid var(--line);padding:0 8px;gap:1px}.menu-trigger{height:27px;border:0;background:transparent;padding:0 10px;font-size:12px}.menu-trigger:hover,.menu-trigger.open{background:#e5ebf4}.menu-spacer{flex:1}.menu-context{font-size:10px;color:var(--muted);padding-right:8px}
.toolbar-strip{display:flex;align-items:center;background:#fff;border-bottom:1px solid var(--line);padding:5px 8px;gap:6px;min-width:0}.tool-cluster{display:flex;align-items:stretch;gap:2px}.toolbar-divider{width:1px;height:35px;background:var(--line2);margin:0 4px;flex:0 0 auto}.toolbar-divider.tall{height:44px}.toolbar-fill{flex:1;min-width:4px}
.icon-button{height:47px;min-width:51px;border:1px solid transparent;border-radius:5px;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:3px 6px}.icon-button:hover{background:#f1f5fa;border-color:#dce3ec}.icon-button:disabled{opacity:.38;cursor:not-allowed}.icon-button small{font-size:9px;color:#536176}.icon-button.build{background:#eef5ff}.icon-button.run small{color:#168456}.icon-button.stop small{color:#b33c4b}
.tb-icon{width:20px;height:20px;position:relative;display:block}.new-file:before{content:"";position:absolute;inset:2px 4px 2px 5px;border:1.6px solid #607087;border-radius:1px;background:#fff}.new-file:after{content:"+";position:absolute;right:0;bottom:-1px;width:11px;height:11px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:#fff;font:bold 10px/1 Arial}.open-file:before{content:"";position:absolute;left:2px;right:2px;bottom:3px;height:11px;border:1.6px solid #607087;border-radius:2px;background:#fff}.open-file:after{content:"";position:absolute;left:3px;top:3px;width:9px;height:5px;border:1.6px solid #607087;border-bottom:0;border-radius:2px 2px 0 0}.save-file:before{content:"";position:absolute;inset:2px;border:1.6px solid #607087;border-radius:2px}.save-file:after{content:"";position:absolute;left:6px;right:6px;bottom:5px;height:6px;border:1.4px solid #607087;background:#fff}.build-icon:before{content:"✓";position:absolute;inset:1px;display:grid;place-items:center;border-radius:50%;background:#2f6fed;color:#fff;font:bold 14px Arial}.write-icon:before{content:"↓";position:absolute;inset:1px;display:grid;place-items:center;color:#2f6fed;font:bold 20px Arial}.read-icon:before{content:"↑";position:absolute;inset:1px;display:grid;place-items:center;color:#4b6a96;font:bold 20px Arial}.connect-icon:before{content:"↯";position:absolute;inset:1px;display:grid;place-items:center;color:#54657b;font:bold 20px Arial}.run-icon:before{content:"▶";position:absolute;inset:1px;display:grid;place-items:center;color:#1b9b68;font:bold 17px Arial}.stop-icon:before{content:"■";position:absolute;inset:1px;display:grid;place-items:center;color:#c74958;font:bold 16px Arial}
.small-button{width:32px;height:32px;border:1px solid #d8e0e9;border-radius:5px;background:#f8fafc;font-size:20px;color:#526176}.small-button:hover{background:#edf2f8}
.build-meter{width:150px;display:flex;flex-direction:column;gap:4px;margin-right:6px}.build-meter-top{display:flex;justify-content:space-between;font-size:9px;color:#647287}.build-meter-top b{font-size:9px}.meter-track{height:5px;background:#e4eaf1;border-radius:5px;overflow:hidden}.meter-track i{display:block;height:100%;width:0;background:var(--blue);border-radius:5px;transition:width .18s}.online-state{height:42px;min-width:145px;border-left:1px solid var(--line2);padding-left:10px;display:flex;align-items:center;gap:8px}.online-lamp{width:9px;height:9px;border-radius:50%;background:#9aa7b7;box-shadow:0 0 0 3px #eef2f6}.online-lamp.on{background:#24a86f;box-shadow:0 0 0 3px #dff5eb}.online-state div{display:flex;flex-direction:column}.online-state b{font-size:11px}.online-state small{font-size:9px;color:var(--muted)}
.component-toolbar{padding:7px 10px;background:linear-gradient(#fff,#f8fafc);gap:8px}.palette-caption{width:128px;display:flex;flex-direction:column;line-height:1.14}.palette-caption b{font-size:10px;color:#33445d;letter-spacing:.55px}.palette-caption small{font-size:8.5px;color:#7b8899;margin-top:2px}.component-menu{height:50px;min-width:164px;border:1px solid #d6dee8;border-radius:7px;background:#fff;display:flex;align-items:center;gap:9px;padding:5px 9px;text-align:left;box-shadow:0 1px 2px #182c4810}.component-menu:hover,.component-menu.open{border-color:#9fb6d4;box-shadow:0 3px 12px #24466f16;background:#fbfdff}.component-menu>div{display:flex;flex-direction:column;min-width:0}.component-menu b{font-size:11px;letter-spacing:.2px}.component-menu small{font-size:9px;color:#6e7b8e;margin-top:2px;white-space:nowrap}.component-menu>i{font-style:normal;margin-left:auto;color:#8b98aa}.component-icon{width:36px;height:34px;border-radius:6px;display:grid;place-items:center;font:700 12px Consolas,monospace;border:1px solid}.component-menu.logic .component-icon{background:var(--blue2);border-color:#b9d0fa;color:#245ab7}.component-menu.device .component-icon{background:var(--orange-bg);border-color:#f0c998;color:#ae6209}.component-menu.wire .component-icon{background:#edf1f5;border-color:#cfd7e1;color:#3f4d60;font-size:20px}.component-menu.instruction .component-icon{background:var(--purple-bg);border-color:#d2c0fa;color:#6930c3}
.mode-tool{height:46px;border:1px solid transparent;background:transparent;border-radius:6px;display:flex;align-items:center;gap:7px;padding:4px 9px}.mode-tool:hover{background:#f1f5fa}.mode-tool.active{background:#eaf2ff;border-color:#b9d0fa}.mode-tool>span{font-size:18px;color:#47617f}.mode-tool>div{display:flex;flex-direction:column;text-align:left}.mode-tool b{font-size:10px}.mode-tool small{font-size:8.5px;color:#7b8798}.draft-summary{min-width:190px;height:44px;border-left:1px solid var(--line2);padding-left:11px;display:flex;align-items:center;gap:8px}.draft-dot{width:9px;height:9px;border-radius:50%;background:#8290a2}.draft-dot.warn{background:#e5a72f}.draft-dot.good{background:#22a06b}.draft-dot.bad{background:#d34a5b}.draft-summary>div{display:flex;flex-direction:column}.draft-summary b{font-size:10px}.draft-summary small{font-size:8.5px;color:#728096;margin-top:2px}
.palette-popover{position:fixed;z-index:60;min-width:300px;max-width:520px;background:#fff;border:1px solid #bec9d6;border-radius:9px;box-shadow:var(--shadow);overflow:hidden}.palette-popover.hidden{display:none}.popover-head{padding:10px 12px;border-bottom:1px solid var(--line2);background:#f7f9fc;display:flex;align-items:center;justify-content:space-between}.popover-head b{font-size:11px}.popover-head small{font-size:9px;color:var(--muted)}.popover-body{padding:10px;display:grid;grid-template-columns:repeat(3,minmax(90px,1fr));gap:7px;max-height:360px;overflow:auto}.palette-tile{min-height:62px;border:1px solid #d8e0e9;border-radius:7px;background:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:7px;gap:5px;user-select:none}.palette-tile:hover{border-color:#98afd0;box-shadow:0 3px 10px #1e3a5f12;background:#fbfdff}.palette-tile[draggable="true"]{cursor:grab}.palette-tile:active{cursor:grabbing}.palette-tile .tile-symbol{min-height:23px;display:grid;place-items:center;font:700 17px Consolas,monospace}.palette-tile b{font-size:10px}.palette-tile small{font-size:8.5px;color:#788698}.palette-tile.logic{background:#f7fbff}.palette-tile.logic .tile-symbol{color:#2b61bb}.palette-tile.device{background:#fffaf5}.palette-tile.device .tile-symbol{color:#b96a12}.palette-tile.wire{background:#fafbfc}.palette-tile.wire .tile-symbol{font-size:24px;color:#354459}.palette-tile.instruction{background:#fbf9ff}.palette-tile.instruction .tile-symbol{color:#6f36c7}
.app-menu{position:fixed;z-index:70;background:#fff;border:1px solid #bac5d2;box-shadow:var(--shadow);border-radius:5px;min-width:210px;padding:4px}.app-menu.hidden{display:none}.app-menu button{display:flex;width:100%;justify-content:space-between;border:0;background:transparent;padding:7px 9px;text-align:left;border-radius:3px;font-size:11px}.app-menu button:hover{background:#edf3fb}.app-menu .sep{height:1px;background:#e4e8ee;margin:4px 2px}.app-menu kbd{font-size:9px;color:#7d8898;background:none;border:0;box-shadow:none}
.workspace{min-height:0;display:grid;grid-template-columns:216px minmax(0,1fr);background:var(--bg)}.project-dock{min-width:0;background:#f6f8fb;border-right:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden}.project-dock.collapsed{display:none}.dock-header{height:29px;background:#e9eef5;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 8px;font-size:11px;font-weight:700;color:#3f5068}.dock-header button{border:0;background:transparent;width:23px;height:23px;color:#66758a}.project-tree{padding:6px 5px 8px}.tree-row{height:28px;display:flex;align-items:center;gap:6px;border-radius:4px;padding:0 5px;color:#34435a;font-size:11px}.tree-row:hover{background:#edf2f7}.tree-row.selected{background:#dfeafb;color:#1f4c91}.tree-row.level1{padding-left:15px}.tree-row.level2{padding-left:31px}.tree-row small{margin-left:auto;font-size:8.5px;color:#8490a1}.twisty{width:10px;color:#6f7c8e}.tree-badge{width:19px;height:18px;border-radius:3px;display:grid;place-items:center;font:700 8px Consolas,monospace;border:1px solid #ccd5e0;background:#fff;color:#56657a}.tree-badge.project{background:#eaf2ff;color:#2c61b7;border-color:#c4d8f6}.tree-badge.folder{position:relative;background:#fff7e8;border-color:#efd8ab}.tree-badge.folder:after{content:"";width:9px;height:5px;border:1.5px solid #b18435;border-top:0}.tree-badge.ladder{background:#edf7f3;color:#1a8258;border-color:#bedfce}.tree-badge.watch{background:#eef5ff;color:#2d66bd}.tree-badge.comments{background:#fff6e9;color:#a7670b}.tree-badge.list{background:#f4efff;color:#7341bf}.tree-badge.info{background:#eef1f5;color:#4f5d70}.dock-section-title{height:28px;display:flex;align-items:center;padding:0 9px;border-top:1px solid var(--line);border-bottom:1px solid var(--line2);background:#edf1f6;font-size:9.5px;font-weight:700;color:#59677b;text-transform:uppercase;letter-spacing:.45px}.target-summary{padding:8px 10px;display:grid;gap:5px}.target-summary div{display:flex;justify-content:space-between;gap:6px;font-size:9.5px}.target-summary span{color:#7a8797}.target-summary b{font-weight:600;color:#3d4b5e;text-align:right}.selection-inspector{padding:8px 9px;min-height:96px}.selection-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#8793a2;height:80px}.selection-empty>span{font-size:21px;color:#a5afbc}.selection-empty b{font-size:10px;color:#627085;margin-top:2px}.selection-empty small{font-size:8.5px;margin-top:2px}.inspect-card{border:1px solid #d8e0e9;background:#fff;border-radius:6px;padding:8px}.inspect-card .inspect-top{display:flex;align-items:center;justify-content:space-between}.inspect-card .inspect-top b{font-size:11px}.inspect-card .inspect-kind{font-size:8.5px;padding:2px 5px;border-radius:9px;background:#edf2f7;color:#617084}.inspect-card dl{display:grid;grid-template-columns:54px 1fr;margin:7px 0 0;gap:3px 5px;font-size:9px}.inspect-card dt{color:#8994a3}.inspect-card dd{margin:0;font-weight:600;overflow:hidden;text-overflow:ellipsis}.inspect-actions{display:flex;gap:5px;margin-top:8px}.inspect-actions button{flex:1;border:1px solid #cfd7e1;background:#f8fafc;border-radius:4px;font-size:9px;padding:5px}.inspect-actions button:hover{background:#edf3fb}.legend-grid{padding:8px;display:grid;grid-template-columns:repeat(2,1fr);gap:5px}.legend-item{border-radius:4px;padding:4px 5px;font:700 8.5px Consolas,monospace;border:1px solid;text-align:center}.legend-item.in{background:var(--blue2);border-color:#c1d7fb;color:#255cb9}.legend-item.y{background:var(--orange-bg);border-color:#f2cf9e;color:#a85c07}.legend-item.m{background:var(--purple-bg);border-color:#d6c5f8;color:#7038bd}.legend-item.t{background:var(--teal-bg);border-color:#bce2dd;color:#0c7d76}.legend-item.c{background:var(--pink-bg);border-color:#efc1d6;color:#b13b70}.legend-item.instr{background:#f1edff;border-color:#d5c7f7;color:#6940b2}
.editor-pane{min-width:0;min-height:0;display:grid;grid-template-rows:34px 34px minmax(0,1fr);background:#dfe5ed}.document-tabs{display:flex;align-items:end;background:#dfe5ed;border-bottom:1px solid #bfc8d4;padding-left:5px}.document-tab{height:30px;border:1px solid #bfc8d4;border-bottom-color:#fff;border-radius:5px 5px 0 0;background:#fff;display:flex;align-items:center;gap:7px;padding:0 10px;font-size:10px;margin-bottom:-1px}.document-tab small{font-size:8.5px;color:#6f7d90}.document-tab i{font-style:normal;color:#9aa5b3;margin-left:5px}.tab-ld{font:700 9px Consolas;background:#edf5ff;color:#2b63ba;border:1px solid #c1d6f7;padding:3px;border-radius:3px}.doc-fill{flex:1}.editor-action,.zoom-button{height:26px;border:1px solid #c7d0db;background:#f7f9fb;border-radius:4px;font-size:9.5px;margin:0 3px 3px 0;padding:0 8px}.editor-action:hover,.zoom-button:hover{background:#eef3f8}.zoom-button{width:27px;padding:0;font-size:15px}.editor-divider{height:17px;width:1px;background:#bcc6d1;margin:0 6px 7px 3px}.document-tabs>#zoomLabel{font-size:9px;width:36px;text-align:center;margin-bottom:8px;color:#56657a}
.matrix-toolbar{display:flex;align-items:center;gap:12px;background:#f8fafc;border-bottom:1px solid var(--line);padding:0 8px}.matrix-state{display:flex;align-items:center;gap:6px;font-size:9.5px}.matrix-state-dot{width:7px;height:7px;border-radius:50%;background:#2f6fed}.matrix-state>span:last-child{color:#748296;border-left:1px solid #d7dee7;padding-left:7px}.matrix-help{font-size:8.5px;color:#6e7b8e}.matrix-help kbd{font:700 8px/1 "Segoe UI";border:1px solid #c9d1dc;background:#fff;box-shadow:0 1px 0 #d3d9e1;padding:2px 4px;border-radius:3px;color:#546276}.matrix-fill{flex:1}.build-inline{height:25px;border:1px solid #a9bfde;background:#edf4ff;color:#24569e;border-radius:4px;font-size:9.5px;font-weight:700;padding:0 10px}.build-inline:hover{background:#e2edff}
.matrix-viewport{min-height:0;min-width:0;overflow:auto;background:#f2f5f9;position:relative}.matrix-sheet{--cw:calc(var(--logic-cell)*var(--zoom));--aw:calc(var(--action-cell)*var(--zoom));--rh:calc(var(--cell-h)*var(--zoom));display:grid;grid-template-columns:var(--row-head) var(--rail-w) repeat(12,var(--cw)) var(--aw) var(--rail-w);grid-auto-rows:var(--rh);width:max-content;min-width:100%;padding-bottom:90px;background:#fff;position:relative}.matrix-sheet>.column-header{position:sticky;top:0;z-index:8;height:30px;align-self:start;background:#eef2f7;border-right:1px solid #d4dce6;border-bottom:1px solid #bfc9d5;display:flex;align-items:center;justify-content:center;font:600 8.5px "Segoe UI";color:#647388}.matrix-sheet>.column-header.logic{font-family:Consolas,monospace}.matrix-sheet>.column-header.output{background:#f4f0fb;color:#6d4fa6}.matrix-sheet>.row-header{background:#f2f5f8;border-right:1px solid #cbd4df;border-bottom:1px solid #e2e7ed;display:flex;align-items:center;justify-content:space-between;padding:0 6px 0 7px;color:#788596;position:relative}.row-number{font:600 9px Consolas,monospace}.stl-pill{border:1px solid transparent;background:transparent;color:#9aa5b3;font:700 8px Consolas,monospace;border-radius:8px;padding:2px 4px;min-width:25px}.stl-pill:hover{border-color:#c8d1dc;background:#fff;color:#637084}.stl-pill.active{background:#eae3ff;border-color:#c9b8f4;color:#6c3dc2}.rail-cell{position:relative;background:#fbfcfd;border-bottom:1px solid #eef1f5}.rail-cell:after{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:#334154;transform:translateX(-50%)}.rail-cell.left.connected:before{content:"";position:absolute;left:50%;right:0;top:50%;height:2px;background:#334154;transform:translateY(-50%)}.rail-cell.right.connected:before{content:"";position:absolute;left:0;right:50%;top:50%;height:2px;background:#334154;transform:translateY(-50%)}
.matrix-cell{position:relative;background:#fff;border-right:1px solid #e4e9ef;border-bottom:1px solid #e4e9ef;outline:none;user-select:none;min-width:0;min-height:0}.matrix-cell.logic:nth-of-type(even){background:#fefefe}.matrix-cell.output-zone{background:#fcfbfe}.matrix-cell.empty:hover{background:#f5f9ff}.matrix-cell.selected{z-index:4;box-shadow:inset 0 0 0 2px #2f6fed,0 0 0 1px #fff}.matrix-cell.drop-ok{background:#eaf7f1!important;box-shadow:inset 0 0 0 2px #2c9a6b}.matrix-cell.drop-bad{background:#fdeef0!important;box-shadow:inset 0 0 0 2px #d34a5b}.matrix-cell.issue-warning:after,.matrix-cell.issue-error:after{content:"";position:absolute;right:3px;top:3px;width:7px;height:7px;border-radius:50%;z-index:5}.matrix-cell.issue-warning:after{background:#e6a62d;box-shadow:0 0 0 2px #fff}.matrix-cell.issue-error:after{background:#d34a5b;box-shadow:0 0 0 2px #fff}.matrix-cell svg{width:100%;height:100%;display:block;overflow:visible}.wire-stroke{stroke:#334154;stroke-width:2;fill:none;vector-effect:non-scaling-stroke}.wire-stroke.active{stroke:#24a66f;stroke-width:3}.symbol-stroke{stroke:#29384d;stroke-width:2.2;fill:none;vector-effect:non-scaling-stroke}.contact-device{font:700 11px Consolas,monospace;text-anchor:middle}.contact-caption{font:600 6.8px "Segoe UI";fill:#7f8a99;text-anchor:middle}.cell-label-in{fill:#2560b9}.cell-label-y{fill:#a85c07}.cell-label-m{fill:#6f39b9}.cell-label-s{fill:#4359a7}.cell-label-t{fill:#0e8178}.cell-label-c{fill:#b43f73}.cell-label-special{fill:#5e6c80}.compare-box{fill:#edf4ff;stroke:#7fa5dc;stroke-width:1.2}.compare-main{font:700 8px Consolas,monospace;fill:#255aab;text-anchor:middle}.compare-sub{font:600 6.5px Consolas,monospace;fill:#607087;text-anchor:middle}.device-box{stroke-width:1.2}.device-box.y{fill:#fff2e4;stroke:#e4a653}.device-box.m{fill:#f3ecff;stroke:#ad8bdf}.device-box.s{fill:#eef1ff;stroke:#8795cf}.device-box.t{fill:#e7f8f5;stroke:#6eb9b1}.device-box.c{fill:#fff0f6;stroke:#dc8eb2}.device-main{font:800 9px Consolas,monospace;text-anchor:middle}.device-sub{font:600 6.5px "Segoe UI";fill:#647287;text-anchor:middle}.instruction-box{fill:#f1edff;stroke:#9f84d8;stroke-width:1.2}.instruction-op{font:800 9px Consolas,monospace;fill:#6032ad;text-anchor:middle}.instruction-args{font:600 6.3px Consolas,monospace;fill:#5e6675;text-anchor:middle}.empty-slot-hint{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;color:#a6b1c0;font:700 8px Consolas,monospace}.matrix-cell.empty:hover .empty-slot-hint{opacity:1}.matrix-cell.armed-target.empty:hover{background:#eef5ff}.matrix-cell.output-zone.empty .empty-slot-hint:after{content:"OUT"}.matrix-cell.logic.empty .empty-slot-hint:after{content:"+"}
.end-row{grid-column:1/-1;height:50px;background:#fbfcfd;border-top:1px solid #ccd5e0;border-bottom:1px solid #dfe5ec;display:flex;align-items:center;position:relative}.end-row:before,.end-row:after{content:"";height:2px;background:#334154;position:absolute;top:50%}.end-row:before{left:94px;right:58%}.end-row:after{left:58%;right:10px}.end-chip{position:absolute;left:58%;transform:translateX(-50%);border:2px solid #334154;background:#fff;border-radius:3px;font:800 11px Consolas,monospace;padding:6px 14px;letter-spacing:.5px}.end-step{position:absolute;left:8px;font:700 9px Consolas,monospace;color:#7c8898}
.bottom-dock{background:#fff;border-top:1px solid #bfc9d5;display:grid;grid-template-rows:31px minmax(0,1fr);min-height:0}.bottom-dock.collapsed{grid-template-rows:31px 0}.bottom-tabs{display:flex;align-items:end;background:#e9eef4;border-bottom:1px solid #c9d2dd;padding-left:4px}.bottom-tab{height:27px;border:1px solid transparent;border-bottom:0;background:transparent;padding:0 10px;font-size:9.5px;color:#57667a}.bottom-tab.active{background:#fff;border-color:#c9d2dd;color:#26364e;font-weight:700}.tab-count{display:inline-grid;place-items:center;min-width:16px;height:16px;border-radius:8px;background:#e6ecf3;color:#617084;font-size:8px;margin-left:3px}.bottom-tab.active .tab-count.bad{background:#f7dfe3;color:#b83e4c}.bottom-fill{flex:1}.dock-close{width:30px;height:28px;border:0;background:transparent;color:#66758a}.bottom-body{display:none;min-height:0;overflow:auto;background:#fff}.bottom-body.active{display:block}.bottom-dock.collapsed .bottom-body{display:none!important}.problem-summary{height:42px;display:flex;align-items:center;gap:9px;padding:0 11px;border-bottom:1px solid #edf0f4}.problem-state{font-size:11px}.problem-state.neutral{color:#8794a4}.problem-state.good{color:#1f9d68}.problem-state.warn{color:#d29520}.problem-state.bad{color:#c83c4d}.problem-summary>div{display:flex;flex-direction:column}.problem-summary b{font-size:10px}.problem-summary small{font-size:8.5px;color:#778496;margin-top:2px}.problem-head,.problem-row{display:grid;grid-template-columns:90px 110px 1fr;align-items:center;min-height:26px;padding:0 9px;border-bottom:1px solid #eef1f4;font-size:9px}.problem-head{background:#f5f7fa;color:#66758a;font-weight:700;text-transform:uppercase;letter-spacing:.3px}.problem-row:hover{background:#f7faff}.problem-row .sev{font-weight:700}.problem-row.error .sev{color:#b83848}.problem-row.warning .sev{color:#a06b16}.problem-row.draft .sev{color:#807143}.problem-row .loc{font-family:Consolas,monospace;color:#56677e}.watch-toolbar{height:35px;display:flex;align-items:center;gap:8px;border-bottom:1px solid #e6ebf1;background:#f8fafc;padding:0 8px;font-size:9px;color:#66758a}.watch-toolbar button{height:24px;border:1px solid #cbd4df;background:#fff;border-radius:4px;font-size:9px}.data-table{width:100%;border-collapse:collapse;font-size:9px}.data-table th{background:#f4f7fa;color:#647287;font-weight:700;text-align:left;padding:5px 8px;border-right:1px solid #e2e7ed;border-bottom:1px solid #d7dee7}.data-table td{padding:4px 8px;border-right:1px solid #eef1f5;border-bottom:1px solid #eef1f5}.data-table input{height:22px;border:1px solid #d1d9e3;border-radius:3px;padding:2px 5px;width:100%}.data-table button{font-size:8.5px;border:1px solid #cfd7e1;background:#fff;border-radius:3px;padding:3px 6px}.code-panel pre{margin:0;padding:10px 12px;font:10px/1.55 Consolas,"SFMono-Regular",monospace;color:#34445a;white-space:pre}.target-reference{padding:12px;display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:10px}.ref-card{border:1px solid #d9e0e9;border-radius:6px;background:#fbfcfe;padding:10px}.ref-card h3{margin:0 0 7px;font-size:10px;color:#42536a}.ref-card div{font-size:8.8px;color:#66758a;margin:3px 0}.ref-card code{font:700 8.5px Consolas;color:#4d5f76}
.statusbar{display:flex;align-items:center;background:#26354c;color:#dfe7f2;font-size:8.5px;min-width:0}.statusbar>div{height:100%;display:flex;align-items:center;gap:5px;padding:0 9px;border-right:1px solid #ffffff14}.statusbar span{color:#9eadc2}.statusbar b{font-size:8.5px}.status-product span{width:7px;height:7px;border-radius:50%;background:#4b8bf4}.status-fill{flex:1}.status-draft{color:#f3c86c}
.modal-backdrop{position:fixed;inset:0;z-index:100;background:#14233a66;backdrop-filter:blur(1.5px);display:grid;place-items:center;padding:24px}.modal-backdrop.hidden{display:none}.modal-card{width:min(720px,96vw);max-height:88vh;background:#fff;border:1px solid #aeb9c8;border-radius:10px;box-shadow:0 24px 70px #0e1b2d55;display:grid;grid-template-rows:52px minmax(0,1fr) 50px;overflow:hidden}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid #dce2ea;background:#f7f9fc}.modal-header>div{display:flex;align-items:center;gap:9px}.modal-header>div>div{display:flex;flex-direction:column}.modal-header b{font-size:12px}.modal-header small{font-size:9px;color:#758296;margin-top:2px}.modal-accent{width:8px;height:28px;border-radius:4px;background:#2f6fed}.modal-header button{border:0;background:transparent;font-size:20px;color:#738095}.modal-body{overflow:auto;padding:16px}.modal-footer{border-top:1px solid #dde3eb;background:#f8fafc;display:flex;align-items:center;justify-content:space-between;padding:0 12px}.modal-footer>span{font-size:8.5px;color:#778597}.modal-footer>div{display:flex;gap:7px}.modal-footer button{height:29px;min-width:78px;border:1px solid #c8d1dc;background:#fff;border-radius:5px;font-size:10px}.modal-footer button.primary{background:#2f6fed;border-color:#2f6fed;color:#fff;font-weight:700}.modal-footer button.danger{color:#b13d4a;border-color:#e1b1b7}.modal-footer button.hidden{display:none}.form-grid{display:grid;grid-template-columns:150px minmax(0,1fr);gap:11px 12px;align-items:center}.form-grid label{font-size:10px;color:#56667a;font-weight:600}.form-grid input,.form-grid select,.form-grid textarea{width:100%;min-height:32px;border:1px solid #cbd4df;border-radius:5px;padding:5px 8px;background:#fff;outline:none}.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{border-color:#6c97db;box-shadow:0 0 0 2px #2f6fed16}.form-grid textarea{min-height:130px;resize:vertical}.device-type-cards{grid-column:1/-1;display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:3px}.type-card{border:1px solid #d3dbe5;border-radius:7px;background:#fff;min-height:62px;display:flex;align-items:center;gap:8px;padding:8px}.type-card:hover{border-color:#9db2ce}.type-card.active{box-shadow:inset 0 0 0 2px #2f6fed;border-color:#2f6fed}.type-card .big{font:800 17px Consolas,monospace;width:29px;height:29px;border-radius:5px;display:grid;place-items:center}.type-card.y .big{background:var(--orange-bg);color:#b46409}.type-card.m .big{background:var(--purple-bg);color:#7040bd}.type-card.t .big{background:var(--teal-bg);color:#0b8077}.type-card.c .big{background:var(--pink-bg);color:#b33b70}.type-card>div{display:flex;flex-direction:column}.type-card b{font-size:10px}.type-card small{font-size:8.5px;color:#768397;margin-top:2px}.instruction-picker{display:grid;grid-template-columns:245px minmax(0,1fr);gap:12px;min-height:330px}.instruction-list-pane{border:1px solid #d7dee7;border-radius:7px;overflow:hidden;background:#fafbfc;display:grid;grid-template-rows:40px minmax(0,1fr)}.instruction-search{padding:6px;border-bottom:1px solid #e0e5eb}.instruction-search input{width:100%;height:27px;border:1px solid #cbd4df;border-radius:4px;padding:4px 7px;font-size:9px}.instruction-list{overflow:auto;padding:5px}.instruction-category{font-size:8px;text-transform:uppercase;letter-spacing:.55px;color:#8b96a5;font-weight:700;padding:7px 6px 4px}.instruction-choice{width:100%;border:1px solid transparent;background:transparent;border-radius:5px;padding:6px 7px;display:flex;align-items:center;justify-content:space-between;text-align:left}.instruction-choice:hover{background:#f0f4fa}.instruction-choice.active{background:#ece6ff;border-color:#cbbbf0}.instruction-choice b{font:700 9px Consolas,monospace}.instruction-choice small{font-size:8px;color:#7d8998}.instruction-params{border:1px solid #d7dee7;border-radius:7px;padding:13px;background:#fff}.instruction-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#8793a3;text-align:center}.instruction-empty span{font:800 30px Consolas,monospace;color:#c3cad4}.instruction-empty b{font-size:11px;color:#66758a;margin-top:5px}.instruction-empty small{font-size:8.5px;margin-top:3px}.instruction-title{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e5e9ef;padding-bottom:8px;margin-bottom:10px}.instruction-title b{font:800 13px Consolas,monospace;color:#5f34ad}.instruction-title span{font-size:8px;padding:3px 6px;border-radius:9px;background:#f1edff;color:#6e45b5}.param-row{display:grid;grid-template-columns:105px 1fr;gap:8px;align-items:center;margin:8px 0}.param-row label{font-size:9px;color:#627085;font-weight:600}.param-row input,.param-row select{height:29px;border:1px solid #cbd4df;border-radius:4px;padding:4px 7px;font:10px Consolas,monospace}.param-help{margin-top:9px;padding:8px;border-radius:5px;background:#f6f8fb;color:#6f7d90;font-size:8.5px;line-height:1.45}.runtime-preview{grid-column:1/-1;border:1px solid #dce3eb;background:#f7f9fc;border-radius:5px;padding:8px 10px;display:flex;justify-content:space-between;align-items:center}.runtime-preview span{font-size:9px;color:#6d7a8e}.runtime-preview code{font:700 10px Consolas,monospace;color:#3e536e}
.toast{position:fixed;right:16px;bottom:205px;z-index:120;max-width:460px;padding:10px 13px;border-radius:7px;background:#203049;color:#edf4ff;box-shadow:0 10px 30px #101b2e44;border:1px solid #4b6488;font-size:10px}.toast.bad{border-color:#e36a78}.toast.good{border-color:#45b885}
@media(max-width:1450px){:root{--logic-cell:76px;--action-cell:164px}.palette-caption{display:none}.component-menu{min-width:146px}.component-menu small{font-size:8px}.target-summary{padding:6px 8px}.workspace{grid-template-columns:200px minmax(0,1fr)}.brand-copy{min-width:150px}.document-title{margin-left:8px}.online-state{min-width:132px}.build-meter{width:130px}}
@media(max-width:1260px){.component-menu{min-width:132px;padding:4px 7px}.component-menu small{display:none}.component-icon{width:32px}.matrix-help{display:none}.build-meter{display:none}.workspace{grid-template-columns:185px minmax(0,1fr)}.target-chip{min-width:140px}.brand-copy small{display:none}}
/* V1.0 readability pass: intentionally larger than the V0.x prototypes. */
body{font-size:14px}.menubar .menu-trigger{font-size:13px}.menu-context{font-size:11px}.brand-copy b{font-size:15px}.brand-copy small{font-size:11px}.target-chip b{font-size:13px}.target-chip small{font-size:10px}.icon-button small{font-size:10px}.build-meter-top,.build-meter-top b{font-size:10px}.online-state b{font-size:12px}.online-state small{font-size:10px}.component-menu b{font-size:12px}.component-menu small{font-size:10px}.palette-caption b{font-size:11px}.palette-caption small{font-size:9.5px}.mode-tool b{font-size:11px}.mode-tool small{font-size:9px}.draft-summary b{font-size:11px}.draft-summary small{font-size:9.5px}.tree-row{font-size:12px}.tree-row small{font-size:9.5px}.dock-section-title{font-size:10.5px}.target-summary div{font-size:10.5px}.column-header{font-size:9.5px!important}.row-number{font-size:10px}.stl-pill{font-size:9px}.matrix-help{font-size:9.5px}.matrix-state{font-size:10.5px}.document-tab{font-size:11px}.document-tab small{font-size:9.5px}.editor-action{font-size:10.5px}.contact-device{font-size:13px}.contact-caption{font-size:7.5px}.device-main{font-size:11px}.device-sub{font-size:7.5px}.instruction-op{font-size:11px}.instruction-args{font-size:7.5px}.compare-main{font-size:9px}.compare-sub{font-size:7.5px}.bottom-tab{font-size:10.5px}.problem-summary b{font-size:11px}.problem-summary small{font-size:9.5px}.problem-head,.problem-row{font-size:10px}.data-table{font-size:10px}.watch-toolbar{font-size:10px}.statusbar,.statusbar b{font-size:9.5px}.palette-tile b{font-size:11px}.palette-tile small{font-size:9.5px}.popover-head b{font-size:12px}.popover-head small{font-size:10px}.modal-header b{font-size:13px}.modal-header small{font-size:10px}.form-grid label{font-size:11px}.modal-footer button{font-size:11px}.modal-footer>span{font-size:9.5px}.instruction-choice b{font-size:10px}.instruction-choice small{font-size:9px}.param-row label{font-size:10px}.param-row input,.param-row select{font-size:11px}.param-help{font-size:9.5px}
/* Inspector QA fix: never let selection controls be clipped by the next dock section. */
.project-dock{overflow-y:auto;overflow-x:hidden}.dock-header{position:sticky;top:0;z-index:3;flex:0 0 auto}.selection-inspector{min-height:128px;flex:0 0 auto}.legend-grid{padding-bottom:12px}
/* Responsive matrix geometry: keep the full 12-column editing field visible on common laptop widths. */
@media(max-width:1450px) and (min-width:1321px){:root{--logic-cell:75px;--action-cell:150px}}
@media(max-width:1320px){:root{--logic-cell:68px;--action-cell:146px;--row-head:68px;--rail-w:16px}.workspace{grid-template-columns:185px minmax(0,1fr)}.component-menu{min-width:130px}.component-menu small{display:none}.build-meter{display:none}.matrix-sheet>.column-header{font-size:8.5px!important}.contact-device{font-size:12px}.device-main,.instruction-op{font-size:10px}}

/* =========================================================
   BASE PROFESSIONAL GEOMETRY + READABILITY PASS
   One baseline per row, larger engineering typography, stronger visual hierarchy.
   ========================================================= */
:root{
  --cell-h:68px;
  --logic-cell:84px;
  --action-cell:184px;
  --row-head:76px;
  --rail-w:20px;
  --matrix-line:#26384f;
  --matrix-grid:#e2e8f0;
  --matrix-grid-strong:#c9d3df;
}
.ide-shell{grid-template-rows:50px 31px 62px 70px minmax(0,1fr) 164px 28px}
.titlebar{padding:0 16px;gap:12px}.brand-mark{width:32px;height:32px;font-size:17px}.brand-copy{min-width:190px}.brand-copy b{font-size:16px}.brand-copy small{font-size:11.5px}.document-title{font-size:14px}.document-title input{font-size:14px}.target-chip{min-width:174px;padding:7px 11px}.target-chip b{font-size:13.5px}.target-chip small{font-size:10.5px}
.menubar{padding:0 10px}.menubar .menu-trigger{height:30px;font-size:13.5px;padding:0 11px}.menu-context{font-size:11px}
.primary-toolbar{padding:6px 10px;gap:7px;background:linear-gradient(#fff,#f7f9fc)}.icon-button{height:50px;min-width:56px}.icon-button small{font-size:10.5px;font-weight:600}.tb-icon{width:22px;height:22px}.small-button{width:34px;height:34px}.build-meter{width:165px}.online-state{min-width:152px}.online-state b{font-size:12.5px}.online-state small{font-size:10.5px}
.component-toolbar{padding:8px 10px;gap:9px;background:linear-gradient(180deg,#ffffff 0,#f7f9fc 100%);box-shadow:inset 0 -1px 0 #dce3eb}.palette-caption{width:138px}.palette-caption b{font-size:11.5px}.palette-caption small{font-size:10px;line-height:1.2}.component-menu{height:53px;min-width:170px;border-radius:8px;padding:6px 10px;box-shadow:0 1px 3px #16314f0d}.component-menu b{font-size:12.5px}.component-menu small{font-size:10.5px}.component-icon{width:39px;height:37px;font-size:13px;border-radius:7px}.component-menu.logic{border-left:4px solid #3f7ee8}.component-menu.device{border-left:4px solid #e38a26}.component-menu.wire{border-left:4px solid #6f7f93}.component-menu.instruction{border-left:4px solid #8653d6}.component-menu.logic:hover{background:#f5f9ff}.component-menu.device:hover{background:#fff9f2}.component-menu.wire:hover{background:#f8fafc}.component-menu.instruction:hover{background:#faf7ff}.mode-tool{height:49px}.mode-tool b{font-size:11.5px}.mode-tool small{font-size:9.5px}.draft-summary b{font-size:11.5px}.draft-summary small{font-size:10px}
.workspace{grid-template-columns:216px minmax(0,1fr)}.project-dock{background:#f7f9fc}.dock-header{height:31px;font-size:12px;background:#e9eef5}.tree-row{height:30px;font-size:13px}.tree-row.selected{background:linear-gradient(90deg,#dceaff,#edf5ff);box-shadow:inset 3px 0 #2f6fed}.tree-row small{font-size:10px}.dock-section-title{height:30px;font-size:11px}.target-summary div{font-size:11px}.selection-empty b{font-size:11px}.selection-empty small{font-size:9.5px}.legend-item{font-size:9.5px;padding:5px 6px}
.editor-pane{grid-template-rows:37px 37px minmax(0,1fr)}.document-tab{height:33px;font-size:12px}.document-tab small{font-size:10px}.tab-ld{font-size:10px}.editor-action,.zoom-button{height:28px;font-size:11px}.matrix-toolbar{padding:0 10px;background:#f8fafc}.matrix-state{font-size:11.5px}.matrix-help{font-size:10px}.matrix-help kbd{font-size:9px}.build-inline{height:28px;font-size:10.5px;padding:0 12px}
.matrix-viewport{background:#edf2f7}.matrix-sheet{background:#fff;box-shadow:inset 0 1px #fff}.matrix-sheet>.column-header{height:32px;font-size:10.5px!important;color:#52647b;background:#eef3f8;border-right:1px solid var(--matrix-grid-strong);border-bottom:1px solid #b9c5d3}.matrix-sheet>.column-header.output{background:#f2edfb;color:#69449f;font-weight:800}.matrix-sheet>.row-header{background:#f3f6fa;border-right:1px solid var(--matrix-grid-strong);border-bottom:1px solid var(--matrix-grid);padding:0 8px}.row-number{font-size:11px;color:#63758b}.stl-pill{font-size:9.5px}.rail-cell{background:#fbfcfe;border-bottom:1px solid var(--matrix-grid)}.rail-cell:after{width:2px;background:var(--matrix-line)}.rail-cell.left.connected:before,.rail-cell.right.connected:before{height:2px;background:var(--matrix-line)}
.matrix-cell{background:#fff;border-right:1px solid var(--matrix-grid);border-bottom:1px solid var(--matrix-grid)}.matrix-cell.output-zone{background:#fdfbff}.matrix-cell.empty:hover{background:#f1f6ff}.matrix-cell.selected{box-shadow:inset 0 0 0 2px #2f6fed,inset 0 0 0 4px #dbe9ff}.matrix-cell svg{overflow:visible}.wire-stroke{stroke:var(--matrix-line);stroke-width:2.2;stroke-linecap:square;stroke-linejoin:miter}.symbol-stroke{stroke:#1f3045;stroke-width:2.35;stroke-linecap:square;stroke-linejoin:miter}.junction-dot{fill:var(--matrix-line)}
.contact-device{font:800 16px Consolas,"SFMono-Regular",monospace;text-anchor:middle;paint-order:stroke;stroke:#fff;stroke-width:2.2px;stroke-linejoin:round}.contact-caption{font:600 9.5px "Segoe UI",Arial,sans-serif;fill:#7b8797;text-anchor:middle}.edge-letter,.coil-letter{font:800 12px Consolas,monospace;fill:#2a3b51;text-anchor:middle}.device-main{font:800 15px Consolas,"SFMono-Regular",monospace;text-anchor:middle;paint-order:stroke;stroke:#fff;stroke-width:1.8px}.device-sub{font:700 9.5px "Segoe UI",Arial,sans-serif;fill:#647287;text-anchor:middle;letter-spacing:.2px}.instruction-op{font:850 14px Consolas,monospace;fill:#6032ad;text-anchor:middle}.instruction-args{font:650 10px Consolas,monospace;fill:#59657a;text-anchor:middle}.compare-main{font:850 13px Consolas,monospace;fill:#2458a8;text-anchor:middle}.compare-sub{font:650 9px Consolas,monospace;fill:#5e6b7d;text-anchor:middle}.compare-box{fill:#edf5ff;stroke:#6e9cd9;stroke-width:1.4}.instruction-box{fill:#f2edff;stroke:#9271cf;stroke-width:1.4}.device-box{stroke-width:1.4}.device-box.y{fill:#fff0df;stroke:#de9a40}.device-box.m{fill:#f2eaff;stroke:#a47cd9}.device-box.t{fill:#e7f8f5;stroke:#58aca4}.device-box.c{fill:#fff0f6;stroke:#d87ea8}.coil-stroke{stroke-width:2.5}
.cell-label-in{fill:#185fc3}.cell-label-y{fill:#bd6707}.cell-label-m{fill:#7136c0}.cell-label-s{fill:#4359a7}.cell-label-t{fill:#067d74}.cell-label-c{fill:#b33470}.cell-label-special{fill:#53647b}.empty-slot-hint{font-size:9px;color:#9aa7b8}
.end-row{height:56px;background:#fbfcfe}.end-row:before,.end-row:after{height:2px;background:var(--matrix-line)}.end-chip{border-color:var(--matrix-line);font-size:13px;padding:7px 17px;border-radius:5px;color:#203249}.end-step{font-size:10.5px}
.bottom-dock{grid-template-rows:32px minmax(0,1fr)}.bottom-tab{height:28px;font-size:11px}.problem-summary{height:44px}.problem-summary b{font-size:11.5px}.problem-summary small{font-size:10px}.problem-head,.problem-row{font-size:10.5px;min-height:27px}.watch-toolbar{font-size:10.5px}.data-table{font-size:10.5px}.statusbar{font-size:10px}.statusbar b{font-size:10px}
.palette-popover{border-radius:10px}.popover-head b{font-size:12.5px}.popover-head small{font-size:10.5px}.palette-tile{min-height:68px;border-radius:8px}.palette-tile .tile-symbol{font-size:19px}.palette-tile b{font-size:11.5px}.palette-tile small{font-size:9.5px}.modal-card{border-radius:10px}.modal-header b{font-size:14px}.modal-header small{font-size:10.5px}.form-grid label{font-size:11.5px}.param-row input,.param-row select{font-size:12px}

@media(max-width:1450px){
  :root{--logic-cell:75px;--action-cell:150px;--cell-h:66px;--row-head:72px;--rail-w:18px}
  .workspace{grid-template-columns:198px minmax(0,1fr)}
  .component-menu{min-width:145px}.component-menu small{font-size:9.5px}.palette-caption{display:none}
  .contact-device{font-size:16px}.device-main{font-size:14.5px}.instruction-op{font-size:13.5px}
}
@media(max-width:1320px){
  :root{--logic-cell:68px;--action-cell:144px;--cell-h:64px;--row-head:66px;--rail-w:16px}
  .workspace{grid-template-columns:182px minmax(0,1fr)}
  .component-menu{min-width:128px;padding:5px 7px}.component-menu small{display:none}.component-icon{width:34px;height:34px}
  .contact-device{font-size:15.5px}.device-main{font-size:14px}.instruction-op{font-size:13px}.contact-caption,.device-sub{font-size:9px}
  .matrix-sheet>.column-header{font-size:9.5px!important}.tree-row{font-size:12.5px}
}

/* =========================================================
   V1.2 EDGE-MATRIX PASS
   - components live on faint horizontal grid edges
   - vertical wire is a separate edge overlay
   - wire palette exposes only H and V
   - larger typography for shop-floor readability
   ========================================================= */
:root{
  --cell-h:82px;
  --logic-cell:86px;
  --action-cell:190px;
  --row-head:82px;
  --rail-w:22px;
  --matrix-line:#24354a;
  --matrix-grid:#d9e2ec;
  --matrix-grid-soft:#e8eef5;
  --matrix-grid-strong:#c5d0dc;
  --edge-hover:#2f6fed;
}
html,body{font-size:14px}
.ide-shell{grid-template-rows:52px 34px 66px 74px minmax(0,1fr) 166px 30px}
.brand-copy b{font-size:18px}.brand-copy small{font-size:12.5px}.document-title,.document-title input{font-size:15px}.target-chip b{font-size:14px}.target-chip small{font-size:11.5px}
.menubar .menu-trigger{font-size:15px;height:33px;padding:0 13px}.menu-context{font-size:12px}
.icon-button{height:54px;min-width:60px}.icon-button small{font-size:12px}.small-button{font-size:22px}.build-meter-top{font-size:11px}.build-meter-top b{font-size:11px}.online-state b{font-size:14px}.online-state small{font-size:11.5px}
.component-toolbar{padding:9px 12px;gap:10px}.palette-caption{width:150px}.palette-caption b{font-size:12.5px}.palette-caption small{font-size:11px}.component-menu{height:56px;min-width:176px}.component-menu b{font-size:14px}.component-menu small{font-size:11.5px}.component-icon{width:42px;height:40px;font-size:14px}.component-menu.wire .component-icon{font-size:23px}.mode-tool b{font-size:13px}.mode-tool small{font-size:10.5px}.draft-summary b{font-size:13px}.draft-summary small{font-size:11px}
.workspace{grid-template-columns:228px minmax(0,1fr)}.dock-header{font-size:13.5px}.tree-row{height:33px;font-size:14px}.tree-row small{font-size:11px}.dock-section-title{font-size:12px}.target-summary div{font-size:12.5px}.selection-empty b{font-size:12.5px}.selection-empty small{font-size:11px}.legend-item{font-size:11px}
.document-tab{font-size:13.5px}.document-tab small{font-size:11px}.matrix-state{font-size:13px}.matrix-help{font-size:11.5px}.matrix-help kbd{font-size:10.5px}.build-inline,.editor-action,.zoom-button{font-size:12px}

.matrix-sheet{
  grid-template-rows:36px;
  grid-auto-rows:calc(var(--cell-h)*var(--zoom));
  overflow:visible;
}
.matrix-sheet>.column-header{height:36px!important;font-size:11.5px!important;align-self:stretch}
.matrix-sheet>.row-header{font-size:12px}.row-number{font-size:12px}.stl-pill{font-size:10.5px}
.matrix-cell{border-right:1px solid var(--matrix-grid);border-bottom:0;background:#fff;overflow:visible}
.matrix-cell.logic,.matrix-cell.output-zone{position:relative}
.matrix-cell.output-zone{background:#fefcff}
.matrix-cell .edge-guide-h{position:absolute;left:0;right:0;top:50%;height:1px;background:var(--matrix-grid);transform:translateY(-.5px);z-index:0;pointer-events:none}
.matrix-cell:hover .edge-guide-h{background:#b8c8da}
.matrix-cell svg{position:relative;z-index:2}
.matrix-cell.empty:hover{background:#f5f9ff}
.matrix-cell.empty:hover:before{content:"";position:absolute;left:5px;right:5px;top:calc(50% - 9px);height:18px;border-radius:9px;background:#2f6fed10;z-index:1}
.matrix-cell.selected{box-shadow:inset 0 0 0 2px #2f6fed,inset 0 0 0 5px #dce9ff;z-index:7}
.rail-cell{border-bottom:0;background:#fbfcfe}.rail-cell:after{width:2.5px;background:var(--matrix-line)}.rail-cell.left.connected:before,.rail-cell.right.connected:before{height:2.5px;background:var(--matrix-line)}
.wire-stroke{stroke:var(--matrix-line);stroke-width:2.6;stroke-linecap:square;stroke-linejoin:miter}.symbol-stroke{stroke:#1d2f45;stroke-width:2.7}.coil-stroke{stroke-width:2.8}
.contact-device{font:850 18px Consolas,"SFMono-Regular",monospace;stroke-width:2.7px}.contact-caption{font:650 11.5px "Segoe UI",Arial,sans-serif}.edge-letter,.coil-letter{font-size:13.5px}.device-main{font:850 17px Consolas,"SFMono-Regular",monospace}.device-sub{font:750 11.5px "Segoe UI",Arial,sans-serif}.instruction-op{font:850 16px Consolas,monospace}.instruction-args{font:700 11.5px Consolas,monospace}.compare-main{font:850 15px Consolas,monospace}.compare-sub{font:700 10.5px Consolas,monospace}
.instruction-box,.device-box,.compare-box{stroke-width:1.6}

/* vertical edge layer sits exactly on the faint column boundaries */
.v-edge-layer{position:absolute;inset:0;z-index:6;pointer-events:none;overflow:visible}
.v-edge-hit{position:absolute;width:20px;transform:translateX(0);pointer-events:auto;cursor:crosshair;border-radius:7px}
.v-edge-hit .v-edge-line{position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--matrix-grid);transform:translateX(-.5px);transition:.08s}
.v-edge-hit:hover .v-edge-line,.v-edge-layer.armed .v-edge-hit:hover .v-edge-line{width:4px;background:#7fa8e8;transform:translateX(-2px)}
.v-edge-hit.filled .v-edge-line{width:2.6px;background:var(--matrix-line);transform:translateX(-1.3px)}
.v-edge-hit.filled:hover .v-edge-line{width:4px;background:var(--edge-hover);transform:translateX(-2px)}
.v-edge-hit.selected{box-shadow:inset 0 0 0 2px #2f6fed;background:#2f6fed12}
.v-edge-hit.drop-ok{background:#28a66a16;box-shadow:inset 0 0 0 2px #28a66a}.v-edge-hit.drop-ok .v-edge-line{width:4px;background:#28a66a;transform:translateX(-2px)}
.v-edge-node{position:absolute;left:50%;width:7px;height:7px;border-radius:50%;background:#fff;border:1.5px solid #9eafc2;transform:translate(-50%,-50%);opacity:0;transition:.08s}
.v-edge-node.top{top:0}.v-edge-node.bottom{top:100%}.v-edge-hit:hover .v-edge-node,.v-edge-hit.filled .v-edge-node,.v-edge-layer.armed .v-edge-hit:hover .v-edge-node{opacity:1}.v-edge-hit.filled .v-edge-node{background:var(--matrix-line);border-color:var(--matrix-line);width:6px;height:6px}
/* STL/GX presentation: semantic local-bus edges remain in topology but are not drawn as a duplicate left rail. */
.v-edge-hit.semantic-only-stl-source{pointer-events:none!important}
.v-edge-hit.semantic-only-stl-source .v-edge-line,.v-edge-hit.semantic-only-stl-source .v-edge-node{opacity:0!important;background:transparent!important;box-shadow:none!important}
/* GX-style branch joins are line intersections, not permanent black pellets. Keep nodes only as edit affordance. */
.v-edge-hit.filled .v-edge-node{opacity:0}
.v-edge-hit.filled:hover .v-edge-node,.v-edge-hit.filled.selected .v-edge-node,.v-edge-layer.armed .v-edge-hit.filled:hover .v-edge-node{opacity:1}
.junction-dot{display:none}

.palette-popover{min-width:330px}.popover-head b{font-size:14px}.popover-head small{font-size:11.5px}.palette-tile{min-height:82px}.palette-tile .tile-symbol{font-size:24px}.palette-tile b{font-size:13.5px}.palette-tile small{font-size:11px}
.modal-header b{font-size:16px}.modal-header small{font-size:12px}.form-grid label{font-size:13px}.form-grid input,.form-grid select{font-size:14px}.instruction-choice b{font-size:12.5px}.instruction-choice small{font-size:11px}.param-row label{font-size:12.5px}.param-row input,.param-row select{font-size:14px}.param-help{font-size:11.5px}
.bottom-tab{font-size:12px}.problem-summary b{font-size:13px}.problem-summary small{font-size:11.5px}.problem-head,.problem-row{font-size:11.5px}.data-table,.watch-toolbar{font-size:11.5px}.statusbar,.statusbar b{font-size:11px}
.end-chip{font-size:15px;padding:8px 19px}.end-step{font-size:11.5px}

@media(max-width:1500px){
  :root{--logic-cell:74px;--action-cell:158px;--cell-h:78px;--row-head:74px;--rail-w:18px}
  .workspace{grid-template-columns:200px minmax(0,1fr)}
  .palette-caption{display:none}.component-menu{min-width:144px}.component-menu small{display:none}.component-menu b{font-size:13.5px}
  .draft-summary{min-width:155px}.draft-summary small{display:none}.build-meter{display:none}
  .contact-device{font-size:17px}.device-main{font-size:16px}.instruction-op{font-size:15px}
}
@media(max-width:1320px){
  :root{--logic-cell:68px;--action-cell:150px;--cell-h:76px;--row-head:68px;--rail-w:16px}
  .workspace{grid-template-columns:182px minmax(0,1fr)}
  .component-menu{min-width:126px;padding:5px 7px}.component-icon{width:36px;height:36px}.mode-tool{padding:4px 6px}.draft-summary{display:none}
  .contact-device{font-size:16.5px}.device-main{font-size:15.5px}.instruction-op{font-size:14.5px}.contact-caption,.device-sub{font-size:10.5px}
  .tree-row{font-size:13.5px}.menubar .menu-trigger{font-size:14px}.matrix-help{display:none}
}

/* V1.2 FINAL READABILITY TUNE — larger at 100% zoom */
html,body{font-size:15px}
.brand-copy b{font-size:19px}.brand-copy small{font-size:13px}
.component-menu b{font-size:14.5px}.component-menu small{font-size:12px}
.tree-row{font-size:14.5px}.tree-row small{font-size:11.5px}
.contact-device{font-size:19px}.device-main{font-size:18px}.instruction-op{font-size:16.5px}
.contact-caption{font-size:12.5px}.device-sub{font-size:12px}.instruction-args{font-size:12px}
.matrix-sheet>.column-header{font-size:12px!important}.row-number{font-size:12.5px}.stl-pill{font-size:11px}
.matrix-state{font-size:13.5px}.matrix-help{font-size:12px}
@media(max-width:1500px){
  html,body{font-size:14.5px}
  .contact-device{font-size:18px}.device-main{font-size:17px}.instruction-op{font-size:15.5px}
  .tree-row{font-size:14px}.component-menu b{font-size:14px}.menubar .menu-trigger{font-size:14.5px}
}
@media(max-width:1320px){
  .contact-device{font-size:17.5px}.device-main{font-size:16.5px}.instruction-op{font-size:15px}
  .tree-row{font-size:13.75px}.menubar .menu-trigger{font-size:14.25px}
}

/* V1.3 FX NATIVE — professional FX reference pass */
.legend-item.special{background:#eef2f7;border-color:#c8d2df;color:#45576f}
.fx-mode-note{display:inline-flex;align-items:center;height:20px;padding:0 7px;border:1px solid #bfd1ea;border-radius:10px;background:#edf5ff;color:#2d63ad;font-size:10.5px;font-weight:800;letter-spacing:.35px}
.device-bank-hint{min-height:34px;display:flex;align-items:center;padding:7px 9px;border:1px solid #dce4ee;border-radius:6px;background:#f8fafc;color:#52647a;font-size:12px;font-weight:600}
.range-list{display:grid;grid-template-columns:1fr;gap:4px;margin-top:5px}.range-list>div{display:grid;grid-template-columns:62px 1fr;gap:7px;align-items:baseline}.range-list code{font:800 12px Consolas,monospace;color:#1e4f91}.range-list span{font-size:11.5px;color:#5f6f84}
.runtime-preview code{font-size:14px;font-weight:800}.runtime-preview span{font-size:11.5px}
.form-grid input,.form-grid select{min-height:36px;font-size:15px}.form-grid label{font-size:13.5px}.param-row input,.param-row select{min-height:34px;font-size:14.5px}
.contact-device{font-size:20px}.device-main{font-size:19px}.instruction-op{font-size:17px}.compare-main{font-size:16px}.contact-caption{font-size:12.5px}.device-sub{font-size:12.5px}.instruction-args{font-size:12.5px}
.wire-stroke{stroke-width:2.8}.symbol-stroke{stroke-width:2.9}.coil-stroke{stroke-width:3}
.matrix-cell .edge-guide-h{background:#d5dee9}.matrix-cell:hover .edge-guide-h{background:#aebfd2}.v-edge-hit .v-edge-line{background:#d5dee9}
.matrix-sheet>.column-header{font-size:12.5px!important;font-weight:800;color:#53647b}.row-number{font-size:13px;font-weight:800}
.component-menu{box-shadow:0 1px 2px rgba(24,45,75,.06)}.component-menu b{font-size:14.5px}.component-menu small{font-size:12px}
.matrix-state b{font-size:14px;letter-spacing:.2px}.matrix-state #cursorLabel{font-size:12.5px}
.data-table{font-size:12px}.watch-toolbar{font-size:12px}.problem-row,.problem-head{font-size:12px}
@media(max-width:1500px){
  .contact-device{font-size:18.5px}.device-main{font-size:17.5px}.instruction-op{font-size:16px}.compare-main{font-size:15px}
  .component-menu b{font-size:14px}.matrix-state b{font-size:13.5px}
}
@media(max-width:1320px){
  .contact-device{font-size:18px}.device-main{font-size:17px}.instruction-op{font-size:15.5px}.compare-main{font-size:14.5px}
  .fx-mode-note{display:none}
}

/* V1.3 final dialog readability — opcode selection must remain legible at 100% */
.instruction-picker{grid-template-columns:280px minmax(0,1fr)}
.instruction-search input{height:34px;font-size:13px;padding:6px 9px}
.instruction-category{font-size:10.5px;letter-spacing:.65px;padding:9px 8px 5px}
.instruction-choice{padding:8px 9px;min-height:38px}
.instruction-choice b{font-size:13.5px}
.instruction-choice small{font-size:11.5px}
.instruction-empty b{font-size:13px}.instruction-empty small{font-size:11.5px}
.instruction-title b{font-size:15px}.instruction-title span{font-size:10.5px}
.inspect-card .inspect-top b{font-size:13px}.inspect-card .inspect-kind{font-size:10px}
.inspect-card dl{grid-template-columns:58px 1fr;font-size:11px}.inspect-actions button{font-size:11px}


/* V1.4: END is grid-aligned with the OUTPUT column; live Ladder monitor overlay. */
.end-row{
  grid-column:1/-1!important;
  display:grid!important;
  grid-template-columns:var(--row-head) var(--rail-w) repeat(12,var(--cw)) var(--aw) var(--rail-w)!important;
  grid-template-rows:1fr!important;
  position:relative!important;
  height:58px!important;
  align-items:center!important;
  background:#fbfcfe!important;
  border-top:1px solid #ccd5e0!important;
  border-bottom:1px solid #dfe5ec!important;
}
.end-row:before,.end-row:after{display:none!important}
.end-step{position:static!important;grid-column:1;grid-row:1;justify-self:start;align-self:center;margin-left:9px;font:800 12px Consolas,monospace;color:#68788d}
.end-wire{grid-column:2/17;grid-row:1;align-self:center;height:2.8px;background:var(--matrix-line);margin-left:50%;margin-right:50%;z-index:0}
.end-chip{position:static!important;grid-column:15;grid-row:1;place-self:center;transform:none!important;z-index:2;border:2px solid var(--matrix-line);background:#fff;border-radius:5px;font:900 16px Consolas,monospace;padding:8px 20px;letter-spacing:.7px;color:#203249}
.matrix-cell.monitor-flow{background:#eaf9f1!important;box-shadow:inset 0 2px #72d5aa,inset 0 -2px #72d5aa}
.matrix-cell.monitor-flow .wire-stroke,.matrix-cell.monitor-flow .symbol-stroke{stroke:#10a66a!important;stroke-width:3.2!important}
.matrix-cell.monitor-flow .contact-device,.matrix-cell.monitor-flow .device-main,.matrix-cell.monitor-flow .instruction-op{filter:saturate(1.25);font-weight:900}
.matrix-cell.monitor-device-on{box-shadow:inset 0 0 0 2px #14a86b,0 0 0 1px #fff!important}
.v-edge-hit.monitor-flow .v-edge-line{background:#10a66a!important;width:3px!important;box-shadow:0 0 0 1px #b7efd5}
.v-edge-hit.monitor-flow .v-edge-node{background:#10a66a!important;border-color:#10a66a!important}
.matrix-sheet.live-ladder-monitor .rail-cell:after,.matrix-sheet.live-ladder-monitor .rail-cell.left.connected:before,.matrix-sheet.live-ladder-monitor .rail-cell.right.connected:before{transition:background .12s ease}

/* V1.4.1 PROFESSIONAL UI PASS — clearer online workflow, denser engineering chrome, larger Ladder viewport. */
.ide-shell{grid-template-rows:48px 29px 58px 64px minmax(0,1fr) clamp(132px,18vh,178px) 27px}
.titlebar{box-shadow:0 1px 0 rgba(255,255,255,.04)}
.brand-copy b{font-size:19px;letter-spacing:.1px}.brand-copy small{font-size:12.5px}
.menu-trigger{font-weight:550}.menu-context{font-size:11.5px;color:#6b7890}
.icon-button{min-width:56px}.icon-button small{font-size:11px;font-weight:650}.icon-button.monitor .monitor-icon:before{content:"◉";position:absolute;inset:1px;display:grid;place-items:center;color:#1f8d63;font:bold 18px Arial}.icon-button.monitor.active{background:#e9f8f1;border-color:#9dd9bf;box-shadow:inset 0 -2px #1f9d68}.icon-button.monitor.active small{color:#13734c}.icon-button.monitor:disabled{opacity:.38;box-shadow:none;background:transparent}
.online-state{min-width:175px;padding-left:12px}.online-state b{font-size:13px;letter-spacing:.1px}.online-state small{font-size:10.5px;white-space:nowrap}.online-lamp{width:10px;height:10px}
.component-toolbar{padding:6px 10px}.component-menu{height:49px;border-radius:8px}.component-menu b{font-size:14.5px}.component-menu small{font-size:11.5px}.mode-tool{height:45px}.draft-summary b{font-size:12px}.draft-summary small{font-size:10.5px}
.workspace{background:#e7edf4}.project-dock{box-shadow:1px 0 0 #c7d1dd}.dock-header{font-size:12px;font-weight:800;letter-spacing:.2px}.tree-row.selected{font-weight:750}.target-summary b{font-weight:750}
.editor-pane{background:#edf2f7}.document-tabs{background:#e6ecf3}.document-tab.active{box-shadow:inset 0 -2px var(--blue)}
.matrix-toolbar{height:38px!important;min-height:38px;gap:10px;border-bottom-color:#bec9d6}.matrix-state{gap:7px}.matrix-state-dot{width:8px;height:8px;box-shadow:0 0 0 3px #e4efff}.matrix-state.monitor .matrix-state-dot{background:var(--green);box-shadow:0 0 0 3px #dff4ea}.matrix-state b{font-size:14px}.matrix-state.monitor b{color:#126f4b}.matrix-state #cursorLabel{font-size:12px;color:#708097}.matrix-help{font-size:11px;white-space:nowrap}.matrix-help kbd{font-size:9.5px;padding:2px 5px}
.monitor-legend{height:28px;display:flex;align-items:center;gap:12px;padding:0 10px;border:1px solid #cfe5db;border-radius:6px;background:#f2fbf7;color:#38594b;font-size:10.5px;font-weight:650;white-space:nowrap}.monitor-legend.hidden{display:none}.monitor-legend span{display:flex;align-items:center;gap:5px}.monitor-legend small{color:#6b7b74}.monitor-legend i{display:inline-block}.energized-sample{width:21px;height:3px;border-radius:2px;background:#10a66a;box-shadow:0 0 0 1px #c8efde}.on-sample{width:10px;height:10px;border-radius:3px;border:2px solid #10a66a;background:#fff}
.build-inline{height:29px;font-size:11px;font-weight:800;border-radius:5px}
.matrix-viewport{background:#eaf0f6}.matrix-sheet{box-shadow:0 1px 4px rgba(31,49,73,.05)}.matrix-sheet>.column-header{letter-spacing:.15px}.matrix-sheet>.column-header.output{background:#f2edfb}.matrix-sheet>.row-header{background:#f4f7fa}.rail-cell{background:#fcfdfe}
.matrix-cell{transition:background-color .08s ease,box-shadow .08s ease}.matrix-cell.selected{box-shadow:inset 0 0 0 2px #2f6fed!important;background:#f3f7ff!important}.matrix-cell.issue-error{box-shadow:inset 0 0 0 2px #d34a5b}.matrix-cell.issue-warning{box-shadow:inset 0 0 0 2px #e0a12d}
.contact-device{font-weight:900}.device-main{font-weight:900}.contact-caption,.device-sub{font-weight:650}.wire-stroke,.symbol-stroke{shape-rendering:geometricPrecision}
.end-row{height:60px!important;background:#f9fbfd!important}.end-chip{font-size:16px!important;border-radius:6px!important;padding:8px 21px!important;box-shadow:0 1px 2px rgba(27,45,69,.08)}.end-step{font-size:12px!important}
/* Monitor: emphasize current flow, not whole cells. Keep the Matrix/grid readable. */
.matrix-cell.monitor-flow{background:linear-gradient(to bottom,transparent calc(50% - 10px),rgba(16,166,106,.075) calc(50% - 10px),rgba(16,166,106,.075) calc(50% + 10px),transparent calc(50% + 10px))!important;box-shadow:none!important}
.matrix-cell.monitor-flow .wire-stroke,.matrix-cell.monitor-flow .symbol-stroke{stroke:#08a166!important;stroke-width:3.35!important;filter:drop-shadow(0 0 1px rgba(8,161,102,.16))}.matrix-cell.monitor-flow .instruction-box,.matrix-cell.monitor-flow .device-box,.matrix-cell.monitor-flow .compare-box{stroke:#08a166!important}
.matrix-cell.monitor-device-on{box-shadow:inset 0 0 0 2px rgba(8,161,102,.85)!important}.matrix-cell.monitor-device-on .contact-device,.matrix-cell.monitor-device-on .device-main{font-weight:950}
.matrix-cell.monitor-condition-on .symbol-stroke{stroke:#08a166!important;stroke-width:3.35!important;filter:drop-shadow(0 0 1px rgba(8,161,102,.18))}.matrix-cell.monitor-condition-on .contact-device,.matrix-cell.monitor-condition-on .compare-main{fill:#087a51!important;font-weight:950}.matrix-cell.monitor-condition-on .compare-box{stroke:#08a166!important;stroke-width:2.4!important}
.matrix-sheet.monitor-readonly .matrix-cell,.matrix-sheet.monitor-readonly .v-edge-hit{cursor:default!important}
.v-edge-hit.monitor-flow .v-edge-line{background:#08a166!important;width:3.4px!important;box-shadow:0 0 0 1px #c8efde}.v-edge-hit.monitor-flow .v-edge-node{background:#08a166!important;border-color:#08a166!important}
.live-monitor-switch{display:flex!important;align-items:center;gap:7px;height:27px;padding:0 9px;border:1px solid #cfd9e4;border-radius:5px;background:#fff;color:#405168;font-weight:650}.live-monitor-switch input{accent-color:#1f9d68}.live-monitor-switch small{font-size:10px;color:#7b899a;border-left:1px solid #dce3ea;padding-left:7px}.serial-state-pill{margin-left:auto;display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:12px;border:1px solid #d3dbe5;background:#fff;color:#6b788a;font-weight:750;font-size:10.5px}.serial-state-pill.online{border-color:#a8dbc3;background:#edf9f3;color:#19754f}.serial-state-pill.offline{border-color:#d6dde6;background:#f6f8fa;color:#748196}
.watch-toolbar{height:39px;padding:0 10px;gap:9px}.watch-toolbar button{height:27px;font-size:10.5px;font-weight:700}.data-table th{font-size:10.5px;letter-spacing:.2px;text-transform:uppercase}.data-table td{font-size:12px}.watch-value{font:800 12px Consolas,monospace;color:#243950}
.statusbar{min-height:27px}.statusbar,.statusbar b{font-size:10.5px}.status-product b{font-weight:800}
@media(max-width:1500px){
  .ide-shell{grid-template-rows:48px 29px 58px 61px minmax(0,1fr) clamp(128px,17vh,165px) 27px}
  .icon-button{min-width:52px}.icon-button small{font-size:10.5px}.online-state{min-width:158px}.monitor-legend{gap:8px;padding:0 8px}.monitor-legend small{display:none}
}
@media(max-width:1320px){
  .ide-shell{grid-template-rows:48px 29px 56px 60px minmax(0,1fr) 126px 27px}
  .icon-button{min-width:48px;padding-inline:4px}.icon-button small{font-size:10px}.online-state{min-width:145px}.monitor-legend{display:none!important}
  .matrix-state #cursorLabel{display:none}.component-menu{min-width:122px}.mode-tool>div{display:none}.statusbar>div{padding:0 7px}
}
.matrix-help.hidden{display:none!important}
.device-sub.live-pv{fill:#0a8b5b!important;font-weight:900!important;font-size:11.5px!important}

/* V1.4.3 — GX-style monitor console, 50 ms target polling. */
.monitor-panel{position:fixed;z-index:1800;right:22px;top:154px;width:min(720px,calc(100vw - 44px));max-height:min(620px,calc(100vh - 190px));display:grid;grid-template-rows:auto auto auto minmax(220px,1fr) auto;background:#f7f9fc;border:1px solid #9eacbd;border-radius:8px;box-shadow:0 18px 42px rgba(24,42,66,.28),0 2px 8px rgba(24,42,66,.12);overflow:hidden;color:#26384f}.monitor-panel.hidden{display:none}
.monitor-panel-header{height:48px;padding:0 12px 0 13px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(#edf3fa,#e5ecf5);border-bottom:1px solid #b8c4d1}.monitor-panel-header>div{display:flex;align-items:center;gap:10px}.monitor-panel-header b{display:block;font-size:14px;color:#213650}.monitor-panel-header small{display:block;margin-top:2px;font-size:10.5px;color:#697a90}.monitor-panel-icon{width:27px;height:27px;display:grid;place-items:center;border-radius:5px;background:#2f6fed;color:#fff;font:900 13px Consolas,monospace;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}.monitor-panel-header button{width:30px;height:30px;border:1px solid transparent;border-radius:5px;background:transparent;font-size:20px;color:#5b6a7c;cursor:pointer}.monitor-panel-header button:hover{background:#fff;border-color:#c6d0dc;color:#273b54}
.monitor-panel-controls{display:grid;grid-template-columns:1.05fr .9fr 1fr .72fr 1.1fr;gap:8px;padding:10px 11px 8px;background:#f9fbfd;border-bottom:1px solid #d5dde6}.monitor-panel-controls label{display:grid;gap:4px}.monitor-panel-controls label>span{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.28px;color:#64748a}.monitor-panel-controls input,.monitor-panel-controls select{height:31px;border:1px solid #bfcbd8;border-radius:4px;background:#fff;color:#24364d;font:700 12px Arial;padding:0 8px;outline:none}.monitor-panel-controls input{font-family:Consolas,monospace;font-size:13px}.monitor-panel-controls input:focus,.monitor-panel-controls select:focus{border-color:#4d83d8;box-shadow:0 0 0 2px rgba(77,131,216,.12)}.monitor-panel-controls select:disabled{color:#516176;background:#f3f6f9}
.monitor-panel-actions{height:43px;display:flex;align-items:center;gap:7px;padding:0 11px;border-bottom:1px solid #cbd5e0;background:#eef3f8}.monitor-panel-actions button{height:29px;padding:0 11px;border:1px solid #b8c5d3;border-radius:4px;background:#fff;color:#31445c;font-size:11px;font-weight:750;cursor:pointer}.monitor-panel-actions button:hover{border-color:#7fa2cf;background:#f7fbff}.monitor-panel-actions .monitor-start{background:#edf8f2;border-color:#9bcdb6;color:#176b49}.batch-monitor-state{margin-left:4px;padding:4px 8px;border-radius:11px;border:1px solid #c5ced8;background:#fff;color:#67768a;font-size:9.5px;font-weight:900;letter-spacing:.35px}.batch-monitor-state.running{background:#eaf8f1;border-color:#9bd5ba;color:#0f754c}.monitor-rate{margin-left:auto;color:#68788d;font-size:10.5px}.monitor-rate b{color:#24405e}
.monitor-table-wrap{overflow:auto;background:#fff}.monitor-batch-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:11.5px}.monitor-batch-table th{position:sticky;top:0;z-index:2;height:30px;padding:0 8px;background:#e9eef5;border-right:1px solid #cbd5e1;border-bottom:1px solid #aebccb;color:#465a72;font-size:9.5px;text-transform:uppercase;letter-spacing:.25px;text-align:left}.monitor-batch-table th:nth-child(1){width:38px;text-align:center}.monitor-batch-table th:nth-child(2){width:85px}.monitor-batch-table th:nth-child(3){width:80px;text-align:center}.monitor-batch-table th:nth-child(4){width:112px;text-align:right}.monitor-batch-table th:nth-child(5){width:112px;text-align:right}.monitor-batch-table td{height:29px;padding:0 8px;border-right:1px solid #e0e6ed;border-bottom:1px solid #e4e9ef;background:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.monitor-batch-table tbody tr:nth-child(even) td{background:#fafbfd}.monitor-batch-table tbody tr:hover td{background:#eef5ff}.monitor-batch-table tbody tr.selected td{background:#e4efff!important;box-shadow:inset 0 1px #bfd4f4,inset 0 -1px #bfd4f4}.monitor-batch-table td:nth-child(1){text-align:center;color:#8794a5;font:700 10px Consolas,monospace}.monitor-batch-table td:nth-child(2){font:800 12px Consolas,monospace;color:#24466e}.monitor-batch-table td:nth-child(3){text-align:center}.monitor-batch-table td:nth-child(4),.monitor-batch-table td:nth-child(5){text-align:right;font:800 12px Consolas,monospace;color:#253a52}.monitor-batch-table .bit-on{display:inline-flex;align-items:center;justify-content:center;min-width:37px;height:19px;border:1px solid #8dceb0;border-radius:10px;background:#e8f8f0;color:#087548;font-size:9px;font-weight:900}.monitor-batch-table .bit-off{display:inline-flex;align-items:center;justify-content:center;min-width:37px;height:19px;border:1px solid #ccd5df;border-radius:10px;background:#f5f7f9;color:#798697;font-size:9px;font-weight:850}.monitor-batch-table .na{color:#a4adba}
.monitor-panel-foot{min-height:31px;padding:0 11px;display:flex;align-items:center;gap:12px;border-top:1px solid #cfd8e2;background:#f2f5f9;color:#6a788a;font-size:10px}.monitor-panel-foot b{margin-left:auto;font:800 10px Consolas,monospace;color:#4e6178}
@media(max-width:1450px){.monitor-panel{right:12px;top:150px;width:min(660px,calc(100vw - 24px))}.monitor-panel-controls{grid-template-columns:1fr .8fr .95fr .7fr}.monitor-ref{display:none}.monitor-batch-table th:nth-child(6),.monitor-batch-table td:nth-child(6){display:none}}
@media(max-width:900px){.monitor-panel{left:8px;right:8px;top:120px;width:auto;max-height:calc(100vh - 140px)}.monitor-panel-controls{grid-template-columns:1fr 1fr}.monitor-panel-actions{flex-wrap:wrap;height:auto;min-height:43px;padding:6px 9px}.monitor-rate{margin-left:0}}

/* V1.4.4 — transactional PLC Read/Write progress dialog. */
.transfer-backdrop{position:fixed;inset:0;z-index:2300;display:grid;place-items:center;background:rgba(18,32,51,.34);backdrop-filter:blur(1.5px)}.transfer-backdrop.hidden{display:none}
.transfer-card{width:min(520px,calc(100vw - 32px));overflow:hidden;border:1px solid #93a4b8;border-radius:9px;background:#f8fafc;box-shadow:0 22px 60px rgba(16,31,50,.34),0 2px 8px rgba(16,31,50,.18);color:#26384f}
.transfer-head{height:58px;padding:0 15px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #bcc8d5;background:linear-gradient(#f2f6fb,#e7edf5)}.transfer-head>div{display:flex;align-items:center;gap:11px}.transfer-head b{display:block;font-size:15px;color:#173653}.transfer-head small{display:block;margin-top:2px;color:#6e7d90;font-size:10.5px}.transfer-icon{width:31px;height:31px;border-radius:6px;display:grid;place-items:center;background:#2f6fed;color:#fff;font:900 20px Arial}.transfer-backdrop.writing .transfer-icon{background:#8a5a19}.transfer-state{padding:5px 9px;border:1px solid #bec8d4;border-radius:11px;background:#fff;color:#66768a;font-size:9.5px;font-weight:900;letter-spacing:.4px}.transfer-backdrop.done .transfer-state{border-color:#90ceb1;background:#e9f8f0;color:#0d744a}.transfer-backdrop.error .transfer-state{border-color:#e2a6af;background:#fff0f2;color:#a12d40}
.transfer-body{padding:17px 16px 15px;background:#fff}.transfer-progress-row{display:grid;grid-template-columns:minmax(0,1fr) 48px;align-items:center;gap:11px}.transfer-progress-track{height:12px;overflow:hidden;border:1px solid #aebdcd;border-radius:7px;background:#e8edf3;box-shadow:inset 0 1px 2px rgba(33,49,69,.08)}.transfer-progress-track i{display:block;width:0;height:100%;border-radius:6px;background:linear-gradient(90deg,#286fe0,#42a2ef);transition:width .12s linear}.transfer-backdrop.writing .transfer-progress-track i{background:linear-gradient(90deg,#b87a20,#e7a53c)}.transfer-backdrop.done .transfer-progress-track i{background:linear-gradient(90deg,#178653,#2ebc7a)}.transfer-backdrop.error .transfer-progress-track i{background:linear-gradient(90deg,#b53347,#e45b6c)}.transfer-progress-row>b{text-align:right;font:900 14px Consolas,monospace;color:#243b56}
.transfer-phase{margin-top:14px;min-height:45px}.transfer-phase b{display:block;font-size:13px;color:#223a55}.transfer-phase small{display:block;margin-top:4px;font-size:11px;color:#6c7a8c}.transfer-metrics{margin-top:10px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.transfer-metrics>span{padding:8px 10px;border:1px solid #d6dee7;border-radius:5px;background:#f6f8fb}.transfer-metrics small{display:block;color:#7b8796;font-size:9.5px;text-transform:uppercase;letter-spacing:.3px}.transfer-metrics b{display:block;margin-top:3px;color:#344a63;font:800 11.5px Consolas,monospace}
.transfer-foot{min-height:45px;padding:0 13px;display:flex;align-items:center;gap:12px;border-top:1px solid #cbd5df;background:#eef3f8}.transfer-foot>span{font-size:10.5px;color:#69798d}.transfer-foot button{margin-left:auto;height:29px;min-width:74px;border:1px solid #9eafc1;border-radius:4px;background:#fff;color:#30465f;font-weight:800;font-size:11px}.transfer-foot button:disabled{opacity:.45;cursor:not-allowed}.transfer-foot button:not(:disabled){cursor:pointer}.transfer-foot button:not(:disabled):hover{background:#f7fbff;border-color:#6f93bf}
@media(max-width:620px){.transfer-card{width:calc(100vw - 18px)}.transfer-metrics{grid-template-columns:1fr}.transfer-foot>span{display:none}}

/* V1.4.7 — readability + simplified production sidebar. */
/* User-requested 50% operand/preset enlargement, while preserving mnemonic hierarchy. */
.instruction-op{font-size:18px!important}
.instruction-args{font-size:15px!important;font-weight:750!important}
.device-main{font-size:18px!important}
.device-sub{font-size:14.25px!important;font-weight:750!important}
.device-sub.live-pv{font-size:14.25px!important}

/* Bottom dock: readable at 100% on Full HD without materially increasing dock height. */
.bottom-tab{font-size:13px!important;padding-inline:11px}
.tab-count{font-size:10px!important}
.watch-toolbar{font-size:13px!important}
.watch-toolbar button{font-size:12px!important}
.data-table{font-size:13px!important}
.data-table th{font-size:12px!important}
.data-table td{font-size:13px!important}
.data-table button{font-size:11.5px!important}
.problem-summary b{font-size:13px!important}
.problem-summary small{font-size:11.5px!important}
.problem-head,.problem-row{font-size:12px!important}
.code-panel pre{font-size:11.5px!important}
.ref-card h3{font-size:12.5px!important}
.ref-card div{font-size:11.5px!important}
.ref-card code{font-size:11px!important}

/* V1.4.8 — global readability / contrast audit. */
.menu-context{font-size:12px!important;color:#52647b!important}
.brand-copy small{font-size:12px!important;color:#c6d4e8!important}
.target-chip small{font-size:11px!important;color:#c4d0e0!important}
.icon-button small{font-size:11.5px!important;color:#40546d!important}
.build-meter-top,.build-meter-top b{font-size:11.5px!important;color:#41556e!important}
.online-state small{font-size:11.5px!important;color:#566a81!important}
.palette-caption small{font-size:11px!important;color:#5e7187!important}
.component-menu small{font-size:11.5px!important;color:#53677e!important}
.mode-tool small{font-size:10.5px!important;color:#5a6c82!important}
.draft-summary small{font-size:11px!important;color:#566a80!important}
.tree-row{font-size:13px!important;color:#33485f!important}
.tree-row small{font-size:11px!important;color:#62758a!important}
.dock-section-title{font-size:11.5px!important;color:#53667e!important}
.target-summary div{font-size:12px!important}.target-summary span{color:#65768a!important}.target-summary b{color:#31445d!important}
.matrix-help{font-size:11px!important;color:#5c6e83!important}.matrix-state{font-size:12px!important}.monitor-legend{font-size:11.5px!important;color:#425970!important}.monitor-legend small{font-size:11px!important;color:#5b7087!important}
.document-tab{font-size:12.5px!important}.document-tab small{font-size:10.5px!important;color:#62758b!important}.editor-action{font-size:11.5px!important}
.matrix-sheet>.column-header{font-size:12.5px!important;color:#455b74!important}.row-number{font-size:12.5px!important;color:#536a84!important}
.statusbar,.statusbar b{font-size:11px!important}.statusbar{color:#c5d2e2!important}
.modal-header small{font-size:11px!important;color:#62758a!important}.form-grid label{font-size:12px!important;color:#4d6178!important}.modal-footer>span{font-size:10.5px!important;color:#65778d!important}
.popover-head small,.palette-tile small{font-size:10.5px!important;color:#596c82!important}

/* GX-style structural Step Ladder presentation. */
.step-box{fill:#f1ebff;stroke:#7c55c7;stroke-width:1.5}.step-op{font:800 12px "Segoe UI",Arial,sans-serif;fill:#5e36a8;text-anchor:middle}.step-state{font:800 11.5px Consolas,monospace;fill:#3f2774;text-anchor:middle}
.row-header.step-marker-row{background:#f1ecfb}.row-header.stl-active-row{background:#f8f5ff}.stl-scope-tag{margin-left:auto;padding:2px 5px;border-radius:9px;background:#e8defa;color:#603ca8;font:800 9.5px Consolas,monospace}
.matrix-cell:has(.step-svg){background:#fbf9ff}.matrix-cell:has(.step-svg).selected{box-shadow:inset 0 0 0 2px #7c55c7!important}
.palette-tile.step{border-color:#cbb8ef;background:#f7f2ff}.palette-tile.step .tile-symbol{color:#6840b2}

/* Nano 1N device browser used by Add Watch / Add Device. */
.device-catalog{display:grid;gap:10px}.catalog-search-row input{width:100%;height:38px;border:1px solid #b9c7d6;border-radius:5px;padding:0 11px;font:600 13px "Segoe UI",Arial;color:#24384f;background:#fff;outline:none}.catalog-search-row input:focus{border-color:#4f82d2;box-shadow:0 0 0 2px rgba(79,130,210,.12)}
.catalog-groups{display:flex;flex-wrap:wrap;gap:5px}.catalog-groups button{height:28px;min-width:38px;padding:0 9px;border:1px solid #c4ceda;border-radius:4px;background:#f7f9fb;color:#465b73;font-size:11px;font-weight:800;cursor:pointer}.catalog-groups button.active{border-color:#4f7fd0;background:#eaf2ff;color:#235aa5}
.catalog-results{height:280px;overflow:auto;border:1px solid #cbd5e0;border-radius:5px;background:#fff;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start}.catalog-item{position:relative;min-height:48px;padding:7px 8px;border:0;border-right:1px solid #e2e7ed;border-bottom:1px solid #e2e7ed;background:#fff;text-align:left;cursor:pointer;color:#31465f}.catalog-item:hover{background:#f2f7ff}.catalog-item.selected{background:#e6f0ff;box-shadow:inset 0 0 0 2px #4f82d2}.catalog-item b{display:block;font:800 13px Consolas,monospace;color:#244b78}.catalog-item span{display:block;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:10.5px;color:#65778d}.catalog-item i{position:absolute;right:6px;top:6px;padding:2px 4px;border-radius:7px;background:#efe7ff;color:#7045b4;font-size:8px;font-style:normal;font-weight:900}.catalog-empty{grid-column:1/-1;padding:18px;color:#68798d;font-size:12px}
@media(max-width:760px){.catalog-results{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* V1.4.9 — GX-like edit/convert state, range selection, OUT-family T/C monitor, live register operands. */
:root{--action-cell:214px}
@media(max-width:1500px){:root{--action-cell:220px}}
@media(max-width:1400px){:root{--action-cell:166px}}
@media(max-width:1320px){:root{--action-cell:178px}}

/* Unconverted ladder edits: only touched rows are subdued until Convert succeeds. */
.row-header.unconverted,.rail-cell.unconverted,.matrix-cell.unconverted{background-color:#f0f1f3!important}
.matrix-cell.unconverted:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;background:repeating-linear-gradient(135deg,rgba(89,99,112,.055) 0,rgba(89,99,112,.055) 5px,transparent 5px,transparent 11px)}
.matrix-cell.unconverted svg{opacity:.72}.row-header.unconverted .row-number{color:#707881!important}.v-edge-hit.unconverted .v-edge-line{opacity:.55}

/* Mouse-drag rectangular Ladder selection. */
.matrix-cell.range-selected{z-index:5;background:#e8f1ff!important;box-shadow:inset 0 0 0 1.5px rgba(47,111,237,.72)!important}
.v-edge-hit.range-selected .v-edge-line{background:#2f6fed!important;width:3px!important}.v-edge-hit.range-selected .v-edge-node{border-color:#2f6fed!important;background:#dbe9ff!important}

/* T/C are OUT-family coils, not function blocks. Preset and PV reserve separate lines. */
.tc-coil .device-main{font-size:18px!important}.tc-preset{font:800 13px Consolas,monospace;fill:#53657a;text-anchor:middle}.tc-pv{font:900 13px Consolas,monospace;fill:#07865a;text-anchor:middle}.tc-coil .coil-stroke{stroke-width:2.6}
.matrix-cell.monitor-device-on .tc-coil .device-main{fill:#087a51!important}

/* Instruction monitor values are pre-reserved inside the block; no layout shift. */
.instruction-live-line{font:800 10.5px Consolas,monospace;fill:#07865a;text-anchor:middle;letter-spacing:-.15px}.instruction-box{fill:#f4efff}.instruction-args{font-size:14px!important}
@media(max-width:1320px){.instruction-live-line{font-size:9.5px}.instruction-args{font-size:12.5px!important}}

/* GX-style STL marker is an OUTPUT-side instruction fed by an automatic left-rail line. */
.step-auto-wire{background:#fbf9ff!important}.step-auto-wire .wire-stroke{stroke:#4f3a78;stroke-width:2.2}.step-box{fill:#f1ebff;stroke:#7550b5;stroke-width:1.6}.step-op{font-size:13px}.step-state{font-size:13px}

/* V1.4.10 — consolidated GX polish: geometry, monitor separation, STL/END, readability. */
:root{
  --monitor-green:#008f55;
  --monitor-green-dark:#006f43;
  --action-cell:280px;
  --cell-h:90px;
}
@media(max-width:1500px){:root{--action-cell:260px;--cell-h:88px}}
@media(max-width:1400px){:root{--action-cell:240px;--cell-h:86px}}
@media(max-width:1320px){:root{--action-cell:230px;--cell-h:84px}}

/* Keep the right power rail visible even beside overlay scrollbars. */
.matrix-sheet{padding-right:26px!important}
.rail-cell.right{z-index:4;background:#fcfdfe;box-shadow:2px 0 0 rgba(34,51,72,.12)}
.rail-cell.right:after{width:3px!important;background:#24364d!important}
.rail-cell.left:after{width:3px!important;background:#24364d!important}
.rail-cell.left.connected:before,.rail-cell.right.connected:before{height:2.8px!important;background:#24364d!important}

/* GX STL: only the STL/RET rung is auto-wired. Following rows remain ordinary ladder rows. */
.row-header.stl-active-row{border-left:0!important;background:#f7f8fb!important}
.stl-scope-tag{background:#eef0f5!important;color:#596a80!important;font-size:10.5px!important}
.step-auto-wire{background:#fff!important}
.step-auto-wire .wire-stroke{stroke:#24364d!important;stroke-width:2.8!important}
.step-box{fill:#f5f1fb!important;stroke:#7154a7!important;stroke-width:1.8!important}
.step-op{font-size:14px!important}.step-state{font-size:14px!important}

/* END is a real final ladder line inside the Matrix grid, not a footer card. */
.end-line-row{background:#f4f7fa!important;border-top:1px solid #cbd5e0!important}
.end-line-cell,.end-line-output,.end-line-rail{background:#fff!important;border-top:1px solid #d9e0e8!important}
.end-box{fill:#fff;stroke:#24364d;stroke-width:1.9;vector-effect:non-scaling-stroke}
.end-op{font:900 16px Consolas,monospace;fill:#203249;text-anchor:middle}

/* OUT-family coils: device is inside the coil. T/C preset and live value have their own lines. */
.coil-device{font:900 17px Consolas,monospace;text-anchor:middle;dominant-baseline:auto}
.tc-pv{font:900 15px Consolas,monospace;fill:var(--monitor-green-dark);text-anchor:middle}
.tc-preset{font:850 14px Consolas,monospace;fill:#4b5f78;text-anchor:middle}
.tc-coil .tc-preset{dominant-baseline:auto}
.tc-coil .coil-stroke,.out-coil .coil-stroke{stroke-width:3!important}

/* Function instruction operands are column-aligned; live value sits directly below its operand. */
.instruction-box{fill:#f5f0ff;stroke:#7b5ac5;stroke-width:1.7}
.instruction-op{font-size:19px!important;font-weight:900!important}
.instruction-operand{font:850 14px Consolas,monospace;fill:#4c5f79;text-anchor:middle}
.instruction-live-value{font:900 14px Consolas,monospace;fill:var(--monitor-green-dark);text-anchor:middle}
@media(max-width:1320px){.instruction-operand,.instruction-live-value{font-size:13px}}

/* Monitor visibility: stronger green and thicker energized geometry; not color alone. */
.matrix-cell.monitor-flow .wire-stroke,.matrix-cell.monitor-flow .symbol-stroke{
  stroke:var(--monitor-green)!important;stroke-width:4.3!important;filter:drop-shadow(0 0 1.5px rgba(0,143,85,.28))
}
.matrix-cell.monitor-condition-on .symbol-stroke{stroke:var(--monitor-green)!important;stroke-width:4.3!important;filter:drop-shadow(0 0 1.5px rgba(0,143,85,.28))}
.matrix-cell.monitor-condition-on .contact-device,.matrix-cell.monitor-condition-on .compare-main,.matrix-cell.monitor-device-on .device-main{fill:var(--monitor-green-dark)!important;font-weight:950!important}
.matrix-cell.monitor-condition-on{background:linear-gradient(to bottom,transparent 22%,rgba(0,143,85,.075) 22%,rgba(0,143,85,.075) 78%,transparent 78%)!important}
.v-edge-hit.monitor-flow .v-edge-line{background:var(--monitor-green)!important;width:4.3px!important;box-shadow:0 0 0 1px rgba(0,143,85,.16)!important}
.v-edge-hit.monitor-flow .v-edge-node{background:var(--monitor-green)!important;border-color:var(--monitor-green)!important;width:7px!important;height:7px!important}
.energized-sample{background:var(--monitor-green)!important;height:4px!important}.on-sample{border-color:var(--monitor-green)!important;border-width:3px!important}

/* Dedicated Device Batch Monitor toolbar button. */
.batch-monitor-icon:before{content:"▦";position:absolute;inset:0;display:grid;place-items:center;color:#315f9e;font:bold 19px Arial}
.icon-button.batch-monitor.active{background:#edf5ff;border-color:#a9c5eb;box-shadow:inset 0 -2px #3974c6}
.icon-button.batch-monitor.active small{color:#245a9e}

/* Global readability pass — avoid micro text in engineering/status regions. */
.icon-button small{font-size:12px!important;font-weight:750!important}
.menu-context{font-size:12.5px!important;color:#445a73!important}
.build-meter-top,.build-meter-top b{font-size:12px!important}
.online-state small{font-size:12px!important;color:#445970!important}
.palette-caption b{font-size:12px!important}.palette-caption small{font-size:11.5px!important;color:#51667e!important}
.component-menu small{font-size:12px!important;color:#4d627a!important}
.mode-tool small{font-size:11.5px!important;color:#50647a!important}
.draft-summary small{font-size:11.5px!important;color:#50647a!important}
.matrix-state #cursorLabel{font-size:12.5px!important;color:#536980!important}
.monitor-legend{font-size:12.5px!important}.monitor-legend small{font-size:12px!important;color:#466054!important}
.bottom-tab{font-size:13.5px!important}.watch-toolbar{font-size:13px!important}.watch-toolbar button{font-size:12.5px!important}
.data-table{font-size:13px!important}.data-table th{font-size:12.5px!important}.data-table td{font-size:13px!important}
.statusbar,.statusbar b{font-size:12px!important}.statusbar{color:#d4deea!important}
.target-summary div{font-size:12.5px!important}.dock-section-title{font-size:12px!important}
.matrix-sheet>.column-header{font-size:13px!important}.row-number{font-size:13px!important}
.monitor-panel-header small{font-size:11.5px!important}.monitor-panel-controls label>span{font-size:11px!important}
.monitor-batch-table{font-size:12.5px!important}.monitor-batch-table th{font-size:10.5px!important}.monitor-batch-table td:nth-child(2),.monitor-batch-table td:nth-child(4),.monitor-batch-table td:nth-child(5){font-size:13px!important}

/* S state output visual identity in the device picker. */
.type-card.s .big{background:#eef1ff;color:#4359a7}
/* S-device output blocks (SET/RST Sx) must never fall back to SVG's black default fill. */
.device-box.s{fill:#eef1ff!important;stroke:#8795cf!important}
.cell-label-s{fill:#4359a7!important}

/* V1.4.10 responsive Matrix fit: keep wide OUTPUT monitor area without forcing horizontal scroll. */
@media(max-width:1700px){
  :root{--logic-cell:80px;--action-cell:260px}
  .workspace{grid-template-columns:210px minmax(0,1fr)!important}
}
@media(max-width:1450px){
  :root{--logic-cell:66px;--action-cell:250px;--row-head:74px;--rail-w:18px}
  .workspace{grid-template-columns:188px minmax(0,1fr)!important}
}
@media(max-width:1320px){
  :root{--logic-cell:60px;--action-cell:240px;--row-head:68px;--rail-w:16px}
  .workspace{grid-template-columns:175px minmax(0,1fr)!important}
}

/* ============================================================
   HMI V1 — single-screen Virtual HMI prototype
   ============================================================ */
.hmi-main-toolbar{display:none;align-items:center;width:100%;height:100%;gap:8px;min-width:0}
body.view-hmi .component-toolbar>:not(.hmi-main-toolbar){display:none!important}
body.view-hmi .hmi-main-toolbar{display:flex}
.hmi-toolbar-brand{display:flex;align-items:center;gap:9px;min-width:220px;padding:0 6px}
.hmi-toolbar-brand>div{display:flex;flex-direction:column;line-height:1.05}.hmi-toolbar-brand b{font-size:13px;letter-spacing:.45px;color:#24364e}.hmi-toolbar-brand small{font-size:10.5px;color:#728096;margin-top:4px}
.hmi-toolbar-icon{width:35px;height:35px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(145deg,#274f86,#1c365d);color:#fff;font:900 15px Consolas,monospace;box-shadow:inset 0 1px rgba(255,255,255,.25),0 2px 5px rgba(23,49,83,.15)}
.hmi-mode-button{height:42px;min-width:104px;border:1px solid #cbd5e1;border-radius:6px;background:#f8fafc;display:flex;align-items:center;gap:8px;padding:0 10px;color:#43536a}
.hmi-mode-button>span{width:25px;height:25px;border-radius:5px;display:grid;place-items:center;background:#e8edf4;font-size:13px}.hmi-mode-button>div{display:flex;flex-direction:column;align-items:flex-start;line-height:1.05}.hmi-mode-button b{font-size:11.5px}.hmi-mode-button small{font-size:9.5px;color:#7a8798;margin-top:3px}
.hmi-mode-button:hover{background:#f1f5f9}.hmi-mode-button.active{border-color:#8bb5ee;background:#edf5ff;color:#22599e;box-shadow:inset 0 0 0 1px #d5e7ff}.hmi-mode-button.active>span{background:#2f6fed;color:#fff}
.hmi-mode-button.run-active{border-color:#7ac9a5;background:#edf9f3;color:#197450}.hmi-mode-button.run-active>span{background:#1ca66c;color:#fff}
.hmi-toolbar-action{height:31px;border:1px solid #c8d2de;border-radius:5px;background:#fff;padding:0 10px;font-size:11px;font-weight:700;color:#46566c}.hmi-toolbar-action:hover{background:#eef4fb;border-color:#aebfd2}
.hmi-connection-badge{height:40px;min-width:160px;border:1px solid #d1d9e3;border-radius:7px;background:#f8fafc;display:flex;align-items:center;gap:8px;padding:0 10px;margin-right:4px}.hmi-connection-badge>i{width:9px;height:9px;border-radius:50%;background:#95a2b3;box-shadow:0 0 0 3px #e6eaf0}.hmi-connection-badge>div{display:flex;flex-direction:column;line-height:1}.hmi-connection-badge b{font-size:11px;color:#536177}.hmi-connection-badge small{font-size:9.5px;color:#8793a3;margin-top:4px}.hmi-connection-badge.online{border-color:#b9dfcb;background:#f1fbf6}.hmi-connection-badge.online>i{background:#20aa6f;box-shadow:0 0 0 3px #d9f3e6}.hmi-connection-badge.online b{color:#18704d}

.tab-hmi{font:800 9px Consolas,monospace;background:#eef3fb;color:#315b91;border:1px solid #c5d4e8;padding:3px 4px;border-radius:3px}.hmi-doc-hint{display:none;margin:0 10px 8px 0;font-size:10.5px;color:#68798f;font-weight:700}body.view-hmi .hmi-doc-hint{display:inline-flex}body.view-hmi .ladder-doc-action{display:none!important}
.tree-badge.hmi{background:#eef4fb;color:#315f98;border-color:#c4d4e7;font-weight:900}
body.view-hmi .tree-row[data-workspace-view="hmi"],body:not(.view-hmi) .tree-row[data-workspace-view="ladder"]{background:linear-gradient(90deg,#dceaff,#edf5ff);box-shadow:inset 3px 0 #2f6fed;color:#1f4c91;font-weight:750}
body.view-hmi .tree-row[data-workspace-view="ladder"],body:not(.view-hmi) .tree-row[data-workspace-view="hmi"]{background:transparent;box-shadow:none;color:#34435a;font-weight:400}

.hmi-subtoolbar,.hmi-editor-view{display:none}.hmi-subtoolbar{grid-row:2;min-width:0;height:37px;align-items:center;padding:0 10px;border-bottom:1px solid #cbd4df;background:#f8fafc;gap:12px}.hmi-breadcrumb{display:flex;align-items:center;gap:7px}.hmi-breadcrumb span{font-size:10px;color:#718096}.hmi-breadcrumb span:after{content:'›';margin-left:7px;color:#a0aaba}.hmi-breadcrumb b{font-size:12px;color:#31445e}.hmi-breadcrumb small{font-size:10px;color:#8793a3;margin-left:3px}.hmi-sub-help{font-size:10.5px;color:#65758a}.hmi-sub-help kbd{border:1px solid #ccd5df;border-bottom-width:2px;border-radius:3px;background:#fff;padding:1px 4px;font:700 9px Consolas,monospace;color:#4c5d72}.hmi-sub-fill{flex:1}.hmi-object-count{font-size:10.5px;font-weight:700;color:#607086;border:1px solid #d1d9e3;border-radius:10px;padding:3px 8px;background:#fff}
body.view-hmi .matrix-toolbar,body.view-hmi #matrixViewport{display:none!important}body.view-hmi .hmi-subtoolbar{display:flex}body.view-hmi .hmi-editor-view{display:grid}
.hmi-editor-view{grid-row:3;min-width:0;min-height:0;grid-template-columns:185px minmax(0,1fr) 245px;background:#dce3eb;overflow:hidden}
.hmi-toolbox-panel,.hmi-properties-panel{min-width:0;min-height:0;background:#f7f9fc;display:flex;flex-direction:column}.hmi-toolbox-panel{border-right:1px solid #c8d2de}.hmi-properties-panel{border-left:1px solid #c8d2de}
.hmi-panel-title{height:42px;flex:0 0 42px;border-bottom:1px solid #d4dce6;background:#edf1f6;display:flex;align-items:center;justify-content:space-between;padding:0 10px;color:#44546a}.hmi-panel-title>div{display:flex;flex-direction:column;line-height:1}.hmi-panel-title b{font-size:11.5px}.hmi-panel-title small{font-size:9.5px;color:#7e8b9d;margin-top:4px}.hmi-panel-title>span{font:800 9px Consolas,monospace;color:#6a7a8f;border:1px solid #ccd5e0;background:#fff;border-radius:8px;padding:2px 6px}
.hmi-tool-list{padding:7px;display:grid;gap:5px;overflow:auto}.hmi-tool-list button{min-height:49px;border:1px solid #d4dce6;border-radius:6px;background:#fff;display:flex;align-items:center;gap:9px;padding:5px 8px;text-align:left;color:#405168;box-shadow:0 1px 1px rgba(31,55,82,.03)}.hmi-tool-list button:hover{border-color:#9fb9db;background:#f5f9ff;box-shadow:0 2px 5px rgba(39,84,139,.08)}.hmi-tool-list button>div{display:flex;flex-direction:column;line-height:1}.hmi-tool-list button b{font-size:11px}.hmi-tool-list button small{font-size:9px;color:#8894a4;margin-top:4px}.hmi-tool-glyph{width:29px;height:29px;border-radius:6px;display:grid;place-items:center;background:#edf2f8;color:#365f91;font:800 11px Consolas,monospace}.hmi-tool-glyph.lamp{color:#1a9a67}.hmi-tool-glyph.button{color:#2465ac}.hmi-tool-glyph.toggle{color:#6552a8}.hmi-tool-glyph.numeric{color:#176e87}.hmi-tool-glyph.input{color:#9a611d}.hmi-tool-glyph.bar{color:#1a8b75}.hmi-tool-glyph.trend{color:#5a64a8}
.hmi-tool-note{margin:auto 8px 8px;border:1px solid #d8e0e9;border-radius:6px;background:#f0f5fb;padding:8px;display:flex;flex-direction:column;gap:4px}.hmi-tool-note b{font-size:9.5px;color:#445b78}.hmi-tool-note span{font-size:8.8px;line-height:1.35;color:#77879a}

.hmi-canvas-stage{min-width:0;min-height:0;display:grid;grid-template-rows:32px minmax(0,1fr);background:#d8e0e9}.hmi-stage-ruler{display:flex;align-items:center;gap:8px;padding:0 12px;border-bottom:1px solid #c1ccd8;background:#e8edf3}.hmi-stage-ruler span{font-size:10.5px;font-weight:800;color:#46576d}.hmi-stage-ruler small{font-size:9.5px;color:#7a8797}.hmi-canvas-scroll{min-width:0;min-height:0;overflow:auto;padding:24px 28px 38px;display:flex;justify-content:flex-start;align-items:flex-start}
.hmi-canvas{position:relative;flex:0 0 auto;width:960px;height:540px;border:1px solid #9eabb9;background-color:#e9edf1;background-image:linear-gradient(#dbe1e7 1px,transparent 1px),linear-gradient(90deg,#dbe1e7 1px,transparent 1px);background-size:20px 20px;box-shadow:0 12px 28px rgba(36,52,73,.18),0 1px 2px rgba(24,39,59,.25);overflow:hidden;user-select:none}.hmi-canvas:before{content:'SCREEN 1';position:absolute;right:10px;bottom:7px;color:#a1aab5;font:800 9px Consolas,monospace;letter-spacing:.5px;pointer-events:none}
body.hmi-run .hmi-canvas{background-image:none;background-color:#e9edf1}body.hmi-run .hmi-toolbox-panel{opacity:.58;pointer-events:none}body.hmi-run .hmi-properties-panel{opacity:.68;pointer-events:none}

.hmi-widget{position:absolute;box-sizing:border-box;border:1px solid transparent;border-radius:5px;cursor:move}.hmi-widget:hover{border-color:#99b9df}.hmi-widget.selected{border-color:#2f6fed!important;box-shadow:0 0 0 1px #fff,0 0 0 3px rgba(47,111,237,.24)!important}.hmi-widget.selected:after{content:'';position:absolute;width:7px;height:7px;right:-5px;bottom:-5px;background:#fff;border:2px solid #2f6fed;border-radius:1px}body.hmi-run .hmi-widget{cursor:default;border-color:transparent!important;box-shadow:none!important}body.hmi-run .hmi-widget:after{display:none}
.hmi-widget-inner{width:100%;height:100%;box-sizing:border-box}
.hmi-screen-title{display:flex;align-items:center;height:100%;padding:0 14px;border-radius:4px;background:linear-gradient(135deg,#24384f,#1c2d41);color:#fff;box-shadow:0 2px 4px rgba(24,42,62,.18)}.hmi-screen-title b{font-size:20px;letter-spacing:.3px}.hmi-screen-title small{margin-left:auto;font-size:10px;color:#bdcad7;letter-spacing:.6px}
.hmi-lamp{height:100%;display:flex;align-items:center;gap:10px;padding:7px 10px;border:1px solid #c6d0dc;border-radius:6px;background:linear-gradient(#fff,#f5f7fa);box-shadow:0 1px 2px rgba(32,54,79,.08)}.hmi-lamp-led{width:24px;height:24px;border-radius:50%;background:#9da7b2;border:3px solid #697581;box-shadow:inset 0 0 0 4px #bcc4cc,0 1px 2px rgba(0,0,0,.18)}.hmi-lamp.on .hmi-lamp-led{background:#26c77b;border-color:#168251;box-shadow:inset 0 0 0 3px #86e7ba,0 0 10px rgba(34,190,115,.55)}.hmi-lamp-copy{display:flex;flex-direction:column;line-height:1}.hmi-lamp-copy b{font-size:12px;color:#34475f}.hmi-lamp-copy small{font:800 9px Consolas,monospace;color:#8794a5;margin-top:4px}.hmi-lamp.on .hmi-lamp-copy small{color:#168251}
.hmi-push{width:100%;height:100%;border:1px solid #8190a2;border-bottom-width:3px;border-radius:7px;background:linear-gradient(#fff,#edf1f5);color:#33475e;font-weight:900;font-size:13px;box-shadow:0 2px 4px rgba(29,48,70,.14);display:flex;align-items:center;justify-content:center;gap:7px}.hmi-push:active,.hmi-push.pressed{transform:translateY(1px);border-bottom-width:1px;background:#dfeaf8;color:#20558f}.hmi-push small{font:700 8.5px Consolas,monospace;color:#718196}
.hmi-toggle{height:100%;display:flex;align-items:center;justify-content:space-between;gap:9px;padding:7px 10px;border:1px solid #c7d0db;border-radius:6px;background:#fff}.hmi-toggle-copy{display:flex;flex-direction:column}.hmi-toggle-copy b{font-size:11.5px;color:#364961}.hmi-toggle-copy small{font:700 8.5px Consolas,monospace;color:#8895a5;margin-top:3px}.hmi-toggle-switch{width:38px;height:20px;border-radius:11px;background:#adb6c0;position:relative;box-shadow:inset 0 1px 2px rgba(0,0,0,.18)}.hmi-toggle-switch:after{content:'';position:absolute;width:16px;height:16px;left:2px;top:2px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:.12s}.hmi-toggle.on .hmi-toggle-switch{background:#27ad73}.hmi-toggle.on .hmi-toggle-switch:after{left:20px}
.hmi-numeric,.hmi-num-input{height:100%;border:1px solid #c5cfda;border-radius:7px;background:linear-gradient(180deg,#ffffff,#f5f8fb);padding:9px 12px;box-shadow:0 1px 3px rgba(31,53,77,.07);display:flex;flex-direction:column;justify-content:center}.hmi-value-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.hmi-value-head b{font-size:10.5px;color:#5b6a7d;text-transform:uppercase;letter-spacing:.35px}.hmi-value-head code{font:800 9px Consolas,monospace;color:#6380a2;background:#eef3f9;border-radius:4px;padding:2px 5px}.hmi-value-number{font:900 27px Consolas,monospace;color:#183c5d;margin-top:4px;letter-spacing:.4px}.hmi-num-input input{width:100%;box-sizing:border-box;margin-top:6px;height:34px;border:1px solid #91a7be;border-radius:4px;background:#fff;padding:0 8px;font:900 20px Consolas,monospace;color:#173d60;outline:none}.hmi-num-input input:focus{border-color:#2f6fed;box-shadow:0 0 0 2px #dbe9ff}
.hmi-text-widget{height:100%;display:flex;align-items:center;padding:0 6px;font-weight:800;font-size:16px;color:#33465e}
.hmi-bar-widget{height:100%;border:1px solid #c5d0dc;border-radius:7px;background:#fff;padding:10px 12px;box-shadow:0 1px 3px rgba(31,53,77,.07)}.hmi-bar-head{display:flex;align-items:center;justify-content:space-between}.hmi-bar-head b{font-size:11px;color:#4c5e75}.hmi-bar-head span{font:900 13px Consolas,monospace;color:#254e73}.hmi-bar-track{height:18px;margin-top:8px;border:1px solid #aab6c4;border-radius:3px;background:#e3e8ed;overflow:hidden;box-shadow:inset 0 1px 2px rgba(23,43,65,.12)}.hmi-bar-fill{height:100%;width:0;background:linear-gradient(90deg,#2e86bb,#25a781);transition:width .12s linear}.hmi-bar-scale{display:flex;justify-content:space-between;margin-top:4px;font:700 8px Consolas,monospace;color:#8a95a3}
.hmi-trend-widget{height:100%;border:1px solid #bac6d2;border-radius:7px;background:#f9fbfd;padding:8px 10px;box-shadow:0 1px 3px rgba(31,53,77,.08);display:grid;grid-template-rows:26px minmax(0,1fr)}.hmi-trend-head{display:flex;align-items:center;justify-content:space-between}.hmi-trend-head b{font-size:11px;color:#455870}.hmi-trend-head span{font:800 10px Consolas,monospace;color:#2d658f}.hmi-trend-chart{min-height:0;border:1px solid #d1dae4;border-radius:4px;background:#fff}.hmi-trend-chart svg{width:100%;height:100%;display:block}.hmi-trend-grid{stroke:#e4e9ef;stroke-width:1}.hmi-trend-line{fill:none;stroke:#2485b5;stroke-width:2.2;vector-effect:non-scaling-stroke}.hmi-trend-empty{fill:#8b97a6;font:700 8px sans-serif;text-anchor:middle}

.hmi-property-body{padding:9px;overflow:auto}.hmi-property-empty{min-height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#7e8b9b;padding:15px}.hmi-property-empty>span{font-size:28px;color:#a8b2bf}.hmi-property-empty b{font-size:11.5px;color:#5a6a7e;margin-top:6px}.hmi-property-empty small{font-size:9.5px;line-height:1.45;margin-top:5px}.hmi-prop-section{border:1px solid #d8e0e9;background:#fff;border-radius:6px;margin-bottom:8px;overflow:hidden}.hmi-prop-section>h4{margin:0;padding:7px 8px;background:#f1f5f9;border-bottom:1px solid #e0e6ed;font-size:9.5px;text-transform:uppercase;letter-spacing:.5px;color:#66768a}.hmi-prop-grid{display:grid;grid-template-columns:72px 1fr;gap:7px 7px;padding:9px;align-items:center}.hmi-prop-grid label{font-size:9.5px;color:#718095}.hmi-prop-grid input,.hmi-prop-grid select{min-width:0;height:29px;border:1px solid #c8d2de;border-radius:4px;background:#fff;padding:0 6px;font-size:10.5px;color:#35475e}.hmi-prop-grid input:focus,.hmi-prop-grid select:focus{outline:none;border-color:#6f9fd8;box-shadow:0 0 0 2px #e1edfb}.hmi-prop-geometry{display:grid;grid-template-columns:repeat(2,1fr);gap:5px;padding:9px}.hmi-prop-geometry label{display:flex;align-items:center;gap:4px;font-size:9px;color:#738196}.hmi-prop-geometry input{width:100%;height:27px;box-sizing:border-box;border:1px solid #cbd4df;border-radius:4px;padding:0 5px;font-size:10px}.hmi-prop-actions{display:flex;gap:6px}.hmi-prop-actions button{flex:1;height:30px;border:1px solid #c6d0dc;border-radius:5px;background:#fff;font-size:10px;font-weight:700;color:#465970}.hmi-prop-actions button:hover{background:#eef4fa}.hmi-prop-actions button.danger{border-color:#e0b5bd;color:#a33849;background:#fff8f9}.hmi-prop-actions button.danger:hover{background:#fdecef}

@media(max-width:1450px){.hmi-editor-view{grid-template-columns:170px minmax(0,1fr) 225px}.hmi-canvas-scroll{padding:20px}.hmi-toolbar-brand{min-width:195px}.hmi-connection-badge{min-width:145px}.hmi-sub-help{display:none}}
@media(max-width:1180px){.hmi-editor-view{grid-template-columns:150px minmax(0,1fr) 205px}.hmi-tool-list button small{display:none}.hmi-tool-list button{min-height:43px}.hmi-toolbar-brand small,.hmi-mode-button small{display:none}.hmi-toolbar-brand{min-width:160px}.hmi-mode-button{min-width:82px}}
/* HMI gets the engineering viewport; keep the bottom dock as a compact tab strip. */
body.view-hmi .ide-shell{grid-template-rows:48px 29px 58px 64px minmax(0,1fr) 32px 27px}
body.view-hmi .bottom-dock{grid-template-rows:32px 0}
body.view-hmi .bottom-dock .bottom-body{display:none!important}


/* HMI V1.1 GT-style polish */
body.view-hmi .workspace-shell{grid-template-rows:52px 44px minmax(0,1fr)}
.hmi-main-toolbar{gap:12px}.hmi-toolbar-brand{min-width:250px}.hmi-toolbar-brand b{font-size:15px}.hmi-toolbar-brand small{font-size:11.5px}.hmi-toolbar-icon{width:38px;height:38px;font-size:16px;border-radius:9px}
.hmi-mode-button{height:44px;min-width:118px;border-radius:7px}.hmi-mode-button b{font-size:12.5px}.hmi-mode-button small{font-size:10.5px}.hmi-mode-button>span{width:28px;height:28px}
.hmi-toolbar-action{height:34px;padding:0 12px;font-size:11.5px;border-radius:6px}.hmi-connection-badge{height:42px;min-width:176px}.hmi-connection-badge b{font-size:12px}.hmi-connection-badge small{font-size:10.5px}
.hmi-subtoolbar{height:44px;padding:0 14px}.hmi-breadcrumb b{font-size:13px}.hmi-breadcrumb small,.hmi-sub-help,.hmi-object-count{font-size:11.5px}
.hmi-editor-view{grid-template-columns:210px minmax(0,1fr) 290px;background:#cfd7e0}.hmi-panel-title{height:48px;flex-basis:48px;padding:0 12px}.hmi-panel-title b{font-size:12.5px}.hmi-panel-title small{font-size:10.5px}
.hmi-tool-list{padding:10px;gap:8px}.hmi-tool-list button{min-height:58px;padding:7px 10px;border-radius:7px}.hmi-tool-list button b{font-size:12.5px}.hmi-tool-list button small{font-size:10px;display:block}.hmi-tool-glyph{width:34px;height:34px;font-size:13px}
.hmi-tool-note{margin:10px;border-radius:8px;padding:10px}.hmi-tool-note b{font-size:10.5px}.hmi-tool-note span{font-size:9.6px}
.hmi-canvas-stage{grid-template-rows:36px minmax(0,1fr)}.hmi-stage-ruler{padding:0 14px}.hmi-stage-ruler span{font-size:11.5px}.hmi-stage-ruler small{font-size:10.5px}.hmi-canvas-scroll{padding:26px 30px 42px}
.hmi-canvas{border:1px solid #909dad;background-image:linear-gradient(#cfd7df 1px,transparent 1px),linear-gradient(90deg,#cfd7df 1px,transparent 1px);background-size:24px 24px;box-shadow:0 14px 34px rgba(28,42,60,.24),0 1px 2px rgba(24,39,59,.25)}.hmi-canvas:before{font-size:10px;right:12px;bottom:9px}
body.hmi-run .hmi-canvas{background-color:#d6dce2}
.hmi-widget{border-radius:6px}.hmi-widget:hover{border-color:#8aa9ce}.hmi-widget.selected{box-shadow:0 0 0 1px #fff,0 0 0 3px rgba(47,111,237,.26)!important}
.hmi-resize-handle{position:absolute;width:10px;height:10px;border:1px solid #2f6fed;background:#fff;box-sizing:border-box;border-radius:2px;z-index:2;display:none}.hmi-widget.selected .hmi-resize-handle{display:block}.hmi-resize-handle.nw{left:-6px;top:-6px;cursor:nwse-resize}.hmi-resize-handle.ne{right:-6px;top:-6px;cursor:nesw-resize}.hmi-resize-handle.sw{left:-6px;bottom:-6px;cursor:nesw-resize}.hmi-resize-handle.se{right:-6px;bottom:-6px;cursor:nwse-resize}
body.hmi-run .hmi-resize-handle{display:none!important}
.hmi-widget-inner{font-family:Segoe UI,Tahoma,Arial,sans-serif}
.hmi-screen-title{padding:0 18px;border-radius:4px;background:linear-gradient(180deg,var(--hmi-bg,#3a4d63),color-mix(in srgb,var(--hmi-bg,#3a4d63) 85%, #000));border:1px solid color-mix(in srgb,var(--hmi-border,#213040) 88%, #000);color:var(--hmi-fg,#fff);box-shadow:inset 0 1px rgba(255,255,255,.18),0 2px 4px rgba(24,42,62,.18)}.hmi-screen-title b{font-size:var(--hmi-font,28px);letter-spacing:.25px}.hmi-screen-title small{font-size:12px;color:#d2dde8}
.hmi-text-widget{justify-content:var(--hmi-align,left)==center?center:flex-start;font-size:var(--hmi-font,18px);font-weight:700;color:var(--hmi-fg,#33465e);text-align:var(--hmi-align,left);background:transparent;border:1px solid transparent;padding:0 8px}
.hmi-lamp{gap:12px;padding:8px 12px;border:1px solid var(--hmi-border,#7e8a98);border-radius:6px;background:linear-gradient(#fff,#eef2f6);box-shadow:0 1px 2px rgba(32,54,79,.08)}.hmi-lamp.square .hmi-lamp-led{border-radius:4px}.hmi-lamp-led{width:26px;height:26px;border-radius:50%;background:var(--hmi-off,#9099a6);border:3px solid #67717d;box-shadow:inset 0 0 0 4px #bcc4cc,0 1px 2px rgba(0,0,0,.18)}.hmi-lamp.on .hmi-lamp-led{background:var(--hmi-on,#20c46b);border-color:color-mix(in srgb,var(--hmi-on,#20c46b) 55%, #000);box-shadow:inset 0 0 0 3px color-mix(in srgb,var(--hmi-on,#20c46b) 35%, #fff),0 0 10px color-mix(in srgb,var(--hmi-on,#20c46b) 55%, transparent)}.hmi-lamp-copy b{font-size:var(--hmi-font,18px);color:var(--hmi-fg,#34475f);font-weight:700}.hmi-lamp-copy small{font:800 var(--hmi-small-font,12px) Consolas,monospace;color:#6f7d90;margin-top:5px}.hmi-lamp.on .hmi-lamp-copy small{color:color-mix(in srgb,var(--hmi-on,#20c46b) 60%, #000)}
.hmi-push{width:100%;height:100%;border:1px solid var(--hmi-border,#8190a2);border-bottom-width:4px;border-radius:6px;background:linear-gradient(180deg,#fff,var(--hmi-bg,#f0f2f5));color:var(--hmi-fg,#33475e);font-weight:900;font-size:var(--hmi-font,22px);box-shadow:0 2px 4px rgba(29,48,70,.14);display:flex;align-items:center;justify-content:center;gap:8px}.hmi-push span{letter-spacing:.2px}.hmi-push:active,.hmi-push.pressed{transform:translateY(1px);border-bottom-width:1px;background:linear-gradient(180deg,color-mix(in srgb,var(--hmi-accent,#2d8fc3) 16%, #fff),color-mix(in srgb,var(--hmi-accent,#2d8fc3) 28%, #fff));color:color-mix(in srgb,var(--hmi-accent,#2d8fc3) 56%, #000)}.hmi-push small{font:700 var(--hmi-small-font,12px) Consolas,monospace;color:#718196}
.hmi-toggle{height:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;border:1px solid var(--hmi-border,#9aa8b8);border-radius:6px;background:linear-gradient(180deg,#fff,var(--hmi-bg,#f7f9fb))}.hmi-toggle-copy b{font-size:var(--hmi-font,18px);color:var(--hmi-fg,#364961);font-weight:700}.hmi-toggle-copy small{font:700 var(--hmi-small-font,12px) Consolas,monospace;color:#7e8a99;margin-top:4px}.hmi-toggle-switch{width:46px;height:24px;border-radius:13px;background:#adb6c0;position:relative;box-shadow:inset 0 1px 2px rgba(0,0,0,.18)}.hmi-toggle-switch:after{content:'';position:absolute;width:20px;height:20px;left:2px;top:2px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:.12s}.hmi-toggle.on .hmi-toggle-switch{background:var(--hmi-accent,#27ad73)}.hmi-toggle.on .hmi-toggle-switch:after{left:24px}
.hmi-numeric,.hmi-num-input{height:100%;border:1px solid var(--hmi-border,#9aa8b8);border-radius:7px;background:linear-gradient(180deg,#ffffff,var(--hmi-bg,#f5f8fb));padding:10px 12px;box-shadow:0 1px 3px rgba(31,53,77,.07);display:flex;flex-direction:column;justify-content:center}.hmi-value-head b{font-size:calc(var(--hmi-font,18px) * .60);color:#5b6a7d;text-transform:uppercase;letter-spacing:.35px}.hmi-value-head code{font:800 var(--hmi-small-font,12px) Consolas,monospace;color:#6380a2;background:#eef3f9;border-radius:4px;padding:2px 5px}.hmi-value-number{font:900 var(--hmi-value-font,34px) Consolas,monospace;color:var(--hmi-fg,#183c5d);margin-top:6px;letter-spacing:.4px}.hmi-num-input input{width:100%;box-sizing:border-box;margin-top:8px;height:40px;border:1px solid var(--hmi-border,#91a7be);border-radius:4px;background:#fff;padding:0 10px;font:900 calc(var(--hmi-value-font,34px) * .72) Consolas,monospace;color:var(--hmi-fg,#173d60);outline:none}.hmi-num-input input:focus{border-color:var(--hmi-accent,#2f6fed);box-shadow:0 0 0 2px color-mix(in srgb,var(--hmi-accent,#2f6fed) 24%, #fff)}
.hmi-text-widget{height:100%;display:flex;align-items:center;padding:0 8px;font-weight:800;font-size:var(--hmi-font,18px);color:var(--hmi-fg,#33465e);text-align:var(--hmi-align,left);justify-content:flex-start}
.hmi-bar-widget{height:100%;border:1px solid var(--hmi-border,#9aa8b8);border-radius:7px;background:linear-gradient(180deg,#fff,var(--hmi-bg,#fafbfd));padding:12px 14px;box-shadow:0 1px 3px rgba(31,53,77,.07)}.hmi-bar-head b{font-size:calc(var(--hmi-font,18px) * .72);color:var(--hmi-fg,#4c5e75)}.hmi-bar-head span{font:900 calc(var(--hmi-font,18px) * .9) Consolas,monospace;color:var(--hmi-fg,#254e73)}.hmi-bar-track{height:24px;margin-top:10px;border:1px solid var(--hmi-border,#aab6c4);border-radius:4px;background:#e3e8ed;overflow:hidden;box-shadow:inset 0 1px 2px rgba(23,43,65,.12)}.hmi-bar-fill{height:100%;width:0;background:linear-gradient(90deg,var(--hmi-accent,#2e86bb),color-mix(in srgb,var(--hmi-accent,#2e86bb) 52%, #19a56d));transition:width .12s linear}.hmi-bar-scale{display:flex;justify-content:space-between;margin-top:6px;font:700 var(--hmi-small-font,12px) Consolas,monospace;color:#6f7e90}
.hmi-trend-widget{height:100%;border:1px solid var(--hmi-border,#9aa8b8);border-radius:7px;background:linear-gradient(180deg,#fdfefe,var(--hmi-bg,#f7fafc));padding:10px 12px;box-shadow:0 1px 3px rgba(31,53,77,.08);display:grid;grid-template-rows:30px minmax(0,1fr)}.hmi-trend-head b{font-size:calc(var(--hmi-font,18px) * .72);color:var(--hmi-fg,#455870)}.hmi-trend-head span{font:800 var(--hmi-small-font,12px) Consolas,monospace;color:#2d658f}.hmi-trend-chart{min-height:0;border:1px solid #ccd7e2;border-radius:4px;background:#fff}.hmi-trend-line{stroke:var(--hmi-accent,#2485b5);stroke-width:2.4}
.hmi-property-body{padding:10px}.hmi-property-empty>span{font-size:30px}.hmi-property-empty b{font-size:12.5px}.hmi-property-empty small{font-size:10.5px}.hmi-prop-section{border-radius:7px;margin-bottom:10px}.hmi-prop-section>h4{padding:8px 10px;font-size:10px}.hmi-prop-grid{grid-template-columns:78px 1fr;gap:8px;padding:10px}.hmi-prop-grid label{font-size:10px}.hmi-prop-grid input,.hmi-prop-grid select{height:32px;padding:0 8px;font-size:11.5px}.hmi-prop-grid input[type=color]{padding:2px;height:32px}.hmi-prop-geometry{gap:6px;padding:10px}.hmi-prop-geometry label{font-size:10px}.hmi-prop-geometry input{height:30px;font-size:11px}.hmi-prop-actions button{height:32px;font-size:11px}
@media(max-width:1450px){.hmi-editor-view{grid-template-columns:190px minmax(0,1fr) 260px}}

/* HMI interaction affordances */
body.hmi-run .hmi-push,body.hmi-run .hmi-toggle{cursor:pointer}
body.hmi-run .hmi-push:hover{filter:brightness(.98);box-shadow:0 3px 7px rgba(29,48,70,.18)}
body.hmi-run .hmi-toggle:hover{border-color:var(--hmi-accent,#2d8fc3)}
body.hmi-run .hmi-num-input input{cursor:text}
body.hmi-run .hmi-lamp,body.hmi-run .hmi-numeric,body.hmi-run .hmi-bar-widget,body.hmi-run .hmi-trend-widget{cursor:default}


/* HMI V1.2 — GT Designer-inspired object grammar + fit-to-workspace */
.hmi-stage-ruler b{margin-left:auto;font:800 10px Consolas,monospace;color:#52677f;border:1px solid #b9c5d2;background:#f8fafc;border-radius:10px;padding:3px 8px}
.hmi-canvas-scroll{padding:12px;justify-content:center;align-items:center;overflow:hidden}
.hmi-canvas-fit{position:relative;flex:0 0 auto}
.hmi-canvas{position:absolute;left:0;top:0;background-color:#e4e7eb;background-image:linear-gradient(#d2d7dc 1px,transparent 1px),linear-gradient(90deg,#d2d7dc 1px,transparent 1px);background-size:20px 20px}
body.hmi-run .hmi-canvas{background-color:#e4e7eb}

/* Object face: device binding belongs to Properties, not to operator-facing text. */
.hmi-screen-title{background:linear-gradient(180deg,var(--hmi-bg,#3a4b5f),color-mix(in srgb,var(--hmi-bg,#3a4b5f) 84%,#000));border:1px solid var(--hmi-border,#28394b);border-radius:2px;box-shadow:inset 0 1px rgba(255,255,255,.18)}
.hmi-screen-title b{font-size:var(--hmi-font,24px);font-weight:750}.hmi-screen-title small{font-size:10px;color:#d8e0e7}
.hmi-push{border:1px solid var(--hmi-border,#798694);border-bottom-width:3px;border-radius:3px;background:linear-gradient(#fff,var(--hmi-bg,#eef0f2));box-shadow:inset 0 1px #fff,0 1px 2px rgba(35,48,62,.18);font-size:var(--hmi-font,18px);font-weight:750;letter-spacing:.15px;color:var(--hmi-fg,#26394c)}
.hmi-push:active,.hmi-push.pressed{border-bottom-width:1px;background:linear-gradient(color-mix(in srgb,var(--hmi-accent,#2d69b2) 18%,#fff),color-mix(in srgb,var(--hmi-accent,#2d69b2) 32%,#fff));box-shadow:inset 0 2px 4px rgba(0,0,0,.13)}
.hmi-lamp{padding:5px 8px;gap:9px;border:0;background:transparent;box-shadow:none;border-radius:0}
.hmi-lamp-led{flex:0 0 auto;width:32px;height:32px;border:3px solid #626d78;background:var(--hmi-off,#7e8792);box-shadow:inset 0 0 0 4px color-mix(in srgb,var(--hmi-off,#7e8792) 50%,#fff),0 1px 2px rgba(0,0,0,.2)}
.hmi-lamp.square .hmi-lamp-led{border-radius:3px}.hmi-lamp.on .hmi-lamp-led{background:var(--hmi-on,#19b45d);border-color:color-mix(in srgb,var(--hmi-on,#19b45d) 52%,#000);box-shadow:inset 0 0 0 4px color-mix(in srgb,var(--hmi-on,#19b45d) 40%,#fff),0 0 8px color-mix(in srgb,var(--hmi-on,#19b45d) 45%,transparent)}
.hmi-lamp-label{font-size:var(--hmi-font,17px);font-weight:700;color:var(--hmi-fg,#263d54);line-height:1.08}
.hmi-toggle{padding:7px 10px;border:1px solid var(--hmi-border,#8794a2);border-radius:3px;background:linear-gradient(#fff,var(--hmi-bg,#f4f5f6));box-shadow:inset 0 1px #fff}.hmi-toggle>b{font-size:var(--hmi-font,17px);font-weight:700;color:var(--hmi-fg,#263d54)}
.hmi-toggle-switch{width:44px;height:22px;border-radius:12px}.hmi-toggle-switch:after{width:18px;height:18px}.hmi-toggle.on .hmi-toggle-switch:after{left:24px}
.hmi-numeric,.hmi-num-input{border:1px solid var(--hmi-border,#8794a2);border-radius:2px;background:var(--hmi-bg,#f4f5f6);padding:8px 10px;box-shadow:inset 0 1px #fff}
.hmi-value-head{min-height:18px;border-bottom:1px solid #c5cbd2;padding-bottom:4px}.hmi-value-head b{font-size:calc(var(--hmi-font,18px) * .72);font-weight:700;color:#46586b;text-transform:none;letter-spacing:.1px}
.hmi-value-number{margin-top:7px;padding:3px 8px;border:1px solid #949fa9;background:#fff;color:var(--hmi-fg,#15293c);text-align:right;font:700 var(--hmi-value-font,28px) Consolas,monospace;line-height:1.05;box-shadow:inset 1px 1px 2px rgba(0,0,0,.08)}
.hmi-num-input input{height:38px;margin-top:7px;border:1px solid #738ca7;border-radius:1px;background:#fff;text-align:right;font:700 calc(var(--hmi-value-font,28px) * .82) Consolas,monospace;box-shadow:inset 1px 1px 2px rgba(0,0,0,.08)}
.hmi-bar-widget{border:1px solid var(--hmi-border,#8794a2);border-radius:2px;background:var(--hmi-bg,#f4f5f6);padding:8px 10px;box-shadow:inset 0 1px #fff}.hmi-bar-head b{font-size:var(--hmi-font,16px);font-weight:700}.hmi-bar-head span{font:700 var(--hmi-font,16px) Consolas,monospace}.hmi-bar-track{height:26px;margin-top:7px;border:1px solid #758391;border-radius:1px;background:#d3d8dd}.hmi-bar-fill{background:var(--hmi-accent,#2382b4)}.hmi-bar-scale{margin-top:4px;font-size:10px}
.hmi-trend-widget{border:1px solid var(--hmi-border,#8794a2);border-radius:2px;background:var(--hmi-bg,#f4f5f6);padding:7px 8px;box-shadow:inset 0 1px #fff;grid-template-rows:26px minmax(0,1fr)}.hmi-trend-head{border-bottom:1px solid #c5cbd2}.hmi-trend-head b{font-size:var(--hmi-font,16px);font-weight:700}.hmi-trend-head span{font:700 13px Consolas,monospace;color:#314d68}.hmi-trend-chart{border:1px solid #8f9aa5;border-radius:0;background:#fff}.hmi-trend-grid{stroke:#d8dde2}.hmi-trend-line{stroke:var(--hmi-accent,#2382b4);stroke-width:2}
.hmi-text-widget{font-size:var(--hmi-font,16px);font-weight:650;justify-content:center;text-align:var(--hmi-align,center)}

.hmi-prop-section>h4{letter-spacing:.35px;color:#4f6277;background:#edf1f5}

/* Device Batch Monitor can be repositioned by dragging its title bar. */
.monitor-panel-header{cursor:move;user-select:none;touch-action:none}.monitor-panel-header button{cursor:pointer}.monitor-panel.dragging{box-shadow:0 22px 52px rgba(24,42,66,.34),0 2px 8px rgba(24,42,66,.16)}


/* Nano 1N full retain tester: compact controls while preserving readable text */
.hmi-toggle.compact{padding:3px 6px;gap:5px;border-radius:4px}.hmi-toggle.compact>b{font-size:13px;line-height:1}.hmi-toggle.compact .hmi-toggle-switch{width:30px;height:16px;flex:0 0 30px;border-radius:9px}.hmi-toggle.compact .hmi-toggle-switch:after{width:12px;height:12px;left:2px;top:2px}.hmi-toggle.compact.on .hmi-toggle-switch:after{left:16px}
.hmi-num-input.compact{padding:3px 5px;border-radius:4px;justify-content:flex-start}.hmi-num-input.compact .hmi-value-head{height:12px;line-height:12px}.hmi-num-input.compact .hmi-value-head b{font-size:10px;line-height:12px;letter-spacing:.15px}.hmi-num-input.compact input{height:21px;margin-top:1px;padding:0 4px;border-radius:3px;font:800 14px Consolas,monospace;text-align:right}

/* ============================================================
   ESmind PLC Studio — P0.2 safe visual foundation
   Brand, palette, focus/hover only. Matrix metrics unchanged.
   ============================================================ */
:root {
  --bg:#eaf0f6; --panel:#f7f9fc; --panel2:#eef3f8;
  --ink:#1b293b; --muted:#52657a; --line:#c6d2de; --line2:#dbe4ed;
  --navy:#172c45; --navy2:#243e5c; --blue:#2764b8; --blue2:#e9f2fd;
  --green:#16794e; --red:#b93240;
}
.titlebar{background:linear-gradient(90deg,#12283f 0%,#1e3b59 100%)}
.brand-mark{background:linear-gradient(140deg,#2c79b8,#16538f);box-shadow:inset 0 0 0 1px #ffffff38}
.brand-copy b{letter-spacing:.12px;font-weight:750}
.brand-copy small{color:#d1e1ee}
.menu-trigger:focus-visible,.icon-button:focus-visible,.component-menu:focus-visible,
.document-tab:focus-visible,.bottom-tab:focus-visible,.tree-row:focus-visible,
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
 outline:2px solid #2678cf;outline-offset:2px;
}
.menu-context{color:#52657a}
.target-chip{border-color:#ffffff38;background:#ffffff10}
.target-chip small{color:#d1e1ee}
.statusbar{background:#1e344d;color:#eaf1f8}
.statusbar span{color:#c4d2e0}
/* Preserve existing ladder symbols, electrical colors, raster and spacing. */

/* P0.3: GX-style one-line instruction labels; layout-only. */
.instruction-svg .instruction-op,.instruction-svg .instruction-operand{
  font-family:Consolas,"SFMono-Regular","Courier New",monospace;
  font-size:14px;font-weight:750;text-anchor:middle;dominant-baseline:auto;
  stroke:none;paint-order:normal;letter-spacing:0;
}
.instruction-svg .instruction-op{fill:#243e69}
.instruction-svg .instruction-operand{fill:#263d55}
.instruction-svg .instruction-live-value{font-family:Consolas,monospace;font-size:11px;font-weight:750}
/* Long identifiers and localized labels must not push primary controls aside. */
.toolbar button,.menubar button,.document-tab{min-width:0}
button:focus-visible,[role="button"]:focus-visible{outline:2px solid #2764b8;outline-offset:2px}

/* P0.4A — crisp GX-style instruction and Monitor typography. */
.instruction-svg .instruction-op,.instruction-svg .instruction-operand{
  font-family:Consolas,"Cascadia Mono","Courier New",monospace!important;
  font-weight:700!important;text-anchor:middle;letter-spacing:0!important;
  text-rendering:geometricPrecision;
}
.instruction-svg .instruction-live-value{font:700 10px Consolas,"Cascadia Mono",monospace!important;fill:#087a51;text-anchor:middle}
.instruction-svg .instruction-box{fill:#f8faff;stroke:#8297b0;stroke-width:1.5}
.matrix-cell.monitor-flow .instruction-box{stroke:#11855c;stroke-width:2.3}
.matrix-cell.monitor-flow .instruction-op{fill:#174d39}
.matrix-cell.monitor-condition-on .contact-device,.matrix-cell.monitor-device-on .device-main{font-weight:900!important}

/* P0.4B — Monitor data stays tied to its own operand, with restrained emphasis. */
.instruction-svg .instruction-live-value{font:700 10px Consolas,"Cascadia Mono",monospace!important;fill:#087351;pointer-events:auto}
.instruction-svg .instruction-live-value .instruction-live-text{fill:inherit}

/* P0.4C: unified ladder geometry, independent of Monitor state. */
:root{--cell-h:62px;--action-cell:280px}
@media(max-width:1500px){:root{--cell-h:62px;--action-cell:260px}}
@media(max-width:1400px){:root{--cell-h:62px;--action-cell:250px}}
@media(max-width:1320px){:root{--cell-h:62px;--action-cell:240px}}
.instruction-svg .instruction-op,.instruction-svg .instruction-operand{font-family:Consolas,"Cascadia Mono",monospace!important;font-weight:700!important;fill:#20364d;font-size:14px!important;letter-spacing:0!important}
.instruction-svg .instruction-live-value{font-family:Consolas,"Cascadia Mono",monospace!important;font-size:12px!important;font-weight:700!important;fill:#08744a!important}
.instruction-svg .instruction-box{rx:2}
#zoomLabel{height:26px;width:72px;min-width:72px;font:600 12px "Segoe UI",sans-serif;color:#233c54;background:#fff;border:1px solid #bdcbd9;border-radius:4px;margin:0 4px 4px 0;padding:0 5px}

.instruction-svg .instruction-op,.instruction-svg .instruction-operand{font-size:inherit!important}

/* P0.4F: equal-size single-line op/operand for SET/RST and STL */
.action-svg .device-inline-op,.action-svg .device-inline-operand{font-family:Consolas,"Courier New",monospace!important;font-size:15px!important;font-weight:800!important;dominant-baseline:auto;}
.step-svg .step-inline-op,.step-svg .step-inline-operand{font-family:Consolas,"Courier New",monospace!important;font-size:15px!important;font-weight:800!important;dominant-baseline:auto;}
/* Explicit anchors override older generic SVG text-anchor:middle rules */
.action-svg .device-inline-op,.step-svg .step-inline-op{text-anchor:end!important}
.action-svg .device-inline-operand,.step-svg .step-inline-operand{text-anchor:start!important}

/* P0.4G direct Ladder tools: append-only scoped override; other workspaces untouched. */
body:not(.view-hmi) .component-toolbar{gap:5px!important;padding:5px 8px!important;min-height:55px;align-items:center}
.ladder-quick-tools{display:flex;flex:0 0 auto;align-items:center;gap:3px;min-width:0}
.ladder-quick-tool{height:45px;min-width:46px;border:1px solid #cbd6e5;border-radius:6px;background:#fff;color:#24405f;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0;padding:2px 4px;cursor:pointer;white-space:nowrap}
.ladder-quick-tool svg{width:39px;height:26px;flex-shrink:0}.ladder-quick-tool span{font:600 10px/1.1 'Segoe UI',sans-serif;color:#344c68}
.ladder-quick-tool:hover{background:#edf4fc;border-color:#82a9df}.ladder-quick-tool.active{background:#dfedff;border:2px solid #3272c6;color:#1555a1}
.ladder-quick-tool:focus-visible{outline:2px solid #145fbd;outline-offset:2px}.ladder-tools-separator{width:1px;height:31px;background:#cbd6e5;margin:0 4px;flex-shrink:0}
body:not(.view-hmi) .component-toolbar .component-menu{height:44px!important;min-width:0!important;width:auto!important;flex:0 1 auto;padding:4px 7px!important;border-radius:6px;gap:5px!important;box-shadow:none!important}
body:not(.view-hmi) .component-toolbar .component-menu .component-icon{height:28px;width:28px;min-width:28px;font-size:11px;border-radius:5px}
body:not(.view-hmi) .component-toolbar .component-menu b{font:600 11px/1.2 'Segoe UI',sans-serif!important}
body:not(.view-hmi) .component-toolbar .component-menu small{display:none!important}
body:not(.view-hmi) .component-toolbar .component-menu>i{font-size:11px;margin-left:1px}
body:not(.view-hmi) .component-toolbar .mode-tool{height:44px!important;min-width:44px;padding:3px 6px}
body:not(.view-hmi) .component-toolbar .mode-tool b{font-size:10px!important}
body:not(.view-hmi) .component-toolbar .draft-summary{display:none!important}
@media(max-width:1370px){.ladder-quick-tool{min-width:41px;padding:2px}.ladder-quick-tool svg{width:36px}body:not(.view-hmi) .component-toolbar .component-menu{padding:3px 5px!important}body:not(.view-hmi) .component-toolbar .component-menu .component-icon{display:none}}
@media(max-width:1120px){.ladder-quick-tools{overflow-x:auto;max-width:48vw}.component-toolbar{overflow-x:auto}}
body.view-hmi .ladder-quick-tools,body.view-hmi .ladder-tools-separator{display:none!important}

/* P0.4H: edge contact readability and constrained tree labels; no Ladder geometry changes */
.contact-svg .edge-arrow{fill:none;stroke:#243d59;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.project-dock .tree-row{min-width:0;white-space:nowrap;overflow:hidden}
.project-dock .tree-row>span:not(.tree-badge):not(.twisty){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 1 auto}
.project-dock .tree-row>small{flex:0 0 auto;font-size:10px;white-space:nowrap}
.project-dock .tree-row>.tree-badge,.project-dock .tree-row>.twisty{flex:0 0 auto}
.project-dock .tree-row{font-size:12px}
.project-dock .tree-row.root>b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* At narrow widths prioritize complete HMI Screen label over redundant Screen 1 suffix. */
@media(max-width:1400px){.project-dock .tree-row[data-workspace-view="hmi"]>small{display:none}}

/* P0.4I — consolidated Ladder commands / reclaimed workspace.  Scoped, no PLC renderer changes. */
body:not(.view-hmi) .component-toolbar{gap:8px!important;padding:5px 10px!important}
body:not(.view-hmi) .component-toolbar .consolidated-instructions{height:45px!important;flex:0 0 auto;border-left:3px solid #8653d6;min-width:144px!important;padding:5px 9px!important}
body:not(.view-hmi) .component-toolbar .consolidated-instructions .component-icon{display:grid!important;width:33px!important;height:31px!important;font:700 17px Consolas,monospace!important}
body:not(.view-hmi) .component-toolbar .consolidated-instructions b{font-size:12px!important}
body:not(.view-hmi) .component-toolbar .compact-output-picker{display:none!important}
.bottom-dock.collapsed{overflow:hidden}
/* Reduce the dock's grid track as well as the contents; otherwise 126px remain unused. */
body:not(.view-hmi) .ide-shell:has(.bottom-dock.collapsed){grid-template-rows:48px 29px 58px 61px minmax(0,1fr) 32px 27px}
.bottom-tabs .bottom-tab:not([data-tab="problems"]){display:none}
.bottom-dock .dock-close{font-size:17px;font-weight:700;cursor:pointer}
.bottom-dock .bottom-tab{font-size:12px}
@media (max-width:1400px){body:not(.view-hmi) .ide-shell:has(.bottom-dock.collapsed){grid-template-rows:48px 29px 56px 60px minmax(0,1fr) 32px 27px}}
@media (max-width:1100px){body:not(.view-hmi) .component-toolbar{overflow-x:auto!important}body:not(.view-hmi) .component-toolbar .consolidated-instructions{min-width:131px!important}}

/* P0.4J — targeted readability repairs; preserve Matrix geometry/protocol. */
.ladder-quick-tool span{font:650 12px/1.05 "Segoe UI",Arial,sans-serif!important;letter-spacing:0!important}
.ladder-quick-tool{gap:1px!important}
.ladder-quick-tool svg{height:24px!important}
.project-dock .tree-row{gap:4px!important;padding-right:4px!important}
.project-dock .tree-row.level1{padding-left:9px!important}
.project-dock .tree-row.level2{padding-left:21px!important}
.project-dock .tree-row>span:not(.tree-badge):not(.twisty){flex:1 1 auto!important;min-width:0}
.project-dock .tree-row>small{max-width:54px;overflow:hidden;text-overflow:ellipsis;font-size:9.5px!important}
.project-dock .tree-row>.tree-badge{width:18px!important;min-width:18px!important;font-size:10px!important}
.target-summary div{display:grid!important;grid-template-columns:56px minmax(0,1fr)!important;gap:5px!important;align-items:start}
.target-summary b{text-align:right!important;font-size:11px!important;line-height:1.3;overflow-wrap:normal}
.target-summary span{font-size:11px!important}
.icon-button:disabled{opacity:.58!important}
.icon-button:disabled small{color:#65758a!important}
@media(max-width:1150px){.project-dock .tree-row>small{display:none!important}.project-dock .tree-row.level2{padding-left:15px!important}}

/* P0.4K — one coherent Ladder tool visual system; does not alter edit logic */
body:not(.view-hmi) .component-toolbar{gap:6px!important;min-height:65px!important;padding:5px 9px!important;align-items:center}
body:not(.view-hmi) .ladder-quick-tools{gap:4px!important;overflow:visible;max-width:none}
body:not(.view-hmi) .ladder-quick-tool{height:56px!important;min-width:61px!important;padding:4px 6px!important;gap:3px!important;justify-content:center!important;border-radius:7px!important}
body:not(.view-hmi) .ladder-quick-tool[data-quick="p"],body:not(.view-hmi) .ladder-quick-tool[data-quick="f"]{min-width:88px!important}
body:not(.view-hmi) .ladder-quick-tool[data-quick="h"],body:not(.view-hmi) .ladder-quick-tool[data-quick="v"]{min-width:96px!important}
body:not(.view-hmi) .ladder-quick-tool svg{height:25px!important;width:42px!important}
body:not(.view-hmi) .ladder-quick-tool span{font:600 11px/1.15 'Segoe UI',Arial,sans-serif!important;white-space:nowrap!important}
body:not(.view-hmi) .component-toolbar .consolidated-instructions{height:56px!important;min-width:118px!important;padding:3px 8px!important;gap:3px!important;display:flex;align-items:center}
body:not(.view-hmi) .component-toolbar .consolidated-instructions .component-icon{display:grid!important;min-width:34px!important;height:34px!important;width:34px!important;font-size:16px!important}
body:not(.view-hmi) .component-toolbar .consolidated-instructions b{font:650 11px/1.2 'Segoe UI',Arial,sans-serif!important}
body:not(.view-hmi) .component-toolbar .mode-tool{height:56px!important;min-width:74px!important;padding:4px 8px!important;border:1px solid #cbd6e5!important;border-radius:7px!important;background:#fff;display:flex;align-items:center;justify-content:center;gap:5px}
body:not(.view-hmi) .component-toolbar .mode-tool.active{background:#dfedff!important;border-color:#6096d9!important}
body:not(.view-hmi) .component-toolbar .mode-tool b{font-size:11px!important}
body:not(.view-hmi) .component-toolbar .mode-tool small{font-size:10px!important}
body:not(.view-hmi) .ladder-tools-separator{margin:0 3px!important}
body:not(.view-hmi) .component-toolbar .toolbar-divider{margin:0 2px!important}
/* Horizontal scrolling only in the tools strip on constrained viewports; never clip text inside tool buttons. */
@media(max-width:1290px){body:not(.view-hmi) .component-toolbar{overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin}body:not(.view-hmi) .ladder-quick-tools{flex-shrink:0;overflow:visible!important;max-width:none!important}}
.target-board-preview{margin:14px 10px 12px;padding:12px 8px 10px;background:#f5f8fc;border:1px solid #d4deeb;border-radius:9px;display:flex;flex-direction:column;align-items:center;gap:6px;flex-shrink:0}
.target-board-preview img{display:block;width:100%;max-width:132px;height:145px;object-fit:contain}
.target-board-caption{display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;min-width:0}
.target-board-caption b{font:700 12px/1.3 'Segoe UI',sans-serif;color:#243c59}
.target-board-caption span{font:400 10px/1.35 'Segoe UI',sans-serif;color:#536983;max-width:205px}
.project-dock{overflow-y:auto;min-height:0}
/* Detailed instruction-selection tiles, readable without tooltips */
.palette-popover .palette-tile b{font-size:12.5px!important;line-height:1.25!important}
.palette-popover .palette-tile small{font-size:11px!important;line-height:1.3!important}
.palette-popover .popover-head b{font-size:14px!important}
.palette-popover .popover-head small{font-size:11px!important}

/* P0.4L: Searchable instruction palette, compact and keyboard-readable. */
.palette-popover:has(.palette-search-row){width:min(500px,calc(100vw - 24px));min-width:0}
.palette-search-row{padding:10px 12px 5px;display:flex;flex-direction:column;gap:5px;background:#fff}
.palette-search-row input{width:100%;height:36px;min-width:0;border:1px solid #b4c3d6;border-radius:6px;padding:6px 10px;font:500 13px 'Segoe UI',Arial,sans-serif;color:#1d354c}
.palette-search-row input:focus{outline:2px solid #6b99dd;outline-offset:1px}
.palette-search-row span{font-size:11px;color:#53677e;line-height:1.4}
.palette-popover .palette-tile[hidden]{display:none!important}
@media(max-width:1100px){.palette-popover:has(.palette-search-row) .popover-body{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* P0.4M: board identification thumbnail and full-resolution pin map */
.target-board-preview{width:calc(100% - 20px);font-family:inherit;cursor:zoom-in;text-align:center;margin-top:auto!important;min-height:0}
.target-board-preview img{max-width:105px!important;height:172px!important;object-fit:contain!important}
.target-board-preview:hover{border-color:#6e9cce;box-shadow:0 0 0 2px #3181d010}
.target-board-preview:focus-visible{outline:3px solid #2477c9;outline-offset:2px}
.target-board-caption{display:flex;flex-direction:column;gap:4px;align-items:center}
.board-pinout-backdrop{position:fixed;inset:0;z-index:250;background:rgba(9,21,39,.82);display:flex;align-items:center;justify-content:center;padding:16px}
.board-pinout-backdrop.hidden{display:none}
.board-pinout-window{width:min(1500px,98vw);height:min(98vh,1200px);display:flex;flex-direction:column;min-height:0;background:#f5f8fc;border-radius:9px;overflow:hidden;box-shadow:0 24px 70px #0008}
.board-pinout-header{height:48px;min-height:48px;background:#173451;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 10px 0 19px;font:600 15px 'Segoe UI',Arial,sans-serif}
#boardPinoutClose{width:40px;height:38px;border:0;border-radius:6px;background:transparent;color:#fff;font:normal 31px/1 Arial;cursor:pointer}
#boardPinoutClose:hover,#boardPinoutClose:focus-visible{background:#ffffff2e;outline:2px solid #a8d2ff}
.board-pinout-body{flex:1;min-height:0;overflow:auto;display:flex;align-items:center;justify-content:center;padding:9px}
.board-pinout-body img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
@media(max-height:650px){.target-board-preview img{height:95px!important}.target-board-caption span{display:none}.board-pinout-backdrop{padding:5px}}

/* P0.4N: Search results and STL marker monitor are presentation-only. */
.palette-search-results{max-height:260px;overflow-y:auto;display:none;margin-top:6px}
.palette-result{width:100%;display:flex;justify-content:space-between;gap:12px;align-items:center;text-align:left;padding:9px 11px;background:#fff;border:0;border-bottom:1px solid #e1e7ef;color:#1f3551;font:600 12px 'Segoe UI',sans-serif;cursor:pointer}
.palette-result:hover,.palette-result:focus-visible{background:#eaf2fe;outline:1px solid #8cb5ee}
.palette-result b{font:700 13px Consolas,monospace}.palette-result span{font-size:11px;color:#596b80}
.palette-no-results{padding:12px;color:#65778b;font-size:12px}
.matrix-cell.step-auto-wire.monitor-flow .wire-stroke,.matrix-cell:has(.step-svg).monitor-flow .wire-stroke{stroke:var(--monitor-green)!important;stroke-width:4.3px!important}
.matrix-cell:has(.step-svg).monitor-flow .step-box{stroke:var(--monitor-green)!important;stroke-width:2.4px!important}
.row-header.stl-monitor-active{background:#e4f6ec!important;color:#0d7145!important}

.rail-cell.stl-monitor-active::before,.rail-cell.stl-monitor-active::after{background:var(--monitor-green)!important;}


/* HMI-01A: scoped design foundation; does not change PLC execution, widget IDs, bindings or canvas geometry. */
:root{--hmi-accent:#2866b0;--hmi-ink:#24364b;--hmi-muted:#566a80;--hmi-border:#cfd9e4;--hmi-surface:#ffffff;--hmi-soft:#f4f7fb}
.hmi-editor-view{grid-template-columns:218px minmax(0,1fr) 292px!important;background:#e8edf4}
.hmi-toolbox-panel,.hmi-properties-panel{background:#f7f9fc}
.hmi-panel-title{background:#eaf0f7;border-bottom:1px solid var(--hmi-border);height:51px;flex-basis:51px;padding:0 13px}
.hmi-panel-title b{font-size:13.5px;line-height:1.25;color:#233b56;font-weight:750}
.hmi-panel-title small{font-size:11.5px;line-height:1.2;color:#61748a;margin-top:3px}
.hmi-panel-title>span{font-size:10px;letter-spacing:0;background:#fff;border-color:#d0deed;color:#526e8e}
.hmi-tool-list{padding:11px;gap:8px;grid-template-columns:minmax(0,1fr)}
.hmi-tool-list button{min-height:57px;padding:9px 11px;gap:11px;border-radius:9px;border:1px solid #d9e2ed;background:#fff;color:#253b53;box-shadow:0 1px 2px rgba(29,50,76,.035);transition:background-color .12s,border-color .12s,box-shadow .12s}
.hmi-tool-list button:hover{background:#f0f6ff;border-color:#8ab2e2;box-shadow:0 2px 8px rgba(39,90,155,.09)}
.hmi-tool-list button:focus-visible{outline:2px solid var(--hmi-accent);outline-offset:1px}
.hmi-tool-list button b{font-size:12.5px;line-height:1.25;font-weight:700}
.hmi-tool-list button small{font-size:11px;line-height:1.2;margin-top:3px;color:#64788d;display:block}
.hmi-tool-glyph{width:36px;height:36px;flex:0 0 36px;font-size:15px;border:1px solid #dae6f2;border-radius:9px;background:#eef4fc}
.hmi-tool-note{margin:6px 10px 10px;border-radius:8px;padding:11px 12px;background:#ebf3fc;border-color:#d4e2f1}
.hmi-tool-note b{font-size:11.5px;color:#315270}.hmi-tool-note span{font-size:11px;line-height:1.45;color:#536c86}
.hmi-property-body{padding:12px}.hmi-property-empty b{font-size:13px}.hmi-property-empty small{font-size:11.5px;line-height:1.5}
.hmi-prop-section{border-radius:8px;border-color:#d6e0ea;margin-bottom:10px;box-shadow:0 1px 2px rgba(31,53,77,.03)}
.hmi-prop-section>h4{font-size:11px;line-height:1.4;letter-spacing:.35px;padding:9px 10px;background:#eef3f9;color:#486078}
.hmi-prop-grid{grid-template-columns:86px minmax(0,1fr);gap:9px;padding:11px}
.hmi-prop-grid label{font-size:11.5px;line-height:1.3;color:#485d72}
.hmi-prop-grid input,.hmi-prop-grid select{font-size:12px;height:34px;padding:0 8px}
.hmi-prop-geometry{padding:11px;gap:8px}.hmi-prop-geometry label{font-size:11px}.hmi-prop-geometry input{height:32px;font-size:12px}
.hmi-prop-actions button{height:34px;font-size:11.5px}
.hmi-canvas-stage{background:#e5ebf2}.hmi-stage-ruler{background:#f1f5fa;border-color:#d1dce8;padding:0 15px}
.hmi-stage-ruler span{font-size:12px;color:#25425f;letter-spacing:.3px}.hmi-stage-ruler small{font-size:11.5px;color:#617589}
.hmi-canvas{box-shadow:0 12px 30px rgba(27,43,63,.16),0 1px 3px rgba(27,43,63,.12)}
.hmi-main-toolbar{gap:10px}.hmi-toolbar-brand b{font-size:14px}.hmi-toolbar-brand small{font-size:11px}
@media(max-width:1450px){.hmi-editor-view{grid-template-columns:196px minmax(0,1fr) 255px!important}}
@media(max-width:1180px){.hmi-editor-view{grid-template-columns:174px minmax(0,1fr) 220px!important}.hmi-tool-list{padding:7px;gap:5px}.hmi-tool-list button{padding:7px;gap:7px;min-height:49px}.hmi-tool-list button small{display:block;font-size:10.5px}.hmi-prop-grid{grid-template-columns:70px minmax(0,1fr);gap:6px;padding:8px}}

/* HMI-01B: widget visual consistency only. No project-schema or PLC behavior changes. */
.hmi-widget-inner{box-sizing:border-box;min-width:0;min-height:0;overflow:hidden}
.hmi-widget-inner.hmi-push{border-radius:8px;border:1px solid var(--hmi-border,#a5b6c9);border-bottom-width:3px;background:linear-gradient(180deg,#fff 0%,var(--hmi-bg,#edf3f9) 100%);box-shadow:0 1px 3px rgba(22,45,73,.11);font-size:clamp(12px,var(--hmi-font,18px),28px);line-height:1.15;padding:3px 8px;text-align:center}
.hmi-widget-inner.hmi-push:focus-visible{outline:2px solid #2866b0;outline-offset:2px}
.hmi-widget-inner.hmi-lamp{background:var(--hmi-bg,#fff);border:1px solid var(--hmi-border,#d3dfeb);border-radius:8px;padding:5px 9px;gap:9px}
.hmi-widget-inner.hmi-lamp .hmi-lamp-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(12px,var(--hmi-font,17px),25px);line-height:1.22}
.hmi-widget-inner.hmi-lamp .hmi-lamp-led{width:26px;height:26px;flex:0 0 26px}
.hmi-widget-inner.hmi-toggle{border-radius:8px;border-color:var(--hmi-border,#c7d6e5);box-shadow:0 1px 3px rgba(22,45,73,.06)}
.hmi-widget-inner.hmi-toggle>b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(12px,var(--hmi-font,17px),24px)}
.hmi-widget-inner.hmi-toggle .hmi-toggle-switch{flex-shrink:0}
.hmi-widget-inner.hmi-numeric,.hmi-widget-inner.hmi-num-input{border-radius:8px;background:linear-gradient(180deg,#fff,var(--hmi-bg,#f0f5fa));box-shadow:0 1px 4px rgba(22,45,73,.07);min-width:0}
.hmi-widget-inner .hmi-value-head b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:clamp(10px,calc(var(--hmi-font,18px) * .65),16px)}
.hmi-widget-inner .hmi-value-number{font-size:clamp(16px,var(--hmi-value-font,28px),40px);font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.14}
.hmi-widget-inner.hmi-num-input input{min-width:0;max-width:100%;box-sizing:border-box;font-variant-numeric:tabular-nums}
.hmi-widget-inner.hmi-bar-widget,.hmi-widget-inner.hmi-trend-widget{border-radius:8px;border-color:var(--hmi-border,#c5d5e5);box-shadow:0 1px 4px rgba(22,45,73,.06)}
.hmi-widget-inner .hmi-bar-head{gap:5px;min-width:0}
.hmi-widget-inner .hmi-bar-head b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hmi-widget-inner .hmi-bar-scale{font-size:clamp(10px,var(--hmi-small-font,12px),13px)}
.hmi-widget-inner .hmi-trend-head{gap:5px;min-width:0}
.hmi-widget-inner .hmi-trend-head b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hmi-widget-inner .hmi-trend-chart{min-height:0;overflow:hidden;border-radius:5px}
.hmi-widget.selected>.hmi-widget-inner{outline:1px solid rgba(40,102,176,.35);outline-offset:-1px}
/* Keep deliberately compact HMI retain-test widgets compact. */
.hmi-widget-inner.hmi-toggle.compact{padding:3px 6px}
.hmi-widget-inner.hmi-toggle.compact>b{font-size:13px}
.hmi-widget-inner.hmi-num-input.compact{padding:3px 5px}
.hmi-widget-inner.hmi-num-input.compact input{height:21px;margin-top:1px;font-size:14px}

/* HMI-01C: palette clarity and designer density; no widget rendering/PLC behavior changes. */
.hmi-tool-list{align-content:start;grid-auto-rows:max-content;scrollbar-gutter:stable;padding:10px 10px 16px;gap:7px}
.hmi-library-group{font:750 10.5px/1.35 "Segoe UI",Arial,sans-serif;letter-spacing:.45px;text-transform:uppercase;color:#526981;padding:11px 5px 3px;margin-top:1px;border-top:1px solid #dbe3ed}
.hmi-library-group:first-child{border-top:0;padding-top:3px}
.hmi-tool-list button{min-width:0;min-height:54px;border-radius:8px;transition:background .12s,border-color .12s,box-shadow .12s}
.hmi-tool-list button b{font-size:12.5px;overflow-wrap:anywhere}
.hmi-tool-list button small{font-size:10.8px;line-height:1.25}
.hmi-tool-list button:active{background:#e4efff}
.hmi-tool-list button:focus-visible{outline:2px solid #2767b3;outline-offset:1px}
.hmi-panel-title>span{font-size:11px}
.hmi-property-body{scrollbar-gutter:stable}
.hmi-property-empty{min-height:116px}
.hmi-stage-ruler b{font-variant-numeric:tabular-nums}
@media(max-width:1180px){.hmi-tool-list{padding:7px 6px 12px;gap:6px}.hmi-library-group{font-size:10px}.hmi-tool-list button{min-height:49px}.hmi-tool-list button b{font-size:12px}.hmi-tool-list button small{font-size:10px}}


/* HMI-02 Professional Controls & Indicators: intentionally scoped to opt-in
   preset classes. Legacy project widgets remain on the classic path. */
.hmi-widget-inner.hmi-push.hmi-style-modern{
 background:linear-gradient(180deg,color-mix(in srgb,var(--hmi-bg) 88%,#fff),var(--hmi-bg));
 color:var(--hmi-fg);border:1px solid var(--hmi-border);border-bottom-width:3px;
 border-radius:9px;box-shadow:0 3px 8px rgba(20,52,86,.17),inset 0 1px rgba(255,255,255,.22);
 font-weight:750;letter-spacing:.15px
}
.hmi-widget-inner.hmi-push.hmi-style-modern.pressed{filter:brightness(.88);transform:translateY(1px)}
.hmi-widget-inner.hmi-push.hmi-style-raised{border:2px solid var(--hmi-border);border-bottom-width:5px;border-radius:12px;background:linear-gradient(180deg,#fff,var(--hmi-bg));color:var(--hmi-fg);box-shadow:inset 0 1px #fff,0 4px 10px rgba(24,48,73,.16);font-weight:800}
.hmi-widget-inner.hmi-push.hmi-style-raised.pressed{border-bottom-width:2px;box-shadow:inset 0 3px 5px rgba(14,42,70,.15)}
.hmi-widget-inner.hmi-push.hmi-style-round{max-width:none;border-radius:999px;max-height:none;aspect-ratio:auto;border:4px solid color-mix(in srgb,var(--hmi-border) 65%,#fff);background:radial-gradient(circle at 35% 20%,color-mix(in srgb,var(--hmi-bg) 75%,#fff),var(--hmi-bg));color:var(--hmi-fg);box-shadow:inset 0 3px 9px rgba(255,255,255,.28),0 3px 8px rgba(22,45,73,.24);font-weight:800}
.hmi-widget-inner.hmi-push.hmi-style-round.pressed{filter:brightness(.87)}
.hmi-widget-inner.hmi-push.hmi-style-dark{border-radius:7px;border:1px solid #314c66;border-bottom:3px solid #172c42;background:linear-gradient(180deg,#3a556f,#1e3449);color:#eff8ff;box-shadow:0 3px 9px rgba(15,34,54,.27);font-weight:800;letter-spacing:.4px}
.hmi-widget-inner.hmi-lamp.hmi-style-pilot{background:linear-gradient(180deg,#fff,var(--hmi-bg));border:1px solid var(--hmi-border);border-radius:10px;box-shadow:0 2px 5px rgba(19,48,77,.1);padding:5px 10px}
.hmi-widget-inner.hmi-lamp.hmi-style-pilot .hmi-lamp-led{width:32px;height:32px;flex:0 0 32px;border:4px solid #6b7d8e;box-shadow:inset 0 0 0 4px rgba(255,255,255,.2),0 2px 3px rgba(10,30,50,.2)}
.hmi-widget-inner.hmi-lamp.hmi-style-led{background:transparent;border:0;box-shadow:none}
.hmi-widget-inner.hmi-lamp.hmi-style-led .hmi-lamp-led{width:17px;height:17px;flex:0 0 17px;border:2px solid #77899b;box-shadow:none}
.hmi-widget-inner.hmi-lamp.hmi-style-led.on .hmi-lamp-led{box-shadow:0 0 0 3px color-mix(in srgb,var(--hmi-on) 18%,transparent),0 0 8px color-mix(in srgb,var(--hmi-on) 35%,transparent)}
.hmi-widget-inner.hmi-lamp.hmi-style-square{background:var(--hmi-bg);border:1px solid var(--hmi-border);border-radius:6px}
.hmi-widget-inner.hmi-lamp.hmi-style-square .hmi-lamp-led{border-radius:4px;width:30px;height:30px;flex:0 0 30px}
.hmi-widget-inner.hmi-lamp.hmi-style-status{background:linear-gradient(180deg,#f8fbfe,#ebf2f9);border:1px solid #a6bcce;border-left:4px solid var(--hmi-off);border-radius:5px;padding:5px 8px}
.hmi-widget-inner.hmi-lamp.hmi-style-status.on{border-left-color:var(--hmi-on)}
.hmi-widget-inner.hmi-lamp.hmi-style-status .hmi-lamp-led{width:11px;height:11px;flex:0 0 11px;border:1px solid #8c9bab;box-shadow:none}
.hmi-widget-inner.hmi-toggle.hmi-style-modern{border-radius:11px;background:linear-gradient(#fff,var(--hmi-bg));border:1px solid var(--hmi-border);box-shadow:0 2px 5px rgba(20,48,73,.1)}
.hmi-widget-inner.hmi-toggle.hmi-style-modern .hmi-toggle-switch{width:48px;height:26px;border-radius:15px}
.hmi-widget-inner.hmi-toggle.hmi-style-modern .hmi-toggle-switch:after{width:22px;height:22px}
.hmi-widget-inner.hmi-toggle.hmi-style-modern.on .hmi-toggle-switch:after{left:24px}
.hmi-widget-inner.hmi-toggle.hmi-style-rocker{border-radius:6px;background:linear-gradient(160deg,#dae4ec,#f5f8fb);border:2px solid var(--hmi-border);box-shadow:inset 0 1px #fff,0 2px 4px #162f4918}
.hmi-widget-inner.hmi-toggle.hmi-style-rocker .hmi-toggle-switch{width:40px;height:30px;border-radius:4px;background:#a8b7c6;border:2px solid #8b9bad;box-shadow:inset 0 3px 5px #243e541e}
.hmi-widget-inner.hmi-toggle.hmi-style-rocker .hmi-toggle-switch:after{width:17px;height:24px;border-radius:3px;top:1px;left:1px;background:linear-gradient(#fff,#d4dce5)}
.hmi-widget-inner.hmi-toggle.hmi-style-rocker.on .hmi-toggle-switch:after{left:19px}
.hmi-widget-inner.hmi-toggle.hmi-style-selector{border-radius:8px;background:linear-gradient(#eef3f8,#fff);border:1px solid var(--hmi-border)}
.hmi-widget-inner.hmi-toggle.hmi-style-selector .hmi-toggle-switch{width:39px;height:39px;border-radius:50%;border:3px solid #8c9cae;background:radial-gradient(circle,#edf2f5,#b0c0d0);box-shadow:inset 0 0 0 3px #fff,0 2px 5px #122f4c2e}
.hmi-widget-inner.hmi-toggle.hmi-style-selector .hmi-toggle-switch:after{width:8px;height:24px;left:13px;top:4px;border-radius:4px;background:#385671;transform:rotate(-38deg);transform-origin:50% 75%}
.hmi-widget-inner.hmi-toggle.hmi-style-selector.on .hmi-toggle-switch:after{left:13px;transform:rotate(38deg)}
.hmi-style-gallery-section{margin-top:6px}
.hmi-style-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;padding:10px}
.hmi-style-choice{display:flex;align-items:center;flex-direction:column;gap:5px;border:1px solid #d0dce8;background:#fff;border-radius:8px;padding:9px 5px;min-width:0;min-height:70px;cursor:pointer;font:650 11px Segoe UI,Tahoma,sans-serif;color:#29445c;text-align:center}
.hmi-style-choice:hover{border-color:#638bb8;background:#f4f8fc}
.hmi-style-choice.active{background:#eaf3ff;border-color:#2868b5;box-shadow:inset 0 0 0 1px #2868b5}
.hmi-style-choice:focus-visible{outline:2px solid #2868b5;outline-offset:2px}
.hmi-style-sample{display:flex;justify-content:center;align-items:center;height:29px;min-width:43px;padding:0 7px;font-size:14px;font-weight:800}
.hmi-style-sample-button.hmi-preview-modern{background:#2868b5;color:#fff;border-radius:6px}
.hmi-style-sample-button.hmi-preview-raised{background:linear-gradient(#fff,#d6e2ef);border:2px solid #90a5ba;border-radius:7px}
.hmi-style-sample-button.hmi-preview-round{background:#18845e;border:3px solid #91c9b5;color:#fff;border-radius:50%}
.hmi-style-sample-button.hmi-preview-dark{background:#253e58;color:#fff;border-radius:4px}
.hmi-style-sample-lamp.hmi-preview-pilot{color:#168a66;text-shadow:0 0 6px #3cd69d;font-size:24px}
.hmi-style-sample-lamp.hmi-preview-led{color:#168a66;font-size:17px}
.hmi-style-sample-lamp.hmi-preview-square{color:#168a66;background:#dff5e9;border:2px solid #8fc8ab;border-radius:4px}
.hmi-style-sample-lamp.hmi-preview-status{color:#168a66;background:#edf4f9;border-left:4px solid #168a66;border-radius:3px}
.hmi-style-sample-toggle.hmi-preview-rocker{color:#40556b;background:#d3e0eb;border:2px solid #9aafc2;border-radius:4px}
.hmi-style-sample-toggle.hmi-preview-selector{color:#40556b;background:#e5edf5;border:3px solid #aebfcd;border-radius:50%}
.hmi-style-sample-toggle.hmi-preview-modern{color:#168a66;background:#e3f4ec;border-radius:16px}
.hmi-style-caption{font-size:10.5px;line-height:1.45;color:#64788b;padding:0 10px 11px;margin:0}
@media(max-width:1200px){.hmi-style-gallery{gap:5px;padding:7px}.hmi-style-choice{font-size:10.5px}}

/* HMI-03 industrial SVG graphics: skin-only isolation. Classic widgets unchanged. */
.hmi-widget-inner.hmi-graphic-widget{display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;filter:none;min-width:0;overflow:hidden!important;color:inherit}
.hmi-widget-inner.hmi-graphic-widget:before,.hmi-widget-inner.hmi-graphic-widget:after{content:none!important}
.hmi-industrial-svg{display:block;width:100%;height:100%;max-width:100%;max-height:100%;flex:1 1 auto;pointer-events:none;overflow:visible}
.hmi-widget-inner.hmi-graphic-widget.pressed{transform:none!important}
.hmi-style-preview{width:100%;height:60px;display:block;overflow:hidden;pointer-events:none}
.hmi-style-preview>.hmi-widget-inner{width:100%;height:100%;pointer-events:none}
.hmi-style-preview .hmi-push,.hmi-style-preview .hmi-lamp,.hmi-style-preview .hmi-toggle{font-size:12px}
.hmi-style-choice{min-height:104px;gap:6px;padding:8px 5px}
.hmi-style-choice .hmi-style-name{font-size:11.3px;line-height:1.25;min-height:27px;display:flex;align-items:center;justify-content:center}
.hmi-style-gallery{gap:8px;padding:9px;grid-template-columns:repeat(2,minmax(0,1fr))}
.hmi-style-gallery-section h4{font-size:11px}
@media(max-width:1200px){.hmi-style-preview{height:54px}.hmi-style-choice{min-height:96px}.hmi-style-choice .hmi-style-name{font-size:10.5px}}

/* HMI-04: visual feedback and responsive Run screen. Designers keep the existing 3-pane editor. */
body.view-hmi.hmi-run .hmi-editor-view{grid-template-columns:minmax(0,1fr)!important}
body.view-hmi.hmi-run .hmi-toolbox-panel,body.view-hmi.hmi-run .hmi-properties-panel{display:none!important}
body.view-hmi.hmi-run .hmi-canvas-stage{min-width:0;min-height:0}
body.view-hmi.hmi-run .hmi-canvas-scroll{padding:6px;justify-content:center;align-items:center;overflow:auto}
body.hmi-run .hmi-widget-inner.hmi-graphic-widget{cursor:pointer}
body.hmi-run .hmi-widget-inner.hmi-graphic-widget:focus-visible{outline:3px solid #4aa3ec;outline-offset:1px}
.hmi-canvas-stage:fullscreen{display:grid;grid-template-rows:38px minmax(0,1fr);width:100vw;height:100vh;background:#dce4ec}
.hmi-canvas-stage:fullscreen .hmi-canvas-scroll{padding:8px;overflow:hidden;justify-content:center;align-items:center}
.hmi-canvas-stage:fullscreen .hmi-stage-ruler{background:#eaf1f7}
.hmi-industrial-svg[data-state="pressed"]{filter:drop-shadow(0 0 3px rgba(35,106,165,.35))}
.hmi-industrial-svg[data-state="unknown"]{filter:saturate(.5)}
@media(max-width:1180px){#hmiFullscreenBtn{font-size:11px;padding:5px 7px}}

/* HMI-04: color-state properties also apply to Classic skins (not only SVG skins). */
.hmi-widget-inner.hmi-lamp:not(.hmi-graphic-widget) .hmi-lamp-led{background:var(--hmi-off,#9099a6)}
.hmi-widget-inner.hmi-lamp:not(.hmi-graphic-widget).on .hmi-lamp-led{background:var(--hmi-on,#20c46b);border-color:color-mix(in srgb,var(--hmi-on,#20c46b) 72%,#142d40)}
.hmi-widget-inner.hmi-toggle:not(.hmi-graphic-widget) .hmi-toggle-switch{background:var(--hmi-off,#9099a6)}
.hmi-widget-inner.hmi-toggle:not(.hmi-graphic-widget).on .hmi-toggle-switch{background:var(--hmi-on,#20c46b)}
/* HMI-04 visual QA: keep the Object Library heading single-line at narrow widths. */
.hmi-panel-title>div{min-width:0;overflow:hidden}
.hmi-panel-title>div>b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hmi-panel-title>div>small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hmi-panel-title>span{flex-shrink:0}
@media(max-width:1180px){.hmi-toolbox-panel .hmi-panel-title>span{display:none}}

/* HMI-04: make appearance controls effective for numeric, charts and state colors. */
.hmi-widget-inner.hmi-numeric .hmi-value-number{color:var(--hmi-fg,#15293c)}
.hmi-widget-inner.hmi-num-input input{color:var(--hmi-fg,#15293c);border-color:var(--hmi-border,#91a7be)}
.hmi-widget-inner.hmi-numeric .hmi-value-head b,.hmi-widget-inner.hmi-num-input .hmi-value-head b{color:var(--hmi-fg,#5b6a7d)}
.hmi-widget-inner.hmi-bar-widget .hmi-bar-fill{background:linear-gradient(90deg,var(--hmi-accent,#2382b4),color-mix(in srgb,var(--hmi-accent,#2382b4) 75%,#fff))}
.hmi-widget-inner.hmi-trend-widget .hmi-trend-line{stroke:var(--hmi-accent,#2382b4)}
.hmi-widget-inner.hmi-text-widget{color:var(--hmi-fg,#33465e)}
.hmi-industrial-svg[data-state="unknown"]{filter:saturate(.58)}

/* HMI-04: consistent colors/states for classic legacy controls too. */
.hmi-widget-inner.hmi-push:not(.hmi-graphic-widget).pressed{box-shadow:inset 0 3px 6px #152e4629,0 0 0 2px var(--hmi-press,#55bdf4)}
.hmi-widget-inner.hmi-push:not(.hmi-graphic-widget).feedback-on{border-color:var(--hmi-on,#20c46b)}
.hmi-widget-inner.hmi-push:not(.hmi-graphic-widget).unknown{border-color:var(--hmi-unknown,#8996a5)}
.hmi-widget-inner.hmi-lamp:not(.hmi-graphic-widget).unknown .hmi-lamp-led{background:var(--hmi-unknown,#8996a5);border-color:#697f90;box-shadow:none}
.hmi-widget-inner.hmi-toggle:not(.hmi-graphic-widget).unknown .hmi-toggle-switch{background:var(--hmi-unknown,#8996a5)}

/* HMI-05 original industrial graphics; no externally copied artwork. */
.hmi-real-thumbnail{width:62px!important;height:42px!important;flex:0 0 62px!important;border:0!important;background:transparent!important;padding:0!important;overflow:hidden;display:flex!important;align-items:center;justify-content:center}
.hmi-real-thumbnail>.hmi-widget-inner{width:60px!important;height:40px!important;min-height:0!important;min-width:0!important;pointer-events:none!important;font-size:7px!important;overflow:hidden!important}
.hmi-real-thumbnail .hmi-industrial-svg,.hmi-real-thumbnail .hmi-library-svg,.hmi-real-thumbnail .hmi-gauge-svg{width:100%!important;height:100%!important}
.hmi-real-thumbnail .hmi-widget-inner.hmi-num-input input,.hmi-real-thumbnail .hmi-widget-inner.hmi-numeric .hmi-value-number{font-size:9px!important;padding:0!important}
.hmi-real-thumbnail .hmi-widget-inner .hmi-value-head{font-size:6px!important;min-height:0!important;padding:0!important}
.hmi-real-thumbnail .hmi-widget-inner.hmi-bar-widget .hmi-bar-scale{display:none}
.hmi-real-thumbnail .hmi-widget-inner.hmi-trend-widget .hmi-trend-head{font-size:6px}
.hmi-style-preview>.hmi-widget-inner{width:100%;height:100%}
.hmi-style-preview .hmi-gauge-svg{max-height:100%;max-width:100%}
.hmi05-gauge{display:grid!important;place-items:center!important;border:0!important;background:transparent!important;overflow:hidden!important}
.hmi05-gauge .hmi-gauge-svg{width:100%;height:100%;display:block;pointer-events:none}
.hmi05-value-panel{background:linear-gradient(148deg,#c6d0d9 0%,#f7fafc 16%,var(--hmi-bg,#ecf0f4) 84%,#b9c9d5 100%)!important;border:2px solid var(--hmi-border,#74899d)!important;border-radius:8px!important;padding:7px 10px!important;box-shadow:inset 0 1px 0 #fff,0 2px 4px #20384a35!important}
.hmi05-value-panel .hmi-value-head{margin:0 0 4px!important;color:var(--hmi-fg)!important;letter-spacing:.8px;flex:0 0 auto}
.hmi05-value-panel .hmi-value-number,.hmi05-value-panel input[data-hmi-number-input]{background:#122b3e!important;border:1px solid #081925!important;border-radius:4px!important;box-shadow:inset 0 2px 5px #0008,0 1px 0 #fff9!important;color:#abefce!important;text-shadow:0 0 4px #4a9e8b55;letter-spacing:.7px;font-family:Consolas,'Segoe UI',monospace;font-variant-numeric:tabular-nums;text-align:right!important;min-width:0;display:block;width:100%;box-sizing:border-box;padding:3px 8px!important;line-height:1.25!important}
.hmi05-value-panel input[data-hmi-number-input]:not([readonly]):focus{outline:2px solid var(--hmi-accent);outline-offset:0}
.hmi05-value-panel.hmi05-lcd .hmi-value-number,.hmi05-value-panel.hmi05-lcd input[data-hmi-number-input]{background:#c3d5ad!important;color:#344b29!important;text-shadow:none;border-color:#768a69!important}
.hmi05-value-panel.hmi05-bezel{background:linear-gradient(140deg,#e8edf1,#90a4b3 45%,#dce5eb)!important;border-width:3px!important}
.hmi05-value-panel.hmi05-bezel .hmi-value-number,.hmi05-value-panel.hmi05-bezel input[data-hmi-number-input]{color:#ffc86c!important}
.hmi05-bar{border:2px solid var(--hmi-border)!important;background:linear-gradient(155deg,#f8fbfc,var(--hmi-bg))!important;box-shadow:0 2px 5px #18304721,inset 0 1px #fff!important;border-radius:7px!important;overflow:hidden}
.hmi05-bar .hmi-bar-track{background:#102334!important;border:2px solid #203f54!important;border-radius:4px!important;box-shadow:inset 0 2px 5px #0615259c!important;overflow:hidden;position:relative}
.hmi05-bar .hmi-bar-fill{background:linear-gradient(180deg,color-mix(in srgb,var(--hmi-accent) 60%,#fff),var(--hmi-accent),color-mix(in srgb,var(--hmi-accent) 65%,#062136))!important;box-shadow:inset 0 1px #ffffff55,0 0 7px color-mix(in srgb,var(--hmi-accent) 60%,transparent)}
.hmi05-bar.hmi05-segmented .hmi-bar-track:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(10% - 3px),#071a2a calc(10% - 3px),#071a2a 10%);pointer-events:none}
.hmi05-bar.hmi05-vertical{display:flex!important;flex-direction:column!important}
.hmi05-bar.hmi05-vertical .hmi-bar-track{transform:none;max-width:90px;align-self:center;width:65%;height:calc(100% - 40px)!important;min-height:9px;flex:1}
.hmi05-bar.hmi05-vertical .hmi-bar-fill{height:100%;min-height:100%}
.hmi05-bar .hmi-bar-head,.hmi05-bar .hmi-bar-scale{color:var(--hmi-fg)!important}
.hmi-widget-inner.hmi-push:not(.hmi-graphic-widget).feedback-on{background:linear-gradient(180deg,color-mix(in srgb,var(--hmi-on) 55%,white),var(--hmi-on))!important}
.hmi-widget-inner.hmi-push:not(.hmi-graphic-widget).unknown{background:linear-gradient(180deg,color-mix(in srgb,var(--hmi-unknown) 55%,white),var(--hmi-unknown))!important}
.hmi-widget-inner.hmi-toggle:not(.hmi-graphic-widget).on .hmi-toggle-switch{background:var(--hmi-on)!important}
.hmi-industrial-svg[data-state="unknown"]{filter:saturate(.46)}
.hmi-industrial-svg[data-state="pressed"]{filter:drop-shadow(0 1px 1px #122b3a88)}
@media(max-width:1180px){.hmi-real-thumbnail{width:44px!important;height:34px!important;flex-basis:44px!important}.hmi-real-thumbnail>.hmi-widget-inner{width:44px!important;height:32px!important}}

/* HMI-05: true vertical bar progression, bottom-up rather than horizontal fill. */
.hmi05-bar.hmi05-vertical .hmi-bar-track{display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}
.hmi05-bar.hmi05-vertical .hmi-bar-fill{min-height:0;height:0;flex:0 0 auto;width:100%!important;transition:height .1s ease-out}
/* Default prior numeric panels have dark text, so retain a readable light LCD face. */
.hmi05-value-panel.hmi05-digital .hmi-value-number,.hmi05-value-panel.hmi05-digital input[data-hmi-number-input]{background:#d7e4e9!important;border:1px solid #728c9d!important;color:var(--hmi-fg,#15293c)!important;text-shadow:none!important}
.hmi05-value-panel.hmi05-bezel .hmi-value-number,.hmi05-value-panel.hmi05-bezel input[data-hmi-number-input]{background:#dde9ef!important;border-color:#647c8f!important;color:var(--hmi-fg,#15293c)!important;text-shadow:none!important}

.hmi-widget-inner.hmi-graphic-widget.disabled{opacity:.52;cursor:not-allowed!important}
.hmi-industrial-svg[data-state="disabled"]{filter:grayscale(.82) saturate(.4)}
.hmi-widget-inner.hmi-num-input input:disabled{cursor:not-allowed;opacity:.55}

/* HMI-06 industrial polish: a full-width sample is mandatory for verifying
   mechanical shapes; cramped 2-column thumbnails concealed visual defects. */
.hmi-style-gallery{grid-template-columns:minmax(0,1fr)!important;gap:10px!important;padding:12px!important}
.hmi-style-choice{min-height:94px!important;display:flex!important;flex-direction:column!important;gap:5px!important;padding:7px 11px!important;background:linear-gradient(#fff,#f4f7fa)!important;border:1px solid #bacbd9!important;border-radius:8px!important}
.hmi-style-choice:hover{border-color:#5a91bd!important}
.hmi-style-choice.active{background:linear-gradient(#e7f2ff,#f8fbff)!important;border:1px solid #2b76b7!important}
.hmi-style-preview{height:67px!important;width:100%!important;overflow:visible!important}
.hmi-style-choice .hmi-style-name{min-height:14px!important;font-size:12px!important;font-weight:700!important;line-height:1.2!important}
.hmi-industrial-svg{shape-rendering:geometricPrecision}
.hmi05-value-panel .hmi-value-head b{font-size:var(--hmi-small-font)!important;letter-spacing:.55px!important;color:var(--hmi-fg)!important}
.hmi05-value-panel .hmi-value-number,.hmi05-value-panel input[data-hmi-number-input]{color:var(--hmi-fg)!important;text-shadow:none!important;letter-spacing:.65px!important;font-family:Consolas,monospace!important}
.hmi05-value-panel.hmi05-lcd .hmi-value-number,.hmi05-value-panel.hmi05-lcd input[data-hmi-number-input]{color:var(--hmi-fg)!important;background:linear-gradient(#cbdcba,#b5caa5)!important}
.hmi05-value-panel.hmi05-digital .hmi-value-number,.hmi05-value-panel.hmi05-digital input[data-hmi-number-input]{background:linear-gradient(#dce8ed,#cbdce5)!important}
.hmi05-value-panel.hmi05-bezel .hmi-value-number,.hmi05-value-panel.hmi05-bezel input[data-hmi-number-input]{background:linear-gradient(#d9e8ef,#c3d7e1)!important}
.hmi05-bar .hmi-bar-track{min-height:12px!important;background:linear-gradient(#0a1c2a,#173249)!important}
.hmi05-bar .hmi-bar-fill{background:linear-gradient(180deg,color-mix(in srgb,var(--hmi-accent) 45%,#fff),var(--hmi-accent),color-mix(in srgb,var(--hmi-accent) 66%,#072536))!important}
.hmi05-bar.hmi05-vertical .hmi-bar-fill{height:0;min-height:0!important;flex:0 0 auto!important;align-self:stretch!important}
.hmi05-bar.hmi05-vertical .hmi-bar-track{justify-content:flex-end!important;align-items:stretch!important;min-height:28px!important}
.hmi05-bar.hmi05-vertical .hmi-bar-track:after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0,transparent calc(10% - 2px),#0b2031 calc(10% - 2px),#0b2031 10%)}
.hmi05-gauge .hmi-gauge-svg{shape-rendering:geometricPrecision}

/* HMI-08: mechanical bezel must not acquire a state-dependent outer shadow.
   Press depth belongs exclusively to the moving cap, not the fixed chassis. */
.hmi07-precision-svg[data-state="pressed"]{filter:none!important}

/* HMI-09: multi-page screen controls + independent viewport/presentation skin */
.hmi-canvas-stage{grid-template-rows:37px 36px minmax(0,1fr)!important}
.hmi-screen-tabs-bar{display:flex;align-items:center;justify-content:space-between;min-width:0;gap:9px;padding:3px 8px 3px 12px;background:#e2eaf3;border-bottom:1px solid #bfcddd}
.hmi-screen-tabs{display:flex;gap:3px;align-items:center;flex:1;min-width:0;overflow:auto;scrollbar-width:thin}
.hmi-screen-tab{flex:0 0 auto;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:1px solid #afbdcd;border-bottom:1px solid #93a8bc;border-radius:5px;padding:5px 9px;background:#eff4f8;color:#526377;font:700 11px 'Segoe UI',sans-serif}
.hmi-screen-tab small{margin-left:5px;font:600 9px Consolas,monospace;color:#75879b}
.hmi-screen-tab.active{background:#1e4965;color:white;border-color:#1e4965;box-shadow:inset 0 1px rgba(255,255,255,.17)}
.hmi-screen-tab.active small{color:#d4e2ed}
.hmi-screen-actions,.hmi-viewport-actions{display:flex;align-items:center;gap:4px;flex:0 0 auto}
.hmi-screen-actions button,.hmi-viewport-actions button{border:1px solid #b7c6d5;border-radius:4px;padding:4px 7px;background:#f8fbfd;color:#28465e;font:700 10px 'Segoe UI',sans-serif;cursor:pointer}
.hmi-screen-actions button:hover,.hmi-viewport-actions button:hover{background:#d9ecf9}
.hmi-screen-actions button:disabled{cursor:not-allowed;opacity:.4}
.hmi-viewport-actions b{min-width:34px;text-align:center;color:#21435e;font:700 11px Consolas,monospace}
.hmi-viewport-actions button[aria-pressed=true]{background:#1e4965;color:#fff;border-color:#1e4965}
.hmi-stage-ruler{min-width:0;gap:8px!important}
.hmi-stage-ruler>span{max-width:135px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hmi-stage-ruler #hmiFitLabel{margin-left:auto;font-size:10px;white-space:nowrap}
.hmi-canvas-scroll{overflow:auto!important;justify-content:safe center!important;align-items:safe center!important;padding:30px!important;touch-action:pan-x pan-y;cursor:default}
.hmi-canvas-fit{position:relative;flex:0 0 auto;margin:auto}
.hmi-device-frame{display:none;pointer-events:none;position:absolute;inset:-21px -21px -24px;border:13px solid #283845;border-radius:17px;background:linear-gradient(#2c4457,#122637);box-shadow:0 5px 0 #71828f,0 19px 32px rgba(22,37,52,.28),inset 0 0 0 1px #97a7b5;z-index:0;color:#d7e8f3;font-family:'Segoe UI',sans-serif;font-weight:700;font-size:9px}
.hmi-frame-brand{position:absolute;bottom:-16px;left:12px;letter-spacing:1px}
.hmi-frame-led{position:absolute;bottom:-16px;right:13px;color:#6cca93;letter-spacing:.7px}
.hmi-frame-model{position:absolute;bottom:-16px;left:50%;transform:translateX(-50%);color:#b7c7d2;white-space:nowrap}
body.hmi-frame-enabled .hmi-device-frame{display:block}
.hmi-canvas{z-index:1}
body.hmi-pan-enabled .hmi-canvas-scroll{cursor:grab!important;touch-action:none}
body.hmi-pan-enabled .hmi-canvas-scroll:active{cursor:grabbing!important}
body.hmi-pan-enabled .hmi-canvas-scroll .hmi-widget{pointer-events:none!important}
body.view-hmi.hmi-run .hmi-canvas-stage:fullscreen{grid-template-rows:37px 36px minmax(0,1fr)!important}
body.view-hmi.hmi-run .hmi-canvas-scroll{overflow:auto!important;padding:30px!important}
@media(max-width:1100px){.hmi-stage-ruler>small{display:none}.hmi-screen-actions button{padding:4px}.hmi-viewport-actions{gap:2px}.hmi-viewport-actions button{padding:3px 4px}}

.hmi-canvas:before{content:attr(data-screen-label)!important}

/* HMI-09A: Discoverable Add Screen action. Keep the original event binding and 5-screen limit. */
.hmi-screen-actions #hmiAddScreen{
  flex:0 0 auto;min-width:98px;min-height:27px;padding:4px 10px;
  background:#e7f3ff;border-color:#669ac7;color:#124b76;
  font:700 11px 'Segoe UI',sans-serif;letter-spacing:.01em;white-space:nowrap;
}
.hmi-screen-actions #hmiAddScreen:not(:disabled):hover{background:#27638e;color:#fff;border-color:#27638e}
.hmi-screen-actions #hmiAddScreen:focus-visible{outline:2px solid #1479bc;outline-offset:2px}
.hmi-screen-actions #hmiAddScreen:disabled{opacity:.48;background:#e9eef3;color:#61778c;border-color:#b7c6d5}


/* HMI-09B: industrial instrument frame, stable typography, clipping-safe footer.
   Canvas coordinates and 800 x 480 authored content remain untouched. */
.hmi-device-frame {
  inset:-17px -18px -49px!important;
  border:10px solid #263642!important;
  border-radius:14px!important;
  background:#263642!important;
  box-shadow:0 4px 0 #74818a,0 12px 24px rgba(19,35,48,.19),inset 0 0 0 1px #465866!important;
  font:650 12px/1.2 'Segoe UI',Arial,sans-serif!important;
  color:#edf3f6!important;
}
.hmi-device-frame:before {
  content:'';pointer-events:none;position:absolute;
  inset:-3px -3px 0; border:1px solid rgba(205,221,231,.29);border-radius:5px;
}
.hmi-frame-brand,.hmi-frame-led,.hmi-frame-model {
  position:absolute!important;
  bottom:0px!important;
  margin:0!important;
  transform:none!important;
  line-height:18px!important;
  height:18px!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  text-shadow:none!important;
}
.hmi-frame-brand {left:8px!important;letter-spacing:.4px!important;font-size:12px!important;font-weight:750!important;color:#e7eff4!important}
.hmi-frame-model {left:50%!important;transform:translateX(-50%)!important;max-width:52%;text-overflow:ellipsis;text-align:center;color:#bbcbd5!important;font:650 11px/18px 'Segoe UI',Arial,sans-serif!important;letter-spacing:.15px!important}
.hmi-frame-led {right:8px!important;font:750 10px/18px 'Segoe UI',Arial,sans-serif!important;letter-spacing:.4px!important}
.hmi-frame-led.online {color:#66dda0!important}
.hmi-frame-led.offline {color:#a4b3c1!important}
.hmi-canvas-scroll{padding:44px 32px 64px!important}
/* Retain the author-selected foreground color; keep device labels legible at Fit. */
.hmi07-precision-svg .hmi07-legend text{paint-order:stroke;stroke:none;}
.hmi07-precision-svg text{font-family:'Segoe UI',Arial,sans-serif}
/* Offline indicator is not evidence of an active PLC link. */
#hmiRunBtn small{white-space:nowrap}

/* HMI09B: presentation-only screen numbering, not authored object content. */
body.hmi-run .hmi-canvas:before {display:none!important}
/* Classic lamp/button styles also distinguish the active emitter visibly. */
body.hmi-run .hmi-lamp.on .hmi-lamp-led {filter:brightness(1.25) drop-shadow(0 0 4px var(--hmi-on,#3acb7a))}

/* HMI-09C: restrained high-contrast industrial palette.
 * No position/size rules, no user color-variable override, no PLC behavior.
 * ON intensity is state-derived from each widget's selected --hmi-on.
 */
.hmi-industrial-svg[data-state="on"]:not(.hmi07-precision-svg){filter:saturate(1.20) contrast(1.06)}
.hmi07-precision-svg[data-state="on"]{filter:saturate(1.12)}
.hmi05-value-panel{background:linear-gradient(155deg,#ffffff 0%,#f1f7fb 62%,#e5edf4 100%)!important;border-color:#819aad!important;box-shadow:inset 0 1px #ffffff,0 2px 5px #18364b24!important}
.hmi05-value-panel .hmi-value-head b{letter-spacing:.65px!important}
.hmi05-value-panel.hmi05-digital .hmi-value-number,.hmi05-value-panel.hmi05-digital input[data-hmi-number-input],.hmi05-value-panel.hmi05-bezel .hmi-value-number,.hmi05-value-panel.hmi05-bezel input[data-hmi-number-input]{background:linear-gradient(180deg,#deedf3,#c0d8e5)!important;border:1px solid #5d7d94!important;color:var(--hmi-fg,#15293c)!important;box-shadow:inset 0 2px 3px #0b2c3a2b,0 1px #fff!important}
.hmi05-bar{background:linear-gradient(155deg,#ffffff,#eef5fa)!important;border-color:#8198ae!important;box-shadow:0 2px 5px #19364728!important}
.hmi05-bar .hmi-bar-track{background:linear-gradient(#071c2d,#123046)!important;border-color:#224761!important;box-shadow:inset 0 2px 5px #03131fab!important}
.hmi05-bar .hmi-bar-fill{background:linear-gradient(180deg,color-mix(in srgb,var(--hmi-accent) 73%,#fff),var(--hmi-accent) 42%,color-mix(in srgb,var(--hmi-accent) 85%,#052b39))!important;box-shadow:inset 0 1px #ffffff77,0 0 9px color-mix(in srgb,var(--hmi-accent) 70%,transparent)!important}
.hmi-trend-widget{border-color:#8299ae!important;background:linear-gradient(155deg,#ffffff,#f0f6fa)!important}
.hmi-trend-grid{stroke:#c3d2df!important;stroke-width:1!important}
.hmi-trend-line{stroke-width:2.6!important}
.hmi-trend-empty{fill:#60778a!important}

/* Colorimetric gain applied only to the moving illuminated face, never the metal chassis. */
.hmi07-precision-svg[data-state="on"] .hmi09c-active-surface{filter:brightness(1.18) saturate(1.22)}
.hmi07-precision-svg[data-state="on"] [data-hmi09c-emitter="selector"]{filter:drop-shadow(0 0 3px var(--hmi-on,#19d875))}


/* V10-05 — User-approved interface changes only. PLUS15-only active target. */
.target-summary-compact{display:flex!important;align-items:center;justify-content:center;margin:7px 10px 2px!important;padding:10px!important;background:#eaf1f9;border:1px solid #cbd8e7;border-radius:6px;min-height:37px}
.target-summary-compact>b{font:750 13px/1.3 'Segoe UI',sans-serif!important;color:#253f60!important;text-align:center!important}
.document-tab.active{position:relative;border:2px solid #2674cc!important;box-shadow:inset 0 0 0 1px #c0dcff,0 0 0 1px #2674cc33!important;background:#f7fbff!important;color:#164e96!important;z-index:2}
.document-tab:not(.active){border-color:#bfc8d4!important;box-shadow:none!important}
.document-tab:focus-visible{outline:2px solid #185eb9;outline-offset:2px}
.toast{left:50%!important;top:50%!important;bottom:auto!important;right:auto!important;transform:translate(-50%,-50%)!important;font-size:20px!important;line-height:1.45!important;padding:20px 26px!important;max-width:min(840px,calc(100vw - 42px))!important;min-width:min(440px,calc(100vw - 42px))!important;text-align:center!important;box-shadow:0 17px 45px #11223c73!important;border-width:2px!important;pointer-events:none!important;overflow-wrap:anywhere!important}
.target-reference{grid-template-columns:repeat(2,minmax(260px,1fr))!important;gap:12px!important;padding:13px!important;align-content:start}
.target-reference .ref-card{background:#fff;border:1px solid #cad5e4;border-radius:8px;padding:13px;min-width:0}
.target-reference .ref-card h3{display:flex;flex-wrap:wrap;justify-content:space-between;gap:7px;margin:0 0 11px;color:#264360;font:bold 13px/1.4 'Segoe UI',sans-serif}
.target-reference .ref-card h3 small{font:500 10px/1.4 'Segoe UI',sans-serif;color:#687d92}
.target-reference .ref-overview,.target-reference .ref-special-card{grid-column:1/-1}
.target-reference .ref-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.target-reference .ref-facts>span{background:#f0f5fa;border:1px solid #e1e8f2;border-radius:5px;padding:9px;font:600 11px/1.6 'Segoe UI',sans-serif;color:#304966}
.target-reference .ref-facts b{display:block;font:bold 10px/1.5 'Segoe UI',sans-serif;color:#687f99}
.target-reference .ref-caution{font:600 11px/1.5 'Segoe UI',sans-serif;margin:9px 0 0;padding:8px 11px;background:#fff7e7;border-left:3px solid #d99b35;color:#805718}
.target-reference .ref-device-table{display:flex;flex-direction:column;gap:5px}
.target-reference .ref-device-row{display:grid;grid-template-columns:28px minmax(76px,.9fr) minmax(130px,1.6fr);gap:8px;align-items:center;padding:8px;background:#f5f8fc;border:1px solid #e7edf5;border-radius:4px;margin:0;font:11px/1.4 'Segoe UI',sans-serif!important;color:#425b74!important}
.target-reference .ref-device-row code{font:700 11px/1.4 Consolas,monospace!important;color:#243e60!important;white-space:normal}
.target-reference .ref-device-row span{font:11px/1.4 'Segoe UI',sans-serif;color:#4a647e}
.target-reference .ref-device-tag{background:#dceaff;border-radius:3px;text-align:center;padding:3px;font:800 11px/1.3 'Segoe UI',sans-serif;color:#225b9c}
.target-reference .ref-special-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 10px}
.target-reference .ref-special-row{display:flex;gap:8px;align-items:baseline;border-bottom:1px solid #ecf0f5;padding:5px 2px;margin:0;min-width:0}
.target-reference .ref-special-row code{flex:0 0 50px;font:bold 11px Consolas,monospace;color:#285785}
.target-reference .ref-special-row span{font:11px/1.4 'Segoe UI',sans-serif;color:#52677e;overflow-wrap:anywhere}
@media(max-width:1050px){.target-reference{grid-template-columns:1fr!important}.target-reference .ref-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.target-reference .ref-special-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:660px){.target-reference .ref-facts,.target-reference .ref-special-grid{grid-template-columns:1fr}.toast{font-size:18px!important;min-width:0!important}}

/* Larger reading area only while View -> Target Reference is open. */
body:not(.view-hmi).view-target-reference .ide-shell:not(:has(.bottom-dock.collapsed)){grid-template-rows:48px 29px 58px 61px minmax(0,1fr) clamp(260px,42vh,520px) 27px!important}

/* GX Simple Ladder comparison: one logical contact occupying exactly two grid columns. */
.matrix-cell:has(> svg.compare-wide-svg){z-index:5;overflow:visible!important}
.matrix-cell svg.compare-wide-svg{width:200%!important;height:100%!important;overflow:visible!important;max-width:none!important;pointer-events:none}
.matrix-cell.compare-continuation{background:#fff}
.matrix-cell.compare-continuation>.edge-guide-h{opacity:0}
.matrix-cell.compare-continuation.selected{box-shadow:inset 0 0 0 2px #2f6fed!important}
.matrix-cell.monitor-flow:has(> svg.compare-wide-svg) svg.compare-wide-svg .compare-box{stroke:var(--monitor-green,#008f55)!important}
/* The source cell owns the entire two-cell compare graphic. The continuation
   cannot paint its draft hatch or selection layer over the SVG. */
.matrix-cell.logic:has(> svg.compare-wide-svg){z-index:24!important;isolation:isolate}
.matrix-cell.logic:has(> svg.compare-wide-svg) svg.compare-wide-svg{z-index:25!important}
.matrix-cell.logic.compare-continuation{z-index:0!important}
.matrix-cell.logic.compare-continuation.unconverted:before{display:none!important}
.matrix-cell.logic:has(> svg.compare-wide-svg).unconverted:before{z-index:1!important}
/* Do not draw a grid or selection seam through the two-cell GX comparison. */
.matrix-cell.logic:has(> svg.compare-wide-svg){border-right:0!important}
.matrix-cell.logic:has(> svg.compare-wide-svg).selected{box-shadow:none!important;background:#f3f7ff!important}
.matrix-cell.logic:has(> svg.compare-wide-svg).selected:after{content:'';position:absolute;inset:0 auto auto 0;width:200%;height:100%;border:2px solid #2f6fed;z-index:30;pointer-events:none}
.matrix-cell.logic.compare-continuation.selected{box-shadow:none!important;background:#f3f7ff!important}
/* More legible at laptop scale, without inventing separate AND/OR boxes. */
.compare-wide-svg .compare-main{font-size:15px!important;font-weight:850!important;fill:#193047!important}
.compare-wide-svg .compare-sub{font-size:12px!important;font-weight:750!important;fill:#2b4058!important}
.compare-wide-svg .compare-box{stroke:#29435d;stroke-width:2px;fill:#fff!important}

/* CP07D | VĐ-06, 07, 09, 11 UI corrections */
/* The left bus is drawn by .rail-cell; the same vEdge n=0 remains in the
   model/graph but its duplicate stroke must not paint adjacent to the rail. */
.v-edge-hit.overlaid-left-rail.filled:not(:hover) .v-edge-line,
.v-edge-hit.overlaid-left-rail.filled:not(:hover) .v-edge-node{opacity:0!important}
.v-edge-hit.filled .v-edge-line{width:3px!important;background:var(--matrix-line)!important;transform:translateX(-1.5px);opacity:1}
.v-edge-hit.filled:not(.monitor-flow) .v-edge-node{opacity:0}
.matrix-sheet.live-ladder-monitor .v-edge-hit.monitor-flow:not(.overlaid-left-rail) .v-edge-line{background:var(--monitor-green)!important}
.compare-wide-svg .compare-main{font-size:19px!important;font-weight:900!important}
.compare-wide-svg .compare-sub{font-size:15px!important;font-weight:800!important}
.fx-symbol-entry{position:relative;width:100%}
.fx-symbol-entry>input{width:100%}
.fx-symbol-suggestions{position:relative;margin-top:4px;display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));max-height:168px;overflow:auto;background:#fff;border:1px solid #bbcadd;border-radius:5px}
.fx-symbol-suggestions[hidden]{display:none!important}
.fx-symbol-suggestions button{padding:7px 8px;background:#fff;border:0;border-bottom:1px solid #e0e6ee;text-align:left;cursor:pointer;font:700 12px Consolas,monospace;color:#2d435d}
.fx-symbol-suggestions button:hover,.fx-symbol-suggestions button.active{background:#e4efff;color:#1356a4}
.comments-panel{position:fixed;z-index:1810;top:140px;right:28px;width:min(820px,calc(100vw - 56px));height:min(610px,calc(100vh - 170px));min-width:380px;min-height:250px;resize:both;overflow:hidden;display:grid;grid-template-rows:50px auto minmax(0,1fr) 35px;background:#f7f9fc;border:1px solid #a4b2c4;border-radius:7px;box-shadow:0 16px 42px rgba(24,42,66,.29);color:#26384f}
.comments-panel.hidden{display:none}
.comments-panel-header{display:flex;align-items:center;justify-content:space-between;padding:0 12px;cursor:move;user-select:none;touch-action:none;background:linear-gradient(#edf3fa,#e5ecf5);border-bottom:1px solid #bfccd9}
.comments-panel-header>div{display:flex;align-items:center;gap:10px}.comments-panel-header b{font-size:15px;color:#223a58}.comments-panel-header small{display:block;font-size:11px;color:#657892;margin-top:2px}.comments-panel-icon{display:grid;place-items:center;width:29px;height:29px;border-radius:5px;background:#2f6fed;color:#fff;font-weight:900}
.comments-panel-header button{background:transparent;border:0;border-radius:5px;font-size:23px;color:#5b6a7c;cursor:pointer}.comments-panel-header button:hover{background:#fff}
.comments-panel-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:end;padding:10px 12px;background:#f9fbfd;border-bottom:1px solid #d1dce6}
.comments-panel-controls label{display:grid;gap:3px;font-size:11px;font-weight:800;color:#55677e}.comments-panel-controls select,.comments-panel-controls input[type=search]{height:34px;padding:0 9px;border:1px solid #bac9d9;border-radius:4px;background:#fff;color:#273e59;font-size:12px}
.comments-panel-controls label:nth-child(2){flex:1;min-width:140px}.comments-panel-controls input[type=search]{width:100%}.comments-panel-controls .comments-only{display:flex;align-items:center;gap:6px;padding-bottom:8px}
.comments-panel-table{min-height:0;overflow:auto;background:#fff}.comments-panel-table table{width:100%;border-collapse:collapse;font-size:12px;table-layout:fixed}.comments-panel-table th{position:sticky;top:0;z-index:2;padding:10px 8px;background:#e9eef6;text-align:left;border-bottom:1px solid #b1bdcc;color:#526581;font-size:10px}.comments-panel-table th:nth-child(1){width:110px}.comments-panel-table th:nth-child(3){width:95px}.comments-panel-table th:nth-child(4){width:42px}.comments-panel-table td{height:39px;padding:4px 9px;border-bottom:1px solid #e3e9f1;overflow:hidden;text-overflow:ellipsis}.comments-panel-table tr:nth-child(even){background:#f9fbfe}.comments-panel-table tr:hover{background:#edf5ff}.comments-panel-table .comment-device{font:800 13px Consolas,monospace;color:#254d77}.comments-panel-table td input{width:100%;height:29px;box-sizing:border-box;border:1px solid #cbd5e2;border-radius:4px;padding:0 8px;font-size:12px}.comments-panel-table td button{border:1px solid #d2d9e2;background:#fff;color:#6b7c91;cursor:pointer;border-radius:4px;width:25px;height:25px}.comments-panel-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 11px;border-top:1px solid #cfd8e2;background:#f2f6fa;color:#66758a;font-size:10px}.comments-panel-foot b{white-space:nowrap;color:#344e6f}.comments-panel.dragging{box-shadow:0 22px 52px rgba(24,42,66,.35)}
@media(max-width:640px){.comments-panel{min-width:280px;right:8px;top:100px;width:calc(100vw - 16px);height:calc(100vh - 125px)}.comments-panel-table th:nth-child(3),.comments-panel-table td:nth-child(3){display:none}}

.v-edge-layer:not(.armed) .v-edge-hit.overlaid-left-rail .v-edge-line,
.v-edge-layer:not(.armed) .v-edge-hit.overlaid-left-rail .v-edge-node{opacity:0!important;box-shadow:none!important}

/* CP07D VĐ-purple: decorative purple stripe on Instructions palette button is not a Ladder conductor; remove it. */
.component-toolbar .component-menu.instruction{border-left:1px solid #d6dee8!important}

/* V10-07E VĐ-09: the n=0 split is painted by the left power rail, while
   internal/right OR merge edges use .v-edge-line. Match physical stroke width
   at all zoom levels without revealing duplicate n=0 topology strokes. */
.rail-cell:after{width:3px!important;background:var(--matrix-line)!important}
.rail-cell.left.connected:before,.rail-cell.right.connected:before{height:3px!important;background:var(--matrix-line)!important}
.v-edge-hit.filled:not(.overlaid-left-rail):not(.semantic-only-stl-source) .v-edge-line{width:3px!important;transform:translateX(-1.5px)!important;opacity:1}
.v-edge-layer:not(.armed) .v-edge-hit.overlaid-left-rail .v-edge-line,
.v-edge-layer:not(.armed) .v-edge-hit.overlaid-left-rail .v-edge-node{opacity:0!important}
/* All visible branch segments use the same contrast; energized ones share one thickness. */
.v-edge-hit.monitor-flow:not(.overlaid-left-rail) .v-edge-line{width:4.3px!important;transform:translateX(-2.15px)!important}
.monitor-batch-table td.batch-current-editable{cursor:pointer;text-decoration:underline dotted #7a96b8;text-underline-offset:3px}
.monitor-batch-table td.batch-current-editable:hover{background:#e4efff!important;color:#175aa6}

/* Flow at topology n=0 is painted by the real left rail, never by a duplicate vEdge. */
.matrix-sheet.live-ladder-monitor .rail-cell.left.monitor-flow-rail::after{width:4.3px!important;background:var(--monitor-green)!important}
.matrix-sheet.live-ladder-monitor .rail-cell.left.monitor-flow-rail.connected::before{height:4.3px!important;background:var(--monitor-green)!important}

/* CP07F – explicit Instructions browser; no operand-generated suggestions */
.cursor-instruction-editor{display:flex;flex-direction:column;gap:10px}
.cursor-instruction-editor label{font-size:13px;font-weight:700;color:#344860}
.cursor-instruction-editor>input{width:100%;min-height:38px;padding:9px 12px;border:1px solid #bac9dd;border-radius:6px;background:white;font:14px Consolas,monospace}
.cursor-instruction-editor>input:focus{outline:2px solid #82aef5;outline-offset:0}
.cursor-instruction-note{font-size:12px;color:#64748b;line-height:1.5}
.cursor-instruction-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:5px;max-height:280px;overflow:auto;border:1px solid #d6dfeb;padding:7px;border-radius:6px}
.cursor-instruction-list button{display:flex;flex-direction:column;gap:4px;text-align:left;border:1px solid #dce4ec;border-radius:5px;background:#fff;cursor:pointer;padding:8px}
.cursor-instruction-list button:hover,.cursor-instruction-list button:focus{background:#e9f1ff;border-color:#699be3}
.cursor-instruction-list b{font:700 13px Consolas,monospace;color:#22446b}
.cursor-instruction-list small{font-size:10px;color:#607589}
.cursor-instruction-empty{font-size:12px;color:#8a95a6}

/* V10-07G: selected two-cell comparator border and issue marker must NEVER
   share the same orange circular pseudo-element; distinguish UI selection
   from validation without changing the PLC/graph representation. */
.matrix-cell.logic:has(> svg.compare-wide-svg).selected::after{
 background:transparent!important;border-radius:0!important;box-shadow:none!important;
 box-sizing:border-box!important;
}
.matrix-cell.logic .compare-issue-indicator{position:absolute;z-index:40;right:-100%;top:4px;width:8px;height:8px;border-radius:50%;background:#d34a5b;pointer-events:none;box-shadow:0 0 0 2px white}
/* Match conductor stroke in the left rail and all drawn vertical OR edges.
   Keep n=0 duplicate vEdge intentionally invisible. */
.rail-cell.left::after,.rail-cell.right::after{width:4px!important;background:#24354a!important}
.v-edge-hit.filled:not(.overlaid-left-rail):not(.semantic-only-stl-source) .v-edge-line{width:4px!important;transform:translateX(-2px)!important;background:#24354a!important;opacity:1!important}
.matrix-sheet.live-ladder-monitor .v-edge-hit.monitor-flow:not(.overlaid-left-rail) .v-edge-line{background:var(--monitor-green)!important;width:4.3px!important;transform:translateX(-2.15px)!important}
/* Symbols-only instruction library, mnemonic only as a compact disambiguator. */
.cursor-instruction-list{grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:7px}
.cursor-instruction-list button{min-height:70px;align-items:center;justify-content:center;gap:3px;padding:6px;overflow:hidden}
.cursor-instruction-list button .instruction-ladder-glyph{width:100%;max-width:100px;height:40px;color:#213a58;overflow:visible}
.cursor-instruction-list button b{font:700 10px Consolas,monospace;color:#4d6280}
.instruction-ladder-glyph text{stroke:none;fill:#213a58;text-anchor:middle;dominant-baseline:middle;font-family:Consolas,monospace;font-weight:800}
.instruction-ladder-glyph .library-icon-text{font-size:16px}
.instruction-ladder-glyph .library-icon-coil-text{font-size:14px}
.instruction-ladder-glyph .library-icon-func-text{font-size:9px}
/* Device Test: private modal owned by Studio, no browser prompt/alert UI. */
.device-test-dialog{display:grid;gap:10px;font-size:13px;color:#263a54}
.device-test-reading{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.device-test-reading>div{padding:12px;border:1px solid #d4dfed;border-radius:7px;background:#f6f9fd;display:grid;gap:4px}
.device-test-reading small{font-size:11px;color:#6b7e97}
.device-test-reading b{font:800 18px Consolas,monospace;color:#23446e}
.device-test-dialog label{font-weight:700;margin-top:6px}
.device-test-dialog input,.device-test-dialog select{width:100%;height:43px;border:1px solid #aebfd5;border-radius:7px;padding:8px 11px;font:700 16px Consolas,monospace;background:white;color:#1b304d}
.device-test-dialog input:focus,.device-test-dialog select:focus{outline:2px solid #2f6fed;outline-offset:1px}
.device-test-hint{margin:0;color:#657a94;font-size:12px}
.device-test-confirm{padding:11px;border:1px solid #e0bd72;background:#fff8e7;color:#6c4b1d;border-radius:6px;font-size:12px}
.device-test-error{padding:11px;border:1px solid #efb1b8;background:#fff0f2;color:#a32942;border-radius:6px;font-size:12px}
.device-test-confirm.hidden,.device-test-error.hidden{display:none}

/* Warning dot is separate from full two-cell outline (one marker only). */
.matrix-cell.logic:has(> svg.compare-wide-svg).issue-warning:not(.selected)::after,
.matrix-cell.logic:has(> svg.compare-wide-svg).issue-error:not(.selected)::after{display:none!important}
.matrix-cell.logic .compare-issue-indicator.issue-warning{background:#e6a62d}
.matrix-cell.logic .compare-issue-indicator.issue-error{background:#d34a5b}

/* V10-07H: scalable target-aware Instructions catalogue with integrated help. */
.cursor-library-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(240px,1fr);gap:12px;min-height:245px;max-height:min(52vh,490px)}
.cursor-instruction-list{display:block!important;overflow:auto;min-height:0;max-height:100%;padding:8px;background:#f8fafc;border:1px solid #ccd6e3;border-radius:7px}
.cursor-instruction-group:not(:last-child){margin-bottom:13px}
.cursor-instruction-group h3{font-size:13px;font-weight:800;color:#2c4664;margin:3px 1px 7px}
.cursor-instruction-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(115px,1fr));gap:9px}
.cursor-instruction-grid button{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:96px;padding:10px;background:white;border:1px solid #cbd6e4;border-radius:7px;color:#203954;cursor:pointer;gap:7px}
.cursor-instruction-grid button:hover,.cursor-instruction-grid button.active{border-color:#2f6fed;background:#edf4ff}
.cursor-instruction-grid button .instruction-ladder-glyph{height:52px;max-width:133px;width:100%}
.cursor-instruction-grid button b{font:800 13px Consolas,monospace;white-space:normal;text-align:center}
.cursor-instruction-grid .instruction-ladder-glyph .library-icon-func-text{font-size:11px}
.cursor-instruction-help{min-width:0;overflow:auto;padding:13px;background:white;border:1px solid #ccd6e3;border-radius:7px;font:13px/1.55 'Segoe UI',sans-serif;color:#324963}
.cursor-instruction-help p{margin:10px 0}
.cursor-instruction-help small{display:block;color:#60738b;line-height:1.55}
.instruction-help-head{display:flex;align-items:center;gap:12px;background:#f1f6fc;padding:10px;border-radius:5px}
.instruction-help-head svg{width:95px;height:50px;flex:none}
.instruction-help-head strong{display:block;font-size:17px}
.instruction-help-head span{display:block;font-size:11px;color:#5b6f86}
.instruction-example{display:grid;gap:5px;padding:9px;margin-bottom:11px;border-radius:4px;background:#f3f6fa}
.instruction-example code{font:800 14px Consolas,monospace;color:#173b64}
@media(max-width:900px){.cursor-library-layout{grid-template-columns:1fr;max-height:55vh}.cursor-instruction-help{max-height:170px}}
/* V10-07H VĐ-09: source rail and downstream OR join use the same opaque,
   foreground vertical conductor, avoiding a 2px-looking rail where contact
   backgrounds or the compare-wide SVG previously painted over its edge. */
.matrix-sheet>.rail-cell.left{z-index:7;isolation:isolate}
.matrix-sheet>.rail-cell.left::after{width:4px!important;background:#24354a!important;opacity:1!important;box-shadow:none!important}
.matrix-sheet>.rail-cell.right::after{width:4px!important;background:#24354a!important;opacity:1!important;box-shadow:none!important}
.v-edge-hit.filled:not(.overlaid-left-rail):not(.semantic-only-stl-source) .v-edge-line{width:4px!important;transform:translateX(-2px)!important;background:#24354a!important;opacity:1!important;box-shadow:none!important}
/* V10-07H: Device Test and other modal confirmations must sit ABOVE the
   draggable Device Batch Monitor (z=1800) and Comments panel (z=1810), but
   below the program-transfer safety overlay (z=2300). */
#editorModal.modal-backdrop{z-index:2100!important}

/* V10-07I: one SVG-based electrical conductor renderer, matching horizontal wires.
   Existing rail pseudo elements and branch hitbox strokes remain editable but invisible. */
:root{--conductor-px:2.8px}
.matrix-sheet:has(>.conductor-layer)>.rail-cell::after{opacity:0!important}
.matrix-sheet:has(>.conductor-layer) .v-edge-hit.filled .v-edge-line:not(:hover){opacity:0!important}
.matrix-sheet:has(>.conductor-layer) .v-edge-hit.filled .v-edge-line{opacity:0!important}
.conductor-layer{position:absolute;top:0;left:0;z-index:9;overflow:visible;pointer-events:none}
.conductor-layer line{fill:none;stroke:var(--matrix-line);stroke-width:var(--conductor-px);stroke-linecap:butt;vector-effect:non-scaling-stroke;shape-rendering:geometricPrecision}
.conductor-layer line.monitor-flow{stroke:var(--monitor-green);stroke-width:4px}
.wire-stroke{stroke-width:2.8px!important}
.rail-cell.left.connected::before,.rail-cell.right.connected::before{height:2.8px!important}
/* Match instruction-library style: English explanatory content only. */