*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,sans-serif}
body{background:transparent;overflow:hidden;color:#fff}
.hud{position:absolute;bottom:40px;right:40px;display:flex;align-items:center;gap:20px}
.speed-box{position:relative;width:240px;height:240px}
.speed-ring{position:relative;width:100%;height:100%}
svg{width:100%;height:100%;transform:rotate(-90deg)}
circle{fill:none;stroke-width:12;stroke-linecap:round}
.bg{stroke:rgba(255,255,255,.12)}
.progress{stroke:#00c6ff;stroke-dasharray:565;stroke-dashoffset:565;filter:drop-shadow(0 0 8px #00c6ff);transition:stroke-dashoffset .2s linear}
.speed-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}
.speed-value{display:block;font-size:64px;font-weight:bold}
.speed-unit{font-size:14px;letter-spacing:2px;color:rgba(255,255,255,.7)}
.gear-box{position:absolute;bottom:15px;width:100%;text-align:center}
.gear-box span{font-size:30px;font-weight:bold;color:#00c6ff}
.vehicle-info{display:flex;flex-direction:column;gap:10px;min-width:180px}
.info-card{background:rgba(10,10,10,.85);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:10px}
.info-card label{display:block;margin-bottom:6px;font-size:12px;color:rgba(255,255,255,.7)}
.bar{width:100%;height:8px;background:rgba(255,255,255,.1);border-radius:999px;overflow:hidden}
.fill{height:100%;width:100%}
.fuel-fill{background:#00ff88}
.health-fill{background:#ff5a5a}
.status,.rpm-text{font-size:18px;font-weight:bold}