:root{--ink:#26343a;--muted:#6c7b82;--panel:#fff;--line:#dbe2e5;--accent:#e96f24;--accent2:#3e515a;--bg:#eef1f3;font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink)}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}body{background:var(--bg)}button,input,select,textarea{font:inherit}button{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:8px;padding:8px 11px;cursor:pointer}button:hover{border-color:#aab7bd;background:#f7f9fa}button:disabled{opacity:.45;cursor:not-allowed}.primary{background:var(--accent2);border-color:var(--accent2);color:#fff}.danger{color:#aa2f24}.wide{width:100%;margin:4px 0}.topbar{height:64px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:18px;padding:0 16px;position:relative;z-index:4}.brand{display:flex;align-items:center;gap:10px;min-width:195px}.brand-mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(145deg,#465860,#27353b);color:#fff;display:grid;place-items:center;font-weight:800}.brand div{display:flex;flex-direction:column}.brand small{color:var(--muted);max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.search-wrap{height:38px;min-width:250px;max-width:480px;flex:1;position:relative}.search-wrap input{width:100%;height:100%;border:1px solid var(--line);border-radius:10px;padding:0 52px 0 13px;background:#f7f9fa}.search-wrap span{position:absolute;right:11px;top:10px;font-size:12px;color:var(--muted)}.toolbar{display:flex;gap:6px;align-items:center}.toolbar output{font-size:12px;min-width:42px;text-align:center}.toolbar button{white-space:nowrap}main{display:grid;grid-template-columns:1fr 330px;height:calc(100% - 64px)}.canvas-shell{position:relative;overflow:hidden;background:#dfe5e8}.canvas{position:absolute;inset:0;overflow:hidden;background-image:radial-gradient(#b8c2c7 1px,transparent 1px);background-size:20px 20px}.canvas>img{position:absolute;left:0;top:0;max-width:none;pointer-events:none;display:none}.canvas svg{width:100%;height:100%;display:block;touch-action:none}.edge{fill:none;vector-effect:non-scaling-stroke;pointer-events:stroke}.edge-hit{fill:none;stroke:transparent;stroke-width:14;pointer-events:stroke}.edge.selected,.edge.related{filter:drop-shadow(0 0 3px #ff7c23);stroke:#f47721!important}.node-fo{overflow:visible}.node-card{width:100%;height:100%;display:flex;align-items:center;justify-content:center;text-align:center;padding:6px;white-space:pre-wrap;overflow:hidden;line-height:1.15;box-shadow:0 3px 8px #26343a20;user-select:none}.node-card.group{box-shadow:none}.node-card.decoration{box-shadow:none;background:transparent!important;border:0!important}.node.selected{filter:drop-shadow(0 0 5px #f47721)}.node.related{filter:drop-shadow(0 0 4px #ffc096)}.node.search-dim,.edge.search-dim{opacity:.14}.node .resize-handle{display:none;position:absolute;right:-5px;bottom:-5px;width:12px;height:12px;border-radius:3px;background:#fff;border:2px solid var(--accent);cursor:nwse-resize}.editing .node.selected .resize-handle{display:block}.node{cursor:pointer}.editing .node{cursor:move}.edge-label{font-size:12px;fill:#33434a;paint-order:stroke;stroke:#fff;stroke-width:4px;stroke-linejoin:round;pointer-events:none}.tooltip{position:absolute;z-index:8;width:280px;background:#fff;border:1px solid #cfd8dc;border-radius:12px;box-shadow:0 12px 30px #25323830;padding:14px;pointer-events:none}.tooltip h4{margin:0 0 3px;font-size:16px}.tooltip .role{color:var(--accent);font-weight:700}.tooltip dl{margin:10px 0 0;display:grid;grid-template-columns:86px 1fr;gap:5px;font-size:13px}.tooltip dt{color:var(--muted)}.tooltip dd{margin:0;white-space:pre-wrap}.status{position:absolute;left:12px;right:12px;bottom:10px;display:flex;justify-content:space-between;pointer-events:none;font-size:11px;color:#52636b}.status span{background:#ffffffdb;padding:5px 8px;border-radius:6px}.empty-hint{position:absolute;inset:0;display:grid;place-items:center;font-size:22px;color:#718087;pointer-events:none}aside{background:var(--panel);border-left:1px solid var(--line);display:flex;min-width:0;flex-direction:column}.aside-head{padding:15px 14px 11px;display:flex;justify-content:space-between}.aside-head div{display:flex;flex-direction:column;min-width:0}.aside-head small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}.aside-tabs{display:grid;grid-template-columns:repeat(3,1fr);padding:0 12px;border-bottom:1px solid var(--line)}.aside-tabs button{border:0;border-radius:0;background:none;padding:10px 4px}.aside-tabs button.active{color:var(--accent);border-bottom:2px solid var(--accent)}.tab{display:none;padding:14px;overflow:auto;flex:1}.tab.active{display:block}.tab h3{margin:4px 0 14px}.placeholder{color:var(--muted);font-size:13px;line-height:1.5;padding:18px 6px}form label,.tab>label{display:block;font-size:12px;color:var(--muted);margin:0 0 10px}input,select,textarea{width:100%;border:1px solid var(--line);border-radius:7px;padding:8px;color:var(--ink);background:#fff;margin-top:4px}textarea{min-height:68px;resize:vertical}fieldset{border:1px solid var(--line);border-radius:9px;padding:10px;margin:0 0 12px}legend{font-size:12px;color:var(--muted);padding:0 5px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.form-actions{display:flex;gap:7px;position:sticky;bottom:-14px;background:#fff;padding:10px 0 2px}.note{font-size:12px;color:var(--muted);line-height:1.5}.aside-foot{padding:10px 14px;border-top:1px solid var(--line);display:flex;justify-content:space-between}.layers-actions{display:flex;gap:7px;margin-bottom:10px}.layer-row{display:flex;align-items:center;gap:7px;padding:7px;border-bottom:1px solid #eef1f2;font-size:12px;cursor:pointer}.layer-row:hover{background:#f7f9fa}.layer-row span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.layer-row small{color:var(--muted)}dialog{border:0;border-radius:16px;max-width:560px;padding:26px;box-shadow:0 20px 60px #1a262c50;line-height:1.5}dialog::backdrop{background:#26343a88}.dialog-close{position:absolute;right:12px;top:12px}.dialog-close+ h2{margin-top:0}hr{border:0;border-top:1px solid var(--line);margin:18px 0}@media(max-width:1100px){.brand{min-width:auto}.brand div{display:none}.toolbar button{padding:8px}.toolbar #saveBtn,.toolbar #loadBtn{font-size:0}.toolbar #saveBtn:after{content:'↓ JSON';font-size:13px}.toolbar #loadBtn:after{content:'↑ JSON';font-size:13px}}@media(max-width:800px){main{grid-template-columns:1fr}aside{position:absolute;right:0;top:64px;bottom:0;width:min(330px,92vw);z-index:7;box-shadow:-10px 0 30px #26343a20}.topbar{gap:7px}.search-wrap{min-width:120px}.toolbar #undoBtn,.toolbar #redoBtn,.toolbar #zoomOut,.toolbar #zoomIn,.toolbar #zoomLabel,.toolbar #fitBtn{display:none}}

/* Keep the primary Apply action visible while editing long cards. */
.form-actions-top{position:sticky;top:-14px;bottom:auto;z-index:12;background:#fff;padding:8px 0 10px;margin:-14px 0 10px;border-bottom:1px solid var(--line);box-shadow:0 6px 10px #26343a0d}
.form-actions-top .primary{min-height:42px;font-weight:700}