/*
 * Over — Resizer
 * A drag handle that sits ON a panel's edge (absolute), so it adds no
 * layout width and never doubles the panel border.
 * Place inside a position:relative panel; set --edge to left or right.
 */

.resizer {
  position: absolute;
  top: 0;
  bottom: 0;
  width: var(--resizer-w);
  cursor: col-resize;
  z-index: var(--z-resizer);
  background: none;
}

.resizer--right { right: calc(var(--resizer-w) / -2); }
.resizer--left  { left:  calc(var(--resizer-w) / -2); }

/* Thin accent line, centred, only on hover/drag — no border doubling at rest */
.resizer::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  transform: translateX(-50%);
  background: var(--accent);
  opacity: 0;
  transition: opacity 0.12s ease;
}

.resizer:hover::after,
.resizer.is-dragging::after {
  opacity: 1;
}