:root {
  color-scheme: dark;
  background: #050505;
}

* {
  box-sizing: border-box;
}

html {
  background: #050505;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background:
    radial-gradient(circle at top, rgba(104, 8, 13, 0.24), transparent 34rem),
    #050505;
}

.carta {
  display: grid;
  gap: 18px;
  width: min(100%, 900px);
  padding: 18px;
  margin: 0 auto;
}

.pagina {
  margin: 0;
  overflow: hidden;
  background: #090909;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.48);
}

.pagina img {
  display: block;
  width: 100%;
  height: auto;
}

@media (max-width: 600px) {
  .carta {
    gap: 4px;
    width: 100%;
    padding: 0;
  }

  .pagina {
    box-shadow: none;
  }
}

@media print {
  body {
    background: white;
  }

  .carta {
    display: block;
    width: 100%;
    padding: 0;
  }

  .pagina {
    break-after: page;
    box-shadow: none;
  }
}