/* Case stage library — six geometric process types.
   Ink / paper / signal. Labels come from the case. */
.stage {
  height: 200px;
  margin: 16px 0 22px;
  position: relative;
  border: 1px solid #2a2620;
  overflow: hidden;
  background: #0e0d0b;
  color: var(--paper, #ede6d4);
}
.stage.is-compact { height: 148px; margin: 12px 0 16px; }
.stage.is-page {
  height: min(420px, 52vw);
  min-height: 280px;
  margin: 28px 0 8px;
}
.stage b {
  font: 600 9px/1 "Space Grotesk", sans-serif;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--paper, #ede6d4);
}
.stage.is-compact b { font-size: 8px; letter-spacing: 0.1em; }
.stage.is-page b { font-size: 11px; }
.stage .node {
  position: absolute;
  border: 1.5px solid #c8c0ae;
  background: #161410;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
}

/* 1. intake-to-system — mail/orders → parse → system, exception to HUMAN */
.atype-intake-to-system .email,
.c1 .email { left: 5%; top: 12%; width: 23%; height: 50%; }
.atype-intake-to-system .parse,
.c1 .parse { left: 36%; top: 12%; width: 25%; height: 50%; }
.atype-intake-to-system .tms,
.c1 .tms {
  left: 68%; top: 8%; width: 27%; height: 58%;
  border-width: 2px;
  animation: tms-hit 4.2s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-intake-to-system .human,
.c1 .human {
  left: 36%; top: 72%; width: 25%; height: 22%;
  border-style: dashed; border-color: #c8c0ae;
}
.atype-intake-to-system .wire-h,
.c1 .wire-h {
  position: absolute; left: 26%; top: 34%; width: 44%; height: 2px;
  background: #c8c0ae;
}
.atype-intake-to-system .wire-v,
.c1 .wire-v {
  position: absolute; left: 48%; top: 62%; width: 2px; height: 10%;
  background: #c8c0ae;
}
.atype-intake-to-system .arrow,
.c1 .arrow {
  position: absolute;
  width: 0; height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 8px solid #c8c0ae;
}
.atype-intake-to-system .arrow.a1,
.c1 .arrow.a1 { left: 33%; top: 30%; }
.atype-intake-to-system .arrow.a2,
.c1 .arrow.a2 { left: 64%; top: 30%; }
.atype-intake-to-system .env,
.c1 .env {
  width: 36px; height: 24px; color: var(--paper, #ede6d4); display: block;
}
.stage.is-compact.atype-intake-to-system .env { width: 26px; height: 18px; }
.atype-intake-to-system .env .flap,
.c1 .env .flap {
  transform-box: fill-box; transform-origin: 50% 0%;
  animation: env-open 4.2s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
@keyframes env-open {
  0%, 8% { transform: scaleY(1); }
  16%, 72% { transform: scaleY(0.18); }
  86%, 100% { transform: scaleY(1); }
}
.atype-intake-to-system .fields,
.c1 .fields { display: flex; flex-direction: column; gap: 5px; width: 64%; }
.atype-intake-to-system .fields i,
.c1 .fields i {
  display: block; height: 3px; background: var(--paper, #ede6d4);
  transform: scaleX(1); transform-origin: left; opacity: 0.4;
  animation: parse-line 4.2s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-intake-to-system .fields i:nth-child(1),
.c1 .fields i:nth-child(1) { width: 100%; }
.atype-intake-to-system .fields i:nth-child(2),
.c1 .fields i:nth-child(2) { width: 68%; animation-delay: 0.1s; }
.atype-intake-to-system .fields i:nth-child(3),
.c1 .fields i:nth-child(3) { width: 86%; animation-delay: 0.2s; }
@keyframes parse-line {
  0%, 10% { opacity: 0.4; background: var(--paper, #ede6d4); }
  24%, 72% { opacity: 1; background: var(--signal, #ff3b1f); }
  88%, 100% { opacity: 0.4; background: var(--paper, #ede6d4); }
}
@keyframes tms-hit {
  0%, 42% { border-color: #c8c0ae; box-shadow: none; }
  52%, 76% { border-color: var(--signal, #ff3b1f); box-shadow: inset 0 0 0 1px var(--signal, #ff3b1f); }
  90%, 100% { border-color: #c8c0ae; box-shadow: none; }
}
.atype-intake-to-system .tok,
.c1 .tok {
  position: absolute; z-index: 2;
  width: 9px; height: 9px; background: var(--signal, #ff3b1f);
  left: 14%; top: 33%;
  animation: c1-in 4.2s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-intake-to-system .t1, .c1 .t1 { animation-delay: 0s; }
.atype-intake-to-system .t2, .c1 .t2 { animation-delay: 0.32s; transform: translateY(8px); }
.atype-intake-to-system .t3, .c1 .t3 { animation-delay: 0.64s; transform: translateY(16px); }
.atype-intake-to-system .tex, .c1 .tex { animation-name: c1-ex; animation-delay: 0.48s; transform: none; }
@keyframes c1-in {
  0% { left: 14%; top: 33%; opacity: 0; }
  8% { opacity: 1; }
  26% { left: 46%; top: 33%; }
  50% { left: 78%; top: 22%; }
  62%, 78% { left: 79%; top: 30%; opacity: 1; }
  90%, 100% { left: 79%; top: 30%; opacity: 0; }
}
@keyframes c1-ex {
  0% { left: 14%; top: 33%; opacity: 0; }
  8% { opacity: 1; }
  26% { left: 46%; top: 33%; }
  42% { left: 47%; top: 50%; }
  58%, 78% { left: 47%; top: 78%; opacity: 1; }
  90%, 100% { left: 47%; top: 78%; opacity: 0; }
}

/* 2. docs-to-dossier — loose docs → one folder → human sign */
.atype-docs-to-dossier .doc,
.c2 .doc {
  position: absolute; z-index: 2;
  width: 23%; height: 48%;
  border: 1.5px solid #c8c0ae; background: #1a1814;
  display: flex; flex-direction: column; align-items: flex-start;
  padding: 8px 8px; gap: 5px;
}
.atype-docs-to-dossier .doc i, .c2 .doc i { display: block; height: 2px; width: 72%; background: #c8c0ae; }
.atype-docs-to-dossier .doc i:last-child, .c2 .doc i:last-child { width: 46%; }
.atype-docs-to-dossier .s1, .c2 .s1 { left: 5%; top: 12%; animation: c2-s1 4.6s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
.atype-docs-to-dossier .s2, .c2 .s2 { left: 18%; top: 28%; animation: c2-s2 4.6s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
.atype-docs-to-dossier .s3, .c2 .s3 { left: 7%; top: 44%; animation: c2-s3 4.6s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
@keyframes c2-s1 {
  0%, 6% { left: 5%; top: 12%; opacity: 1; transform: scale(1); }
  42%, 78% { left: 52%; top: 14%; opacity: 1; transform: scale(0.72); }
  90%, 100% { left: 52%; top: 14%; opacity: 0; transform: scale(0.72); }
}
@keyframes c2-s2 {
  0%, 10% { left: 18%; top: 28%; opacity: 1; transform: scale(1); }
  46%, 78% { left: 66%; top: 24%; opacity: 1; transform: scale(0.72); }
  90%, 100% { left: 66%; top: 24%; opacity: 0; transform: scale(0.72); }
}
@keyframes c2-s3 {
  0%, 14% { left: 7%; top: 44%; opacity: 1; transform: scale(1); }
  50%, 78% { left: 56%; top: 38%; opacity: 1; transform: scale(0.72); }
  90%, 100% { left: 56%; top: 38%; opacity: 0; transform: scale(0.72); }
}
.atype-docs-to-dossier .dossier,
.c2 .dossier {
  position: absolute; right: 6%; top: 12%; width: 36%; height: 62%; z-index: 1;
}
.atype-docs-to-dossier .dossier .tab,
.c2 .dossier .tab {
  position: absolute; left: 0; top: 0; width: 48%; height: 18px;
  background: #161410; border: 1.5px solid #c8c0ae; border-bottom: 0;
  display: flex; align-items: center; justify-content: center;
  font: 600 8px/1 "Space Grotesk", sans-serif;
  letter-spacing: 0.12em; text-transform: uppercase;
}
.atype-docs-to-dossier .dossier .body,
.c2 .dossier .body {
  position: absolute; left: 0; right: 0; top: 16px; bottom: 0;
  border: 1.5px solid #c8c0ae; background: #161410;
  animation: dossier-fill 4.6s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
@keyframes dossier-fill {
  0%, 28% { border-color: #c8c0ae; background: #161410; }
  48%, 82% { border-color: var(--paper, #ede6d4); background: #1f1c18; }
  94%, 100% { border-color: #c8c0ae; background: #161410; }
}
.atype-docs-to-dossier .stamp-mark,
.c2 .stamp-mark {
  position: absolute; right: 9%; bottom: 8%; z-index: 3;
  font: 800 11px/1 "Space Grotesk", sans-serif; letter-spacing: 0.14em;
  color: var(--signal, #ff3b1f); border: 1.5px solid var(--signal, #ff3b1f); padding: 7px 8px;
  background: #0e0d0b;
  animation: stamp-in 4.6s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
@keyframes stamp-in {
  0%, 44% { opacity: 0; transform: scale(1.35) rotate(-10deg); }
  54%, 86% { opacity: 1; transform: scale(1) rotate(-6deg); }
  96%, 100% { opacity: 0; transform: scale(1) rotate(-6deg); }
}

/* 3. match-exception — A vs B vs catalogue; exceptions peel off */
.atype-match-exception .part,
.c3 .part {
  position: absolute; z-index: 2;
  display: flex; align-items: center; justify-content: center;
  border: 1.5px solid #c8c0ae; background: #161410;
}
.atype-match-exception .po, .c3 .po { left: 1%; top: 26%; width: 20%; height: 42%; animation: po-in 4.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
.atype-match-exception .qc, .c3 .qc { right: 1%; top: 26%; width: 20%; height: 42%; animation: qc-in 4.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
.atype-match-exception .cat, .c3 .cat {
  left: 32%; top: 20%; width: 36%; height: 54%;
  border-width: 2px; z-index: 1;
  animation: cat-hit 4.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
@keyframes po-in {
  0%, 8% { left: 1%; top: 26%; }
  32%, 78% { left: 10%; top: 26%; }
  92%, 100% { left: 1%; top: 26%; }
}
@keyframes qc-in {
  0%, 8% { right: 1%; top: 26%; left: auto; }
  32%, 78% { right: 10%; top: 26%; left: auto; }
  92%, 100% { right: 1%; top: 26%; left: auto; }
}
@keyframes cat-hit {
  0%, 28% { border-color: #c8c0ae; }
  40%, 78% { border-color: var(--signal, #ff3b1f); }
  90%, 100% { border-color: #c8c0ae; }
}
.atype-match-exception .meet-line,
.c3 .meet-line {
  position: absolute; left: 16%; right: 16%; top: 46%; height: 2px;
  background: var(--signal, #ff3b1f); transform: scaleX(0); transform-origin: center;
  animation: meet-draw 4.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
@keyframes meet-draw {
  0%, 22% { transform: scaleX(0); }
  38%, 78% { transform: scaleX(1); }
  92%, 100% { transform: scaleX(0); }
}
.atype-match-exception .tick,
.c3 .tick {
  position: absolute; left: 50%; top: 40%; z-index: 3;
  width: 26px; height: 26px; margin-left: -13px;
  color: var(--signal, #ff3b1f);
  animation: tick-in 4.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-match-exception .tick path,
.c3 .tick path {
  fill: none; stroke: currentColor; stroke-width: 2.6;
  stroke-linecap: square; stroke-linejoin: miter;
  stroke-dasharray: 1; stroke-dashoffset: 1;
  animation: tick-draw 4.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
@keyframes tick-draw {
  0%, 30% { stroke-dashoffset: 1; }
  44%, 80% { stroke-dashoffset: 0; }
  92%, 100% { stroke-dashoffset: 1; }
}
@keyframes tick-in {
  0%, 30% { opacity: 0; }
  44%, 80% { opacity: 1; }
  92%, 100% { opacity: 0; }
}
.atype-match-exception .exc, .c3 .exc {
  left: 72%; top: 28%; opacity: 0; z-index: 4;
  width: 16%; height: 24%;
  border-style: dashed; border-color: var(--signal, #ff3b1f);
  color: var(--signal, #ff3b1f); background: #0e0d0b;
  animation: exc-peel 4.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-match-exception .exc b, .c3 .exc b { color: var(--signal, #ff3b1f); font-size: 11px; letter-spacing: 0.06em; }
@keyframes exc-peel {
  0%, 36% { left: 70%; top: 30%; opacity: 0; }
  44% { left: 70%; top: 30%; opacity: 1; }
  64%, 82% { left: 80%; top: 70%; opacity: 1; }
  92%, 100% { left: 80%; top: 70%; opacity: 0; }
}

/* 4. three-way-match — PO / invoice / receipt into one match */
.atype-three-way-match .twm-a { left: 6%; top: 8%; width: 24%; height: 28%; animation: twm-a 4.5s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
.atype-three-way-match .twm-b { right: 6%; top: 8%; width: 24%; height: 28%; animation: twm-b 4.5s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
.atype-three-way-match .twm-c { left: 38%; bottom: 8%; width: 24%; height: 26%; animation: twm-c 4.5s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
.atype-three-way-match .twm-core {
  left: 36%; top: 32%; width: 28%; height: 34%;
  border-width: 2px;
  animation: twm-core 4.5s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-three-way-match .twm-exc {
  position: absolute; right: 6%; bottom: 10%; width: 18%; height: 22%;
  border: 1.5px dashed var(--signal, #ff3b1f);
  color: var(--signal, #ff3b1f);
  display: flex; align-items: center; justify-content: center;
  background: #0e0d0b;
  animation: twm-exc 4.5s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-three-way-match .twm-exc b { color: var(--signal, #ff3b1f); }
.atype-three-way-match .twm-ray {
  position: absolute; height: 2px; background: #5c574c; transform-origin: left center;
  animation: twm-ray 4.5s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-three-way-match .twm-r1 { left: 22%; top: 22%; width: 18%; transform: rotate(28deg); }
.atype-three-way-match .twm-r2 { right: 22%; top: 22%; width: 18%; transform: rotate(-28deg); transform-origin: right center; }
.atype-three-way-match .twm-r3 { left: 50%; top: 62%; width: 2px; height: 12%; background: #5c574c; animation: twm-ray-v 4.5s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
@keyframes twm-a {
  0%, 10% { left: 6%; top: 8%; }
  36%, 78% { left: 18%; top: 18%; }
  92%, 100% { left: 6%; top: 8%; }
}
@keyframes twm-b {
  0%, 10% { right: 6%; top: 8%; left: auto; }
  36%, 78% { right: 18%; top: 18%; left: auto; }
  92%, 100% { right: 6%; top: 8%; left: auto; }
}
@keyframes twm-c {
  0%, 10% { left: 38%; bottom: 8%; }
  36%, 78% { left: 38%; bottom: 18%; }
  92%, 100% { left: 38%; bottom: 8%; }
}
@keyframes twm-core {
  0%, 28% { border-color: #c8c0ae; }
  42%, 80% { border-color: var(--signal, #ff3b1f); box-shadow: inset 0 0 0 1px var(--signal, #ff3b1f); }
  92%, 100% { border-color: #c8c0ae; box-shadow: none; }
}
@keyframes twm-exc {
  0%, 48% { opacity: 0; transform: translate(0, -8px); }
  58%, 84% { opacity: 1; transform: translate(0, 0); }
  94%, 100% { opacity: 0; }
}
@keyframes twm-ray {
  0%, 18% { transform: rotate(28deg) scaleX(0); opacity: 0.3; }
  36%, 78% { transform: rotate(28deg) scaleX(1); opacity: 1; }
  92%, 100% { transform: rotate(28deg) scaleX(0); opacity: 0.3; }
}
.atype-three-way-match .twm-r2 { animation-name: twm-ray-r; }
@keyframes twm-ray-r {
  0%, 18% { transform: rotate(-28deg) scaleX(0); opacity: 0.3; }
  36%, 78% { transform: rotate(-28deg) scaleX(1); opacity: 1; }
  92%, 100% { transform: rotate(-28deg) scaleX(0); opacity: 0.3; }
}
@keyframes twm-ray-v {
  0%, 18% { transform: scaleY(0); opacity: 0.3; }
  36%, 78% { transform: scaleY(1); opacity: 1; }
  92%, 100% { transform: scaleY(0); opacity: 0.3; }
}

/* 5. queue-triage — inbound pile → sorted lanes */
.atype-queue-triage .qt-pile {
  position: absolute; left: 5%; top: 14%; width: 22%; height: 72%;
  border: 1.5px solid #c8c0ae; background: #161410;
  display: flex; flex-direction: column; justify-content: flex-end; gap: 4px;
  padding: 8px 8px 10px;
}
.atype-queue-triage .qt-pile i {
  display: block; height: 8px; background: #c8c0ae; opacity: 0.85;
  animation: qt-bar 4.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-queue-triage .qt-pile i:nth-child(1) { width: 88%; animation-delay: 0s; }
.atype-queue-triage .qt-pile i:nth-child(2) { width: 70%; animation-delay: 0.12s; }
.atype-queue-triage .qt-pile i:nth-child(3) { width: 92%; animation-delay: 0.24s; }
.atype-queue-triage .qt-pile i:nth-child(4) { width: 64%; animation-delay: 0.36s; }
.atype-queue-triage .qt-pile b { margin-top: auto; align-self: center; }
@keyframes qt-bar {
  0%, 12% { opacity: 0.9; transform: translateX(0); }
  28% { opacity: 0; transform: translateX(12px); }
  40%, 100% { opacity: 0.25; transform: translateX(0); }
}
.atype-queue-triage .qt-lane {
  position: absolute; top: 14%; width: 20%; height: 72%;
  border: 1.5px solid #c8c0ae; background: #161410;
  display: flex; flex-direction: column; align-items: center; justify-content: flex-end;
  padding-bottom: 10px; gap: 5px;
}
.atype-queue-triage .qt-l0 { left: 34%; }
.atype-queue-triage .qt-l1 { left: 56%; }
.atype-queue-triage .qt-l2 { left: 78%; }
.atype-queue-triage .qt-lane .fill {
  position: absolute; left: 10%; right: 10%; bottom: 28%;
  background: var(--paper, #ede6d4);
  transform-origin: bottom;
  animation: qt-fill 4.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-queue-triage .qt-l0 .fill { height: 42%; animation-delay: 0.15s; }
.atype-queue-triage .qt-l1 .fill { height: 28%; animation-delay: 0.35s; background: var(--signal, #ff3b1f); }
.atype-queue-triage .qt-l2 .fill { height: 18%; animation-delay: 0.5s; opacity: 0.45; }
@keyframes qt-fill {
  0%, 16% { transform: scaleY(0); }
  40%, 82% { transform: scaleY(1); }
  94%, 100% { transform: scaleY(0); }
}
.atype-queue-triage .qt-tok {
  position: absolute; z-index: 3; width: 8px; height: 8px; background: var(--signal, #ff3b1f);
  left: 14%; top: 28%;
  animation: qt-fly 4.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-queue-triage .qt-k0 { animation-name: qt-fly0; }
.atype-queue-triage .qt-k1 { animation-name: qt-fly1; animation-delay: 0.2s; }
.atype-queue-triage .qt-k2 { animation-name: qt-fly2; animation-delay: 0.4s; }
@keyframes qt-fly0 {
  0% { left: 14%; top: 30%; opacity: 0; }
  8% { opacity: 1; }
  32%, 78% { left: 42%; top: 36%; opacity: 1; }
  90%, 100% { left: 42%; top: 36%; opacity: 0; }
}
@keyframes qt-fly1 {
  0% { left: 14%; top: 42%; opacity: 0; }
  8% { opacity: 1; }
  34%, 78% { left: 64%; top: 40%; opacity: 1; }
  90%, 100% { left: 64%; top: 40%; opacity: 0; }
}
@keyframes qt-fly2 {
  0% { left: 14%; top: 54%; opacity: 0; }
  8% { opacity: 1; }
  36%, 78% { left: 86%; top: 48%; opacity: 1; }
  90%, 100% { left: 86%; top: 48%; opacity: 0; }
}

/* 6. exception-human — happy path auto, red slice to human tray */
.atype-exception-human .eh-rail {
  position: absolute; left: 6%; right: 28%; top: 38%; height: 2px; background: #5c574c;
}
.atype-exception-human .eh-src {
  left: 5%; top: 22%; width: 20%; height: 48%;
}
.atype-exception-human .eh-auto {
  left: 40%; top: 18%; width: 28%; height: 56%;
  border-width: 2px;
  animation: eh-auto 4.3s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-exception-human .eh-tray {
  right: 5%; top: 58%; width: 24%; height: 32%;
  border-style: dashed; border-color: var(--signal, #ff3b1f);
  color: var(--signal, #ff3b1f);
}
.atype-exception-human .eh-tray b,
.atype-exception-human .eh-tray .pct { color: var(--signal, #ff3b1f); }
.atype-exception-human .eh-tray .pct {
  font: 800 12px/1 "Bricolage Grotesque", sans-serif; letter-spacing: -0.04em;
}
.atype-exception-human .eh-drop {
  position: absolute; left: 54%; top: 50%; width: 2px; height: 18%;
  background: var(--signal, #ff3b1f);
  transform-origin: top;
  animation: eh-drop 4.3s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-exception-human .eh-tok {
  position: absolute; z-index: 2; width: 10px; height: 10px; background: var(--paper, #ede6d4);
  animation: eh-ok 4.3s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-exception-human .eh-a { animation-delay: 0s; }
.atype-exception-human .eh-b { animation-delay: 0.28s; }
.atype-exception-human .eh-c { animation-delay: 0.56s; }
.atype-exception-human .eh-bad {
  background: var(--signal, #ff3b1f);
  animation-name: eh-bad;
  animation-delay: 0.2s;
}
@keyframes eh-ok {
  0% { left: 12%; top: 40%; opacity: 0; }
  8% { opacity: 1; }
  38%, 72% { left: 52%; top: 40%; opacity: 1; }
  86%, 100% { left: 52%; top: 40%; opacity: 0; }
}
@keyframes eh-bad {
  0% { left: 12%; top: 40%; opacity: 0; }
  8% { opacity: 1; }
  30% { left: 52%; top: 40%; }
  48%, 78% { left: 78%; top: 70%; opacity: 1; }
  90%, 100% { left: 78%; top: 70%; opacity: 0; }
}
@keyframes eh-auto {
  0%, 30% { border-color: #c8c0ae; }
  42%, 78% { border-color: var(--paper, #ede6d4); }
  90%, 100% { border-color: #c8c0ae; }
}
@keyframes eh-drop {
  0%, 28% { transform: scaleY(0); opacity: 0; }
  40%, 70% { transform: scaleY(1); opacity: 1; }
  86%, 100% { transform: scaleY(0); opacity: 0; }
}

/* 7. jira-git-score — issue + commit/PR → DEV vs QA lanes */
.atype-jira-git-score .jgs-src {
  position: absolute; left: 5%; width: 26%; height: 36%;
  border: 1.5px solid #c8c0ae; background: #161410;
  display: flex; flex-direction: column; align-items: flex-start;
  padding: 8px 10px; gap: 5px;
}
.atype-jira-git-score .jgs-jira { top: 10%; }
.atype-jira-git-score .jgs-git { top: 52%; }
.atype-jira-git-score .jgs-src i {
  display: block; height: 2px; width: 72%; background: #c8c0ae;
}
.atype-jira-git-score .jgs-src i:last-child { width: 46%; }
.atype-jira-git-score .jgs-key,
.atype-jira-git-score .jgs-pr {
  font: 800 10px/1 "Space Grotesk", sans-serif;
  letter-spacing: 0.12em; color: var(--paper, #ede6d4);
}
.atype-jira-git-score .jgs-git { animation: jgs-git 5.2s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
.atype-jira-git-score .jgs-jira { animation: jgs-jira 5.2s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
@keyframes jgs-jira {
  0%, 12% { border-color: #c8c0ae; }
  22%, 70% { border-color: var(--signal, #ff3b1f); }
  86%, 100% { border-color: #c8c0ae; }
}
@keyframes jgs-git {
  0%, 18% { border-color: #c8c0ae; }
  30%, 74% { border-color: var(--paper, #ede6d4); }
  90%, 100% { border-color: #c8c0ae; }
}
.atype-jira-git-score .jgs-lane {
  position: absolute; right: 5%; width: 48%; height: 32%;
  border: 1.5px solid #c8c0ae; background: #161410;
  display: flex; align-items: flex-end; justify-content: flex-end;
  padding: 8px 10px;
}
.atype-jira-git-score .jgs-dev { top: 12%; }
.atype-jira-git-score .jgs-qa { top: 54%; }
.atype-jira-git-score .jgs-lane .fill {
  position: absolute; left: 8%; bottom: 28%; height: 8px;
  background: var(--paper, #ede6d4);
  transform-origin: left;
  animation: jgs-fill 5.2s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-jira-git-score .jgs-dev .fill { width: 72%; }
.atype-jira-git-score .jgs-qa .fill {
  width: 48%; background: var(--signal, #ff3b1f); animation-delay: 0.22s;
}
@keyframes jgs-fill {
  0%, 28% { transform: scaleX(0); }
  48%, 82% { transform: scaleX(1); }
  94%, 100% { transform: scaleX(0); }
}
.atype-jira-git-score .jgs-tok {
  position: absolute; z-index: 2; width: 8px; height: 8px;
  background: var(--signal, #ff3b1f);
}
.atype-jira-git-score .jgs-t0 { animation: jgs-fly0 5.2s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
.atype-jira-git-score .jgs-t1 { animation: jgs-fly1 5.2s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
@keyframes jgs-fly0 {
  0% { left: 16%; top: 24%; opacity: 0; }
  10% { opacity: 1; }
  40%, 78% { left: 62%; top: 24%; opacity: 1; }
  90%, 100% { left: 62%; top: 24%; opacity: 0; }
}
@keyframes jgs-fly1 {
  0% { left: 16%; top: 66%; opacity: 0; }
  14% { opacity: 1; }
  44%, 78% { left: 58%; top: 66%; opacity: 1; }
  90%, 100% { left: 58%; top: 66%; opacity: 0; }
}

/* 8. ticket-to-prod — ticket → git → staging → prod; exception to HUMAN */
.atype-ticket-to-prod .ttp-rail {
  position: absolute; left: 8%; right: 10%; top: 32%; height: 2px; background: #5c574c;
}
.atype-ticket-to-prod .ttp-node {
  top: 12%; width: 18%; height: 42%;
}
.atype-ticket-to-prod .ttp-ticket { left: 4%; }
.atype-ticket-to-prod .ttp-git { left: 28%; }
.atype-ticket-to-prod .ttp-stg {
  left: 52%;
  animation: ttp-box 5.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-ticket-to-prod .ttp-prod {
  left: 76%; border-width: 2px;
  animation: ttp-prod 5.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
@keyframes ttp-box {
  0%, 36% { border-color: #c8c0ae; }
  48%, 72% { border-color: var(--paper, #ede6d4); }
  88%, 100% { border-color: #c8c0ae; }
}
@keyframes ttp-prod {
  0%, 52% { border-color: #c8c0ae; box-shadow: none; }
  62%, 84% { border-color: var(--signal, #ff3b1f); box-shadow: inset 0 0 0 1px var(--signal, #ff3b1f); }
  94%, 100% { border-color: #c8c0ae; box-shadow: none; }
}
.atype-ticket-to-prod .ttp-human {
  position: absolute; left: 52%; top: 68%; width: 18%; height: 24%;
  border: 1.5px dashed var(--signal, #ff3b1f);
  color: var(--signal, #ff3b1f);
  display: flex; align-items: center; justify-content: center;
  background: #0e0d0b;
}
.atype-ticket-to-prod .ttp-human b { color: var(--signal, #ff3b1f); }
.atype-ticket-to-prod .ttp-drop {
  position: absolute; left: 60%; top: 48%; width: 2px; height: 20%;
  background: var(--signal, #ff3b1f); transform-origin: top;
  animation: ttp-drop 5.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
@keyframes ttp-drop {
  0%, 38% { transform: scaleY(0); opacity: 0; }
  48%, 74% { transform: scaleY(1); opacity: 1; }
  88%, 100% { transform: scaleY(0); opacity: 0; }
}
.atype-ticket-to-prod .ttp-tok {
  position: absolute; z-index: 2; width: 9px; height: 9px; background: var(--paper, #ede6d4);
}
.atype-ticket-to-prod .ttp-a { animation: ttp-ok 5.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite; }
.atype-ticket-to-prod .ttp-b { animation: ttp-ok 5.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) 0.28s infinite; }
.atype-ticket-to-prod .ttp-ex {
  background: var(--signal, #ff3b1f);
  animation: ttp-ex 5.4s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) 0.12s infinite;
}
@keyframes ttp-ok {
  0% { left: 10%; top: 28%; opacity: 0; }
  8% { opacity: 1; }
  28% { left: 34%; top: 28%; }
  48% { left: 58%; top: 28%; }
  68%, 82% { left: 82%; top: 28%; opacity: 1; }
  92%, 100% { left: 82%; top: 28%; opacity: 0; }
}
@keyframes ttp-ex {
  0% { left: 10%; top: 28%; opacity: 0; }
  8% { opacity: 1; }
  28% { left: 34%; top: 28%; }
  42% { left: 58%; top: 28%; }
  58%, 78% { left: 58%; top: 76%; opacity: 1; }
  90%, 100% { left: 58%; top: 76%; opacity: 0; }
}

/* 9. live-ceo-board — event feed + error pulse + three tiles */
.atype-live-ceo-board .lcb-feed {
  position: absolute; left: 4%; top: 10%; width: 38%; height: 80%;
  border: 1.5px solid #c8c0ae; background: #161410;
  display: flex; flex-direction: column; gap: 6px;
  padding: 10px 10px 12px;
}
.atype-live-ceo-board .lcb-row {
  display: block; height: 14px; border: 1px solid #3a3730; background: #12110e;
  animation: lcb-row 5.6s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
  font: 600 8px/14px "Space Grotesk", sans-serif;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: #8a8478; padding: 0 8px; overflow: hidden;
}
.atype-live-ceo-board .lcb-row.r0 { width: 88%; animation-delay: 0s; }
.atype-live-ceo-board .lcb-row.r1 { width: 70%; animation-delay: 0.15s; }
.atype-live-ceo-board .lcb-row.r2 { width: 78%; }
.atype-live-ceo-board .lcb-row.r3 { width: 62%; animation-delay: 0.3s; }
.atype-live-ceo-board .lcb-row.is-err {
  border-color: var(--signal, #ff3b1f); color: var(--signal, #ff3b1f);
  animation-name: lcb-err;
}
@keyframes lcb-row {
  0%, 8% { opacity: 0.35; transform: translateY(6px); }
  20%, 82% { opacity: 1; transform: translateY(0); }
  94%, 100% { opacity: 0.35; transform: translateY(0); }
}
@keyframes lcb-err {
  0%, 18% { opacity: 0.4; box-shadow: none; }
  28%, 42% { opacity: 1; box-shadow: 0 0 0 1px var(--signal, #ff3b1f); }
  50% { opacity: 0.55; }
  62%, 80% { opacity: 1; box-shadow: 0 0 0 1px var(--signal, #ff3b1f); }
  94%, 100% { opacity: 0.4; box-shadow: none; }
}
.atype-live-ceo-board .lcb-tile {
  position: absolute; right: 4%; width: 48%; height: 24%;
  border: 1.5px solid #c8c0ae; background: #161410;
  display: flex; flex-direction: column; justify-content: center;
  padding: 0 12px; gap: 6px;
}
.atype-live-ceo-board .lcb-tile i {
  display: block; height: 3px; width: 40%; background: #c8c0ae;
}
.atype-live-ceo-board .lcb-d { top: 10%; }
.atype-live-ceo-board .lcb-b { top: 38%; }
.atype-live-ceo-board .lcb-e {
  top: 66%;
  border-color: var(--signal, #ff3b1f);
  animation: lcb-tile-err 5.6s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-live-ceo-board .lcb-e b,
.atype-live-ceo-board .lcb-e i { color: var(--signal, #ff3b1f); background: var(--signal, #ff3b1f); }
.atype-live-ceo-board .lcb-e b { background: transparent; }
@keyframes lcb-tile-err {
  0%, 22% { box-shadow: none; }
  32%, 46% { box-shadow: inset 0 0 0 1px var(--signal, #ff3b1f); }
  54% { box-shadow: none; }
  64%, 82% { box-shadow: inset 0 0 0 1px var(--signal, #ff3b1f); }
  94%, 100% { box-shadow: none; }
}

/* 10. phone-reserve-waiter — line → bot → locked table → waiter with tray */
.atype-phone-reserve-waiter .prw-phone {
  position: absolute; left: 3%; top: 12%; width: 18%; height: 76%;
  border: 1.5px solid #c8c0ae; background: #161410;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; color: var(--paper, #ede6d4);
}
.atype-phone-reserve-waiter .prw-handset { width: 28px; height: 40px; }
.stage.is-compact.atype-phone-reserve-waiter .prw-handset { width: 18px; height: 26px; }
.atype-phone-reserve-waiter .prw-wave {
  display: flex; align-items: flex-end; gap: 3px; height: 14px;
}
.atype-phone-reserve-waiter .prw-wave i {
  display: block; width: 3px; background: var(--signal, #ff3b1f);
  animation: prw-wave 6s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-phone-reserve-waiter .prw-wave i:nth-child(1) { height: 6px; }
.atype-phone-reserve-waiter .prw-wave i:nth-child(2) { height: 12px; animation-delay: 0.12s; }
.atype-phone-reserve-waiter .prw-wave i:nth-child(3) { height: 8px; animation-delay: 0.24s; }
@keyframes prw-wave {
  0%, 8% { transform: scaleY(0.4); opacity: 0.4; }
  16%, 32% { transform: scaleY(1); opacity: 1; }
  48%, 100% { transform: scaleY(0.45); opacity: 0.35; }
}
.atype-phone-reserve-waiter .prw-bot {
  left: 24%; top: 28%; width: 14%; height: 36%;
  animation: prw-bot 6s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
@keyframes prw-bot {
  0%, 10% { border-color: #c8c0ae; }
  18%, 42% { border-color: var(--signal, #ff3b1f); box-shadow: inset 0 0 0 1px var(--signal, #ff3b1f); }
  58%, 100% { border-color: #c8c0ae; box-shadow: none; }
}
.atype-phone-reserve-waiter .prw-grid {
  position: absolute; left: 42%; top: 16%; width: 22%; height: 56%;
  border: 1.5px solid #c8c0ae; background: #161410;
  display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 1fr 1fr auto;
  gap: 4px; padding: 8px 8px 6px;
}
.atype-phone-reserve-waiter .prw-grid .cell {
  border: 1.5px solid #3a3730; background: #12110e;
}
.atype-phone-reserve-waiter .prw-grid .cell.lock {
  animation: prw-lock 6s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
}
.atype-phone-reserve-waiter .prw-grid b {
  grid-column: 1 / -1; justify-self: center; margin-top: 2px;
}
@keyframes prw-lock {
  0%, 34% { background: #12110e; border-color: #3a3730; }
  44%, 100% { background: var(--signal, #ff3b1f); border-color: var(--signal, #ff3b1f); }
}
.atype-phone-reserve-waiter .prw-waiter {
  position: absolute; top: 8%; width: 28%; height: 84%;
  display: flex; flex-direction: column; align-items: center; justify-content: flex-end;
  gap: 4px;
  left: 108%;
  animation: prw-walk 6s var(--ease, cubic-bezier(0.16, 1, 0.3, 1)) infinite;
  color: var(--paper, #ede6d4);
}
.atype-phone-reserve-waiter .prw-fig {
  width: 72px; height: 118px;
  overflow: visible;
}
.stage.is-compact.atype-phone-reserve-waiter .prw-fig { width: 44px; height: 72px; }
.atype-phone-reserve-waiter .prw-fig .leg-a,
.atype-phone-reserve-waiter .prw-fig .leg-b {
  transform-origin: 26px 48px;
  animation: prw-step 0.55s linear infinite;
}
.atype-phone-reserve-waiter .prw-fig .leg-b { animation-delay: 0.27s; }
@keyframes prw-step {
  0%, 100% { transform: rotate(0deg); }
  50% { transform: rotate(7deg); }
}
@keyframes prw-walk {
  0%, 42% { left: 108%; opacity: 0; }
  48% { opacity: 1; }
  78%, 92% { left: 68%; opacity: 1; }
  100% { left: 68%; opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .stage *,
  .stage *::before,
  .stage *::after {
    animation: none !important;
    transition: none !important;
  }
  .atype-intake-to-system .fields i, .c1 .fields i { transform: none; opacity: 1; background: var(--signal, #ff3b1f); }
  .atype-intake-to-system .tms, .c1 .tms { border-color: var(--signal, #ff3b1f); box-shadow: inset 0 0 0 1px var(--signal, #ff3b1f); }
  .atype-intake-to-system .env .flap, .c1 .env .flap { transform: none; }
  .atype-intake-to-system .tok, .c1 .tok { opacity: 1; }
  .atype-intake-to-system .t1, .c1 .t1 { left: 79%; top: 22%; }
  .atype-intake-to-system .t2, .c1 .t2 { left: 82%; top: 34%; }
  .atype-intake-to-system .t3, .c1 .t3 { left: 76%; top: 44%; }
  .atype-intake-to-system .tex, .c1 .tex { left: 47%; top: 78%; }
  .atype-docs-to-dossier .s1, .c2 .s1 { left: 52%; top: 14%; opacity: 1; transform: scale(0.72); }
  .atype-docs-to-dossier .s2, .c2 .s2 { left: 66%; top: 24%; opacity: 1; transform: scale(0.72); }
  .atype-docs-to-dossier .s3, .c2 .s3 { left: 56%; top: 38%; opacity: 1; transform: scale(0.72); }
  .atype-docs-to-dossier .dossier .body, .c2 .dossier .body { border-color: var(--paper, #ede6d4); background: #1f1c18; }
  .atype-docs-to-dossier .stamp-mark, .c2 .stamp-mark { opacity: 1; transform: rotate(-6deg); }
  .atype-match-exception .po, .c3 .po { left: 10%; top: 26%; }
  .atype-match-exception .qc, .c3 .qc { right: 10%; top: 26%; left: auto; }
  .atype-match-exception .cat, .c3 .cat { border-color: var(--signal, #ff3b1f); }
  .atype-match-exception .meet-line, .c3 .meet-line { transform: scaleX(1); }
  .atype-match-exception .tick, .c3 .tick { opacity: 1; }
  .atype-match-exception .tick path, .c3 .tick path { stroke-dashoffset: 0; }
  .atype-match-exception .exc, .c3 .exc { left: 80%; top: 70%; opacity: 1; }
  .atype-three-way-match .twm-a { left: 18%; top: 18%; }
  .atype-three-way-match .twm-b { right: 18%; top: 18%; left: auto; }
  .atype-three-way-match .twm-c { left: 38%; bottom: 18%; }
  .atype-three-way-match .twm-core { border-color: var(--signal, #ff3b1f); }
  .atype-three-way-match .twm-exc { opacity: 1; transform: none; }
  .atype-three-way-match .twm-r1,
  .atype-three-way-match .twm-r2 { transform: none; opacity: 1; }
  .atype-three-way-match .twm-r3 { transform: none; opacity: 1; }
  .atype-queue-triage .qt-pile i { opacity: 0.35; transform: none; }
  .atype-queue-triage .qt-lane .fill { transform: scaleY(1); }
  .atype-queue-triage .qt-k0 { left: 42%; top: 36%; opacity: 1; }
  .atype-queue-triage .qt-k1 { left: 64%; top: 40%; opacity: 1; }
  .atype-queue-triage .qt-k2 { left: 86%; top: 48%; opacity: 1; }
  .atype-exception-human .eh-auto { border-color: var(--paper, #ede6d4); }
  .atype-exception-human .eh-a,
  .atype-exception-human .eh-b,
  .atype-exception-human .eh-c { left: 52%; top: 40%; opacity: 1; }
  .atype-exception-human .eh-bad { left: 78%; top: 70%; opacity: 1; }
  .atype-exception-human .eh-drop { transform: scaleY(1); opacity: 1; }
  .atype-jira-git-score .jgs-jira,
  .atype-jira-git-score .jgs-git { border-color: var(--signal, #ff3b1f); }
  .atype-jira-git-score .jgs-lane .fill { transform: scaleX(1); }
  .atype-jira-git-score .jgs-t0 { left: 62%; top: 24%; opacity: 1; }
  .atype-jira-git-score .jgs-t1 { left: 58%; top: 66%; opacity: 1; }
  .atype-ticket-to-prod .ttp-stg { border-color: var(--paper, #ede6d4); }
  .atype-ticket-to-prod .ttp-prod { border-color: var(--signal, #ff3b1f); }
  .atype-ticket-to-prod .ttp-a,
  .atype-ticket-to-prod .ttp-b { left: 82%; top: 28%; opacity: 1; }
  .atype-ticket-to-prod .ttp-ex { left: 58%; top: 76%; opacity: 1; }
  .atype-ticket-to-prod .ttp-drop { transform: scaleY(1); opacity: 1; }
  .atype-live-ceo-board .lcb-row { opacity: 1; transform: none; }
  .atype-live-ceo-board .lcb-row.is-err,
  .atype-live-ceo-board .lcb-e { box-shadow: inset 0 0 0 1px var(--signal, #ff3b1f); }
  .atype-phone-reserve-waiter .prw-wave i { transform: none; opacity: 1; }
  .atype-phone-reserve-waiter .prw-bot {
    border-color: var(--signal, #ff3b1f);
    box-shadow: inset 0 0 0 1px var(--signal, #ff3b1f);
  }
  .atype-phone-reserve-waiter .prw-grid .cell.lock {
    background: var(--signal, #ff3b1f);
    border-color: var(--signal, #ff3b1f);
  }
  .atype-phone-reserve-waiter .prw-waiter { left: 68%; opacity: 1; }
  .atype-phone-reserve-waiter .prw-fig .leg-a,
  .atype-phone-reserve-waiter .prw-fig .leg-b { transform: none; }
}
