:root, [data-theme="dark"]{
  --paper:#e6e2d6;
  --paper-rgb:230,226,214;
  --paper-2:#dcd7c9;
  --paper-2-rgb:220,215,201;
  --paper-deep:#d8d3c4;
  --paper-deep-rgb:216,211,196;
  --ink:#23231f;
  --ink-rgb:35,35,31;
  --soft:#6e6b62;
  --mist:rgba(var(--paper-rgb), .82);
  --moss:#6b7559;
  --moss-rgb:107,117,89;
  --soil:#6b5344;
  --soil-rgb:107,83,68;
  --root:#4a3b30;
  --root-rgb:74,59,48;
  --ochre:#a65e2e;
  --ochre-rgb:166,94,46;
  --lake:#3e6b6b;
  --sun:#b89b5c;
  --sun-rgb:184,155,92;
}

[data-theme="bright"]{
  --paper:#fef9ed;
  --paper-rgb:254,249,237;
  --paper-2:#f5efd8;
  --paper-2-rgb:245,239,216;
  --paper-deep:#ebe2c0;
  --paper-deep-rgb:235,226,192;
  --ink:#3b2314;
  --ink-rgb:59,35,20;
  --soft:#8b7a5e;
  --mist:rgba(254,249,237,.82);
  --moss:#7a9b6b;
  --moss-rgb:122,155,107;
  --soil:#c4a06b;
  --soil-rgb:196,160,107;
  --root:#b8860b;
  --root-rgb:184,134,11;
  --ochre:#c87830;
  --ochre-rgb:200,120,48;
  --lake:#3da5a5;
  --sun:#d4a420;
  --sun-rgb:212,164,32;
}
*{box-sizing:border-box}

