/* Animated GoalGrid system map — beta landing page only. */
html.gg-beta-home-pipeline {
  --gg-pipe-bg: #06111a;
  --gg-pipe-panel: #091823;
  --gg-pipe-line: rgba(142, 183, 201, .16);
  --gg-pipe-text: #eef8fb;
  --gg-pipe-muted: #8ba5b4;
  --gg-pipe-cyan: #38e8cf;
  --gg-pipe-lime: #c9ff2f;
  --gg-pipe-amber: #efbd62;
  --gg-pipe-blue: #64aefa;
  --gg-pipe-purple: #9b74ff;
}

html.gg-beta-home-pipeline .gg-beta-pipeline,
html.gg-beta-home-pipeline .gg-beta-pipeline * { box-sizing: border-box; }

.gg-beta-pipeline {
  position: relative;
  width: min(calc(100% - 32px), 1220px);
  margin: clamp(46px, 5vw, 70px) auto;
  overflow: hidden;
  padding: 30px 24px 24px;
  border: 1px solid rgba(56, 232, 207, .15);
  border-radius: 28px;
  background:
    radial-gradient(circle at 51% 48%, rgba(126, 87, 255, .09), transparent 25rem),
    radial-gradient(circle at 10% 30%, rgba(56, 232, 207, .05), transparent 21rem),
    linear-gradient(155deg, rgba(11, 28, 38, .98), rgba(5, 15, 24, .99));
  box-shadow: 0 36px 100px rgba(0, 0, 0, .24), inset 0 1px 0 rgba(255, 255, 255, .025);
  isolation: isolate;
}

.gg-beta-pipeline::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .42;
  background-image:
    linear-gradient(rgba(104, 145, 165, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(104, 145, 165, .035) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(to bottom, #000, transparent 82%);
  content: "";
  pointer-events: none;
}

.gg-beta-pipeline::after {
  position: absolute;
  z-index: -1;
  top: 0;
  right: 18%;
  left: 18%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(56, 232, 207, .55), transparent);
  box-shadow: 0 0 24px rgba(56, 232, 207, .4);
  content: "";
}

.gg-beta-pipeline__head {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  max-width: 820px;
  margin: 0 auto 10px;
  text-align: center;
}

.gg-beta-pipeline__eyebrow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
  margin: 0 0 13px;
  justify-content: center;
  color: var(--gg-pipe-cyan);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
}

.gg-beta-pipeline__eyebrow > span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gg-pipe-cyan);
  box-shadow: 0 0 15px rgba(56, 232, 207, .85);
  animation: gg-pipe-live 1.8s infinite ease-in-out;
}

.gg-beta-pipeline__eyebrow b {
  margin-left: 4px;
  padding: 5px 7px;
  border: 1px solid rgba(155, 116, 255, .26);
  border-radius: 999px;
  color: #c4b2ff;
  background: rgba(155, 116, 255, .07);
  font-size: 7px;
  letter-spacing: .11em;
}

.gg-beta-pipeline__head h2 {
  max-width: 820px;
  margin: 0;
  color: var(--gg-pipe-text);
  font-size: clamp(30px, 3vw, 43px);
  font-weight: 850;
  letter-spacing: -.045em;
  line-height: 1.02;
}

.gg-beta-pipeline__head h2 > span {
  color: #38e8cf;
  text-shadow: 0 0 30px rgba(56, 232, 207, .13);
}

