tamaños: tabletas centradas y el boton de No molestar fuera del menu

Probado en el emulador a 360x540, 412 (Pixel 9), 800dp (tableta) y con la
letra al 130%: sin desbordes. Arreglos:
- en pantallas de 700dp o mas, el contenido y la hoja del menu a 720/640px
  centrados; a 800dp todo se estiraba
- con el menu abierto se esconde el boton de No molestar, que se montaba
  encima de la X de la hoja

src/client/assets/styles/mobile_ux.css

@@ -586,3 +586,14 @@ body > .welcome-banner { order: -1; margin-top: 10px !important; }
 .menu-sheet .launcher .ln-group, .menu-sheet .launcher .ln-group + .ln-group { margin: 0 !important; min-width: 0; }
 .menu-sheet .launcher .ln-group:has(.ln-app:nth-child(3)) { grid-column: 1 / -1; }
 .menu-sheet .launcher .ln-group:not(:has(.ln-app:nth-child(3))) .ln-grid { grid-template-columns: 1fr 1fr !important; }
+/* con el menu abierto, el boton de No molestar no se monta encima de la hoja */
+body:has(#oasis-menu-toggle:checked) form.oasis-phone-state { display: none !important; }
+
+/* ---------- tabletas y pantallas anchas ---------- */
+/* a 800dp todo se estiraba: lineas larguisimas y la hoja del menu con cinco iconos
+   repartidos en 800px. Contenido a 720px como mucho, centrado; la hoja, igual */
+@media (min-width: 700px) {
+  body .main-content { max-width: 720px; margin-left: auto !important; margin-right: auto !important; width: 100%; box-sizing: border-box; }
+  body > .welcome-banner { max-width: 692px; margin-left: auto !important; margin-right: auto !important; }
+  .oasis-bottombar .menu-toggle:checked ~ div.menu-sheet { left: 50%; right: auto; width: 640px; margin-left: -320px; }
+}