@media (hover:none) and (pointer:coarse) and (orientation:portrait){
  #onlineOverlay.show{
    align-items:flex-start!important;
    justify-content:flex-start!important;
    overflow:hidden!important;
  }
  #onlineOverlay.show .onlinePanel{
    width:100vw!important;
    height:100dvh!important;
    max-height:none!important;
    margin:0!important;
    padding:8px 8px calc(12px + env(safe-area-inset-bottom))!important;
    box-sizing:border-box!important;
    border-radius:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
  }
  #onlineOverlay.show .onlineTitle{
    font-size:16px!important;
    line-height:1!important;
  }
  #onlineOverlay.show .onlineSub{
    margin-top:4px!important;
    font-size:7px!important;
    line-height:1.25!important;
  }
  #onlineOverlay.show .onlineLobbyLine{
    margin-top:6px!important;
    padding:5px 7px!important;
    font-size:8px!important;
  }

  /* No tabs and no lobby DOM-moving JS. Original DOM is preserved. */
  #onlineOverlay.show .onlineGrid{
    display:flex!important;
    flex-direction:column!important;
    gap:0!important;
    margin-top:6px!important;
    overflow:visible!important;
    grid-template-columns:none!important;
    grid-template-rows:none!important;
  }
  #onlineOverlay.show .onlineGrid>.onlineBox{
    display:contents!important;
  }

  #onlineOverlay.show .onlineGrid>.onlineBox:first-child>.onlineBoxTitle{
    order:10;
    margin:0 0 4px!important;
    font-size:9px!important;
  }
  #onlineOverlay.show #onlineLobbyMap{
    order:20;
    display:block!important;
    width:100%!important;
    height:clamp(185px,25dvh,220px)!important;
    min-height:185px!important;
    max-height:220px!important;
    box-sizing:border-box!important;
  }

  #onlineOverlay.show .onlineGrid>.onlineBox:nth-child(2)>.onlineBoxTitle{
    order:30;
    margin:7px 0 4px!important;
    font-size:9px!important;
  }
  #onlineOverlay.show #onlineChatLog{
    order:40;
    height:clamp(115px,17dvh,150px)!important;
    min-height:115px!important;
    max-height:150px!important;
    padding:6px!important;
    box-sizing:border-box!important;
    overflow-y:auto!important;
  }
  #onlineOverlay.show .chatRow{
    order:50;
    margin-top:4px!important;
    padding-left:36px!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:4px!important;
  }
  #onlineOverlay.show .chatRow input{
    padding:8px!important;
    font-size:11px!important;
  }
  #onlineOverlay.show .chatRow button{
    padding:8px 10px!important;
    font-size:9px!important;
  }

  #onlineOverlay.show .onlineControlDock{
    order:60;
    margin-top:8px!important;
    padding-top:8px!important;
  }
  #onlineOverlay.show .onlineMainAction{
    margin-top:0!important;
    gap:5px!important;
    grid-template-columns:minmax(0,1fr) auto!important;
  }
  #onlineOverlay.show .onlineMainAction button{
    padding:9px 8px!important;
    font-size:9px!important;
  }
  #onlineOverlay.show #onlineStatus{
    margin-top:5px!important;
    min-height:28px!important;
    padding:6px!important;
    font-size:8px!important;
  }

  #onlineOverlay.show #onlineMemberList{
    order:70;
    max-height:none!important;
    overflow:visible!important;
    margin-top:10px!important;
  }
  #onlineOverlay.show .battleRankWrap{
    order:80;
    margin-top:10px!important;
  }
  #onlineOverlay.show #onlineBattleSetup{
    order:90;
    margin-top:10px!important;
  }
}