/* /el-sueno-de-eladio/ — el cuaderno de la bodega como libro que se hojea.
   Todo cuelga de .le para no chocar con styles.css. Las páginas se maquetan a
   tamaño fijo (--le-pw × --le-ph) y el libro entero se escala para caber. */
.le{
  --le-papel:#fbf8f2; --le-papel-2:#f3ede2; --le-tinta:#1f1a17; --le-tinta-2:#5b524b; --le-tenue:#8d837a;
  --le-filete:#ddd5c8; --le-vino:#6e2a33; --le-oro:#a8853f; --le-tapa:#3a241f; --le-tapa-tinta:#e9dcc6;
  --le-tit:"Playfair Display",Georgia,serif; --le-txt:"Newsreader",Georgia,serif; --le-dat:"Inter",system-ui,sans-serif;
  --le-pw:480px; --le-ph:680px; --le-giro:.9s;
  position:relative;color:var(--le-tinta);font-family:var(--le-txt)
}
.le h1,.le h2,.le h3,.le p,.le figure,.le dl,.le dd,.le dt,.le ol,.le ul,.le li,.le blockquote{margin:0;padding:0;font-weight:inherit;letter-spacing:normal;text-transform:none;color:inherit}
.le img{display:block;max-width:100%}
.le a{text-decoration:none}

/* ---------- la mesa ---------- */
.le-mesa{position:relative;height:calc(100svh - var(--header-h, 112px));min-height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;overflow:hidden;
  background:#2b2a29}
.le-mesa::before{content:"";position:absolute;inset:0;opacity:.06;pointer-events:none;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='260' height='260'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' seed='5'/></filter><rect width='260' height='260' filter='url(%23n)'/></svg>")}
@media (max-width:1000px){ .le-mesa{height:calc(100svh - var(--header-h-m, 82px) - 48px)} }
.le-escena{position:relative;perspective:2600px;touch-action:pan-y}
.le-libro{position:absolute;left:0;top:0;transform-origin:0 0;transform-style:preserve-3d}
.le-lomo{position:absolute;top:0;height:var(--le-ph);transform-style:preserve-3d;transition:transform var(--le-giro) cubic-bezier(.45,.05,.25,1)}
.le-doble .le-lomo{width:calc(var(--le-pw) * 2)}
.le-simple .le-lomo{width:var(--le-pw)}
.le-sombra{display:none;position:absolute;top:2%;bottom:-2%;left:var(--le-pw);width:var(--le-pw);border-radius:6px;
  box-shadow:0 30px 60px rgba(0,0,0,.55),0 8px 18px rgba(0,0,0,.35);transition:left var(--le-giro) cubic-bezier(.45,.05,.25,1),width var(--le-giro) cubic-bezier(.45,.05,.25,1)}
.le-doble.le-abierto .le-sombra{left:0;width:calc(var(--le-pw) * 2)}
.le-doble.le-atras .le-sombra,.le-simple .le-sombra{left:0}

/* ---------- hojas ---------- */
.le-hoja{position:absolute;top:0;width:var(--le-pw);height:var(--le-ph);transform-style:preserve-3d;transform-origin:0 50%;
  transition:transform var(--le-giro) cubic-bezier(.45,.05,.25,1)}
.le-doble .le-hoja{left:var(--le-pw)}
.le-simple .le-hoja{left:0}
.le-hoja.le-pasada{transform:rotateY(-180deg)}
.le-hoja.le-oculta{visibility:hidden}
.le-cara{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;background:var(--le-papel)}
.le-cara.le-dorso{transform:rotateY(180deg)}
.le-cara::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;z-index:5}
.le-hoja.le-girando .le-frente::after{background:linear-gradient(90deg,rgba(0,0,0,.28),rgba(0,0,0,0) 60%);animation:le-sombra var(--le-giro) ease}
.le-hoja.le-girando .le-dorso::after{background:linear-gradient(270deg,rgba(0,0,0,.28),rgba(0,0,0,0) 60%);animation:le-sombra var(--le-giro) ease}
@keyframes le-sombra{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.le-reverso{background:var(--le-papel-2)}

/* ---------- página ---------- */
.le-pag{position:absolute;inset:0;background:var(--le-papel)}
.le-pag::before{content:"";position:absolute;top:0;bottom:0;width:110px;pointer-events:none;z-index:3}
.le-pag.le-der::before{left:0;background:linear-gradient(90deg,rgba(38,24,14,.42) 0,rgba(38,24,14,.20) 5px,rgba(38,24,14,.07) 14px,rgba(255,255,255,.16) 26px,rgba(255,255,255,0) 44px,rgba(38,24,14,.05) 70px,rgba(38,24,14,0) 110px)}
.le-pag.le-izq::before{right:0;background:linear-gradient(270deg,rgba(38,24,14,.42) 0,rgba(38,24,14,.20) 5px,rgba(38,24,14,.07) 14px,rgba(255,255,255,.16) 26px,rgba(255,255,255,0) 44px,rgba(38,24,14,.05) 70px,rgba(38,24,14,0) 110px)}
.le-pag::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(0,0,0,.03))}
.le-pag.le-der::after{box-shadow:inset -1px 0 0 rgba(0,0,0,.08)}
.le-pag.le-izq::after{box-shadow:inset 1px 0 0 rgba(0,0,0,.08)}
.le-contenido{position:absolute;inset:0;padding:54px 50px 58px;display:flex;flex-direction:column;overflow:hidden}
.le-pag.le-izq .le-contenido{padding-right:58px}
.le-pag.le-der .le-contenido{padding-left:58px}
.le-folio{position:absolute;bottom:24px;font-family:var(--le-dat);font-size:10px;letter-spacing:.08em;color:var(--le-tenue);font-variant-numeric:tabular-nums}
.le-pag.le-der .le-folio{right:34px} .le-pag.le-izq .le-folio{left:34px}
.le .le-rotulo{font-family:var(--le-tit);font-weight:400;font-size:21px;letter-spacing:.06em;text-transform:uppercase;line-height:1.2;text-wrap:balance}
.le .le-bajo{font-family:var(--le-dat);font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--le-oro);margin:.45rem 0 26px}
.le-texto{font-size:14.5px;line-height:1.56}
.le .le-texto p{text-indent:1.5em;text-wrap:pretty;hyphens:auto}
.le .le-texto p + p{margin-top:.55em}
.le .le-texto p.le-sin,.le .le-texto p.le-sigue{text-indent:0}
.le-compacta .le-texto{font-size:13.5px;line-height:1.5}
.le-compacta .le-ficha div{padding:.28rem 0}

