:root{color-scheme:dark;--ink:#29231e;--paper:#f3eadb;--muted:#c9bda9;--gold:#c4a477;--serif:'Cormorant Garamond',Georgia,serif;--sans:'Manrope',system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;background:#211d1a;color:#f8f1e7;font-family:var(--sans);min-height:100svh}.scene{min-height:100svh;display:flex;flex-direction:column;padding:calc(18px + env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) calc(14px + env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background:radial-gradient(ellipse at 50% 43%,#45372b 0,#29231e 47%,#1d1a18 100%);overflow:hidden}.topbar{display:flex;align-items:center;justify-content:space-between;letter-spacing:.18em;font-size:9px;color:#c9bda9}.brand{white-space:nowrap}.brand span{color:var(--gold);padding:0 5px}.lang{font:600 10px var(--sans);letter-spacing:.12em;background:none;color:#ead9be;border:1px solid #79634c;border-radius:30px;padding:9px 14px}.reader{width:min(100%,480px);margin:auto;display:flex;flex-direction:column;align-items:center;gap:22px}.book{width:min(84vw,390px);height:min(69svh,650px);min-height:430px;position:relative;perspective:1800px;filter:drop-shadow(0 24px 30px #100d0b99);touch-action:pan-y;user-select:none}.paper,.page,.page-turn{position:absolute;inset:0;border-radius:3px 12px 12px 3px}.paper{background:#dfd0b9;box-shadow:inset 8px 0 14px #796b5840,inset -2px 0 0 #fff8}.under{transform:translate(7px,3px);background:#b5a48c}.page{overflow:hidden;color:var(--ink);background:var(--paper);padding:clamp(22px,6vw,36px);display:flex;flex-direction:column;justify-content:center;transform-origin:left center;backface-visibility:hidden}.page.cover{padding:0;background:#241e1a;color:#fff;justify-content:flex-end}.cover-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.66;filter:saturate(.76)}.cover:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#181411 85%)}.covercopy{z-index:1;padding:30px 26px 36px}.cover h1{font:500 clamp(60px,16vw,88px)/.82 var(--serif);letter-spacing:-.045em;margin:0 0 15px}.cover .kicker{color:#e5c99b}.kicker{font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:#8a704e;margin-bottom:15px}.page h2{font:500 clamp(35px,9vw,51px)/.88 var(--serif);margin:0 0 17px;letter-spacing:-.025em}.page p{font:400 clamp(15px,4vw,17px)/1.48 var(--serif);margin:0 0 10px}.page p.lead{font-size:clamp(18px,4.5vw,21px)}.photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.page.photo-page{padding:0;justify-content:flex-end;color:white;background:#29231e}.photo-page:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#171310e8)}.caption{position:relative;z-index:1;padding:27px 25px 30px;color:#fff}.caption .kicker{color:#e4c69a}.caption h2{font-size:clamp(35px,9vw,48px)}.caption p{font-size:18px}.page-num{position:absolute;bottom:15px;right:22px;font:12px var(--serif);color:#8c765b}.photo-page .page-num{z-index:1;color:#eee0ce}.page-turn{z-index:3;pointer-events:none;transform-origin:left center;background:linear-gradient(90deg,#e5d8c3 0,#f5ecde 36%,#cdbb9f 100%);opacity:0}.turn-next{animation:turnNext .7s cubic-bezier(.25,.72,.25,1)}.turn-prev{animation:turnPrev .7s cubic-bezier(.25,.72,.25,1)}@keyframes turnNext{0%{opacity:1;transform:rotateY(0)}45%{box-shadow:12px 0 22px #21180f66}100%{opacity:0;transform:rotateY(-178deg)}}@keyframes turnPrev{0%{opacity:1;transform:rotateY(-178deg)}100%{opacity:0;transform:rotateY(0)}}.page.fade{animation:reveal .55s ease both}@keyframes reveal{from{opacity:.2;transform:translateX(12px)}to{opacity:1;transform:none}}.spine{position:absolute;left:0;top:0;bottom:0;width:13px;pointer-events:none;background:linear-gradient(90deg,#352a20aa,#c4a47730,transparent);z-index:2}.controls{width:min(84vw,390px);display:flex;align-items:center;justify-content:space-between;gap:16px}.arrow{width:48px;height:48px;border-radius:50%;border:1px solid #756149;background:#302820;color:#f4eadb;font-size:22px;display:grid;place-items:center}.arrow.primary{background:#c6a77a;color:#211d1a;border-color:#c6a77a}.arrow:disabled{opacity:.35}.progress{flex:1;display:flex;flex-direction:column;gap:9px;text-align:center;color:#d7c7b0;font:10px var(--sans);letter-spacing:.12em}.track{height:1px;background:#73624e}.track i{display:block;height:2px;background:#d1b181;width:0;transition:width .4s}.hint{margin:-10px 0 0;color:#b6a58d;font-size:10px;letter-spacing:.06em;max-height:24px;opacity:1;overflow:hidden;transition:opacity .25s,transform .25s,max-height .25s,margin .25s}.hint.is-hidden{max-height:0;margin:0;opacity:0;transform:translateY(-4px);pointer-events:none}button{cursor:pointer;touch-action:manipulation}button:focus-visible{outline:2px solid #e3c796;outline-offset:4px}@media(max-height:700px){.book{height:64svh;min-height:390px}.reader{gap:14px}.page{padding:22px}.page p{font-size:15px;line-height:1.38}}@media(min-width:700px){.scene{padding-left:36px;padding-right:36px}.reader{gap:24px}.book{height:min(72svh,660px);width:min(66vw,430px)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Text-first pages keep a photograph visible beside the story. */
.page.split-page{padding:0;justify-content:flex-start;display:flex}.split-photo{width:100%;height:31%;object-fit:cover;flex:none}.split-copy{flex:1;min-height:0;padding:17px 23px 25px;overflow-y:auto;overscroll-behavior:contain}.split-copy .kicker{margin-bottom:8px}.split-copy h2{font-size:clamp(31px,8vw,43px);margin-bottom:11px}.split-copy p{font-size:clamp(15px,3.5vw,16px);line-height:1.34}.gallery-page{padding:18px;justify-content:flex-start;gap:10px}.gallery-head{flex:none}.gallery-head .kicker{margin:0 0 5px}.gallery-head h2{font-size:clamp(28px,7vw,38px);margin:0 0 4px}.gallery-head p{font-size:14px;margin:0}.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:7px;flex:1;min-height:0;margin:2px 0 12px}.gallery-grid img{display:block;width:100%;height:100%;min-height:0;object-fit:cover;border-radius:3px 8px 8px 3px;box-shadow:0 2px 6px #3e2d1b24}.gallery-page .page-num{bottom:8px;right:17px}@media(max-height:700px){.split-photo{height:29%}.split-copy{padding:13px 20px 20px}.split-copy h2{font-size:30px;margin-bottom:8px}.split-copy p{font-size:14px}.gallery-page{padding:14px}.gallery-grid{gap:5px}}

/* The original image remains visible without thumbnail cropping. */
.page.story-photo-page{padding:0;justify-content:flex-start;background:var(--paper);color:var(--ink)}.story-photo-panel{height:48%;min-height:0;flex:none;background:#2d2824;display:grid;place-items:center}.story-photo{display:block;width:100%;height:100%;object-fit:contain;cursor:zoom-in}.story-copy{flex:1;min-height:0;overflow-y:auto;padding:16px 23px 28px;overscroll-behavior:contain}.story-copy .kicker{margin-bottom:7px}.story-copy h2{font-size:clamp(31px,8vw,43px);margin-bottom:9px}.story-copy p{font-size:clamp(15px,3.5vw,16px);line-height:1.34}.split-photo{object-position:center 18%;cursor:zoom-in}.gallery-grid{grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:10px}.gallery-grid img{object-fit:contain;background:#ddd2c2;border:1px solid #cbbba4;cursor:zoom-in}.gallery-page{padding:17px}.page.story-photo-page .page-num{color:#8c765b}.story-photo:focus-visible,.split-photo:focus-visible,.gallery-image:focus-visible{outline:3px solid #b18a55;outline-offset:-3px}#lightbox{position:fixed;inset:0;margin:auto;max-width:min(96vw,1000px);max-height:92svh;width:max-content;height:max-content;padding:12px;border:0;background:#161412;box-shadow:0 24px 80px #000b;overflow:visible}#lightbox::backdrop{background:#0c0907e8}#lightbox-image{display:block;max-width:min(90vw,960px);max-height:calc(92svh - 24px);object-fit:contain}#lightbox-close{position:absolute;right:-11px;top:-11px;width:38px;height:38px;border-radius:50%;border:1px solid #d7c8af;background:#f0e6d6;color:#201c19;font-size:26px;line-height:1;display:grid;place-items:center}@media(max-height:700px){.story-photo-panel{height:43%}.story-copy{padding:12px 20px 25px}.story-copy p{font-size:14px}.gallery-grid{gap:7px}}

/* Photo-led book layout: photo and words have separate, fixed regions. */
.page.story-photo-page{display:flex;flex-direction:column;overflow:hidden}.story-photo-panel{display:block;position:relative;flex:0 0 62%;width:100%;height:62%;min-height:0;overflow:hidden;background:#211d1a}.story-photo{display:block;width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;object-fit:contain}.story-copy{position:relative;flex:1 1 38%;min-height:0;width:100%;overflow:auto;background:var(--paper);padding:14px 23px 28px;color:var(--ink)}.story-copy h2{font-size:clamp(29px,7vw,38px);margin-bottom:7px}.story-copy p{font-size:clamp(14px,3.3vw,16px);line-height:1.32}.page.split-page .split-photo{height:39%;flex:0 0 39%;object-position:center 25%}.page.split-page .split-copy{flex:1;min-height:0}.page.gallery-page{position:absolute;padding:0;background:#211d1a;color:#fff;display:flex;flex-direction:column}.gallery-head{position:absolute;z-index:2;top:16px;left:16px;right:16px;width:max-content;max-width:calc(100% - 32px);background:#171310b8;color:#fff;padding:7px 11px;border-radius:3px}.gallery-head .kicker{display:none}.gallery-head h2{color:#fff;font-size:22px;line-height:1.1;margin:0}.gallery-head p{display:none}.gallery-grid{display:block;flex:1;width:100%;height:100%;margin:0;min-height:0}.gallery-grid img{display:block;width:100%;height:100%;object-fit:contain;background:#211d1a;border:0;border-radius:0;box-shadow:none}.gallery-page .page-num{color:#f1e8dc;z-index:2;text-shadow:0 1px 4px #000}.story-photo-page .page-num{z-index:2}.gallery-page .gallery-head h2{letter-spacing:0}@media(max-height:700px){.story-photo-panel{height:57%;flex-basis:57%}.page.split-page .split-photo{height:35%;flex-basis:35%}.story-copy{padding:10px 18px 23px}.story-copy h2{font-size:28px}.story-copy p{font-size:14px}}
