/* vm-seq — 애니메이션 시퀀스 다이어그램 (참여자·라이프라인·메시지·Note·alt/else) */
.vm-seq {
  --sq-surface: #fcfcfb;
  --sq-border: rgba(11, 11, 11, 0.08);
  --sq-part: #f4f6f8;
  --sq-part-border: #cdccc2;
  --sq-ink: #1a1a1a;
  --sq-life: #d3d2c7;
  --sq-msg: #6f7a86;
  --sq-msg-active: #2a78d6;
  --sq-label: #4a4a45;
  --sq-note-fill: #fdf6e3;
  --sq-note-border: #e3d9b8;
  --sq-note-ink: #5c5638;
  --sq-frame: #b9b8ad;
  --sq-frame-tab-fill: #edeee7;
  --sq-frame-ink: #6a6a62;
  --sq-dot: #2a78d6;
  margin: 1.4rem 0;
  padding: 14px 16px 8px;
  background: var(--sq-surface);
  border: 1px solid var(--sq-border);
  border-radius: 14px;
}
html.dark .vm-seq {
  --sq-surface: #1b1b1a;
  --sq-border: rgba(255, 255, 255, 0.09);
  --sq-part: #242422;
  --sq-part-border: #3f3e39;
  --sq-ink: #f2f2ef;
  --sq-life: #3a3a35;
  --sq-msg: #8b95a1;
  --sq-msg-active: #4b93e6;
  --sq-label: #b3b1a8;
  --sq-note-fill: #2a2514;
  --sq-note-border: #4a4326;
  --sq-note-ink: #d6cfa8;
  --sq-frame: #45443f;
  --sq-frame-tab-fill: #2a2a27;
  --sq-frame-ink: #a5a29a;
  --sq-dot: #4b93e6;
}
.vm-seq > script { display: none; }
.vm-seq .seq-svg { display: block; width: 100%; height: auto; margin-inline: auto; }
.vm-seq .sq-msg-label-bg { fill: var(--sq-surface); }
.vm-seq .sq-life { stroke: var(--sq-life); stroke-width: 1.3; stroke-dasharray: 3 4; }
.vm-seq .sq-part-box { fill: var(--sq-part); stroke: var(--sq-part-border); stroke-width: 1.4; }
.vm-seq .sq-part-label { fill: var(--sq-ink); font-size: 12px; font-weight: 650; }
.vm-seq .sq-msg-line { stroke: var(--sq-msg); stroke-width: 1.5; }
.vm-seq .sq-msg-line.is-dashed { stroke-dasharray: 5 4; }
.vm-seq .sq-arrow { fill: var(--sq-msg); }
.vm-seq .sq-msg-label { fill: var(--sq-label); font-size: 11px; font-weight: 550; }
.vm-seq .sq-note-box { fill: var(--sq-note-fill); stroke: var(--sq-note-border); stroke-width: 1.2; }
.vm-seq .sq-note-text { fill: var(--sq-note-ink); font-size: 10.5px; font-weight: 500; }
.vm-seq .sq-frame-box { fill: none; stroke: var(--sq-frame); stroke-width: 1.2; stroke-dasharray: 4 4; }
.vm-seq .sq-frame-tab { fill: var(--sq-frame-tab-fill); stroke: var(--sq-frame); stroke-width: 1; }
.vm-seq .sq-frame-label { fill: var(--sq-frame-ink); font-size: 10px; font-weight: 700; }
.vm-seq .sq-frame-else { fill: var(--sq-frame-ink); font-size: 10px; font-weight: 600; }
.vm-seq .sq-dot { fill: var(--sq-dot); }
.vm-seq .seq-caption { margin-top: 6px; font-size: 12px; color: var(--sq-label); text-align: center; }