/* Keep ordinary page copy selectable; only the game surface and game controls opt out. */
canvas{
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
  touch-action:none;
}
button,:is(#touch-controls,.room-touch,.touch,#touch,[data-key],[data-room],.touch-controls button){
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
  touch-action:none;
  -webkit-tap-highlight-color:transparent;
}
button{min-height:44px}

.touch-input-help{display:none}
@media(pointer:coarse){.desktop-input-help{display:none}.touch-input-help{display:inline}}

/* Use one thumb for movement and the other for the remaining game actions. */
.touch-joystick{display:none!important}.joystick-actions{display:contents!important}
@media(pointer:coarse),(max-width:800px){
 [data-joystick-direction]{display:none!important}
 :is(#touch,#touch-controls,.touch,.room-touch).joystick-layout{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:nowrap}
 :is(#touch,#touch-controls,.touch,.room-touch) .touch-joystick{display:flex!important;flex:0 0 112px;flex-direction:column;align-items:center;gap:5px;pointer-events:auto;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:none}
 :is(#touch,#touch-controls,.touch,.room-touch) .joystick-base{display:block;position:relative;width:112px;height:112px;flex:none;border-radius:50%;border:2px solid #8a969f;background:radial-gradient(circle,#46515a,#222b32);box-shadow:inset 0 3px 10px #0008,0 2px 3px #0005;touch-action:none}
 :is(#touch,#touch-controls,.touch,.room-touch) .joystick-knob{display:block;position:absolute;left:50%;top:50%;width:46px;height:46px;border-radius:50%;background:linear-gradient(#e5e7e8,#9aa4ac);border:2px solid #e9edef;box-shadow:0 4px 7px #0008;transform:translate(-50%,-50%);pointer-events:none}
 :is(#touch,#touch-controls,.touch,.room-touch) .joystick-caption{display:block;color:inherit;font:600 11px/1.2 system-ui,sans-serif;text-align:center}
 :is(#touch,#touch-controls,.touch,.room-touch) .joystick-actions{display:grid!important;grid-template-columns:repeat(var(--joystick-action-columns,3),minmax(0,1fr));gap:6px;flex:1;min-width:0;max-width:300px;pointer-events:auto}
 :is(#touch,#touch-controls,.touch,.room-touch) .joystick-actions button{width:100%;min-width:0;max-width:none;min-height:44px;height:auto;padding:7px 4px;font:600 10px/1.25 system-ui,sans-serif;white-space:normal}
 #touch.joystick-layout>div:not(.touch-joystick):not(.joystick-actions),.touch.joystick-layout>div:not(.touch-joystick):not(.joystick-actions){display:none}
 .joystick-base:focus-visible{outline:3px solid #ffcf25;outline-offset:4px}
 .touch-input-help{display:inline}.desktop-input-help{display:none}
}
@media(max-height:500px) and (pointer:coarse){:is(#touch,#touch-controls,.touch,.room-touch) .touch-joystick{flex-basis:84px}:is(#touch,#touch-controls,.touch,.room-touch) .joystick-base{width:84px;height:84px}}

@media(pointer:coarse),(max-width:800px){#road~.dash{bottom:165px}}