#canvas{transform-origin:0 0;-webkit-user-select:none;user-select:none;position:absolute;top:0;left:0}#canvas.grid-visible{background-image:radial-gradient(circle, var(--grid-dot) 1.4px, transparent 1.4px)}.display-bbox{stroke:var(--display-accent);opacity:.7}.display-bbox.display-bbox-overlap{stroke:var(--danger);opacity:1}.display-bbox-label{font-family:var(--font-ui);color:var(--display-accent);opacity:.85;white-space:nowrap;pointer-events:none;z-index:0;font-size:12px;font-weight:600;position:absolute}#canvas.cabinet-edit-mode .display-bbox,#canvas.cabinet-edit-mode .display-bbox-label,#canvas.patch-mode-active .display-bbox,#canvas.patch-mode-active .display-bbox-label,#canvas.export-patch-drag .display-bbox,#canvas.export-patch-drag .display-bbox-label{display:none!important}#canvas .smart-guide-line{pointer-events:none;z-index:var(--z-canvas-guides);background:#ff2d95;position:absolute}#canvas .smart-guide-center-composition{opacity:.9}#canvas .smart-guide-edge-other,#canvas .smart-guide-center-other{opacity:.75}#selection-marquee,#cabinet-selection-marquee,#patch-autosnake-marquee{pointer-events:none;z-index:var(--z-canvas-marquee);border:1.5px solid var(--toxic);background:var(--glow);display:none;position:absolute}.empty-canvas-msg{pointer-events:none;z-index:1;justify-content:center;align-items:center;width:100%;height:100%;margin-bottom:-100%;padding:0 24px;display:flex;position:sticky;inset:0}.empty-canvas-msg-inner{width:min(80vw,360px);color:var(--muted);font-family:var(--font-ui);text-align:center;font-size:13px;line-height:1.7}.empty-canvas-msg b{color:var(--text)}.placed{z-index:2;cursor:grab;pointer-events:none;border-radius:0;position:absolute;overflow:hidden}.placed .panel-cell,.placed .overlay-el{pointer-events:auto}.placed .plate-hit{pointer-events:auto;cursor:pointer;-webkit-user-select:none;user-select:none}.placed:active{cursor:grabbing}.placed.selected{z-index:var(--z-canvas-screen-selected)!important}.placed.selected-multi{z-index:var(--z-canvas-screen-multi)!important}.placed.patch-dragging{z-index:var(--z-canvas-screen-dragging-under-patch)!important}#canvas.patch-flatten-rotation .placed{transform:none!important}.placed.cabinet-edit-hidden,.placed.export-display-hidden{display:none}.placed.cabinet-edit-active{cursor:default;pointer-events:auto}.placed.cabinet-edit-active .panel-cell{pointer-events:auto;cursor:grab}.placed.cabinet-edit-active .panel-cell:active{cursor:grabbing}#canvas.patch-mode-active .panel-cell{pointer-events:auto;cursor:pointer}#canvas.export-patch-drag .panel-cell{pointer-events:auto;cursor:grab}#canvas.export-cab-drag .panel-cell.export-cab-selected{box-shadow:inset 0 0 0 2px var(--toxic)}#canvas.export-patch-drag .panel-cell.export-cab-moved{z-index:6}#canvas.export-cab-drag .placed{overflow:visible}#canvas.export-cab-drag .panel-cell.export-cab-dragging{z-index:var(--z-canvas-dragging-cell)}#canvas.export-patch-drag .panel-cell:active{cursor:grabbing}#canvas.export-patch-drag.export-patch-nodrag .panel-cell,#canvas.export-patch-drag.export-patch-nodrag .panel-cell:active{cursor:default}.panel-cell.cabinet-mono{background:color-mix(in srgb, white 22%, var(--bg2))}.panel-cell.cabinet-mono.cabinet-custom{background:color-mix(in srgb, var(--toxic2) 35%, var(--bg2))}.panel-cell.cabinet-selected{outline:4px solid var(--success);outline-offset:-4px;z-index:9}.placed.cabinet-edit-active .panel-cell:not([data-cabinet-id="-1"]):hover{outline:4px solid var(--toxic2);outline-offset:-4px;z-index:6}.placed.cabinet-edit-active .panel-cell.cabinet-selected:hover{outline:4px solid var(--success);outline-offset:-4px;z-index:9}.panel-cell.cabinet-overlap,.panel-cell.cabinet-invalid{background:color-mix(in srgb, var(--danger) 45%, transparent)!important}:root{--z-mapping-bg:1;--z-panel-cell:3;--z-mapping-pattern:4;--z-mapping-label:5;--z-screen-outline:6;--z-screen-outline-svg:8;--z-canvas-guides:1;--z-canvas-screen:5;--z-canvas-screen-multi:8;--z-canvas-screen-selected:10;--z-canvas-display-frame:20;--z-canvas-patch:40;--z-canvas-patch-active:45;--z-canvas-marquee:50;--z-canvas-screen-dragging-under-patch:11;--z-canvas-dragging:60;--z-canvas-dragging-cell:62;--z-canvas-overlay-ui:70}.screen-outline{pointer-events:none;z-index:var(--z-screen-outline);box-sizing:border-box;position:absolute;inset:0}.placed.selected .screen-outline:not(.screen-outline--shaped),.placed.selected-multi .screen-outline:not(.screen-outline--shaped){z-index:9;border:2px solid var(--toxic2)!important}.screen-outline--shaped{overflow:visible}.screen-outline--shaped path{fill:none;stroke:none}.placed.selected .screen-outline--shaped,.placed.selected-multi .screen-outline--shaped{z-index:9}.placed.selected .screen-outline--shaped path,.placed.selected-multi .screen-outline--shaped path{stroke:var(--toxic2);stroke-width:2px}.mapping-shared-layer{pointer-events:none;position:absolute;inset:0}.cluster-shared-layer{pointer-events:none;display:none;position:absolute;inset:0}.cluster-mode .cluster-shared-layer{display:block}.cluster-mode .placed.has-cluster .mapping-bg{display:none}.cluster-mode .placed.has-cluster:not(.cabinet-edit-active) .panel-cell{border-color:#0000}.mapping-bg{pointer-events:none;z-index:var(--z-mapping-bg);background-image:conic-gradient(from 90deg at 50% 50%, var(--checker-color-a,#0f0) 89.7deg, var(--checker-color-b,green) 90.3deg 179.7deg, var(--checker-color-a,#0f0) 180.3deg 269.7deg, var(--checker-color-b,green) 270.3deg 359.7deg, var(--checker-color-a,#0f0) 360deg);background-repeat:repeat;transition:opacity .2s;position:absolute;inset:0}.cluster-bg{pointer-events:none;z-index:var(--z-mapping-bg);background-image:conic-gradient(from 90deg at 50% 50%, var(--cluster-color-a,#0f0) 89.7deg, var(--cluster-color-b,green) 90.3deg 179.7deg, var(--cluster-color-a,#0f0) 180.3deg 269.7deg, var(--cluster-color-b,green) 270.3deg 359.7deg, var(--cluster-color-a,#0f0) 360deg);background-repeat:repeat;position:absolute;inset:0}.cluster-cell{pointer-events:none;z-index:var(--z-mapping-bg);border-width:var(--cab-outline-width,5px);border-style:var(--cab-outline-style,solid);border-color:var(--cab-outline-color,#fff);box-sizing:border-box;position:absolute}.panel-cell{overflow:hidden}.panel-cell .cluster-bg,.mapping-pattern-layer{z-index:var(--z-mapping-pattern);pointer-events:none;position:absolute;inset:0}.mapping-lines{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.mapping-lines text{text-rendering:geometricprecision}.mapping-circle{pointer-events:none;border-style:solid;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.mapping-label{text-align:center;color:var(--label-color,#fff);pointer-events:none;z-index:var(--z-mapping-label);font-family:var(--font-mono);text-shadow:1px 1px #000,-1px -1px #000,1px -1px #000,-1px 1px #000;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.mapping-label .title{letter-spacing:.05em;text-transform:uppercase;margin-bottom:2px;font-weight:800;line-height:1.2}.mapping-label .coords{font-size:11px;font-weight:600;line-height:1.2}.mapping-label .mapping-coords{pointer-events:auto;white-space:nowrap;cursor:pointer}.panel-cell{z-index:var(--z-panel-cell);pointer-events:none;position:absolute}.panel-cell.cabinet-custom{position:absolute;overflow:hidden}.panel-cell.cabinet-custom .mapping-bg{z-index:0}.panel-cell.cabinet-custom .mapping-lines{z-index:1}.panel-cell.cabinet-custom .mapping-circle{z-index:2}.screen-outline-svg{pointer-events:none;width:100%;height:100%;z-index:var(--z-screen-outline-svg);position:absolute;inset:0;overflow:visible}.placed.cabinet-edit-active .mapping-shared-layer,.placed.cabinet-edit-active .screen-outline-svg,.placed.cabinet-edit-active .mapping-label,.placed.cabinet-edit-active .cluster-shared-layer,.placed.cabinet-edit-active .cluster-bg,.placed.cabinet-edit-active .cluster-cell,.placed.cabinet-edit-active .mapping-pattern-layer{visibility:hidden}.placed.cabinet-edit-active .panel-cell{border-width:var(--cab-outline-width,2px);border-style:var(--cab-outline-style,solid);border-color:var(--cab-outline-color,#fff);box-sizing:border-box}.placed.cabinet-edit-active .screen-outline{visibility:hidden}#canvas.patch-mode-active .mapping-shared-layer,#canvas.patch-mode-active .screen-outline-svg,#canvas.patch-mode-active .mapping-label,#canvas.patch-mode-active .cluster-shared-layer,#canvas.patch-mode-active .cluster-bg,#canvas.patch-mode-active .cluster-cell,#canvas.patch-mode-active .mapping-pattern-layer,#canvas.export-patch-drag .mapping-shared-layer,#canvas.export-patch-drag .screen-outline-svg,#canvas.export-patch-drag .mapping-label,#canvas.export-patch-drag .cluster-shared-layer,#canvas.export-patch-drag .cluster-bg,#canvas.export-patch-drag .cluster-cell,#canvas.export-patch-drag .mapping-pattern-layer{display:none}#canvas.patch-mode-active .panel-cell,#canvas.export-patch-drag .panel-cell{background:#c2c2c2!important;border:2px solid #fff!important}#canvas.patch-mode-active .panel-cell.patch-assigned,#canvas.export-patch-drag .panel-cell.patch-assigned{background:var(--patch-port-color)!important}#canvas.patch-mode-active .panel-cell.patch-collision,#canvas.export-patch-drag .panel-cell.patch-collision{background:#ff3b30!important}.patch-inst-routes{pointer-events:none;z-index:40;width:100%;height:100%;position:absolute;top:0;left:0;overflow:visible}.patch-cab-marks{pointer-events:none;display:none;position:absolute;inset:0}#canvas.patch-mode-active .patch-cab-marks,#canvas.export-patch-drag .patch-cab-marks{display:block}.patch-cab-handle{--frac:var(--patch-handle-frac,.1);width:calc(var(--patch-cab-min) * var(--frac) * 2);height:calc(var(--patch-cab-min) * var(--frac) * 2);border-radius:var(--patch-handle-radius,50%);background:var(--patch-handle-fill,#8f8f8f);border:var(--patch-handle-stroke-w,2px) solid var(--patch-handle-stroke,#fff);box-sizing:border-box;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#canvas.patch-mode-active .panel-cell:hover .patch-cab-handle{--frac:var(--patch-handle-hover-frac,.28)}.patch-cab-marker{width:calc(var(--patch-cab-min) * var(--patch-marker-frac,.3));height:calc(var(--patch-cab-min) * var(--patch-marker-frac,.3));position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.patch-cab-marker[data-role=start]{background:var(--patch-marker-fill,#fff);clip-path:polygon(100% 50%,0% 0%,0% 100%);transform:translate(-50%,-50%) rotate(var(--patch-marker-angle,0deg))}.patch-cab-marker[data-role=end]{background:var(--patch-marker-fill,#fff);border-radius:var(--patch-handle-radius,0)}.patch-cab-num{font:700 1px sans-serif;font-size:max(8px, calc(var(--patch-cab-min) * var(--patch-chain-num-frac,.08)));color:var(--patch-chain-num-color,#fff);text-shadow:1px 1px #000000bf,-1px -1px #000000bf,1px -1px #000000bf,-1px 1px #000000bf;position:absolute;top:1px;left:4px}.patch-cab-mapper{--plate:min(var(--patch-mapper-plate-frac,.75), .8696);width:calc(var(--patch-cab-min) * var(--plate));height:calc(var(--patch-cab-min) * var(--plate) * 1.15);background:color-mix(in srgb, var(--patch-mapper-plate-color,#000) calc(var(--patch-mapper-plate-opacity,.55) * 100%), transparent);border-radius:calc(var(--patch-cab-min) * var(--plate) * var(--patch-mapper-radius-frac,.075));font:700 1px sans-serif;font-size:calc(var(--patch-cab-min) * var(--plate) * var(--patch-mapper-text-frac,.34));color:var(--patch-mapper-text-color,#fff);text-align:center;border:var(--patch-mapper-plate-stroke-w,0) solid var(--patch-mapper-plate-stroke,#fff);box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;line-height:1.1;display:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#canvas.patch-mapper-mode .patch-cab-mapper{display:flex}#canvas.patch-mapper-mode .patch-cab-handle,#canvas.patch-mapper-mode .patch-cab-marker,#canvas.patch-mapper-mode .patch-cab-num{display:none}.overlay-el{z-index:12;cursor:move;position:absolute}.overlay-text{font-family:var(--font-display);color:#fff;white-space:nowrap;text-shadow:2px 2px #000,-1px -1px #000,1px -1px #000,-1px 1px #000;-webkit-user-select:text;user-select:text;outline:none;padding:2px 4px;font-weight:700}.overlay-logo{pointer-events:auto;object-fit:contain;max-width:none}.overlay-del{background:var(--panel);border:1px solid var(--border);width:14px;height:14px;color:var(--muted);cursor:pointer;z-index:var(--z-canvas-overlay-ui);border-radius:50%;justify-content:center;align-items:center;font-size:9px;line-height:1;display:none;position:absolute;top:-8px;right:-8px}.overlay-el:hover .overlay-del{display:flex}.overlay-mini-toolbar{z-index:var(--z-canvas-overlay-ui);gap:2px;display:flex;position:absolute;top:-24px;left:0}.overlay-mini-toolbar button{background:var(--panel);color:var(--text);cursor:pointer;border:1px solid #ffffff4d;border-radius:6px;width:18px;height:18px;padding:0;font-size:10px;line-height:1}.overlay-resize-handle{background:var(--toxic);cursor:nwse-resize;width:10px;height:10px;z-index:var(--z-canvas-overlay-ui);border:2px solid #fff;border-radius:50%;position:absolute;bottom:-6px;right:-6px}.mapping-pattern{pointer-events:none;z-index:2;position:absolute;inset:0}.mapping-pattern .frame-border{border:2px solid #fff9;position:absolute;inset:6px}.monochrome-mode:not(.monochrome-suppressed) .mapping-bg,.monochrome-mode:not(.monochrome-suppressed) .cluster-bg{background-color:#000!important;background-image:none!important}.monochrome-mode:not(.monochrome-suppressed) .cluster-cell{border-color:#fff!important}.monochrome-mode:not(.monochrome-suppressed) .mapping-shared-layer svg rect[fill],.monochrome-mode:not(.monochrome-suppressed) .cluster-shared-layer svg rect[fill]{fill:#000!important}.monochrome-mode:not(.monochrome-suppressed) .mapping-shared-layer svg rect[stroke],.monochrome-mode:not(.monochrome-suppressed) .cluster-shared-layer svg rect[stroke],.monochrome-mode:not(.monochrome-suppressed) .mapping-lines line,.monochrome-mode:not(.monochrome-suppressed) .mapping-pattern-layer svg [stroke]{stroke:#fff!important}.monochrome-mode:not(.monochrome-suppressed) .mapping-pattern-layer svg [fill]:not([fill=none]):not(.plate-layer *){fill:#fff!important}.monochrome-mode:not(.monochrome-suppressed) .mapping-circle,.monochrome-mode:not(.monochrome-suppressed) .mapping-pattern .frame-border{border-color:#fff!important}.monochrome-mode:not(.monochrome-suppressed) .mapping-pattern[style*=background]{background:0 0!important;border:2px solid #fff!important}.monochrome-mode:not(.monochrome-suppressed) .panel-cell{--cab-outline-color:#fff!important}.monochrome-mode:not(.monochrome-suppressed) .screen-outline-svg path{stroke:#fff!important}
