/* Reset suave */
*{ box-sizing: border-box; }
html, body { height: 100%; }
body{
  margin: 0;
  font-family: var(--font);
  color: var(--texto);
  background: linear-gradient(180deg, var(--grad-start), var(--grad-mid), var(--grad-end));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* App shell */
#app{
  position: relative;
  width: 100%;
  height: 100%;
  padding: env(safe-area-inset-top) 16px env(safe-area-inset-bottom);
  transform: none !important;
}

/* Helpers */
.centered{
  min-height: 100%;
  display: grid;
  place-items: center;
  text-align: center;
}
.hidden{ display: none !important; }
.visually-hidden{
  position:absolute!important; height:1px;width:1px;
  clip:rect(1px,1px,1px,1px); white-space:nowrap;
}