/* tapa */
.le-tapa{position:absolute;inset:0;background:var(--le-tapa);color:var(--le-tapa-tinta);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:70px 46px 56px;text-align:center}
.le-tapa::before{content:"";position:absolute;inset:0;opacity:.45;mix-blend-mode:overlay;pointer-events:none;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' seed='4'/></filter><rect width='300' height='300' filter='url(%23n)'/></svg>")}
.le-tapa::after{content:"";position:absolute;inset:18px 18px 18px 34px;border:1px solid rgba(201,162,90,.35);pointer-events:none}
.le-tapa{box-shadow:inset 0 0 60px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.06);background-image:linear-gradient(90deg,rgba(0,0,0,.45) 0,rgba(0,0,0,.15) 6px,rgba(0,0,0,0) 14px,rgba(0,0,0,.35) 19px,rgba(255,255,255,.07) 22px,rgba(0,0,0,0) 26px),radial-gradient(120% 90% at 30% 20%,rgba(255,255,255,.06),rgba(0,0,0,.18))}
.le-tapa.le-trasera{background-image:linear-gradient(270deg,rgba(0,0,0,.45) 0,rgba(0,0,0,.15) 6px,rgba(0,0,0,0) 14px,rgba(0,0,0,.35) 19px,rgba(255,255,255,.07) 22px,rgba(0,0,0,0) 26px),radial-gradient(120% 90% at 70% 20%,rgba(255,255,255,.06),rgba(0,0,0,.18))}
.le-tapa.le-trasera::after{inset:18px 34px 18px 18px}
.le-tapa img{width:150px;opacity:.95;filter:drop-shadow(0 1px 0 rgba(0,0,0,.4))}
.le .le-tapa small{display:block;font-family:var(--le-dat);font-size:9.5px;letter-spacing:.42em;text-transform:uppercase;color:#c7b493;margin-bottom:22px}
.le .le-tapa h1{font-family:var(--le-tit);font-weight:400;font-size:46px;line-height:1.06;color:#e6d3ae;text-shadow:0 -1px 0 rgba(0,0,0,.55),0 1px 0 rgba(255,255,255,.12);max-width:8.5em;margin:0 auto}
.le .le-tapa .le-tapa-sub{font-family:var(--le-tit);font-style:italic;color:#d9c39b;font-size:24px;margin-top:14px}
.le .le-tapa .le-ano{font-family:var(--le-tit);font-size:26px;color:#c9a25a;letter-spacing:.08em}
.le-tapa.le-trasera{justify-content:center;gap:22px}
.le .le-tapa.le-trasera p{font-family:var(--le-dat);font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:#a99878}

/* guardas */
.le-guarda{position:absolute;inset:0;background-color:#ead9c0;
  background-image:radial-gradient(circle at 25% 25%,rgba(110,42,51,.16) 2px,transparent 2.5px),radial-gradient(circle at 75% 75%,rgba(168,133,63,.22) 2px,transparent 2.5px);
  background-size:28px 28px}

/* portadilla */
.le-portadilla{align-items:center;justify-content:center;text-align:center}
.le .le-portadilla .le-ce{font-family:var(--le-dat);font-size:9.5px;letter-spacing:.4em;text-transform:uppercase;color:var(--le-oro)}
.le .le-portadilla h2{font-family:var(--le-tit);font-weight:400;font-size:44px;line-height:1.05;margin:22px 0}
.le .le-portadilla h2 i{display:block;font-size:34px;color:var(--le-vino)}
.le-portadilla .le-filete{width:60px;height:1px;background:var(--le-oro);margin:6px auto 18px}
.le .le-portadilla .le-sub{font-style:italic;color:var(--le-tinta-2);font-size:15px;line-height:1.5}
.le .le-portadilla .le-pie{position:absolute;bottom:60px;left:0;right:0;font-family:var(--le-dat);font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--le-tenue)}

/* láminas a sangre */
.le-lamina{position:absolute;inset:0;background:var(--le-papel-2)}
.le-lamina img{width:100%;height:100%;object-fit:cover}
.le .le-lamina figcaption{position:absolute;left:34px;right:34px;bottom:26px;font-family:var(--le-dat);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.45)}
.le-pag.le-der .le-lamina figcaption{text-align:right}
.le-retrato{background:#f6f0e5}
.le-retrato img{object-position:50% 18%}
.le .le-retrato figcaption{color:var(--le-tenue);text-shadow:none}

/* carta */
.le .le-lugar{font-family:var(--le-dat);font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--le-oro);margin-bottom:22px}
.le-carta .le-texto{font-size:14.6px;line-height:1.56}
.le-firma{margin-top:16px}
.le .le-firma .le-despedida{font-style:italic;font-size:15px}
.le-firma .le-rubrica{font-family:"Mrs Saint Delafield",cursive;font-size:58px;line-height:1;color:var(--le-vino);margin:6px 0 -4px -4px;transform:rotate(-4deg);transform-origin:left;
  display:inline-block;clip-path:inset(0 100% 0 0);transition:clip-path 1.8s cubic-bezier(.5,0,.3,1) .5s}
.le-visible .le-firma .le-rubrica{clip-path:inset(0 -10% 0 0)}
.le .le-firma .le-nombre{font-family:var(--le-tit);font-size:15px;margin-top:4px}
.le .le-firma .le-cargo{font-family:var(--le-dat);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--le-tenue);margin-top:3px}

/* hitos */
.le .le-hitos{list-style:none;display:grid;gap:12px;margin-top:20px}
.le .le-hitos li{display:grid;grid-template-columns:58px 1fr;gap:12px;padding-top:10px;border-top:1px solid var(--le-filete)}
.le-hitos b{font-family:var(--le-tit);font-weight:400;font-size:20px;line-height:1;color:var(--le-vino)}
.le .le-hitos h3{font-family:var(--le-tit);font-weight:500;font-size:14px;margin-bottom:2px;line-height:1.3}
.le .le-hitos p{font-size:13px;color:var(--le-tinta-2);line-height:1.45}

/* índice */
.le-indice{display:grid;gap:22px}
.le .le-indice h3{font-family:var(--le-dat);font-size:9.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--le-oro);margin-bottom:8px}
.le-indice ul{list-style:none}
.le .le-indice li{display:flex;align-items:baseline;gap:8px;padding:5px 0;font-family:var(--le-tit);font-size:15px;letter-spacing:.04em;text-transform:uppercase}
.le-indice li::after{content:"";flex:1;order:2;border-bottom:1px dotted var(--le-filete);transform:translateY(-4px)}
.le-indice li a{order:1;color:inherit}
.le-indice li a:hover,.le-indice li a:focus-visible{color:var(--le-vino);outline:none}
.le-indice li small{order:1;font-family:var(--le-txt);font-style:italic;text-transform:none;letter-spacing:0;color:var(--le-tenue);font-size:13px}
.le-indice li .le-num{order:3;font-family:var(--le-dat);font-size:10.5px;color:var(--le-tenue);font-variant-numeric:tabular-nums;letter-spacing:0}

/* ficha de vino */
.le .le-nota{margin-top:10px}
.le-nota::before{content:attr(data-titulo);display:block;font-family:var(--le-dat);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--le-oro);margin-bottom:3px}
.le .le-tienda{align-self:flex-start;margin-top:14px;font-family:var(--le-dat);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--le-vino);border-bottom:1px solid currentColor;padding-bottom:2px}
.le .le-ficha{margin-top:auto;padding-top:16px}
.le-ficha div{display:flex;gap:8px;padding:.36rem 0;border-top:1px solid var(--le-filete);font-family:var(--le-dat);font-size:11px;line-height:1.4}
.le-ficha div:last-child{border-bottom:1px solid var(--le-filete)}
.le .le-ficha dt{flex:0 0 92px;font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--le-tenue);padding-top:.15em}

