.runner-modes{display:flex;gap:8px;width:min(100%,480px)}
.runner-modes button{flex:1;min-height:42px;border:1px solid #ffffff40;border-radius:11px;background:#293858;color:#fff;font:inherit;font-weight:800;cursor:pointer}
.runner-modes button[aria-pressed="true"]{border-color:#8cfdc5;background:#8cfdc5;color:#121b2e}
.runner-lobby{width:min(100%,480px);padding:14px;border:1px solid #ffffff36;border-radius:14px;background:#1c2748;color:#dce5f2}
.runner-lobby[hidden],.runner-lobby #raceRoom[hidden],.runner-lobby .runner-error[hidden],.runner-lobby #raceStart[hidden]{display:none}
.runner-lobby p{margin:0 0 12px;line-height:1.45}
.runner-join,.runner-roomline{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.runner-join input{width:130px;min-width:0;flex:1;padding:10px;border:1px solid #ffffff50;border-radius:9px;background:#101b36;color:white;font:inherit;text-transform:uppercase;letter-spacing:.12em}
.runner-lobby button{padding:9px 12px;border:1px solid #8cfdc5;border-radius:9px;background:#30546a;color:white;font:inherit;font-weight:800;cursor:pointer}
.runner-lobby button:disabled{opacity:.5;cursor:default}
.runner-roomline{margin:12px 0}.runner-roomline strong{color:#8cfdc5;font-size:1.3rem;letter-spacing:.12em}
.runner-versus{display:flex;justify-content:space-between;gap:10px;margin:10px 0;padding:10px;border-radius:9px;background:#101b36;font-weight:800}
.runner-versus strong{color:#8cfdc5;font-size:1.2rem}
.runner-error{margin:10px 0 0!important;color:#ffb7bb}
@media(max-width:440px){.runner-join button{flex:1}.runner-join input{flex-basis:100%;order:-1}.runner-roomline button{width:100%}}