:root{color-scheme:light;--ink:#282b28;--paper:#fff;--grey:#747573}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:radial-gradient(ellipse at 50% 42%,#a0a19e 0,#82837f 54%,#696b68 100%);display:grid;grid-template-rows:86px minmax(0,1fr) 88px}button,input{font:inherit}button{cursor:pointer;border:0;background:none;color:inherit}button:disabled{opacity:.35;cursor:default}button:focus-visible,input:focus-visible{outline:2px solid #242a24;outline-offset:4px}header{margin:18px 28px 0;padding:0 22px;display:flex;align-items:center;justify-content:space-between;gap:20px;background:#f6f5f0ee;border:1px solid #fff4;box-shadow:0 6px 28px #2221;border-radius:4px}.brand{font-family:Georgia,serif;letter-spacing:2px;font-size:17px;text-align:left;white-space:nowrap}.brand span{display:block;font:9px Arial,sans-serif;letter-spacing:3.5px;margin-top:6px}nav{display:flex;align-items:center;gap:5px}nav button{padding:12px 14px;font-size:21px;display:flex;gap:8px;align-items:center}nav span{font-size:11px;letter-spacing:.4px}nav button:hover:not(:disabled){background:#00000008}.viewer{position:relative;min-height:0;padding:28px 78px 20px;display:flex;justify-content:center;align-items:center}.book-stage{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:center;filter:drop-shadow(0 20px 20px #181b183d)}#book{margin:auto}.book-page{background:#fff;overflow:hidden}.book-page>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none;pointer-events:none}.book-page:after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 1px 0 6px #0000000a}.book-page.cover{background:#70706f}.cover>img{inset:20%;width:60%;height:60%;object-fit:contain}.stf__item.--left{box-shadow:inset -12px 0 20px -18px #0008}.stf__item.--right{box-shadow:inset 12px 0 20px -18px #0008}.page-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:70px;font:42px Georgia;color:#fff;border:1px solid #ffffff38;border-radius:28px}.page-nav:hover:not(:disabled){background:#fff2}.prev{left:20px}.next{right:20px}footer{position:relative;color:#f5f4ef;display:flex;justify-content:space-between;align-items:center;padding:0 32px 20px;gap:18px;font-size:11px}.edition{letter-spacing:2px;font-size:10px}.reader-nav{display:flex;align-items:center;gap:14px}.reader-nav button{color:inherit;padding:10px}#pageCount{min-width:110px;text-align:center;letter-spacing:1px;font-size:12px}#jumpForm{display:flex;align-items:center;gap:6px}#jump{width:66px;border:1px solid #fff5;color:#fff;background:#ffffff12;padding:8px 4px;border-radius:3px;text-align:center;font-size:11px}#jump::placeholder{color:#fffb}#progress{position:absolute;bottom:8px;left:32px;width:calc(100% - 64px);height:2px;accent-color:#fff;cursor:pointer}.hint{color:#eee;letter-spacing:.2px}dialog{border:0;border-radius:5px;padding:28px;color:var(--ink);background:#f6f5f1;max-height:88dvh;box-shadow:0 30px 100px #0005;width:min(960px,92vw)}dialog::backdrop{background:#242623a8;backdrop-filter:blur(7px)}.dialog-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:24px}.dialog-head small{font-size:10px;letter-spacing:2px}.dialog-head h2{font:normal 28px Georgia;margin:10px 0}.dialog-head p{font-size:12px;color:#666}.dialog-head button,[data-close]{font-size:28px;padding:0 8px}#thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}#thumbs button{padding:7px;text-align:left;border:1px solid #d9d9d3;border-radius:2px}#thumbs button:hover,#thumbs button[aria-current=true]{border-color:#484d46;background:#e5e4dc}#thumbs img{display:block;width:100%;aspect-ratio:1;object-fit:contain;background:white}#thumbs .cover-thumb{background:#70706f;object-fit:contain;padding:20%}#thumbs span{display:block;margin:9px 0 2px;font-size:11px}#zoomDialog{padding:0;width:96vw;max-width:1500px;height:94dvh;max-height:94dvh;overflow:hidden}.zoom-toolbar{height:62px;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ccc;font-size:12px}.zoom-toolbar div{display:flex;align-items:center;gap:16px}.zoom-toolbar button{font-size:23px;min-width:30px}#zoomViewport{height:calc(100% - 62px);overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y;cursor:zoom-in}#zoomSurface{display:flex;align-items:center;justify-content:center;min-width:100%;min-height:100%}#zoomImage{display:block;object-fit:contain;background:white;max-width:none}#shareDialog{max-width:560px}#shareDialog p{font-size:13px;line-height:1.7}#shareDialog label{display:block;font-size:11px;margin:24px 0 8px}#shareLink{width:100%;padding:12px;border:1px solid #bbb;background:white;font-size:12px}.share-actions{display:flex;gap:12px;margin:18px 0}.share-actions button{padding:12px 18px;background:#30352f;color:white;border-radius:3px}#shareDialog .small{font-size:11px;color:#666}#videoDialog video{width:100%;display:block}#toast{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);background:#252a25;color:white;border-radius:3px;padding:12px 20px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s;z-index:100}#toast.show{opacity:1}@media(max-width:760px){body{grid-template-rows:112px minmax(0,1fr) 110px}header{margin:10px 12px 0;padding:14px;flex-direction:column;gap:12px}.brand{text-align:center;font-size:14px}.brand span{font-size:8px;margin-top:3px}nav{width:100%;justify-content:space-around}nav button{padding:0 7px;font-size:20px}nav span{font-size:10px}.video-tool{display:none!important}.viewer{padding:12px 36px}.page-nav{width:26px;height:48px;font-size:28px}.prev{left:4px}.next{right:4px}footer{padding:4px 12px 22px;justify-content:center;flex-wrap:wrap;gap:0}.edition{width:100%;text-align:center;font-size:8px}.hint{display:none}.reader-nav{gap:8px}#pageCount{font-size:11px}#progress{left:16px;width:calc(100% - 32px)}#thumbs{grid-template-columns:repeat(3,1fr);gap:8px}dialog{padding:18px}.zoom-toolbar{padding:8px;font-size:10px}.zoom-toolbar div{gap:6px}.zoom-toolbar button{min-width:24px}}@media(max-height:520px){body{grid-template-rows:58px minmax(0,1fr) 60px}header{margin:6px 12px 0;padding:8px 14px;flex-direction:row}.brand{font-size:12px}.brand span{display:none}nav{width:auto}.viewer{padding:10px 50px}footer{flex-wrap:nowrap;padding-bottom:15px}.edition,.hint{display:none}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
body>*{min-width:0}.book-stage,#book{min-width:0}.viewer{overflow:hidden}.stf__item.--left:after{background:linear-gradient(to left,#0000000e,transparent 4%)}.stf__item.--right:after{background:linear-gradient(to right,#0000000e,transparent 4%)}body.focus-mode{grid-template-rows:52px minmax(0,1fr) 48px}body.focus-mode header{margin:0;border-radius:0;background:#f6f5f0}body.focus-mode .brand,body.focus-mode .edition,body.focus-mode .hint{display:none}body.focus-mode nav{margin:auto}body.focus-mode footer{padding:0 20px 10px}body.focus-mode .viewer{padding-top:12px;padding-bottom:12px}body.focus-mode header{flex-direction:row}
#book.closed{transform:translateX(-25%)}
#chapterGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:25px}#chapterGrid button{padding:0 0 12px;border:1px solid #d7d6cf;border-radius:3px;overflow:hidden;text-align:left;background:#eeede7}#chapterGrid button[aria-pressed=true]{outline:2px solid #5b6355;outline-offset:2px;background:white}#chapterGrid img{display:block;width:100%;height:106px;object-fit:cover;object-position:center}#chapterGrid strong{display:block;font:normal 16px Georgia;margin:11px 10px 5px}#chapterGrid span{display:block;font-size:10px;color:#666;margin:0 10px}.index-subhead{display:flex;align-items:center;gap:15px;margin:0 0 17px;padding-top:20px;border-top:1px solid #d7d6cf}.index-subhead h3{font:normal 20px Georgia;margin:0}.index-subhead span{font-size:11px;color:#666}.index-subhead button{margin-left:auto;text-decoration:underline;font-size:12px}#videoDialog{width:min(1200px,96vw);padding:0;background:#252824;color:#f7f6f0}.film-head{display:flex;justify-content:space-between;align-items:center;padding:10px 20px;font-size:10px;letter-spacing:2px}#videoDialog video{max-height:74dvh;background:#70706f}.film-credit{font-size:10px;line-height:1.6;padding:10px 20px;color:#c2c5bd}.film-credit a{color:inherit}@media(max-width:760px){#chapterGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}#chapterGrid img{height:82px}#chapterGrid strong{font-size:14px}.index-subhead{flex-wrap:wrap;gap:8px}.index-subhead h3{font-size:18px}.video-tool:not(:disabled){display:flex!important}nav{gap:0}nav button{padding:0 4px;font-size:18px}nav span{font-size:9px}}
/* Gris más profundo y tres cantos discretos de papel bajo el álbum. */
body{background:radial-gradient(ellipse at 50% 42%,#747772 0,#61645f 55%,#4d514c 100%)}
.book-stage{isolation:isolate}#book{position:relative;z-index:1}.paper-stack{position:absolute;z-index:0;pointer-events:none;left:50%;top:50%;width:calc(var(--leaf-size,300px)*2);height:var(--leaf-size,300px);transform:translate(-50%,-50%);background:#fefefe;box-shadow:1px 2px 0 #afb2aa,2px 3px 0 #f5f5ef,3px 5px 0 #bfc1b9,4px 6px 0 #fff,5px 8px 0 #a3a69d,6px 9px 0 #eeeFE8}.book-stage.is-closed .paper-stack{width:var(--leaf-size,300px)}
@media(max-width:760px){.paper-stack{box-shadow:1px 1px 0 #bfc1b9,2px 3px 0 #fff,3px 4px 0 #a3a69d,4px 5px 0 #f0f0e9}}
/* El vídeo ocupa toda la ventana; las fotos llenan su encuadre 16:9. */
#videoDialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:0;border-radius:0;background:#101210;overflow:hidden}
#videoDialog video{width:100%;height:100%;max-height:none;object-fit:contain;background:#101210}
#videoDialog .film-head{position:absolute;z-index:2;top:0;left:0;right:0;color:#fff;background:linear-gradient(#0008,transparent);padding:12px 22px;pointer-events:none}
#videoDialog .film-head button{pointer-events:auto;background:#24282499;border-radius:50%;width:40px;height:40px;line-height:1}
#videoDialog .film-credit{position:absolute;z-index:2;bottom:58px;left:0;right:0;text-align:center;color:#eee;background:#15181599;opacity:0;pointer-events:none}
#videoDialog:hover .film-credit,#videoDialog:focus-within .film-credit{opacity:1;pointer-events:auto}
/* Índice lateral: listado editorial basado en el panel de The Arch. */
#contentsDialog{position:fixed;inset:0 auto 0 0;margin:0;width:min(390px,92vw);max-width:none;height:100dvh;max-height:100dvh;border-radius:0;padding:30px 24px;background:#f5f5f3;box-shadow:20px 0 60px #0005;overflow-y:auto}
#contentsDialog[open]{animation:drawer-in .28s ease-out}#contentsDialog::backdrop{background:#15181555;backdrop-filter:none}
#contentsDialog .dialog-head{margin:0 -24px 18px;padding:0 24px 22px;border-bottom:1px solid #3332}#contentsDialog .dialog-head h2{font-size:30px}#contentsDialog .dialog-head p{line-height:1.6;margin-bottom:0}
#contentsDialog [hidden]{display:none!important}
#contentsDialog #chapterGrid{display:flex;flex-direction:column;gap:3px;margin:0}
#contentsDialog #chapterGrid button{display:flex;align-items:center;gap:17px;width:100%;text-align:left;padding:15px 10px;border:0;border-radius:7px;background:transparent;min-height:65px;transition:background .2s,transform .2s}
#contentsDialog #chapterGrid button:hover{background:#e7e7e1;transform:translateX(3px)}#contentsDialog #chapterGrid b{font:23px Georgia;color:#999c94}#contentsDialog #chapterGrid span{display:flex;flex-direction:column;gap:5px;margin:0}#contentsDialog #chapterGrid strong{font:14px Arial;margin:0;color:#343834}#contentsDialog #chapterGrid small{font-size:11px;color:#83867e}
.index-all{display:flex;width:100%;justify-content:space-between;margin-top:18px;padding:20px 10px;border-top:1px solid #3332;font-size:12px;text-align:left}
#contentsDialog .index-subhead{flex-wrap:wrap;border:0;padding:0;margin-top:5px;gap:9px}#contentsDialog #showAllPages{order:-1;width:100%;margin:0 0 12px;text-align:left;padding:8px 0;font-size:12px}#contentsDialog #chapterTitle{width:100%;font-size:24px}#contentsDialog #chapterCount{margin-bottom:10px}
#contentsDialog #thumbs{display:flex;flex-direction:column;gap:0}#contentsDialog #thumbs button{display:flex;gap:15px;align-items:center;padding:10px 4px;border:0;border-bottom:1px solid #3331}#contentsDialog #thumbs img{width:68px;height:48px;aspect-ratio:auto;object-fit:contain}#contentsDialog #thumbs span{margin:0;font-size:12px}#contentsDialog #thumbs .cover-thumb{padding:5px;background:#70706f}
@keyframes drawer-in{from{transform:translateX(-100%)}to{transform:translateX(0)}}@media(prefers-reduced-motion:reduce){#contentsDialog[open]{animation:none}}

/* Fondo carbón neutro, menú claro y pliegue continuo sobre toda la hoja. */
body{background:radial-gradient(ellipse at 50% 42%,#60625f 0,#4d504d 55%,#3e413e 100%)}
header,body.focus-mode header{background:#fafaf8;border-color:#ffffff80}
#contentsDialog{background:#fafaf8}
.stf__item.--left,.stf__item.--right{box-shadow:none}
.book-page:after{z-index:3;box-shadow:none}
.stf__item.--left:after{background:linear-gradient(to left,rgba(0,0,0,.20) 0,rgba(0,0,0,.09) 1.2%,rgba(0,0,0,.025) 3%,transparent 6%)}
.stf__item.--right:after{background:linear-gradient(to right,rgba(0,0,0,.20) 0,rgba(0,0,0,.09) 1.2%,rgba(0,0,0,.025) 3%,transparent 6%)}
.book-page.cover:after{background:none}

/* Iconos de trazo uniforme y lectura sin distracciones. */
.ui-icon{width:21px;height:21px;display:block;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sound-slash{display:none}.is-muted .sound-waves{display:none}.is-muted .sound-slash{display:block}
.page-nav{display:grid;place-items:center}.page-nav .ui-icon{width:26px;height:26px;stroke-width:1.3}
header,footer,.page-nav{transition:opacity .4s ease}
body.reader-idle header,body.reader-idle footer,body.reader-idle .page-nav{opacity:0;pointer-events:none}
body.reader-idle header:has(:focus-visible),body.reader-idle footer:has(:focus-visible),body.reader-idle .page-nav:focus-visible{opacity:1;pointer-events:auto}
@media(max-width:760px){nav .ui-icon{width:18px;height:18px}.page-nav .ui-icon{width:20px;height:20px}}

/* Gris antracita y menús gris perla. */
body{background:radial-gradient(ellipse at 50% 42%,#3c3e3c 0,#303330 55%,#242724 100%)}
header,body.focus-mode header,#contentsDialog{background:#ddded9;border-color:#e8e9e350}
#zoomReset{font-size:12px;padding:8px 10px;border:1px solid #b9bcb5;border-radius:3px}
#zoomViewport{cursor:default}#zoomImage{cursor:zoom-in}
@media(max-width:760px){.zoom-toolbar{height:auto;min-height:88px;flex-wrap:wrap;gap:6px}.zoom-toolbar>span{width:100%}.zoom-toolbar>div{width:100%;justify-content:space-between;gap:4px}#zoomViewport{height:calc(100% - 88px)}#zoomReset{font-size:11px;padding:6px}}

/* Cantos laterales: hojas ligeramente escalonadas, sin líneas inferiores. */
.paper-stack{background:transparent;box-shadow:none}
.paper-stack::before,.paper-stack::after{content:"";position:absolute;top:2px;bottom:2px;width:7px;background:linear-gradient(to right,#b6b7b0 0 1px,#f3f3ee 1px 3px,#bfc0b9 3px 4px,#fafaf6 4px 6px,#b0b2aa 6px);box-shadow:0 1px 3px #0002}
.paper-stack::before{left:-6px;clip-path:polygon(90% 0,100% 0,100% 100%,65% 100%,0 99%,0 1%)}
.paper-stack::after{right:-6px;transform:scaleX(-1);clip-path:polygon(90% 0,100% 0,100% 100%,65% 100%,0 99%,0 1%)}
.book-stage.is-closed .paper-stack::before{display:none}
@media(max-width:760px){.paper-stack{box-shadow:none}.paper-stack::before{left:-4px;width:5px}.paper-stack::after{right:-4px;width:5px}}
