/* DreamJ Brain Map v2.2.2 clean */
#djbm-canvas-wrap { position: relative; height: 78vh; border: 1px solid #ddd; overflow: auto; background: #fafafa; }
#djbm-canvas { position: relative; width: 2400px; height: 1600px; }

.djbm-toolbar { display:flex; gap:8px; margin:8px 0; }
.djbm-toolbar button { padding:6px 10px; }

.djbm-props { position: fixed; right: 0; top: 120px; width: 320px; background:#fff; border-left:1px solid #ddd; box-shadow:-6px 0 18px rgba(0,0,0,.06); }
.djbm-props .head { display:flex; justify-content:space-between; align-items:center; padding:10px 12px; background:#f4f6f9; border-bottom:1px solid #e6e6e6; }
.djbm-props .body { padding: 10px 12px; display:grid; gap:8px; }
.djbm-props.closed { width: 0; overflow: hidden; padding:0; }
#djbm-props-tab { position: fixed; right: 4px; top: 120px; display:none; width:32px; height:32px; border:1px solid #aaa; background:#fff; border-radius:6px; z-index:99999; }

.color-row { display:flex; gap:8px; }
.color-row .c { width:28px; height:22px; border:1px solid #aaa; cursor:pointer; border-radius:4px; }
.color-row .c.active { outline:2px solid #333; }

/* Node styles */
.drawflow-node .note-node { position: relative; padding:10px; border-radius:10px; min-width: 160px; }
.note-yellow { background:#fff6a9; }
.note-blue   { background:#cfe7ff; }
.note-green  { background:#d9f7be; }
.note-pink   { background:#ffd6e7; }

.note-s textarea{ font-size:13px; }
.note-m textarea{ font-size:14px; }
.note-l textarea{ font-size:16px; }

.note-text { width:100%; border:none; background:transparent; outline:none; resize:none; min-height: 80px; }

.resize-handle { position:absolute; right:6px; bottom:6px; width:12px; height:12px; border:1px solid #666; background:#fff8; cursor:nwse-resize; border-radius:3px; }
.note-time { position:absolute; right:8px; bottom:8px; font-size:11px; color:#555; }
.note-doc { position:absolute; left:8px; bottom:8px; cursor:pointer; opacity:.8; }

/* Drawflow fix */
.drawflow { overflow: visible !important; }