.visual-stage{--agent-orbit-size:min(390px,calc(100% - 32px));--agent-badge:66px;--agent-period:32s}
.agent-orbits{position:absolute;left:50%;top:50%;width:var(--agent-orbit-size);aspect-ratio:1;transform:translate(-50%,-50%);z-index:4;pointer-events:none;border:1px solid #94b6dc20;border-radius:50%;box-shadow:0 0 35px #6988b209}
.agent-orbit-arm{position:absolute;inset:0;animation:agent-orbit-turn var(--agent-period) linear infinite;transform:rotate(var(--phase))}
.agent-orbit-badge{position:absolute;left:100%;top:50%;width:var(--agent-badge);height:var(--agent-badge);transform:translate(-50%,-50%)}
.agent-orbit-face{width:100%;height:100%;border:1px solid #c6ab7166;border-radius:50%;background:radial-gradient(circle at 35% 20%,#1b3048,#081320 80%);box-shadow:0 8px 23px #0008,0 0 20px #c3a46b12,inset 0 0 12px #a8c8ed0c;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;animation:agent-orbit-counter var(--agent-period) linear infinite;transform:rotate(calc(-1 * var(--phase)))}
.agent-orbit-face svg{width:29px;height:29px;filter:drop-shadow(0 0 5px currentColor)}
.agent-orbit-face span{font:600 7px/1.3 system-ui;letter-spacing:.25px;color:#b9cadf;white-space:nowrap}
.agent-deepseek{color:#6eafff;border-color:#629ce680}.agent-grokbot{color:#e5e8f1;border-color:#9caec25c}.agent-codex{color:#a8dac8;border-color:#87baaa70}.agent-claude{color:#dcab84;border-color:#c5946a80}
.visual-stage.orbit-offscreen .agent-orbit-arm,.visual-stage.orbit-offscreen .agent-orbit-face,.visual-stage.orbit-page-hidden .agent-orbit-arm,.visual-stage.orbit-page-hidden .agent-orbit-face{animation-play-state:paused}
.visual-stage .scene-label.label-c{top:5px;right:0;z-index:1}.visual-stage .scene-label.label-b{bottom:-5px;z-index:1}
@keyframes agent-orbit-turn{from{transform:rotate(var(--phase))}to{transform:rotate(calc(var(--phase) + 360deg))}}
@keyframes agent-orbit-counter{from{transform:rotate(calc(-1 * var(--phase)))}to{transform:rotate(calc(-1 * var(--phase) - 360deg))}}
@media(max-width:900px){.visual-stage{--agent-orbit-size:min(350px,calc(100% - 20px));--agent-badge:58px}.agent-orbit-face svg{width:25px;height:25px}.agent-orbit-face span{font-size:6px}}
@media(max-width:800px){.visual-stage{--agent-orbit-size:min(350px,calc(100% - 40px));--agent-badge:60px}.visual-stage .scene-label.label-c{top:0;right:3%}.visual-stage .scene-label.label-b{bottom:0;right:2%}}
@media(max-width:420px){.visual-stage{--agent-orbit-size:calc(100% - 38px);--agent-badge:51px}.agent-orbit-face svg{width:22px;height:22px}.agent-orbit-face span{font-size:5.5px}}
@media(prefers-reduced-motion:reduce){.agent-orbit-arm,.agent-orbit-face{animation:none!important}}

/* Larger badges, with the same path and speed. */
.visual-stage{--agent-badge:80px}.agent-orbit-face svg{width:36px;height:36px}.agent-orbit-face span{font-size:8px}@media(max-width:900px){.visual-stage{--agent-badge:70px}.agent-orbit-face svg{width:31px;height:31px}.agent-orbit-face span{font-size:7px}}@media(max-width:420px){.visual-stage{--agent-badge:60px}.agent-orbit-face svg{width:27px;height:27px}.agent-orbit-face span{font-size:6.5px}}