.satrelay-flow {
  --flow-ink: #17201b;
  --flow-orange: #ff6a22;
  --flow-paper: #f7f7f2;
  width: 100%;
  display: block;
  min-height: 300px;
  overflow: auto hidden;
  scrollbar-width: thin;
  scrollbar-color: #c4cec4 transparent;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
}
.satrelay-flow .flow-machine { display: block; width: 100%; min-width: 760px; height: auto; min-height: 300px; }
.satrelay-flow .flow-machine-mobile { display: none; }
.satrelay-flow .flow-field { fill: var(--flow-paper); stroke: #d3dad2; stroke-width: 1; }
.satrelay-flow .flow-frame { stroke: #aebbae; stroke-width: 1; fill: none; }
.satrelay-flow text { font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace; font-size: 16px; fill: var(--flow-ink); }
.satrelay-flow .flow-label { font-size: 16px; letter-spacing: 1.05px; }
.satrelay-flow .flow-label-muted { fill: #728074; }
.satrelay-flow .flow-stage-heading { font-size: 17px; letter-spacing: 1.55px; font-weight: 600; }
.satrelay-flow .flow-stage-caption { font-size: 16px; letter-spacing: 1.2px; fill: #728074; }
.satrelay-flow .flow-core-text { font-size: 16px; letter-spacing: .8px; }
.satrelay-flow .flow-registration path { fill: none; stroke: #b5c0b5; stroke-width: 1; }
.satrelay-flow .flow-circuits { fill: none; stroke: #a2b1a3; stroke-width: 1.5; stroke-linejoin: round; }
.satrelay-flow .flow-secondary { stroke: #c1ccc0; stroke-width: 1; }
.satrelay-flow .flow-packets { fill: none; stroke: var(--flow-orange); stroke-width: 2.7; stroke-linecap: butt; stroke-dasharray: 5 51; animation: satrelay-packet-pass 4.4s linear infinite; }
.satrelay-flow .flow-packets path:nth-child(2) { stroke-dasharray: 5 68; }
.satrelay-flow .flow-packets path:nth-child(3) { stroke-dasharray: 5 47; }
.satrelay-flow .flow-junctions { fill: var(--flow-paper); stroke: #a2b1a3; stroke-width: 1; }
.satrelay-flow .flow-plate { fill: #eef1eb; stroke: #a6b3a6; stroke-width: 1.4; }
.satrelay-flow .flow-slip, .satrelay-flow .flow-receipt { fill: #fff; stroke: #a6b3a6; stroke-width: 1.4; }
.satrelay-flow .flow-stage-line { fill: none; stroke: #6e806f; stroke-width: 1.2; stroke-linejoin: round; stroke-linecap: square; }
.satrelay-flow .flow-ink-line { fill: none; stroke: #8da18e; stroke-width: 1; }
.satrelay-flow .flow-contact { fill: #d7e1d5; stroke: #9bab9c; stroke-width: 1; }
.satrelay-flow .flow-fastener { fill: #f7f9f4; stroke: #94a595; stroke-width: 1; }
.satrelay-flow .flow-machined-outer { stroke: #9fad9f; stroke-width: 1.5; }
.satrelay-flow .flow-vault-ring { fill: #f7f9f4; stroke: #a4b2a4; stroke-width: 1.5; }
.satrelay-flow .flow-vault-dial { fill: #eef2ea; stroke: #cad3c7; stroke-width: 1; }
.satrelay-flow .flow-vault-rotor { fill: none; stroke: #a8b8a8; stroke-width: 2; transform-origin: 375px 180px; animation: satrelay-vault-turn 32s linear infinite; }
.satrelay-flow .flow-core-label { fill: #f7f9f4; stroke: #a4b2a4; stroke-width: 1; }
.satrelay-flow .flow-rule-tile { fill: #f7f9f4; stroke: #a4b2a4; stroke-width: 1; }
.satrelay-flow .flow-receipt-seal { fill: #eef2ea; stroke: #a4b2a4; stroke-width: 1; }
.satrelay-flow .flow-stage.is-current .flow-stage-heading,
.satrelay-flow .flow-stage.is-current .flow-stage-caption,
.satrelay-flow .flow-stage.is-current .flow-core-text { fill: #bd440e; }
.satrelay-flow .flow-stage.is-current .flow-contact { fill: var(--flow-orange); stroke: var(--flow-orange); }
.satrelay-flow .flow-stage.is-current .flow-plate,
.satrelay-flow .flow-stage.is-current .flow-slip,
.satrelay-flow .flow-stage.is-current .flow-receipt,
.satrelay-flow .flow-stage.is-current .flow-machined-outer,
.satrelay-flow .flow-stage.is-current .flow-vault-ring { stroke: var(--flow-orange); }
.satrelay-flow .flow-stage.is-current .flow-vault-rotor { stroke: var(--flow-orange); }
.satrelay-flow .flow-stage.is-current .flow-stage-line { stroke: #b44616; }
.satrelay-flow .flow-stage.is-current .flow-rule-tile,
.satrelay-flow .flow-stage.is-current .flow-core-label,
.satrelay-flow .flow-stage.is-current .flow-receipt-seal { fill: #fff0e6; stroke: var(--flow-orange); }
.satrelay-flow .flow-stage.is-complete .flow-stage-heading { fill: #4f6853; }
.satrelay-flow.flow-is-paused .flow-packets,
.satrelay-flow.flow-is-paused .flow-vault-rotor { animation-play-state: paused; }
.satrelay-flow.flow-reduced-motion .flow-packets,
.satrelay-flow.flow-reduced-motion .flow-vault-rotor { animation: none; }
@keyframes satrelay-packet-pass { to { stroke-dashoffset: -224; } }
@keyframes satrelay-vault-turn { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .satrelay-flow .flow-packets, .satrelay-flow .flow-vault-rotor { animation: none; }
}
@media (max-width: 760px) {
  .satrelay-flow { min-height: 0; overflow: hidden; }
  .satrelay-flow .flow-machine-desktop { display: none; }
  .satrelay-flow .flow-machine-mobile { display: block; width: 100%; min-width: 0; min-height: 0; }
}