/* Custom scrollbar — ink/paper theme */
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(var(--ink-rgb),.22);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:rgba(var(--ink-rgb),.38)}
html{scrollbar-width:thin;scrollbar-color:rgba(var(--ink-rgb),.22) transparent}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Noto Serif SC", Georgia, "Songti SC", SimSun, serif;overflow-x:hidden;transition:background .5s ease,color .5s ease}
button,a{font:inherit;color:inherit}
button{cursor:pointer}
.paper-noise{position:fixed;inset:0;pointer-events:none;z-index:100;opacity:.07;mix-blend-mode:multiply;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='.78' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.38'/%3E%3C/svg%3E")}
.site-header{position:fixed;top:0;left:0;right:0;z-index:80;display:flex;justify-content:space-between;align-items:center;padding:16px 3.3vw;border-bottom:1px solid rgba(var(--ink-rgb), .14);background:rgba(var(--paper-rgb), .72);backdrop-filter:blur(12px)}
.wordmark-wrap{display:flex;flex-direction:column;gap:3px}
.wordmark{text-decoration:none;font-family:"Cormorant Garamond", Georgia, serif;font-style:italic;font-size:19px;letter-spacing:.02em;line-height:1}
.wordmark-sub{font-family:"Source Code Pro","Courier New",monospace;font-size:9px;letter-spacing:.11em;text-transform:uppercase;color:var(--soft);opacity:.78}
.site-header nav{display:flex;gap:22px;align-items:center}.site-header nav a,.text-button{border:0;background:none;text-decoration:none;font-family:"Source Code Pro","Courier New",monospace;font-size:10px;text-transform:uppercase;letter-spacing:.12em;opacity:.64}.site-header nav a:hover,.text-button:hover{opacity:1}
.world{position:relative;height:100vh;overflow:hidden;background:linear-gradient(to bottom,var(--paper) 0 13%,var(--paper-2) 13% 42%,var(--paper) 42% 72%,var(--paper-deep) 72% 100%)}
#myceliumCanvas,#sketchCanvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}#myceliumCanvas{z-index:8}#sketchCanvas{z-index:4}
.world-copy{position:absolute;z-index:25;left:5vw;top:13vh;max-width:540px}.kicker{font-family:"Source Code Pro","Courier New",monospace;font-size:10px;letter-spacing:.2em;color:var(--soft);margin:0 0 16px}.world h1{font-family:"Cormorant Garamond",Georgia,serif;font-weight:400;font-style:italic;font-size:clamp(28px,3.6vw,48px);line-height:.98;margin:0}.lede{margin-top:28px;color:var(--soft);font-size:14px;line-height:1.6}.reveal-sequence>*{opacity:0;transform:translateY(10px);animation:emerge 1.1s forwards}.reveal-sequence>*:nth-child(1){animation-delay:1.2s}.reveal-sequence>*:nth-child(2){animation-delay:2.1s}.reveal-sequence>*:nth-child(3){animation-delay:3.2s}@keyframes emerge{to{opacity:1;transform:none}}
.layer-label::after{content:attr(data-label);position:absolute;right:2vw;top:10px;font-size:10px;letter-spacing:.2em;opacity:.34}.cosmos-layer{position:absolute;inset:64px 0 auto;height:18%;border-bottom:1px dashed rgba(var(--ink-rgb), .14)}.sky-layer{position:absolute;top:22%;left:0;right:0;height:29%;border-bottom:1px dashed rgba(var(--ink-rgb), .14)}.surface-layer{position:absolute;top:50%;left:0;right:0;height:25%;border-bottom:1px dashed rgba(var(--ink-rgb), .18)}.soil-layer{position:absolute;left:0;right:0;bottom:0;height:25%}
.moon{position:absolute;right:10vw;top:11vh;width:76px;height:76px;border:2px solid var(--ink);border-radius:50%;opacity:.7}.moon:after{content:"";position:absolute;inset:-5px 13px 8px -8px;border-radius:50%;background:var(--paper)}.stars{position:absolute;inset:6% 0 auto;height:16%;opacity:.55;background-image:radial-gradient(circle,var(--ink) 0 1px,transparent 1.5px);background-size:97px 73px}
.cloud{position:absolute;border:2px solid rgba(var(--ink-rgb), .42);border-radius:50%;filter:blur(.1px)}.cloud:before,.cloud:after{content:"";position:absolute;border:inherit;border-radius:inherit;background:inherit}.cloud-a{width:110px;height:30px;left:60%;top:38%}.cloud-a:before{width:42px;height:40px;left:14px;top:-21px}.cloud-a:after{width:55px;height:46px;left:45px;top:-24px}.cloud-b{width:85px;height:25px;left:23%;top:56%;opacity:.45}.cloud-b:before{width:34px;height:31px;left:12px;top:-18px}.cloud-b:after{width:42px;height:36px;left:36px;top:-19px}
.mountain-range{position:absolute;z-index:3;left:0;right:0;top:34%;height:28%}.mountain-range svg{width:100%;height:100%;overflow:visible}.sketch-line,.hatch{fill:none;stroke:var(--ink);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.sketch-line.faint{opacity:.25;stroke-width:1.5}.hatch{opacity:.35;stroke-width:1.3}
.prayer-flags{position:absolute;right:12vw;top:42%;width:190px;height:90px;border:0;background:transparent;transform:rotate(-5deg)}.prayer-flags:before{content:"";position:absolute;left:0;right:0;top:18px;border-top:2px solid var(--ink)}.prayer-flags span{display:block;position:absolute;top:20px;width:25px;height:34px;border:1.5px solid var(--ink);clip-path:polygon(0 0,100% 0,84% 100%,14% 100%);transform-origin:top center;animation:flag 2.8s ease-in-out infinite}.prayer-flags span:nth-child(1){left:12px}.prayer-flags span:nth-child(2){left:45px;animation-delay:-.4s}.prayer-flags span:nth-child(3){left:79px;animation-delay:-.9s}.prayer-flags span:nth-child(4){left:113px;animation-delay:-1.5s}.prayer-flags span:nth-child(5){left:147px;animation-delay:-2s}@keyframes flag{50%{transform:skewY(8deg) rotate(3deg)}}
.hotspot{border:0;background:transparent}.temple{position:absolute;z-index:10;left:66%;bottom:18%;width:128px;height:120px}.temple-body{position:absolute;left:28px;bottom:0;width:72px;height:64px;border:3px solid var(--ink);background:rgba(var(--paper-rgb), .68)}.temple-body:before,.temple-body:after{content:"";position:absolute;bottom:0;width:12px;height:36px;border:2px solid var(--ink)}.temple-body:before{left:11px}.temple-body:after{right:11px}.temple-roof{position:absolute;left:10px;width:108px;height:20px;border:3px solid var(--ink);transform:skewX(-18deg);background:var(--paper)}.roof-1{bottom:62px}.roof-2{bottom:89px;left:22px;width:84px}.media-whisper{position:absolute;left:108px;bottom:21px;font-size:9px;letter-spacing:.1em;opacity:.45;transform:rotate(90deg)}.photo-breath{animation:breathe 4.8s ease-in-out infinite}@keyframes breathe{50%{opacity:.54;filter:blur(.6px)}}
.stone{position:absolute;z-index:9;left:39%;bottom:9%;width:92px;height:62px;border:3px solid var(--ink);border-radius:53% 46% 38% 44%;transform:rotate(-7deg);background:rgba(var(--paper-2-rgb), .55)}.stone:before{content:"";position:absolute;width:35px;border-top:2px solid var(--ink);left:12px;top:22px;transform:rotate(14deg)}.moss{position:absolute;inset:7px 15px auto 20px;height:18px;opacity:0;transition:opacity 1.8s;background:radial-gradient(ellipse at center,var(--moss) 0 42%,transparent 48%);filter:url(#rough)}.stone.mossed .moss{opacity:.75}
.grass{position:absolute;inset:auto 0 0;height:66%;opacity:.42;background-image:repeating-linear-gradient(82deg,transparent 0 17px,rgba(var(--ink-rgb), .5) 18px 19px,transparent 20px 30px);transform-origin:bottom;animation:grassWind 12s ease-in-out infinite}@keyframes grassWind{50%{transform:skewX(2.5deg) translateX(5px)}}
.animal-lane{position:absolute;z-index:14;left:0;right:0;bottom:14%;height:100px;pointer-events:none}.animal{position:absolute;left:-130px;bottom:0;width:110px;height:64px;animation:cross var(--duration) linear forwards}.animal.reverse{left:auto;right:-130px;transform:scaleX(-1);animation-name:crossReverse}.animal-body{position:absolute;left:17px;bottom:13px;width:73px;height:37px;border:3px solid var(--ink);border-radius:50%}.animal-head{position:absolute;right:2px;bottom:21px;width:28px;height:25px;border:3px solid var(--ink);border-radius:48%}.animal-leg{position:absolute;bottom:0;width:3px;height:19px;background:var(--ink)}.leg-a{left:31px}.leg-b{left:74px}.animal-horn{position:absolute;right:-4px;bottom:43px;width:17px;height:13px;border-top:2px solid var(--ink);border-radius:50%;transform:rotate(-20deg)}.animal-label{position:absolute;left:25px;bottom:-15px;font-size:9px;letter-spacing:.1em}.animal.sheep .animal-body{border-style:dashed}.animal.horse .animal-head{bottom:28px}.animal.horse:before{content:"";position:absolute;right:19px;bottom:43px;width:3px;height:21px;background:var(--ink);transform:rotate(-24deg)}@keyframes cross{to{left:calc(100% + 130px)}}@keyframes crossReverse{to{right:calc(100% + 130px)}}
.pika-hole{position:absolute;z-index:16;left:23%;bottom:5%;width:80px;height:54px}.hole{position:absolute;left:0;right:0;bottom:0;height:18px;border-radius:50%;background:var(--ink);opacity:.68}.pika{position:absolute;left:25px;bottom:7px;width:28px;height:25px;border:2px solid var(--ink);border-radius:50%;background:var(--paper-2);transform:translateY(26px);transition:.5s}.pika:before,.pika:after{content:"";position:absolute;top:-8px;width:9px;height:10px;border:2px solid var(--ink);border-radius:50%;background:var(--paper-2)}.pika:before{left:1px}.pika:after{right:1px}.pika.show{transform:translateY(0)}
/* Wind and water hand-drawn elements */
.wind-breath{position:absolute;z-index:10;right:5vw;top:20%;width:180px;height:48px;border:0;background:none;cursor:pointer;opacity:.45;transition:opacity .4s ease}
.wind-breath:hover{opacity:.75}
.wind-breath svg{width:100%;height:100%;overflow:visible}
.wind-line{fill:none;stroke:var(--ink);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;animation:windBreath 5s ease-in-out infinite}
.wind-line-2{animation-delay:-1.6s;opacity:.6}
.wind-line-3{animation-delay:-3.2s;opacity:.4}
@keyframes windBreath{50%{transform:translateX(-6px) translateY(-3px)}}

.water-stream{position:absolute;z-index:12;left:3%;bottom:22%;width:240px;height:60px;border:0;background:none;cursor:pointer;opacity:.5;transition:opacity .4s ease}
.water-stream:hover{opacity:.78}
.water-stream svg{width:100%;height:100%;overflow:visible}
.stream-edge{fill:rgba(var(--paper-rgb), .28);stroke:var(--ink);stroke-width:1.4;vector-effect:non-scaling-stroke}
.stream-line{fill:none;stroke:var(--ink);stroke-width:.8;stroke-linecap:round;vector-effect:non-scaling-stroke;opacity:.55;animation:streamFlow 4.5s ease-in-out infinite}
.stream-line-2{animation-delay:-2.2s;opacity:.4}
@keyframes streamFlow{50%{transform:translateX(3px)}}

/* Grass clickable zone — keep behind all hotspots */
.grass-click{position:absolute;z-index:5;inset:auto 0 0;height:50%;border:0;background:transparent;cursor:pointer}

/* Sky clickable zone */
.sky-note{position:absolute;z-index:15;inset:0 30% 16% 8%;border:0;background:transparent;cursor:pointer}

@media(max-width:850px){
  .wind-breath{right:2vw;width:120px;top:22%}
  .water-stream{left:1%;width:170px;bottom:24%}
}
.root-drawing{position:absolute;inset:0;width:100%;height:100%}.root-drawing path,.root-drawing circle{fill:none;stroke:rgba(var(--ink-rgb), .5);stroke-width:2;stroke-linecap:round}.root-drawing circle{stroke-dasharray:3 4}.underground-instruction{position:absolute;left:5vw;bottom:4vh;font-size:11px;letter-spacing:.08em;color:var(--soft)}
.vulture-zone{position:absolute;z-index:22;right:0;top:8%;width:40%;height:30%}.vulture{position:absolute;z-index:23;left:-10%;top:20%;font-size:62px;font-family:"Cormorant Garamond",Georgia,serif;opacity:0;transform:rotate(-15deg);pointer-events:none}.vulture.fly{opacity:1;animation:vultureFlight 7s ease-in-out forwards}.vulture.fly.reverse{animation-name:vultureFlightReverse}@keyframes vultureFlight{0%{left:-10%;top:24%;transform:rotate(-12deg) scale(.7)}50%{top:8%;transform:rotate(8deg) scale(1.1)}100%{left:110%;top:22%;transform:rotate(-5deg) scale(.8)}}@keyframes vultureFlightReverse{0%{left:110%;top:22%;transform:scaleX(-1) rotate(-12deg) scale(.8)}50%{top:8%;transform:scaleX(-1) rotate(8deg) scale(1.1)}100%{left:-10%;top:24%;transform:scaleX(-1) rotate(-5deg) scale(.7)}}
.scroll-cue{position:absolute;z-index:30;left:50%;bottom:19px;transform:translateX(-50%);font-size:11px;letter-spacing:.1em;text-decoration:none;text-transform:uppercase}.scroll-cue span{display:inline-block;animation:bob 1.5s infinite}@keyframes bob{50%{transform:translateY(5px)}}
.atlas-section{min-height:100vh;padding:60px 5vw 40px;background:var(--paper-2);border-top:1px solid rgba(var(--ink-rgb), .18)}.section-heading{max-width:850px;margin-bottom:20px}.section-heading h2{font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(26px,3.4vw,44px);line-height:1.05;font-weight:400;margin:0}.atlas-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,.7fr);gap:50px;align-items:start}.map-wrap{position:relative}.tibet-map{width:100%;height:auto;overflow:visible}.map-boundary{fill:var(--paper);stroke:var(--ink);stroke-width:2.2;stroke-linejoin:round;opacity:.85}
.map-point circle{fill:var(--paper);stroke:var(--ink);stroke-width:2.6;transition:.25s}
.map-point text{font-family:"Source Code Pro","Courier New",monospace;font-size:11px;letter-spacing:.06em}
.map-point{cursor:pointer;outline:none}.map-point:focus{outline:none}
.map-point:hover circle,.map-point.active circle{fill:var(--ink);stroke:var(--paper)}
.map-point:hover text,.map-point.active text{font-style:italic;fill:var(--ink)}.map-help{font-size:11px;color:var(--soft);letter-spacing:.06em}.place-card{position:sticky;top:70px;max-height:calc(100vh - 110px);min-height:460px;border:2px solid var(--ink);padding:0;background:rgba(var(--paper-rgb), .97);box-shadow:10px 12px 0 rgba(var(--ink-rgb), .08);display:flex;flex-direction:column}.card-close,.panel-close{position:absolute;right:16px;top:10px;border:0;background:none;font-size:28px;z-index:2}.card-index,.panel-index{font-size:10px;letter-spacing:.18em;color:var(--soft)}.place-card h3,.field-panel h2{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:42px;font-weight:400;margin:14px 0 5px}.place-meta{font-size:11px;color:var(--soft);margin-bottom:12px}.place-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px}.place-tag{font-family:"Source Code Pro","Courier New",monospace;font-size:9px;letter-spacing:.08em;text-transform:uppercase;padding:4px 8px;border:1px solid rgba(var(--ink-rgb), .25);color:var(--soft)}.place-card-fixed{padding:28px 28px 0 28px;flex-shrink:0}.place-card-scroll{flex:1;overflow-y:auto;padding:0 28px 28px 28px}.place-card-scroll::-webkit-scrollbar{width:5px}.place-card-scroll::-webkit-scrollbar-thumb{background:rgba(var(--ink-rgb),.22);border-radius:3px}.place-card-scroll{scrollbar-width:thin;scrollbar-color:rgba(var(--ink-rgb),.22) transparent}
.place-section-title{font-family:"Source Code Pro","Courier New",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--soft);margin:26px 0 8px}.place-feelings{font-style:italic;color:var(--soft)}.place-ethnography{font-size:15px;color:var(--ink)}.place-media,.panel-media{position:relative;margin-bottom:10px}

