/* Shell layout — top nav (desktop+mobile), bottom nav (mobile), main */

html, body {
  margin: 0;
  padding: 0;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: var(--font-size-md);
  line-height: var(--line-height-base);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  /* Bloquea pull-to-refresh nativo (Chrome Android) en toda la PWA. La regla
     condicional `:has(dialog[open])` de modal.css llegaba tarde cuando el
     swipe-down empezaba en el mismo frame que el dialog se montaba. `contain`
     no basta — solo `none` impide la recarga al deslizar en tope sin scroll. */
  overscroll-behavior-y: none;
}

#view {
  box-sizing: border-box;
  padding: var(--space-md);
  /* Altura mínima = viewport - topnav. En desktop alcanza. En móvil
     hay que restar también el bottom nav (48px + safe-area) para que
     vistas con min-height:100% (Torre, Finanzas) no generen scroll
     fantasma que hace ver la nav "más abajo". border-box hace que el
     padding de #view se cuente dentro del min-height (sin esto sumaba
     32px extra y .torre-view tapaba el nav inferior). */
  min-height: calc(100vh - var(--topnav-height));
  max-width: 1400px;
  margin: 0 auto;
}
@media (max-width: 900px) {
  #view {
    min-height: calc(100vh - var(--topnav-height) - 48px - env(safe-area-inset-bottom, 0));
  }
}

/* View transitions (progressive enhancement) */
::view-transition-old(root), ::view-transition-new(root) {
  animation-duration: var(--transition-med);
}
