#designer{--surface:#fff;--canvas:#f5f9fe;--ink:#173456;--muted:#65778d;--line:#dbe5f0;--accent:#164fe5;max-width:1800px;padding:28px 20px 48px;margin:auto;color:var(--ink);font-size:14px}#designer.dark{--surface:#152840;--canvas:#0c1c30;--ink:#e4edf9;--muted:#adc0d9;--line:#35516f;--accent:#83b0ff;background:var(--canvas);color-scheme:dark}.designer-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.designer-heading h1{font-size:38px;letter-spacing:-1px;margin:10px 0}.designer-heading p{color:var(--muted)}.local-note{color:#08764e;background:#e9f8ef;padding:10px 14px;border-radius:22px;font-size:12px}.designer-settings{display:grid;grid-template-columns:2fr 1fr 1fr;gap:14px;margin:20px 0}#designer label{display:block;font-size:12px;font-weight:650;margin-bottom:10px}#designer input,#designer select{display:block;width:100%;min-width:0;padding:11px;margin-top:5px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit}#designer button{min-height:44px;padding:9px 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:600 12px system-ui;cursor:pointer}#designer button:hover{border-color:var(--accent)}#designer button[aria-pressed=true]{background:#164fe5;color:white}#designer button:disabled{opacity:.4;cursor:default}#designer :focus-visible{outline:3px solid var(--accent);outline-offset:3px}.designer-toolbar{display:flex;flex-wrap:wrap;gap:6px;padding:12px;background:var(--surface);border:1px solid var(--line);border-radius:12px}#designer-status,#designer-help{padding:12px 14px;line-height:1.7;border-radius:8px;background:var(--surface);border:1px solid var(--line);margin:12px 0}#designer-status.error{border-color:#ce573e;color:#a83523}.designer-layout{display:grid;grid-template-columns:195px minmax(0,1fr) 270px;gap:12px;align-items:start}.designer-layout>aside{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:16px;max-height:760px;overflow:auto;min-width:0}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}#designer h2{font-size:16px;font-weight:750;margin:0}#designer aside p,.designer-note{font-size:12px;color:var(--muted);line-height:1.8}#palette-items{display:grid;gap:7px}#palette-items button{text-align:left}.designer-workspace{position:relative;min-width:0;background:var(--canvas);border:1px solid var(--line);border-radius:12px;overflow:hidden}.canvas-heading,.canvas-footer{display:flex;justify-content:space-between;gap:10px;padding:12px;background:var(--surface);font-size:11px;color:var(--muted)}#designer-canvas{display:block;width:100%;height:650px;touch-action:none;user-select:none}.designer-node rect{fill:var(--surface);stroke:var(--line);stroke-width:1.5}.designer-node.selected rect,.designer-node:focus rect{stroke:var(--accent);stroke-width:3}.designer-node{cursor:grab;outline:none}.designer-node text{font:600 12px system-ui;fill:var(--ink);pointer-events:none}.designer-node .detail{font:11px system-ui;fill:var(--muted)}.designer-node .port{fill:#d9e7ff;stroke:#497ab8;cursor:crosshair}.designer-node .port.used{fill:#16a67a}.designer-node .port.chosen{fill:#ffcc36}.designer-edge{stroke:#6b92c5;stroke-width:2.5;fill:none}.designer-edge.selected{stroke:var(--accent);stroke-width:4}.edge-hit{stroke:transparent;stroke-width:18;fill:none;cursor:pointer}.edge-label{fill:var(--ink);font:11px system-ui;paint-order:stroke;stroke:var(--canvas);stroke-width:4;pointer-events:none}#designer fieldset{border:0;border-top:1px solid var(--line);margin-top:14px;padding:12px 0 0}#designer legend{float:none;width:auto;font-size:12px;font-weight:750;margin:0 0 10px}#properties-form button{width:100%}#minimap{position:absolute;right:12px;bottom:50px;width:150px;height:100px;padding:4px!important;opacity:.9}#minimap-svg{width:100%;height:100%;display:block}.designer-note{margin-top:16px}#palette-toggle,#palette-close,#properties-close{display:none}#designer [hidden]{display:none!important}
@media(max-width:1100px){.designer-layout{grid-template-columns:165px minmax(0,1fr) 230px}}
@media(max-width:900px){#designer{padding:20px 10px}.designer-heading{align-items:start;flex-direction:column}.designer-heading h1{font-size:30px}.designer-settings{grid-template-columns:1fr 1fr}.designer-settings label:first-child{grid-column:1/-1}.designer-layout{grid-template-columns:1fr}#palette-toggle,#palette-close,#properties-close{display:block}#designer-palette{display:none;max-height:50dvh}.designer-layout #designer-palette.open{display:block}#designer-properties{display:none;position:fixed;bottom:0;left:0;right:0;z-index:900;max-height:65dvh!important;border-radius:18px 18px 0 0;padding-bottom:max(18px,env(safe-area-inset-bottom));box-shadow:0 -10px 40px #07182b44}#designer-properties.open{display:block}#designer-canvas{height:520px}.designer-toolbar{padding:8px;gap:5px}.designer-toolbar button{flex:1 1 auto}#minimap{width:100px;height:65px}}