/* Photographic sky and a rigid, case-bound hardcover collection. */
html{overflow-x:clip}
.hero{background:#080d12;min-height:830px}
.hero-art{inset:0;background:url('assets/milky-way-sharp.webp') center center/cover no-repeat;opacity:.82;mix-blend-mode:normal;z-index:-3}
.hero-art:before{background:linear-gradient(90deg,#070c11f5 0%,#070c11d9 28%,#070c1150 60%,#070c1122),linear-gradient(0deg,#090d0c 0%,#090d0c55 20%,transparent 60%,#070c1155 100%)}
.hero:after{background:linear-gradient(180deg,transparent 65%,#090d0c);z-index:-2}
.meteor-sky{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}
.hero-inner{grid-template-columns:minmax(0,.65fr) minmax(0,1.5fr);gap:4.5%;padding:180px 5.5% 150px;max-width:1760px;min-height:830px}
.hero h1{font-size:clamp(2.8rem,3.65vw,4.3rem);letter-spacing:.012em}
.hero-description{color:#bcc4c9}
.hero-showcase{height:auto;perspective:none;isolation:auto;margin-top:48px;padding:34px 2% 64px}
.cover-fan{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4%;height:auto;align-items:end;transform:none!important;transform-style:preserve-3d}
.hero-book{position:relative!important;left:auto!important;top:auto!important;width:100%!important;aspect-ratio:2/3;z-index:auto!important;animation:none!important;--rest-y:-25deg;--rest-x:2deg}
.hero-book-1,.hero-book-2,.hero-book-3,.hero-book-4{--rotation:0deg;--scale:1;--float:0px}
.showcase-caption{bottom:0;font-size:.65rem;letter-spacing:.13em;gap:12px;white-space:nowrap;color:#d5c49f}
.showcase-caption span{width:22px}
[data-book="1"]{--case-color:#281617}[data-book="2"]{--case-color:#14262d}[data-book="3"]{--case-color:#332719}[data-book="4"]{--case-color:#152a1b}
.hero-book,.cover-button,.begin-cover{--book-depth:42px;--board:3px;--inset:4px;--paper-depth:calc(var(--book-depth) - 8px);--pointer-x:0deg;--pointer-y:0deg;--light-x:35%;padding:0;border:0;background:none;transform-style:preserve-3d;filter:none!important;box-shadow:none!important;isolation:auto;transition:transform .65s cubic-bezier(.2,.75,.2,1);transform:perspective(1500px) rotateX(calc(var(--rest-x,2deg) + var(--pointer-x))) rotateY(calc(var(--rest-y,-18deg) + var(--pointer-y)))}
.hero-book{--book-depth:clamp(24px,2.4vw,38px)}
.hero-book:before,.cover-button:before,.begin-cover:before{content:'';position:absolute;left:-10%;right:-20%;height:20%;bottom:-10%;background:radial-gradient(ellipse,#000d,transparent 68%);transform:rotateX(65deg) translateZ(-35px);pointer-events:none}
.hero-book:hover,.hero-book:focus-visible,.cover-button:hover,.cover-button:focus-visible{transform:perspective(1500px) translateY(-8px) rotateX(calc(2deg + var(--pointer-x))) rotateY(calc(-32deg + var(--pointer-y)));filter:none!important;box-shadow:none!important}
.cover-button{display:block;width:100%;aspect-ratio:2/3;--rest-y:-22deg;--rest-x:2deg}
.begin-cover{width:100%;aspect-ratio:2/3;--rest-y:-21deg;--rest-x:3deg}
.begin-cover:hover{transform:perspective(1500px) translateY(-6px) rotateX(calc(3deg + var(--pointer-x))) rotateY(calc(-24deg + var(--pointer-y)))}
.book-card{perspective:none;padding:26px 26px 0;background:linear-gradient(180deg,#ffffff03,transparent 65%);border-color:#ffffff09}
.book-card:hover{background:linear-gradient(180deg,#ffffff05,transparent 65%);border-color:#c8ad7040}
.book-volume{display:block;position:relative;width:100%;height:100%;aspect-ratio:2/3;transform-style:preserve-3d;isolation:auto}
.book-front,.book-back{position:absolute;inset:0;backface-visibility:hidden;background:var(--case-color,#19221b);border-radius:2px 4px 4px 2px}
.book-front{transform:translateZ(calc(var(--book-depth)/2));overflow:hidden;box-shadow:0 1px 2px #000b,inset 0 0 0 1px #ffffff15}
/* The rear board has an opaque inner face as well as an outer cover.
   Culling the entire board made the sky visible behind the page block. */
.book-back{transform:translateZ(calc(var(--book-depth)/-2)) rotateY(180deg);-webkit-backface-visibility:visible;backface-visibility:visible;transform-style:preserve-3d;background:var(--case-color,#19221b);box-shadow:0 0 0 1px #302e27}
.book-back:before,.book-back:after{content:'';position:absolute;inset:0;border-radius:inherit;-webkit-backface-visibility:hidden;backface-visibility:hidden;background-color:var(--case-color,#19221b);pointer-events:none}
.book-back:before{transform:translateZ(.2px);background-image:linear-gradient(#0009,#0009),var(--cover-art);background-position:center;background-size:cover}
.book-back:after{transform:rotateY(180deg) translateZ(.2px);background-image:linear-gradient(90deg,#0005,transparent 18%,#ffffff08 90%,#0004);box-shadow:inset 0 0 0 1px #ffffff12}
.book-front>img:not(.cover-motion){display:block;width:100%;height:100%;object-fit:cover}
.book-front:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#0008 0%,#0002 2.2%,#ffffff20 2.8%,#0004 3.3%,transparent 5.2%,transparent 98.7%,#ffffff2b 99.4%,#0005),radial-gradient(ellipse at var(--light-x) 15%,#ffffff12,transparent 65%);box-shadow:inset 0 1px #ffffff25,inset 0 -1px #0007}
.book-pages{position:absolute;left:calc(100% - var(--inset) - var(--paper-depth)/2);top:var(--inset);width:var(--paper-depth);height:calc(100% - var(--inset)*2);transform:rotateY(90deg);background:linear-gradient(90deg,#b6a68c88,transparent 20%,#fff5 54%,#b3a28744),repeating-linear-gradient(90deg,#dfd5be 0,#dfd5be .65px,#b9ad95 .8px,#eee7d5 1.2px);border-top:1px solid #a69a80;border-bottom:1px solid #9f947c;box-shadow:inset 0 0 4px #33271a45}
.book-spine{position:absolute;left:calc(var(--book-depth)/-2);top:0;width:var(--book-depth);height:100%;transform:rotateY(-90deg);background:linear-gradient(90deg,#0008,#ffffff17 32%,#0004 78%,#0009),var(--cover-art) left center/auto 100%;border-radius:3px;box-shadow:inset 1px 0 #ffffff15,inset -1px 0 #000a}
.book-spine:after{content:var(--spine-title);position:absolute;left:50%;top:9%;height:72%;writing-mode:vertical-rl;transform:translateX(-50%) rotate(180deg);font-family:var(--serif);font-size:clamp(6px,.65vw,10px);letter-spacing:.1em;line-height:1;color:#cbb583;text-shadow:0 1px 1px #000}
.book-top,.book-bottom{position:absolute;left:var(--inset);width:calc(100% - var(--inset)*2);height:var(--paper-depth);background:linear-gradient(#d9ccb2cc,#eee5d1aa),repeating-linear-gradient(0deg,#a6977d 0,#eee4cd .8px,#bcb095 1.2px);box-shadow:inset 0 0 4px #33271a30}
.book-top{top:calc(var(--inset) - var(--paper-depth)/2);transform:rotateX(90deg)}
.book-bottom{top:calc(100% - var(--inset) - var(--paper-depth)/2);transform:rotateX(-90deg)}
.case-fore-front,.case-fore-back{position:absolute;left:calc(100% - var(--board)/2);top:0;width:var(--board);height:100%;background:var(--case-color,#15251a);border-radius:1px;box-shadow:inset 1px 0 #ffffff2b,inset -1px 0 #0009;transform:translateZ(calc(var(--book-depth)/2 - var(--board)/2)) rotateY(90deg)}
.case-fore-back{transform:translateZ(calc(var(--book-depth)/-2 + var(--board)/2)) rotateY(90deg)}
.case-head-front,.case-head-back,.case-foot-front,.case-foot-back{position:absolute;left:0;top:calc(var(--board)/-2);width:100%;height:var(--board);background:var(--case-color,#15251a);box-shadow:inset 0 1px #ffffff22;transform:translateZ(calc(var(--book-depth)/2 - var(--board)/2)) rotateX(90deg)}
.case-head-back{transform:translateZ(calc(var(--book-depth)/-2 + var(--board)/2)) rotateX(90deg)}
.case-foot-front,.case-foot-back{top:calc(100% - var(--board)/2)}
.case-foot-back{transform:translateZ(calc(var(--book-depth)/-2 + var(--board)/2)) rotateX(90deg)}
.cover-button .book-number,.cover-button .cover-caption{transform:translateZ(calc(var(--book-depth)/2 + 1px));z-index:2}
.cover-caption{background:linear-gradient(transparent,#060a09ee);padding-top:26px;pointer-events:none}
.cover-motion{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;visibility:hidden;opacity:0;transition:opacity .4s;pointer-events:none}
.preview-playing .cover-motion{visibility:visible;opacity:1}
.motion-paused .cover-motion{opacity:0!important}
.motion-paused .hero-book,.motion-paused .cover-button,.motion-paused .begin-cover{--pointer-x:0deg;--pointer-y:0deg}
@media(min-width:1600px){.hero,.hero-inner{min-height:900px}.hero-showcase{padding-top:45px;padding-bottom:78px}.showcase-caption{font-size:.72rem}}
@media(max-width:1200px){.hero-inner{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:4%;padding-left:5%;padding-right:5%}.hero h1{font-size:clamp(2.6rem,4.1vw,3.5rem)}.cover-fan{gap:7%}.showcase-caption{font-size:.5rem;gap:6px;letter-spacing:.11em}.showcase-caption span{width:12px}.book-card{padding:22px 20px 0}.hero-book{--book-depth:20px}}
@media(max-width:960px){.hero-inner{grid-template-columns:1fr;padding-top:145px;padding-bottom:130px;gap:50px}.hero-copy{max-width:540px}.hero-showcase{width:100%;max-width:730px;justify-self:center;margin-top:0;padding:15px 3% 62px}.hero h1{font-size:3.8rem}.hero-art:before{background:linear-gradient(90deg,#070c11e8,#070c1180 75%),linear-gradient(0deg,#090d0c,transparent 55%)}.showcase-caption{font-size:.65rem}.hero-book{--book-depth:26px}.hero-description br{display:none}}
@media(max-width:720px){.hero-inner{display:flex;padding:52px 6% 104px;gap:38px}.hero h1{font-size:clamp(2.5rem,8.7vw,3.8rem)}.hero-showcase{max-width:500px;height:auto;margin:0;padding:10px 3% 60px}.cover-fan{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 18%;height:auto}.hero-book{--book-depth:22px;--rest-y:-18deg}.showcase-caption{font-size:.57rem;white-space:normal;letter-spacing:.1em}.hero-art{background-position:66% center;opacity:.8}.book-card{padding:16px 15px 0}.cover-button{--book-depth:22px;--inset:5px;--rest-y:-13deg}.cover-button:hover,.cover-button:focus-visible,.hero-book:hover,.hero-book:focus-visible{transform:perspective(1000px) translateY(-4px) rotateY(-18deg)}.book-spine:after{font-size:7px}.begin-cover{--book-depth:27px}.hero-bottom{bottom:20px}}
@media(prefers-reduced-motion:reduce){.meteor-sky,.cover-motion{display:none!important}.hero-book:hover,.hero-book:focus-visible,.cover-button:hover,.cover-button:focus-visible{transform:perspective(1500px) rotateX(var(--rest-x,2deg)) rotateY(var(--rest-y,-18deg))}.begin-cover:hover{transform:perspective(1500px) rotateX(3deg) rotateY(-21deg)}}