/* Media carousel */
.media-carousel{position:relative;width:100%;overflow:hidden;border:1px solid rgba(var(--ink-rgb), .18);background:rgba(var(--ink-rgb), .03)}
.carousel-track{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:3/2;transition:height .3s ease}
.carousel-slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s ease;filter:contrast(1.05);cursor:zoom-in}
.carousel-slide.active{opacity:1;z-index:2}
.carousel-slide:hover{filter:contrast(1.08)}

.carousel-arrow{position:absolute;top:50%;z-index:10;transform:translateY(-50%);width:38px;height:38px;border:0;border-radius:50%;background:rgba(var(--paper-rgb), .88);color:var(--ink);font-size:26px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:2px 3px 0 rgba(var(--ink-rgb), .12);transition:background .2s ease,transform .2s ease}
.carousel-arrow:hover{background:var(--paper);transform:translateY(-50%) scale(1.08)}
.carousel-arrow span{margin-top:-3px}
.carousel-prev{left:10px}
.carousel-next{right:10px}

.carousel-dots{position:absolute;bottom:10px;left:50%;z-index:10;transform:translateX(-50%);display:flex;gap:7px;padding:5px 10px;background:rgba(var(--paper-rgb), .72);border-radius:14px}
.carousel-dot{width:8px;height:8px;border:0;border-radius:50%;background:rgba(var(--ink-rgb), .28);cursor:pointer;transition:background .2s ease,transform .2s ease}
.carousel-dot.active{background:var(--ink);transform:scale(1.25)}
.carousel-dot:hover{background:var(--ochre)}

