.rg-info { width: min(100%, 36rem); height: auto; display: block; margin-inline: auto; }
.rg-node { fill: #fff; stroke: #d5deea; stroke-width: 1.2; }
.rg-label { fill: #122033; }
.rg-sub { fill: #5c6b7a; }
.rg-cloud { fill: #2f6fed; stroke: #2f6fed; fill-opacity: .08; stroke-opacity: .22; }
.rg-chrome { fill: #e8eef6; }
.rg-line, .rg-track { fill: #d5deea; }
.rg-tile { fill: #f4f7fb; }
.rg-bar-slow { animation-duration: 3.1s; animation-delay: .25s; }
.rg-bar-late { animation-duration: 3.4s; animation-delay: .55s; }
.rg-led-blue { animation: sv-led 1.9s ease-in-out infinite; animation-delay: .4s; filter: drop-shadow(0 0 3px #8eb7ff); }
.rg-route { stroke-dasharray: 6 5; animation: sv-flow-line 1s linear infinite; }
.rg-bar { transform-box: fill-box; transform-origin: left center; animation: rg-bar 2.6s ease-in-out infinite; }
.sv-led, .sv-led-ring { transform-box: fill-box; transform-origin: center; }
.sv-led { animation: sv-led 1.35s ease-in-out infinite; filter: drop-shadow(0 0 3px #3DDC97); }
.sv-led-ring { animation: sv-led-ring 1.35s ease-out infinite; }
@keyframes sv-led { 0%, 100% { opacity: 1; } 45% { opacity: .18; } }
@keyframes sv-led-ring { 0% { transform: scale(.65); opacity: .7; } 100% { transform: scale(2.3); opacity: 0; } }
@keyframes sv-flow-line { to { stroke-dashoffset: -28; } }
@keyframes rg-bar { 0%, 100% { transform: scaleX(.22); } 50% { transform: scaleX(1); } }
[data-bs-theme=dark] .rg-node { fill: rgba(255,255,255,.08); stroke: rgba(255,255,255,.22); }
[data-bs-theme=dark] .rg-label { fill: #eef3fb; }
[data-bs-theme=dark] .rg-sub { fill: #b7c3d4; }
[data-bs-theme=dark] .rg-cloud { fill-opacity: .14; stroke-opacity: .4; }
[data-bs-theme=dark] .rg-chrome { fill: rgba(255,255,255,.14); }
[data-bs-theme=dark] .rg-line, [data-bs-theme=dark] .rg-track { fill: rgba(255,255,255,.16); }
[data-bs-theme=dark] .rg-tile { fill: rgba(255,255,255,.07); }
.home-hero .rg-node { fill: rgba(255,255,255,.1); stroke: rgba(255,255,255,.28); }
.home-hero .rg-chrome { fill: rgba(255,255,255,.16); }
.home-hero .rg-line { fill: rgba(255,255,255,.22); }
.home-hero .rg-tile { fill: rgba(255,255,255,.08); }
.home-hero .rg-label { fill: #fff; }
.home-hero .rg-sub { fill: rgba(255,255,255,.72); }
.home-hero .rg-cloud { fill-opacity: .12; stroke-opacity: .4; }
@media (prefers-reduced-motion: reduce) {
    .sv-led, .sv-led-ring, .rg-route, .rg-bar, .rg-led-blue { animation: none; }
    .sv-led, .rg-led-blue { opacity: 1; }
    .sv-led-ring, .rg-packet { opacity: 0; }
    .rg-packet { display: none; }
    .rg-bar { transform: none; }
}