#planning-accordion { border-bottom: 1px solid #2c3d4d; }
#planning-accordion > summary {
  padding: 12px; font-weight: 650; font-size: 12px; color: #d1dfed; cursor: pointer;
}
#planning-accordion[open] > summary { color: #9bd7c4; background: #19302e; }
.planning-panel-body { padding: 0 10px 14px; }
.planning-hint { font-size: 11px; color: #afc2d3; line-height: 1.5; min-height: 48px; }
.planning-connect { width: 100%; margin-top: 8px; font-size: 11px; }
.planning-connect[aria-pressed="true"] { background: #1d4b43; border-color: #9bd7c4; color: #fff; }
.planning-library { border-top: 1px solid #2c3d4d; padding: 8px 0; }
.planning-library h3 { font-size: 12px; margin: 0; }
.planning-symbols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.planning-symbol {
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
  gap: 4px; padding: 7px 4px; border: 1px solid #304558; border-radius: 7px;
  background: #15232f; color: #dce8f3; cursor: grab; touch-action: none;
  font: 11px/1.25 'Segoe UI', sans-serif; overflow-wrap: anywhere;
}
.planning-symbol:hover, .planning-symbol[aria-pressed="true"] { background: #263d4b; border-color: #99d9c7; }
.planning-symbol svg { width: 42px; height: 42px; pointer-events: none; }
.planning-symbol small { font-size: 9px; color: #90b0bf; }
.planning-symbol > * { pointer-events: none; }
.planning-rail { display: none; }
.is-collapsed .planning-rail {
  display: block; position: absolute; top: 146px; left: 0; width: 32px; height: 128px;
  writing-mode: vertical-rl; border: 0; border-top: 1px solid #2b3d50;
  background: #152532; color: #b5c7d8; font-size: 11px; cursor: pointer;
}
.is-collapsed .planning-rail.is-active { background: #20463f; color: #d9fff2; }
#phase-sidebar.is-collapsed .milestone-rail {
  position: absolute; top: 276px; left: 0; width: 32px; margin: 0; min-height: 120px;
}
.planning-drag-ghost {
  position: fixed; z-index: 110; pointer-events: none; max-width: 220px;
  padding: 8px 12px; border: 1px solid #94d8c1; border-radius: 6px;
  background: #17332e; color: #e8fff8; font: 12px 'Segoe UI', sans-serif;
}
.planning-wire-preview { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: 110; pointer-events: none; }
.planning-wire-preview path { fill: none; stroke: #a3ebd6; stroke-width: 2; stroke-dasharray: 6 4; }
.planning-drop-target .stair-opaque-ground { fill: #28483f; }
.is-planning.is-connecting [data-node-kind="role"],
.is-planning.is-connecting [data-node-kind="software"] { cursor: crosshair; }
.planning-endpoints { display: flex; gap: 12px; align-items: center; line-height: 1.5; }