/* bodegón: la botella sobre papel en relieve */
.le-bodegon{position:absolute;inset:0;background:#efe9df var(--le-relieve) center/cover;display:flex;align-items:center;justify-content:center}
.le-bodegon.le-oscuro{background-image:var(--le-relieve-oscuro);background-color:#3a2a22}
.le-bodegon::before{content:"";position:absolute;inset:0;background:radial-gradient(70% 55% at 60% 36%,rgba(255,255,255,.45),rgba(255,255,255,0) 70%)}
.le-bodegon.le-oscuro::before{background:radial-gradient(60% 50% at 55% 38%,rgba(255,226,180,.14),rgba(0,0,0,0) 70%)}
.le-bodegon img{position:relative;height:74%;width:auto;max-width:80%;object-fit:contain;filter:drop-shadow(16px 20px 18px rgba(40,26,14,.30)) drop-shadow(2px 3px 3px rgba(40,26,14,.25))}
.le .le-bodegon figcaption{position:absolute;left:0;right:0;bottom:26px;text-align:center;font-family:var(--le-dat);font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--le-tenue)}
.le .le-bodegon.le-oscuro figcaption{color:#b6a28a}

/* cierre, colofón y página de respeto */
.le-cierre{justify-content:center;text-align:center}
.le .le-cierre h2{font-family:var(--le-tit);font-weight:400;font-size:30px;line-height:1.15;text-wrap:balance}
.le .le-cierre p{font-size:15px;color:var(--le-tinta-2);margin:16px auto 0;max-width:30ch;line-height:1.5}
.le-botones{display:flex;flex-direction:column;gap:10px;align-items:center;margin-top:28px}
.le .le-boton{font-family:var(--le-dat);font-size:10px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;padding:13px 20px;border:1px solid var(--le-tinta);color:var(--le-tinta);min-width:230px;text-align:center}
.le .le-boton--lleno{background:var(--le-tapa);border-color:var(--le-tapa);color:var(--le-tapa-tinta)}
.le-colofon{justify-content:flex-end;font-family:var(--le-dat);font-size:10px;line-height:1.7;color:var(--le-tenue);letter-spacing:.04em}
.le-colofon img{width:110px;margin-bottom:22px;opacity:.85}
.le-colofon b{font-weight:500;color:var(--le-tinta-2)}
.le-ornamento{align-items:center;justify-content:center;color:var(--le-oro);font-family:var(--le-tit);font-size:22px;letter-spacing:.6em}
.le .le-continua .le-ficha{margin-top:6px}
.le .le-continua .le-hitos{margin-top:0}

/* ---------- mandos ---------- */
.le-mesa{gap:10px}
.le-mandos{position:relative;display:flex;align-items:center;gap:10px;font-family:var(--le-dat);color:#d8c9b2;z-index:5}
.le-mandos button{appearance:none;border:1px solid rgba(216,201,178,.3);background:rgba(255,255,255,.04);color:inherit;height:32px;min-width:40px;padding:0 14px;border-radius:999px;font:500 11px/1 var(--le-dat);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;transition:background .2s,border-color .2s}
.le-mandos button:hover{background:rgba(255,255,255,.10);border-color:rgba(216,201,178,.6)}
.le-mandos button:focus-visible{outline:2px solid #c9a25a;outline-offset:2px}
.le-mandos button:disabled{opacity:.3;cursor:default}
.le-mandos .le-flecha{position:fixed;display:none}
.le-lado{position:absolute;top:50%;z-index:6;transform:translateY(-50%);appearance:none;border:0;background:none;color:#e9e4dc;width:64px;height:120px;cursor:pointer;opacity:.85;transition:opacity .2s,transform .2s}
.le-lado:hover{opacity:1}
.le-lado:disabled{opacity:0;pointer-events:none}
.le-lado:focus-visible{outline:2px solid #c9a25a;outline-offset:-6px}
.le-lado svg{width:22px;height:40px;stroke:currentColor;fill:none;stroke-width:1.6}
.le-lado--atras{left:max(10px,2vw)} .le-lado--adelante{right:max(10px,2vw)}
.le-girar{display:none;font-family:var(--le-dat);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#a29b92}
@media (max-width:700px) and (orientation:portrait){ .le-girar{display:block;position:absolute;top:22px;left:0;right:0;text-align:center} .le-lado{width:36px} .le-lado svg{width:14px;height:28px} .le-lado--atras{left:0} .le-lado--adelante{right:0} }
.le-indicador{min-width:110px;text-align:center;font-size:11px;letter-spacing:.14em;font-variant-numeric:tabular-nums;color:#bfae95}
.le-pista{display:none;position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);white-space:nowrap;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#8f7f6a;transition:opacity .6s}
.le-medidor{position:absolute;left:-9999px;top:0;visibility:hidden}

/* sin JavaScript (o mientras carga): las páginas, una debajo de otra */
.le-fuente{background:var(--le-papel);padding:40px var(--gutter, 24px);display:grid;gap:40px;justify-items:center}
.le-fuente .le-src{position:relative;width:min(480px,100%);min-height:200px;background:var(--le-papel);box-shadow:0 1px 0 var(--le-filete)}
.le-fuente .le-src > .le-contenido,.le-fuente .le-src > figure,.le-fuente .le-src > .le-tapa,.le-fuente .le-src > .le-guarda{position:relative;inset:auto;min-height:560px}
.le-js .le-fuente{display:none}
.le:not(.le-js) .le-mesa{display:none}

@media (prefers-reduced-motion:reduce){
  .le{--le-giro:0s}
  .le-hoja.le-girando .le-cara::after{animation:none}
  .le-firma .le-rubrica{transition:none}
}

/* Astra pinta todos los <button> (fondo azul, relleno, borde): aquí no */
.le .le-lado,.le .le-lado:hover,.le .le-lado:focus,.le .le-lado:active{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;color:#e9e4dc!important;border-radius:0!important;display:flex;align-items:center;justify-content:center}
.le .le-mandos button,.le .le-mandos button:hover,.le .le-mandos button:focus{background:rgba(255,255,255,.05)!important;color:#d8c9b2!important;border:1px solid rgba(216,201,178,.3)!important;box-shadow:none!important;padding:0 14px!important;border-radius:999px!important;line-height:1!important}
.le .le-mandos button:hover{background:rgba(255,255,255,.12)!important}

/* ---------- solidez: tapas de cartoné, canto de las hojas, hoja que se curva ---------- */
.le-tapas{position:absolute;top:-11px;height:calc(var(--le-ph) + 22px);left:-14px;width:calc(var(--le-pw) * 2 + 28px);border-radius:3px 5px 5px 3px;
  background-color:#2e1c17;
  background-image:linear-gradient(90deg,rgba(0,0,0,0) calc(50% - 22px),rgba(0,0,0,.45) 50%,rgba(0,0,0,0) calc(50% + 22px)),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='p'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' seed='7'/><feColorMatrix values='0 0 0 0 .2  0 0 0 0 .12  0 0 0 0 .09  0 0 0 .35 0'/></filter><rect width='220' height='220' filter='url(%23p)'/></svg>");
  box-shadow:0 34px 70px rgba(0,0,0,.55),0 10px 22px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.05),inset 0 2px 0 rgba(255,255,255,.04);
  transition:left var(--le-giro) cubic-bezier(.45,.05,.25,1),width var(--le-giro) cubic-bezier(.45,.05,.25,1)}
.le-libro:not(.le-atras) .le-cerrado .le-tapas{left:calc(var(--le-pw) - 6px);width:calc(var(--le-pw) + 20px);background-image:none}
.le-libro.le-atras .le-tapas{left:-14px;width:calc(var(--le-pw) + 20px);background-image:none}
.le-bloque{position:absolute;top:0;width:var(--le-pw);height:var(--le-ph);background:#eee8dc;transition:box-shadow .3s}
.le-bloque--izq{left:0} .le-bloque--der{left:var(--le-pw)}
.le-cerrado .le-bloque{visibility:hidden}
.le-curva{position:absolute;top:0;left:var(--le-pw);width:var(--le-pw);height:var(--le-ph);transform-style:preserve-3d;pointer-events:none}
.le-simple .le-curva{left:0}
.le-tira{position:absolute;top:0;height:100%;transform-origin:0 50%;transform-style:preserve-3d;will-change:transform}
.le-tira-cara{position:absolute;inset:0;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:var(--le-papel)}
.le-tira-dorso{transform:rotateY(180deg)}
.le-tira-cara > .le-pag{position:absolute;top:0;bottom:0}
.le-tira-luz{position:absolute;inset:0;background:#1a120d;opacity:0;pointer-events:none;z-index:9}
.le-arrojada{position:absolute;top:0;left:var(--le-pw);width:var(--le-pw);height:var(--le-ph);opacity:0;pointer-events:none;z-index:9000;
  background:linear-gradient(90deg,rgba(20,12,6,.38),rgba(20,12,6,.14) 35%,rgba(20,12,6,0) 80%)}
.le-arrojada.le-arrojada--izq{left:0;background:linear-gradient(270deg,rgba(20,12,6,.38),rgba(20,12,6,.14) 35%,rgba(20,12,6,0) 80%)}

/* ---------- portada estampada: pan de oro hundido en la piel ----------
   El oro no es un color: es un degradado metálico con grano, recortado a la
   forma de las letras (y del logo, por máscara), con la huella del golpe de
   prensa alrededor (sombra arriba, luz abajo). */
.le-tapa{--le-pan:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='1.4' numOctaves='2' seed='3'/><feColorMatrix values='0 0 0 0 .25  0 0 0 0 .17  0 0 0 0 .06  0 0 0 .55 0'/></filter><rect width='160' height='160' filter='url(%23g)'/></svg>"),
  linear-gradient(105deg,#7a5a24 0%,#c9a457 14%,#f1dc9f 26%,#b48a3c 40%,#e9cf8b 55%,#a07a33 68%,#e4c47e 82%,#7d5d26 100%)}
.le .le-tapa h1,.le .le-tapa small,.le .le-tapa .le-tapa-sub,.le .le-tapa .le-ano,.le .le-tapa.le-trasera p,.le-sello{
  background-image:var(--le-pan);background-size:160px 160px,100% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent;
  text-shadow:none!important;filter:drop-shadow(0 -1px 0 rgba(0,0,0,.65)) drop-shadow(0 1px 0 rgba(255,222,160,.16))}
.le .le-tapa h1{font-weight:500;letter-spacing:.012em}
.le .le-tapa small{filter:drop-shadow(0 -1px 0 rgba(0,0,0,.6))}
.le-sello{display:block;width:150px;aspect-ratio:2.427;-webkit-background-clip:border-box;background-clip:border-box;
  -webkit-mask:var(--le-logo) center/contain no-repeat;mask:var(--le-logo) center/contain no-repeat}
.le-tapa.le-trasera .le-sello{width:120px}
/* el marco, gofrado en seco (sin oro): una hendidura con su filo de luz */
.le-tapa::after{border:1px solid rgba(0,0,0,.42)!important;box-shadow:0 1px 0 rgba(255,235,200,.07),inset 0 1px 0 rgba(255,235,200,.06)}
/* la piel: grano en relieve */
.le-tapa::before{opacity:.55!important;mix-blend-mode:soft-light!important;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='260' height='260'><filter id='c'><feTurbulence type='fractalNoise' baseFrequency='.55' numOctaves='4' seed='11' result='r'/><feDiffuseLighting in='r' surfaceScale='2.2' lighting-color='%23ffffff'><feDistantLight azimuth='225' elevation='52'/></feDiffuseLighting></filter><rect width='260' height='260' filter='url(%23c)'/></svg>")!important}

/* carga: nada se mueve al montar y la mesa no enseña mandos sin libro */
.le-quieto,.le-quieto *{transition:none!important}
.le-escena,.le-mandos,.le-lado,.le-girar{transition:opacity .5s ease}
.le-js:not(.le-listo) .le-escena,.le-js:not(.le-listo) .le-mandos,.le-js:not(.le-listo) .le-lado,.le-js:not(.le-listo) .le-girar{opacity:0}