/* Cadeia de suprimentos animada — extraída do HTML 'Syncrus — Cadeia Animada'. Só CSS, sem JavaScript de animação. */
.spd-lento{--k:1.7}.spd-normal{--k:1}.spd-rapido{--k:.6}
.scene{position:absolute;inset:0;transform-origin:50% 50%;animation:kb calc(var(--k)*24s) ease-in-out infinite alternate}
.base{position:absolute;left:0;top:0;width:1920px;height:1080px;display:block}
.crop{position:absolute;background-image:url("/static/cadeia-base.jpg");background-size:1920px 1080px;background-repeat:no-repeat}
.gear{border-radius:50%;-webkit-mask-image:radial-gradient(circle,#000 88%,transparent 100%);mask-image:radial-gradient(circle,#000 88%,transparent 100%)}
.cw{animation:spin calc(var(--k)*10s) linear infinite}
.ccw{animation:spin calc(var(--k)*12s) linear infinite reverse}
.soft{-webkit-mask-image:radial-gradient(ellipse at center,#000 55%,transparent 75%);mask-image:radial-gradient(ellipse at center,#000 55%,transparent 75%)}
.bob{animation:bob calc(var(--k)*3.2s) ease-in-out infinite}
.bobbig{animation:bobbig calc(var(--k)*4.4s) ease-in-out infinite}
.fly{animation:fly calc(var(--k)*5s) ease-in-out infinite}
.pt{position:absolute;left:0;top:0;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px #2f6fd6,0 0 14px 4px rgba(47,111,214,.75);offset-rotate:0deg;animation:travel calc(var(--k)*5s) linear infinite}
.pt.red{box-shadow:0 0 0 3px #d63a2f,0 0 14px 4px rgba(214,58,47,.7)}
.flow path{fill:none;stroke-width:2.5;stroke-dasharray:6 10;animation:dash calc(var(--k)*1.4s) linear infinite}
.ring{position:absolute;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;border:2.5px solid #2f6fd6;animation:pulse calc(var(--k)*2.6s) ease-out infinite}
.ring.red{border-color:#d63a2f}
.smoke{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:radial-gradient(circle,rgba(120,128,140,.55),rgba(120,128,140,0) 70%);animation:smoke calc(var(--k)*4s) ease-out infinite}
.orbit{position:absolute;border-radius:50%;border:2px dashed rgba(30,58,110,.28);animation:spin calc(var(--k)*90s) linear infinite}
.globe{position:absolute;border-radius:50%;overflow:hidden;mix-blend-mode:soft-light;pointer-events:none}
.sheen{position:absolute;inset:-30%;background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.85),rgba(255,255,255,0) 32%),radial-gradient(circle at 70% 75%,rgba(10,30,80,.55),rgba(10,30,80,0) 45%);animation:spin calc(var(--k)*40s) linear infinite}
.shine{position:absolute;overflow:hidden;pointer-events:none}
.band{position:absolute;top:-20px;bottom:-20px;width:60px;left:-80px;background:linear-gradient(90deg,rgba(255,240,200,0),rgba(255,240,200,.9),rgba(255,240,200,0));transform:skewX(-20deg);mix-blend-mode:screen;animation:shine calc(var(--k)*6s) ease-in-out infinite}
.blink{position:absolute;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:#d63a2f;box-shadow:0 0 10px 3px rgba(214,58,47,.6);animation:blink calc(var(--k)*1.6s) ease-in-out infinite}
.paused *,.paused{animation-play-state:paused !important}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.035) translate(-6px,4px)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes bob{0%,100%{transform:translate(0,0) rotate(0deg)}50%{transform:translate(2px,-3px) rotate(-1.2deg)}}
@keyframes bobbig{0%,100%{transform:translate(0,0) rotate(0deg)}50%{transform:translate(1px,-3px) rotate(-.5deg)}}
@keyframes fly{0%,100%{transform:translate(0,0)}50%{transform:translate(5px,-5px)}}
@keyframes travel{0%{offset-distance:0%;opacity:0}10%{opacity:1}88%{opacity:1}100%{offset-distance:100%;opacity:0}}
@keyframes dash{to{stroke-dashoffset:-32}}
@keyframes pulse{0%{transform:scale(.5);opacity:.95}100%{transform:scale(2.2);opacity:0}}
@keyframes smoke{0%{transform:translate(0,0) scale(.5);opacity:0}15%{opacity:.9}100%{transform:translate(-18px,-70px) scale(2.2);opacity:0}}
@keyframes shine{0%{left:-80px}55%{left:240px}100%{left:240px}}
@keyframes blink{0%,100%{opacity:.25}50%{opacity:1}}

/* Login: palco 1920x1080 escalado ao tamanho do painel */
.ca-wrap{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:20px;background:#f6f1e7}
.ca-stage{position:absolute;left:0;top:0;width:1920px;height:1080px;overflow:hidden;transform-origin:0 0}
@media (prefers-reduced-motion: reduce){.ca-stage,.ca-stage *{animation-play-state:paused !important}}