@charset "UTF-8"; 

/* Tema oscuro (mi favorito) */
@media (prefers-color-scheme: dark) {
  body { background-color: #000000; color: #f0f6f0; }
  a { color: #7df9ff; }
  code { color: #ff7f50; }
}

/* Tema claro (intento que no te deje ciego) */
@media (prefers-color-scheme: light) {
  body { background-color: #f0f6f0; color: #222323; }
  a { color: #0000cd; }
  code { color: #800000; }
}

/* Tema para imprimir (negro sobre blanco) */
@media print {
  body { background-color: #ffffff !important; color: #000000 !important; }
  a { color: #000000 !important; }
  code { color: #000000 !important; }
  pre { page-break-inside: avoid; }
  .header { page-break-after: avoid; }
}

/* El meollo del asunto (la parte que tiendo a retocar una y otra vez) */
body {
  font-family: "Noto Serif", serif; font-size: 110%; font-variant-numeric: oldstyle-nums; font-size-adjust: 0.535;
  line-height: 175%; margin: 40px auto; max-width: 70ch; padding: 0 10px; overflow-wrap: break-word;
}
code { font-family: "Cascadia Code", monospace, serif; font-size: 90%; font-variant-numeric: slashed-zero; line-height: 175%; }
pre {
  font-family: "Cascadia Code", monospace, serif; font-size: 90%; line-height: 110%; white-space: pre; word-wrap: break-word;
  display: inline flow-root; float: left; margin: 0; padding: 0 15px 0 0;
}    
nav { text-align: right; }
a { text-decoration: none;}
a:hover { text-decoration: underline; }
p { margin-block: 1lh; }

/* Clases personalizadas (no, no ese tipo de clases) */
.post { padding: 1% 0 0 0; }
.title { font-size: 120%; font-weight: bold; }
.smallprint { font-size: 80%; line-height: 150%; }
.banner { display: block; float: none; padding: 0; }