

/* v1.3.13 UI FIX TEST: smartphone race ONLINE HUD restored, lobby players moved between MAP and CHAT,
   main lobby reduced to START / OPTION / LOGOUT, and controller SVG ratio hard-locked. */
.onlineMemberDockMobile{display:none}
.onlineMenuPrimary{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:7px;margin-top:8px}
.onlineMenuPrimary button{width:100%;min-height:52px;margin:0;padding:10px 8px;border-radius:9px;font:1000 15px/1 "Arial Black","Yu Gothic UI",sans-serif;letter-spacing:.06em;cursor:pointer}
.onlineMenuPrimary #onlineGameStart{background:linear-gradient(180deg,#ff5d52,#d91f17);border:1px solid rgba(255,165,158,.95);color:#fff;box-shadow:0 0 24px rgba(255,58,48,.20)}
.onlineMenuPrimary #onlineOptionBtn{background:linear-gradient(180deg,#163a45,#0a1b21);border:1px solid rgba(80,220,255,.48);color:#8defff}
.onlineMenuPrimary #onlineClose{background:linear-gradient(180deg,#25292c,#111416);border:1px solid rgba(255,255,255,.18);color:#d9e1e4}
.onlineMenuPrimary button:disabled{opacity:.38;filter:grayscale(.45);cursor:default}
#onlineOptionOverlay{position:fixed;inset:0;z-index:81;display:none;align-items:center;justify-content:center;padding:16px;box-sizing:border-box;background:rgba(0,0,0,.88);backdrop-filter:blur(5px)}
#onlineOptionOverlay.show{display:flex}
.onlineOptionPanel{width:min(520px,94vw);max-height:90dvh;overflow:auto;box-sizing:border-box;padding:18px;border:1px solid rgba(80,220,255,.48);border-radius:14px;background:linear-gradient(180deg,rgba(7,22,29,.99),rgba(2,8,11,.99));box-shadow:0 24px 80px rgba(0,0,0,.82),0 0 34px rgba(45,213,245,.10)}
.onlineOptionHead{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;padding-bottom:11px;border-bottom:1px solid rgba(80,220,255,.18)}
.onlineOptionHead strong{color:#f2fdff;font:1000 27px/1 "Arial Black","Yu Gothic UI",sans-serif;letter-spacing:.09em}.onlineOptionHead span{color:#6adff5;font:900 8px/1.35 ui-monospace,Consolas,monospace;text-align:right}
.onlineOptionGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:13px}
.onlineOptionGrid button{display:block!important;min-height:76px;margin:0;padding:12px;text-align:left;border:1px solid rgba(80,220,255,.22);border-radius:9px;background:linear-gradient(180deg,#10242b,#071116);color:#eefcff;box-shadow:none;cursor:pointer}
.onlineOptionGrid button b{display:block;font:1000 15px/1.1 "Arial Black","Yu Gothic UI",sans-serif;letter-spacing:.04em}.onlineOptionGrid button small{display:block;margin-top:6px;color:#77bdca;font:800 8px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.05em}
.onlineOptionClose{display:block;width:100%;min-height:42px;margin:10px 0 0;padding:9px;border:1px solid rgba(255,255,255,.18);border-radius:8px;background:#101517;color:#d8e1e4;font:900 11px/1 ui-monospace,Consolas,monospace}
#rankingOverlay{z-index:100100!important}
#onlineOptionOverlay #onlineControlsBtn{display:block!important}
#mpOnlineHud{display:none}
@media (hover:none) and (pointer:coarse) and (orientation:portrait){
  /* Smartphone race ONLINE PLAYERS: compact + translucent so it does not mask the course view. */
  body.mobile-racing #mpOnlineHud{display:block!important;position:fixed!important;top:max(6px,env(safe-area-inset-top))!important;right:6px!important;left:auto!important;bottom:auto!important;z-index:99996!important;width:clamp(112px,30vw,132px)!important;max-height:96px!important;overflow:hidden!important;box-sizing:border-box!important;padding:4px 5px!important;border:1px solid rgba(99,234,255,.28)!important;border-radius:8px 8px 0 0!important;background:linear-gradient(180deg,rgba(3,18,24,.56),rgba(1,7,10,.44))!important;box-shadow:0 2px 8px rgba(0,0,0,.24)!important;color:#e9fbff!important;pointer-events:none!important;-webkit-backdrop-filter:blur(1.2px);backdrop-filter:blur(1.2px)}
  #mpOnlineHud .mpOnlineHead{display:flex!important;align-items:center!important;gap:3px!important;margin:0 0 2px!important;color:#71e8fb!important;font:1000 7px/1 ui-monospace,Consolas,monospace!important;letter-spacing:.055em!important}
  #mpOnlineHud #mpOnlineCount{margin-left:auto!important;color:rgba(255,255,255,.92)!important;font-size:8px!important}
  #mpOnlineHud #mpOnlineList{display:grid!important;gap:0!important;margin:0!important;color:#eaf9fc!important}
  #mpOnlineHud .mpOnlineRow{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:0!important;padding:2px 0 1px!important;border-top:1px solid rgba(255,255,255,.055)!important;min-width:0!important}
  #mpOnlineHud .mpOnlineRow b{display:block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:rgba(255,255,255,.94)!important;font:900 7px/1.05 ui-monospace,Consolas,monospace!important}
  #mpOnlineHud .mpOnlineRow.self b{color:#8ef5b0!important}
  #mpOnlineHud .mpOnlineRow small{display:block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:rgba(180,220,229,.82)!important;font:800 5.7px/1.05 ui-monospace,Consolas,monospace!important;letter-spacing:.01em!important}
  #mpOnlineHud .mpOnlineMore,#mpOnlineHud .mpOnlineEmpty{padding-top:1px!important;color:rgba(166,197,204,.68)!important;font:800 5.7px/1 ui-monospace,Consolas,monospace!important;text-align:right!important}
  #onlineOverlay.show .onlineMemberDockMobile{display:block!important;order:25!important;margin:7px 0 0!important;padding:0!important}
  #onlineOverlay.show .onlineMemberDockMobile .onlinePlayersInlineTitle{margin:0!important;padding:6px 7px!important}
  #onlineOverlay.show .onlineMemberDockMobile #onlineMemberList{order:initial!important;margin-top:4px!important;max-height:145px!important;overflow:auto!important;gap:4px!important;padding:0!important}
  #onlineOverlay.show .onlineMemberDockMobile .onlineMember{padding:6px!important}
  #onlineOverlay.show .onlineControlDock{order:60!important}
  #onlineOverlay.show .onlineMenuPrimary{grid-template-columns:1fr 1fr 1fr!important;gap:4px!important;margin-top:0!important}
  #onlineOverlay.show .onlineMenuPrimary button{min-height:42px!important;padding:7px 3px!important;font-size:10px!important}
  #onlineOverlay.show .onlineStartHint{font-size:7px!important;margin-top:4px!important}
  .onlineOptionPanel{width:94vw!important;padding:12px!important}.onlineOptionGrid{grid-template-columns:1fr!important;gap:6px!important}.onlineOptionGrid button{min-height:58px!important;padding:9px 10px!important}.onlineOptionGrid button b{font-size:13px!important}.onlineOptionGrid button small{font-size:7px!important}
}
@media (max-width:820px){
  #pcControlsOverlay .controllerGuideArea{display:block!important}
  #pcControlsOverlay .controllerSvgWrap{position:relative!important;width:min(100%,560px)!important;height:auto!important;aspect-ratio:auto!important;margin:0 auto 8px!important;padding:0!important;overflow:hidden!important;box-sizing:border-box!important}
  #pcControlsOverlay .controllerSvg{position:static!important;inset:auto!important;display:block!important;width:100%!important;height:auto!important;aspect-ratio:800 / 470!important;max-width:100%!important;max-height:none!important;object-fit:contain!important;transform:none!important}
}

