/* Álbum como libro (ver assets/js/album-libro.js) */
.book-shell{position:relative;width:min(824px,94%);margin:0 auto}
.book-shell .book{width:100%}
.book-tabs,.book-cover,.book-page-num{display:none}
.book-leaf-under{z-index:5}

@media(min-width:821px){
  .book-shell{width:min(940px,86%)}
  /* Pestañas de años que asoman del borde derecho del libro */
  .book-tabs{position:absolute;top:9%;right:-40px;z-index:0;display:flex;flex-direction:column;gap:6px}
  .book-tab{position:relative;display:flex;align-items:center;justify-content:flex-end;width:64px;height:54px;padding:0 9px 0 0;border:0;border-radius:0 9px 9px 0;background:linear-gradient(90deg,#c9a46a 0%,#e4c993 40%,#efdcb2 100%);color:#5b4325;font-family:"Cormorant Garamond","Spectral",Georgia,serif;font-size:1.02rem;font-weight:700;letter-spacing:.02em;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(122,88,42,.18),4px 6px 14px -8px rgba(55,35,12,.6);transform:translateX(-14px);transition:transform .35s cubic-bezier(.2,.8,.2,1),background .3s ease,color .3s ease}
  .book-tab:nth-child(even){background:linear-gradient(90deg,#bf9a5f 0%,#dcbf86 40%,#ead3a5 100%)}
  .book-tab span{writing-mode:vertical-rl;transform:rotate(180deg)}
  .book-tab:hover{transform:translateX(-6px)}
  .book-tab.active{background:linear-gradient(90deg,#6e5230 0%,#7d5f38 45%,#8a6b40 100%);color:#fff3dc;transform:translateX(0)}
  .book-tab:focus-visible{outline:2px solid #553f25;outline-offset:2px}
  .book-shell .book{z-index:1}
  /* Con las pestañas y el número de página, los botones de año y la barra sobran */
  .archive-controls .archive-years,.archive-controls .archive-progress{display:none}
  .archive-controls{grid-template-columns:42px minmax(0,1fr) 42px}
  .book-page-num{display:block;grid-column:2;grid-row:1;margin:0;text-align:center;color:#6b5a45;font-family:"Cormorant Garamond","Spectral",Georgia,serif;font-size:1.08rem;font-style:italic;letter-spacing:.02em}
}

/* Tapa de cuero: solo con animaciones activas */
@media(min-width:821px) and (prefers-reduced-motion:no-preference){
  /* Solo se animan transformaciones (el navegador no redibuja el libro en cada cuadro) */
  .book-shell{transition:transform 1.8s cubic-bezier(.42,0,.22,1)}
  .book-shell.is-closed,.book-shell.is-opening{will-change:transform}
  .book-shell{perspective:2400px}
  .book-tabs{transition:opacity .6s ease .9s}
  .book-shell.is-closed{transform:translateX(-25%)}
  /* La mitad izquierda queda oculta hasta que la tapa se apoya encima; recién ahí se muestra, sin animar el recorte */
  .book-shell.is-closed .book,.book-shell.is-opening .book{clip-path:inset(0 0 0 50% round 8px)}
  .book-shell.is-closed .book-tabs{opacity:0}
  .book-shell.is-closed .archive-spread{visibility:hidden}
  .book-shell:not(.is-open) .book-cover{display:block}
  .book-cover{position:absolute;top:0;bottom:0;left:50%;width:50%;z-index:9;padding:0;border:0;background:none;cursor:pointer;transform-origin:left center;transform-style:preserve-3d;transition:transform 1.8s cubic-bezier(.42,0,.22,1)}
  .book-shell.is-opening .book-cover,.book-shell.is-landed .book-cover{transform:rotateY(-180deg);pointer-events:none}
  .book-shell.is-opening .book-cover{will-change:transform}
  /* Se desvanece solo el dorso (capa plana): bajar la opacidad de la tapa entera la aplana y oculta el dorso de golpe */
  .book-shell.is-landed .book-cover-back{opacity:0;transition:opacity .8s ease .1s}
  .book-shell.is-landed .book-cover-front{visibility:hidden}
  .book-shell.is-landed .book-cover-back{visibility:visible}
  /* Sombra que la tapa proyecta sobre la primera página mientras se levanta */
  .book-open-shade{display:none}
  .book-shell.is-opening .book-open-shade{display:block;position:absolute;top:0;bottom:0;left:50%;width:50%;z-index:8;background:linear-gradient(90deg,rgba(40,22,8,.55),rgba(40,22,8,.2) 45%,transparent 85%);opacity:0;pointer-events:none;animation:bookOpenShade 1.8s cubic-bezier(.42,0,.22,1) both}
  @keyframes bookOpenShade{0%{opacity:0}35%{opacity:1}75%{opacity:.25}100%{opacity:0}}
  /* Cambio de cara a mitad del giro (no depende de backface-visibility) y el dorso se desvanece al apoyarse */
  /* Cambio de cara exactamente a los 90 grados: misma duración y curva que el giro */
  .book-shell.is-opening .book-cover-front{animation:bookCoverFront 1.8s cubic-bezier(.42,0,.22,1) both}
  .book-shell.is-opening .book-cover-back{animation:bookCoverBack 1.8s cubic-bezier(.42,0,.22,1) both}
  @keyframes bookCoverFront{from{visibility:visible}to{visibility:hidden}}
  @keyframes bookCoverBack{from{visibility:hidden}to{visibility:visible}}
  .book-shell.is-opening .archive-spread{visibility:visible}
  .book-cover-face{position:absolute;inset:0;display:grid;place-items:center;backface-visibility:hidden;border-radius:0 8px 8px 0;overflow:hidden}
  .book-cover-front{background:radial-gradient(120% 90% at 30% 20%,rgba(255,220,170,.18),transparent 55%),repeating-radial-gradient(circle at 20% 30%,rgba(0,0,0,.05) 0 1px,transparent 1px 3px),linear-gradient(135deg,#6b4022 0%,#4e2d17 55%,#3a2010 100%);box-shadow:inset 14px 0 18px -10px rgba(0,0,0,.55),inset 0 0 0 1px rgba(255,220,170,.12),0 22px 48px -30px rgba(30,16,6,.9)}
  .book-cover-front::before{content:"";position:absolute;left:0;top:0;bottom:0;width:22px;background:linear-gradient(90deg,rgba(0,0,0,.45),rgba(255,220,170,.08) 60%,transparent)}
  .book-cover-frame{position:relative;display:grid;justify-items:center;gap:10px;width:74%;padding:44px 20px 40px;border:1px solid rgba(214,176,110,.75);outline:1px solid rgba(214,176,110,.35);outline-offset:6px;color:#d9b673;text-align:center;text-shadow:0 1px 0 rgba(0,0,0,.45),0 -1px 0 rgba(255,230,180,.15)}
  .book-cover-mark{font-family:"Cormorant Garamond","Spectral",Georgia,serif;font-size:clamp(3rem,6vw,4.6rem);font-weight:600;line-height:.9;letter-spacing:-.02em}
  .book-cover-title{font-family:"Cormorant Garamond","Spectral",Georgia,serif;font-size:clamp(1.5rem,2.6vw,2.2rem);font-weight:600;letter-spacing:.04em}
  .book-cover-years{font-family:"Libre Baskerville",Georgia,serif;font-size:.86rem;letter-spacing:.3em}
  .book-cover-sub{margin-top:6px;padding-top:12px;border-top:1px solid rgba(214,176,110,.45);font-family:"Libre Franklin",sans-serif;font-size:.62rem;font-weight:700;letter-spacing:.32em;text-transform:uppercase}
  .book-cover-hint{position:absolute;left:50%;bottom:7%;color:rgba(232,205,150,.85);font-family:"Libre Baskerville",Georgia,serif;font-size:.78rem;font-style:italic;transform:translateX(-50%);animation:bookHint 2.4s ease-in-out infinite}
  .book-cover:hover .book-cover-frame{color:#e8c887}
  .book-cover:focus-visible{outline:2px solid #553f25;outline-offset:4px}
  /* Dorso de la tapa: guarda del libro con ex libris */
  /* Dorso de la tapa: hoja de guarda con el mismo papel envejecido de las páginas */
  .book-cover-back{visibility:hidden;transform:rotateY(180deg);border-radius:8px 0 0 8px;background:linear-gradient(90deg,rgba(70,44,16,.08),transparent 30%,transparent 78%,rgba(70,44,16,.28) 100%),radial-gradient(120% 90% at 50% 45%,transparent 55%,rgba(92,60,24,.22) 100%),url("../img/textura-album.jpg") left center/200% 100% no-repeat;box-shadow:inset -18px 0 26px -14px rgba(60,35,12,.45),inset 0 0 0 1px rgba(122,88,42,.12)}
  .book-cover-mark-water{color:rgba(122,88,42,.13);font-family:"Cormorant Garamond","Spectral",Georgia,serif;font-size:clamp(5rem,11vw,9rem);font-weight:600;letter-spacing:-.03em;line-height:1;mix-blend-mode:multiply;user-select:none}
  @keyframes bookHint{0%,100%{opacity:.55;transform:translate(-50%,0)}50%{opacity:1;transform:translate(-50%,-3px)}}
}

/* Hoja curva: franjas encadenadas que giran sobre el lomo (ver showArchive en main.js) */
@media(min-width:821px) and (prefers-reduced-motion:no-preference){
  .book{perspective:2200px}
  .book-curl{transform:none}
  .book-curl-seg{position:absolute;top:0;bottom:0;left:0;transform-origin:left center;transform-style:preserve-3d}
  .book-curl.is-backward .book-curl-seg{left:auto;right:0;transform-origin:right center}
  .book-curl-face{position:absolute;inset:0;overflow:hidden;background:#e6c79d;backface-visibility:hidden}
  .book-curl-face.is-back{transform:rotateY(180deg)}
  .book-curl-shade{position:absolute;inset:0;z-index:3;background:linear-gradient(90deg,rgba(46,27,9,.85),rgba(46,27,9,.55));opacity:0;pointer-events:none}
  .book-curl-cast{position:absolute;top:0;bottom:0;left:50%;width:50%;z-index:5;--reach:0%;background:linear-gradient(90deg,rgba(46,27,9,.5),rgba(46,27,9,.18) calc(var(--reach) * .6),transparent var(--reach));opacity:0;pointer-events:none}
  .book-curl-cast.is-backward{left:0;background:linear-gradient(270deg,rgba(46,27,9,.5),rgba(46,27,9,.18) calc(var(--reach) * .6),transparent var(--reach))}
}