.gg-beta-pipeline__head h2 > strong {
  color: #c2b2ff;
  background: linear-gradient(100deg, #c4b0ff 12%, #769cff 92%);
  background-clip: text;
  font: inherit;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gg-beta-pipeline__head > p {
  max-width: 720px;
  margin: 0 auto 4px;
  color: #9eb3be;
  font-size: clamp(12px, 1.15vw, 15px);
  line-height: 1.68;
}

.gg-beta-pipeline__sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.gg-beta-pipeline__stage {
  position: relative;
  max-width: 1120px;
  margin: 0 auto;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: radial-gradient(ellipse at 50% 50%, rgba(37, 28, 77, .18), transparent 48%);
  box-shadow: none;
}

.gg-beta-pipeline__stage::before,
.gg-beta-pipeline__stage::after {
  position: absolute;
  z-index: 3;
  width: 34px;
  height: 34px;
  border-color: rgba(56, 232, 207, .25);
  content: "";
  pointer-events: none;
}

.gg-beta-pipeline__stage::before,
.gg-beta-pipeline__stage::after { display: none; }

.gg-beta-pipeline__desktop {
  position: relative;
  min-height: 340px;
}

.gg-beta-pipeline__routes { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; overflow: visible; shape-rendering: geometricPrecision; text-rendering: geometricPrecision; }
.gg-beta-route,
.gg-beta-route-core,
.gg-beta-route-output-bg { fill: none; vector-effect: non-scaling-stroke; }
.gg-beta-route { stroke-width: 1.5; stroke-dasharray: 7 9; opacity: .72; }
.gg-beta-route-core { stroke-width: 20; opacity: .09; transition: opacity .2s ease; }
.gg-beta-route--match,
.gg-beta-route-core--match { stroke: var(--gg-pipe-cyan); }
.gg-beta-route--market,
.gg-beta-route-core--market { stroke: var(--gg-pipe-amber); }
.gg-beta-route--context,
.gg-beta-route-core--context { stroke: var(--gg-pipe-blue); }
.gg-beta-route--output { stroke: var(--gg-pipe-purple); stroke-width: 2; }
.gg-beta-route-output-bg { stroke: url(#gg-beta-output-lane); stroke-width: 26; opacity: .38; }

.gg-beta-packet { color: currentColor; }
.gg-beta-packet circle { fill: currentColor; filter: url(#gg-beta-packet-glow); stroke: #f5fbff; stroke-width: 1.4; }
.gg-beta-packet text {
  fill: currentColor;
  font-family: inherit;
  font-size: 11.5px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  letter-spacing: .025em;
  paint-order: stroke;
  stroke: #06101c;
  stroke-linejoin: round;
  stroke-width: 2.2px;
  text-anchor: middle;
}
.gg-beta-packets--match { color: var(--gg-pipe-cyan); }
.gg-beta-packets--market { color: var(--gg-pipe-amber); }
.gg-beta-packets--context { color: var(--gg-pipe-blue); }
.gg-beta-packets--output { color: var(--gg-pipe-purple); }

.gg-beta-pipeline.is-running .gg-beta-route { animation: gg-pipe-dash 14s infinite linear; }
.gg-beta-pipeline[data-focus-source="match"] .gg-beta-route-core--match,
.gg-beta-pipeline[data-focus-source="market"] .gg-beta-route-core--market,
.gg-beta-pipeline[data-focus-source="context"] .gg-beta-route-core--context { opacity: .18; }

.gg-beta-pipeline__sources { position: absolute; z-index: 4; inset: 0; }
.gg-beta-source {
  position: absolute;
  left: 2.7%;
  display: grid;
  width: 18%;
  min-width: 188px;
  min-height: 66px;
  grid-template-columns: 42px minmax(0, 1fr) 8px;
  gap: 11px;
  align-items: center;
  padding: 9px 11px;
  border: 1.5px solid color-mix(in srgb, var(--source-color) 68%, transparent);
  border-radius: 999px;
  color: #9db3be;
  background: linear-gradient(100deg, color-mix(in srgb, var(--source-color) 8%, #07151f), rgba(7, 19, 31, .97) 55%);
  box-shadow: 0 10px 28px rgba(0, 0, 0, .24), 0 0 24px color-mix(in srgb, var(--source-color) 10%, transparent), inset 0 1px 0 rgba(255, 255, 255, .025);
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.gg-beta-source.is-match { top: 11.4%; --source-color: var(--gg-pipe-cyan); }
.gg-beta-source.is-market { top: 41.2%; --source-color: var(--gg-pipe-amber); }
.gg-beta-source.is-context { top: 70.8%; --source-color: var(--gg-pipe-blue); }
.gg-beta-source:hover,
.gg-beta-source:focus-visible,
.gg-beta-source.is-active { border-color: var(--source-color); box-shadow: 0 12px 34px color-mix(in srgb, var(--source-color) 15%, transparent); transform: translateX(3px); outline: none; }

.gg-beta-source > span:first-child {
  display: inline-flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: var(--source-color);
  background: color-mix(in srgb, var(--source-color) 10%, transparent);
}

.gg-beta-source svg { width: 23px; height: 23px; }
.gg-beta-source > span:nth-child(2) { display: grid; min-width: 0; gap: 2px; }
.gg-beta-source small { color: var(--source-color); font-size: 7.5px; font-weight: 900; letter-spacing: .1em; }
.gg-beta-source strong { overflow: hidden; color: #eef7fa; font-size: clamp(11px, .95vw, 13.5px); text-overflow: ellipsis; white-space: nowrap; }
.gg-beta-source em { overflow: hidden; color: #6f8997; font-size: 8px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.gg-beta-source > i { width: 8px; height: 8px; border-radius: 50%; background: var(--source-color); box-shadow: 0 0 14px var(--source-color); }

.gg-beta-engine {
  position: absolute;
  z-index: 5;
  top: 50%;
  left: 50%;
  width: 166px;
  height: 166px;
  border: 1.5px solid rgba(155, 116, 255, .58);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(34, 22, 63, .97), rgba(7, 15, 28, .98) 67%);
  box-shadow: 0 0 0 10px rgba(117, 69, 255, .045), 0 0 48px rgba(117, 69, 255, .26), inset 0 0 34px rgba(155, 116, 255, .12);
  transform: translate(-50%, -50%);
}

.gg-beta-engine__halo {
  position: absolute;
  inset: -13px;
  border: 1px solid rgba(155, 116, 255, .3);
  border-radius: 50%;
  box-shadow: inset 0 0 20px rgba(155, 116, 255, .08);
}

.gg-beta-engine__orbit {
  position: absolute;
  inset: 14px;
  border: 1.25px dashed rgba(196, 177, 255, .82);
  border-radius: 50%;
}

.gg-beta-pipeline.is-running .gg-beta-engine__orbit { animation: gg-pipe-spin 24s infinite linear; }
.gg-beta-engine__orbit i { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: #b8a3ff; box-shadow: 0 0 12px #9b74ff; }
.gg-beta-engine__orbit i:nth-child(1) { top: -4px; left: 50%; }
.gg-beta-engine__orbit i:nth-child(2) { right: 10%; bottom: 12%; }
.gg-beta-engine__orbit i:nth-child(3) { bottom: 10%; left: 9%; }

.gg-beta-engine__core { 
  position: absolute;
  inset: 31px;
  display: grid;
  place-content: center;
  border: 1px solid rgba(155, 116, 255, .2);
  border-radius: 50%;
  text-align: center;
}

.gg-beta-engine__core small { color: #a992ff; font-size: 8px; font-weight: 900; letter-spacing: .2em; }
.gg-beta-engine__core strong { margin-top: -1px; color: #fff; font-size: 40px; font-weight: 850; letter-spacing: -.08em; line-height: 1; text-shadow: 0 0 28px rgba(155, 116, 255, .35); }
.gg-beta-engine__core em { margin-top: 5px; color: #aa91ff; font-size: 6px; font-style: normal; font-weight: 800; letter-spacing: .16em; }

.gg-beta-engine__reel {
  position: absolute;
  right: 34px;
  bottom: 20px;
  left: 34px;
  height: 17px;
  overflow: hidden;
  color: #a995ed;
  font-size: 6px;
  font-weight: 900;
  letter-spacing: .13em;
  text-align: center;
}

.gg-beta-engine__reel span { display: block; height: 17px; }
.gg-beta-pipeline.is-running .gg-beta-engine__reel span { animation: gg-pipe-reel 8s infinite ease-in-out; }

.gg-beta-pipeline__lane-labels {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 58.5%;
  width: 19.5%;
  height: 0;
  pointer-events: none;
}

.gg-beta-pipeline__lane-labels > span {
  position: absolute;
  bottom: -4px;
  display: flex;
  flex-direction: column;
  gap: 7px;
  align-items: center;
  justify-items: center;
  color: #bdaaff;
  transform: translateX(-50%);
  white-space: nowrap;
}

.gg-beta-pipeline__lane-labels > span:nth-child(1) { left: 8%; --lane-color: var(--gg-pipe-blue); }
.gg-beta-pipeline__lane-labels > span:nth-child(2) { left: 50%; --lane-color: var(--gg-pipe-amber); }
.gg-beta-pipeline__lane-labels > span:nth-child(3) { left: 84%; --lane-color: var(--gg-pipe-cyan); }
.gg-beta-pipeline__lane-labels em { color: color-mix(in srgb, var(--lane-color) 72%, #e9e2ff); font-size: 9px; font-style: normal; font-weight: 850; letter-spacing: .02em; }
.gg-beta-pipeline__lane-labels i {
  width: 10px;
  height: 10px;
  border: 2px solid color-mix(in srgb, var(--lane-color) 35%, #fff);
  border-radius: 50%;
  background: var(--lane-color);
  box-shadow: 0 0 12px color-mix(in srgb, var(--lane-color) 90%, transparent), 0 0 0 4px color-mix(in srgb, var(--lane-color) 8%, transparent);
}

.gg-beta-output {
  position: absolute;
  z-index: 5;
  top: 17%;
  right: 2.6%;
  width: 20%;
  min-width: 215px;
  overflow: hidden;
  border: 1px solid rgba(129, 165, 184, .28);
  border-radius: 20px;
  background: rgba(8, 21, 33, .97);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .31), 0 0 30px rgba(155, 116, 255, .055);
}

.gg-beta-output > header {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: space-between;
  padding: 0 13px;
  border-bottom: 1px solid rgba(139, 178, 196, .14);
  background: rgba(28, 45, 63, .78);
}

.gg-beta-output > header span { display: flex; align-items: center; gap: 7px; color: #dbe8ed; font-size: 8px; font-weight: 900; letter-spacing: .07em; }
.gg-beta-output > header i { width: 6px; height: 6px; border-radius: 50%; background: var(--gg-pipe-cyan); box-shadow: 0 0 11px var(--gg-pipe-cyan); }
.gg-beta-output > header b { padding: 4px 6px; border-radius: 99px; color: #9bffec; background: rgba(56, 232, 207, .08); font-size: 6px; letter-spacing: .1em; }

.gg-beta-output__screen { position: relative; display: grid; gap: 6px; padding: 10px; }
.gg-beta-output__screen::after {
  position: absolute;
  right: 0;
  left: 0;
  height: 1px;
  opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(56, 232, 207, .65), transparent);
  box-shadow: 0 0 14px rgba(56, 232, 207, .4);
  content: "";
  pointer-events: none;
}

.gg-beta-pipeline.is-running .gg-beta-output__screen::after { animation: gg-pipe-scan 6.4s infinite ease-in-out; }

.gg-beta-output__row {
  display: grid;
  min-height: 46px;
  grid-template-columns: 7px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 7px;
  border: 1px solid rgba(139, 178, 196, .11);
  border-radius: 9px;
  background: rgba(3, 14, 22, .48);
}

.gg-beta-output__row > i { width: 6px; height: 24px; border-radius: 99px; }
.gg-beta-output__row.is-official > i { background: var(--gg-pipe-cyan); box-shadow: 0 0 10px rgba(56, 232, 207, .5); }
.gg-beta-output__row.is-signal > i { background: var(--gg-pipe-amber); }
.gg-beta-output__row.is-model > i { background: var(--gg-pipe-blue); }
.gg-beta-output__row > span { display: grid; min-width: 0; gap: 2px; }
.gg-beta-output__row strong { color: #dce9ef; font-size: 9px; }
.gg-beta-output__row small { overflow: hidden; color: #668291; font-size: 6px; text-overflow: ellipsis; white-space: nowrap; }
.gg-beta-output__row em { color: #718b99; font-size: 5.5px; font-style: normal; font-weight: 900; letter-spacing: .06em; }

.gg-beta-output__status {
  display: flex;
  min-height: 32px;
  align-items: center;
  justify-content: space-between;
  margin-top: 2px;
  padding: 0 10px;
  border-radius: 9px;
  color: #b9a6ff;
  background: rgba(117, 69, 255, .11);
  font-size: 7px;
  font-weight: 900;
  letter-spacing: .1em;
}

.gg-beta-output__status span { display: flex; align-items: center; gap: 6px; }
.gg-beta-output__status i { width: 5px; height: 5px; border-radius: 50%; background: #a78bfa; box-shadow: 0 0 8px #a78bfa; }

.gg-beta-pipeline__mobile { display: none; }

.gg-beta-pipeline__foot {
  display: flex;
  justify-content: center;
  gap: 10px;
  max-width: 1320px;
  margin: 10px auto 0;
}

.gg-beta-pipeline__foot > div { display: none; }

.gg-beta-pipeline__foot > div {
  display: none;
  min-width: 0;
  min-height: 54px;
  grid-template-columns: 27px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid rgba(137, 178, 197, .11);
  border-radius: 11px;
  background: rgba(6, 18, 27, .58);
}

.gg-beta-pipeline__foot > div > span { display: inline-flex; width: 27px; height: 27px; align-items: center; justify-content: center; border-radius: 8px; color: var(--gg-pipe-cyan); background: rgba(56, 232, 207, .075); font-size: 8px; font-weight: 900; }
.gg-beta-pipeline__foot p { display: grid; min-width: 0; gap: 2px; margin: 0; color: #718b99; font-size: 8px; line-height: 1.4; }
.gg-beta-pipeline__foot p b { color: #bacbd3; font-size: 9px; }

.gg-beta-pipeline__foot nav { display: flex; gap: 7px; align-items: stretch; }
.gg-beta-pipeline__foot nav a {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 15px;
  padding: 0 17px;
  border: 1px solid rgba(56, 232, 207, .23);
  border-radius: 11px;
  color: #dff9f4;
  background: rgba(56, 232, 207, .07);
  font-size: 9px;
  font-weight: 850;
  text-decoration: none;
  white-space: nowrap;
}

.gg-beta-pipeline__foot nav a:last-child { border-color: rgba(137, 178, 197, .14); color: #9eb2bd; background: rgba(137, 178, 197, .035); }
.gg-beta-pipeline__foot nav a:hover { border-color: var(--gg-pipe-cyan); color: #fff; }

@keyframes gg-pipe-live { 0%, 100% { opacity: .55; transform: scale(.76); } 50% { opacity: 1; transform: scale(1); } }
@keyframes gg-pipe-dash { to { stroke-dashoffset: -128; } }
@keyframes gg-pipe-spin { to { transform: rotate(360deg); } }
@keyframes gg-pipe-reel { 0%, 24% { transform: translateY(0); } 33%, 57% { transform: translateY(-17px); } 66%, 90% { transform: translateY(-34px); } 100% { transform: translateY(0); } }
@keyframes gg-pipe-scan { 0% { top: 9%; opacity: 0; } 13%, 80% { opacity: .8; } 92%, 100% { top: 91%; opacity: 0; } }

@media (max-width: 1120px) {
  .gg-beta-pipeline__desktop { min-height: 330px; }
  .gg-beta-source { min-width: 170px; min-height: 64px; grid-template-columns: 34px minmax(0, 1fr) 7px; gap: 8px; padding: 8px 9px; border-radius: 999px; }
  .gg-beta-source > span:first-child { width: 34px; height: 34px; border-radius: 10px; }
  .gg-beta-source svg { width: 19px; height: 19px; }
  .gg-beta-source em { display: none; }
  .gg-beta-engine { width: 156px; height: 156px; }
  .gg-beta-engine__core strong { font-size: 33px; }
  .gg-beta-pipeline__lane-labels em { font-size: 6.5px; }
  .gg-beta-output { min-width: 200px; }
  .gg-beta-output__row { min-height: 47px; }
  .gg-beta-pipeline__foot { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gg-beta-pipeline__foot nav { grid-column: 1 / -1; }
  .gg-beta-pipeline__foot nav a { min-height: 46px; }
}

@media (max-width: 820px) {
  .gg-beta-pipeline { margin: 65px 0; padding-right: 14px; padding-left: 14px; border-right: 0; border-left: 0; border-radius: 0; }
  html.gg-home-pipeline-production .gg-beta-pipeline { width: 100%; }
  .gg-beta-pipeline__head { grid-template-columns: 1fr; gap: 14px; }
  .gg-beta-pipeline__head h2 { max-width: 650px; }
  .gg-beta-pipeline__head > p { max-width: 680px; }
}

@media (min-width: 721px) {
  html.gg-home-pipeline-production .gg-beta-pipeline.is-running .gg-beta-route { animation-duration: 11.5s; }
  html.gg-home-pipeline-production .gg-beta-pipeline.is-running .gg-beta-engine__orbit { animation-duration: 20s; }
  html.gg-home-pipeline-production .gg-beta-pipeline.is-running .gg-beta-engine__reel span { animation-duration: 6.8s; }
  html.gg-home-pipeline-production .gg-beta-pipeline.is-running .gg-beta-output__screen::after { animation-duration: 5.4s; }
}

@media (max-width: 720px) {
  .gg-beta-pipeline { padding-top: 37px; padding-bottom: 34px; }
  .gg-beta-pipeline__eyebrow b { display: none; }
  .gg-beta-pipeline__head h2 { font-size: clamp(34px, 10.2vw, 46px); }
  .gg-beta-pipeline__head > p { font-size: 12px; line-height: 1.6; }
  .gg-beta-pipeline__stage { border-radius: 17px; }
  .gg-beta-pipeline__desktop { display: none; }
  .gg-beta-pipeline__mobile { display: grid; justify-items: center; padding: 23px 14px 20px; }

  .gg-beta-mobile-sources { display: grid; width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .gg-beta-mobile-sources > span {
    display: grid;
    min-width: 0;
    min-height: 77px;
    place-items: center;
    align-content: center;
    gap: 5px;
    padding: 8px 4px;
    border: 1px solid rgba(139, 178, 196, .14);
    border-radius: 11px;
    color: var(--mobile-color);
    background: rgba(5, 17, 26, .7);
    text-align: center;
  }

  .gg-beta-mobile-sources .is-match { --mobile-color: var(--gg-pipe-cyan); }
  .gg-beta-mobile-sources .is-market { --mobile-color: var(--gg-pipe-amber); }
  .gg-beta-mobile-sources .is-context { --mobile-color: var(--gg-pipe-blue); }
  .gg-beta-mobile-sources svg { width: 23px; height: 23px; }
  .gg-beta-mobile-sources b { overflow: hidden; max-width: 100%; color: #bacbd3; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }

  .gg-beta-mobile-route { position: relative; width: 2px; height: 44px; overflow: visible; background: linear-gradient(var(--gg-pipe-cyan), var(--gg-pipe-purple)); }
  .gg-beta-mobile-route i { position: absolute; top: 0; left: -3px; width: 8px; height: 8px; border-radius: 50%; background: #b9a7ff; box-shadow: 0 0 12px #9b74ff; }
  .gg-beta-pipeline.is-running .gg-beta-mobile-route i { animation: gg-pipe-mobile-packet 2.2s infinite linear; }
  .gg-beta-mobile-route i:nth-child(2) { animation-delay: .7s !important; }
  .gg-beta-mobile-route i:nth-child(3) { animation-delay: 1.4s !important; }
  .gg-beta-mobile-route.is-output { height: 37px; background: linear-gradient(var(--gg-pipe-purple), rgba(155, 116, 255, .2)); }

  .gg-beta-mobile-engine {
    position: relative;
    display: grid;
    width: 142px;
    height: 142px;
    place-content: center;
    border: 1px solid rgba(155, 116, 255, .52);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(47, 28, 87, .96), rgba(7, 16, 29, .99) 68%);
    box-shadow: 0 0 0 8px rgba(155, 116, 255, .035), 0 0 30px rgba(126, 87, 255, .2);
    text-align: center;
  }

  .gg-beta-mobile-engine::before { position: absolute; inset: 12px; border: 1px dashed rgba(183, 156, 255, .6); border-radius: 50%; content: ""; }
  .gg-beta-pipeline.is-running .gg-beta-mobile-engine::before { animation: gg-pipe-spin 15s infinite linear; }
  .gg-beta-mobile-engine span { color: #aa94ff; font-size: 7px; font-weight: 900; letter-spacing: .16em; }
  .gg-beta-mobile-engine strong { color: #fff; font-size: 39px; letter-spacing: -.08em; line-height: 1; }
  .gg-beta-mobile-engine small { margin-top: 3px; color: #9c87df; font-size: 6px; font-weight: 850; letter-spacing: .12em; }

  .gg-beta-mobile-output { display: grid; width: 100%; gap: 6px; }
  .gg-beta-mobile-output > span { display: grid; min-height: 45px; grid-template-columns: 6px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 7px 10px; border: 1px solid rgba(139, 178, 196, .13); border-radius: 10px; background: rgba(5, 17, 26, .75); }
  .gg-beta-mobile-output > span > i { width: 5px; height: 22px; border-radius: 99px; }
  .gg-beta-mobile-output .is-official > i { background: var(--gg-pipe-cyan); box-shadow: 0 0 9px var(--gg-pipe-cyan); }
  .gg-beta-mobile-output .is-signal > i { background: var(--gg-pipe-amber); }
  .gg-beta-mobile-output .is-model > i { background: var(--gg-pipe-blue); }
  .gg-beta-mobile-output b { color: #dce8ed; font-size: 9px; }
  .gg-beta-mobile-output em { color: #718a98; font-size: 6px; font-style: normal; font-weight: 900; letter-spacing: .08em; }

  .gg-beta-pipeline__foot { grid-template-columns: 1fr; }
  .gg-beta-pipeline__foot > div { min-height: 57px; }
  .gg-beta-pipeline__foot nav { grid-column: auto; display: grid; grid-template-columns: 1fr 1fr; }
  .gg-beta-pipeline__foot nav a { min-width: 0; min-height: 46px; padding: 0 8px; font-size: 8px; white-space: normal; text-align: center; }
}

@keyframes gg-pipe-mobile-packet { from { top: 0; opacity: 0; } 14%, 85% { opacity: 1; } to { top: calc(100% - 8px); opacity: 0; } }

@media (max-width: 390px) {
  .gg-beta-pipeline__mobile { padding-right: 9px; padding-left: 9px; }
  .gg-beta-mobile-sources b { font-size: 7px; }
  .gg-beta-pipeline__foot nav { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .gg-beta-pipeline *,
  .gg-beta-pipeline *::before,
  .gg-beta-pipeline *::after { animation: none !important; transition: none !important; }
  .gg-beta-packets { display: none; }
}