/* ======================================================================
   MOTION AND SEQUENCE STATES
   Timing values that control the narrative live in scripts/config.js.
   ====================================================================== */
.agent-route { animation: routeDrift 7s linear infinite; }
.answer-route { animation: routeDrift 6.3s linear infinite; }
.writeback-route { animation: reverseRouteDrift 8.4s linear infinite; }
.registrar-writeback-route { animation: routeDrift 7.6s linear infinite; }
.typed-copy::after { animation: cursorBlink .82s steps(1) infinite; }

.canvas.query-ready .click-ring { animation: clickRipple .7s var(--ease) both; }
.canvas.query-ready .query-box-frame {
  animation: queryBoxConfirm var(--box-pulse-duration, .52s) ease-out both;
}
.canvas.query-ready .query-box-pulse {
  animation: queryBoxPulse var(--box-pulse-duration, .52s) ease-out both;
}
.canvas.query-ready .query-box-merge {
  animation: queryBoxMerge var(--box-pulse-duration, .52s) ease-out both;
}
.canvas.handoff-active .query-box-merge {
  animation: queryBoxRelease .16s ease-out both;
}
.canvas.handoff-active .query-resolver-link { opacity: .30; }
.canvas.handoff-active .query-resolver-trail {
  animation: queryTrailTravel var(--handoff-duration, .72s) ease-out both;
}
.canvas.handoff-active .query-handoff-signal {
  animation: querySignalTravel var(--handoff-duration, .72s) ease-out both;
}
.canvas.system-active .active-route {
  opacity: var(--active-route-opacity);
  stroke-width: var(--active-route-width);
}

.canvas.system-active .memory-node.selected {
  opacity: var(--active-opacity, .90) !important;
}

.canvas.system-active .workset-node {
  animation: worksetBreathe 5.2s var(--pulse-delay, 0s) ease-in-out infinite;
}

.canvas.system-active .workset-node-halo {
  animation: worksetHaloBreathe 5.2s var(--pulse-delay, 0s) ease-in-out infinite;
}

.canvas.system-active .processor-core {
  animation: processorBreathe 4.6s var(--agent-delay, 0s) ease-in-out infinite;
}

html[data-layout="u-concept"] .workset-node {
  animation: worksetAmbient 5.8s var(--pulse-delay, 0s) ease-in-out infinite;
}

html[data-layout="u-concept"] .workset-node-halo {
  animation: worksetHaloAmbient 5.8s var(--pulse-delay, 0s) ease-in-out infinite;
}

html[data-layout="u-concept"] .processor-core {
  animation: processorAmbient 5.4s var(--agent-delay, 0s) ease-in-out infinite;
}

html[data-layout="u-concept"] .processor-orbit {
  animation: processorOrbit 12s var(--processor-orbit-delay, 0s) linear infinite;
}

html[data-layout="u-concept"] .processor-scan {
  animation: processorScan 7.5s var(--processor-scan-delay, 0s) linear infinite;
}

html[data-layout="u-concept"] #synthesist .processor-ring,
html[data-layout="u-concept"] #evidence-steward .processor-ring,
html[data-layout="u-concept"] #memory-registrar .processor-ring {
  animation: processorRingIdle 6.2s calc(var(--processor-idle-phase, 0s) + var(--ring-offset, 0s)) ease-in-out infinite;
}

.canvas.system-active .answer-route { opacity: .48; }

.canvas.answer-generating .answer-line,
.canvas.answer-generating .answer-accent {
  animation: lineReveal .66s var(--line-delay, 0s) var(--ease) forwards;
}

html[data-layout="u-concept"] .canvas.answer-generating .answer-line,
html[data-layout="u-concept"] .canvas.answer-generating .answer-accent {
  animation-name: answerWake;
}

.canvas.answer-generating .citation-dot {
  animation:
    citationReveal .55s var(--cite-delay, 0s) var(--ease) forwards,
    citationBreathe 3.8s calc(var(--cite-delay, 0s) + .8s) ease-in-out infinite;
}

.canvas.answer-generating .registrar-writeback-route { opacity: .42; }
.canvas.answer-generating .answer-writeback-branch { opacity: .30; }
.canvas.answer-generating .verified-branch { opacity: .30; }

@keyframes cursorBlink {
  0%, 48% { opacity: 1; }
  49%, 100% { opacity: 0; }
}

@keyframes clickRipple {
  0% { opacity: 0; transform: scale(.35); }
  18% { opacity: .85; transform: scale(.55); }
  100% { opacity: 0; transform: scale(2.25); }
}

@keyframes queryBoxConfirm {
  0% { stroke: rgba(247,251,255,.24); }
  42% { stroke: rgba(247,251,255,.56); }
  100% { stroke: rgba(247,251,255,.30); }
}

