*{box-sizing:border-box}html,body{margin:0;height:100%;background:#02060a;color:white;font-family:Arial;overflow:hidden;touch-action:none}#wrap{position:relative;width:min(100vw,1600px);aspect-ratio:16/9;margin:auto;background:#09131c}canvas{width:100%;height:100%;display:block}.hud{position:absolute;inset:0;pointer-events:none}.top{display:flex;gap:10px;padding:14px;font-weight:bold;background:linear-gradient(#000c,transparent)}.brand{margin-right:auto;color:#7ddcff;font-size:22px}.p{background:#07111bc9;border:1px solid #6688a066;padding:7px 10px;border-radius:8px}#msg{position:absolute;top:14%;left:50%;transform:translateX(-50%);font-size:38px;font-weight:900;text-shadow:0 3px 10px #000}.help{position:absolute;bottom:14px;left:14px;background:#000b;padding:9px;border-radius:8px}#intro{position:absolute;inset:0;display:grid;place-items:center;background:#030a12ee;pointer-events:auto;z-index:5}.card{width:min(600px,90%);padding:30px;border:1px solid #39708d;border-radius:20px;background:#081722}.card h1{font-size:44px;margin:0}.card b{color:#ffc234}button{padding:14px 24px;border:0;border-radius:10px;background:#16a7ed;color:#fff;font-weight:bold;font-size:18px;cursor:pointer}.mobile-controls{display:none;position:absolute;inset:auto 18px 18px 18px;align-items:flex-end;justify-content:space-between;pointer-events:none;z-index:3}.mobile-controls button{width:58px;height:58px;padding:0;border:1px solid #a7e4ff80;background:#06131dde;box-shadow:0 2px 12px #0008;pointer-events:auto;touch-action:none;user-select:none}.mobile-controls button.is-pressed{background:#16a7ed;transform:scale(.96)}.drive-controls{display:flex;align-items:flex-end;gap:8px}.drive-controls div{display:grid;gap:8px}.smoke-button{width:78px!important;height:78px!important;border-radius:50%;background:#e6edf0dd!important;color:#14232b!important;font-size:12px}
@media (pointer:coarse),(max-width:800px){.mobile-controls{display:flex}.help{display:none}.top{gap:4px;padding:7px;font-size:11px}.brand{font-size:13px}.p{padding:5px 6px}#msg{font-size:24px}.card{padding:22px}.card h1{font-size:34px}}
.vehicle-label{display:block;margin:18px 0 6px;color:#8fdfff;font-size:12px;font-weight:800;letter-spacing:.08em}.card select{display:block;width:100%;padding:11px 12px;border:1px solid #39708d;border-radius:8px;background:#04101a;color:#fff;font-weight:700}.vehicle-note{display:block;min-height:22px;padding-top:7px;color:#ffc95b}.card #play{margin-top:8px;width:100%}
@media (max-aspect-ratio:16/9){#wrap{top:50%;transform:translateY(-50%)}}
.vehicle-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:8px}.vehicle-grid button{min-width:0;padding:6px 3px;border:1px solid #29485a;border-radius:8px;background:#06121b;color:#8aa8b8;font-size:9px}.vehicle-grid button.is-selected{border-color:#57d9ff;background:#0b3044;color:#fff;box-shadow:0 0 12px #28bfff66}.vehicle-grid img{display:block;width:26px;height:42px;margin:0 auto 3px;object-fit:contain}.vehicle-grid span{display:block;overflow:hidden;text-overflow:ellipsis}.card{max-height:96vh;overflow:auto}@media(max-width:600px){.vehicle-grid{gap:3px}.vehicle-grid button{padding:4px 1px;font-size:7px}.vehicle-grid img{width:20px;height:32px}.vehicle-label{margin-top:10px}}