:root{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300;color:#fff;background:#243c40;font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}button,a,input{-webkit-tap-highlight-color:transparent}button,a{color:inherit}a{text-decoration:none}button{font:inherit;border:0;padding:0;background:none;cursor:pointer}a,button{touch-action:manipulation}a:hover,button:hover{opacity:.7}a,button{transition:opacity .3s}a:focus-visible,button:focus-visible,input:focus-visible,canvas:focus-visible{outline:1px solid currentColor;outline-offset:7px}h1,h2,p{margin:0}h1,h2{font-weight:300}button,input{min-height:36px}#c,.still,.veil{position:fixed;inset:0;width:100%;height:100%}.still{background:linear-gradient(#63717f,#cec2a4 66.4%,#999a8a 66.5%,#334849);background-size:cover;background-position:center}#c{display:block;opacity:0;transition:opacity 1.8s;touch-action:none}.world-ready #c{opacity:1}.veil{background:linear-gradient(transparent 50%,rgba(2,12,14,.22));pointer-events:none;transition:background 1s,backdrop-filter 1s}body:not([data-page=home]) .veil{background:rgba(4,18,22,.29)}main{position:fixed;inset:0;pointer-events:none}.panel{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:100px 8vw 115px;opacity:0;transform:translateY(7px);transition:opacity .65s,transform .9s;overflow-y:auto;pointer-events:none}.panel[hidden]{display:none}.panel.active{opacity:1;transform:none}.panel a,.panel button,.panel canvas{pointer-events:auto}.panel-inner{max-width:850px;text-align:center;text-shadow:0 1px 18px #13292b60}.home h1{font-size:clamp(38px,3.8vw,54px);font-weight:200;letter-spacing:-.025em}.home h1 a{display:block;padding:24px 20px}.eyebrow{font-size:12px;letter-spacing:.03em;margin-bottom:37px;opacity:.7}.book-list{list-style:none;padding:0;margin:0;display:grid;gap:24px}.book-list a{display:block}.book-list span{display:block;font-weight:200;font-size:clamp(29px,4vw,49px);letter-spacing:-.035em;line-height:1.13}.book-list small{display:block;font-size:11px;margin-top:9px;opacity:.75;font-weight:300;letter-spacing:.02em}.caption{font-size:10px;line-height:1.6;opacity:.58}.books .caption{margin-top:45px}.detail-inner{width:100%;max-width:950px;display:grid;grid-template-columns:1.2fr 1fr;gap:70px;align-items:center}.book-stage{width:100%;height:min(62vh,550px);position:relative;pointer-events:auto}.book-stage canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:none}.book-stage canvas:active{cursor:grabbing}.book-stage img{position:absolute;max-width:65%;max-height:85%;object-fit:contain;top:50%;left:50%;transform:translate(-50%,-50%);display:none}.book-stage.failed img{display:block}.book-stage.failed canvas{visibility:hidden}.book-info{max-width:340px;text-shadow:0 1px 20px #14252490}.back{display:inline-block;font-size:11px;margin-bottom:30px;opacity:.7;padding:8px 0}.book-info h2{font-size:clamp(30px,3.5vw,46px);letter-spacing:-.035em;line-height:1.08;font-weight:200}.book-info .book-author{font-size:14px;margin-top:15px;opacity:.9}.book-meta{font-size:11px;line-height:1.8;opacity:.7;margin:30px 0;white-space:pre-line}.purchase{font-size:12px;display:inline-block;padding:8px 0;border-bottom:0}.prose>p:first-of-type{font-size:clamp(23px,3vw,35px);font-weight:200;line-height:1.45;letter-spacing:-.02em}.names{font-size:13px;line-height:1.9;margin-top:34px;opacity:.8}.credit{display:inline-block;margin-top:45px}.email{font-weight:200;font-size:clamp(27px,3.6vw,47px);letter-spacing:-.035em}nav{position:fixed;z-index:3;bottom:24px;left:50%;transform:translateX(-50%);display:flex;gap:30px;font-size:12px}nav a{padding:14px 2px}nav a[aria-current=page]{font-weight:700}.music{position:fixed;z-index:3;right:32px;bottom:27px;display:flex;align-items:center;gap:10px;font-size:10px}.music #play{width:30px;display:grid;place-items:center}.music svg{fill:none;stroke:currentColor;stroke-width:.85}.music input[type=range]{width:52px;min-height:32px;accent-color:var(--paper);cursor:pointer;background:transparent;-webkit-appearance:none;appearance:none}.music input[type=range]::-webkit-slider-runnable-track{height:1px;background:#f4e8d160}.music input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;height:6px;width:6px;border-radius:50%;background:var(--paper);margin-top:-2.5px}.music input[type=range]::-moz-range-track{height:1px;background:#f4e8d160}.music input[type=range]::-moz-range-thumb{height:6px;width:6px;border:0;background:var(--paper)}.audio-status{position:fixed;right:35px;bottom:75px;font-size:11px;max-width:230px;text-align:right}.no-script{position:fixed;inset:0;display:grid;place-content:center;text-align:center;gap:25px;font-size:40px}.no-script a{font-size:16px}#dbg{position:fixed;top:12px;right:12px;font-size:10px;pointer-events:none}
@media(max-width:700px){.panel{padding:80px 25px 145px}.home h1{font-size:43px}.music{bottom:20px;right:20px;gap:7px}nav{bottom:70px;gap:30px}.detail{padding:70px 25px 150px;align-items:flex-start}.detail-inner{display:flex;flex-direction:column;gap:0;max-width:430px;margin:auto}.book-stage{height:36svh;min-height:210px;max-height:350px}.book-info{text-align:center;max-width:100%}.back{margin:0 0 12px;padding:8px}.book-info h2{font-size:29px}.book-info .book-author{margin-top:9px;font-size:12px}.book-meta{margin:15px 0 10px;font-size:10px}.book-list{gap:28px}.books .caption{margin-top:35px}.audio-status{bottom:58px;right:20px}.eyebrow{margin-bottom:30px}.prose>p:first-of-type{font-size:26px}}
@media(max-height:640px) and (min-width:701px){.panel{padding:60px 8vw 90px}.book-list{gap:17px}.books .caption{margin-top:25px}.eyebrow{margin-bottom:20px}.detail-inner{gap:35px}.book-stage{height:65vh}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;scroll-behavior:auto!important}}
.panel h2:focus{outline:none}
/* The complete scene is painted behind one flat curtain, then revealed together. */
#arrival{opacity:1;transition:opacity 1.4s cubic-bezier(.22,.61,.36,1);pointer-events:auto}
#arrival.depart{opacity:0}
#arrival[hidden]{display:none}
body[data-arrival=loading] .time-halo,body[data-arrival=loading] .panel,body[data-arrival=loading] .veil{transition:none}
#c{transition:none}
.still{background:#aea59b}
.font-fallback,.font-fallback nav,.font-fallback .book-list small,.font-fallback .book-meta,.font-fallback .purchase,.font-fallback .names{font-family:Arial,sans-serif!important}
.font-fallback .home h1{font-family:Garamond,serif!important}
@font-face{font-family:Manrope;src:url('assets/manrope.woff2') format('woff2');font-weight:200 800;font-display:swap}
:root{font-family:Manrope,Arial,sans-serif;font-weight:300}
.home h1{font-size:clamp(21px,2.2vw,30px);font-weight:300;letter-spacing:.15em}
.home h1 a{padding:22px}
nav{font-size:10px;letter-spacing:.1em;gap:27px}
.eyebrow{font-size:10px;letter-spacing:.12em}
.prose{max-width:660px}.prose>p:first-of-type{font-size:clamp(22px,2.3vw,31px);font-weight:300;line-height:1.55;letter-spacing:-.025em}
.book-list span{font-weight:300;font-size:clamp(27px,3.5vw,44px);letter-spacing:-.035em}
.book-info h2{font-weight:300;font-size:clamp(28px,3.1vw,41px);letter-spacing:-.035em}
.purchase,.back{font-size:10px;letter-spacing:.09em}.purchase{cursor:default;opacity:.65}.purchase:hover{opacity:.65}

@media(max-width:700px){.home h1{font-size:23px;letter-spacing:.12em}.prose>p:first-of-type{font-size:24px}.book-info h2{font-size:28px}.eyebrow{margin-bottom:26px}.book-list span{font-size:31px}nav{gap:24px;font-size:9px}.panel-inner.prose{max-width:350px}}

/* Quiet type and translucent dissolves, informed by Objective Archive. */
:root{--paper:#f4e8d1;--mono:"Courier New",Courier,monospace;--serif:Baskerville,"Iowan Old Style",Palatino,Georgia,serif;color:var(--paper)}
.home{padding:0;overflow:hidden;align-items:flex-start}
.home h1{position:absolute;top:calc(66.4% - 52px);transform:translateY(-50%);font-size:clamp(22px,2.15vw,28px);font-weight:250;letter-spacing:.20em;line-height:1}
.home h1 a{padding:22px}.home h1 a:hover{opacity:.88}#wordmark{display:inline-block;opacity:.78;text-shadow:0 0 14px #f3edda18}
.panel{position:absolute;inset:0;transform:none;filter:none;transition:opacity .3s ease;will-change:auto}
.panel.active{transform:none;filter:none;transition-duration:.48s}
nav,.eyebrow,.back,.purchase,.caption,.book-meta,.book-list small,.music{font-family:var(--mono);font-weight:400}
.book-list span,.book-info h2,.prose>p:first-of-type,.email{font-family:var(--serif);font-weight:400;letter-spacing:-.025em}
.book-list span{font-size:clamp(31px,3.8vw,48px)}
.prose>p:first-of-type{line-height:1.42;font-size:clamp(25px,2.6vw,35px)}
.book-list{gap:29px}.book-list small{font-size:10px;letter-spacing:.04em}.caption{letter-spacing:.02em}
body:not([data-page=home]) .veil{background:rgba(12,25,28,.36);backdrop-filter:blur(2px)}
.music{opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity 1s,transform 1s,visibility 1s;pointer-events:none}
.music.revealed{opacity:1;visibility:visible;transform:none;pointer-events:auto}
@media(max-width:700px){.home h1{top:calc(66.4% - 50px);font-size:22px;letter-spacing:.16em}.prose>p:first-of-type{font-size:29px}.book-list span{font-size:35px}.book-info h2{font-size:31px}}

/* The sunset occupies the broad front centre of the continuous orbit. */
.time-halo{position:fixed;z-index:4;top:max(14px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);width:calc(100% - 100px);max-width:1100px;height:88px;color:var(--paper);cursor:grab;touch-action:none;user-select:none}
.time-halo{opacity:0;transition:opacity .65s ease}
.time-halo.is-visible,.time-halo.dragging,.time-halo:focus-visible{opacity:1;transition-duration:.18s}
.time-halo svg{display:block;width:100%;height:100%;overflow:visible;pointer-events:none}
.halo-ring{fill:none;stroke:url(#halo-depth);stroke-width:.65;vector-effect:non-scaling-stroke}
#time-point{fill:currentColor;opacity:.85;filter:drop-shadow(0 0 3px #ffffff45)}
.time-halo.dragging{cursor:grabbing}.time-halo:focus-visible{outline:1px solid #f2f0e644;outline-offset:6px;border-radius:50%}
@media(max-width:700px){.time-halo{width:calc(100% - 38px);height:68px;top:max(12px,env(safe-area-inset-top))}#time-point{r:5px}}

/* A light, bookish inscription. The interface remains in a quiet sans serif. */
@font-face{font-family:"Prayer Cormorant";src:url('assets/roman.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
.home h1{font-family:"Prayer Cormorant",Garamond,serif;font-size:clamp(29px,2.75vw,37px);font-weight:300;letter-spacing:.115em}
#wordmark{opacity:1;color:rgba(244,232,209,.90);text-shadow:none;font-kerning:normal;text-rendering:optimizeLegibility}
.home h1{transform:none;}
nav,.book-list small,.book-meta,.purchase,.names{font-family:Manrope,Arial,sans-serif}
nav{font-size:10px;font-weight:400;letter-spacing:.11em}
.book-list{gap:23px}.book-list span{font-size:21px;letter-spacing:0;line-height:1.2}.book-list small{font-size:9px;margin-top:6px;letter-spacing:.02em;opacity:.65}
.books .panel-inner{transform:translateY(-1vh)}
@media(min-width:900px) and (min-aspect-ratio:6/5){
 .books .panel-inner{width:100%;max-width:960px}
 .book-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(32px,4vw,72px);align-items:start}
}
.prose{max-width:405px;transform:translateY(4vh)}.prose>p:first-of-type{font-size:19px;line-height:1.48;letter-spacing:0;outline:none}.names{font-size:10px;margin-top:24px}
.email{font-size:21px;letter-spacing:0}.contact .panel-inner{transform:translateY(6vh)}
.book-stage{height:40vh;max-height:350px;min-height:220px}.book-info h2{font-size:23px;letter-spacing:0}.book-info .book-author{font-size:11px;margin-top:4px}.book-meta{font-size:9px;margin:20px 0}.purchase{font-size:9px}
.detail-inner{max-width:790px;gap:48px;transform:translateY(-5vh)}
.book-arrow{position:fixed;top:45%;z-index:5;width:48px;height:48px;font:300 14px Manrope,Arial,sans-serif;opacity:.75;pointer-events:auto}.book-prev{left:27px}.book-next{right:27px}
body:not([data-page=home]) .veil{background:rgba(12,25,28,.20);backdrop-filter:none}
@media(max-width:700px){
 .home h1{font-size:29px;letter-spacing:.09em}
 .book-list span{font-size:19px}.book-list{gap:23px}.book-list small{font-size:9px}
 .panel-inner.prose{max-width:285px}.prose>p:first-of-type{font-size:17px}.names{font-size:9px;margin-top:22px}.email{font-size:19px}
 .detail{padding:100px 52px 170px;align-items:center}.detail-inner{gap:7px;margin:0;transform:translateY(-3vh)}
 .book-stage{height:25svh;min-height:150px;max-height:225px}.book-info h2{font-size:20px}.book-info .book-author{font-size:10px;margin-top:3px}.book-meta{font-size:8px;margin:12px 0 8px;line-height:1.6}.purchase{font-size:8px;padding:6px 0}
 .book-arrow{top:37%;font-size:14px}.book-prev{left:8px}.book-next{right:8px}
}

/* Horizontal gestures turn the project; vertical gestures remain available to scroll. */
.detail-inner{pointer-events:auto;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab}
.detail-inner.is-dragging,.detail-inner.is-dragging canvas{cursor:grabbing}
.book-stage canvas{touch-action:pan-y}
.book-list small{margin-top:3px}
.purchase,.purchase:hover,.purchase:focus{border:0;text-decoration:none}

/* The rendering canvas stays large; only the book itself catches desktop input. */
.book-control{position:absolute;inset:0;pointer-events:auto;cursor:grab;touch-action:pan-y}
.book-control.turning{cursor:grabbing}
.book-control:focus-visible{outline:1px solid currentColor;outline-offset:4px}
.book-stage canvas{pointer-events:none}
/* Paint the world into the display's unsafe areas; only controls are inset. */
html{background:var(--sky-edge,#aea59b)}
body{background:var(--water-edge,#aea59b)}
.world-ready .still{visibility:hidden}
#interface{display:contents}
@media(pointer:coarse),(max-width:700px){
 /* A centred, scrollable paint surface lets Safari composite the live world
    beneath both glass bars. Interface controls stay in the visible middle. */
 :root,body{overflow:visible;overscroll-behavior:none;scrollbar-width:none}
 body{position:relative;height:auto;min-height:calc(var(--view-height,100lvh) + 400px)}
 ::-webkit-scrollbar{display:none}
 #c{position:relative;inset:auto;margin:0;height:calc(var(--view-height,100lvh) + 400px);max-width:none}
 #interface{display:block;position:fixed;top:0;left:0;right:0;height:var(--view-height,100dvh);pointer-events:none}
 main{position:absolute;inset:0;height:100%}
 .veil,.still,#arrival{position:absolute;inset:0;height:100%}
 nav,.music,.time-halo,.book-arrow,.audio-status,#dbg{position:absolute}
 nav,.music,.time-halo{pointer-events:auto}
 .music:not(.revealed){pointer-events:none}
 nav,.music{bottom:max(24px,env(safe-area-inset-bottom,0px));height:36px;align-items:center}
 nav a{padding:11px 2px}
 .music{right:max(16px,env(safe-area-inset-right,0px));gap:0}
 .music #volume{display:none}
 .music #play{width:44px;min-height:44px}
 .book-prev{left:max(8px,env(safe-area-inset-left,0px))}.book-next{right:max(8px,env(safe-area-inset-right,0px))}
 #dbg{top:80px;font-size:9px;white-space:pre-wrap}
}
@media(max-width:700px){
 .audio-status{bottom:calc(52px + env(safe-area-inset-bottom,0px))}
}
@media(pointer:coarse) and (max-width:700px){nav,.music{bottom:calc(8px + env(safe-area-inset-bottom,0px))}}
@media (pointer:fine){
 .detail-inner,.book-stage{pointer-events:none;cursor:default}
 .book-control{inset:auto;left:var(--book-x,25%);top:var(--book-y,5%);width:var(--book-width,50%);height:var(--book-height,90%);touch-action:none}
}

/* A shared centreline for pointer-driven desktop layouts, including narrow windows. */
@media(pointer:fine){
 nav{bottom:27px;height:36px;align-items:center}
 nav a{padding:11px 2px}
 .music{bottom:27px}
}
@media(pointer:fine) and (max-width:480px){nav{left:20px;transform:none;gap:18px}}

/* During a touch, the adjacent physical book and its details follow the finger. */
.book-swipe-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}
.book-swipe-card{position:absolute!important;margin:0!important;max-width:none!important;pointer-events:none!important;will-change:transform}
.book-swipe-card *{pointer-events:none!important}
.swipe-source{visibility:hidden}
.detail-inner.touch-books{pointer-events:auto;touch-action:none}
.touch-books .book-stage,.touch-books .book-control{touch-action:none}
.touch-books .book-control{inset:auto;left:var(--book-x,25%);top:var(--book-y,5%);width:var(--book-width,50%);height:var(--book-height,90%)}
@media(pointer:coarse){
 .detail{overflow:hidden}
 .detail-inner,.book-stage,.book-control{touch-action:none}
 .detail-inner{pointer-events:auto}
}

/* Keep the book centred as two- and three-line descriptions change. */
.book-meta{min-height:5.4em}
@media(max-width:700px){.book-meta{min-height:4.8em}}

/* Intrinsic width prevents an old pixel offset from squeezing the wordmark
   during Safari's portrait/landscape relayout. */
.home h1{width:max-content;white-space:nowrap}

/* Keep scene gestures from invoking Safari text selection or image callouts. */
body,body *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
img{-webkit-user-drag:none}