:root{--ink:#f6ecd6;--muted:#c9bda3;--gold:#e9c46a;--gold2:#c8962e;--deep:#0b1410;--night:#0a0f1a;--panel:rgba(14,20,18,.72);--line:rgba(233,196,106,.28);--blue:#8fc3ff;--seal:#c98b3a;
--serif:"Cormorant Garamond","EB Garamond",Georgia,serif;--sans:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--night);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--gold)}a:hover{color:#fff}
h1,h2,h3{font-family:var(--serif);font-weight:600;letter-spacing:.01em;line-height:1.1;margin:0 0 .4em}
h1{font-size:clamp(2.6rem,7vw,6rem)}h2{font-size:clamp(2rem,4.6vw,3.6rem)}h3{font-size:clamp(1.3rem,2.4vw,1.8rem)}
.eyebrow{font:600 .78rem/1 var(--sans);letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;display:block}
.wrap{width:min(1180px,92vw);margin:0 auto}
.lede{font-family:var(--serif);font-size:clamp(1.2rem,2.2vw,1.6rem);color:var(--muted);max-width:44ch}
blockquote{margin:1.2em 0;padding:.2em 0 .2em 1.1em;border-left:2px solid var(--gold);font-family:var(--serif);font-size:1.28rem;color:#fff6e2}
blockquote cite{display:block;font:500 .82rem/1.4 var(--sans);color:var(--muted);margin-top:.5em;font-style:normal}
.src{font-size:.82rem;color:var(--muted)}.src a{color:var(--muted);text-decoration:underline dotted}.src a:hover{color:var(--gold)}
.est{color:var(--seal);font-weight:600}
/* nav */
.nav{position:fixed;inset:0 0 auto 0;z-index:200;display:flex;align-items:center;justify-content:space-between;padding:.8rem clamp(1rem,3vw,2rem);background:linear-gradient(#0a0f1acc,#0a0f1a00);backdrop-filter:blur(2px)}
.nav .brand{font-family:var(--serif);font-size:1.25rem;color:var(--ink);text-decoration:none;letter-spacing:.04em}
.nav .links{display:flex;gap:1.1rem;font-size:.82rem}.nav .links a{color:var(--muted);text-decoration:none}.nav .links a:hover,.nav .links a.on{color:var(--gold)}
.nav-toggle{display:none;appearance:none;-webkit-appearance:none;flex:none;align-items:center;justify-content:center;width:44px;height:44px;margin:0;padding:0;border:1px solid var(--line);border-radius:9px;background:rgba(10,15,26,.45);color:var(--gold);cursor:pointer}
.nav-toggle:hover,.nav-toggle:focus-visible{border-color:var(--gold);background:rgba(233,196,106,.12)}
.nav-toggle:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.nav-toggle svg{display:block;width:22px;height:22px}
.nav-toggle .icon-close{display:none}
body.nav-open{overflow:hidden}
@media(max-width:860px){
  .nav-toggle{display:inline-flex}
  .nav.is-open{background:rgba(10,15,26,.94);backdrop-filter:blur(12px)}
  .nav.is-open .nav-toggle .icon-menu{display:none}
  .nav.is-open .nav-toggle .icon-close{display:block}
  .nav .links{display:none;position:absolute;top:calc(100% - .15rem);left:clamp(.7rem,3vw,1.5rem);right:clamp(.7rem,3vw,1.5rem);flex-direction:column;gap:0;padding:.4rem 0;background:#0c1218;border:1px solid var(--line);border-radius:14px;box-shadow:0 28px 60px -20px #000d;max-height:calc(100dvh - 4.6rem);overflow:auto;-webkit-overflow-scrolling:touch}
  .nav.is-open .links{display:flex}
  .nav .links a{display:block;padding:.9rem 1.15rem;font-size:1rem;line-height:1.3;color:var(--ink);border-bottom:1px solid rgba(233,196,106,.12)}
  .nav .links a:last-child{border-bottom:0}
  .nav .links a:hover,.nav .links a.on{color:var(--gold);background:rgba(233,196,106,.08)}
}
.progress{position:fixed;left:0;top:0;height:2px;background:var(--gold);z-index:210;width:0}
/* HERO forest */
#forest{position:relative;height:340vh}
#forest .stage{position:sticky;top:0;height:100vh;overflow:hidden}
#forest svg.scene{position:absolute;inset:0;width:100%;height:100%}
#forest .copy{position:absolute;left:0;right:0;top:0;height:100vh;display:flex;align-items:center;pointer-events:none}
#forest .copy .wrap>div{max-width:620px}
.beat{position:absolute;left:clamp(1rem,6vw,6rem);right:clamp(1rem,6vw,6rem);top:50%;transform:translateY(-50%);max-width:640px;opacity:0}
.beat p{font-family:var(--serif);font-size:clamp(1.15rem,2.3vw,1.6rem);color:#fff7e6;text-shadow:0 2px 18px #000a}
.beat .src{text-shadow:none}
.scrollcue{position:absolute;bottom:4vh;left:50%;transform:translateX(-50%);font-size:.75rem;letter-spacing:.3em;text-transform:uppercase;color:#fff9;animation:bob 2.4s ease-in-out infinite}
@keyframes bob{50%{transform:translate(-50%,8px)}}
/* sections */
section.block{position:relative;padding:clamp(5rem,12vh,9rem) 0}
.dark{background:radial-gradient(1200px 600px at 70% 0%,#1b2a22 0%,#0b1410 55%,#080c0a 100%)}
.night{background:radial-gradient(1000px 700px at 20% 10%,#14203a 0%,#0a0f1a 60%)}
.parch{background:#f1e6cc;color:#2b2114}.parch .lede{color:#5b4a30}.parch .eyebrow{color:#8a5a12}.parch blockquote{color:#2b2114;border-color:#8a5a12}.parch .src,.parch .src a{color:#6b5a40}
.grid2{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,5rem);align-items:center}
@media(max-width:900px){.grid2{grid-template-columns:1fr}}
.reveal{opacity:0;transform:translateY(28px)}
/* stone box scene */
#find svg{width:100%;height:auto;display:block}
/* 3D viewer */
#viewer{position:relative;height:min(78vh,760px);border:1px solid var(--line);border-radius:18px;overflow:hidden;background:radial-gradient(circle at 50% 40%,#1d2a3c 0%,#0b111c 70%)}
#viewer canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:none}
#viewer canvas:active{cursor:grabbing}
.vctl{position:absolute;left:12px;right:12px;bottom:12px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;z-index:3}
.btn{appearance:none;border:1px solid var(--line);background:#0b111ccc;color:var(--ink);padding:.55rem .9rem;border-radius:999px;font:600 .8rem var(--sans);cursor:pointer;backdrop-filter:blur(6px);transition:.2s}
.btn:hover{border-color:var(--gold);color:var(--gold)}.btn[aria-pressed=true]{background:var(--gold);color:#1b1306;border-color:var(--gold)}
.vctl input[type=range]{flex:1;min-width:140px;accent-color:var(--gold)}
.vhint{position:absolute;top:12px;left:14px;font-size:.75rem;color:#fff9;z-index:3;pointer-events:none}
.vangle{position:absolute;top:12px;right:14px;font:600 .8rem ui-monospace,monospace;color:var(--gold);z-index:3}
.vlabels{position:absolute;inset:0;pointer-events:none;z-index:2}
.vlabels span{position:absolute;transform:translate(-50%,-50%);font:600 .74rem ui-monospace,monospace;color:var(--blue);background:#0b111cd9;border:1px solid #8fc3ff55;padding:2px 6px;border-radius:6px;white-space:nowrap;opacity:0;transition:opacity .3s}
.vlabels.on span{opacity:1}
.dimtable{width:100%;border-collapse:collapse;font-size:.92rem;margin-top:1rem}
.dimtable th,.dimtable td{border-bottom:1px solid var(--line);padding:.55rem .4rem;text-align:left;vertical-align:top}
.dimtable th{font:600 .72rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.big{font-family:var(--serif);font-size:clamp(2.6rem,6vw,4.8rem);color:var(--gold);line-height:1}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin:2rem 0}
.stats div{border-top:1px solid var(--line);padding-top:.8rem}.stats small{display:block;color:var(--muted);font-size:.8rem}
@media(max-width:700px){.stats{grid-template-columns:repeat(2,1fr)}}
/* blueprint gallery */
.bp{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:2rem}
.bp a,.bp button{display:block;width:100%;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#0d1a2b}
.bp img{width:100%;display:block;aspect-ratio:1600/1131;object-fit:cover}
.bp span{display:block;font-size:.75rem;padding:.4rem .6rem;color:var(--muted)}
@media(max-width:800px){.bp{grid-template-columns:repeat(2,1fr)}}
/* characters */
.glyphgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px;margin-top:1.4rem}
.glyph{aspect-ratio:1;border:1px solid #8a5a1233;border-radius:10px;background:#fbf4e2;display:grid;place-items:center;cursor:pointer;transition:transform .25s,box-shadow .25s,border-color .25s;padding:8px}
.glyph svg{width:100%;height:100%}.glyph svg path{fill:#2b1d0a}
.glyph:hover,.glyph:focus-visible{transform:scale(1.35);z-index:3;box-shadow:0 10px 30px #0004;border-color:#8a5a12;outline:none;position:relative}
.docwrap{position:relative;margin-top:1.6rem;border-radius:12px;overflow:hidden;background:#f7ecd2;border:1px solid #8a5a1244}
.docwrap svg{width:100%;height:auto;display:block}
.docwrap path.hl{fill:#b3261e!important}
.lines{display:flex;gap:6px;flex-wrap:wrap;margin-top:1rem}
.chip{border:1px solid #8a5a1255;background:transparent;color:#5b4a30;border-radius:999px;padding:.3rem .8rem;font:600 .78rem var(--sans);cursor:pointer}.chip[aria-pressed=true]{background:#8a5a12;color:#fff}
.modal{position:fixed;inset:0;background:#0009;backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;z-index:100;padding:4vw}
.modal.open{display:flex}
.modal .card{background:#fbf4e2;color:#2b2114;border-radius:18px;max-width:900px;width:100%;padding:clamp(1rem,3vw,2rem);position:relative;max-height:90vh;overflow:auto}
.modal .close{position:absolute;right:14px;top:10px;font-size:1.6rem;background:none;border:0;cursor:pointer;color:#2b2114}
.mgrid{display:grid;grid-template-columns:1fr 1.4fr;gap:1.4rem;align-items:center}
@media(max-width:700px){.mgrid{grid-template-columns:1fr}}
.mglyph svg{width:100%;height:auto;max-height:280px}.mglyph svg path{fill:#2b1d0a}
.mloc svg{width:100%;height:auto;background:#f7ecd2;border-radius:10px}
/* journey */
.journey{position:relative;margin-top:2rem}
.journey svg{width:100%;height:auto}
.stops{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1rem}
.stops div{border-top:2px solid var(--line);padding-top:.7rem;font-size:.92rem}.stops b{display:block;font-family:var(--serif);font-size:1.2rem;color:var(--gold)}
@media(max-width:800px){.stops{grid-template-columns:1fr 1fr}}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin-top:1.4rem}
@media(max-width:760px){.pair{grid-template-columns:1fr}}
.verse{border:1px solid var(--line);border-radius:14px;padding:1.1rem 1.2rem;background:#ffffff08}
.verse h4{margin:0 0 .5rem;font:600 .74rem var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.verse p{font-family:var(--serif);font-size:1.15rem;margin:.3rem 0}.verse sup{color:var(--gold);font-family:var(--sans);font-size:.65rem;margin-right:.2rem}
/* witnesses */
.wit{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}
@media(max-width:800px){.wit{grid-template-columns:1fr}}
.wit .verse{background:#00000022}
.names{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.6rem}.names span{border:1px solid var(--line);border-radius:999px;padding:.15rem .6rem;font-size:.78rem;color:var(--muted)}
footer{padding:4rem 0 5rem;background:#06090f;color:var(--muted);font-size:.86rem}
footer h3{color:var(--ink)}
footer ul{padding-left:1.1rem}footer li{margin:.2rem 0}
.badge{display:inline-block;border:1px solid var(--seal);color:var(--seal);border-radius:999px;font:700 .68rem var(--sans);letter-spacing:.14em;padding:.2rem .6rem;text-transform:uppercase}
.cta{display:inline-flex;gap:.6rem;align-items:center;margin-top:1.4rem;padding:.85rem 1.3rem;border-radius:999px;background:var(--gold);color:#1b1306;font-weight:700;text-decoration:none}
.cta:hover{background:#fff;color:#1b1306}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
#viewer .vloading{position:absolute;inset:0;display:grid;place-items:center;color:#e9c46a;font:600 .95rem/1 system-ui;letter-spacing:.08em;pointer-events:none}
.bpmain{display:block;position:relative;width:100%;padding:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#0a2752;cursor:zoom-in}
.bpmain img{width:100%;height:auto;display:block}
.bpzoom{position:absolute;right:12px;bottom:12px;background:rgba(5,15,35,.75);color:#ffd27a;font:600 .8rem/1 system-ui;letter-spacing:.06em;padding:.5rem .7rem;border-radius:99px;border:1px solid rgba(255,210,122,.4)}
.bp button{padding:0;cursor:zoom-in;color:inherit;text-align:left;font:inherit}
.zbox{position:fixed;inset:0;z-index:200;background:rgba(3,8,18,.96);display:flex;flex-direction:column}
.zbox[hidden]{display:none}
.zstage{flex:1;position:relative;overflow:hidden;touch-action:none;cursor:grab}
.zstage:active{cursor:grabbing}
.zstage img{position:absolute;left:0;top:0;transform-origin:0 0;max-width:none;user-select:none;-webkit-user-drag:none;image-rendering:auto}
.zbar{display:flex;gap:.5rem;align-items:center;padding:.6rem .9rem;border-top:1px solid rgba(255,255,255,.1);color:#cfe3ff;font:500 .9rem/1 system-ui;flex-wrap:wrap}
.zbar span{flex:1;min-width:8rem}
.zbar button,.zbar a{background:#13284a;color:#eaf3ff;border:1px solid #2c4c80;border-radius:8px;padding:.5rem .8rem;font:600 .9rem/1 system-ui;text-decoration:none;cursor:pointer}
/* ---- painted illustrations (v3) ---- */
#forest .scene{position:absolute;inset:0;overflow:hidden;background:#0b1018}
#forest .scene picture,#forest .scene img{position:absolute;inset:0;width:100%;height:100%}
#forest .scene img{object-fit:cover;object-position:46% 55%;transform-origin:50% 60%;will-change:transform}
#forest .night{position:absolute;inset:0;background:linear-gradient(180deg,#050a18 0%,#0b1430 55%,#141a33 100%);mix-blend-mode:multiply;pointer-events:none}
#forest .heroshade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,8,14,.55) 0%,rgba(5,8,14,0) 35%,rgba(5,8,14,0) 65%,rgba(5,8,14,.6) 100%);pointer-events:none}
#forest .glowcol{position:absolute;left:58%;top:12%;width:12%;height:46%;opacity:0;background:radial-gradient(ellipse at 50% 50%,rgba(255,246,218,.55) 0%,rgba(255,246,218,.12) 45%,rgba(255,246,218,0) 70%);filter:blur(6px);pointer-events:none}
.artnote{position:absolute;right:12px;bottom:10px;z-index:3;font:500 .68rem/1.3 system-ui,sans-serif;letter-spacing:.04em;color:rgba(255,246,223,.82);background:rgba(5,8,14,.45);padding:.3rem .55rem;border-radius:6px;max-width:min(92vw,520px);text-align:right;pointer-events:none}
figure.art{margin:0;position:relative}
figure.art picture{display:block;overflow:hidden;border-radius:14px;border:1px solid var(--line);box-shadow:0 30px 70px -30px rgba(0,0,0,.8)}
figure.art img{display:block;width:100%;height:auto;transform-origin:50% 50%}
figure.art figcaption{font-size:.78rem;line-height:1.45;color:var(--muted);margin-top:.6rem}
figure.art figcaption::before{content:"";display:inline-block;width:.55rem;height:.55rem;border-radius:50%;background:#e9c46a;margin-right:.45rem;vertical-align:.05rem}
figure.art.wide{margin:2.2rem 0 1.4rem}
@media (max-aspect-ratio:1/1){#forest .scene img{object-position:43% 55%;transform-origin:43% 60%}#forest .glowcol{left:62%;width:30%}}