* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  background: #0a0a0a;
  display: flex; justify-content: center; align-items: center;
  height: 100vh; font-family: 'Segoe UI', system-ui; color: #eee;
  overflow: hidden;
}
.container { text-align: center; position: relative; }
.speedometer { position: relative; width: 280px; height: 280px; margin: 0 auto 40px; }
.ring { position: absolute; top: 0; left: 0; transform: rotate(-90deg); }
.ring svg { width: 100%; height: 100%; }
#progress-circle { transition: stroke-dashoffset 0.3s ease-out; }
.speed-value { font-size: 110px; font-weight: 700; line-height: 1; letter-spacing: -3px; margin-top: 30px; }
.unit { font-size: 28px; font-weight: 400; color: #aaa; margin-top: -5px; }
.info { font-size: 18px; margin-bottom: 30px; display: flex; justify-content: center; gap: 30px; }
.start-button {
  background: #00e054; border: none; padding: 18px 70px; font-size: 24px;
  font-weight: 700; border-radius: 50px; cursor: pointer; color: #111;
  transition: background 0.2s;
}
.start-button:hover { background: #00c748; }
.start-button:disabled { opacity: 0.5; cursor: not-allowed; }