:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}.app{color:#eee;background:#14161c;flex-direction:column;height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;display:flex}.toolbar{background:#1c1f28;border-bottom:1px solid #2c303c;align-items:center;gap:8px;padding:10px 14px;display:flex}.toolbar button{color:#eee;cursor:pointer;background:#2a2e3a;border:1px solid #3a3f4d;border-radius:6px;padding:6px 12px;font-size:13px}.toolbar button:hover:not(:disabled){background:#3a3f4d}.toolbar button:disabled{opacity:.4;cursor:default}.hint{color:#888;margin-left:auto;font-size:12px}.loading{color:#888;justify-content:center;align-items:center}.diagram-bar{background:#171a22}.diagram-name{color:#eee;background:0 0;border:1px solid #0000;border-radius:6px;flex:1;min-width:0;padding:6px 10px;font-size:15px;font-weight:600}.diagram-name:hover{border-color:#3a3f4d}.diagram-name:focus{background:#14161c;border-color:#6c8ee2;outline:none}.browser{background:#171a22;border-bottom:1px solid #2c303c;max-height:40vh;padding:12px 14px;overflow-y:auto}.diagram-search{color:#eee;background:#14161c;border:1px solid #3a3f4d;border-radius:6px;width:100%;padding:8px 10px;font-size:13px}.diagram-search:focus{border-color:#6c8ee2;outline:none}.browser-empty{color:#888;margin:12px 2px 2px;font-size:13px}.diagram-list{flex-direction:column;gap:2px;margin:10px 0 0;padding:0;list-style:none;display:flex}.diagram-list li{border-radius:6px;align-items:center;gap:4px;display:flex}.diagram-list li:hover{background:#21252f}.diagram-list li.current{background:#232a3a;box-shadow:inset 2px 0 #6c8ee2}.diagram-open{color:#eee;text-align:left;cursor:pointer;background:0 0;border:none;flex:1;align-items:baseline;gap:10px;min-width:0;padding:8px 10px;font-size:13px;display:flex}.diagram-list-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.diagram-list-date{color:#888;flex-shrink:0;margin-left:auto;font-size:11px}.diagram-delete{color:#888;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:6px 10px;font-size:16px;line-height:1}.diagram-delete:hover{color:#e88;background:#4a2a2e}.canvas{outline:none;flex:1;position:relative;overflow:auto}.world-sizer{overflow:hidden}.world{transform-origin:0 0;cursor:grab;background-image:radial-gradient(#2a2e3a 1px,#0000 1px);background-size:24px 24px;width:8000px;height:8000px;position:relative}.edges{pointer-events:none;position:absolute;inset:0}.node{text-align:center;cursor:grab;-webkit-user-select:none;user-select:none;background:#22252e;border:2px solid #888;border-radius:10px;min-width:90px;max-width:220px;padding:8px 16px;font-size:14px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 2px 8px #0000004d}.node.root{border-width:3px;font-size:16px;font-weight:600}.node.selected{box-shadow:0 0 0 2px #6c8ee2,0 2px 8px #0000004d}.node.drop-target{border-style:dashed;box-shadow:0 0 0 3px #6ce2a9,0 2px 8px #0000004d}.node input{color:#eee;text-align:center;background:#14161c;border:1px solid #3a3f4d;border-radius:4px;width:100%;padding:2px 6px;font-size:14px}.add-btn{color:#fff;cursor:pointer;opacity:0;pointer-events:none;background:#6c8ee2;border:none;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;font-size:14px;line-height:1;transition:opacity .12s;display:flex;position:absolute}.node:hover .add-btn,.node.selected .add-btn{opacity:1;pointer-events:auto}.add-child-btn{top:50%;right:-12px;transform:translateY(-50%)}.collapse-btn{background:#4a5164;border-radius:11px;width:auto;min-width:22px;padding:0 5px;font-size:12px;top:-11px;left:-11px}.collapse-btn:hover{background:#5d6579}.collapse-btn.collapsed{opacity:1;pointer-events:auto}.icon-btn{background:#4a5164;font-size:12px;top:-11px;right:-11px}.icon-btn:hover{background:#5d6579}.node-icon{margin-right:6px;font-size:15px;line-height:1}.icon-picker{z-index:10;cursor:default;background:#22252e;border:1px solid #3a3f4d;border-radius:8px;grid-template-columns:repeat(6,1fr);gap:2px;width:216px;padding:6px;display:grid;position:absolute;top:-8px;left:calc(100% + 16px);box-shadow:0 4px 16px #00000073}.icon-choice{cursor:pointer;background:0 0;border:none;border-radius:6px;width:32px;height:32px;font-size:18px;line-height:1}.icon-choice:hover{background:#3a3f4d}.icon-choice.chosen{background:#6c8ee2}.icon-clear{color:#aab;cursor:pointer;background:0 0;border:1px solid #3a3f4d;border-radius:6px;grid-column:1/-1;margin-top:4px;padding:5px;font-size:12px}.icon-clear:hover{color:#eee;background:#3a3f4d}.add-sibling-btn{background:#6ce2a9;bottom:-12px;left:50%;transform:translate(-50%)}.add-child-btn:hover{background:#8aa5ec}.add-sibling-btn:hover{background:#8eecc1}