:root{--ink:#18130d;--gold:#b59a65;--gold-light:#d8c28e;--panel:rgba(9,9,8,.88);--paper:#cbb58a;--fade:1.7s}*{box-sizing:border-box}html,body{height:100%;margin:0}body{overflow:hidden;background:#080a08;color:#ddd;font-family:Georgia,"Times New Roman",serif}.background{position:fixed;inset:0;background:url("assets/images/street.png") center 42%/cover no-repeat;filter:blur(1.1px) brightness(.48) saturate(.76);z-index:-3;overflow:hidden}.background:after{content:"";position:absolute;inset:0;background:url("assets/images/street.png") center 44%/auto 112% no-repeat;filter:brightness(.72) saturate(.78);opacity:.82}.vignette{position:fixed;inset:0;background:radial-gradient(circle at center,transparent 28%,rgba(0,0,0,.42) 73%,rgba(0,0,0,.86) 100%),linear-gradient(180deg,rgba(10,15,15,.13),rgba(0,0,0,.32));z-index:-2}.view{position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--fade) ease,visibility 0s linear var(--fade)}.view.active{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}button{font:inherit}.intro-panel,.hub-panel{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);width:min(700px,88vw);text-align:center;text-shadow:0 3px 12px #000}.eyebrow{color:#c8b68d;letter-spacing:.18em;text-transform:uppercase;font-size:clamp(.75rem,1.2vw,1rem)}h1{margin:.15em 0;font-size:clamp(3rem,7vw,6.7rem);font-weight:500;letter-spacing:.18em;padding-left:.18em;text-transform:uppercase;color:#d8cfb9}.ornament{color:var(--gold);margin:1rem}.tagline{font-size:clamp(1.15rem,2vw,1.55rem);line-height:1.55;color:#d1c7b1;margin:1.5rem}.gothic-button{width:100%;min-height:76px;padding:16px 22px;border:1px solid #7e6840;outline:1px solid rgba(181,154,101,.25);outline-offset:-6px;background:linear-gradient(rgba(21,21,18,.95),rgba(8,8,7,.97));color:#cfb780;text-transform:uppercase;letter-spacing:.09em;cursor:pointer;box-shadow:0 9px 24px rgba(0,0,0,.52),inset 0 0 25px rgba(181,154,101,.04);transition:.35s ease}.gothic-button:hover,.gothic-button:focus-visible{color:#f0dca6;border-color:#d0af6d;box-shadow:0 0 22px rgba(197,145,54,.19),inset 0 0 28px rgba(181,154,101,.09);transform:translateY(-1px)}.gothic-button.large{width:auto;min-width:330px;margin-top:1.2rem}.hub-panel{width:min(480px,88vw)}.hub-nav{display:grid;gap:18px;margin-top:2rem}.hub-nav span{display:inline-block;width:55px;font-size:1.55rem;margin-right:12px}.content-view{display:grid;grid-template-columns:minmax(230px,26vw) minmax(520px,760px) minmax(225px,24vw);align-items:center;justify-content:center;gap:clamp(18px,2.3vw,44px);padding:clamp(18px,3vw,54px)}.side-panel{align-self:stretch;display:flex;flex-direction:column;justify-content:center;min-width:0}.brand{text-align:center;color:#d3c6aa;text-shadow:0 3px 9px #000;margin-bottom:24px}.brand h2{font-size:clamp(1.8rem,3vw,3.2rem);font-weight:500;letter-spacing:.13em;text-transform:uppercase;margin:0 0 8px}.brand p{margin:0;color:#b6a789}.compact{min-height:62px}.secondary-nav{display:grid;gap:12px;margin-top:18px}.hidden{display:none!important}.manuscript{height:min(88vh,980px);min-height:620px;position:relative;padding:clamp(42px,4.2vw,72px) clamp(40px,4.6vw,78px);color:var(--ink);background-color:#c8b184;background-image:linear-gradient(rgba(214,195,154,.08),rgba(128,92,49,.05)),url("assets/images/paper.png");background-size:100% 100%;background-position:center;background-repeat:no-repeat;border:0;border-radius:3px;box-shadow:0 24px 65px rgba(0,0,0,.78),0 0 0 1px rgba(54,35,18,.5),inset 0 0 36px rgba(49,29,11,.18)}.manuscript:before{content:"";position:absolute;inset:4.5% 5.2%;pointer-events:none;background:rgba(224,207,170,.08);mix-blend-mode:screen}.manuscript:after{content:"";position:absolute;inset:3.2%;pointer-events:none;box-shadow:inset 0 0 32px rgba(48,29,13,.15)}.paper-inner{height:100%;display:flex;flex-direction:column;position:relative;z-index:1}.paper-header{text-align:center;flex:0 0 auto}.section-kicker{text-transform:uppercase;letter-spacing:.18em;font-size:.95rem;margin:0 0 12px}.paper-header h2{font-size:clamp(1.55rem,2.4vw,2.35rem);letter-spacing:.08em;text-transform:uppercase;font-weight:500;margin:0}.paper-rule{margin:14px auto 18px;color:#4b3118}.paper-content{overflow-y:auto;padding:0 clamp(5px,2vw,26px) 50px;font-size:clamp(1rem,1.2vw,1.18rem);line-height:1.72;scrollbar-color:#765a32 transparent;scrollbar-width:thin}.paper-content p{margin:0 0 1.15em;text-indent:3em}.paper-content p:first-of-type:first-letter{float:left;font-size:4.2em;line-height:.75;margin:.12em .12em 0 0;font-weight:bold}.paper-content .chapter-illustration{display:block;width:min(100%,620px);max-height:58vh;object-fit:contain;margin:1.25rem auto 2rem;filter:sepia(.18) contrast(.95);box-shadow:0 8px 20px rgba(38,22,9,.28);cursor:zoom-in;transition:filter .25s ease,transform .25s ease}.paper-content .chapter-illustration:hover{filter:sepia(.08) contrast(1.02);transform:scale(1.01)}.right-panel h3{text-align:center;color:#ccb784;text-transform:uppercase;letter-spacing:.18em;font-weight:500}.chapter-list{display:grid;gap:8px;max-height:72vh;overflow-y:auto;padding:4px}.chapter-list button{background:rgba(10,10,8,.88);color:#9d8b66;border:1px solid #55452c;padding:12px 9px;min-height:48px;cursor:pointer;font:inherit;transition:.3s}.chapter-list button:hover{color:#d8c391;border-color:#9f804b}.chapter-list button.active{color:#241a0e;background:linear-gradient(#d8c59e,#b89e70);border-color:#e4cc94;box-shadow:0 0 20px rgba(219,157,49,.28);font-weight:bold}.map-manuscript{padding:clamp(34px,3.8vw,58px);display:flex;flex-direction:column}.map-toolbar{display:flex;align-items:center;justify-content:center;gap:10px;flex:0 0 45px;text-transform:uppercase;letter-spacing:.1em}.map-toolbar span{margin:0 10px}.map-toolbar button{border:1px solid #634923;background:#23190f;color:#ddc999;padding:5px 12px;cursor:pointer}.map-viewport{flex:1;overflow:hidden;position:relative;cursor:grab;border:1px solid rgba(55,34,15,.5);background:#1a140c}.map-viewport.dragging{cursor:grabbing}.map-viewport img{position:absolute;left:50%;top:50%;width:100%;height:auto;max-width:none;transform-origin:center;user-select:none;pointer-events:none}.map-note{color:#c9b994;text-align:center;text-shadow:0 2px 5px #000}.map-note p{line-height:1.7}.image-lightbox{position:fixed;inset:0;z-index:30;display:flex;flex-direction:column;background:rgba(3,4,3,.94);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s ease,visibility 0s linear .35s}.image-lightbox.open{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}.lightbox-toolbar{height:58px;display:flex;align-items:center;justify-content:center;gap:10px;background:rgba(10,10,8,.92);border-bottom:1px solid #5e4a2d;color:#d7c08b}.lightbox-toolbar button{border:1px solid #725a34;background:#17130d;color:#ddc999;padding:7px 14px;cursor:pointer;font:inherit}.lightbox-toolbar .close-lightbox{position:absolute;right:18px}.lightbox-viewport{position:relative;flex:1;overflow:hidden;cursor:grab}.lightbox-viewport.dragging{cursor:grabbing}.lightbox-viewport img{position:absolute;left:50%;top:50%;max-width:88vw;max-height:84vh;transform-origin:center;user-select:none;pointer-events:none;box-shadow:0 18px 60px #000}
@media(max-width:1050px){body{overflow:auto}.view{position:fixed;overflow-y:auto}.content-view{grid-template-columns:1fr;display:block;padding:18px}.side-panel{display:block}.brand{margin:5px 0 15px}.left-panel{max-width:760px;margin:0 auto 14px}.right-panel{max-width:760px;margin:18px auto 0}.manuscript{max-width:760px;margin:auto;height:72vh;min-height:540px}.chapter-list{grid-template-columns:repeat(2,minmax(0,1fr));max-height:30vh}.map-note{display:none}}@media(max-width:600px){.background:after{background-size:auto 105%;background-position:50% center}.intro-panel,.hub-panel{top:50%}h1{letter-spacing:.09em;padding-left:.09em}.gothic-button.large{min-width:0;width:100%}.content-view{padding:8px}.manuscript{height:73vh;min-height:480px;padding:36px 28px}.paper-content{font-size:1rem;line-height:1.58;padding:0 5px 35px}.chapter-list{grid-template-columns:1fr}.brand h2{font-size:1.6rem}.brand p{display:none}.compact{min-height:50px}.right-panel h3{margin:12px}.section-kicker{font-size:.78rem}.paper-header h2{font-size:1.4rem}}@media(prefers-reduced-motion:reduce){:root{--fade:.01s}.gothic-button{transition:none}}
/* Character animations */
.animation-manuscript{padding-bottom:clamp(34px,3.5vw,58px)}
.animation-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:0 12px}
.animation-stage video{display:block;max-width:100%;max-height:54vh;object-fit:contain;background:#100c08;border:1px solid rgba(70,43,20,.65);box-shadow:0 9px 24px rgba(37,21,8,.34);cursor:zoom-in}
.animation-caption{text-align:center;margin:12px 0 10px;font-style:italic;color:#4b351f;min-height:1.4em}
.animation-controls{display:flex;flex-wrap:wrap;justify-content:center;gap:9px}
.animation-controls button{border:1px solid #684b26;background:#24180d;color:#ddc897;padding:8px 15px;min-width:88px;cursor:pointer;text-transform:uppercase;letter-spacing:.06em}
.animation-controls button:hover,.animation-controls button:focus-visible{border-color:#9a7540;color:#f2ddb0}
.animation-list-panel{min-height:0}
.animation-list button{min-height:43px;padding:10px 8px}
.video-viewport{touch-action:none}
.video-viewport video{position:absolute;left:50%;top:50%;max-width:88vw;max-height:82vh;transform-origin:center;user-select:none;background:#000;box-shadow:0 18px 60px #000}
@media(max-width:1050px){.animation-stage video{max-height:43vh}.animation-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.animation-manuscript{height:72vh}.animation-stage video{max-height:38vh}.animation-controls button{min-width:calc(50% - 6px);padding:7px 8px}.animation-caption{font-size:.9rem}.animation-list{grid-template-columns:1fr}}

/* July 2026 layout and chapter-opening refinements */
.intro-panel .title-subtitle,.hub-panel .title-subtitle{margin:.35rem 0 0;text-align:center}
.hub-panel #hub-title{width:100%;padding-left:0;text-align:center}
.paper-content .opening-verse{text-align:center;margin:.12rem auto;max-width:90%;font-style:italic}
.paper-content .opening-verse-last{margin-bottom:2.2rem}
.book-availability{text-align:center;max-width:34rem;margin:3rem auto 0;font-size:1.08em;line-height:1.8}
.book-availability p:first-of-type:first-letter{float:none;font-size:inherit;line-height:inherit;margin:0;font-weight:inherit}
.book-link{display:inline-block;margin-top:1rem;padding:.8rem 1.1rem;border:1px solid rgba(75,49,24,.65);color:#3b2412;font-weight:bold;text-decoration:none;background:rgba(226,205,164,.25)}
.book-link:hover,.book-link:focus-visible{background:rgba(226,205,164,.48);text-decoration:underline}

/* Opening crow sequence */
#intro{overflow:hidden}
.intro-sequence{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.intro-sequence:before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.15);pointer-events:none}
.intro-street,.intro-crow-video{position:absolute;top:50%;left:50%;height:100vh;width:auto;max-width:100vw;aspect-ratio:1365/2048;object-fit:cover;transform:translate(-50%,-50%);box-shadow:0 0 70px 28px rgba(0,0,0,.72)}
.intro-street{z-index:1}
.intro-crow-video{z-index:2;opacity:1;transition:opacity 1.35s ease;background:#080a08}
.intro-crow-video.finished{opacity:0;pointer-events:none}
.intro-panel.intro-reveal{z-index:3;top:54%;opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,-47%);transition:opacity 1.6s ease,transform 1.6s ease,visibility 0s linear 1.6s}
.intro-panel.intro-reveal.ready{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,-50%);transition-delay:0s}
.intro-panel.intro-reveal:before{content:"";position:absolute;inset:-2rem -3rem;background:radial-gradient(ellipse at center,rgba(0,0,0,.64),rgba(0,0,0,.28) 55%,transparent 76%);z-index:-1;pointer-events:none}
@media(max-aspect-ratio:2/3){.intro-street,.intro-crow-video{width:100vw;height:auto;min-height:100vh}}
@media(prefers-reduced-motion:reduce){.intro-crow-video{display:none}.intro-panel.intro-reveal{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,-50%);transition:none}}


/* Final alignment corrections */
.hub-panel{display:flex;flex-direction:column;align-items:center;left:50%;transform:translate(-50%,-50%)}
.hub-panel #hub-title,.hub-panel .title-subtitle,.hub-panel .ornament{width:100%;text-align:center;margin-left:auto;margin-right:auto;padding-left:0}
.hub-panel .hub-nav{width:100%}
.paper-content .story-break{display:block!important;width:100%!important;text-align:center!important;font-size:2em!important;line-height:1.25!important;letter-spacing:.18em;margin:1.5em auto!important;clear:both}
/* Ensure the entrance can never remain inaccessible after the film */
.intro-panel.intro-reveal.ready{display:block!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important}


/* Restore paragraph indentation */
.chapter-content p, .manuscript p, .content p, article p {text-indent:2em; margin-top:0;}
.chapter-content p:first-child, .manuscript p:first-child, .content p:first-child, article p:first-child{text-indent:0;}


/* Verified chapter paragraph indentation — chapter HTML uses direct DIV blocks */
.paper-content.chapter-text > div:not(.opening-verse):not(.story-break):not(.drop-cap-paragraph),
.paper-content.chapter-text > p:not(.opening-verse):not(.story-break):not(.drop-cap-paragraph){
  text-indent:3em!important;
}
.paper-content.chapter-text > div:has(> img.chapter-illustration),
.paper-content.chapter-text > p:has(> img.chapter-illustration),
.paper-content.chapter-text > .opening-verse,
.paper-content.chapter-text > .story-break{
  text-indent:0!important;
}



/* Working drop capitals: applied by script.js to the first prose block of each chapter. */
.paper-content.chapter-text > div.drop-cap-paragraph,
.paper-content.chapter-text > p.drop-cap-paragraph{
  text-indent:0!important;
}
.paper-content .drop-cap{
  float:left;
  display:block;
  font-family:"Old English Text MT","Goudy Text MT","UnifrakturCook",Georgia,"Times New Roman",serif;
  font-size:4.8em;
  font-weight:normal;
  line-height:.72;
  margin:.08em .12em 0 0;
  color:#5a3518;
  text-shadow:0 1px 0 rgba(255,255,255,.24),0 1px 2px rgba(50,25,8,.22);
}
.paper-content .drop-cap-paragraph::after{
  content:"";
  display:table;
  clear:both;
}
@media (max-width:700px){
  .paper-content .drop-cap{font-size:4em;line-height:.76}
}

/* Distressed deep-red drop capitals — Victorian worn-ink treatment */
.paper-content .drop-cap{
  font-family:Baskerville,"Baskerville Old Face","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  font-size:4.8em;
  font-weight:700;
  line-height:.72;
  margin:.08em .11em 0 0;
  color:#761d19;
  text-shadow:
    .018em .012em 0 rgba(54,12,10,.72),
    -.012em .018em 0 rgba(116,42,31,.44),
    0 .028em .035em rgba(42,19,10,.32);
  filter:contrast(1.08);
}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .paper-content .drop-cap{
    background-image:
      radial-gradient(circle at 18% 24%,rgba(198,163,112,.92) 0 .025em,transparent .032em),
      radial-gradient(circle at 70% 66%,rgba(198,163,112,.75) 0 .018em,transparent .027em),
      radial-gradient(circle at 45% 84%,rgba(198,163,112,.62) 0 .014em,transparent .022em),
      repeating-linear-gradient(101deg,#5b100e 0 .055em,#81231d .06em .11em,#691712 .115em .17em);
    background-size:.19em .23em,.27em .31em,.23em .29em,100% 100%;
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
  }
}
@media (max-width:700px){
  .paper-content .drop-cap{font-size:4em;line-height:.76}
}
