@font-face{font-family:'Marcellus';font-style:normal;font-weight:400;font-display:swap;src:url('./assets/fonts/marcellus-regular.ttf') format('truetype')}
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400;font-display:swap;src:url('./assets/fonts/eb-garamond-regular.ttf') format('truetype')}
:root{--paper:#f5f0e9;--ink:#242424;--muted:#8d8176;--copper:#863a27;--scale:1}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}body{background:var(--paper);color:var(--ink);font-family:'Times New Roman','Songti SC',serif;background-image:none}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible{outline:1px solid var(--copper);outline-offset:7px}:is(#composition,.shadow-copy){position:absolute;width:1672px;height:941px;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--scale));transform-origin:center}:is(#composition,.shadow-copy):before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.12;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath opacity='.25' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.star{font-size:31px;font-weight:normal;line-height:1}.north-star{position:absolute;left:40px;top:38px;text-decoration:none}.catalogue{position:absolute;left:52px;top:625px;transform:rotate(-90deg);transform-origin:left top;white-space:nowrap;font-size:14px;letter-spacing:10px}.wordmark{position:absolute;left:141px;top:-30px;width:300px;height:1001px;object-fit:fill;mix-blend-mode:normal;user-select:none;pointer-events:none}.menu-trigger{position:absolute;right:40px;top:42px;display:flex;gap:28px;align-items:center;padding:0;font-size:13px;letter-spacing:5px;z-index:5}.menu-trigger i{display:block;width:27px;height:15px;border-top:1px solid;border-bottom:1px solid;position:relative}.menu-trigger i:after{content:'';position:absolute;left:0;right:0;top:6px;border-top:1px solid}.description{position:absolute;left:480px;top:260px;width:330px;height:420px}.description h1{font-weight:normal;font-size:22px;letter-spacing:4.5px;line-height:32px;margin:0 0 29px;text-align:right}.description h1 span{display:block}.description h1 span:first-child{padding-right:15px}.description h1 span:last-child{padding-right:23px}.body-copy{font-size:16px;font-weight:500;letter-spacing:3.8px;line-height:28px;margin:0;text-align:right}.body-copy span{display:block}.body-copy span:nth-child(1){padding-right:53px}.body-copy span:nth-child(2){padding-right:64px}.body-copy span:nth-child(3){padding-right:70px}.body-copy span:nth-child(4){padding-right:73px}.body-copy span:nth-child(5){padding-right:74px}.body-copy span:nth-child(6){padding-right:71px}.body-copy span:nth-child(7){padding-right:70px}.coordinates{font-size:18px;letter-spacing:4.5px;line-height:32px;text-align:right;margin:32px 0 0}.coordinates span{display:block}.coordinates span:first-child{padding-right:36px}.coordinates span:last-child{padding-right:21px}.annotation-star{display:block;margin-top:9px;margin-left:110px;font-size:30px}.lunar-stage{position:absolute;left:722px;top:150px;width:623px;height:623px;z-index:2}#moon{position:absolute;inset:0;width:100%;height:100%;padding:0;border-radius:50%;touch-action:manipulation;z-index:2}canvas{display:block;width:100%;height:100%;border-radius:50%}#loading{position:absolute;left:0;right:0;top:49%;font-size:13px;letter-spacing:3px;color:var(--muted)}#halo{position:absolute;inset:10%;border-radius:50%;opacity:0;box-shadow:0 0 4px 1px #e3e4df,0 0 28px 9px #c2ccca99,0 0 72px 19px #aab6b34d;pointer-events:none}.shadow{position:absolute;left:20%;right:20%;bottom:4%;height:30px;background:#3c3022;opacity:.3;filter:blur(13px);transform:scaleY(.65);border-radius:50%;pointer-events:none}.orbit{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}.orbit path{fill:none;stroke:#bfb5ad;stroke-width:.7}.phase{position:absolute;display:flex;align-items:center;gap:48px;height:44px;padding:0;z-index:4;transition:color .5s,opacity .35s;white-space:nowrap}.phase svg{width:38px;height:38px;overflow:visible;flex-shrink:0;transition:transform .3s}.phase .light{fill:var(--paper);stroke:currentColor;stroke-width:.7}.phase span{font-size:14px;letter-spacing:4.5px;transition:transform .3s}.phase:is(:hover,.is-hovered) svg{transform:scale(1.12)}.phase:is(:hover,.is-hovered) span{transform:translateX(5px)}.n1{left:1146px;top:117px;gap:43px}.n1 span{transform:translateY(-29px)}.n1:is(:hover,.is-hovered) span{transform:translate(5px,-29px)}.n2{left:1274px;top:199px;gap:49px}.n2 span{transform:translateY(-13px)}.n2:is(:hover,.is-hovered) span{transform:translate(5px,-13px)}.n3{left:1348px;top:331px;gap:51px}.n4{left:1354px;top:507px;gap:52px}.n5{left:1282px;top:652px;gap:48px}.n6{left:1144px;top:749px;gap:53px}.n6 span{transform:translateY(16px)}.n6:is(:hover,.is-hovered) span{transform:translate(5px,16px)}.edition{position:absolute;left:40px;bottom:162px;font-size:14px;letter-spacing:3px;line-height:20px}.wax-seal{position:absolute;left:31px;bottom:76px;width:62px;height:62px;border-radius:46% 51% 46% 49%;background:radial-gradient(circle at 35% 28%,#a54b3b,#641c15 65%,#aa4a34 80%,#4e1710);box-shadow:inset 1px 2px 3px #e09d8177,inset -2px -2px 3px #3b0e0b,1px 4px 3px #44302055;transform:rotate(-8deg);border:2px solid #76291c}.wax-seal:before{content:'';position:absolute;inset:6px;border:1px solid #3d110c;border-radius:50%;box-shadow:0 1px 0 #d67e6577}.wax-seal span{font-size:33px;color:#46140e;text-shadow:0 1px 0 #c47461;position:relative}.moon-instruction{position:absolute;left:835px;top:858px;font-size:13px;letter-spacing:4px;white-space:nowrap;padding:5px 10px}.eclipsed .shadow{opacity:.17}.phase[hidden]{display:none}.sr-only{position:absolute;width:1px;height:1px;clip:rect(0,0,0,0);overflow:hidden}dialog{border:1px solid #cabeaf;background:#f7f1e9;color:#34302c;padding:28px 34px 20px;max-width:min(510px,calc(100vw - 36px));width:510px;max-height:85dvh;box-shadow:0 30px 100px #2b201c33}dialog::backdrop{background:#302c253d;backdrop-filter:blur(5px)}.panel-top{display:flex;justify-content:space-between;align-items:center;color:#86766a;font-size:10px;letter-spacing:2px}.panel-top button{font-size:27px;padding:0 4px}h2{font-size:30px;font-weight:normal;letter-spacing:2px;margin:24px 0}.panel-bottom{margin-top:25px;padding-top:17px;border-top:1px solid #d9cec0;display:flex;justify-content:space-between;font-size:9px;letter-spacing:2px;color:#9c8d7e}.panel-bottom span{font-size:18px}#panelContent{font-family:Georgia,'Songti SC',serif;font-size:14px;line-height:1.9;color:#736458}#panelContent p{margin:12px 0 20px}.panel-links{display:grid;gap:0}.panel-links button,.panel-links a{display:flex;justify-content:space-between;align-items:center;text-decoration:none;text-align:left;padding:14px 0;border-top:1px solid #d8cec1;font-size:14px;letter-spacing:1px}.panel-links small{font-size:9px;letter-spacing:2px;color:#98897d}.panel-action{display:inline-block;margin-top:10px;padding:10px 18px!important;border:1px solid #a49584!important;text-decoration:none}.quiet{font-size:11px;color:#9a8b7f}.field{display:block;margin:17px 0}.field input[type=url]{display:block;width:100%;background:#fffcf7;border:1px solid #d6cabc;padding:10px;margin-top:6px;color:#4b4139;font-size:13px}.field input[type=range]{display:block;width:100%;accent-color:#8c4a34;margin-top:8px}.field output{float:right;font-size:12px}.notice{color:#8b3d2a;font-size:12px}.settings-row{display:flex;gap:12px;flex-wrap:wrap}.settings-row button{border-bottom:1px solid #c5b6a5;font-size:13px;padding:5px 0}.empty-mark{font-size:38px;color:#b2a394;line-height:1;margin:20px 0}#panelContent a:hover,#panelContent button:hover{color:#9a4c34}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
@media(max-aspect-ratio:4/5){:is(#composition,.shadow-copy){width:420px;height:850px}.wordmark{left:15px;top:65px;width:74px;height:360px}.north-star{left:24px;top:25px;font-size:23px}.catalogue{left:28px;top:704px;font-size:9px;letter-spacing:5px}.menu-trigger{top:30px;right:25px;font-size:10px;letter-spacing:3px;gap:14px}.menu-trigger i{width:22px}.lunar-stage{left:90px;top:139px;width:270px;height:270px}.orbit{display:none}.phase{height:34px;gap:10px}.phase svg{width:21px;height:21px}.phase span{font-size:8px;letter-spacing:.7px}.n1{left:231px;top:90px}.n2{left:296px;top:132px}.n3{left:340px;top:207px}.n4{left:340px;top:297px}.n5{left:296px;top:374px}.n6{left:230px;top:416px}.n1 span,.n2 span,.n6 span{transform:none}.n1:is(:hover,.is-hovered) span,.n2:is(:hover,.is-hovered) span,.n6:is(:hover,.is-hovered) span{transform:translateX(3px)}.n3,.n4{gap:7px}.description{left:106px;top:493px;width:240px;height:280px}.description h1{font-size:15px;letter-spacing:3px;line-height:24px;margin-bottom:16px}.body-copy{font-size:12px;letter-spacing:1.5px;line-height:21px}.description h1 span,.body-copy span,.coordinates span{padding-right:0!important}.coordinates{font-size:12px;letter-spacing:2px;line-height:23px;margin-top:18px}.annotation-star{position:absolute;left:-5px;bottom:20px;margin:0;font-size:24px}.edition{left:24px;bottom:45px;font-size:9px;letter-spacing:2px;line-height:15px}.wax-seal{left:24px;bottom:95px;width:43px;height:43px}.wax-seal span{font-size:25px}.moon-instruction{left:102px;top:458px;font-size:8px;letter-spacing:1.7px;padding:0}.shadow{height:17px;filter:blur(8px)}}

/* The two navigation palettes stay fixed while whole layers crossfade. */
.phases{position:absolute;inset:0;z-index:4;pointer-events:none;will-change:opacity}.phases .phase{pointer-events:auto}.phase-public .phase{color:#242424}.phase-private .phase{color:#a6afad}.phase-private{opacity:0}.phases[inert] .phase{pointer-events:none}

/* The original lettering/wordmark never changes globally on a click. */
#composition{z-index:1}
#environment-shadow{position:fixed;inset:0;z-index:0;pointer-events:none;background:#080a0b;background-image:none;mask-image:var(--shadow-mask,linear-gradient(transparent,transparent));-webkit-mask-image:var(--shadow-mask,linear-gradient(transparent,transparent))}
#shadow-ink{position:fixed;inset:0;z-index:8;pointer-events:none;mask-image:var(--shadow-mask,linear-gradient(transparent,transparent));-webkit-mask-image:var(--shadow-mask,linear-gradient(transparent,transparent))}
#shadow-ink *{pointer-events:none!important}
.shadow-copy{--ink:#c3c7c5;--paper:#080a0b;color:#c3c7c5}
.shadow-copy:before{display:none}
.shadow-copy .phase-public .phase{color:#c3c7c5}
.shadow-copy .phase-private .phase{color:#b6bfbd}
.shadow-copy .phase-private .phase span{color:#c3c7c5}
.shadow-copy .orbit path{stroke:#9fa9a7}
.shadow-copy .menu-trigger{color:#c3c7c5}
.wordmark,.eclipsed .wordmark{filter:none;opacity:1}
.shadow-copy .wordmark{filter:brightness(0) invert(.73)}

/* Eclipse palette: neutral moon-white with only a trace of coolness. */
.eclipsed dialog{background:#282d2f;color:#c3c7c5;border-color:#626c6d}
.eclipsed #panelContent,.eclipsed .panel-top,.eclipsed .panel-bottom,.eclipsed .panel-links small,.eclipsed .quiet,.eclipsed .notice{color:#b9c1bf}
.eclipsed .panel-bottom,.eclipsed .panel-links button,.eclipsed .panel-links a,.eclipsed .panel-action,.eclipsed .settings-row button{border-color:#667171!important}
.eclipsed .field input[type=url]{background:#202527;color:#c3c7c5;border-color:#667171}
.eclipsed .field input[type=range]{accent-color:#b6bfbd}
.eclipsed #panelContent a:hover,.eclipsed #panelContent button:hover{color:#e2e6e3}
.eclipsed button:focus-visible,.eclipsed a:focus-visible{outline-color:#b6bfbd}

/* A single viewport veil affects moon, lettering and navigation together. */
#eclipse-veil{mix-blend-mode:soft-light;position:fixed;inset:0;z-index:9;pointer-events:none;mask-image:var(--shadow-mask,linear-gradient(transparent,transparent));-webkit-mask-image:var(--shadow-mask,linear-gradient(transparent,transparent))}
#eclipse-veil:before,#eclipse-veil:after{content:'';position:absolute;inset:0;pointer-events:none}
#eclipse-veil:before{opacity:.22;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 220 220' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath filter='url(%23grain)' d='M0 0h220v220H0z'/%3E%3C/svg%3E");background-size:220px 220px}
#eclipse-veil:after{display:none}

/* Fixed palettes; spatial masks reveal navigation at the shadow boundary. */
.phase-private .phase{color:#b6bfbd}.phase-private .phase .light{fill:#080a0b}.phase[inert]{pointer-events:none}
/* Let the lettering reach the viewport edges even when the artboard is letterboxed. */
@media(min-aspect-ratio:4/5){.wordmark{--wordmark-height:calc((100dvh - 28px) / var(--scale) / .9);height:var(--wordmark-height);top:calc((941px - var(--wordmark-height)) / 2 + 18px / var(--scale))}}

/* Upright archive typography; image wordmark is independent of these families. */
body{font-family:'Marcellus','Songti SC',serif;font-weight:400;font-synthesis:none}
.body-copy,#panelContent{font-family:'EB Garamond','Songti SC',serif;font-style:normal;font-weight:400}
.body-copy{font-size:17px;line-height:29px}
.phase,.coordinates,.catalogue,.edition,.menu-trigger,.description h1,.panel-top,.panel-bottom,.panel-links,.panel-action,.settings-row,h2{font-family:'Marcellus','Songti SC',serif;font-style:normal;font-weight:400}
@media(max-aspect-ratio:4/5){.body-copy{font-size:13px;line-height:21px}}

/* Each chapter is revealed by a viewport circle growing from its lunar node. */
dialog.chapter-page{position:fixed;inset:0;margin:0;width:100vw;max-width:none;height:100dvh;max-height:none;border:0;padding:clamp(28px,5vw,76px) clamp(28px,12vw,200px);overflow-y:auto;background:var(--paper);color:var(--ink);box-shadow:none;isolation:isolate}
dialog.chapter-page::backdrop{background:transparent;backdrop-filter:none}
dialog.chapter-page:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.chapter-page .panel-top{font-size:11px;letter-spacing:3px;border-bottom:1px solid #b8aea060;padding-bottom:25px;gap:20px}
.chapter-page .panel-top button{font-size:11px;letter-spacing:2px;white-space:nowrap;padding:12px 0}
.chapter-page h2{font-size:clamp(30px,4.5vw,68px);line-height:1.35;margin:clamp(55px,10vh,110px) 0 36px;outline:none}
.chapter-page #panelContent{max-width:760px;font-size:18px;line-height:2}
.chapter-page .panel-links button{padding:22px 0}
.chapter-page .panel-bottom{max-width:760px;margin-top:70px;padding-bottom:20px}
.chapter-page.page-entering :is(h2,#panelContent,.panel-bottom){animation:chapter-copy-in .65s .14s both}
.eclipsed dialog.chapter-page{background:#080a0b;color:#c3c7c5}
.eclipsed .chapter-page .panel-top{border-color:#66717160}
@keyframes chapter-copy-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.chapter-page.page-entering :is(h2,#panelContent,.panel-bottom){animation:none}}
@media(max-width:600px){.chapter-page .panel-top{font-size:9px;letter-spacing:1.5px}.chapter-page #panelContent{font-size:16px}.chapter-page .panel-links small{letter-spacing:1px}}

/* Register the supplied black cutout to the previous visible wordmark bounds. */
#composition .wordmark{transform-origin:0 0;transform:translate(1.677133%,1.178585%) scale(0.97542320,0.92609934)}

/* Fine eight-point compass stars, shared by the original and shadow ink copy. */
.compass-star{display:block;width:1em;height:1em;overflow:visible}.north-star{width:1em;height:1em}.annotation-star{width:1em;height:1em}

@font-face{font-family:'Special Elite';font-style:normal;font-weight:400;font-display:swap;src:url('./assets/fonts/special-elite-regular.ttf') format('truetype')}
.chapter-page.about-page h2{font-size:clamp(32px,4vw,52px);margin:clamp(36px,6vh,68px) 0 30px}
.chapter-page #panelContent.about-dossier{font-family:'Special Elite','Courier New',monospace;font-size:clamp(15px,1.35vw,18px);font-weight:400;line-height:1.85;letter-spacing:.015em;max-width:760px;color:var(--ink)}
#panelContent.about-dossier>p{margin:0 0 19px}
.about-colophon{border-top:1px solid #b8aea060;margin-top:32px;padding-top:22px;font-size:12px;line-height:1.8}
#panelContent .about-colophon p{margin:0 0 5px}
.about-credit{display:inline-block;margin-top:24px;font-family:'Marcellus',serif;font-size:10px;letter-spacing:.08em;opacity:.65;text-underline-offset:4px}
.about-page .panel-bottom{margin-top:32px}
.eclipsed .chapter-page #panelContent.about-dossier{color:#c3c7c5}
@media(max-width:600px){.chapter-page.about-page h2{margin-top:30px}.about-colophon{font-size:11px}}

/* Lightweight moon calibration curtain: real readiness, no artificial hold. */
#moonOpening{position:fixed;inset:0;z-index:10000;isolation:isolate;color:#35332f;display:grid;place-items:center}
#moonOpening[hidden]{display:none}
.opening-curtain{position:absolute;inset:0;z-index:-1;pointer-events:none}
#openingArt{text-align:center;transition:opacity .18s ease;pointer-events:none}
.opening-orbit{width:112px;height:112px;overflow:visible;fill:none;stroke:currentColor;stroke-width:.55}
.opening-track{opacity:.22}.opening-core{opacity:.45}.opening-axis{opacity:.35}
.opening-turn{transform-origin:50px 50px;animation:opening-orbit 5s linear infinite}.opening-turn circle{fill:currentColor;stroke:none}
#openingArt p{font:400 11px/1.8 'Marcellus',serif;letter-spacing:.34em;margin:24px 0 12px;padding-left:.34em}
#openingArt span{font:400 8px/1.8 'Marcellus',serif;letter-spacing:.28em;opacity:.52}
#openingSkip{position:absolute;bottom:max(36px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.15em;padding:12px;opacity:.6;transition:opacity .18s}
#moonOpening.is-revealing{pointer-events:none}
@keyframes opening-orbit{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.opening-turn{animation:none}}
@media(max-width:600px){.opening-orbit{width:92px;height:92px}#openingArt p{font-size:10px;letter-spacing:.23em}}