:root{--bg:#08090c;--panel:#0d0f14;--paper:#f2eee6;--muted:#9e9b96;--gold:#c8a96b;--red:#8d2632;--line:rgba(242,238,230,.13)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--paper);font-family:Inter,sans-serif;line-height:1.72;overflow-x:hidden}a{color:inherit;text-decoration:none}.grain{position:fixed;inset:0;pointer-events:none;z-index:50;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E")}
.header{position:fixed;inset:0 0 auto;z-index:40;display:flex;justify-content:space-between;align-items:center;padding:21px 5vw;transition:.3s;border-bottom:1px solid transparent}.header.scrolled{background:rgba(8,9,12,.84);backdrop-filter:blur(18px);border-color:var(--line)}.brand{font:600 14px Cinzel,serif;letter-spacing:.12em}.brand span{color:var(--gold)}nav{display:flex;gap:27px;font-size:11px;text-transform:uppercase;letter-spacing:.1em}nav a:hover{color:var(--gold)}.menu{display:none;border:0;background:none;color:white;font-size:25px}
.hero{min-height:100vh;display:grid;place-items:center;position:relative;overflow:hidden;background:radial-gradient(circle at 72% 36%,#20263a 0,#0d0f16 30%,#08090c 67%)}.hero:after{content:"";position:absolute;width:58vw;height:58vw;border:1px solid rgba(200,169,107,.08);border-radius:50%;right:-20vw;top:12vh}.stars{position:absolute;inset:0;opacity:.22;background-image:radial-gradient(circle at 20% 30%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 70% 18%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 45% 70%,#fff 0 1px,transparent 1.5px);background-size:280px 230px,370px 290px,430px 330px}.hero-copy{width:min(1000px,90vw);position:relative;z-index:2}.kicker{color:var(--gold);font-size:10px;letter-spacing:.24em;text-transform:uppercase;margin:0 0 18px}.hero h1,h2,h3{font-family:"Playfair Display",Georgia,serif;font-weight:500;line-height:.98;margin:0}.hero h1{font-size:clamp(62px,10vw,132px);letter-spacing:-.045em;max-width:950px}.hero em,h2 em,h3 em{color:var(--gold);font-style:italic}.intro{color:#aaa;max-width:600px;font-size:17px;margin:28px 0}.actions{display:flex;gap:12px;flex-wrap:wrap}.button{display:inline-flex;padding:13px 20px;border:1px solid var(--line);font-size:10px;letter-spacing:.12em;text-transform:uppercase;transition:.25s}.button.light{background:var(--paper);color:#111;border-color:var(--paper)}.button.light:hover{background:var(--gold);border-color:var(--gold);transform:translateY(-2px)}.button.ghost:hover{background:#ffffff0b}.hero-name{position:absolute;bottom:25px;right:5vw;color:#ffffff24;font:600 clamp(16px,2vw,27px) Cinzel,serif;letter-spacing:.22em}
.section{padding:120px max(6vw,24px);max-width:1450px;margin:auto}.section-title{max-width:760px;margin-bottom:65px}.section-title h2{font-size:clamp(54px,7vw,94px)}.section-title>.muted{color:var(--muted)}.feature-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(45px,8vw,110px);align-items:center;max-width:1160px;margin:auto}.cover-wrap img{display:block;width:100%;border:1px solid #ffffff13;box-shadow:0 40px 100px #0009}.book-copy .part{font-size:10px;color:var(--gold);letter-spacing:.18em}.book-copy h3{font-size:clamp(37px,4.2vw,59px);margin:15px 0 28px}.book-copy>p:not(.part){color:var(--muted)}.facts{display:grid;grid-template-columns:1fr 1fr;margin-top:32px;border:1px solid var(--line)}.facts div{padding:18px;border:1px solid var(--line);display:flex;flex-direction:column}.facts small{font-size:8px;letter-spacing:.15em;color:var(--gold)}.facts b{font-weight:500;font-size:13px}
.part2{margin:125px auto 20px;max-width:1160px;border:1px solid var(--line);display:grid;grid-template-columns:1.2fr .8fr;background:linear-gradient(135deg,#0e0f13,#110a0d)}.part2>div:first-child{padding:clamp(35px,5vw,65px)}.part2 h3{font-size:clamp(50px,6vw,80px);margin-bottom:22px}.part2 p:not(.kicker){color:var(--muted);max-width:660px}.pill{display:inline-block;margin-top:20px;padding:8px 12px;border:1px solid var(--line);color:var(--gold);font-size:8px;letter-spacing:.14em}.part2-art{min-height:390px;border-left:1px solid var(--line);display:grid;place-items:center;align-content:center;background:radial-gradient(circle,#5d1d27 0,transparent 4%,#160c10 40%,#08090c 78%)}.part2-art span{font:500 130px "Playfair Display",serif;color:#ffffff16}.part2-art small{color:#a5666d;letter-spacing:.18em}
.upcoming{border-top:1px solid var(--line);background:linear-gradient(#090a0e,#0d0916)}.inner{max-width:1300px}.eternal-card{border:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;background:#0b0d13;overflow:hidden}.eternal-art{min-height:650px;position:relative;overflow:hidden;background:radial-gradient(circle at 65% 26%,#7562a9 0 1%,transparent 18%),linear-gradient(#10162b,#090a11)}.orb{position:absolute;width:170px;height:170px;border-radius:50%;right:16%;top:13%;background:#eee8d8;box-shadow:0 0 70px #d8ca9e36}.ridge{position:absolute;bottom:-30px;width:0;height:0;border-left:330px solid transparent;border-right:330px solid transparent;border-bottom:380px solid #090b12}.r1{left:-250px}.r2{right:-300px;border-bottom-color:#111529}.rune{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);font-size:60px;color:#d8bf7d;opacity:.75}.eternal-title{position:absolute;left:8%;bottom:7%;font:600 24px Cinzel,serif;letter-spacing:.12em}.eternal-copy{padding:clamp(40px,6vw,80px);display:flex;flex-direction:column;justify-content:center}.eternal-copy h3{font-size:clamp(50px,6vw,78px);margin-bottom:22px}.eternal-copy p{color:var(--muted)}.eternal-copy .genre{color:#c9c4ba;font-size:11px;letter-spacing:.08em;text-transform:uppercase}.series{margin-top:70px}.series-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line)}.series-grid div{padding:25px;border:1px solid var(--line);display:flex;flex-direction:column;gap:7px;background:#0a0b10}.series-grid span{color:var(--gold);font-size:9px}.series-grid b{font:500 20px "Playfair Display",serif}.series-grid small{color:#6f6d69}
.about-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(50px,9vw,120px);align-items:center;max-width:1120px;margin:auto}.portrait{overflow:hidden;border:1px solid var(--line);background:#0e1014}.portrait img{width:100%;display:block;aspect-ratio:4/5;object-fit:cover;object-position:center}.about-copy h2{font-size:clamp(55px,7vw,90px);margin-bottom:30px}.about-copy p{color:var(--muted)}.about-copy .lead{font:italic 23px "Playfair Display",serif;color:#ddd8cf}.story{max-width:1120px;margin:120px auto 0;padding-top:60px;border-top:1px solid var(--line)}.story h3{font-size:clamp(45px,6vw,75px);margin-bottom:40px}.story-columns{columns:2;column-gap:70px;color:var(--muted)}.story-columns p{break-inside:avoid;margin-top:0;margin-bottom:24px}.story-columns .last{font:italic 24px "Playfair Display",serif;color:var(--gold)}
.update-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.update-grid article{border:1px solid var(--line);padding:30px;min-height:300px;display:flex;flex-direction:column;background:#0c0e12}.update-grid article>span{font:italic 40px "Playfair Display",serif;color:#ffffff15}.update-grid small{color:var(--gold);font-size:8px;letter-spacing:.16em}.update-grid h3{font-size:31px;margin:22px 0 12px}.update-grid p{color:var(--muted);margin:0}
.contact{padding:150px 24px;text-align:center;border-top:1px solid var(--line);background:radial-gradient(circle at 50% 50%,#191c29,#08090c 58%)}.contact>div{max-width:850px;margin:auto}.contact h2{font-size:clamp(65px,9vw,115px)}.contact p:not(.kicker){color:var(--muted);margin:25px auto 30px}
footer{border-top:1px solid var(--line);padding:30px 5vw;display:flex;justify-content:space-between;gap:25px;color:#686868;font-size:9px;text-transform:uppercase;letter-spacing:.1em}footer div{display:flex;gap:20px;flex-wrap:wrap}footer b{color:#aaa}.reveal{opacity:0;transform:translateY(25px);transition:.8s}.reveal.visible{opacity:1;transform:none}
@media(max-width:850px){.menu{display:block}nav{display:none;position:absolute;top:68px;left:0;right:0;padding:24px;background:#08090cf7;flex-direction:column;border-bottom:1px solid var(--line)}nav.open{display:flex}.feature-grid,.part2,.eternal-card,.about-grid{grid-template-columns:1fr}.part2-art{border-left:0;border-top:1px solid var(--line);min-height:300px}.eternal-art{min-height:500px}.series-grid,.update-grid{grid-template-columns:1fr 1fr}.story-columns{columns:1}.cover-wrap{order:2}.book-copy{order:1}footer{flex-direction:column}}
@media(max-width:520px){.hero h1{font-size:59px}.section{padding-top:90px;padding-bottom:90px}.facts,.series-grid,.update-grid{grid-template-columns:1fr}.actions .button{width:100%;justify-content:center}.eternal-art{min-height:390px}.orb{width:110px;height:110px}.part2-art span{font-size:95px}.contact .button{font-size:8px}.hero-name{display:none}}


/* =========================
   V4 — CONNECTED MOTION SYSTEM
   ========================= */

html { scroll-behavior: smooth; }
body { --scroll-progress: 0; }

/* A thin line connects the entire page journey. */
.scroll-progress{
  position:fixed;top:0;left:0;height:2px;width:100%;z-index:100;
  transform:scaleX(var(--scroll-progress));transform-origin:left center;
  background:linear-gradient(90deg,var(--gold),#ece5d4);
  box-shadow:0 0 18px rgba(200,169,107,.3);
  pointer-events:none;
}

/* Navigation floats into a glass state instead of abruptly changing. */
.header{
  transition:
    background .55s cubic-bezier(.22,1,.36,1),
    border-color .55s cubic-bezier(.22,1,.36,1),
    padding .55s cubic-bezier(.22,1,.36,1),
    backdrop-filter .55s ease;
}
.header.scrolled{padding-top:15px;padding-bottom:15px}

/* Shared cinematic reveal language across every section. */
.reveal{
  opacity:0;
  transform:translate3d(0,58px,0) scale(.975);
  filter:blur(10px);
  transition:
    opacity 1.05s cubic-bezier(.16,1,.3,1),
    transform 1.05s cubic-bezier(.16,1,.3,1),
    filter .9s cubic-bezier(.16,1,.3,1);
}
.reveal.visible{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  filter:blur(0);
}

/* Hero elements enter as one sequence. */
.hero .kicker{animation:v4HeroUp .85s cubic-bezier(.16,1,.3,1) .08s both}
.hero h1{animation:v4HeroUp 1.1s cubic-bezier(.16,1,.3,1) .18s both}
.hero .intro{animation:v4HeroUp 1s cubic-bezier(.16,1,.3,1) .34s both}
.hero .actions{animation:v4HeroUp 1s cubic-bezier(.16,1,.3,1) .46s both}
.hero-name{animation:v4HeroFade 1.4s ease .75s both}
@keyframes v4HeroUp{
  from{opacity:0;transform:translate3d(0,45px,0);filter:blur(8px)}
  to{opacity:1;transform:none;filter:blur(0)}
}
@keyframes v4HeroFade{from{opacity:0}to{opacity:1}}

/* The background moves almost imperceptibly with scroll. */
.stars{will-change:transform;transform:translate3d(0,var(--star-y,0px),0) scale(1.05)}
.hero:before{
  will-change:transform,opacity;
  transform:translate3d(0,var(--hero-glow-y,0px),0) scale(1.03);
  transition:opacity .2s linear;
}

/* Premium media motion */
.cover-wrap{perspective:1400px}
.cover-wrap img{
  transform:translate3d(0,var(--cover-y,0px),0) scale(var(--cover-scale,1));
  transition:box-shadow .65s cubic-bezier(.16,1,.3,1);
  will-change:transform;
}
.cover-wrap:hover img{box-shadow:0 55px 120px rgba(0,0,0,.7)}

/* The two book areas feel like chapters of the same visual story. */
.part2{
  transition:transform .7s cubic-bezier(.16,1,.3,1),border-color .7s ease,box-shadow .7s ease;
}
.part2:hover{transform:translateY(-5px);border-color:rgba(200,169,107,.24);box-shadow:0 35px 90px rgba(0,0,0,.22)}

/* Eternal World motion follows scroll instead of looping independently. */
.eternal-art{isolation:isolate}
.orb{
  transform:translate3d(0,var(--orb-y,0px),0) scale(var(--orb-scale,1));
  will-change:transform;
}
.rune{
  transform:translate(-50%,-50%) translate3d(0,var(--rune-y,0px),0) rotate(var(--rune-rotate,0deg));
  opacity:var(--rune-opacity,.72);
  text-shadow:0 0 var(--rune-glow,12px) rgba(216,191,125,.38);
  will-change:transform,opacity;
}
.ridge{transform:translate3d(0,var(--ridge-y,0px),0);will-change:transform}

/* Shared card behavior: restrained lift, no disconnected bouncing. */
.facts div,.series-grid div,.update-grid article{
  transition:
    transform .55s cubic-bezier(.16,1,.3,1),
    background .55s ease,
    border-color .55s ease;
}
.facts div:hover,.series-grid div:hover,.update-grid article:hover{
  transform:translateY(-6px);
  border-color:rgba(200,169,107,.3);
  background:rgba(200,169,107,.035);
}

/* Buttons get a soft light sweep. */
.button{position:relative;overflow:hidden;isolation:isolate}
.button:before{
  content:"";position:absolute;inset:-1px;z-index:-1;
  background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.22) 48%,transparent 70%);
  transform:translateX(-130%);
  transition:transform .8s cubic-bezier(.16,1,.3,1);
}
.button:hover:before{transform:translateX(130%)}

/* Navigation uses one shared underline motion. */
nav a{position:relative}
nav a:after{
  content:"";position:absolute;left:0;right:100%;bottom:-6px;height:1px;background:var(--gold);
  transition:right .45s cubic-bezier(.16,1,.3,1);
}
nav a:hover:after,nav a.active:after{right:0}
nav a.active{color:var(--gold)}

/* Section-to-section soft fade at top/bottom creates continuity. */
.featured,.upcoming,.about,.updates,.contact{position:relative}
.upcoming:before,.contact:before{
  content:"";position:absolute;left:0;right:0;top:-90px;height:180px;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(200,169,107,.015),transparent);
}

/* Accessibility */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
  .reveal{opacity:1!important;transform:none!important;filter:none!important}
}


/* ===== REVISED V4 — REPLAYABLE SCROLL REVEALS =====
   The same visual language now works in both directions.
   Leaving the viewport returns the element to its resting hidden state;
   re-entering plays the reveal again.
*/
.reveal{
  transition:
    opacity .9s cubic-bezier(.16,1,.3,1),
    transform .95s cubic-bezier(.16,1,.3,1),
    filter .85s cubic-bezier(.16,1,.3,1);
}
html[data-scroll-direction="down"] .reveal:not(.visible){
  transform:translate3d(0,46px,0) scale(.982);
}
html[data-scroll-direction="up"] .reveal:not(.visible){
  transform:translate3d(0,-34px,0) scale(.985);
}
.reveal.visible{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  filter:blur(0);
}

/* Keep hidden content from flashing on initial load. */
.reveal:not(.visible){
  opacity:0;
  filter:blur(8px);
}

/* On small screens, reduce travel distance for a cleaner mobile feel. */
@media(max-width:520px){
  html[data-scroll-direction="down"] .reveal:not(.visible){transform:translate3d(0,28px,0) scale(.99)}
  html[data-scroll-direction="up"] .reveal:not(.visible){transform:translate3d(0,-22px,0) scale(.99)}
}


/* =========================
   V5 — PRODUCTION POLISH
   ========================= */

.brand-with-logo{
  display:inline-flex;
  align-items:center;
  gap:11px;
  text-decoration:none;
}
.brand-with-logo img{
  width:38px;
  height:38px;
  border-radius:7px;
  object-fit:cover;
  box-shadow:0 0 0 1px rgba(200,169,107,.18), 0 8px 25px rgba(0,0,0,.24);
  transition:transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s ease;
}
.brand-with-logo:hover img{
  transform:translateY(-2px) scale(1.035);
  box-shadow:0 0 0 1px rgba(200,169,107,.34), 0 12px 30px rgba(0,0,0,.32);
}
.brand-name{white-space:nowrap}

.release-actions{margin-top:26px}

/* Strong, visible keyboard focus without changing the visual design for mouse users. */
a:focus-visible,button:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:5px;
  border-radius:3px;
}

/* Improve tap targets on touch devices. */
nav a,.menu,.button,footer a{min-height:44px}
nav a,footer a{display:inline-flex;align-items:center}

/* Better rendering and reduced layout shift. */
img{max-width:100%;height:auto}
.cover-wrap img,.portrait img{content-visibility:auto}

/* Mobile header refinement for the new logo. */
@media(max-width:760px){
  .brand-with-logo{gap:8px}
  .brand-with-logo img{width:34px;height:34px}
  .brand-name{font-size:.76rem;letter-spacing:.08em}
}
@media(max-width:390px){
  .brand-name{font-size:.69rem}
}

/* Print fallback. */
@media print{
  .scroll-progress,.menu,.stars,.grain{display:none!important}
  body{background:#fff!important;color:#111!important}
}


/* =========================
   V5 FIX — ETERNAL WORLD
   One motion system only: no competing transforms/keyframes.
   ========================= */

.eternal-art,
.eternal-art *{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

.eternal-art{
  transform:translateZ(0);
  contain:paint;
  overflow:hidden;
}

/* Kill older looping animation rules that were fighting scroll transforms. */
.eternal-art .orb,
.eternal-art .rune,
.eternal-art .ridge{
  animation:none !important;
  transition:none !important;
}

.eternal-art .orb{
  transform:translate3d(0,var(--orb-y,0px),0) scale(var(--orb-scale,1)) !important;
  transform-origin:center center;
  will-change:transform;
}

.eternal-art .rune{
  transform:translate3d(-50%,calc(-50% + var(--rune-y,0px)),0)
            rotate(var(--rune-rotate,0deg)) !important;
  transform-origin:center center;
  opacity:var(--rune-opacity,.72);
  will-change:transform,opacity;
}

.eternal-art .ridge{
  transform:translate3d(0,var(--ridge-y,0px),0) !important;
  will-change:transform;
}

/* Keep the outer reveal animation separate from inner scene motion. */
.eternal-art.reveal{
  will-change:opacity,filter;
}

/* Mobile/Safari: reduce parallax distance to avoid compositing flicker. */
@media(max-width:760px){
  .eternal-art .orb{transform:translate3d(0,calc(var(--orb-y,0px) * .55),0) scale(var(--orb-scale,1)) !important}
  .eternal-art .ridge{transform:translate3d(0,calc(var(--ridge-y,0px) * .5),0) !important}
}

@media(prefers-reduced-motion:reduce){
  .eternal-art .orb,
  .eternal-art .rune,
  .eternal-art .ridge{
    transform:none !important;
    opacity:1 !important;
  }
}

/* V6 — interactive story features */
.typewriter-line{min-height:1.6em;margin-top:1rem;font-family:'Playfair Display',serif;font-style:italic;font-size:clamp(1.15rem,2vw,1.6rem);color:#b51f2e;letter-spacing:.01em}.typewriter-line::after{content:'|';margin-left:.12em;animation:v6blink .8s steps(1) infinite}@keyframes v6blink{50%{opacity:0}}
.perspectives{position:relative;overflow:hidden;background:#080808;color:#f5efe6}.perspectives .section-title{text-align:center;max-width:760px;margin-inline:auto}.perspective-wheel-wrap{max-width:980px;margin:2.5rem auto 0;position:relative;touch-action:pan-y;user-select:none}.perspective-wheel{height:360px;position:relative;perspective:1100px;cursor:grab}.perspective-wheel.dragging{cursor:grabbing}.perspective-card{position:absolute;left:50%;top:50%;width:min(280px,72vw);min-height:245px;padding:2rem 1.5rem;border:1px solid rgba(255,255,255,.14);background:linear-gradient(145deg,rgba(30,30,30,.98),rgba(10,10,10,.98));transform-origin:center;transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .35s,filter .35s,border-color .35s;display:flex;flex-direction:column;justify-content:flex-end;text-align:left;box-shadow:0 24px 60px rgba(0,0,0,.28);border-radius:2px}.perspective-card .roman{position:absolute;top:1rem;right:1.15rem;font-family:Cinzel,serif;font-size:3.2rem;color:rgba(255,255,255,.07)}.perspective-card small{letter-spacing:.16em;color:#b51f2e;font-weight:600}.perspective-card h3{font-family:'Playfair Display',serif;font-size:2rem;margin:.35rem 0}.perspective-card p{color:#bbb;line-height:1.65;margin:0;font-size:.95rem}.perspective-card.is-active{border-color:rgba(181,31,46,.7)}.wheel-hint{text-align:center;color:#858585;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;margin-top:.75rem}.wheel-dots{display:flex;justify-content:center;gap:.55rem;margin-top:1rem}.wheel-dot{width:44px;height:44px;border:1px solid rgba(255,255,255,.14);background:transparent;color:#aaa;border-radius:50%;cursor:pointer}.wheel-dot.active{background:#f3eee6;color:#0a0a0a;border-color:#f3eee6}.series-slider{margin-top:4rem;border-top:1px solid rgba(255,255,255,.1);padding-top:3rem}.series-slider-head{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}.series-slider-head h3{font-family:'Playfair Display',serif;font-size:clamp(2rem,4vw,3.4rem);margin:0}.series-controls{display:flex;gap:.6rem}.series-arrow{width:46px;height:46px;border:1px solid rgba(255,255,255,.2);background:transparent;color:#fff;cursor:pointer;border-radius:50%;font-size:1.25rem}.series-track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(250px,31%);gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:.5rem}.series-track::-webkit-scrollbar{display:none}.series-slide{scroll-snap-align:start;min-height:250px;padding:1.6rem;border:1px solid rgba(255,255,255,.12);background:#111;display:flex;flex-direction:column;justify-content:space-between}.series-slide .part-num{font:600 4rem Cinzel,serif;color:rgba(255,255,255,.09)}.series-slide h4{font:600 1.55rem 'Playfair Display',serif;margin:.3rem 0}.series-slide p{color:#aaa;margin:.3rem 0 0}.series-slide.featured-slide{border-color:rgba(181,31,46,.65)}
.cursor-glow{position:fixed;width:180px;height:180px;border-radius:50%;pointer-events:none;z-index:4;background:radial-gradient(circle,rgba(135,0,18,.12),rgba(135,0,18,0) 68%);transform:translate(-50%,-50%);opacity:0;transition:opacity .25s;mix-blend-mode:screen}.cursor-glow.on{opacity:1}@media (pointer:coarse){.cursor-glow{display:none}}@media(max-width:720px){.perspective-wheel{height:330px}.perspective-card{width:min(245px,72vw);min-height:230px;padding:1.5rem 1.2rem}.perspective-card h3{font-size:1.65rem}.series-track{grid-auto-columns:82%}.series-slider-head{align-items:flex-start;flex-direction:column}.wheel-hint{letter-spacing:.08em}}
@media(prefers-reduced-motion:reduce){.typewriter-line::after{animation:none}.perspective-card{transition:none}}

/* ===== V7 — SCROLL STABILITY + CONTROLS ===== */
.reveal:not(.visible){opacity:0;transform:translate3d(0,24px,0) scale(.992);filter:blur(5px)}
.reveal.visible{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0)}
/* Neutralize older direction-specific reveal rules. */
html[data-scroll-direction="down"] .reveal:not(.visible),
html[data-scroll-direction="up"] .reveal:not(.visible){transform:translate3d(0,24px,0) scale(.992)}
/* Freeze decorative parallax variables so scrolling never fights layout/compositing. */
.hero{--star-y:0px;--hero-glow-y:0px;opacity:1!important}
.cover-wrap{--cover-y:0px;--cover-scale:1}
.eternal-art{--orb-y:0px;--orb-scale:1;--rune-y:0px;--rune-rotate:0deg;--ridge-y:0px}
.series-arrow:disabled{opacity:.28;cursor:default}
.series-arrow:not(:disabled):hover{background:#f3eee6;color:#0a0a0a}

/* V8 — stable perspectives + bottom series scrubber */
.perspective-wheel{perspective:none;contain:layout paint;isolation:isolate;transform:translateZ(0)}
.perspective-card{filter:none!important;backface-visibility:hidden;will-change:transform,opacity;transition:transform .32s cubic-bezier(.2,.8,.2,1),opacity .32s,border-color .32s}
.perspective-card.no-animate{transition:none!important}
.series-controls,.series-arrow{display:none!important}
.series-scrubber-wrap{margin:1.35rem .1rem 0;padding:.25rem 0 .1rem}
.series-scrubber{display:block;width:100%;height:28px;margin:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer;touch-action:pan-y}
.series-scrubber::-webkit-slider-runnable-track{height:3px;background:rgba(255,255,255,.2);border-radius:999px}
.series-scrubber::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#f3eee6;border:3px solid #8f1522;margin-top:-7.5px;box-shadow:0 0 0 4px rgba(143,21,34,.16)}
.series-scrubber::-moz-range-track{height:3px;background:rgba(255,255,255,.2);border-radius:999px}
.series-scrubber::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#f3eee6;border:3px solid #8f1522}
.series-scrubber:focus-visible{outline:2px solid #f3eee6;outline-offset:5px;border-radius:999px}
.series-scrubber-labels{display:flex;justify-content:space-between;padding:0 3px;color:#777;font:600 .68rem Cinzel,serif;letter-spacing:.08em}


/* V9 — perspective stability + selected-series focus */
.perspective-wheel-wrap{transform:none!important;filter:none!important;opacity:1!important;contain:none!important}
.perspective-wheel{perspective:none!important;contain:none!important;isolation:auto!important;transform:none!important;will-change:auto!important}
.perspective-card{filter:none!important;backface-visibility:visible!important;will-change:auto!important;transition:transform .28s ease,opacity .28s ease,border-color .28s ease!important}
.perspective-card.no-animate{transition:none!important}
.series-track{padding:14px 4px 22px;scroll-padding-inline:34%;align-items:center}
.series-slide{transform:scale(.94);opacity:.58;transition:transform .28s ease,opacity .28s ease,border-color .28s ease,background-color .28s ease;transform-origin:center center}
.series-slide.featured-slide{border-color:rgba(255,255,255,.12)}
.series-slide.is-selected{border-color:rgba(181,31,46,.85)!important;transform:scale(1.035);opacity:1;background:#141111;z-index:2}
.series-scrubber-labels span{transition:color .2s ease}
@media(max-width:720px){.series-track{padding-left:4px;padding-right:4px;scroll-padding-inline:9%}.series-slide.is-selected{transform:scale(1.02)}}


/* V10 — The Vespera Trilogy + released Evidence Stained Red editions */
.release-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.part2-actions{margin-top:24px}
.part2-actions .button{margin:0}
.vespera-card{margin-top:76px;background:#0b0d12}
.vespera-art{min-height:650px;position:relative;overflow:hidden;isolation:isolate;background:
  radial-gradient(ellipse at 52% 27%,rgba(103,145,190,.20),transparent 30%),
  linear-gradient(180deg,#101b2a 0%,#111521 48%,#090b10 100%)}
.vespera-moon{position:absolute;width:190px;height:190px;right:17%;top:12%;border-radius:50%;
  background:radial-gradient(circle at 35% 32%,#e1e0d9,#9ca7b0 58%,#596879 100%);
  box-shadow:0 0 85px rgba(134,173,207,.2)}
.vespera-city{position:absolute;inset:auto 0 0;height:52%;opacity:.88;
  background:
    linear-gradient(90deg,transparent 0 4%,#111a27 4% 8%,transparent 8% 12%,#172231 12% 17%,transparent 17% 22%,#111a27 22% 27%,transparent 27% 32%,#1a2635 32% 38%,transparent 38% 44%,#111a27 44% 50%,transparent 50% 56%,#1a2635 56% 62%,transparent 62% 68%,#111a27 68% 75%,transparent 75% 81%,#172231 81% 87%,transparent 87% 92%,#111a27 92% 100%);
  clip-path:polygon(0 36%,7% 36%,7% 15%,13% 15%,13% 44%,19% 44%,19% 8%,25% 8%,25% 38%,32% 38%,32% 0,39% 0,39% 42%,46% 42%,46% 19%,53% 19%,53% 48%,60% 48%,60% 12%,67% 12%,67% 40%,74% 40%,74% 5%,81% 5%,81% 36%,89% 36%,89% 17%,95% 17%,95% 45%,100% 45%,100% 100%,0 100%)}
.vespera-art-title{position:absolute;left:8%;bottom:9%;font:600 clamp(28px,4vw,48px) Cinzel,serif;letter-spacing:.13em;line-height:1.25;color:#e3e8ed;text-shadow:0 4px 25px #000}
.vespera-orbit{position:absolute;top:10%;left:10%;font:italic 100px "Playfair Display",serif;color:rgba(210,225,239,.12)}
@media(max-width:850px){.vespera-art{min-height:500px}}
@media(max-width:520px){.vespera-art{min-height:390px}.release-actions .button{width:100%;justify-content:center}}


/* V11: the Vespera Trilogy has exactly three centered book cards. */
.vespera-series-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(100%, 1000px);
  margin-inline: auto;
}
@media (max-width: 850px) {
  .vespera-series-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .vespera-series-grid { grid-template-columns: 1fr; }
}