:root{
  --black:#130D08;
  --vellum:#E9D6A6;
  --gold:#C39A3D;
  --green:#2F6B55;
  --oxblood:#8F2D24;
  --lapis:#244E8A;
  --violet:#563B7C;
  --display:'Uncial Antiqua',serif;
  --body:'Alegreya',serif;
  --seal:'IM Fell English SC',serif;
  --mono:'JetBrains Mono',monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--black)}
body{margin:0;color:var(--vellum);font-family:var(--body);background:radial-gradient(circle at 20% 10%,rgba(86,59,124,.35),transparent 34rem),radial-gradient(circle at 84% 72%,rgba(36,78,138,.35),transparent 38rem),linear-gradient(120deg,#130D08 0%,#1d120a 44%,#080604 100%);overflow-x:hidden}
.grain{position:fixed;inset:0;pointer-events:none;z-index:50;opacity:.28;background-image:radial-gradient(rgba(233,214,166,.18) 1px,transparent 1px),radial-gradient(rgba(19,13,8,.6) 1px,transparent 1px);background-size:4px 4px,7px 7px;mix-blend-mode:overlay}
.lamplight{position:fixed;width:24rem;height:24rem;margin:-12rem 0 0 -12rem;border-radius:50%;pointer-events:none;z-index:40;background:radial-gradient(circle,rgba(233,214,166,.28),rgba(195,154,61,.13) 28%,transparent 66%);mix-blend-mode:screen;transition:opacity .4s ease;opacity:.85}
.quest-compass{position:fixed;right:1.2rem;top:1rem;z-index:60;width:9rem;height:9rem;border:1px solid rgba(195,154,61,.55);border-radius:50%;background:radial-gradient(circle,rgba(233,214,166,.16),rgba(19,13,8,.86));box-shadow:0 0 2rem rgba(195,154,61,.18),inset 0 0 0 1rem rgba(36,78,138,.09);animation:compass-breathe 7s ease-in-out infinite}
.quest-compass:before,.quest-compass:after{content:"";position:absolute;inset:.85rem;border:1px dashed rgba(233,214,166,.35);border-radius:50%}.quest-compass:after{inset:2.45rem;border-color:rgba(47,107,85,.55)}
.quest-compass button{position:absolute;left:50%;top:50%;width:3.2rem;margin:-.65rem 0 0 -1.6rem;padding:.15rem;border:0;background:transparent;color:var(--gold);font-family:var(--seal);font-size:.75rem;cursor:pointer;text-shadow:0 0 .6rem var(--black)}
.quest-compass button:nth-child(1){transform:rotate(260deg) translate(3.4rem) rotate(-260deg)}.quest-compass button:nth-child(2){transform:rotate(315deg) translate(3.4rem) rotate(-315deg)}.quest-compass button:nth-child(3){transform:rotate(15deg) translate(3.4rem) rotate(-15deg)}.quest-compass button:nth-child(4){transform:rotate(75deg) translate(3.4rem) rotate(-75deg)}.quest-compass button:nth-child(5){transform:rotate(135deg) translate(3.4rem) rotate(-135deg)}.quest-compass button:nth-child(6){transform:rotate(195deg) translate(3.4rem) rotate(-195deg)}
.codex{position:relative;min-height:700vh}.act{position:relative;min-height:100vh;padding:8rem clamp(1.5rem,5vw,6rem);overflow:hidden;display:grid;align-items:center}.act:before{content:"";position:absolute;inset:5vw;border:1px solid rgba(195,154,61,.22);clip-path:polygon(0 4%,96% 0,100% 88%,6% 100%);pointer-events:none}.route-map{position:fixed;inset:0;width:100vw;height:100vh;z-index:3;pointer-events:none;filter:drop-shadow(0 0 .55rem rgba(195,154,61,.55))}.route-shadow,.route-line{fill:none;stroke-linecap:round;stroke-linejoin:round}.route-shadow{stroke:rgba(19,13,8,.85);stroke-width:16}.route-line{stroke:var(--gold);stroke-width:5;stroke-dasharray:1600;stroke-dashoffset:1600}.route-dots circle{fill:var(--oxblood);stroke:var(--vellum);stroke-width:2;opacity:.9}
.hero-act{place-items:center;text-align:center;background:radial-gradient(circle at center,rgba(36,78,138,.18),transparent 32rem)}h1{font-family:var(--display);font-size:clamp(4.5rem,14vw,13rem);font-weight:400;margin:.2rem 0;color:var(--vellum);text-shadow:.05em .05em 0 var(--black),0 0 1.6rem rgba(195,154,61,.5)}h2{font-family:var(--display);font-weight:400;font-size:clamp(2rem,4.8vw,5.4rem);line-height:1.02;margin:.4rem 0 1rem;color:var(--black)}p{font-size:clamp(1.05rem,1.7vw,1.55rem);line-height:1.5}.incantation{max-width:48rem;color:var(--vellum);font-size:clamp(1.35rem,2.2vw,2.35rem)}.chapter-kicker,.marginal-label{font-family:var(--seal);letter-spacing:.08em;color:var(--gold);text-transform:lowercase}.field-note{font-family:var(--mono);font-size:.8rem;color:rgba(233,214,166,.72);border-top:1px solid rgba(195,154,61,.35);padding-top:1rem}.hero-seal,.wax-seal{display:grid;place-items:center;width:6rem;height:6rem;border-radius:50%;background:radial-gradient(circle at 30% 28%,#b44136,var(--oxblood) 58%,#4d1510);box-shadow:inset -.4rem -.5rem 1rem rgba(19,13,8,.55),0 0 0 .3rem rgba(143,45,36,.35);font-family:var(--display);font-size:3rem;color:var(--vellum)}
.candle{position:absolute;width:12rem;height:12rem;border-radius:50%;background:radial-gradient(circle,rgba(233,214,166,.38),rgba(195,154,61,.18) 28%,transparent 62%);animation:flicker 3s infinite}.c1{left:9%;top:18%}.c2{right:18%;bottom:17%;animation-delay:-1s}.c3{left:55%;top:8%;animation-delay:-2s}.codex-clasp{position:absolute;top:44%;width:6rem;height:13rem;border:1px solid rgba(195,154,61,.7);background:linear-gradient(90deg,rgba(195,154,61,.08),rgba(195,154,61,.4),rgba(19,13,8,.7))}.codex-clasp.left{left:0;border-radius:0 2rem 2rem 0}.codex-clasp.right{right:0;border-radius:2rem 0 0 2rem}.marginal-dragon{position:absolute;left:8%;bottom:11%;width:8rem;height:4rem;border-radius:60% 20% 50% 30%;border:2px solid var(--green);transform:rotate(-14deg);animation:twitch 5s steps(2,end) infinite}.marginal-dragon:before{content:"";position:absolute;right:-2rem;top:.7rem;border-left:2.2rem solid var(--green);border-top:1rem solid transparent;border-bottom:1rem solid transparent}.marginal-dragon span{position:absolute;right:.9rem;top:.8rem;width:.45rem;height:.45rem;border-radius:50%;background:var(--gold);animation:blink 4s infinite}
.chapter-panel,.wax-dispatch,.rubbing-sheet{position:relative;z-index:10;max-width:54rem;padding:clamp(1.5rem,4vw,4rem);color:var(--black);background:linear-gradient(135deg,rgba(233,214,166,.96),rgba(214,184,116,.9));box-shadow:0 1.3rem 3rem rgba(0,0,0,.45),inset 0 0 0 2px rgba(195,154,61,.5);clip-path:polygon(2% 0,100% 4%,96% 96%,0 100%)}.chapter-panel p,.wax-dispatch p,.rubbing-sheet p{color:#27180d}.sigil{float:left;margin:.15rem 1rem .25rem 0;font-family:var(--display);font-size:6rem;line-height:.8;color:var(--lapis);text-shadow:2px 2px 0 var(--gold)}.marginal-label{position:absolute;z-index:11;writing-mode:vertical-rl;left:1.2rem;top:8rem;color:rgba(233,214,166,.72)}
.parchment-coast{background:radial-gradient(circle at 35% 42%,rgba(233,214,166,.2),transparent 28rem),linear-gradient(140deg,transparent 55%,rgba(36,78,138,.38) 56%,rgba(36,78,138,.08))}.compass-rose{position:absolute;right:12%;top:22%;width:14rem;height:14rem;border:1px solid rgba(195,154,61,.65);border-radius:50%;animation:rotate-align 20s linear infinite}.compass-rose:before{content:"";position:absolute;inset:1.4rem;border:1px dashed rgba(233,214,166,.35);border-radius:50%}.compass-rose b{position:absolute;left:50%;top:.8rem;color:var(--gold);font-family:var(--seal)}.compass-rose i{position:absolute;left:50%;top:50%;width:1px;height:11rem;background:rgba(195,154,61,.55);transform-origin:50% 0}.compass-rose i:nth-child(3){transform:rotate(60deg)}.compass-rose i:nth-child(4){transform:rotate(120deg)}.ink-birds span{position:absolute;width:1.4rem;height:.55rem;border-top:2px solid var(--black);border-radius:50%;opacity:.65;animation:birds 12s linear infinite}.ink-birds span:nth-child(1){left:18%;top:30%}.ink-birds span:nth-child(2){left:22%;top:34%;animation-delay:-2s}.ink-birds span:nth-child(3){left:28%;top:26%;animation-delay:-4s}.ink-birds span:nth-child(4){left:35%;top:31%;animation-delay:-6s}
.cathedral-plan{background:linear-gradient(90deg,rgba(47,107,85,.18) 1px,transparent 1px),linear-gradient(rgba(47,107,85,.18) 1px,transparent 1px),radial-gradient(circle at 50% 55%,rgba(195,154,61,.13),transparent 32rem);background-size:5rem 5rem,5rem 5rem,auto}.reliquary{position:relative;z-index:10;max-width:62rem;min-height:30rem;margin:auto;perspective:900px}.door{position:absolute;top:0;bottom:0;width:50%;background:linear-gradient(135deg,rgba(19,13,8,.95),rgba(86,59,124,.58));border:2px solid var(--gold);transition:transform 1s cubic-bezier(.2,.8,.2,1);z-index:2}.left-door{left:0;transform-origin:left}.right-door{right:0;transform-origin:right}.reliquary.open .left-door{transform:rotateY(-104deg)}.reliquary.open .right-door{transform:rotateY(104deg)}.relic-text{padding:4rem;background:rgba(233,214,166,.94);color:var(--black);min-height:30rem}.floor-lines{position:absolute;inset:12%;border:1px solid rgba(195,154,61,.3);border-radius:50% 50% 4rem 4rem;opacity:.5}
.battlefield{background:repeating-radial-gradient(ellipse at 62% 45%,rgba(143,45,36,.34) 0 2px,transparent 3px 26px),radial-gradient(circle at 65% 50%,rgba(143,45,36,.28),transparent 30rem)}.wax-dispatch{margin-left:auto}.wax-dispatch.split .wax-seal{animation:split-seal .9s forwards}.contours{position:absolute;inset:20%;background:repeating-radial-gradient(ellipse at center,transparent 0 24px,rgba(143,45,36,.58) 25px 27px);filter:blur(.2px);opacity:.55}.genealogy{background:radial-gradient(circle at 20% 40%,rgba(47,107,85,.3),transparent 26rem)}.vine-map{position:absolute;inset:10% 5%;background:linear-gradient(28deg,transparent 49.8%,rgba(195,154,61,.65) 50%,transparent 50.5%),linear-gradient(-18deg,transparent 49.8%,rgba(195,154,61,.48) 50%,transparent 50.5%)}.node{position:absolute;z-index:8;display:grid;place-items:center;width:4.5rem;height:4.5rem;border-radius:50%;background:var(--vellum);color:var(--black);border:3px solid var(--gold);font-family:var(--seal);font-size:1.4rem}.node:nth-child(1){left:12%;bottom:12%}.node:nth-child(2){left:33%;bottom:36%}.node:nth-child(3){left:52%;top:25%;background:var(--oxblood);color:var(--vellum)}.node:nth-child(4){right:25%;top:34%}.node:nth-child(5){right:9%;top:12%;background:var(--violet);color:var(--vellum)}.narrow{margin-left:auto;max-width:46rem}.crypt{background:linear-gradient(90deg,rgba(233,214,166,.06) 1px,transparent 1px),radial-gradient(circle at 44% 44%,rgba(86,59,124,.28),transparent 26rem);background-size:3rem 3rem,auto}.rubbing-sheet{margin:auto;text-align:center;background:linear-gradient(135deg,rgba(19,13,8,.72),rgba(233,214,166,.88));color:var(--vellum);mix-blend-mode:normal}.rubbing-sheet h2,.rubbing-sheet p{color:var(--vellum)}.glyphs{font-family:var(--mono);letter-spacing:.15em;color:var(--gold)}.brush{position:absolute;right:20%;bottom:20%;width:12rem;height:.7rem;background:var(--green);transform:rotate(-28deg);box-shadow:3rem 0 0 var(--gold)}.star-chamber{place-items:center;text-align:center;background:radial-gradient(circle at center,rgba(36,78,138,.45),transparent 24rem),radial-gradient(circle at 70% 30%,rgba(86,59,124,.45),transparent 30rem)}.astrolabe{position:absolute;width:min(70vw,40rem);height:min(70vw,40rem);border-radius:50%;border:2px solid rgba(195,154,61,.7);animation:rotate-align 30s linear infinite}.astrolabe:before,.astrolabe:after,.astrolabe span{content:"";position:absolute;inset:8%;border:1px solid rgba(233,214,166,.35);border-radius:50%}.astrolabe:after{inset:22%;border-color:rgba(86,59,124,.75)}.astrolabe span:nth-child(1){inset:48% 4%;height:1px;border:0;background:var(--gold)}.astrolabe span:nth-child(2){inset:4% 48%;width:1px;border:0;background:var(--gold)}.final-panel{margin:auto;max-width:58rem}
.act.in-view .chapter-panel,.act.in-view .wax-dispatch,.act.in-view .rubbing-sheet{animation:curl-in 1s both}.act.in-view .sigil{animation:gold-glint 1.7s ease both}
@keyframes flicker{0%,100%{transform:scale(1);opacity:.65}45%{transform:scale(.82);opacity:.32}55%{transform:scale(1.08);opacity:.8}}@keyframes twitch{0%,90%,100%{transform:rotate(-14deg) translate(0)}92%{transform:rotate(-11deg) translate(.2rem,-.1rem)}}@keyframes blink{0%,92%,100%{transform:scaleY(1)}94%,97%{transform:scaleY(.05)}}@keyframes compass-breathe{50%{transform:rotate(4deg);box-shadow:0 0 3rem rgba(195,154,61,.3),inset 0 0 0 1rem rgba(36,78,138,.15)}}@keyframes rotate-align{to{transform:rotate(360deg)}}@keyframes birds{to{transform:translate(45vw,-18vh)}}@keyframes split-seal{50%{clip-path:polygon(0 0,45% 0,55% 100%,0 100%)}100%{transform:scale(1.2) rotate(12deg);opacity:.5}}@keyframes curl-in{from{transform:rotateX(18deg) translateY(2rem);opacity:.45}to{transform:rotateX(0) translateY(0);opacity:1}}@keyframes gold-glint{50%{text-shadow:0 0 1.2rem var(--gold),2px 2px 0 var(--oxblood)}}
@media (max-width:760px){.quest-compass{transform:scale(.72);right:-.7rem;top:-.7rem}.act{padding:7rem 1.2rem}.marginal-label{display:none}h1{font-size:4rem}.route-map{opacity:.7}.chapter-panel,.wax-dispatch,.rubbing-sheet,.relic-text{padding:1.4rem}.reliquary{min-height:34rem}.relic-text{min-height:34rem}.compass-rose{right:-3rem;top:12%;opacity:.45}}