/* Mobile match composition. Desktop and all physics dimensions stay unchanged. */
body.touch.playing main{
 padding:env(safe-area-inset-top) max(4px,env(safe-area-inset-right)) max(4px,env(safe-area-inset-bottom)) max(4px,env(safe-area-inset-left));
 gap:0;max-width:none;
}
body.touch #match,body.touch:not(.joystick-mode) #match,body.touch.joystick-mode #match{
 display:block;position:relative;flex:1;min-height:0;min-width:0;width:100%;
}
body.touch #stage,body.touch:not(.joystick-mode) #stage,body.touch.joystick-mode #stage{
 position:absolute;inset:0;display:block;width:100%;height:100%;min-width:0;min-height:0;
}
body.touch #courtAssembly{
 position:relative;display:flex;align-items:flex-start;flex:none;transform-origin:0 0;
}
body.touch #courtAssembly canvas{
 flex:none;max-width:none;max-height:none;margin:0;position:relative;z-index:1;
}
body.touch #matchSidebar{
 position:absolute;right:0;top:0;width:44px;z-index:20;
 display:flex;flex-direction:column;gap:4px;pointer-events:none;
}
body.touch #match .bar{
 position:static;display:flex;flex-direction:column;align-items:stretch;gap:4px;
 pointer-events:none;width:100%;
}
body.touch #match .bar button,body.touch #tutorialReset{
 pointer-events:auto;width:100%;min-height:44px;padding:5px 2px;
 font-size:10px;line-height:1.1;overflow-wrap:anywhere;opacity:.72;box-shadow:none;
}
body.touch #match .bar #fullscreen{font-size:18px}
body.touch #match .bar button:hover,body.touch #match .bar button:focus-visible{opacity:1}
body.touch #connection:not([hidden]){
 position:absolute;top:142px;right:0;left:auto;width:min(180px,65vw);
 pointer-events:none;font-size:11px;
}
body.touch #mobileMatchInfo:not([hidden]){
 position:absolute;inset:0 auto auto 0;width:var(--court-width);height:var(--court-height);
 display:block;margin:0;padding:0;border:0;z-index:2;pointer-events:none;
 color:#fff2d6;opacity:.48;text-shadow:0 1px 2px #102c27;
}
body.touch #mobileMatchInfo>div{
 position:absolute;top:8%;width:38%;min-width:0;text-align:center;
}
body.touch #mobileMatchInfo [data-side=far]{left:5%}
body.touch #mobileMatchInfo [data-side=near]{right:5%}
body.touch #mobileMatchInfo strong{
 color:#fff2d6;font-size:clamp(9px,calc(var(--court-width) * .035),14px);line-height:1.3;
}
body.touch #mobileMatchInfo span{
 color:#e8eedb;font-size:clamp(8px,calc(var(--court-width) * .031),12px);line-height:1.4;
}
body.touch #mobileMatchInfo img{width:1.4em;height:1em;margin-right:3px}
body.touch #courtAssembly[data-orientation=portrait] #mobileMatchInfo>div{width:82%;left:9%;right:auto}
body.touch #courtAssembly[data-orientation=portrait] #mobileMatchInfo [data-side=near]{top:auto;bottom:8%}
body.touch #tournamentStand{
 position:relative;flex:none;width:var(--stand-width);height:var(--court-height);
 overflow:hidden;pointer-events:none;border:1px solid #a2956b88;border-left:0;
 border-radius:0 9px 9px 0;color:#f0dfb6;
 background:
  repeating-linear-gradient(90deg,transparent 0 10%,#d4c69b22 10% 12%,#102a2c33 12% 16%),
  linear-gradient(90deg,#435c4a,#263e38 65%,#152f2f);
 box-shadow:inset -3px 0 0 #102b2a66;
}
body.touch #tournamentStand::before,body.touch #tournamentStand::after{
 content:'';position:absolute;left:7%;right:7%;height:1px;background:#b6b08288;
}
body.touch #tournamentStand::before{top:3%}body.touch #tournamentStand::after{bottom:3%}
body.touch #tournamentStand #matchTournament{
 position:absolute;inset:28% 4% 6%;display:flex;flex-direction:row;align-items:center;justify-content:center;
 writing-mode:vertical-rl;text-orientation:mixed;gap:8px;margin:0;padding:6px 0;
 min-height:0;min-width:0;border:1px solid #adab7899;border-radius:4px;
 background:#16352edd;color:#f5e7c7;text-shadow:0 1px #122b25;
}
body.touch #tournamentStand #matchTournament strong{
 font-size:clamp(9px,calc(var(--court-width) * .035),14px);line-height:1.15;text-align:center;overflow-wrap:anywhere;
}
body.touch #tournamentStand #matchTournament .country-flag{width:75%;height:auto;max-height:13%;object-fit:contain;flex-shrink:0}
body.touch #touch,body.touch:not(.joystick-mode) #touch{display:contents}
body.touch #touch .pair,body.touch:not(.joystick-mode) #touch .pair{display:contents}
body.touch #tutorialTools{
 position:absolute;right:auto;transform:translate(-50%,-50%);max-width:85%;margin:0;z-index:4;
}
body.touch #notice{top:50%;left:35%;transform:translate(-50%,-50%);z-index:4}