.place-media img:not(.carousel-slide),.panel-media img:not(.carousel-slide){width:100%;display:block;filter:contrast(1.05);cursor:zoom-in;transition:transform .25s ease}
.place-media video,.panel-media video{width:100%;max-height:340px;display:block;background:#000;border-radius:3px;object-fit:contain}.media-video-wrapper{position:relative;margin-bottom:4px}
.place-media audio,.panel-media audio{width:100%}

.media-placeholder{height:210px;border:1px dashed rgba(var(--ink-rgb), .55);display:grid;place-items:center;font-size:10px;letter-spacing:.12em;background:repeating-linear-gradient(-45deg,transparent 0 11px,rgba(var(--ink-rgb), .035) 12px 13px)}

/* Lightbox for zoomed images */
.lightbox{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;justify-content:center;align-items:center;background:rgba(var(--ink-rgb), .92);opacity:0;pointer-events:none;transition:opacity .35s ease}
.lightbox.open{opacity:1;pointer-events:auto}
.lightbox img{max-width:90vw;max-height:80vh;object-fit:contain;cursor:zoom-out}
.lightbox-close{position:absolute;top:22px;right:28px;border:0;background:none;color:var(--paper);font-size:42px;cursor:pointer;opacity:.7}
.lightbox-close:hover{opacity:1}
.lightbox-caption{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);color:var(--paper);font-family:"Source Code Pro","Courier New",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;opacity:.7}

