/* De Zarceño para el mundo (D-121). Letra nunca bajo 1rem; tope 4 KB.
   GRANATE (el director, 03-10): solo la cargan /mundo y /colaborar, así que
   redefinir aquí --casa* no toca ninguna otra pantalla. */
:root { --casa: #7B1E2E; --casa-hondo: #5A1521; --casa-tenue: #D9A9B2; --casa-suave: #F7E8EB; }
main { max-width: 34rem; margin: 0 auto; padding: var(--s-4) var(--s-3) var(--s-6); display: grid; gap: var(--s-4); }
h1 { font-size: 1.6rem; margin: 0; }
.sub { margin: calc(-1 * var(--s-3)) 0 0; color: var(--tinta-suave); font-size: 1.05rem; }
/* D-129: tarjetas sobre gris cálido; el color (--sec), en mundo-fichas.css. */
[data-pantalla="mundo"] body { background: #E6E0D6; }
.pieza { background: var(--papel); border-radius: 18px; overflow: hidden; display: grid; box-shadow: 0 1px 2px rgb(31 29 26 / .1), 0 10px 28px rgb(31 29 26 / .12); }
.pieza + .pieza { margin-top: 40px; }
.portada { position: relative; margin: 0; }
.cuadro { display: block; width: 100%; height: auto; background: var(--linea); }
.credito-foto { margin: 0; padding: var(--s-2) var(--s-4); color: var(--tinta-suave); }
.credito-foto a { color: inherit; }
.sello { position: absolute; left: var(--s-4); top: var(--s-4); margin: 0; display: inline-flex; align-items: center; gap: var(--s-2); padding: 6px 12px; border-radius: 999px; background: var(--sec); color: #fff; font-weight: 800; font-size: 1rem; letter-spacing: .08em; text-transform: uppercase; }
.banda { background: var(--sec); color: var(--papel); min-height: 200px; display: grid; justify-items: end; align-items: end; padding: var(--s-4) var(--s-5); box-sizing: border-box; }
.disco { line-height: 0; }
.cuerpo { padding: var(--s-5) var(--s-4); display: grid; gap: var(--s-4); }
.semana { margin: 0 0 calc(-1 * var(--s-2)); color: var(--sec); font-weight: 800; font-size: 1rem; letter-spacing: .08em; text-transform: uppercase; }
.ficha h2 { margin: 0; font-size: 1.75rem; line-height: 1.1; }
.quien { margin: var(--s-1) 0 0; color: var(--tinta-suave); font-size: 1rem; }
.autor { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3) 0; border-block: 1px solid var(--linea); }
.autor p { margin: 0; display: grid; }
.autor b { font-size: 1.05rem; }
.autor p span { color: var(--tinta-suave); font-size: 1rem; }
.inicial { flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--sec); color: #fff; display: grid; place-items: center; font-weight: 800; font-size: 1.15rem; }
.explica p { margin: 0 0 var(--s-3); font-size: 1.1rem; line-height: 1.6; overflow-wrap: anywhere; }
.explica > :last-child { margin-bottom: 0; }
.cita { margin: 0 0 var(--s-3); color: var(--sec); font-style: italic; font-size: 1.35rem; line-height: 1.35; }
.acciones { margin: 0; display: flex; flex-wrap: wrap; gap: var(--s-2); }
.acciones .btn { flex: 1 1 140px; display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2); text-align: center; }
.pieza .btn { color: var(--tinta); border-color: #CFC9BF; }
.pieza .btn-primary { background: var(--sec); border-color: var(--sec); color: #fff; }
.btn svg { flex: none; }
.t-archivo { font-size: 1.3rem; margin: var(--s-3) 0 0; }
.archivo { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-2); }
.archivo a { display: grid; gap: 2px; padding: var(--s-3); background: var(--papel); border: 1px solid var(--linea); border-radius: var(--r-md); color: var(--tinta); text-decoration: none; }
.archivo .cuando { font-size: 1rem; color: var(--tinta-suave); }
.archivo b { font-size: 1.05rem; }
.vacio { font-size: 1.15rem; }
.presenta figcaption { padding: var(--s-2) var(--s-4) 0; font-size: 1rem; color: var(--tinta-suave); }
.presenta .explica { padding: var(--s-2) var(--s-4) var(--s-4); }
.presenta h2 { font-size: 1.3rem; margin: var(--s-2) 0 var(--s-1); }
.presenta h3 { font-size: 1.1rem; margin: var(--s-2) 0 var(--s-1); color: var(--sec); }
.invita { margin: 0; padding: var(--s-3) var(--s-4); background: var(--casa-suave); border-radius: var(--r-md); font-size: 1.1rem; }
.invita a { color: var(--casa); font-weight: 700; }