.sg{position:relative;overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,rgba(59,130,246,.14),rgba(11,12,14,0) 60%),#0b0c10}
.sg-phase{text-align:center;font-weight:800;letter-spacing:.18em;text-transform:uppercase;font-size:.85rem;color:#94a3b8;min-height:1.2em}
.sg-phase[data-p=Descarga]{color:#22d3ee}.sg-phase[data-p=Subida]{color:#ec4899}.sg-phase[data-p=Ping]{color:#fbbf24}.sg-phase[data-p=Listo]{color:#4ade80}
.sg.running .sg-phase{animation:sgpulse 1.4s ease-in-out infinite}
@keyframes sgpulse{50%{opacity:.45}}
.sg-gauges{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:8px}
.sg-g{position:relative;text-align:center}
.sg-name{display:block;font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:.9rem}
.sg-name.dl{color:#22d3ee}.sg-name.ul{color:#e879f9}
.sg-svg{width:100%;max-width:340px;display:block;margin:0 auto}
.sg-track{fill:none;stroke:#1e2533;stroke-width:14;stroke-linecap:round}
.sg-fill{fill:none;stroke-width:14;stroke-linecap:round}
.sg-tick{stroke:#475569;stroke-width:2}
.sg-lbl{fill:#7c8aa0;font-size:8px;text-anchor:middle;font-family:inherit}
.sg-hub{fill:#e2e8f0;stroke:#0b0c10;stroke-width:3}
.sg-num{fill:#fff;font-size:28px;font-weight:800;text-anchor:middle;font-variant-numeric:tabular-nums;font-family:inherit}
.sg-unit{fill:#94a3b8;font-size:10px;text-anchor:middle;letter-spacing:.15em;font-family:inherit}
.sg-go{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:140px;height:140px;border-radius:50%;border:3px solid #22d3ee;background:radial-gradient(circle,#0e1726 55%,#0b1220);color:#fff;font-weight:900;font-size:1.25rem;letter-spacing:.12em;cursor:pointer;z-index:2;box-shadow:0 0 0 8px rgba(34,211,238,.08),0 0 40px rgba(34,211,238,.45),inset 0 0 25px rgba(168,85,247,.35);animation:sgglow 2.2s ease-in-out infinite}
.sg-go:hover{background:radial-gradient(circle,#13223a 55%,#0b1220);transform:translate(-50%,-50%) scale(1.04)}
.sg-go[hidden]{display:none}
@keyframes sgglow{50%{box-shadow:0 0 0 14px rgba(34,211,238,.04),0 0 60px rgba(168,85,247,.55),inset 0 0 25px rgba(34,211,238,.35)}}
.sg-pills{display:flex;justify-content:center;gap:14px;margin-top:6px;flex-wrap:wrap}
.sg-pill{display:flex;align-items:baseline;gap:8px;padding:10px 20px;border-radius:999px;background:#111827;border:1px solid #273244;min-width:150px;justify-content:center;transition:border-color .3s,box-shadow .3s}
.sg-pill span{color:#94a3b8;font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;font-weight:700}
.sg-pill b{font-size:1.6rem;color:#e2e8f0;font-variant-numeric:tabular-nums}
.sg-pill i{font-style:normal;color:#64748b;font-size:.8rem}
.sg-pill.good{border-color:#22c55e;box-shadow:0 0 16px rgba(34,197,94,.25)}.sg-pill.good b{color:#4ade80}
.sg-pill.mid{border-color:#f59e0b;box-shadow:0 0 16px rgba(245,158,11,.25)}.sg-pill.mid b{color:#fbbf24}
.sg-pill.bad{border-color:#ef4444;box-shadow:0 0 16px rgba(239,68,68,.25)}.sg-pill.bad b{color:#f87171}
.sg-verdict{text-align:center;font-weight:700;color:#e2e8f0;min-height:1.4em;margin:12px 0 0}
.sg-actions{justify-content:center;margin-top:10px}
@media (max-width:640px){.sg-gauges{grid-template-columns:1fr}.sg-go{position:static;transform:none;margin:4px auto;display:block;order:-1}.sg-go:hover{transform:scale(1.04)}.sg-gauges{display:flex;flex-direction:column}}
@media (prefers-reduced-motion:reduce){.sg-go,.sg.running .sg-phase{animation:none}.sg-pill{transition:none}}