@media(max-width:850px){
  .place-media img:not(.carousel-slide),.panel-media img:not(.carousel-slide){max-width:78vw}
  .carousel-arrow{width:32px;height:32px;font-size:20px}
  .lightbox img{max-width:94vw;max-height:76vh}
}
.field-panel{position:fixed;z-index:90;right:24px;top:82px;bottom:24px;width:min(460px,calc(100vw - 48px));overflow:auto;padding:34px;background:rgba(var(--paper-rgb), .96);border:2px solid var(--ink);box-shadow:13px 15px 0 rgba(var(--ink-rgb), .12);transform:translateX(calc(100% + 50px));transition:.55s cubic-bezier(.2,.8,.2,1)}.field-panel.open{transform:none}.panel-text{font-family:"Noto Serif SC",Georgia,serif;font-size:17px;line-height:1.7}.field-panel blockquote{margin:26px 0;padding:18px 0 0;border-top:1px solid var(--ink);font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;line-height:1.55}.connections{display:flex;flex-wrap:wrap;gap:8px}.connections button{background:none;border:1px solid var(--ink);padding:7px 10px;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.connections button:hover{background:var(--ink);color:var(--paper)}
.toast{position:fixed;z-index:110;left:50%;bottom:28px;transform:translate(-50%,15px);opacity:0;background:var(--ink);color:var(--paper);padding:10px 15px;font-size:11px;letter-spacing:.07em;transition:.4s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}footer{min-height:220px;display:grid;place-items:center;border-top:1px solid rgba(var(--ink-rgb), .14);font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;color:var(--soft)}
@media(max-width:850px){.site-header{padding:16px 18px}.site-header nav{gap:12px}.world{height:100vh}.world-copy{top:12vh}.world h1{font-size:49px}.mountain-range{top:38%}.temple{left:61%;transform:scale(.78)}.atlas-layout{grid-template-columns:1fr}.place-card{position:relative;top:auto}.atlas-section{min-height:100vh;padding:55px 20px 40px}.field-panel{inset:74px 12px 12px;width:auto}.layer-label:after{display:none}.scroll-cue{width:100%;text-align:center}.animal{transform:scale(.8)}.animal.reverse{transform:scaleX(-1) scale(.8)}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}

/* Revision: mycelium remains strictly below the horizon. */
#myceliumCanvas{
  top:auto;
  bottom:0;
  height:28%;
  clip-path:inset(0);
  z-index:8;
}

/* Revision: slower, more legible hand-drawn animals. */
.animal-lane{height:132px;bottom:13%}
.animal{
  left:-220px;
  width:190px;
  height:105px;
  opacity:.88;
  animation-timing-function:linear;
}
.animal.reverse{right:-220px}
.animal svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(1px 2px 0 rgba(var(--ink-rgb), .08))}
.animal svg path,.animal svg circle{
  fill:none;
  stroke:var(--ink);
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
}
.animal svg .animal-fill{fill:rgba(var(--paper-2-rgb), .5)}
.animal svg .wool{fill:rgba(var(--paper-rgb), .82);stroke-dasharray:2.5 2}
.animal svg .fur,.animal svg .mane{stroke-width:1.35}
@keyframes cross{to{left:calc(100% + 220px)}}
@keyframes crossReverse{to{right:calc(100% + 220px)}}

