@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Inter:wght@400;500;600;700&display=swap');
:root{--navy:#0c1b2a;--navy2:#14283d;--gold:#d5b778;--cream:#f3eee1;--ink:#263444;--muted:#9fbbc9}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#091521;color:var(--cream);font-family:Inter,Arial,sans-serif;font-size:15px;line-height:1.65}body:before{content:'';position:fixed;inset:0;z-index:-1;background:radial-gradient(ellipse at 30% 20%,#35506a55,transparent 60%),linear-gradient(160deg,#10283e,#08111c)}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}h1,h2,h3,.serif{font-family:Cinzel,Georgia,serif;font-weight:500;line-height:1.2}h1{font-size:clamp(2.5rem,5vw,5.4rem);margin:.1em 0 .15em}h2{font-size:clamp(1.6rem,3vw,2.8rem);margin:0 0 10px}h3{font-size:1.35rem;margin:.4em 0}p{margin:0 0 1rem}.site-header{position:sticky;top:0;z-index:20;background:#081521ee;backdrop-filter:blur(15px);border-bottom:1px solid #bca36b55}.nav-inner{max-width:1240px;margin:auto;min-height:74px;padding:10px 30px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{font-family:Cinzel,serif;font-size:1.2rem;color:var(--gold);white-space:nowrap}.nav-links{display:flex;align-items:center;gap:26px;font-size:.75rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase}.nav-links a:hover,.nav-links a[aria-current=page]{color:var(--gold)}.nav-cta{border:1px solid var(--gold);padding:9px 14px}.menu-btn{display:none;border:1px solid #977f52;background:transparent;color:white;padding:8px 12px}.hero{min-height:570px;display:flex;align-items:center;position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(90deg,#091521 0%,#0b1d2ce8 39%,#132a3c33 85%),url('assets/hero.webp') right 36%/auto 125% no-repeat,#172d3f}.hero:after,.page-hero:after{content:'';position:absolute;inset:auto 0 0;height:130px;z-index:-1;background:linear-gradient(transparent,#0a1927)}.hero:before,.page-hero:before{content:'✦  ·  ✧  ·  ✦';position:absolute;right:8%;top:16%;font-size:2rem;color:#e6d49a55;letter-spacing:35px;pointer-events:none}.hero-inner,.container{max-width:1180px;width:100%;margin:auto;padding:66px 30px}.hero-copy{max-width:590px;text-shadow:0 2px 20px #000}.eyebrow{font-size:.72rem;letter-spacing:.27em;text-transform:uppercase;color:var(--gold);font-weight:600}.hero h1{color:#edd29a}.hero .series{font-family:'Libre Baskerville',Georgia,serif;font-size:clamp(2rem,4vw,4rem);line-height:1.2}.hero .lead{font-family:'Libre Baskerville',serif;font-size:1.05rem;max-width:450px;margin-top:20px}.actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:28px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:9px;padding:12px 20px;min-height:46px;border:1px solid var(--gold);background:transparent;color:var(--cream);font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;transition:transform .2s,background .2s}.btn:hover{transform:translateY(-2px);background:#dabd8222}.btn.primary{background:linear-gradient(#f1d79e,#b99856);color:#18222e}.btn.primary:hover{background:#f5ddaa}.paper{background:linear-gradient(#f4f0e6f5,#e4e7e5f7);color:var(--ink);position:relative}.paper:before{content:'';position:absolute;height:20px;left:0;right:0;top:0;background:linear-gradient(90deg,#192f44 0%,transparent 25%,#192f4430 50%,transparent 75%,#192f44 100%);opacity:.24}.section-heading{text-align:center;margin-bottom:38px}.section-heading p{letter-spacing:.14em;font-size:.75rem;text-transform:uppercase}.ornament{color:var(--gold);letter-spacing:.6em;font-size:1rem}.books{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}.book-card{text-align:center}.book-card img{height:350px;max-width:100%;object-fit:contain;filter:drop-shadow(10px 14px 9px #10283b55);transition:transform .25s}.book-card:hover img{transform:translateY(-7px)}.book-card h3{font-size:1.35rem}.book-card p{font-family:'Libre Baskerville',serif;color:#526171;font-size:.84rem}.book-num{color:#876e41;text-transform:uppercase;letter-spacing:.2em;font-size:.7rem;font-weight:700}.text-link{display:inline-block;border-bottom:1px solid #b69a61;padding-bottom:4px;font-size:.75rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase}.dark-section{background:linear-gradient(155deg,#0b1b2b,#1b354a 50%,#0a1929);position:relative}.dark-section .section-heading p{color:#a8bbc9}.portal-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.portal{min-height:255px;position:relative;display:flex;align-items:end;overflow:hidden;border:1px solid #bca5788c;background:linear-gradient(0deg,#081421 5%,#0d1f3177 64%),var(--img) center/cover no-repeat,#284055;transition:transform .25s,border-color .2s}.portal:hover{transform:translateY(-5px);border-color:#f3d59c}.portal-content{padding:20px;width:100%}.portal h3{color:#fff;margin:0 0 5px;font-size:1.12rem}.portal p{font-size:.8rem;color:#dce4e7;margin:0}.portal .arr{position:absolute;bottom:15px;right:14px;color:var(--gold);font-size:1.5rem}.event-preview{display:flex;justify-content:space-between;align-items:center;gap:25px}.mini-events{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:22px}.mini-event{border-left:2px solid #c4a770;padding-left:15px}.mini-event small{color:#68788b;font-weight:700;letter-spacing:.1em}.mini-event strong{display:block;font-family:'Libre Baskerville',serif}.newsletter{padding:45px 30px;text-align:center;background:linear-gradient(120deg,#0a1624,#1f4057,#0a1726);border-top:1px solid #9b824d}.newsletter h2{color:var(--gold)}.newsletter-form{display:flex;gap:8px;justify-content:center;margin:20px auto 0;max-width:530px}.newsletter-form input{flex:1;min-width:0;padding:13px;background:#0b1a28;color:white;border:1px solid #aa9c7b}.footer{border-top:1px solid #796b4c;background:#09131f;color:#b9c4ca;padding:25px 30px;text-align:center}.footer .brand{display:block;margin-bottom:8px}.footer p{font-size:.72rem;letter-spacing:.19em}.page-hero{min-height:310px;display:flex;align-items:center;background:linear-gradient(90deg,#0a1a28 0%,#112637da 54%,#11263744),url('assets/hero.webp') right 35%/auto 150% no-repeat;position:relative;isolation:isolate}.page-hero h1{font-size:clamp(2.3rem,5vw,4rem);color:#eacb8b}.page-hero p{max-width:560px}.toolbar{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:23px}.toolbar input,.toolbar select{padding:11px 14px;background:#fffcf5;color:#213040;border:1px solid #c0b6a5;border-radius:0}.toolbar input{flex:1;min-width:200px}.toolbar select{min-width:170px}.codex-shell{display:grid;grid-template-columns:220px 1fr;gap:24px}.filter-menu{background:#14283b;padding:17px;border:1px solid #b99e6555;align-self:start}.filter-menu h3{color:var(--gold);font-size:1rem}.filter-menu button{display:block;width:100%;text-align:left;padding:10px;border:0;background:none;color:#e4e8ec}.filter-menu button:hover,.filter-menu button.active{background:#cfb67d;color:#17273b}.codex-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.lore-card{display:flex;flex-direction:column;text-align:left;padding:0;border:1px solid #c2b59a;background:#fffaf1;color:#213040;overflow:hidden}.lore-card:hover{box-shadow:0 6px 20px #26344433;transform:translateY(-2px)}.lore-thumb{height:130px;background:linear-gradient(#11263d33,#071522cc),var(--art) center/cover no-repeat}.lore-card-body{padding:15px}.lore-card small{color:#8b6b35;text-transform:uppercase;letter-spacing:.11em;font-weight:700}.lore-card h3{font-size:1.1rem}.lore-card p{font-size:.85rem;margin:0}.demo-note{background:#fff5d9;border-left:4px solid #b78b3e;padding:12px 16px;margin-bottom:22px;color:#644d28;font-size:.87rem}.empty{padding:40px;text-align:center}.modal{position:fixed;inset:0;z-index:40;background:#071322df;display:none;align-items:center;justify-content:center;padding:20px}.modal.open{display:flex}.modal-box{background:#f1eadc;color:#203040;max-width:650px;max-height:85vh;overflow:auto;width:100%;padding:32px;position:relative;border:2px solid #c0a56b;box-shadow:0 20px 70px #000}.modal-close{position:absolute;top:10px;right:12px;border:0;background:#17283a;color:white;padding:5px 11px;font-size:1.3rem}.modal-box .tag{color:#947541;font-weight:bold;text-transform:uppercase;letter-spacing:.18em;font-size:.8rem}.events-layout{display:grid;grid-template-columns:1fr 310px;gap:32px}.events-list{display:grid;gap:14px}.event-item{padding:20px;background:#fffaf2;border-left:3px solid #ba9a5e;display:flex;align-items:center;gap:20px}.event-date{min-width:85px;text-align:center;border-right:1px solid #d5c7ad;padding-right:15px;font-family:Cinzel,serif;font-weight:600}.event-date b{display:block;font-size:1.9rem;line-height:1.1}.event-info{flex:1}.event-info h3{font-size:1.15rem}.event-info small{color:#827049;letter-spacing:.1em;text-transform:uppercase;font-weight:700}.event-info p{font-size:.87rem;margin:0}.event-item .btn{background:#132a40;color:#fff;font-size:.7rem}.sidebox{background:#13283d;color:#e6e6e1;padding:24px;border:1px solid #b29964;align-self:start}.sidebox h3{color:#e3c38b}.sidebox .btn{margin-top:12px}.hint{color:#a1b7c8;font-size:.85rem}.hide{display:none!important}@media(max-width:900px){.nav-links{gap:14px;font-size:.67rem}.books{gap:15px}.book-card img{height:290px}.portal-grid{grid-template-columns:repeat(2,1fr)}.codex-grid{grid-template-columns:repeat(2,1fr)}.events-layout{grid-template-columns:1fr}.sidebox{display:none}}@media(max-width:650px){.nav-inner{min-height:62px;padding:12px 18px}.menu-btn{display:block}.nav-links{display:none;position:absolute;top:62px;left:0;right:0;padding:20px;background:#081521;flex-direction:column;align-items:stretch;text-align:center;gap:16px}.nav-links.open{display:flex}.hero{min-height:580px;background:linear-gradient(90deg,#091521e8,#0b1d2caa),url('assets/hero.webp') center/auto 100% no-repeat}.hero-inner,.container{padding:48px 20px}.books{grid-template-columns:1fr;gap:42px}.book-card img{height:310px}.portal-grid{grid-template-columns:1fr 1fr;gap:10px}.portal{min-height:205px}.portal-content{padding:12px}.mini-events{grid-template-columns:1fr}.event-preview{align-items:start;flex-direction:column}.codex-shell{grid-template-columns:1fr}.filter-menu{display:flex;flex-wrap:wrap;gap:5px}.filter-menu h3{flex-basis:100%}.filter-menu button{width:auto;padding:7px 10px}.codex-grid{grid-template-columns:1fr 1fr;gap:9px}.lore-thumb{height:105px}.lore-card-body{padding:10px}.lore-card h3{font-size:.92rem}.lore-card p{font-size:.75rem}.event-item{flex-wrap:wrap}.event-item .btn{margin-left:auto}.newsletter-form{flex-direction:column}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

/* =====================================================================
   POLISH LAYER — Noble Pixel Studio
   Sits on top of the base design: same palette, fonts and structure,
   with atmosphere, foil, depth and motion added. Effects that need
   JavaScript are scoped to html.fx (added by script.js).
   ===================================================================== */
:root{--gold-hi:#f6e3b0;--gold-lo:#a8864a;--foil:linear-gradient(100deg,#b8955a 0%,#f3dca2 22%,#fff4d4 32%,#d9b878 45%,#a8864a 60%,#e9cf93 78%,#b8955a 100%);--mist:#9fbbc9}

/* Header: gold hairline, slimmer once scrolled */
.site-header{border-bottom:0;transition:background .4s ease}
.site-header::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,#d5b77899 20%,#f3dca2 50%,#d5b77899 80%,transparent)}
.nav-inner{transition:min-height .35s ease}
.site-header.scrolled{background:#06101ad9}
.site-header.scrolled .nav-inner{min-height:60px}
.brand{background:var(--foil);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:.04em}
.nav-links a{position:relative}
.nav-links a:not(.nav-cta)::after{content:"";position:absolute;left:50%;right:50%;bottom:-6px;height:1px;background:var(--gold);transition:left .3s ease,right .3s ease}
.nav-links a:not(.nav-cta):hover::after,.nav-links a[aria-current=page]::after{left:0;right:0}
.nav-cta{position:relative;overflow:hidden;transition:background .3s,color .3s}
.nav-cta:hover{background:var(--gold);color:#0c1b2a!important}

/* Ornaments become filigree rules */
.ornament{display:flex;align-items:center;justify-content:center;gap:16px;letter-spacing:0;margin-bottom:6px}
.ornament::before,.ornament::after{content:"";height:1px;width:min(120px,22vw);background:linear-gradient(90deg,transparent,var(--gold))}
.ornament::after{transform:scaleX(-1)}
.section-heading h2{position:relative}
.paper .section-heading h2{color:#1b2a3a}

/* Buttons: foil with a passing sheen */
.btn{position:relative;overflow:hidden;isolation:isolate;transition:transform .25s ease,background .25s,box-shadow .3s,color .25s}
.btn::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,#ffffff66,transparent);transform:skewX(-20deg);z-index:-1;transition:left .7s ease}
.btn:hover::after{left:130%}
.btn:hover{box-shadow:0 0 0 1px #f3dca2,0 8px 30px -8px #d5b77899}
.btn.primary{background:var(--foil);background-size:200% 100%;border-color:#f3dca2;color:#13202d;transition:background-position .8s ease,transform .25s,box-shadow .3s}
.btn.primary:hover{background:var(--foil);background-size:200% 100%;background-position:100% 0}

/* ---------- Hero ---------- */
.hero{min-height:max(620px,92svh)}
.hero:before{content:none}
.fx .hero,.fx .page-hero{background:#091521}
.fx-art{position:absolute;inset:-4%;z-index:-3;transform:translate3d(var(--px,0),var(--py,0),0) scale(1.04);animation:kenburns 28s ease-in-out infinite alternate;will-change:transform}
.fx-art{left:auto;right:-2%;width:min(64vw,940px);background:var(--art) center 28%/cover no-repeat;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 48%);mask-image:linear-gradient(90deg,transparent 0%,#000 48%)}
.page-hero .fx-art{width:min(58vw,820px);background-position:center 35%;opacity:.75}
@keyframes kenburns{from{scale:1}to{scale:1.07}}
.fx-glow{position:absolute;z-index:-2;right:8%;top:6%;width:min(620px,60vw);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#f3e6c255 0%,#d5b77822 30%,transparent 65%);filter:blur(10px);animation:breathe 9s ease-in-out infinite;pointer-events:none}
@keyframes breathe{50%{opacity:.55;transform:scale(.94)}}
.fx-fog{position:absolute;left:-30%;right:-30%;z-index:-1;pointer-events:none;filter:blur(28px);opacity:.55}
.fx-fog.one{bottom:-8%;height:46%;background:radial-gradient(ellipse 30% 55% at 20% 60%,#9fbbc955,transparent 70%),radial-gradient(ellipse 25% 45% at 55% 70%,#c9d6dd44,transparent 70%),radial-gradient(ellipse 30% 50% at 85% 60%,#9fbbc944,transparent 70%);animation:drift 46s linear infinite alternate}
.fx-fog.two{bottom:12%;height:30%;opacity:.35;background:radial-gradient(ellipse 22% 50% at 35% 50%,#d7e2e844,transparent 70%),radial-gradient(ellipse 28% 50% at 75% 50%,#9fbbc944,transparent 70%);animation:drift 64s linear infinite alternate-reverse}
@keyframes drift{from{transform:translateX(-6%)}to{transform:translateX(6%)}}
.page-hero{overflow:hidden}
.fx-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.hero:after,.page-hero:after{height:160px;background:linear-gradient(transparent,#0a1927f2)}
.hero h1{font-size:clamp(2.8rem,6vw,6rem);letter-spacing:.02em;background:var(--foil);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 4px 24px #000a);text-shadow:none}
.hero .series{font-style:italic;color:#e8edf0;letter-spacing:.01em}
.hero .series::before{content:"";display:block;width:84px;height:1px;margin:.15em 0 .45em;background:linear-gradient(90deg,var(--gold),transparent)}
.hero .lead{color:#d6e0e6}
.fx .hero-copy>*{opacity:0;transform:translateY(18px);transition:opacity 1.1s ease,transform 1.1s cubic-bezier(.2,.7,.2,1)}
.fx.loaded .hero-copy>*{opacity:1;transform:none}
.fx.loaded .hero-copy>:nth-child(2){transition-delay:.15s}
.fx.loaded .hero-copy>:nth-child(3){transition-delay:.35s}
.fx.loaded .hero-copy>:nth-child(4){transition-delay:.55s}
.fx.loaded .hero-copy>:nth-child(5){transition-delay:.75s}
.fx.loaded .hero h1{animation:foil 3.2s ease .3s both}
@keyframes foil{from{background-position:100% 0}to{background-position:0 0}}
.scroll-cue{position:absolute;left:50%;bottom:22px;width:1px;height:46px;background:linear-gradient(var(--gold),transparent);transform-origin:top;animation:cue 2.6s ease-in-out infinite}
@keyframes cue{0%{transform:scaleY(0);opacity:0}40%{opacity:1}100%{transform:scaleY(1);opacity:0}}

/* ---------- Paper sections: texture + soft mist edge ---------- */
.paper{background:radial-gradient(ellipse at 50% 0%,#fbf8f0 0%,transparent 60%),linear-gradient(#f4f0e6,#e6e8e4)}
.paper::before{height:44px;opacity:1;background:linear-gradient(#0a192740,transparent)}
.paper+.paper::before{display:none}
.paper::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .38 0 0 0 0 .25 0 0 0 .22 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.paper>.container{position:relative;z-index:1;padding-top:90px;padding-bottom:90px}

/* ---------- Books: stage, tilt and shine ---------- */
.books{gap:56px;perspective:1200px}
.book-card{position:relative;padding:28px 18px 26px;transition:transform .4s ease}
.book-card::before{content:"";position:absolute;inset:auto 12% 118px;height:200px;border-radius:50%;background:radial-gradient(closest-side,#d5b77866,transparent);filter:blur(18px);opacity:0;transition:opacity .5s;z-index:0}
.book-card:hover::before{opacity:1}
.book-card>div{position:relative;display:inline-block;z-index:1;transform-style:preserve-3d;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.book-card.tilting>div{transition:transform .08s linear}
.book-card>div::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--mx,50%) var(--my,30%),#ffffff55,transparent 45%);mix-blend-mode:soft-light;opacity:0;transition:opacity .4s}
.book-card:hover>div::after{opacity:1}
.book-card img{filter:drop-shadow(0 26px 22px #10283b66) drop-shadow(0 6px 6px #10283b44);transition:filter .4s}
.book-card:hover img{transform:none;filter:drop-shadow(0 34px 26px #10283b77) drop-shadow(0 8px 8px #10283b44)}
.book-card>div+*,.book-card h3,.book-card p,.book-card a{position:relative;z-index:1}
.book-num{display:inline-flex;align-items:center;gap:10px}
.book-num::before,.book-num::after{content:"";width:22px;height:1px;background:#b69a61}
.book-card h3{font-size:1.6rem;color:#16273a;margin-top:.7em}
.text-link{transition:color .25s,border-color .25s,letter-spacing .3s}
.text-link:hover{color:#8a6a33;letter-spacing:.1em}

/* ---------- Dark sections: stars + portals ---------- */
.dark-section{overflow:hidden;background:radial-gradient(ellipse at 20% 0%,#29465f88,transparent 55%),radial-gradient(ellipse at 90% 100%,#1f3d5588,transparent 50%),linear-gradient(155deg,#0b1b2b,#14293d 50%,#0a1929)}
.dark-section::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;background-image:radial-gradient(1px 1px at 12% 22%,#fff8,transparent),radial-gradient(1px 1px at 72% 12%,#fff6,transparent),radial-gradient(1.5px 1.5px at 40% 70%,#f3dca288,transparent),radial-gradient(1px 1px at 85% 55%,#fff7,transparent),radial-gradient(1px 1px at 25% 85%,#fff5,transparent),radial-gradient(1.5px 1.5px at 58% 35%,#f3dca266,transparent);background-size:420px 420px}
.dark-section .container{position:relative;padding-top:90px;padding-bottom:100px}
.portal-grid{gap:20px}
.portal{background:#0c1d2e;border-color:#bca57855;isolation:isolate;min-height:330px;transition:transform .45s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .45s}
.portal::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#060f19 4%,#0d1f3166 60%,#0d1f3122),var(--img) center/cover no-repeat;transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter .6s;filter:saturate(.75) brightness(.9)}
.portal:hover::after{transform:scale(1.08);filter:saturate(1) brightness(1.05)}
.portal::before{content:"";position:absolute;inset:10px;pointer-events:none;opacity:.55;transition:inset .45s,opacity .45s;background:linear-gradient(var(--gold),var(--gold)) 0 0/18px 1px,linear-gradient(var(--gold),var(--gold)) 0 0/1px 18px,linear-gradient(var(--gold),var(--gold)) 100% 0/18px 1px,linear-gradient(var(--gold),var(--gold)) 100% 0/1px 18px,linear-gradient(var(--gold),var(--gold)) 0 100%/18px 1px,linear-gradient(var(--gold),var(--gold)) 0 100%/1px 18px,linear-gradient(var(--gold),var(--gold)) 100% 100%/18px 1px,linear-gradient(var(--gold),var(--gold)) 100% 100%/1px 18px;background-repeat:no-repeat}
.portal:hover{transform:translateY(-8px);border-color:#f3d59c;box-shadow:0 24px 50px -20px #000,0 0 40px -10px #d5b77855}
.portal:hover::before{inset:16px;opacity:1}
.portal h3{font-size:1.25rem;letter-spacing:.03em}
.portal h3::after{content:"";display:block;width:0;height:1px;margin-top:8px;background:var(--gold);transition:width .45s ease}
.portal:hover h3::after{width:56px}
.portal .arr{transition:transform .35s ease}
.portal:hover .arr{transform:translateX(5px)}

/* ---------- Events preview ---------- */
.mini-event{border-left:0;padding:22px 22px 20px;background:#fffdf7cc;border:1px solid #d9ccb0;position:relative;transition:transform .3s,box-shadow .3s}
.mini-event::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:2px;background:linear-gradient(var(--gold),var(--gold-lo))}
.mini-event:hover{transform:translateY(-3px);box-shadow:0 14px 30px -18px #26344466}
.mini-event strong{font-size:1.05rem;margin:4px 0 2px;color:#16273a}

/* ---------- Newsletter ---------- */
.newsletter{position:relative;overflow:hidden;padding:110px 30px;border-top:0;background:radial-gradient(ellipse at 50% 120%,#d5b77826,transparent 60%),linear-gradient(120deg,#0a1624,#1a3850,#0a1726)}
.newsletter::before{content:"";position:absolute;inset:28px;pointer-events:none;border:1px solid #d5b77833;outline:1px solid #d5b77818;outline-offset:6px}
.newsletter h2{font-size:clamp(2rem,4vw,3.2rem);background:var(--foil);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
.newsletter-form input{background:#081521cc;border-color:#d5b77866;transition:border-color .3s,box-shadow .3s}
.newsletter-form input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px #d5b77833,0 0 30px -6px #d5b77866}

/* ---------- Codex + events pages ---------- */
.lore-card{border-color:#d4c7a9;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.lore-card:hover{transform:translateY(-5px);box-shadow:0 18px 36px -18px #26344488}
.lore-thumb{transition:background-size .8s}
.filter-menu{background:linear-gradient(#14283b,#0e1f30);border-color:#d5b77844}
.event-item{border-left:0;border:1px solid #e1d6bf;position:relative;transition:transform .3s,box-shadow .3s}
.event-item::before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:3px;background:linear-gradient(var(--gold),var(--gold-lo))}
.event-item:hover{transform:translateX(4px);box-shadow:0 12px 28px -18px #26344488}
.sidebox{background:linear-gradient(#14283b,#0e1f30)}

/* Modal: eased entrance, framed */
.modal{display:flex;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s;backdrop-filter:blur(6px)}
.modal.open{opacity:1;visibility:visible}
.modal-box{transform:translateY(16px) scale(.98);transition:transform .45s cubic-bezier(.2,.7,.2,1);outline:1px solid #c0a56b55;outline-offset:-10px}
.modal.open .modal-box{transform:none}

/* Scroll reveals (books, portals, events) */
.fx .reveal{opacity:0;transform:translateY(26px);transition:opacity .9s ease var(--d,0s),transform .9s cubic-bezier(.2,.7,.2,1) var(--d,0s)}
.fx .reveal.in{opacity:1;transform:none}


.footer{background:linear-gradient(#09131f,#060d16);position:relative}
.footer::before{content:"";position:absolute;top:0;left:15%;right:15%;height:1px;background:linear-gradient(90deg,transparent,#d5b778aa,transparent)}

@media(max-width:650px){
  .hero{min-height:600px}
  .fx-art,.page-hero .fx-art{left:-4%;right:-4%;width:auto;opacity:.45;-webkit-mask-image:linear-gradient(transparent,#000 30%,#000 60%,transparent);mask-image:linear-gradient(transparent,#000 30%,#000 60%,transparent)}
  .books{gap:30px}
  .portal{min-height:220px}
  .newsletter{padding:80px 22px}
  .newsletter::before{inset:14px}
  .paper>.container{padding-top:64px;padding-bottom:64px}
}
@media(prefers-reduced-motion:reduce){
  .fx-art,.fx-glow,.fx-fog,.scroll-cue{animation:none!important}
  .fx .hero-copy>*,.fx .reveal{opacity:1!important;transform:none!important}
}

/* ---------- New art (October 2026) ---------- */
.portal.codex::after{background-position:center 30%}
.portal.characters::after{background-position:center 20%}
/* Flat covers: a bound-book edge and soft corners */
.book-card img{border-radius:2px 5px 5px 2px}
.book-card>div::before{content:"";position:absolute;top:0;bottom:0;left:0;width:7%;z-index:2;pointer-events:none;border-radius:2px 0 0 2px;background:linear-gradient(90deg,#00000059,#ffffff26 35%,#0000001f 60%,transparent)}
/* About: framed portrait. Multiply lets the white studio background melt into the parchment */
.about-wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,80px);align-items:center;max-width:1060px}
.author-portrait{margin:0;position:relative;padding:14px}
.author-portrait::before{content:"";position:absolute;inset:0;border:1px solid #c0a56b88;pointer-events:none}
.author-portrait::after{content:"";position:absolute;inset:-8px 22px;border-top:1px solid #c0a56b55;border-bottom:1px solid #c0a56b55;pointer-events:none}
.author-portrait img{width:100%;height:auto;mix-blend-mode:multiply;filter:contrast(1.04) sepia(.12)}
.about-copy .ornament{justify-content:flex-start}
.about-copy .ornament::before{display:none}
.about-copy h2{color:#1b2a3a}
.about-lead{font-family:'Libre Baskerville',serif;font-style:italic;font-size:1.25rem;color:#3a4a5b}
@media(max-width:760px){.about-wrap{grid-template-columns:1fr}.author-portrait{max-width:340px;margin-inline:auto}.about-copy{text-align:center}.about-copy .ornament{justify-content:center}.about-copy .ornament::before{display:block}.about-copy .actions{justify-content:center}}
@media(max-width:650px){.fx-art,.page-hero .fx-art{background-position:center 40%}}
.about-copy .btn{color:#1b2a3a;border-color:#a8864a}
.about-copy .btn:hover{background:#1b2a3a;color:#f3eee1;border-color:#1b2a3a}

/* ---------- Stability fixes ----------
   1. The header no longer changes height on scroll (that resized the page and fed back into the scroll position).
   2. Cards no longer move out from under the cursor on hover; they glow and zoom in place instead. */
.site-header.scrolled .nav-inner{min-height:74px}
.portal:hover,.lore-card:hover,.mini-event:hover,.event-item:hover{transform:none}
.lore-card{transition:box-shadow .35s,border-color .35s}
.lore-card:hover{box-shadow:0 0 0 1px #c0a56b,0 18px 36px -18px #26344488}
.lore-thumb{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.lore-card:hover .lore-thumb{transform:scale(1.06)}
.mini-event:hover{box-shadow:0 0 0 1px #c0a56b,0 14px 30px -18px #26344466}
.event-item:hover{box-shadow:0 0 0 1px #c0a56b,0 12px 28px -18px #26344488}
@media(max-width:650px){.site-header.scrolled .nav-inner{min-height:62px}}

/* ---------- Book cards: two links ---------- */
.book-links{display:flex;flex-direction:column;align-items:center;gap:10px}
.read-link{border-bottom-color:transparent;color:#5b6a78}
.read-link::before{content:"";display:inline-block;width:14px;height:11px;margin-right:8px;vertical-align:-1px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 18' fill='none' stroke='black' stroke-width='1.8'%3E%3Cpath d='M12 3C9 1 5 1 1.5 2v13C5 14 9 14 12 16c3-2 7-2 10.5-1V2C19 1 15 1 12 3zM12 3v13'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 18' fill='none' stroke='black' stroke-width='1.8'%3E%3Cpath d='M12 3C9 1 5 1 1.5 2v13C5 14 9 14 12 16c3-2 7-2 10.5-1V2C19 1 15 1 12 3zM12 3v13'/%3E%3C/svg%3E") center/contain no-repeat}
.read-link:hover{color:#8a6a33;border-bottom-color:#8a6a33}

/* ---------- Book panel ---------- */
.modal-box.book-modal{width:min(980px,100%);max-height:calc(100svh - 40px);overflow:auto;display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:clamp(24px,4vw,48px);align-items:start;padding:clamp(28px,4vw,48px)}
.bm-cover{position:sticky;top:0}
.bm-cover img{width:100%;height:auto;border-radius:2px 5px 5px 2px;box-shadow:0 26px 40px -18px #000c,0 6px 12px -6px #0008}
.bm-copy h2{font-size:clamp(2rem,4vw,2.8rem);margin:.15em 0 .5em}
.bm-copy p{line-height:1.75}
.bm-opening,.bm-closing{font-family:'Libre Baskerville',serif;font-style:italic;font-size:1.12rem;color:#f3dca2}
.bm-closing{margin-top:1.4em;padding-top:1.2em;border-top:1px solid #d5b77844}
.bm-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:28px}
.bm-actions span{display:contents}
.bm-actions [hidden]{display:none}
.bm-soon{font-size:.9rem;opacity:.7;font-style:italic}
@media(max-width:720px){.modal-box.book-modal{grid-template-columns:1fr}.bm-cover{position:static;max-width:200px}}


.book-card .book-links{margin:14px 0 0;display:flex;flex-direction:column;align-items:center;gap:12px}
.modal-box.book-modal{max-width:none}
.bm-opening,.bm-closing{color:#7a5a26}
.bm-closing{border-top-color:#c0a56b66}
.book-card>div{line-height:0;vertical-align:top}

/* ---------- Coming soon ---------- */
.nav-soon{display:inline-flex;align-items:center;gap:6px;color:#9aa8b4;cursor:default;font-size:inherit;letter-spacing:inherit;text-transform:inherit}
.nav-soon small{font-size:.62rem;letter-spacing:.08em;padding:2px 6px;border:1px solid #d5b77866;border-radius:999px;color:var(--gold)}
.soon-banner{display:inline-block;margin-top:14px!important;padding:6px 16px;border:1px solid #d5b77877;border-radius:999px;color:var(--gold)!important;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase}
.portal.soon{cursor:default}
.portal.soon::after{filter:saturate(.55) brightness(.7)}
.portal.soon:hover::after{filter:saturate(.8) brightness(.85)}
.soon-tag{position:absolute;right:16px;top:16px;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;padding:4px 10px;border:1px solid #d5b77888;border-radius:999px;color:#f3dca2;background:#08121ccc;backdrop-filter:blur(4px)}
@media(max-width:900px){.nav-links .nav-soon{padding:10px 0}}

/* ---------- Social links ---------- */
.socials{list-style:none;display:flex;gap:10px;padding:0;margin:20px 0 0}
.socials a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1px solid #c0a56b88;color:#7a5a26;transition:background .25s,color .25s,border-color .25s}
.socials a:hover{background:#1b2a3a;color:#f3dca2;border-color:#1b2a3a}
.socials svg{width:20px;height:20px}
.footer .socials{margin:12px 0 0;justify-content:center}
.footer .socials a{color:#d5b778;border-color:#d5b77855}
.footer .socials a:hover{background:#d5b778;color:#0c1b2a}
@media(max-width:760px){.about-copy .socials{justify-content:center}}
.nl-btn{margin-top:6px}
.bm-actions .btn:not(.primary){color:#1b2a3a;border-color:#a8864a}
.bm-actions .btn:not(.primary):hover{background:#1b2a3a;color:#f3eee1;border-color:#1b2a3a}
@media(max-width:900px){.nav-links .nav-soon{justify-content:center}}

.buy-link{border-bottom-color:transparent;color:#7a5a26}
.buy-link:hover{border-bottom-color:#7a5a26}

/* ---------- Book panel: previous / next ---------- */
.bm-nav{display:flex;justify-content:space-between;gap:12px;margin-top:28px;padding-top:18px;border-top:1px solid #c0a56b55}
.bm-nav:empty{display:none}
.bm-step{display:flex;flex-direction:column;gap:2px;background:none;border:0;padding:6px 0;min-height:44px;cursor:pointer;color:#1b2a3a;font:inherit;text-align:left;transition:color .25s}
.bm-step.next{margin-left:auto;text-align:right;align-items:flex-end}
.bm-step small{font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#8a6a33}
.bm-step span{font-family:'Libre Baskerville',serif;font-size:.98rem}
.bm-step:hover span{color:#8a6a33;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#c0a56b}

/* Book label always sits on its own line above the cover */
.book-card .book-num{display:flex;justify-content:center;width:100%;margin-bottom:14px}
.book-dots{display:none}

/* =====================================================================
   MOBILE (650px and below)
   ===================================================================== */
@media(max-width:650px){
  /* Hero: painting on top, words below on clean navy */
  .hero{min-height:auto;align-items:flex-end}
  .fx-art{inset:0 -4% auto -4%!important;width:auto!important;height:68vw;min-height:330px;max-height:520px;opacity:1!important;background-position:50% 30%!important;
    -webkit-mask-image:linear-gradient(#000 55%,transparent)!important;mask-image:linear-gradient(#000 55%,transparent)!important}
  .hero .fx-glow{top:2%;right:-10%;width:90vw}
  .hero .fx-fog.two{bottom:auto;top:30%}
  .hero .hero-inner{padding:calc(min(max(68vw,330px),520px) - 70px) 22px 64px}
  .hero-copy{text-shadow:0 2px 14px #000c}
  .hero .eyebrow{font-size:.68rem;letter-spacing:.2em}
  .hero h1{font-size:clamp(2.6rem,12vw,3.4rem);line-height:1.02}
  .hero .series{font-size:1.7rem}
  .hero .lead{font-size:1rem}
  .hero .actions{display:grid;grid-template-columns:1fr;gap:12px}
  .hero .actions .btn{justify-content:center;width:100%}
  .scroll-cue{display:none}

  /* Books: swipeable row with a peek of the next cover */
  .books{display:flex;grid-template-columns:none;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 14vw 18px;margin:0 -20px;scrollbar-width:none;perspective:none;-webkit-overflow-scrolling:touch}
  .books::-webkit-scrollbar{display:none}
  .book-card{flex:0 0 72vw;scroll-snap-align:center;padding:18px 6px 10px}
  .book-card img{height:auto;width:100%;max-width:230px;max-height:none;margin:0 auto}
  .book-card h3{font-size:1.45rem}
  .book-dots{display:flex;justify-content:center;gap:4px;margin-top:4px}
  .book-dots button{width:30px;height:30px;padding:0;border:0;background:none;cursor:pointer;position:relative}
  .book-dots button::after{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;margin:-4px;border-radius:50%;border:1px solid #a8864a;transition:background .25s,transform .25s}
  .book-dots button.on::after{background:#a8864a;transform:scale(1.15)}

  /* Section rhythm */
  .paper>.container{padding-top:56px;padding-bottom:56px}
  .dark-section .container{padding-top:60px;padding-bottom:64px}
  .section-heading h2{font-size:1.75rem}

  /* World teaser: single column of short banners */
  .portal-grid{grid-template-columns:1fr;gap:12px}
  .portal{min-height:150px}
  .portal p{max-width:none}

  /* About: smaller portrait */
  .author-portrait{max-width:240px;padding:10px}
  .about-wrap{gap:28px}
  .about-lead{font-size:1.1rem}

  /* Events preview stacks neatly */
  .event-preview{gap:18px}

  /* Book panel as a sheet */
  .modal{align-items:flex-end;padding:0}
  .modal-box.book-modal{max-height:92svh;border-radius:14px 14px 0 0;padding:26px 20px calc(24px + env(safe-area-inset-bottom,0px));gap:18px}
  .bm-cover{max-width:150px;margin:0 auto}
  .bm-copy{text-align:left}
  .bm-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .bm-actions .btn{justify-content:center;width:100%}
}
@media(max-width:650px){.fx .books .reveal{opacity:1;transform:none}}

/* ---------- Extras dropdown ---------- */
.nav-drop{position:relative}
.nav-drop-btn{display:inline-flex;align-items:center;gap:7px;background:none;border:0;padding:8px 0;color:inherit;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer}
.nav-drop-btn svg{width:10px;height:7px;transition:transform .3s}
.nav-drop-btn:hover,.nav-drop.open .nav-drop-btn{color:var(--gold)}
.nav-drop.open .nav-drop-btn svg{transform:rotate(180deg)}
.nav-sub{list-style:none;margin:0;padding:10px 0;position:absolute;top:calc(100% + 14px);left:50%;min-width:230px;background:#081521f2;backdrop-filter:blur(10px);border:1px solid #d5b77855;box-shadow:0 18px 40px -12px #000c;
  opacity:0;visibility:hidden;transform:translate(-50%,-6px);transition:opacity .25s,transform .25s,visibility .25s;z-index:60}
.nav-sub::before{content:"";position:absolute;top:-6px;left:50%;width:10px;height:10px;background:#081521;border-left:1px solid #d5b77855;border-top:1px solid #d5b77855;transform:translateX(-50%) rotate(45deg)}
.nav-drop.open .nav-sub{opacity:1;visibility:visible;transform:translate(-50%,0)}
@media(hover:hover) and (min-width:651px){.nav-drop:hover .nav-sub{opacity:1;visibility:visible;transform:translate(-50%,0)}.nav-drop:hover .nav-drop-btn svg{transform:rotate(180deg)}.nav-drop::after{content:"";position:absolute;left:-20px;right:-20px;top:100%;height:18px}}
.nav-sub li{padding:0}
.nav-sub .nav-soon{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:11px 20px;white-space:nowrap}
@media(max-width:650px){
  .nav-drop{display:flex;flex-direction:column;align-items:center}
  .nav-drop-btn{justify-content:center;min-height:44px}
  .nav-sub{position:static;transform:none;min-width:0;width:100%;max-width:300px;box-shadow:none;background:#0c1d2e;display:none;opacity:1;visibility:visible;margin-top:6px}
  .nav-sub::before{display:none}
  .nav-drop.open .nav-sub{display:block;transform:none}
  .nav-sub .nav-soon{justify-content:space-between}
}

/* ---------- World teaser: emblem placeholders (no imagery) ---------- */
.portal.ph{display:flex;flex-direction:column;justify-content:flex-end}
.portal.ph::after{background:
  radial-gradient(circle at 50% 34%,#d5b7781f 0%,transparent 48%),
  repeating-linear-gradient(135deg,#ffffff05 0 1px,transparent 1px 9px),
  linear-gradient(170deg,#132c42,#0a1826 70%);filter:none}
.portal.ph:hover::after{transform:none;filter:none;background:
  radial-gradient(circle at 50% 34%,#d5b7782e 0%,transparent 52%),
  repeating-linear-gradient(135deg,#ffffff05 0 1px,transparent 1px 9px),
  linear-gradient(170deg,#15304a,#0b1a29 70%)}
.ph-emblem{position:absolute;left:50%;top:34%;width:88px;height:88px;transform:translate(-50%,-50%);fill:none;stroke:#d5b778;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round;opacity:.85;filter:drop-shadow(0 0 10px #d5b77844);transition:transform .8s cubic-bezier(.2,.7,.2,1),opacity .4s,filter .4s}
.portal.ph:hover .ph-emblem{opacity:1;filter:drop-shadow(0 0 16px #d5b77877);transform:translate(-50%,-54%) scale(1.04)}
.portal.maps:hover .ph-emblem{transform:translate(-50%,-50%) rotate(22deg)}
.ph-num{position:absolute;left:22px;top:18px;font-family:Cinzel,'Libre Baskerville',serif;font-size:.85rem;letter-spacing:.2em;color:#d5b778aa}
.portal.ph .portal-content{text-align:center;width:100%}
.portal.ph h3::after{margin-inline:auto}
.portal.ph p{margin-inline:auto;max-width:24ch}
@media(max-width:650px){
  .portal.ph{min-height:180px;flex-direction:row;align-items:center;justify-content:flex-start;padding-left:118px}
  .ph-emblem{left:62px;top:50%;width:64px;height:64px}
  .portal.ph:hover .ph-emblem{transform:translate(-50%,-50%)}
  .portal.ph .portal-content{text-align:left}
  .portal.ph h3::after{margin-inline:0}
  .portal.ph p{margin-inline:0}
  .ph-num{left:auto;right:18px;top:auto;bottom:16px}
}

/* World teaser: "Coming soon" sits where the emblem was */
.ph-soon{position:absolute;left:50%;top:36%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:12px;white-space:nowrap;
  font-family:Cinzel,'Libre Baskerville',serif;font-size:.95rem;letter-spacing:.22em;text-transform:uppercase;color:#d5b778;
  text-shadow:0 0 18px #d5b77855;transition:color .4s,text-shadow .4s,gap .5s ease}
.ph-soon::before,.ph-soon::after{content:"";width:22px;height:1px;background:linear-gradient(90deg,transparent,#d5b778)}
.ph-soon::after{transform:scaleX(-1)}
.portal.ph:hover .ph-soon{color:#f3dca2;text-shadow:0 0 22px #d5b77888;gap:16px}
@media(max-width:650px){
  .portal.ph{flex-direction:column;align-items:stretch;justify-content:flex-end;padding-left:0;min-height:200px}
  .ph-soon{top:34%}
  .portal.ph .portal-content{text-align:center}
  .portal.ph h3::after{margin-inline:auto}
  .portal.ph p{margin-inline:auto}
  .ph-num{left:18px;right:auto;top:16px;bottom:auto}
}
/* Former inline styles (kept out of HTML so the security policy can block inline styles) */
.nl-hint{margin-top:14px}
.codex-note-lead{color:#7a653e;margin-bottom:16px}
.events-small{font-size:.82rem;margin-top:15px}