@keyframes queryBoxPulse {
  0% { opacity: 0; stroke-dashoffset: 0; }
  12% { opacity: 1; }
  90% { opacity: .96; }
  100% { opacity: 0; stroke-dashoffset: -81; }
}

@keyframes queryBoxMerge {
  0%, 68% { opacity: 0; transform: scale(.45); }
  86% { opacity: .78; transform: scale(.82); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes queryBoxRelease {
  0% { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: scale(.72); }
}

@keyframes queryTrailTravel {
  0% { opacity: 0; stroke-dashoffset: 100; }
  16% { opacity: .96; }
  82% { opacity: .82; }
  100% { opacity: 0; stroke-dashoffset: -28; }
}

@keyframes querySignalTravel {
  0%, 82% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes routeDrift { to { stroke-dashoffset: -92; } }
@keyframes reverseRouteDrift { to { stroke-dashoffset: 102; } }

@keyframes worksetBreathe {
  0%, 100% { opacity: var(--node-low-opacity, .58); }
  50% { opacity: var(--node-high-opacity, .94); }
}

@keyframes worksetHaloBreathe {
  0%, 100% { opacity: var(--halo-low-opacity, .5); transform: scale(.94); }
  50% { opacity: var(--halo-opacity, .7); transform: scale(1.05); }
}

@keyframes worksetAmbient {
  0%, 100% { opacity: var(--node-low-opacity, .58); }
  50% { opacity: var(--node-ambient-high-opacity, .82); }
}

@keyframes worksetHaloAmbient {
  0%, 100% { opacity: var(--halo-ambient-low-opacity, .38); transform: scale(.96); }
  50% { opacity: var(--halo-ambient-opacity, .58); transform: scale(1.025); }
}

@keyframes processorAmbient {
  0%, 100% { opacity: .78; transform: scale(.96); }
  50% { opacity: .98; transform: scale(1.04); }
}

@keyframes processorOrbit {
  0% { opacity: .42; transform: rotate(0deg); }
  48% { opacity: .68; }
  100% { opacity: .42; transform: rotate(360deg); }
}

@keyframes processorScan {
  0% { opacity: .40; transform: rotate(360deg); }
  45% { opacity: .82; }
  100% { opacity: .40; transform: rotate(0deg); }
}

@keyframes processorShellBreathe {
  0%, 100% { opacity: .68; stroke-width: 1.05px; }
  50% { opacity: 1; stroke-width: 1.38px; }
}

@keyframes processorRingIdle {
  0%, 68%, 100% {
    opacity: var(--ring-rest, .58);
    stroke-width: var(--ring-width, 1.05px);
    transform: scale(1);
  }
  76% {
    opacity: var(--ring-peak, .88);
    stroke-width: var(--ring-peak-width, 1.34px);
    transform: scale(1.025);
  }
  84% {
    opacity: var(--ring-rest, .58);
    stroke-width: var(--ring-width, 1.05px);
    transform: scale(1);
  }
}

@keyframes processorBreathe {
  0%, 100% { opacity: .62; transform: scale(.94); }
  50% { opacity: 1; transform: scale(1.10); }
}

@keyframes answerWake {
  0% { opacity: .34; transform: scaleX(1); }
  100% { opacity: .96; transform: scaleX(1); }
}

@keyframes lineReveal {
  0% { opacity: 0; transform: scaleX(0); }
  100% { opacity: 1; transform: scaleX(1); }
}

@keyframes citationReveal {
  0% { opacity: .36; transform: scale(.86); }
  100% { opacity: .94; transform: scale(1); }
}

@keyframes citationBreathe {
  0%, 100% { opacity: .52; transform: scale(.86); }
  50% { opacity: .95; transform: scale(1.12); }
}

@media (prefers-reduced-motion: reduce) {
  .signal-particle,
  .signal-route-trace { display: none; }
  .physics-node { transition: none; }
  .agent-route,
  .answer-route,
  .writeback-route,
  .typed-copy::after { animation: none; }

  .canvas.system-active .workset-node,
  .canvas.system-active .workset-node-halo,
  .canvas.system-active .processor-core,
  .canvas.answer-generating .citation-dot,
  html[data-layout="u-concept"] .workset-node,
  html[data-layout="u-concept"] .workset-node-halo,
  html[data-layout="u-concept"] .processor-core,
  html[data-layout="u-concept"] .processor-orbit,
  html[data-layout="u-concept"] .processor-scan,
  html[data-layout="u-concept"] #synthesist .processor-ring,
  html[data-layout="u-concept"] #evidence-steward .processor-ring,
  html[data-layout="u-concept"] #memory-registrar .processor-ring { animation: none; }

  .query-resolver-trail,
  .query-handoff-signal,
  .query-box-pulse,
  .query-box-merge { display: none; }
}