/* Нитки между стикерами: провисают под своим весом, концы прижаты кнопками */
.arrow-layer {
  position: absolute; top: 0; left: 0;
  pointer-events: none;
  z-index: 10;
  overflow: visible;
}

.thread {
  fill: none;
  stroke-width: 2.1;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
  filter: url(#thread-fuzz);
}
.thread.shadow { stroke: rgba(0, 0, 0, .45); stroke-width: 3.4; filter: blur(1.4px); }
.thread.hit { stroke: transparent; stroke-width: 16; pointer-events: stroke; cursor: pointer; filter: none; }
.thread.selected { stroke-width: 3.2; }

.thread.blocks { stroke: var(--thread-blocks); }
.thread.depends_on { stroke: var(--thread-depends); stroke-dasharray: 9 5; }
.thread.transfers { stroke: var(--thread-transfers); stroke-dasharray: 3 6; }
.thread.related { stroke: var(--thread-related); stroke-dasharray: 1 7; }

/* Канцелярская кнопка на конце нитки */
.pin-shadow { fill: rgba(0, 0, 0, .4); }
.pin-body { stroke: rgba(0, 0, 0, .35); stroke-width: .7; }
.pin-gloss { fill: rgba(255, 255, 255, .8); }
.pin-group { pointer-events: all; cursor: pointer; }

.arrow-label {
  font-size: 10px; fill: var(--text-primary);
  paint-order: stroke; stroke: rgba(8, 12, 18, .85); stroke-width: 3.5px; stroke-linejoin: round;
  pointer-events: none; user-select: none;
}

.arrow-cp {
  fill: rgba(12, 18, 26, .9); stroke: var(--accent-blue); stroke-width: 1.5;
  pointer-events: all; cursor: grab; r: 5;
}
.arrow-cp:hover { fill: var(--accent-blue); }
.arrow-cp-line { stroke: var(--accent-blue); stroke-width: 1; stroke-dasharray: 3 3; opacity: .5; }

/* Нитка, которую тянут мышью */
.thread-draft { stroke: var(--accent-blue); stroke-width: 2.2; stroke-dasharray: 6 5; fill: none; opacity: .9; }

.arrow-hint {
  position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%);
  background: var(--glass-bg-strong); backdrop-filter: blur(14px);
  border: 1px solid var(--accent-blue);
  color: var(--text-primary); padding: 7px 15px; border-radius: 999px;
  font-size: 12px; z-index: 50; box-shadow: var(--glass-shadow);
}