@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;700;800;900&display=swap');
*{box-sizing:border-box}body{margin:0;color:#fff;background:radial-gradient(ellipse at 80% 0,#50307866,transparent 60%),#17132f;font-family:Nunito,system-ui}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;font:900 16px Nunito,system-ui}a{color:#cdbbf6;text-decoration:none}header{max-width:1200px;margin:auto;padding:24px;display:flex;align-items:center;justify-content:space-between;gap:16px}header strong{font-size:22px}em{color:#8ce8ff;font-style:normal}main{max-width:1120px;margin:auto;padding:20px 24px 50px}h1{font-size:clamp(40px,6vw,72px);line-height:1.1;margin:20px 0}p{line-height:1.7;color:#d2c6e5}.tag{color:#ffd876;letter-spacing:2px;font-size:12px;font-weight:900}.riders{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:30px 0}.rider{background:#2c2346;border:2px solid #5c4a76;border-radius:20px;color:white;padding:12px;text-align:left}.rider.selected{border-color:#ffdc78;box-shadow:0 0 25px #ffda6b22}.rider img{width:100%;aspect-ratio:1.4;object-fit:cover;object-position:top left;display:block;border-radius:12px}.rider strong{display:block;font-size:24px;margin:12px 0 3px}.rider small{font-size:12px;color:#cfbfdf}.primary,.secondary{padding:15px 24px;border:0;border-radius:14px}.primary{background:#ffda73;color:#302044}.secondary{background:#55416e;color:white}.help{font-size:13px}.route,.record{padding:24px;border-radius:20px;background:#2c2443;margin-top:24px}#stages{display:flex;flex-wrap:wrap;gap:10px}#stages span{padding:9px 12px;border:1px solid #67557d;border-radius:12px;font-size:12px}.hud{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px;background:#292242;border-radius:18px 18px 0 0}.hud small,.hud strong{display:block}.hud small{font-size:10px;color:#c0a6e8}.hud strong{font-size:16px}.metric{display:flex;gap:20px}.metric span{font-size:9px;color:#d0c2e5}.metric b{display:block;font-size:25px;color:#ffda73}.hud button{background:#514167;border:0;border-radius:12px;color:#fff;padding:12px}.road{position:relative;overflow:hidden;border-radius:0 0 20px 20px}canvas{display:block;width:100%;height:auto;background:#252041}#overlay{position:absolute;inset:0;background:#100b29cc;display:grid;place-items:center;padding:20px;text-align:center}#overlay[hidden]{display:none}#overlay>div{max-width:470px;background:#30264c;padding:28px;border-radius:24px}#overlay button{margin:6px}#notice{position:absolute;top:12px;left:50%;transform:translateX(-50%);background:#22173ad9;color:#ffde7d;border-radius:14px;padding:10px 18px;font-size:14px;font-weight:900;pointer-events:none;opacity:0;white-space:nowrap}#notice.visible{opacity:1}.controls{display:flex;justify-content:space-between;gap:12px;margin-top:18px}.controls>div{display:flex;gap:10px}.controls button{touch-action:none;user-select:none;border:0;border-radius:16px;background:#56426f;color:white;min-width:65px;min-height:62px;font-size:22px}.controls .gas{font-size:15px;background:#52dbc0;color:#17332d;padding:12px 20px}.controls .brake{font-size:13px;background:#e6839c;color:#341329;padding:12px}.progress{height:8px;border-radius:8px;background:#47365f;overflow:hidden}.progress span{display:block;height:100%;background:#7de7f0;width:0}footer{padding:25px;text-align:center;color:#b5a4c8;font-size:12px}button:focus-visible,a:focus-visible{outline:3px solid #81eaff;outline-offset:4px}[hidden]{display:none!important}@media(max-width:700px){header{flex-wrap:wrap;padding:18px}header strong{order:-1;width:100%}main{padding:15px 12px 30px}.riders{grid-template-columns:repeat(2,1fr);gap:10px}.rider strong{font-size:20px}.hud{padding:12px;flex-wrap:wrap}.metric{gap:15px}.metric b{font-size:20px}.controls button{min-width:53px}.controls .gas{padding:10px;font-size:12px}.controls .brake{padding:10px;font-size:11px}#notice{font-size:11px}.route,.record{padding:18px}}

.controls{touch-action:none}.auto-option{display:flex;align-items:center;gap:10px;padding:12px 4px;font-weight:700;color:#eee4ff}.auto-option input{width:22px;height:22px;accent-color:#7be8d7}
/* Keep checkpoint notices below the prominent countdown. */
#notice{top:28%;white-space:normal;width:max-content;max-width:90%;text-align:center}

.turbo-menu-cover{display:block;width:100%;max-width:900px;height:auto;aspect-ratio:16/9;margin:0 auto 28px;border-radius:20px}
