

/* v1.3.13: PC lobby player list hidden (PC uses HUD), course buttons two-line, mobile controller ratio hard-fixed. */
/* ONLINE PLAYERS lobby list: hidden on PC; shown only in smartphone portrait dock between MAP and CHAT. */
#onlineOverlay .onlineMemberDockMobile{display:none!important;}
@media (hover:none) and (pointer:coarse) and (orientation:portrait){
  #onlineOverlay.show .onlineMemberDockMobile{display:block!important;}
}

/* START -> SELECT COURSE: mode on first line, course name large/bold on second line. */
.coursePickerGrid button{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:6px!important;min-height:74px!important;padding:10px 8px!important;white-space:normal!important;text-align:center!important;}
.coursePickerGrid button .courseMode{display:block!important;font:900 9px/1.05 ui-monospace,Consolas,monospace!important;letter-spacing:.14em!important;opacity:.82!important;}
.coursePickerGrid button .courseName{display:block!important;font:1000 17px/1.05 "Arial Black","Yu Gothic UI",sans-serif!important;letter-spacing:.035em!important;color:inherit!important;}
.coursePickerGrid button.active .courseMode{opacity:.72!important;}
@media (max-width:720px){
  .coursePickerGrid button{min-height:66px!important;gap:4px!important;padding:8px 6px!important;}
  .coursePickerGrid button .courseMode{font-size:8px!important;}
  .coursePickerGrid button .courseName{font-size:15px!important;}
}

/* CONTROLS > CONTROLLER: final mobile rule. Height is also enforced by JS from actual rendered width. */
@media (max-width:820px){
  #pcControlsOverlay .controllerGuideArea{display:block!important;}
  #pcControlsOverlay .controllerSvgWrap{
    position:relative!important;
    display:block!important;
    width:min(100%,560px)!important;
    max-width:100%!important;
    aspect-ratio:800 / 470!important;
    margin:0 auto 8px!important;
    padding:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    flex:0 0 auto!important;
  }
  #pcControlsOverlay .controllerSvgWrap > svg.controllerSvg{
    position:absolute!important;
    inset:0!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    object-fit:contain!important;
    transform:none!important;
  }
}

<style id="courseTwoLineHardFixV1311">
/* v1.3.13 hard fix: onlineRenderLobby must preserve the two-line course button DOM. */
.coursePickerGrid button .courseStatus{position:absolute!important;top:6px!important;right:7px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:14px!important;padding:2px 5px!important;border:1px solid rgba(255,255,255,.20)!important;border-radius:999px!important;background:rgba(0,0,0,.24)!important;color:inherit!important;font:900 6.5px/1 ui-monospace,Consolas,monospace!important;letter-spacing:.06em!important;opacity:.72!important;pointer-events:none!important}
.coursePickerGrid button .courseStatus[hidden]{display:none!important}
.coursePickerGrid button .courseMode{order:1!important}
.coursePickerGrid button .courseName{order:2!important}
.coursePickerGrid button .courseStatus{order:3!important}
@media(max-width:720px){.coursePickerGrid button .courseStatus{top:4px!important;right:5px!important;font-size:6px!important;padding:2px 4px!important}}

