:root {
  --papel: #efebe2;
  --hoja: #faf7f0;
  --tinta: #1b1a18;
  --tenue: #5f5a51;
  --filete: #1b1a18;
  --enlace: #24459f;
}
@media (prefers-color-scheme: dark) {
  :root {
    --papel: #1d1c1a;
    --hoja: #262522;
    --tinta: #ece7dc;
    --tenue: #b3ab9d;
    --filete: #ece7dc;
    --enlace: #9db4f0;
  }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--papel);
  color: var(--tinta);
  font: 17px/1.6 Georgia, "Times New Roman", serif;
}
main {
  max-width: 760px;
  margin: 0 auto;
  padding: 28px 16px 64px;
}
.volanta {
  font: 700 12px/1.2 "Segoe UI", Roboto, Arial, sans-serif;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--tenue);
  margin: 0 0 6px;
}
h1 {
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 10px;
}
.filete {
  border: 0;
  border-top: 3px solid var(--filete);
  border-bottom: 1px solid var(--filete);
  height: 6px;
  margin: 14px 0 22px;
}
h2 {
  font-size: 22px;
  margin: 34px 0 8px;
}
h3 {
  font-size: 18px;
  margin: 22px 0 6px;
}
p, li { margin: 0 0 12px; }
ul { padding-left: 22px; }
a { color: var(--enlace); }
.fecha { color: var(--tenue); font-style: italic; }
.caja {
  background: var(--hoja);
  border: 1px solid var(--filete);
  padding: 14px 18px;
  margin: 18px 0;
}
.juegos { list-style: none; padding: 0; }
.juegos li { border-bottom: 1px solid var(--tenue); padding: 12px 0; }
footer {
  margin-top: 48px;
  padding-top: 14px;
  border-top: 1px solid var(--filete);
  font: 14px/1.5 "Segoe UI", Roboto, Arial, sans-serif;
  color: var(--tenue);
}