/* Revision: recognizable vulture silhouette and slower flight. */
.vulture{width:180px;height:80px;font-size:0;left:-190px;top:20%;opacity:0}
.vulture svg{width:100%;height:100%;overflow:visible}
.vulture path,.vulture circle{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.vulture .bird-body{fill:rgba(var(--paper-2-rgb), .68)}
.vulture .bird-eye{fill:var(--ink);stroke:none}
.vulture.fly{animation:vultureFlight 13s ease-in-out forwards}
@keyframes vultureFlight{
  0%{left:-190px;top:24%;transform:rotate(-8deg) scale(.78)}
  30%{top:13%;transform:rotate(2deg) scale(.93)}
  65%{top:10%;transform:rotate(6deg) scale(1.04)}
  100%{left:calc(100% + 190px);top:20%;transform:rotate(-3deg) scale(.84)}
}
@keyframes vultureFlightReverse{
  0%{left:calc(100% + 190px);top:20%;transform:rotate(-3deg) scale(.84) scaleX(-1)}
  30%{top:13%;transform:rotate(2deg) scale(.93) scaleX(-1)}
  65%{top:10%;transform:rotate(6deg) scale(1.04) scaleX(-1)}
  100%{left:-190px;top:24%;transform:rotate(-8deg) scale(.78) scaleX(-1)}
}
.vulture.reverse{transform:scaleX(-1)}
.vulture.reverse.fly{animation-name:vultureFlightReverse}
@media(max-width:850px){
  .animal{width:150px;height:83px}
  .animal.reverse{transform:scaleX(-1)}
  .vulture{width:145px;height:65px}
}

/* 2026-07 redesign: one coherent ethnographic pencil language. */
#sketchCanvas{display:none}
.hotspot svg{overflow:visible}
.hotspot svg path,.hotspot svg circle,.hotspot svg ellipse{
  vector-effect:non-scaling-stroke;
  stroke:var(--ink);
  stroke-linecap:round;
  stroke-linejoin:round;
  fill:none;
}

/* Hand-drawn prayer flags: no geometric placeholder bars. */
.prayer-flags{right:7vw;top:24%;width:270px;height:120px;transform:rotate(-3deg)}
.prayer-flags:before{display:none}
.prayer-flags svg{width:100%;height:100%;filter:drop-shadow(1px 2px 0 rgba(var(--ink-rgb), .06))}
.prayer-flags .flag-rope{stroke-width:2.4}
.prayer-flags .flag{transform-box:fill-box;transform-origin:50% 0;animation:flagPencil 6.8s ease-in-out infinite}
.prayer-flags .flag path:first-child{fill:rgba(var(--paper-rgb), .48);stroke-width:1.45}
.prayer-flags .flag-mark{stroke-width:.72;opacity:.46}
.prayer-flags .flag-2{animation-delay:-1.4s}.prayer-flags .flag-3{animation-delay:-2.8s}.prayer-flags .flag-4{animation-delay:-4.1s}.prayer-flags .flag-5{animation-delay:-5.2s}
@keyframes flagPencil{0%,100%{transform:rotate(-1deg) skewX(0)}50%{transform:rotate(3deg) skewX(4deg)}}

/* A real line-drawn monastery, breathing like a photograph. */
.temple{left:67%;bottom:7%;width:210px;height:150px;border:0;background:none;transform:none}
.temple span:not(.media-whisper){display:none}
.temple svg{width:100%;height:100%}
.temple svg path{stroke-width:1.65;fill:rgba(var(--paper-rgb), .22)}
.temple .temple-ground{stroke-width:1;opacity:.55}
.temple .temple-hatch{stroke-width:.8;opacity:.42}
.temple:hover svg{filter:drop-shadow(4px 6px 0 rgba(var(--ink-rgb), .08))}
.media-whisper{position:absolute;right:4px;bottom:2px;font-size:8px;letter-spacing:.14em;text-transform:uppercase;opacity:.45}

/* Mani stone replaces the blurry oval placeholder. */
.stone{left:41%;bottom:8%;width:135px;height:95px;border:0;border-radius:0;background:none;transform:rotate(-3deg)}
.stone:before{display:none}
.stone svg{width:100%;height:100%}
.stone .stone-shape{fill:rgba(var(--paper-2-rgb), .58);stroke-width:2}
.stone .stone-crack{stroke-width:.9;opacity:.58}
.stone .stone-script{stroke-width:1.05;opacity:.72}
.stone .moss{opacity:0;transition:opacity 3.5s;filter:none}
.stone .moss path,.stone .moss circle{stroke:var(--moss);fill:none;stroke-width:1.25}
.stone .moss circle{fill:var(--moss);stroke:none}
.stone.mossed .moss{opacity:.8}

/* Recognisable hand-drawn pika emerging from the burrow. */
.pika-hole{left:22%;bottom:2%;width:120px;height:90px;border:0;background:none}
.pika-hole .pika-drawing{width:100%;height:100%;overflow:visible}
.pika-hole .hole{fill:rgba(var(--ink-rgb), .68);stroke:none}
.pika-hole .pika{transform:translateY(38px);opacity:0;transition:transform 1s ease,opacity .8s ease;transform-origin:center}
.pika-hole .pika path{fill:rgba(var(--paper-2-rgb), .92);stroke-width:1.55}
.pika-hole .pika circle{fill:var(--ink);stroke:none}
.pika-hole .pika .pika-fur{fill:none;stroke-width:.75;opacity:.55}
.pika-hole .pika.show{transform:translateY(0);opacity:1}

/* Animals feel like slow field-sketches, not icons. */
.animal{opacity:.78}
.animal svg path,.animal svg circle{stroke-width:1.65}
.animal svg .fur,.animal svg .mane{stroke-width:.8;opacity:.75}
.animal svg .animal-fill{fill:rgba(var(--paper-rgb), .30)}
.animal svg .wool{fill:rgba(var(--paper-rgb), .48);stroke-dasharray:1.5 2.5}

/* Vulture gets pencil texture and calmer motion. */
.vulture path,.vulture circle{stroke-width:1.65}
.vulture .bird-wing{stroke-dasharray:1 1.5}
.vulture.fly{animation-duration:26s}

/* Keep the underground visually quiet: roots + restrained mycelium only. */
.soil-layer{background:linear-gradient(to bottom,rgba(var(--paper-deep-rgb), .25),rgba(var(--paper-deep-rgb), .55))}
.root-drawing{opacity:.34}
#myceliumCanvas{opacity:.62}
.grass{opacity:.28;background-size:auto}

@media(max-width:850px){
  .prayer-flags{right:2vw;width:190px;top:28%}
  .temple{left:61%;width:155px;height:115px}
  .stone{left:43%;width:100px;height:72px}
  .pika-hole{left:13%;width:95px}
}


/* Added field elements: people, forest and lake reuse the existing note panel. */
.forest,.lake,.person{position:absolute;z-index:12;border:0;background:none;padding:0}
.forest svg,.lake svg,.person svg{width:100%;height:100%;overflow:visible}
.forest svg path,.forest svg circle,.lake svg path,.person svg path,.person svg circle{fill:none;stroke:var(--ink);stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.forest{left:5%;bottom:10%;width:190px;height:125px}
.forest svg path{stroke-width:1.45}.forest .forest-ground{stroke-width:1;opacity:.55}.forest .forest-hatch{stroke-width:.65;opacity:.42}
.lake{left:27%;bottom:3%;width:220px;height:90px}
.lake .lake-edge{fill:rgba(var(--paper-rgb), .2);stroke-width:1.55}.lake .lake-line{stroke-width:.8;opacity:.55}
.person{right:27%;bottom:4%;width:67px;height:112px}
.person svg path,.person svg circle{stroke-width:1.6}.person .person-cloth{stroke-width:.72;opacity:.56}
.landscape-label{position:absolute;left:50%;bottom:-7px;transform:translateX(-50%);font-size:9px;letter-spacing:.12em;text-transform:uppercase;background:rgba(var(--paper-rgb), .72);padding:2px 4px;white-space:nowrap}
.forest:hover,.lake:hover,.person:hover{filter:drop-shadow(3px 4px 0 rgba(var(--ink-rgb), .08))}

/* Prayer flags now move visibly and open the Faith note. */
.prayer-flags .flag{animation-duration:6s}
.prayer-flags .flag-2{animation-delay:-.35s}.prayer-flags .flag-3{animation-delay:-.8s}.prayer-flags .flag-4{animation-delay:-1.2s}.prayer-flags .flag-5{animation-delay:-1.65s}
@keyframes flagPencil{
  0%,100%{transform:rotate(-8deg) skewX(-7deg) scaleY(.96)}
  28%{transform:rotate(10deg) skewX(13deg) scaleY(1.08)}
  58%{transform:rotate(-4deg) skewX(-12deg) scaleY(.92)}
  78%{transform:rotate(13deg) skewX(9deg) scaleY(1.05)}
}

/* Moving animals keep their names visible and are individually clickable. */
.animal-lane{pointer-events:none}
.animal{pointer-events:auto;border:0;background:transparent;padding:0;cursor:pointer;color:inherit}
.animal-label{left:50%;bottom:-9px;transform:translateX(-50%);background:rgba(var(--paper-rgb), .78);padding:2px 5px;white-space:nowrap;font-size:9px;letter-spacing:.12em;text-transform:uppercase}
.animal.reverse .animal-label{transform:translateX(-50%) scaleX(-1)}
.animal:hover svg{filter:drop-shadow(3px 4px 0 rgba(var(--ink-rgb), .12))}

@media(max-width:850px){
  .forest{left:1%;width:135px;height:92px}
  .lake{left:28%;width:150px;height:68px}
  .person{right:24%;width:50px;height:88px}
}


/* Interaction fix: prayer flags sit above the sky trigger; one clickable vulture at a time. */
.prayer-flags{z-index:30;pointer-events:auto}
.vulture-zone{z-index:20}
.vulture-zone:disabled{cursor:default;pointer-events:none}
.vulture{
  border:0;
  background:transparent;
  padding:0;
  pointer-events:none;
  cursor:pointer;
}
.vulture.fly{pointer-events:auto}
.vulture-label{
  position:absolute;
  left:50%;
  top:calc(100% + 3px);
  transform:translateX(-50%);
  font-size:9px;
  line-height:1;
  letter-spacing:.12em;
  text-transform:lowercase;
  white-space:nowrap;
  font-family:"Source Code Pro","Courier New",monospace;
}


/* Final composition refinement: preserve all interactions while separating text and figures. */
.world-copy{
  left:4.2vw;
  top:9.5vh;
  max-width:430px;
}
.world h1{
  font-size:clamp(28px,3.6vw,48px);
  line-height:.98;
}
.world-copy .lede{
  max-width:300px;
}

/* Move the encountered person away from the monastery. */
.person{
  right:5.5%;
  bottom:4%;
}

/* A quiet sky instruction; it disappears while the vulture is in flight. */
.sky-hint{
  position:absolute;
  z-index:24;
  left:50%;
  top:9%;
  transform:translateX(-50%);
  margin:0;
  padding:5px 9px;
  background:rgba(var(--paper-rgb), .72);
  font-size:9px;
  line-height:1.2;
  letter-spacing:.13em;
  text-transform:uppercase;
  white-space:nowrap;
  opacity:.56;
  pointer-events:none;
  transition:opacity .45s ease, transform .45s ease;
}
.sky-hint.is-hidden{
  opacity:0;
  transform:translate(-50%,-5px);
}

@media(max-width:850px){
  .world-copy{
    left:18px;
    top:9.5vh;
    max-width:320px;
  }
  .world h1{font-size:28px}
  .person{
    right:2%;
    width:48px;
    height:84px;
  }
  .sky-hint{
    top:12%;
    left:52%;
    font-size:8px;
    letter-spacing:.08em;
  }
}

/* Final requested adjustment: moving animals sit in front of landscape scenery. */
.animal-lane{z-index:32}
.animal svg .animal-fill{fill:var(--paper-2)}
.animal svg .wool{fill:var(--paper)}

/* Underground rhizome layer */
.rhizome-section{
  position:relative;
  display:flex;
  flex-direction:column;
  height:100vh;
  padding:40px 5vw 20px;
  background:linear-gradient(to bottom, var(--soil) 0%, var(--soil) 35%, var(--root) 65%, var(--root) 100%);
  color:var(--paper);
  overflow:hidden;
  box-sizing:border-box;
}
.rhizome-heading{
  flex-shrink:0;
  z-index:5;
  max-width:760px;
  margin-bottom:0;
}
.rhizome-heading .kicker{color:var(--soft)}
.rhizome-heading h2{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(24px,3vw,40px);
  font-weight:400;
  font-style:italic;
  color:var(--ink);
  line-height:.98;
  margin:0;
}
.rhizome-heading .lede{
  max-width:420px;
  margin-top:22px;
  color:var(--soft);
  font-size:14px;
  line-height:1.6;
}
.rhizome-layout{
  flex:1;
  min-height:0;
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  align-items:center;
  justify-items:center;
  max-width:1000px;
  margin:0 auto;
  width:100%;
}
.rhizome-stage{
  position:relative;
  z-index:4;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

@media(max-width:850px){
  .rhizome-layout{
    max-width:100%;
  }
}
.rhizome-svg{
  display:block;
  width:100%;
  height:100%;
  max-height:100%;
  overflow:visible;
}
.rhizome-node{
  cursor:default;
  opacity:.85;
  transition:opacity .6s ease;
}
.rhizome-node:hover,
.rhizome-stage.focused .rhizome-node{
  opacity:1;
}
.rhizome-node .node-icon{
  fill:none;
  stroke:var(--ink);
  stroke-width:3;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.rhizome-node text{
  fill:var(--ink);
  font-family:"Source Code Pro","Courier New",monospace;
  font-size:14px;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  text-anchor:middle;
}
.rhizome-path{
  fill:none;
  stroke:var(--ink);
  stroke-width:2.4;
  stroke-linecap:round;
  opacity:.18;
  pointer-events:none;
  transition:opacity .8s ease, stroke .4s ease, stroke-width .4s ease;
}
.rhizome-hit{
  fill:none;
  stroke:transparent;
  stroke-width:28;
  stroke-linecap:round;
  cursor:pointer;
  pointer-events:stroke;
}
.rhizome-path.visible{
  opacity:.72;
  stroke:rgba(var(--ochre-rgb), .82);
}
.rhizome-hit.hovered + .rhizome-path,
.rhizome-path.hovered{
  opacity:1;
  stroke:var(--ochre);
  stroke-width:3.6;
}
.rhizome-visited{
  fill:var(--ink);
  stroke:none;
  animation:pulseDot 2.5s ease-in-out infinite;
}
@keyframes pulseDot{50%{opacity:.3;r:2}}
.rhizome-hint{
  position:absolute;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  margin:0;
  font-family:"Source Code Pro","Courier New",monospace;
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--ink);
  white-space:nowrap;
  transition:opacity .4s ease;
}
.rhizome-stage.focused .rhizome-hint{
  opacity:0;
}

/* Relation detail panel — right side slide-in */
.relation-panel{
  position:fixed;
  z-index:95;
  right:0;
  top:0;
  bottom:0;
  width:min(520px,calc(100vw - 32px));
  overflow:auto;
  padding:44px 38px;
  background:rgba(var(--ink-rgb), .97);
  border-left:1px solid rgba(var(--ochre-rgb), .35);
  color:var(--paper);
  transform:translateX(100%);
  transition:transform .7s cubic-bezier(.2,.8,.2,1);
}
.relation-panel.open{
  transform:none;
}
/* Panel backdrop overlay */
.panel-backdrop{
  position:fixed;
  z-index:94;
  inset:0;
  background:rgba(0,0,0,.55);
  opacity:0;
  pointer-events:none;
  transition:opacity .45s ease;
}
.panel-backdrop.open{
  opacity:1;
  pointer-events:auto;
}
.relation-panel .panel-close{
  position:absolute;
  right:18px;
  top:12px;
  border:0;
  background:none;
  font-size:32px;
  color:var(--paper);
  opacity:.6;
}
.relation-panel .panel-close:hover{opacity:1}
.relation-panel .panel-index{
  font-family:"Source Code Pro","Courier New",monospace;
  font-size:10px;
  letter-spacing:.18em;
  color:rgba(var(--paper-rgb), .5);
  margin:0 0 10px;
}
.relation-panel h2{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(26px,3.4vw,42px);
  font-weight:400;
  font-style:italic;
  line-height:1.02;
  margin:0 0 6px;
}
.relation-subtitle{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-style:italic;
  font-size:17px;
  color:rgba(var(--paper-rgb), .65);
  margin:0 0 28px;
}
.relation-panel .panel-text{
  font-family:"Noto Serif SC",Georgia,serif;
  font-size:16px;
  line-height:1.75;
  color:rgba(var(--paper-rgb), .88);
  margin:0 0 22px;
}
.relation-section-title{
  font-family:"Source Code Pro","Courier New",monospace;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ochre);
  margin:28px 0 10px;
}
.relation-secondary{
  font-size:14px;
  color:rgba(var(--paper-rgb), .7);
}
.relation-image-explanation{
  font-style:italic;
  color:rgba(var(--paper-rgb), .82);
}
.relation-panel blockquote{
  margin:0;
  padding:16px 0 0;
  border-top:1px solid rgba(var(--ochre-rgb), .45);
  font-family:"Cormorant Garamond",Georgia,serif;
  font-style:italic;
  font-size:20px;
  line-height:1.5;
  color:rgba(var(--paper-rgb), .78);
}
.relation-panel .media-placeholder{
  background:repeating-linear-gradient(-45deg,transparent 0 11px,rgba(var(--paper-rgb), .05) 12px 13px);
  border-color:rgba(var(--paper-rgb), .35);
  color:rgba(var(--paper-rgb), .55);
}

@media(max-width:850px){
  .rhizome-section{height:100vh;padding:50px 18px 16px;display:flex;flex-direction:column;box-sizing:border-box}
  .rhizome-heading h2{font-size:24px}
  .relation-panel{
    inset:auto 0 0;
    width:auto;
    height:min(70vh,520px);
    border-left:none;
    border-top:1px solid rgba(var(--ochre-rgb), .35);
    transform:translateY(100%);
  }
  .relation-panel.open{transform:none}
}

@media(prefers-reduced-motion:reduce){
  .rhizome-stage{transform:none !important}
  .rhizome-path,
  .rhizome-node,
  .relation-panel,
  .panel-backdrop{
    transition:none !important;
    animation:none !important;
  }
  .rhizome-path{opacity:.5}
}
