/* Moldura responsiva compartilhada pelos aplicativos do AppHub.
   O conteudo funcional usa toda a viewport; limites locais continuam validos
   para leitura, formularios e dialogos. */
:root {
  --app-viewport-gutter: clamp(1rem, 2vw, 3rem);
}

html,
body {
  width: 100%;
  min-width: 320px;
  min-height: 100%;
}

body {
  min-height: 100dvh;
}

.app-viewport-frame {
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  padding-inline: var(--app-viewport-gutter) !important;
}

@media (max-width: 640px) {
  :root {
    --app-viewport-gutter: 1rem;
  }
}