.agentic-flywheel {
  --flywheel-accent: var(--accent, #ed1e40);
  --flywheel-highlight: color-mix(in srgb, var(--flywheel-accent) 75%, var(--ink, #f4f1f6));
  --flywheel-core-strength: 90%;
  --flywheel-core-light: color-mix(in srgb, var(--flywheel-accent) var(--flywheel-core-strength), #000);
  --flywheel-core-mid: color-mix(in srgb, var(--flywheel-core-light) 80%, #000);
  --flywheel-core-shadow: color-mix(in srgb, var(--flywheel-core-light) 42%, #000);
  --flywheel-core-ink: #fff;
}

/* Keep the name readable over the brightest point of each accent gradient. */
html[data-theme="raf"] .agentic-flywheel,
html[data-theme="nomad"] .agentic-flywheel,
html[data-theme="electric"] .agentic-flywheel,
html[data-theme="ember"] .agentic-flywheel {
  --flywheel-core-strength: 65%;
}

html[data-theme="lime"] .agentic-flywheel {
  --flywheel-core-strength: 45%;
}

.flywheel-art {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
  color: var(--ink, #f4f1f6);
}

.flywheel-stage {
  fill: currentColor;
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 32px;
  font-weight: 600;
}

.flywheel-stage-long { font-size: 28px; }
.flywheel-label {
  fill: currentColor;
  font-family: "Geist Sans", sans-serif;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 2px;
}

.flywheel-name {
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 45px;
  font-weight: 600;
}

.flywheel-track { opacity: .42; }
.flywheel-core,
.flywheel-halo,
.flywheel-ripple,
.flywheel-orbit {
  transform-origin: 500px 480px;
}

/* The text stays stationary while its light source breathes. */
.flywheel-core { animation: flywheel-breathe 4.8s ease-in-out infinite; }
.flywheel-halo { animation: flywheel-glow 4.8s ease-in-out infinite; }
.flywheel-ripple { animation: flywheel-ripple 4.8s ease-out infinite; }
.flywheel-orbit { animation: flywheel-orbit 36s linear infinite; }
.flywheel-shimmer { opacity: 0; animation: flywheel-shimmer 12s ease-in-out infinite; }

@keyframes flywheel-breathe {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.035); }
}
@keyframes flywheel-glow {
  0%, 100% { transform: scale(.96); opacity: .65; }
  50% { transform: scale(1.12); opacity: 1; }
}
@keyframes flywheel-ripple {
  0% { transform: scale(1); opacity: 0; }
  20% { opacity: .4; }
  90%, 100% { transform: scale(1.42); opacity: 0; }
}
@keyframes flywheel-orbit { to { transform: rotate(360deg); } }
@keyframes flywheel-shimmer {
  0%, 40%, 100% { opacity: 0; }
  15% { opacity: .55; }
}

.flywheel-caption {
  max-width: 35em;
  margin: -.5rem auto 0;
  color: var(--ink, #f4f1f6);
  font-size: clamp(.75rem, 1.25vw, .9375rem);
  line-height: 1.8;
  letter-spacing: .25em;
  text-align: center;
  text-transform: uppercase;
  text-wrap: balance;
}
.flywheel-caption::after {
  content: "";
  display: block;
  width: 2rem;
  height: 1px;
  margin: 1.25rem auto .5rem;
  background: var(--flywheel-accent);
}
.agentic-flywheel.is-motion-paused .flywheel-art * { animation-play-state: paused; }

@media (max-width: 40rem) {
  .flywheel-stage { font-size: 34px; }
  .flywheel-stage-long { font-size: 30px; }
  .flywheel-label { font-size: 20px; letter-spacing: .8px; }
}
@media (prefers-reduced-motion: reduce) {
  .flywheel-art * { animation: none !important; }
  .flywheel-ripple, .flywheel-shimmer { opacity: 0; }
}
