/* Quiet HUD: no logo or XP pill while playing, a light clock in the corner, ride widgets reduced to what the child needs. */
.brand{display:none}
.xp-pill{display:none}
.hint{display:none}
.clock-card{top:6px;right:10px;background:#fff3d9b3;border:0;box-shadow:none;padding:4px 12px;min-width:0;border-radius:12px;gap:8px}
.clock-card .sun{font-size:22px}
/* Ride: progress line at the top, light status only near a crossing. */
.hud:has(.ride-controls:not([hidden])) .objective,.hud:has(.ride-controls:not([hidden])) .toolbar{display:none}
.ride-meter{left:50%;right:auto;top:10px;bottom:auto;transform:translateX(-50%);width:min(320px,55vw);background:transparent;border:0;padding:0;box-shadow:none;font-size:0;text-align:center}
.ride-meter .progress{height:7px;margin:0;border:0;background:#00000038;border-radius:7px}
.ride-meter .progress i{background:#fff3d9}
.ride-meter .signal-status{display:inline-block;font-size:18px;margin:10px auto 0;background:#fff3d9e6;border-radius:12px;padding:7px 16px;font-weight:900;box-shadow:0 3px #0002}
/* Ride: right-hand column, accelerate above brake. */
.ride-controls{left:auto;right:16px;bottom:16px;transform:none;flex-direction:column;align-items:stretch;gap:8px}
.ride-controls button{width:96px;height:64px;font-size:22px;font-weight:900;border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;padding:0}
.ride-controls button small{font-size:12px;font-weight:800;margin-top:3px;letter-spacing:.4px}
.ride-controls [data-ride=w]{order:1;height:86px;font-size:32px}
.ride-controls [data-ride=s]{order:2;height:74px;font-size:28px}
.ride-controls .stop{order:3;width:96px;height:56px;font-size:18px}
.ride-controls #ride-jump{order:0;width:96px;height:54px;font-size:16px}
.ride-controls .pause{order:4;width:96px;height:40px;font-size:13px}
.ride-controls button:active{transform:translateY(2px);box-shadow:0 2px #5a402f}
@media(max-width:900px){
 .clock-card{top:6px;right:8px;padding:3px 9px}
 .ride-controls{right:10px;bottom:12px;gap:6px}
 .ride-controls button,.ride-controls .stop,.ride-controls #ride-jump,.ride-controls .pause{width:84px}
 .ride-controls [data-ride=w]{height:76px}
 .ride-controls [data-ride=s]{height:66px}
}
