.gauge { position: relative; width: min(460px,96vw); height: 360px; margin-top: 1.25rem; }
.gauge-svg { width: 100%; height: 100%; overflow: visible; }
.gauge-track, .gauge-active { fill: none; stroke-linecap: round; }
.gauge-track { stroke: rgba(255,255,255,.09); stroke-width: 10; }
.gauge-active { stroke: url(#orange-gradient); stroke-width: 12; filter: url(#arc-glow); stroke-dasharray: 550; stroke-dashoffset: 550; transition: stroke-dashoffset .22s ease-out; }
.gauge-ticks text { fill: rgba(255,255,255,.45); font-size: 10px; font-family: Inter,sans-serif; }
.gauge-reading { position: absolute; top: 122px; left: 50%; display: flex; flex-direction: column; align-items: center; transform: translateX(-50%); }
.phase-label { min-height: 1rem; color: var(--orange-accent); font-size: .63rem; font-weight: 700; letter-spacing: .17em; }
.gauge-reading strong { font-size: clamp(3.4rem,12vw,5rem); font-weight: 300; line-height: 1; letter-spacing: -.055em; font-variant-numeric: tabular-nums; }
.speed-unit { margin-top: .25rem; color: var(--muted); font-size: .85rem; }
.go-button { position:absolute; left:50%; bottom:8px; width:98px; height:98px; transform:translateX(-50%); border:3px solid var(--orange); border-radius:50%; background:rgba(12,18,38,.7); box-shadow:0 0 0 10px rgba(232,93,4,.08),0 15px 40px rgba(0,0,0,.25); font-size:1.25rem; font-weight:700; letter-spacing:.06em; cursor:pointer; transition:transform .2s, background .2s, box-shadow .2s; }
.go-button:hover { transform:translateX(-50%) scale(1.05); background:var(--orange); box-shadow:0 0 0 10px rgba(232,93,4,.12),0 0 36px rgba(255,107,43,.45); }
.go-button:active { background:var(--orange-deep); }
.gauge[data-state="PINGING"] .go-button,.gauge[data-state="DOWNLOADING"] .go-button,.gauge[data-state="UPLOADING"] .go-button { pointer-events:none; animation:go-pulse 1.2s infinite; }
.gauge[data-state="ERROR"] .gauge-active { stroke:#ff4444; }
.gauge[data-state="COMPLETE"] .go-button { background:var(--orange); }
@keyframes go-pulse { 0%,100% { box-shadow:0 0 0 8px rgba(232,93,4,.12),0 0 18px rgba(255,107,43,.25); } 50% { box-shadow:0 0 0 17px rgba(232,93,4,0),0 0 38px rgba(255,107,43,.55); } }
@media (max-width:620px) { .gauge { height:320px; }.gauge-reading { top:108px; }.go-button { width:86px;height:86px;bottom:4px; }.gauge-active { stroke-width:11; } }
