/* ══ Cáscara v16 adaptativa (25-sep-2026, Mathias: «cuando cierro el menú lateral
   no es adaptativa… debe ser 100 % adaptativa en todas las secciones») ══
   Al contraer la barra (v16-barra.js pone .nav.ttaplg) la barra mide 74 px, pero la
   columna del grid seguía en 260 px en las páginas de v16_base (herramientas del
   máster, calendario, cuenta…): quedaban 186 px muertos a la izquierda y el
   contenido no crecía. En la comunidad (v16.html) el JS escribía un ancho en px
   fijos, que tampoco sigue a la ventana. Aquí la columna del menú se encoge con la
   barra y el contenido toma SIEMPRE lo que queda (minmax(0,1fr)), en cualquier ancho.
   Se engancha desde _material_symbols.html: va en todas las páginas y no hace nada
   donde no hay barra contraída. Congelado por tests/academy/test_v16_adaptativa.py. */
@media (min-width: 761px) {
  /* Páginas sobre v16_base.html (body.v16s): menú + contenido. */
  body.v16s:not(.tta-pagar-cripto) .app:has(> .nav.ttaplg) {
    grid-template-columns: 74px minmax(0, 1fr) !important;
  }
  /* Comunidad v16 (v16.html) sin carril derecho (modo aula). */
  body.aula:not(.v16s) .app:has(> .nav.ttaplg) {
    grid-template-columns: 74px minmax(0, 1fr) !important;
  }
}
@media (min-width: 1181px) {
  /* Comunidad v16 con carril derecho: el carril conserva sus 340 px y el centro es fluido.
     Por debajo de 1181 px la demo esconde el carril, así que ahí manda la regla de dos columnas. */
  body:not(.v16s):not(.aula) .app:has(> .nav.ttaplg) {
    grid-template-columns: 74px minmax(0, 1fr) 340px !important;
  }
}
@media (min-width: 761px) and (max-width: 1180px) {
  body:not(.v16s):not(.aula) .app:has(> .nav.ttaplg) {
    grid-template-columns: 74px minmax(0, 1fr) !important;
  }
}

/* ── §8G (1-oct-2026): celular primero, para todas las cáscaras ─────────────────────────
   1) Un botón nunca selecciona texto con el toque largo.
   2) El modal de acceso/registro va a pantalla completa desde ARRIBA: los campos quedan en
      la mitad alta y el teclado no los tapa; la × la pone tta-v16-adaptativa.js. */
button,.btn,[role="button"],.nv,.tta-tab-btn{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
@media (max-width: 599px) {
  #tta-auth-modal{align-items:flex-start!important;justify-content:stretch!important;padding:0!important;overflow-y:auto;-webkit-overflow-scrolling:touch}
  #tta-auth-modal .tta-auth-card{position:relative;min-width:0;max-width:none;width:100%;min-height:100dvh;border-radius:0;border:0;box-shadow:none;padding:max(56px,calc(env(safe-area-inset-top) + 56px)) 18px calc(28px + env(safe-area-inset-bottom))}
  #tta-auth-modal .tta-auth-card input,#tta-auth-modal .tta-auth-card .btn{min-height:44px}
  .tta-auth-x{position:absolute;top:max(10px,env(safe-area-inset-top));right:10px;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#fff;font-size:24px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:2}
}
@media (min-width: 600px) { .tta-auth-x{display:none} }