/* 主版面：flex 直向 + 中段 grid 三欄 */
#app { display: flex; flex-direction: column; height: 100vh; overflow: hidden; }

#toolbar {
  height: 48px; flex: 0 0 auto;
  display: flex; align-items: center; gap: 8px;
  padding: 0 10px;
  background: var(--bg-1);
  border-bottom: 1px solid var(--border);
  z-index: 5;
}

#workspace {
  flex: 1 1 auto;
  display: grid;
  grid-template-columns: var(--left-w, 288px) 1fr var(--right-w, 344px);
  min-height: 0;
}
#workspace.left-collapsed  { --left-w: 0px; }
#workspace.right-collapsed { --right-w: 0px; }

#left-panel, #inspector {
  overflow: auto;
  background: var(--bg-1);
  min-height: 0;
}
#left-panel { border-right: 1px solid var(--border); }
#inspector { border-left: 1px solid var(--border); }
#workspace.left-collapsed  #left-panel { display: none; }
#workspace.right-collapsed #inspector  { display: none; }

#canvas-host { position: relative; overflow: hidden; background: var(--bg-0); }
#graph-canvas, #canvas-overlay { position: absolute; inset: 0; width: 100%; height: 100%; }
#canvas-overlay { pointer-events: none; z-index: 2; }

#status-bar {
  height: 26px; flex: 0 0 auto;
  display: flex; align-items: center; gap: 14px;
  padding: 0 12px;
  font-size: 12px; color: var(--text-2);
  background: var(--bg-1);
  border-top: 1px solid var(--border);
}

/* 面板收合把手（固定於畫布邊緣） */
.collapse-handle {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 16px; height: 48px; z-index: 3;
  display: flex; align-items: center; justify-content: center;
  background: var(--bg-2); border: 1px solid var(--border);
  color: var(--text-2); font-size: 11px;
}
.collapse-handle.left  { left: 0; border-left: none; border-radius: 0 6px 6px 0; }
.collapse-handle.right { right: 0; border-right: none; border-radius: 6px 0 0 6px; }

@media (max-width: 1100px) {
  #workspace { grid-template-columns: 0 1fr 0; }
  #left-panel, #inspector {
    position: absolute; top: 48px; bottom: 26px; width: 300px; z-index: 20;
    box-shadow: var(--shadow-2);
  }
  #left-panel { left: 0; }
  #inspector { right: 0; }
}
