@font-face{font-family:'Todd Script';src:url('assets/fonts/Satisfy-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
:root{--script:'Todd Script','Cormorant Garamond',cursive}
.wordmark span{font-family:var(--script);font-size:35px;font-weight:400;letter-spacing:-.025em}
.cover-title h1{font-family:var(--script);font-size:calc(var(--page-w)*.18);font-weight:400;letter-spacing:-.025em;line-height:1.15}
.title-page h2>span{font-family:var(--script);font-size:1.02em;line-height:1.3;font-style:normal;font-weight:400}
.handwritten,.portrait-note{font-family:var(--script);font-weight:400;font-style:normal}
.portrait-page .portrait-note{color:#c6af7a;background:#233028ed;text-shadow:0 1px 1px #0004}
.portrait-page .folio-mark>span,.prose-page .folio-mark>span,.spell-guide .folio-mark>span{color:#c9a7ff;-webkit-text-stroke:.2px #6a4592;text-shadow:0 1px 1px #46324c80}
.prose-page blockquote,.spell-guide p.handwritten{color:#c6af7a;-webkit-text-stroke:.3px #79602c;text-shadow:0 1px 0 #72551e55}
.spell-guide .handwritten{font-size:calc(var(--page-w)*.044);line-height:1.35}
#intro-replay{font:inherit;padding:5px 0;border-bottom:1px solid #8f9b7155;color:#9aa58c}
#intro-replay:hover{color:#ded7b9}

.cinematic-intro{position:fixed;inset:0;isolation:isolate;z-index:100;overflow:hidden;color:#eee6cf;background:transparent}
.cinematic-intro[hidden]{display:none}
.cinematic-intro:focus,.book h2[tabindex='-1']:focus{outline:none}
.intro-stage{position:absolute;inset:0;overflow:hidden;background:#000;opacity:1;transition:opacity .65s ease}
.intro-film{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:contain;object-position:center;display:block}
.intro-controls{position:absolute;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));z-index:3;display:flex;align-items:center;gap:6px;transition:opacity .2s;color:#eee6cf;text-shadow:0 1px 5px #000}
.intro-controls button{min-width:44px;min-height:44px;padding:10px 14px;font:14px var(--body);white-space:nowrap;background:#0008;border:1px solid #e9dfc222;border-radius:2px}
.intro-controls button:hover{background:#000b;border-color:#e9dfc266}
#intro-sound::before{content:'';display:inline-block;width:5px;height:5px;margin-right:8px;background:#929a82;border-radius:50%}
#intro-sound[aria-pressed=true]::before{background:#d1e9ac;box-shadow:0 0 8px #bee4b455}
.intro-bridge{position:absolute;inset:0;z-index:2;pointer-events:none}
.intro-book-backing{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;filter:drop-shadow(0 14px 8px #0009)}
.intro-leaf{position:absolute;left:0;top:0;transform-origin:0 0;pointer-events:none;will-change:transform,opacity;filter:drop-shadow(0 13px 6px #0006)}
.intro-leaf-left>.paper{box-shadow:inset -16px 0 30px -15px #625231aa,inset 2px 0 6px #493b2833}
.intro-leaf-right>.paper{box-shadow:inset 16px 0 30px -15px #625231aa,inset -2px 0 6px #493b2833}
.cinematic-intro[data-state=revealing] .intro-stage{opacity:0}
.cinematic-intro[data-state=revealing] .intro-controls{opacity:0;pointer-events:none;visibility:hidden;transition:opacity .2s,visibility 0s .2s}
.intro-matching .intro-stage{transition:none}
.intro-active .masthead,.intro-active .corner-note{opacity:0}
.intro-active .book-controls{pointer-events:none;opacity:0}
.intro-active .book-stage{opacity:0}
.intro-active.is-open .book-camera{transition:none}
.intro-finishing:not(.intro-matching) .book-stage{animation:book-materialize .65s ease both}
@keyframes book-materialize{from{opacity:0}to{opacity:1}}
@media(max-width:600px){.intro-controls{right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom))}.intro-controls button{font-size:13px;padding:10px 12px}}
@media(max-width:760px){.left-corner{display:block;left:22px;bottom:12px}}
@media(max-width:480px){.right-corner{display:none}}
@media(prefers-reduced-motion:reduce){.intro-stage,.intro-controls{transition:none!important}.intro-bridge{display:none}}