@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=DM+Sans:wght@400;500;600&display=swap');
:root{--paper:#f4f0e5;--ink:#302d25;--gold:#b69b61;--serif:'Cormorant Garamond',Georgia,serif;--sans:'DM Sans',sans-serif}
*{box-sizing:border-box}body{margin:0;min-height:100svh;background:#202420;color:#ece9df;font-family:var(--sans)}button,a{-webkit-tap-highlight-color:transparent}button{font:10px var(--sans);letter-spacing:.08em;cursor:pointer;border:0;background:none;color:inherit;padding:10px 4px}button:hover{color:#fff}button:focus-visible,a:focus-visible{outline:2px solid #ceb678;outline-offset:5px}button:disabled{opacity:.25;cursor:default}
.scene,.shade{position:fixed;inset:0;pointer-events:none}.scene{overflow:hidden;background:#292c27}.scene-track{position:absolute;inset:0}.scene-panel{position:absolute;inset:0;opacity:0;background-position:center;background-size:cover;background-repeat:no-repeat;filter:saturate(.72) brightness(.78);transition:opacity 3.8s ease-in-out;will-change:opacity}.scene-panel.is-active{opacity:1}.scene-church{background-image:url('assets/living-church.webp')}.scene-office{background-image:url('assets/dutch-office-lunch.webp');background-position:40% center}.scene-market{background-image:url('assets/living-market.webp')}.scene-stadium{background-image:url('assets/living-stadium.webp');background-position:40% center}.shade{background:linear-gradient(90deg,#151b1426,#151b1412 40%,#11171242),linear-gradient(180deg,#10160f20,transparent 28%,#10160f15 65%,#0d130c80);box-shadow:inset 0 0 160px #0c110b29}
.scene,.shade{position:fixed;inset:0;pointer-events:none}.scene{overflow:hidden;background:#292c27}.scene-track{position:absolute;inset:0}.scene-panel{position:absolute;inset:0;opacity:0;background-position:center;background-size:cover;background-repeat:no-repeat;filter:saturate(.72) brightness(.78);transition:opacity 3.8s ease-in-out;will-change:opacity}.scene-panel.is-active{opacity:1}.scene-church{background-image:url('assets/living-church.webp')}.scene-office{background-image:url('assets/dutch-office-lunch.webp');background-position:40% center}.scene-market{background-image:url('assets/living-market.webp')}.scene-mall{background-image:url('assets/dutch-mall.webp')}.scene-school{background-image:url('assets/dutch-school.webp')}.scene-parliament{background-image:url('assets/tweede-kamer.webp')}.scene-hospital{background-image:url('assets/dutch-hospital.webp')}.scene-stadium{background-image:url('assets/living-stadium.webp');background-position:40% center}.scene-gym{background-image:url('assets/dutch-gym.webp')}.shade{background:linear-gradient(90deg,#151b1426,#151b1412 40%,#11171242),linear-gradient(180deg,#10160f20,transparent 28%,#10160f15 65%,#0d130c80);box-shadow:inset 0 0 160px #0c110b29}
header{position:relative;display:flex;justify-content:space-between;align-items:center;gap:18px;min-height:88px;padding:22px 4vw}.wordmark{display:flex;text-decoration:none;color:#eeeee4}.wordmark span{font:10px var(--sans);text-transform:uppercase;letter-spacing:.2em;text-shadow:0 1px 8px #0006}.header-actions{display:flex;gap:20px;align-items:center;padding:0 10px;background:#1e281edd;border:1px solid #f6edd21f;border-radius:3px;backdrop-filter:blur(10px)}.header-actions button{font-size:9px;padding:11px 2px}
main{position:relative;max-width:1000px;margin:0 auto;padding:17px 38px 0}.book{position:relative;z-index:0;display:grid;grid-template-columns:1fr 1fr;width:100%;max-width:900px;min-height:590px;margin:18px auto 0;perspective:2000px;transform-style:preserve-3d;border-radius:3px 7px 6px 3px}.binding{position:absolute;inset:-4px -5px -9px 50%;z-index:-1;background:#151916;border-radius:3px 7px 5px 3px;box-shadow:0 2px 0 #0c100c,0 15px 30px #0007}.binding::after{content:"";position:absolute;left:2px;right:3px;bottom:3px;height:4px;background:repeating-linear-gradient(0deg,#9a8c6c 0 1px,#c7bda4 1px 2px,#95886c 2px 3px)}
.page{position:relative;min-width:0;background-color:var(--paper);color:var(--ink);padding:35px 42px 45px}.left{border-radius:3px 0 0 3px;background-image:linear-gradient(90deg,#d0c8ae12,transparent 70%,#8a78541f);box-shadow:inset -22px 0 27px -23px #3f372a66}.right{border-radius:0 5px 5px 0;background-image:linear-gradient(90deg,#8a78541f,transparent 14%,#d0c8ae0c);box-shadow:inset 22px 0 27px -23px #3f372a66}.running{font:8px var(--sans);text-transform:uppercase;letter-spacing:.13em;color:#817961;padding-bottom:11px;margin-bottom:34px;border-bottom:1px solid #8c83672a}.chapter-label{font:9px var(--sans);letter-spacing:.13em;text-transform:uppercase;color:#827047;margin:0 0 24px}h1,h2{font-family:var(--serif);font-weight:500;font-size:clamp(40px,4.5vw,58px);letter-spacing:-.04em;line-height:.98;margin:0 0 25px}.title-page h1{font-size:clamp(52px,5.6vw,74px);font-weight:500}.lead{font:italic 23px/1.2 var(--serif);color:#77613e;max-width:300px;margin:0 0 22px}.margin-note{font:italic 20px/1.25 var(--serif);color:#77613e;max-width:300px;margin-top:30px;padding-top:17px;border-top:1px solid #8a7a5329}.seal{display:block;margin-top:32px;width:34px;height:34px;border:1px solid #aa986133;border-radius:50%;font:21px/32px var(--serif);color:#9c8b5b;text-align:center;opacity:.65}.folio{position:absolute;bottom:19px;font:10px var(--serif);color:#9d957e}.left .folio{left:40px}.right .folio{right:40px}.body-copy p{font:20px/1.38 var(--serif);margin:0 0 18px}.body-copy p:first-child:first-letter{float:left;font-size:46px;line-height:.87;padding:5px 6px 0 0;color:#8c7748}.contact{display:inline-block;font:9px var(--sans);letter-spacing:.06em;color:#7a6339;text-decoration:none;padding:9px 0;border-bottom:1px solid #a38d5b77}.spine{position:absolute;inset:0 auto 0 50%;width:26px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,#40382220 48%,#fff8e920 65%,transparent);pointer-events:none}
.book-cover{position:absolute;z-index:5;inset:0 0 0 50%;padding:0;border:0;background:none;color:var(--ink);font:inherit;text-align:left;letter-spacing:normal;transform-style:preserve-3d;transform-origin:left center;transform:rotateY(0);pointer-events:none;border-radius:3px 6px 5px 3px}.book-cover[hidden]{display:none}.book-closed .book-cover{pointer-events:auto;cursor:pointer}.book-cover:focus-visible{outline:2px solid var(--gold);outline-offset:7px}.cover-front{position:absolute;inset:0;display:block;backface-visibility:hidden;background:#171a17 url('assets/bible-warm-black.webp') center/100% 100%;border-radius:3px 6px 5px 3px;box-shadow:2px 2px 0 #c6bb9f,3px 3px 0 #7b7059,4px 4px 0 #bfb499,5px 6px 0 #121611,0 15px 30px #0006}.cover-frame{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;pointer-events:none}.cover-reader{position:absolute;inset:0;min-height:100%;transform:rotateY(180deg);backface-visibility:hidden;pointer-events:none}.cover-reader #leftPage{position:absolute;inset:0;width:100%;min-height:100%;border-radius:3px 0 0 3px}.cover-reader::before{content:"";position:absolute;inset:-4px 0 -9px -5px;z-index:-1;background:#151916;border-radius:3px 0 0 3px;box-shadow:0 2px 0 #0c100c,0 15px 30px #0007}.cover-reader::after{content:"";position:absolute;left:-3px;right:0;height:4px;bottom:-6px;z-index:-1;background:repeating-linear-gradient(0deg,#9a8c6c 0 1px,#c7bda4 1px 2px,#95886c 2px 3px)}.book-opened .cover-reader #leftPage{pointer-events:auto}.layout-sentinel{visibility:hidden;pointer-events:none}.layout-sentinel[hidden]{display:none}.book-closed .spine{visibility:hidden}.book-closed .book-controls,.book-closed .hint,.book-opening .book-controls,.book-opening .hint,.book-closed .header-actions,.book-opening .header-actions{visibility:hidden}#coverPrompt{position:absolute;bottom:53px;left:0;right:0;text-align:center;margin:0;font:italic 18px var(--serif);letter-spacing:.02em;color:#eee7d7;text-shadow:0 1px 8px #0008}#coverPrompt[hidden]{display:none}
.book-controls{display:flex;align-items:center;justify-content:space-between;max-width:600px;margin:27px auto 0}.book-controls button{display:flex;align-items:center;gap:14px;font-size:22px;padding:7px 4px}.book-controls button span{font:9px var(--sans);text-transform:uppercase;letter-spacing:.13em}#position{font:9px var(--sans);letter-spacing:.16em;color:#eee8d9}.hint{font:8px var(--sans);text-align:center;color:#ddd9c9;margin:11px 0 0;letter-spacing:.03em}.turn-leaf{display:none;position:absolute;inset:0 0 0 50%;background:linear-gradient(90deg,#cbbfa3,var(--paper) 9%,#eee8d7 95%,#c1b492);transform-origin:left;pointer-events:none;border-radius:0 5px 5px 0;z-index:6}.book.turning .turn-leaf{display:block;animation:turn .48s ease-in-out forwards}.book.backwards .turn-leaf{animation-direction:reverse}@keyframes turn{0%{transform:rotateY(0);opacity:.85}85%{opacity:.65}100%{transform:rotateY(-175deg);opacity:0}}
#contents{position:fixed;z-index:20;inset:0 0 0 auto;width:min(420px,100%);padding:30px 35px;background:#f4f0e5;color:#343329;box-shadow:-20px 0 80px #0008;overflow-y:auto}.contents-head{display:flex;align-items:center;justify-content:space-between;font:9px var(--sans);letter-spacing:.17em;color:#7c7158}.contents-head button{font-size:28px;color:#554a35}#chapterList{list-style:none;margin:0;padding:22px 0}#chapterList button{display:block;text-align:left;width:100%;font:24px/1.15 var(--serif);letter-spacing:0;padding:15px 0;border-bottom:1px solid #8c7d5829;color:#3b382c}#chapterList button:hover,#chapterList button[aria-current]{color:#937442}#chapterList small{display:block;font:8px var(--sans);letter-spacing:.13em;margin-bottom:6px;color:#928362}#contents p{font:italic 18px/1.3 var(--serif);color:#786846}
footer{position:relative;display:flex;justify-content:space-between;gap:15px;padding:28px 4vw 85px;font:8px var(--sans);color:#e7e3d6;text-shadow:0 1px 6px #0008}#edition{letter-spacing:.17em}.scene-nav{position:fixed;z-index:10;bottom:19px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:16px;background:#1d251ede;border:1px solid #ede5c626;border-radius:3px;backdrop-filter:blur(12px);padding:5px 14px;color:#d8d4c3}.scene-options{display:flex;gap:20px}.scene-nav button{position:relative;font-size:9px;letter-spacing:.11em;white-space:nowrap;color:#c9c9bb;padding:8px 0}.scene-nav button:hover,.scene-nav button[aria-current]{color:#fff1cb}.scene-nav button[aria-current]::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:#c2a568}#scenePause{display:flex;align-items:center;gap:7px;padding-left:13px;border-left:1px solid #ede5c626;font-size:8px;min-width:60px}#scenePause>span:first-child{font-size:10px}
.reading{background:#f5f1e8;color:#39362c}.reading .scene,.reading .shade,.reading .scene-nav{display:none}.reading header,.reading .wordmark{color:#39362c}.reading .wordmark span{text-shadow:none}.reading .header-actions{background:none;border-color:#8d7b5126;color:#65583b}.reading .header-actions button:hover{color:#29261d}.reading main{max-width:780px}.reading .book{display:block;perspective:none;transform-style:flat;min-height:0}.reading .binding,.reading .spine,.reading .running,.reading .folio,.reading .seal{display:none}.reading .page{background:none;box-shadow:none;padding:20px}.reading h1,.reading h2{font-size:60px}.reading .body-copy p{font-size:24px;line-height:1.5}.reading .book-controls,.reading .hint,.reading #position,.reading footer{color:#6e5d3e;text-shadow:none}.reading .turn-leaf{display:none!important}
@media(min-width:1500px){main{padding-top:25px}.book{min-height:620px}.page{padding:42px 45px 47px}.body-copy p{font-size:21px}}
@media(max-width:850px){main{padding:16px 25px 0}.page{padding:30px 29px 42px}.book{min-height:570px}h1,h2{font-size:43px}.title-page h1{font-size:58px}.body-copy p{font-size:19px}.running{margin-bottom:29px}}
@media(max-width:620px){header{min-height:76px;flex-wrap:wrap;padding:19px 22px;gap:8px}.wordmark span{font-size:9px;letter-spacing:.13em}.header-actions{gap:12px;margin-left:auto;padding:0 8px}.header-actions button{font-size:8px;padding:9px 1px}main{padding:13px 23px 0}.book{display:block;min-height:565px;margin-top:16px}.page{min-height:565px;padding:29px 31px 44px}.page.mobile-hidden{display:none}.book-cover{left:0}.cover-reader{display:none}.binding{left:-5px}.cover-reader::after{display:none}.spine{display:none}h1,h2{font-size:clamp(36px,10.4vw,53px)}.title-page h1{font-size:clamp(53px,15vw,68px)}.body-copy p{font-size:22px;line-height:1.39}.running{font-size:7px;margin-bottom:31px}.chapter-label{font-size:8px}.margin-note{font-size:21px}.book-controls{margin-top:25px}.hint{font-size:7px}.turn-leaf{inset:0}.scene-nav{bottom:12px;padding:4px 10px;gap:10px;max-width:calc(100% -24px)}.scene-options{gap:14px}.scene-nav button{font-size:8px}#scenePause{min-width:51px;padding-left:10px}.scene-office,.scene-stadium{background-position:30% center}.scene-market{background-position:38% center}footer{padding:24px 23px 80px;font-size:7px}.reading .page{min-height:0;padding:18px 7px}.reading h1,.reading h2{font-size:49px}.reading .body-copy p{font-size:23px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important}.scene-panel{transition:none}}
/* Only the book and its surroundings remain; reading controls appear on opening. */
header{justify-content:flex-end}

/* Pages themselves are the navigation. The turning sheet carries both printed faces. */
.book-opened .page.can-turn{cursor:pointer}
.book-opened .page:focus-visible{outline:1px solid #a18a55;outline-offset:-7px}
.book[aria-busy="true"] .page{cursor:progress}
.book-opened .cover-reader{pointer-events:auto}
.page-turn{position:absolute;inset:0 0 0 50%;z-index:10;transform-origin:left center;transform-style:preserve-3d;pointer-events:none}
.page-turn.turn-back{inset:0 50% 0 0;transform-origin:right center}
.turn-face{position:absolute;inset:0;min-height:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.turn-front{box-shadow:0 7px 20px #1d180d2e}
.turn-backface{transform:rotateY(180deg);box-shadow:0 7px 20px #1d180d2e}
@media(max-width:620px){.page-turn,.page-turn.turn-back{inset:0;transform-origin:left center}.page-turn.turn-back{transform-origin:right center}.single-turn .turn-backface{display:none}}
/* A quiet masthead, with the book's controls kept separate. */
header{z-index:15;justify-content:space-between;min-height:78px;padding:25px 4vw;align-items:center}
.wordmark span{font-size:11px;letter-spacing:.17em}
.site-nav{display:flex;align-items:center;gap:25px}
.site-nav button,.site-nav a{font:10px var(--sans);letter-spacing:.04em;color:#eeeadd;text-decoration:none;padding:8px 0;text-shadow:0 1px 8px #0008}
.site-nav button:hover,.site-nav a:hover,.site-nav button[aria-expanded="true"]{color:#ffe3a0}
.reader-toolbar{position:relative;z-index:3;display:flex;justify-content:flex-end;max-width:900px;margin:0 auto;height:20px;align-items:center}
.header-actions{background:none;border:0;backdrop-filter:none;gap:20px;padding:0;opacity:.8}
.header-actions button{font-size:8px;text-shadow:0 1px 8px #0008}
main{padding-top:13px;padding-bottom:55px}
.book{margin-top:12px;min-height:590px}
.body-copy p{font-size:19px;line-height:1.29;margin-bottom:13px}
.chapter-label{margin-bottom:22px}
.title-page h1{font-size:clamp(49px,5vw,65px)}
.lead{font-size:25px;line-height:1.23;margin-top:35px;color:#77613e}
.scene-dots{display:flex;justify-content:center;align-items:center;gap:3px;margin:18px auto 0;width:max-content}
.scene-dots button{width:23px;height:25px;display:grid;place-items:center;padding:0;border-radius:50%}
.scene-dots button span{display:block;width:5px;height:5px;border:1px solid #e9e3d2aa;border-radius:50%;box-shadow:0 0 5px #0005;transition:background .4s,box-shadow .4s}
.scene-dots button[aria-current] span{background:#d2b67a;border-color:#d2b67a;box-shadow:0 0 0 4px #d2b67a20,0 0 0 7px #d2b67a12}
.scene-dots button:hover span{background:#f1e1bb}
#sitePanel{position:fixed;z-index:16;top:80px;right:4vw;width:min(410px,92vw);padding:38px 34px 34px;background:#f0ede3f5;color:var(--ink);border:1px solid #c6ba9d;box-shadow:0 16px 60px #0005;backdrop-filter:blur(18px)}
#sitePanel[hidden]{display:none}
#closeSitePanel{position:absolute;top:6px;right:13px;color:#5f5849;font-size:25px}
.panel-kicker{font:9px var(--sans)!important;letter-spacing:.15em;text-transform:uppercase;color:#85734f}
#sitePanel h2{font-size:40px;line-height:1.03;margin:23px 0}
#sitePanel p{font:22px/1.35 var(--serif)}
.panel-link{display:inline-block;text-decoration:none;color:#806739;font:10px var(--sans);letter-spacing:.04em;border-bottom:1px solid #9d875c7a;padding:10px 0}
.reading .site-nav button,.reading .site-nav a{color:#65583b;text-shadow:none}
.reading .scene-dots{display:none}
.reading .header-actions button{text-shadow:none}
@media(min-width:1500px){.body-copy p{font-size:20px}.book{min-height:620px}}
@media(max-width:850px){header{gap:18px;flex-wrap:wrap}.site-nav{gap:19px}.reader-toolbar{margin:0 30px}.body-copy p{font-size:18px}.lead{font-size:23px}}
@media(max-width:620px){header{padding:22px 23px 14px;justify-content:center;gap:12px}.wordmark span{font-size:10px}.site-nav{width:100%;justify-content:center;gap:20px}.site-nav button,.site-nav a{font-size:9px}.reader-toolbar{height:20px;margin:9px 23px 0;justify-content:center}.header-actions{gap:22px}.book{margin-top:10px}.body-copy p{font-size:20px;line-height:1.32;margin-bottom:13px}.lead{font-size:26px}.scene-dots{gap:3px;margin-top:20px}.scene-dots button{width:25px;height:29px}#sitePanel{top:110px;right:4vw}.reading .book{min-height:0}}

/* One measured height for the cover, every spread, and every turning leaf. */
.book{--book-min-height:590px;min-height:var(--book-height,var(--book-min-height));height:var(--book-height,var(--book-min-height))}
.book>.page{height:100%;min-height:0}
.book-measure{position:absolute;left:-10000px;top:0;visibility:hidden;pointer-events:none;contain:layout style}
.book-measure .page{height:auto;min-height:0;box-shadow:none;border-radius:0}
@media(min-width:1500px){.book{--book-min-height:620px}}
@media(max-width:620px){.book{--book-min-height:565px}}
/* Perspective must not change the viewport's scrollable width or scrollbar gutter. */
html{overflow-x:clip;scrollbar-gutter:stable}
body{overflow-x:clip}
.book{overflow-anchor:none;touch-action:pan-y pinch-zoom;overscroll-behavior-x:none}
@supports not (scrollbar-gutter:stable){html{overflow-y:scroll}}



/* Quiet close action on the open spread, above the running title. */
.page-close{display:none;position:absolute;z-index:12;top:7px;right:16px;padding:7px 4px;font:8px var(--sans);letter-spacing:.03em;color:#81734f}
.book-opened .page-close{display:block}
.page-close:hover{color:#51442b}
.book[aria-busy="true"] .page-close{visibility:hidden}
.scene-panel{transition-duration:1.8s}
@media(max-width:620px){
 .cover-front{background-size:100% 100%}
 .page-close{top:5px;right:12px;font-size:9px;padding:8px 4px}
 .body-copy{max-height:calc(var(--book-height) - 164px);overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin;scrollbar-color:#af9d774d transparent;padding-right:4px}
 .book-measure .body-copy{max-height:none;overflow:visible;padding-right:4px}
 .site-nav a,.site-nav button{min-height:38px;display:inline-flex;align-items:center}
}

/* Restrained gold lettering for the guild's name. */
.wordmark{color:#cfb77f}
.wordmark span{font:500 21px/1 var(--serif);text-transform:uppercase;letter-spacing:.14em;text-shadow:0 1px 6px #0007}
.wordmark:hover{color:#e5cea0}
@media(max-width:620px){.wordmark span{font-size:20px;letter-spacing:.14em}}

.wordmark{flex-direction:column;align-items:flex-start;gap:6px}
.wordmark .wordmark-title{white-space:nowrap}
.wordmark .wordmark-subtitle{font:italic 400 16px/1.1 var(--serif);text-transform:none;letter-spacing:.025em;color:#cfb77fe6}
@media(max-width:620px){.wordmark{align-items:center;gap:5px}.wordmark .wordmark-title{font-size:18px;letter-spacing:.1em}.wordmark .wordmark-subtitle{font-size:15px}}

/* Broad ambient shade keeps the masthead readable across the whole scene. */
.shade::before{content:"";position:absolute;inset:0 0 auto;height:250px;background:linear-gradient(180deg,#090e0bd9 0,#090e0bb8 100px,#090e0b4d 180px,transparent 100%)}
.wordmark{color:#dcc48c;gap:8px}
.wordmark .wordmark-title{font-size:21px;line-height:1.08;letter-spacing:.14em}
.wordmark .wordmark-subtitle{font-size:17px;line-height:1.15;letter-spacing:.065em;color:#dfc995}
.wordmark span{text-shadow:0 1px 2px #000c,0 2px 10px #0007}
@media(max-width:620px){.wordmark{gap:6px}.wordmark .wordmark-title{font-size:19px;line-height:1.08;letter-spacing:.12em}.wordmark .wordmark-subtitle{font-size:16px;letter-spacing:.065em}#sitePanel{top:158px;max-height:calc(100svh - 174px);overflow-y:auto}}

/* Both name lines share exact left and right edges. */
.wordmark{align-items:center}
.wordmark svg.wordmark-title{display:block;width:210px;height:auto;overflow:visible;fill:currentColor;font:500 21px var(--serif);letter-spacing:0;filter:drop-shadow(0 1px 2px #000b)}
@media(max-width:620px){.wordmark svg.wordmark-title{width:190px}}
/* Bind the subtitle to the same left edge and a quiet full-width rule. */
.wordmark{width:210px;align-items:flex-start;gap:7px}
.wordmark .wordmark-subtitle{width:100%;text-align:left;border-top:1px solid #d8c08773;padding-top:7px}
@media(max-width:620px){.wordmark{width:190px;align-items:flex-start;gap:6px}.wordmark .wordmark-subtitle{padding-top:6px}}

/* Keep the descriptor secondary to the two-line name. */
.wordmark{gap:6px}
.wordmark .wordmark-subtitle{font-size:14px;line-height:1.2;letter-spacing:.04em;padding-top:6px;color:#d6bf91}
.site-nav button,.site-nav a{white-space:nowrap}
@media(max-width:620px){.wordmark .wordmark-subtitle{font-size:13px;padding-top:5px}.site-nav{gap:clamp(6px,2vw,12px);flex-wrap:nowrap;flex-shrink:0;width:calc(100% + 20px);margin-inline:-10px}}

/* The small italic line belongs to the name without a divider. */
.wordmark .wordmark-subtitle{border-top:0;padding-top:0}
.wordmark{gap:7px}
@media(max-width:620px){.wordmark .wordmark-subtitle{padding-top:0}.wordmark{gap:6px}}

.body-copy .belief-line{display:block;margin-top:1em}.body-copy .belief-line:first-child{margin-top:0}

/* Phone-only reading: a whole chapter on one naturally scrolling sheet. */
.mobile-menu-toggle,.mobile-chapter-nav{display:none}
@media(max-width:620px){
 header{padding:22px 22px 18px;justify-content:space-between;flex-wrap:nowrap;gap:16px;align-items:center}
 .wordmark,.wordmark svg.wordmark-title{width:180px}
 .mobile-menu-toggle{display:inline-flex;align-items:center;justify-content:center;min-width:54px;min-height:44px;padding:10px 0;color:#e7d7b3;font:12px var(--sans);letter-spacing:.04em}
 header .site-nav{display:none;position:absolute;top:calc(100% - 4px);left:16px;right:16px;width:auto;margin:0;padding:14px 22px;background:#1c211cf5;border:1px solid #d6bf9133;box-shadow:0 15px 35px #0005;flex-direction:column;align-items:stretch;gap:0}
 header.mobile-menu-open .site-nav{display:flex}
 header .site-nav a{font-size:14px;min-height:47px;padding:13px 0}
 body:not(.subpage) main{padding:10px 18px 40px}
 .book-closed .book,.book-opening .book{max-width:360px}
 .book-opened .book{display:block;height:auto;min-height:0;max-width:520px;perspective:none;transform-style:flat;scroll-margin-top:16px}
 .book-opened .book>.page.left{height:auto;min-height:0;padding:55px 27px 28px;border-radius:3px;background-image:linear-gradient(90deg,#b9a6800b,transparent 15%);box-shadow:inset 5px 0 12px #4b3b2010;cursor:default}
 .book-opened #rightPage,.book-opened .layout-sentinel{display:none}
 .book-opened .binding{inset:-3px -3px -5px;box-shadow:0 8px 24px #0004}
 .book-opened .running{margin-bottom:28px;font-size:8px;padding-bottom:14px}
 .book-opened .chapter-label{font-size:9px;margin-bottom:15px}
 .mobile-chapter-title{font-size:clamp(40px,11vw,55px);line-height:1.02;margin:0 0 22px;outline:none}
 .book-opened .lead{font-size:25px;line-height:1.25;margin:0 0 30px;padding-bottom:25px;border-bottom:1px solid #8c83672a;max-width:none}
 .book-opened .body-copy{max-height:none;height:auto;overflow:visible;padding-right:0}
 .book-opened .body-copy p{font-size:22px;line-height:1.46;margin-bottom:19px}
 .book-opened .body-copy p:first-child:first-letter{font-size:48px}
 .mobile-chapter-nav{display:flex;justify-content:space-between;gap:20px;margin-top:32px;padding-top:16px;border-top:1px solid #8c83672a}
 .mobile-chapter-nav button{font:12px var(--sans);letter-spacing:.02em;color:#6b5935;min-height:48px;padding:10px 0}
 .mobile-chapter-nav button:disabled{opacity:.3;cursor:default}
 .mobile-chapter-nav button:hover{color:#302d25}
 .page-close{top:7px;right:20px;min-height:44px;font-size:10px}
 .book-opened .scene-dots,.book-opening .scene-dots{display:none}
 .book-opened .contact{font-size:11px;min-height:44px;padding:13px 0}
}

@media(max-width:620px){.book-closed .book .page,.book-opening .book .page{overflow:hidden;max-height:var(--book-height);height:var(--book-height)}}

/* A little more substance in the quiet masthead lettering. */
.wordmark .wordmark-subtitle{font-size:15px;font-weight:500;line-height:1.3;letter-spacing:.045em;color:#e1cda5;text-shadow:0 1px 2px #000c,0 2px 8px #0008}
@media(min-width:621px){.site-nav a,.site-nav button{font-size:12px;font-weight:500;line-height:1.4;min-height:44px;display:inline-flex;align-items:center;color:#f0ece1}}
@media(max-width:620px){.wordmark .wordmark-subtitle{font-size:14px;letter-spacing:.04em}header .site-nav a,.mobile-menu-toggle{font-weight:500}}

/* Match the navigation to the wordmark's restrained gold. */
header .site-nav a,header .site-nav button,.mobile-menu-toggle{color:#dcc48c;font-weight:400}

/* The invitation stays on a single quiet line beneath the name. */
.wordmark .wordmark-subtitle{font-size:15px;letter-spacing:.01em;white-space:nowrap}
.mobile-reader-tools,.mobile-manifest{display:none}
@media(max-width:620px){
 .wordmark .wordmark-subtitle{font-size:13px;letter-spacing:0}
 body.mobile-menu-visible{overflow:hidden}
 header.mobile-menu-open{position:fixed;inset:0;z-index:100;min-height:100dvh;padding:22px 22px 18px;align-items:flex-start;background:#181c18}
 header.mobile-menu-open .mobile-menu-toggle{position:absolute;right:22px;top:27px}
 header.mobile-menu-open .site-nav{position:absolute;inset:130px 0 0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:100%;margin:0;padding:20px 30px max(45px,env(safe-area-inset-bottom));overflow-y:auto;background:none;border:0;box-shadow:none}
 header.mobile-menu-open .site-nav a{justify-content:center;min-height:58px;padding:12px 5px;font:italic 400 clamp(29px,8vw,38px)/1.25 var(--serif);letter-spacing:.015em;color:#dcc48c;text-shadow:none}
 .book-opened .book>.page.left{padding:0 25px 32px;overflow:visible;max-height:none}
 .book-opened #closeBook{display:none}
 .book-opened .mobile-reader-tools{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 -25px;padding:8px 20px;background:#f4f0e5f7;border-bottom:1px solid #82704730;box-shadow:0 3px 10px #302d2508}
 .mobile-reader-tools button,.mobile-reader-tools summary{font:11px var(--sans);letter-spacing:.01em;color:#77613e;min-height:44px;padding:13px 0;cursor:pointer}
 .mobile-reader-tools summary{list-style:none;display:flex;align-items:center;gap:8px}
 .mobile-reader-tools summary::-webkit-details-marker{display:none}
 .mobile-chapters nav{position:absolute;top:100%;left:0;right:0;display:flex;flex-direction:column;padding:10px 22px 18px;background:var(--paper);border-bottom:1px solid #82704740;box-shadow:0 12px 18px #302d2515}
 .mobile-chapters nav a{display:flex;align-items:center;gap:16px;min-height:46px;padding:9px 0;color:var(--ink);font:21px/1.2 var(--serif);text-decoration:none}
 .mobile-chapters nav a span{font:9px var(--sans);color:#827047}
 .book-opened .mobile-manifest{display:block}
 .mobile-manifest-chapter{padding:38px 0 14px;scroll-margin-top:76px}
 .mobile-manifest-chapter+.mobile-manifest-chapter{border-top:1px solid #8c83673a;margin-top:28px;padding-top:45px}
 .book-opened .mobile-manifest .body-copy{overflow:visible;max-height:none}
 .book-opened .mobile-manifest .lead{font-size:24px}
 .book-opened .mobile-manifest .body-copy p{font-size:22px;line-height:1.48}
 .book-opened .mobile-chapter-nav{display:none}
}

/* Subdued page edges around the closed leather cover; a slight warmth in print. */
.book{--paper:#eeeade}
.cover-front{box-shadow:2px 2px 0 #948b75,3px 3px 0 #5d5543,4px 4px 0 #8f8773,5px 6px 0 #121611,0 15px 30px #0006}
.book-closed #rightPage{background-color:#b4aa93}
.book-closed .binding::after{filter:brightness(.75)}
.book-opened .binding::after,.book-opened .cover-reader::after{filter:brightness(.95)}
@media(max-width:620px){.book-opened .mobile-reader-tools{background:var(--paper)}}

/* Reverse the physical cover turn when closing, with interactions held until it settles. */
.book-closing .page-close,.book-closing .scene-dots{visibility:hidden}
.book-closing .book-cover{pointer-events:none}
@media(max-width:620px){
 .book-closing .book{height:var(--book-height);min-height:var(--book-height);perspective:2000px;transform-style:preserve-3d}
 .book-closing .book>.page.left{height:var(--book-height);max-height:var(--book-height);overflow:hidden}
 .book-closing .mobile-reader-tools{visibility:hidden}
}

/* Prepare the actual reading surface beneath the turning cover on phones. */
@media(max-width:620px){
 .book-closed .book,.book-opening .book,.book-opened .book{max-width:360px}
 .book-opening .book{display:block;height:var(--book-height);min-height:var(--book-height)}
 .book-opening .book>.page.left{height:var(--book-height);min-height:0;max-height:var(--book-height);overflow:hidden;padding:0 25px 32px;border-radius:3px;background-image:linear-gradient(90deg,#b9a6800b,transparent 15%);box-shadow:inset 5px 0 12px #4b3b2010}
 .book-opening #rightPage{display:none}
 .book-opening .binding{inset:-3px -3px -5px;box-shadow:0 8px 24px #0004}
 .book-opening .mobile-manifest{display:block}
 .book-opening .mobile-reader-tools{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 -25px;padding:8px 20px;background:var(--paper);border-bottom:1px solid #82704730;box-shadow:0 3px 10px #302d2508}
 .book-opening .chapter-label{font-size:9px;margin-bottom:15px}
 .book-opening .lead{font-size:24px;line-height:1.25;margin:0 0 30px;padding-bottom:25px;border-bottom:1px solid #8c83672a;max-width:none}
 .book-opening .body-copy{height:auto;max-height:none;overflow:visible;padding-right:0}
 .book-opening .body-copy p,.book-opened .mobile-manifest .body-copy p{font-size:20px;line-height:1.48;margin-bottom:19px}
 .book-opening .body-copy p:first-child:first-letter,.book-opened .body-copy p:first-child:first-letter{font-size:44px}
}

/* Lay out the full mobile document as soon as the cover starts moving. */
@media(max-width:620px){
 .book-opening .book{height:auto;min-height:var(--book-height)}
 .book-opening .book>.page.left{height:auto;max-height:none;overflow:visible;animation:none}
 .book-opening .book-cover{bottom:auto;height:var(--book-height)}
 .book-opening .body-copy p,.book-opened .mobile-manifest .body-copy p{font-size:19px}

}
@media(max-width:620px){.book-opening .contact{font-size:11px;min-height:44px;padding:13px 0}}

/* Keep the long phone document in normal paint; only the cover gets a 3D layer. */
@media(max-width:620px){
 .book-closed .book,.book-opening .book,.book-opened .book,.book-closing .book{perspective:none;transform-style:flat}
 .book-closed #leftPage{display:none}
 .book-opening .book>.page.left,.book-opened .book>.page.left{clip-path:none;transform:none;will-change:auto;backface-visibility:visible;-webkit-backface-visibility:visible}
 .book-opening .book{background:var(--paper)}
 .cover-front{-webkit-backface-visibility:hidden}
}

.mobile-end-close{display:none}
@media(max-width:620px){.mobile-end-close{display:block;min-height:44px;margin-top:17px;padding:10px 0;font:italic 16px/1.3 var(--serif);letter-spacing:.01em;color:#857857}.mobile-end-close:hover{color:#5d4d30}}
