@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--violet:#c6aaff;--accent:#bfa2ff;--accent-rgb:191,162,255;--text:#f5f0ff;--muted:#b1aac8;--border:rgba(207,179,255,.2);--serif:'Cormorant Garamond',Georgia,serif;--sans:Manrope,Arial,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;width:100%;min-width:0;min-height:100%;}
body{background:#080611;color:var(--text);font:400 14px/1.6 var(--sans);overflow:hidden}
body.theme-crimson{--accent:#fca0b2;--accent-rgb:250,120,150}
button,a{font:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid #e9d4ff;outline-offset:3px}img{display:block;max-width:100%}
.library-bg{position:fixed;inset:-15px;background-image:url('../assets/fondo-biblioteca-sin-haz.webp');background-size:cover;background-position:center;filter:blur(9px);pointer-events:none;z-index:-3;transform:none;animation:none}
.library-tint{position:fixed;inset:0;background:linear-gradient(95deg,rgba(7,5,17,.89),rgba(11,6,23,.74) 48%,rgba(7,5,16,.89)),linear-gradient(0deg,rgba(5,4,12,.85),rgba(5,4,12,.3) 49%,rgba(5,4,12,.78));pointer-events:none;z-index:-2}
.library-page{height:100dvh;max-height:100dvh;min-height:580px;padding:0 clamp(16px,2.5vw,46px);display:flex;flex-direction:column;overflow:hidden}
.library-heading{flex:0 0 auto;position:relative;z-index:2;border-bottom:1px solid rgba(200,168,255,.31)}
.heading-top{height:53px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid rgba(188,157,255,.1)}
.brand{font-size:12px;letter-spacing:.21em;font-weight:800;white-space:nowrap}.brand span:not(.brand-sigil){font-weight:400}.brand-sigil{font:400 31px/1 var(--serif);vertical-align:-6px;margin-right:11px;color:#ccaaff;text-shadow:0 0 24px #bb86f7}
.exit-link{font-size:10px;font-weight:800;letter-spacing:.15em;color:#e2d1ff;white-space:nowrap}.exit-link:hover{color:white}
.heading-story{position:relative;min-height:105px;display:flex;gap:22px;align-items:center;padding:12px 18px;overflow:hidden;isolation:isolate}
.heading-story:before{content:"";position:absolute;inset:0;z-index:-2;background:url('../assets/fondo-biblioteca-sin-haz.webp') center 30%/cover no-repeat;opacity:.5}
.heading-story:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0c0818 5%,rgba(8,6,20,.57) 40%,rgba(8,6,21,.63) 65%,#0b071c)}
.heading-emblem{display:flex;justify-content:center;align-items:center;width:64px;height:64px;border:1px solid rgba(195,159,255,.38);border-radius:50%;flex:none;box-shadow:0 0 35px #935fe52b,inset 0 0 18px #b795ff18}
.heading-emblem span{font-size:43px;font-family:var(--serif);color:#ddbdff;text-shadow:0 0 22px #b57cff}
.heading-eyebrow{font-size:9px;letter-spacing:.23em;font-weight:800;color:#cbb5ee}
.heading-story h1{font:500 clamp(40px,4vw,63px)/.85 var(--serif);letter-spacing:.045em;margin:7px 0 0;color:#fff}.heading-story h1 em{font-weight:400;color:#d2b9ff;font-style:normal}.heading-ornament{margin-left:auto;color:#cbb2ff;font:400 25px var(--serif);letter-spacing:.14em;white-space:nowrap}.heading-ornament small{font-size:14px;color:#9c7ed2}
.library-board{flex:1;min-height:0;display:grid;grid-template-columns:minmax(188px,19%) minmax(260px,1fr) minmax(330px,31%);border-left:1px solid var(--border);border-right:1px solid var(--border);background:rgba(9,7,22,.55);box-shadow:0 20px 75px rgba(0,0,0,.3)}
.volume-rail,.showcase,.reader-panel{min-height:0;min-width:0;position:relative}
.volume-rail{display:flex;flex-direction:column;border-right:1px solid var(--border);background:linear-gradient(145deg,rgba(20,14,40,.8),rgba(9,7,21,.78));padding:20px 13px 18px}
.rail-heading,.showcase-top,.reader-top{display:flex;justify-content:space-between;align-items:center;gap:9px;font-size:9px;font-weight:800;letter-spacing:.17em;color:#bba5d9}
.rail-heading{padding:0 7px 17px;border-bottom:1px solid var(--border)}.rail-heading small{font-size:9px;color:#9885b0}
.volume-list{display:flex;flex-direction:column;gap:10px;padding-top:16px;overflow-y:auto;min-height:0;scrollbar-width:thin;scrollbar-color:#564273 transparent}
.volume-choice{min-height:114px;text-align:left;display:flex;align-items:center;gap:10px;position:relative;min-width:0;border:1px solid transparent;background:rgba(21,15,41,.36);color:#eee8ff;padding:10px 7px;transition:background .2s,border-color .2s}
.volume-choice:hover,.volume-choice.is-selected{background:rgba(var(--accent-rgb),.095);border-color:rgba(var(--accent-rgb),.46)}.volume-choice.is-selected:before{content:"";position:absolute;left:-2px;top:9px;bottom:9px;width:2px;background:var(--accent);box-shadow:0 0 12px var(--accent)}
.volume-number{position:absolute;top:7px;right:6px;color:#b7a0dd;font-size:9px}.volume-choice img{width:62px;height:93px;object-fit:cover;flex:none;box-shadow:5px 8px 15px #0008}.volume-meta{display:flex;flex-direction:column;gap:5px;min-width:0;padding-right:5px}.volume-meta small{font-size:9px;letter-spacing:.12em;color:var(--accent)}.volume-meta strong{font:500 clamp(18px,1.4vw,25px)/1.05 var(--serif)}.volume-meta>span{font-size:10px;color:#afa4c2}.volume-arrow{position:absolute;right:6px;bottom:6px;font-size:12px;color:#bda0dd}
.rail-bottom{margin-top:auto;padding:18px 8px 0;border-top:1px solid var(--border);display:flex;align-items:center;gap:12px;color:#a99abf}.rail-bottom>span{font:32px var(--serif);color:var(--accent)}.rail-bottom p{font-size:10px;line-height:1.6;margin:0}
.showcase{display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:20px 17px 10px;overflow:hidden;background:radial-gradient(ellipse at 50% 49%,rgba(var(--accent-rgb),.15),rgba(11,8,30,.045) 43%,transparent 72%)}
.showcase-top{align-self:stretch;flex:0 0 auto}.showcase-top span:last-child{color:#e4d0ff}
.book-environment{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;position:relative;width:100%;perspective:1100px;overflow:hidden;isolation:isolate}
.showcase-orbit{position:absolute;z-index:-1;left:50%;top:51%;transform:translate(-50%,-50%);width:min(92%,460px);height:min(80%,560px);border-radius:50%;background:radial-gradient(ellipse,rgba(var(--accent-rgb),.23),rgba(111,67,178,.075) 41%,transparent 72%);pointer-events:none}
.showcase-orbit:after{content:"";position:absolute;inset:14%;border:1px solid rgba(var(--accent-rgb),.16);border-radius:50%;box-shadow:0 0 32px rgba(var(--accent-rgb),.055)}
/* Libro físico: seis superficies independientes, profundidad auténtica en CSS 3D.
   El grosor es ilustrativo hasta conocer la paginación final. */
.book-stage{
  --depth:clamp(25px,2.7vw,38px);
  --book-width:clamp(140px,19vw,295px);
  height:min(91%,565px);width:100%;display:flex;align-items:center;justify-content:center;
  touch-action:none;user-select:none;-webkit-user-select:none;perspective:1500px;
  position:relative;cursor:grab;
}
.book-stage.is-dragging{cursor:grabbing}
.book-object{
  position:relative;width:var(--book-width);aspect-ratio:2/3;max-height:100%;
  transform-style:preserve-3d;
  transform:rotateX(var(--rot-x,-5deg)) rotateY(var(--rot-y,24deg));
  transition:transform .5s cubic-bezier(.2,.72,.2,1);
  outline-offset:7px;
}
.book-stage.is-dragging .book-object{transition:none}
.book-face,.book-edge{
  position:absolute;backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  pointer-events:none;
}
.book-face{inset:0;overflow:hidden;border-radius:3px 5px 5px 3px;border:1px solid rgba(221,205,255,.32)}
.book-front{
  transform:translateZ(calc(var(--depth) / 2));background:#100c23;
  box-shadow:inset 5px 0 8px rgba(7,4,18,.26),inset -2px 0 4px rgba(255,255,255,.09);
}
.book-front img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.cover-glass{position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,rgba(255,255,255,.11) 0%,rgba(255,255,255,0) 14%,transparent 78%,rgba(0,0,0,.10));}
.book-back{
  transform:rotateY(180deg) translateZ(calc(var(--depth)/2));
  background:radial-gradient(ellipse at 52% 32%,rgba(var(--accent-rgb),.21),transparent 62%),linear-gradient(145deg,#2b1d49,#0a0819 75%);
}
.book-back-art{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.book-back-art[hidden]{display:none}
.book-back .back-copy{position:absolute;inset:0;display:flex;align-items:center;flex-direction:column;justify-content:center;padding:23px;text-align:center}
.book-back.has-back-art .back-copy{display:none}
.back-sigil{font:70px/.9 var(--serif);color:var(--accent);margin-bottom:auto}
.back-top{font-size:10px;letter-spacing:.18em;font-weight:800}
.back-divider{height:1px;width:68%;background:var(--accent);opacity:.5;margin:22px 0}
.back-title{font:500 clamp(24px,2.2vw,37px)/1.08 var(--serif)}
.back-teaser{font:italic 18px/1.4 var(--serif);color:#ddd0ef;margin-top:15px}
.back-author{font-size:9px;letter-spacing:.15em;margin-top:auto;color:#d4bde9}
.book-edge{border:1px solid rgba(26,18,40,.32);border-radius:1px}
/* Caras de los laterales centradas en el plano Z=0, en lugar de pegadas a la contraportada. */
.book-spine{
  left:0;top:0;width:var(--depth);height:100%;
  transform:translateX(-50%) rotateY(-90deg);
  background:linear-gradient(90deg,#0a0716 0%,#25153b 18%,rgba(var(--accent-rgb),.56) 52%,#1c0d38 82%,#080713 100%);
  display:flex;align-items:center;justify-content:center;gap:15px;writing-mode:vertical-rl;
  color:#f6eeff;font:700 10px var(--sans);letter-spacing:.15em;
  text-shadow:0 1px 4px #080711;
}
.book-spine .spine-author{font-size:8px;font-weight:500;letter-spacing:.2em}
.book-spine .spine-sigil{font:22px var(--serif);color:var(--accent)}
.book-edge-pages{background-color:#e6dfd2}
.book-page-right{
  top:4px;right:0;width:var(--depth);height:calc(100% - 8px);
  transform:translateX(50%) rotateY(90deg);
  background:
    linear-gradient(90deg,rgba(96,80,105,.25),transparent 23%,transparent 78%,rgba(57,47,68,.20)),
    repeating-linear-gradient(to bottom,#e9e4d9 0px,#e9e4d9 2px,#beb7b6 2.5px,#f7f0e6 3px);
  box-shadow:inset 0 0 4px rgba(32,20,31,.4);
}
.book-page-top{
  top:0;left:3px;width:calc(100% - 6px);height:var(--depth);
  transform:translateY(-50%) rotateX(90deg);
  background:
    linear-gradient(180deg,rgba(67,47,72,.33),transparent 34%,rgba(56,44,74,.19)),
    repeating-linear-gradient(to right,#ede5dc 0px,#ede5dc 3px,#c3bdb6 3.4px,#f5ede3 4px);
}
.book-page-bottom{
  bottom:0;left:3px;width:calc(100% - 6px);height:var(--depth);
  transform:translateY(50%) rotateX(-90deg);
  background:
    linear-gradient(180deg,rgba(41,28,55,.28),transparent 38%,rgba(77,53,80,.22)),
    repeating-linear-gradient(to right,#e8dfd3 0px,#e8dfd3 3px,#bab0b6 3.4px,#f4ece1 4px);
}
.book-ground{position:absolute;bottom:3%;width:53%;height:17px;border-radius:50%;background:#07050d;filter:blur(14px);opacity:.6}
.book-controls{display:flex;align-items:center;justify-content:center;gap:11px;flex:0 0 auto;min-height:40px;width:100%;color:#b6a5cb;font-size:9px;letter-spacing:.12em;text-align:center;font-weight:750;white-space:nowrap}.book-controls button{border:1px solid #baa0ea5e;color:#e9d7ff;background:#17112e91;min-width:36px;min-height:33px;font:25px/1 var(--serif)}.book-controls button:hover{background:#ad7ee13b}.book-controls .reset-button{font:800 8px var(--sans);letter-spacing:.1em;min-width:57px;padding:0 6px}
.reader-panel{display:flex;flex-direction:column;padding:clamp(15px,1.5vw,27px) clamp(17px,2.3vw,43px) 14px;border-left:1px solid var(--border);background:linear-gradient(130deg,rgba(15,11,32,.92),rgba(17,11,35,.78))}
.reader-top{flex:0 0 auto;color:var(--accent)}.reader-star{font-size:22px;font-weight:400}
.reader-panel h2{font:500 clamp(39px,3.6vw,67px)/.97 var(--serif);letter-spacing:-.02em;margin:11px 0 9px;flex:0 0 auto}
.status-line{font-size:9px;color:var(--accent);font-weight:800;letter-spacing:.15em;margin-bottom:17px;flex:0 0 auto}
.reader-tabs{display:flex;flex:0 0 auto;border-block:1px solid var(--border);gap:2px;justify-content:space-between}.reader-tabs button{flex:1;background:transparent;color:#a99bbf;border:0;padding:14px 3px;font-size:9px;font-weight:800;letter-spacing:.14em;position:relative;white-space:nowrap}.reader-tabs button:hover,.reader-tabs button.is-active{color:#fff}.reader-tabs button.is-active:after{content:"";position:absolute;bottom:-1px;height:2px;background:var(--accent);left:6%;right:6%}
.reader-content{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(var(--accent-rgb),.45) transparent;padding:16px 5px 14px 0;color:#d2cbe1;font-size:clamp(12px,.88vw,14px);line-height:1.78}
.reader-content .opening{font:400 clamp(23px,2vw,33px)/1.12 var(--serif);color:#fff;margin:0 0 13px}.reader-content p{margin:0 0 15px}.reader-content .story-quote{border-left:2px solid var(--accent);padding:8px 15px;font:italic 20px/1.3 var(--serif);color:#e8dcff;margin:10px 0}.reader-content dl{margin:0}.reader-content dl>div{display:grid;grid-template-columns:43% 1fr;gap:9px;border-bottom:1px solid rgba(var(--accent-rgb),.17);padding:9px 0}.reader-content dt{font-size:11px;color:#aa9fbd}.reader-content dd{margin:0;color:#f2e9ff;font-size:12px}.reader-content .notice-title{font:500 25px/1.1 var(--serif);color:#f7efff;margin:0 0 12px}.reader-content .notice-copy{font-size:13px;line-height:1.75}.reader-content a{color:#e7d2ff;text-decoration:underline;text-underline-offset:4px}
.reader-actions{flex:none;display:flex;flex-direction:column;gap:0;padding-top:13px;border-top:1px solid var(--border)}.amazon-action{display:flex;width:100%;align-items:center;text-align:left;gap:15px;padding:12px 14px;background:rgba(var(--accent-rgb),.15);border:1px solid rgba(var(--accent-rgb),.6);color:#fff;font-size:11px;font-weight:800;letter-spacing:.11em}.amazon-action:hover{background:rgba(var(--accent-rgb),.22)}.amazon-symbol{font:600 31px Georgia,serif;position:relative;color:#fff}.amazon-symbol:after{content:"⌣";position:absolute;left:1px;bottom:-13px;font-size:20px;color:var(--accent)}.amazon-action small{display:block;margin-top:1px;font-size:9px;font-weight:500;letter-spacing:.11em;color:#c6b6db}.action-arrow{font-size:20px;margin-left:auto;color:var(--accent)}.secondary-actions{display:flex;gap:9px}.secondary-actions button{flex:1;border:1px solid rgba(var(--accent-rgb),.3);background:rgba(12,10,25,.6);min-height:42px;padding:8px 9px;color:#e4d7f9;font-size:9px;letter-spacing:.1em;font-weight:800;display:flex;align-items:center;justify-content:space-between;gap:5px}.secondary-actions button:hover{background:rgba(var(--accent-rgb),.13)}.secondary-actions span{font-size:17px;font-weight:400;color:var(--accent)}
.reader-bottom{margin-top:11px;padding-top:9px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:.13em;color:#a693c0}.reader-bottom span:last-child{font-size:20px;color:var(--accent)}
.library-footer{display:flex;flex:none;align-items:center;justify-content:space-between;gap:18px;height:31px;border-top:1px solid rgba(213,180,255,.2);font-size:8px;letter-spacing:.15em;color:#b6a5ce}
@media(max-width:1200px){.library-page{padding-inline:16px}.library-board{grid-template-columns:190px minmax(245px,1fr) minmax(308px,34%)}.volume-choice{gap:8px}.volume-choice img{width:49px;height:74px}.volume-choice{min-height:95px}.volume-meta strong{font-size:20px}.volume-meta>span{font-size:9px}.reader-panel{padding-inline:20px}.book-stage{--book-width:clamp(153px,19vw,240px)}.heading-story{min-height:90px}.heading-story h1{font-size:49px}}
@media(max-width:940px){body{overflow:auto}.library-page{height:auto;max-height:none;min-height:100dvh;overflow:visible}.library-board{display:grid;grid-template-columns:160px minmax(0,1fr);grid-template-areas:'rail book' 'rail panel';min-height:0}.volume-rail{grid-area:rail}.showcase{grid-area:book;min-height:420px}.reader-panel{grid-area:panel;min-height:450px;border-top:1px solid var(--border);border-left:0}.volume-list{overflow:visible}.library-footer{height:auto;min-height:32px}.book-stage{--book-width:228px}.reader-content{max-height:350px}}
@media(max-width:600px){.library-page{padding:0 10px}.heading-top{height:50px}.brand{font-size:10px;letter-spacing:.08em}.brand-sigil{font-size:24px;margin-right:3px}.exit-link{font-size:9px;letter-spacing:.08em}.heading-story{padding:9px 12px;min-height:80px;gap:10px}.heading-emblem{width:40px;height:40px}.heading-emblem span{font-size:30px}.heading-eyebrow{font-size:7px;letter-spacing:.13em}.heading-story h1{font-size:36px}.heading-ornament{display:none}.library-board{display:flex;flex-direction:column}.volume-rail{order:0;border-right:0;border-bottom:1px solid var(--border);padding:10px 12px}.rail-heading{padding:0 0 8px}.volume-list{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding-top:9px}.volume-choice{min-height:90px;padding:6px 5px;gap:7px}.volume-choice img{width:42px;height:64px}.volume-meta strong{font-size:19px}.volume-meta small{font-size:8px}.volume-meta>span{font-size:8px}.volume-number,.volume-arrow,.rail-bottom{display:none}.showcase{order:1;min-height:420px;padding:13px 12px}.book-stage{--book-width:min(54vw,230px)}.reader-panel{order:2;min-height:480px;padding:17px 18px}.reader-panel h2{font-size:50px}.reader-content{max-height:none;min-height:185px}.library-footer{flex-wrap:wrap;justify-content:center;padding:11px;text-align:center}.library-footer span:nth-child(3){display:none}}
@media (max-height:750px) and (min-width:941px){.library-heading .heading-top{height:43px}.heading-story{min-height:77px}.heading-story h1{font-size:42px}.heading-emblem{width:49px;height:49px}.heading-emblem span{font-size:33px}.volume-rail{padding-top:13px}.reader-panel h2{font-size:40px;margin:8px 0 5px}.status-line{margin-bottom:8px}.reader-tabs button{padding:9px 3px}.reader-content{padding-top:10px;padding-bottom:7px;line-height:1.55}.reader-content p{margin-bottom:10px}.reader-actions{padding-top:8px;gap:6px}.amazon-action{padding:8px 10px}.secondary-actions button{min-height:34px}.reader-bottom{margin-top:6px;padding-top:5px}.showcase{padding-top:11px}.book-stage{--book-width:min(22vw,225px)}.library-footer{height:25px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important}}


/* ─── Archivo visual de la saga · decoración SVG fija y ligera ─── */
body.library-app{--scene-ink:#bfa8ff}
body.library-app.theme-crimson{--scene-ink:#ff9aac}
.library-board{position:relative;isolation:isolate;box-shadow:0 18px 70px #05030f7a,0 0 0 1px rgba(var(--accent-rgb),.055)}
.library-board::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,transparent 0%,rgba(var(--accent-rgb),.022) 32%,transparent 66%,rgba(var(--accent-rgb),.025)),repeating-linear-gradient(90deg,transparent 0 47px,rgba(var(--accent-rgb),.018) 48px);opacity:.55}
.heading-story{box-shadow:inset 0 -1px rgba(var(--accent-rgb),.3)}
.heading-story::before{filter:saturate(.83)}
.heading-emblem{position:relative;border-color:rgba(var(--accent-rgb),.6)}
.heading-emblem::before,.heading-emblem::after{content:"";position:absolute;inset:-7px;border:1px solid rgba(var(--accent-rgb),.17);border-radius:50%;clip-path:polygon(0 0,100% 0,100% 38%,0 38%)}
.heading-emblem::after{transform:rotate(180deg)}
.heading-ornament{display:flex;gap:15px;align-items:center;color:var(--scene-ink)}
.archive-crest{font:400 33px/1 var(--serif);color:var(--accent);filter:drop-shadow(0 0 10px rgba(var(--accent-rgb),.65))}
.heading-story h1 em{text-shadow:0 0 36px rgba(var(--accent-rgb),.21)}
.volume-rail{isolation:isolate;overflow:hidden}
.rail-heading,.volume-list,.rail-bottom{position:relative;z-index:2}
.rail-illustration{position:absolute;pointer-events:none;z-index:1}
.rail-illustration span{position:absolute;bottom:13px;left:0;right:0;text-align:center;font-size:8px;letter-spacing:.2em;font-weight:700;color:#cab5ff}
.theme-crimson .rail-illustration span{color:#f2a0b5}
.rail-bottom{background:linear-gradient(180deg,rgba(12,8,27,.45),rgba(12,8,27,.78));padding-bottom:3px}
.volume-choice{box-shadow:inset 0 1px rgba(255,255,255,.015)}
.volume-choice.is-selected{box-shadow:inset 0 0 25px rgba(var(--accent-rgb),.04),0 0 26px rgba(var(--accent-rgb),.055)}
.showcase{isolation:isolate;background:radial-gradient(ellipse at 50% 51%,rgba(var(--accent-rgb),.16),rgba(var(--accent-rgb),.05) 30%,transparent 67%),linear-gradient(180deg,rgba(7,5,22,.07),rgba(9,5,22,.3))}
.showcase::before,.showcase::after{content:"";position:absolute;pointer-events:none;z-index:0;width:27px;height:27px;border-color:rgba(var(--accent-rgb),.36);border-style:solid}
.showcase::before{top:48px;left:17px;border-width:1px 0 0 1px}
.showcase::after{right:17px;bottom:59px;border-width:0 1px 1px 0}
.book-environment{color:var(--accent)}
.archive-orbit-system{position:absolute;z-index:-1;pointer-events:none;width:min(93%,530px);aspect-ratio:1;left:50%;top:49%;transform:translate(-50%,-50%);opacity:.7;color:var(--accent);filter:drop-shadow(0 0 9px rgba(var(--accent-rgb),.10))}
.archive-orbit-system svg{display:block;width:100%;height:100%;overflow:visible}
.showcase-orbit{opacity:.7}
.archive-particles{position:absolute;z-index:-1;left:50%;top:50%;width:min(96%,590px);height:min(90%,580px);transform:translate(-50%,-50%);pointer-events:none}
.archive-particles i{position:absolute;width:3px;height:3px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px 2px rgba(var(--accent-rgb),.38);opacity:.54}
.archive-particles i:nth-child(1){top:9%;left:28%}.archive-particles i:nth-child(2){top:17%;right:15%;width:2px;height:2px}.archive-particles i:nth-child(3){top:49%;left:5%;width:2px;height:2px}.archive-particles i:nth-child(4){top:67%;right:9%}.archive-particles i:nth-child(5){bottom:10%;left:23%}.archive-particles i:nth-child(6){bottom:18%;right:27%;width:2px;height:2px}
.book-pedestal{position:absolute;z-index:-1;left:50%;bottom:5%;width:min(67%,330px);height:79px;transform:translateX(-50%);pointer-events:none}
.pedestal-ring{position:absolute;left:50%;top:30%;transform:translateX(-50%) rotateX(68deg);border:1px solid rgba(var(--accent-rgb),.48);border-radius:50%;box-shadow:0 0 18px rgba(var(--accent-rgb),.22),inset 0 0 16px rgba(var(--accent-rgb),.1)}
.pedestal-ring-outer{width:100%;height:80px;border-width:1px}
.pedestal-ring-inner{top:40%;width:68%;height:56px;border-style:dashed;opacity:.7}
.pedestal-core{position:absolute;left:19%;right:19%;top:44%;height:22px;border-radius:50%;background:radial-gradient(ellipse,rgba(var(--accent-rgb),.19),transparent 74%);filter:blur(6px)}
.showcase-insignia{position:absolute;pointer-events:none;left:20px;bottom:64px;display:flex;align-items:center;gap:8px;color:rgba(var(--accent-rgb),.67);font:700 8px var(--sans);letter-spacing:.18em}
.insignia-shard{font:29px/1 var(--serif);color:var(--accent)}
.showcase-insignia b{font-weight:800}
.book-ground{bottom:8%;background:rgba(4,3,12,.9);filter:blur(18px);opacity:.5}
.reader-panel{isolation:isolate;overflow:hidden;background:linear-gradient(150deg,rgba(15,9,32,.95),rgba(14,9,29,.81) 64%,rgba(18,10,33,.89))}
.reader-decor{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.reader-decor::after{content:"";position:absolute;bottom:-118px;right:-125px;width:340px;height:340px;border-radius:50%;border:1px solid rgba(var(--accent-rgb),.12);box-shadow:0 0 0 29px rgba(var(--accent-rgb),.018),0 0 0 61px rgba(var(--accent-rgb),.014),0 0 0 96px rgba(var(--accent-rgb),.01)}
.reader-halo{position:absolute;width:190px;height:190px;right:-94px;top:-110px;border-radius:50%;border:1px solid rgba(var(--accent-rgb),.22);box-shadow:0 0 0 17px rgba(var(--accent-rgb),.025),0 0 0 35px rgba(var(--accent-rgb),.015)}
.reader-shard{position:absolute;bottom:42px;right:33px;font:64px/1 var(--serif);color:rgba(var(--accent-rgb),.095)}
.reader-top,.reader-panel h2,.status-line,.reader-tabs,.reader-content,.reader-actions,.reader-bottom{position:relative;z-index:2}
.reader-top{border-bottom:1px solid rgba(var(--accent-rgb),.15);padding-bottom:10px}
.reader-panel h2{text-shadow:0 0 27px rgba(var(--accent-rgb),.06)}
.reader-content{scrollbar-color:rgba(var(--accent-rgb),.38) transparent}
.reader-tabs button.is-active:after{box-shadow:0 0 12px rgba(var(--accent-rgb),.3)}
.reader-bottom{color:#bda8cf}
.library-footer{background:linear-gradient(90deg,transparent,rgba(var(--accent-rgb),.035),transparent)}
@media(max-width:1200px){.archive-orbit-system{width:min(97%,475px)}.showcase-insignia{bottom:56px;left:11px}.rail-illustration{height:37%}}
@media(max-width:940px){.showcase-insignia{bottom:55px}.book-pedestal{bottom:4%}.rail-illustration{height:30%;bottom:60px}}
@media(max-width:600px){.rail-illustration,.showcase-insignia{display:none}.archive-crest{display:none}.archive-orbit-system{width:min(100%,400px)}.book-pedestal{bottom:3%;height:57px}.reader-decor::after{opacity:.55}}
@media(prefers-reduced-motion:reduce){.archive-orbit-system,.archive-particles,.book-pedestal{animation:none}}
/* La ilustración orbital se mueve muy despacio solo en dispositivos con ratón;
   el libro, la página y el fondo permanecen quietos. */
@keyframes archiveDial{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .archive-orbit-system{animation:archiveDial 100s linear infinite}
}
@media (hover:none), (pointer:coarse), (prefers-reduced-motion:reduce){
  .archive-orbit-system{animation:none!important}
}


/* ── Paisajes cinematográficos aprobados · Libro I ──
   Tres imágenes separadas, sin ilustraciones SVG flotantes ni capas duplicadas. */
.library-bg{
  background-image:url('../assets/fondo-libros-4k.webp');
  background-position:center 46%; background-size:cover;
  opacity:.70;filter:blur(3px);transform:scale(1.015);animation:none;
}
.library-tint{
  background:linear-gradient(90deg,rgba(8,6,19,.83),rgba(9,7,22,.72) 50%,rgba(8,6,19,.84)),
             linear-gradient(180deg,rgba(7,5,15,.68),rgba(8,5,17,.36) 48%,rgba(7,5,15,.71));
}
.heading-story::before{
  background-image:url('../assets/fondo-libros-4k.webp');
  background-position:center 22%;opacity:.40;filter:none;
}
/* Ilustración del panel izquierdo: sin cambiar portadas, nombres ni botones. */
.volume-rail{background:linear-gradient(150deg,rgba(17,12,35,.89),rgba(8,6,18,.84) 85%)}
.rail-illustration,
.theme-crimson .rail-illustration{
  left:0;right:0;bottom:46px;height:70%;
  background-image:linear-gradient(180deg,rgba(12,8,25,.13),rgba(10,7,21,.09) 65%,rgba(10,7,21,.62)),url('../assets/coleccion-libros-vertical.webp');
  background-position:center bottom,center 67%;background-size:cover,cover;
  opacity:.73;filter:none;
  mask-image:linear-gradient(to bottom,transparent 0%,#000 24%,#000 75%,transparent 100%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 24%,#000 75%,transparent 100%);
}
.rail-illustration span{color:#cfbde3;text-shadow:0 1px 10px #070613}
.rail-bottom{background:linear-gradient(to bottom,rgba(11,8,24,.25),rgba(11,8,24,.91))}
/* Imagen central única, con 16px de aire a la izquierda y fundidos suaves a gris violáceo. */
.book-environment{
  width:calc(100% - 12px);margin-left:12px;
  background-image:
    linear-gradient(90deg,rgba(13,10,27,.84) 0%,rgba(13,10,27,.12) 9%,transparent 21%,transparent 83%,rgba(13,10,27,.30) 100%),
    linear-gradient(180deg,rgba(13,10,27,.28),transparent 13%,transparent 74%,rgba(13,10,27,.53) 100%),
    url('../assets/escenario-libros-4k.webp');
  background-size:cover; background-position:center center; background-repeat:no-repeat;
  border:0;
}
/* Anular el círculo generado por CSS y adornos heredados.
   La plataforma y las esferas son exclusivamente parte de la ilustración. */
.scene-orb,.archive-orbit-system,.archive-particles,.showcase-orbit,.book-pedestal,.book-ground{display:none!important}
.book-environment .book-stage{position:relative;z-index:3}
.showcase-top,.book-controls{position:relative;z-index:4}
.showcase{background:linear-gradient(180deg,rgba(13,10,27,.95),rgba(13,10,27,.87));}
/* El arte nuevo está aprobado solo para el Libro I. El Libro II conserva un entorno neutro hasta diseñarlo. */
body.theme-crimson .rail-illustration{display:none}
body.theme-crimson .book-environment{background:radial-gradient(ellipse at center,rgba(250,120,150,.10),rgba(13,6,27,.4) 56%,rgba(6,5,17,.67))}
@media(max-width:940px){.book-environment{margin-left:7px;width:calc(100% - 7px)}}
@media(max-width:600px){.book-environment{margin-left:0;width:100%;background-position:center center}}


/* ── 2026-10-30 · Distribución escalable del archivo editorial ──
   La colección puede crecer sin cubrir la lámina ilustrada inferior.
   Solamente la lista se desplaza; la ilustración y el pie son estables. */
@media (min-width:601px){
  .volume-rail{display:flex;flex-direction:column;min-height:0;overflow:hidden}
  .rail-heading{flex:0 0 auto}
  .volume-list{
    flex:1 1 auto;min-height:100px;max-height:none;
    overflow-y:auto;overflow-x:hidden;
    overscroll-behavior:contain;
    padding:14px 4px 8px 0;
    scrollbar-width:thin;
    scrollbar-color:rgba(var(--accent-rgb),.5) transparent;
  }
  .volume-choice{flex:0 0 auto}
  .rail-illustration,.theme-crimson .rail-illustration{
    position:relative;flex:0 0 clamp(142px,22vh,215px);
    width:100%;height:auto;left:auto;right:auto;bottom:auto;
    background-position:center bottom,center 69%;
    background-size:cover,cover;
    opacity:.78;
    mask-image:linear-gradient(to bottom,transparent 0%,#000 15%,#000 84%,transparent 100%);
    -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 15%,#000 84%,transparent 100%);
  }
  .rail-bottom{position:relative;flex:0 0 auto;margin-top:0;padding-top:11px}
}
/* El paisaje llena su panel desde el margen aprobado y se funde con el marco;
   el fundido afecta solo al paisaje, nunca al libro interactivo. */
@media(min-width:601px){
  .showcase{padding-left:5px;padding-right:5px}
  .showcase-top{padding-left:7px;padding-right:7px}
  .book-environment,
  body.theme-crimson .book-environment{
    width:100%;margin-left:0;
    background:none;
  }
  .book-environment::before{
    content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
    background-image:url('../assets/escenario-libros-4k.webp');
    background-size:cover;background-repeat:no-repeat;
    background-position:center 50%;
    -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 2%,#000 98%,transparent 100%);
    mask-image:linear-gradient(to right,transparent 0%,#000 2%,#000 98%,transparent 100%);
  }
  body.theme-crimson .book-environment::before{display:none}
  .book-environment .book-stage{z-index:3}
  .showcase-insignia{z-index:4}
}
@media(min-width:601px) and (max-width:940px){
  /* La ilustración sigue reservada en la tablet; no se mezcla con la lista. */
  .volume-list{overflow-y:auto;min-height:110px}
  .rail-illustration,.theme-crimson .rail-illustration{flex-basis:clamp(135px,19vh,190px)}
}
@media(max-width:600px){
  /* En teléfonos: cuadrícula de libros legible y lámina decorativa oculta. */
  .volume-list{flex:none;overflow:visible;min-height:0;max-height:none}
  .volume-rail .rail-illustration{display:none}
}

/* Paginación de LIBROS / LORE — dos tarjetas exactas por vista. */
.volume-rail{position:relative;isolation:isolate;}
.rail-tabs{position:relative;z-index:3;display:grid;grid-template-columns:1fr 1fr;flex:0 0 auto;margin:0 0 12px;border-bottom:1px solid var(--border);gap:5px;}
.rail-tabs button{border:0;background:none;color:#aaa0c1;min-height:37px;font-size:10px;font-weight:800;letter-spacing:.14em;position:relative;}
.rail-tabs button.is-active{color:#f4e7ff;}
.rail-tabs button.is-active:after{content:"";height:2px;position:absolute;left:4px;right:4px;bottom:-1px;background:var(--accent);box-shadow:0 0 12px rgba(var(--accent-rgb),.4);}
.rail-heading{position:relative;z-index:3;flex:0 0 auto;padding:0 6px 8px;}
.rail-collection{position:relative;z-index:3;display:flex;flex-direction:column;flex:0 0 auto;min-height:0;}
.rail-collection[hidden],.rail-lore[hidden],.rail-page-button[hidden]{display:none!important;}
.rail-collection .volume-list{flex:0 0 auto;min-height:0;max-height:none;overflow:hidden;display:flex;flex-direction:column;gap:9px;padding:12px 0 0;}
.rail-collection .volume-choice{flex:0 0 auto;min-height:clamp(90px,12vh,114px);}
.rail-pages{display:flex;align-items:center;justify-content:center;position:relative;flex:none;min-height:42px;gap:14px;padding:2px 0 0;}
.rail-page-button{background:transparent;border:0;color:#e5c8ff;font:normal 36px/1 var(--serif);min-width:36px;min-height:34px;display:grid;place-items:center;cursor:pointer;text-shadow:0 0 15px rgba(var(--accent-rgb),.65);}
.rail-page-button:hover{color:#fff;transform:translateY(-1px);}
.rail-page-caption{font-size:9px;letter-spacing:.2em;color:#d2bce3;}
.volume-choice.is-placeholder{opacity:.78;cursor:default;background:rgba(13,9,30,.60);border-color:rgba(var(--accent-rgb),.17)}
.volume-future-cover{width:62px;height:93px;flex:none;display:grid;place-items:center;border:1px solid rgba(var(--accent-rgb),.24);background:radial-gradient(circle at 50% 35%,rgba(var(--accent-rgb),.16),#151026 70%);color:rgba(var(--accent-rgb),.55);font:48px/1 var(--serif);}
.rail-lore{position:relative;z-index:3;flex:0 0 auto;display:flex;flex-direction:column;gap:12px;text-align:center;padding:20px 12px 27px;background:rgba(12,9,29,.53);border:1px solid rgba(var(--accent-rgb),.2)}
.rail-lore-sigil{font:55px/1 var(--serif);color:var(--accent)}
.rail-lore h3{font:500 23px/1.1 var(--serif);margin:0;color:#f4e9ff}
.rail-lore p{font-size:11px;line-height:1.6;color:#d1c3e0;margin:0}
.rail-lore-status{font:800 8px/1.6 var(--sans);color:var(--accent);letter-spacing:.17em}
/* Ilustración en continuidad con la escena central, oscura donde están los libros. */
.rail-illustration,.theme-crimson .rail-illustration{position:absolute!important;inset:32% 0 47px!important;width:auto!important;height:auto!important;display:block;z-index:0!important;opacity:.88;pointer-events:none;flex:none!important;background-image:linear-gradient(180deg,rgba(12,9,27,.92) 0%,rgba(12,9,27,.48) 27%,transparent 64%,rgba(10,8,23,.4) 100%),url('../assets/continuacion-izquierda-libro-i.webp')!important;background-size:cover,cover!important;background-position:center center,center bottom!important;mask-image:linear-gradient(to bottom,transparent 0%,#000 20%,#000 90%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 20%,#000 90%,transparent 100%);}
.rail-bottom{position:relative;z-index:3;margin-top:auto;background:linear-gradient(180deg,rgba(12,8,27,.12),rgba(12,8,27,.85))}
/* Extensión tenue del cielo hacia la derecha; siempre detrás de la lectura. */
.reader-panel{position:relative;isolation:isolate;}
.reader-panel::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(90deg,rgba(12,9,26,.51),rgba(12,9,26,.77) 40%,rgba(12,9,26,.90)),linear-gradient(180deg,rgba(12,9,26,.45),rgba(12,9,26,.5) 30%,rgba(12,9,26,.95) 86%),url('../assets/extension-derecha-libro-i.webp');background-size:cover,cover,cover;background-position:center,center,center center;opacity:.78;}
body.theme-crimson .reader-panel::before{opacity:0;}
@media(max-height:750px) and (min-width:941px){.rail-collection .volume-choice{min-height:87px}.rail-collection .volume-choice img,.volume-future-cover{width:49px;height:74px}.rail-page-button{font-size:30px;min-height:24px}.rail-pages{min-height:28px}.rail-tabs button{min-height:29px}.rail-tabs{margin-bottom:6px}.rail-collection .volume-list{gap:5px;padding-top:8px}}
@media(max-width:940px){.rail-collection .volume-choice{min-height:88px}.rail-collection .volume-choice img,.volume-future-cover{width:44px;height:69px}.rail-pages{min-height:33px}.rail-tabs{margin-bottom:6px}}
@media(max-width:600px){.volume-rail{padding:12px}.rail-heading{display:flex}.rail-tabs{margin-bottom:8px}.rail-collection .volume-list{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:8px 0 0}.rail-collection .volume-choice{min-height:90px}.rail-collection .volume-choice img,.volume-future-cover{width:42px;height:64px}.rail-pages{min-height:38px}.rail-illustration{display:none!important}}
/* Flechas visibles y táctiles, sin depender de glifos de la fuente. */
.rail-page-button{min-width:40px;min-height:35px;border:1px solid rgba(var(--accent-rgb),.42);background:rgba(13,8,31,.74);border-radius:9px;box-shadow:0 0 14px rgba(var(--accent-rgb),.08)}
.rail-page-button span{display:none}
.rail-page-button::before{content:"";display:block;width:10px;height:10px;border-bottom:2px solid var(--accent);border-right:2px solid var(--accent);transform:translateY(-3px) rotate(45deg);filter:drop-shadow(0 0 5px rgba(var(--accent-rgb),.65));}
#books-prev::before{transform:translateY(3px) rotate(225deg)}
.rail-page-button:hover{background:rgba(var(--accent-rgb),.2)}