[hidden]{display:none!important}
.hub-app{min-height:100vh}
body.welcome-active{background:#02080b}
.welcome-screen{position:relative;z-index:100;min-height:100vh;background:#02080b;color:white}
.welcome-hero{position:relative;min-height:100svh;overflow:hidden;display:grid;place-items:center;isolation:isolate}
.welcome-video{position:absolute;inset:0;width:100%;height:120%;object-fit:cover;z-index:-4;transform:scale(1.20);filter:saturate(.88) contrast(1.03)}
.welcome-shade{position:absolute;inset:0;z-index:-3;background:radial-gradient(circle at 50% 51%,rgba(0,0,0,.03) 0 22%,rgba(0,4,8,.42) 58%,rgba(0,4,8,.88) 100%),linear-gradient(180deg,rgba(0,8,11,.25),rgba(0,8,11,.02) 45%,rgba(0,5,8,.65));backdrop-filter:blur(1.5px)}
.welcome-light{position:absolute;z-index:-2;left:50%;top:42%;width:44rem;max-width:88vw;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(151,255,192,.12),rgba(76,193,151,.04) 38%,transparent 70%);animation:welcome-breathe 6s ease-in-out infinite}
@keyframes welcome-breathe{50%{transform:translate(-50%,-50%) scale(1.09);opacity:.72}}
.welcome-brand{position:absolute;left:clamp(1rem,4vw,4.5rem);top:clamp(1rem,3vw,3rem);display:flex;align-items:center;gap:.8rem;text-transform:lowercase;text-shadow:0 3px 18px rgba(0,0,0,.7)}
.welcome-brand-mark{display:grid;place-items:center;width:4.2rem;height:4.2rem;border:3px solid #e8fbef;border-radius:50%;font-size:2.2rem;color:#e8fbef;box-shadow:0 0 16px rgba(85,235,224,.75),inset 0 0 16px rgba(85,235,224,.22)}
.welcome-brand strong{font-size:clamp(1rem,1.6vw,1.55rem);line-height:1.02}
.welcome-copy{text-align:center;width:min(920px,92vw);padding:8rem 1rem 6rem;display:flex;flex-direction:column;align-items:center;text-shadow:0 5px 30px rgba(0,0,0,.72)}
.welcome-word{font-weight:800;font-size:clamp(4.3rem,10vw,9.5rem);line-height:.5;margin:0;letter-spacing:-.045em}
.welcome-to{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2rem,4vw,4rem);margin:1.1rem 0 -.2rem}
.welcome-copy h1{font-family:"Segoe Script","Bradley Hand",cursive;font-size:clamp(4.2rem,9vw,9.2rem);font-weight:300;line-height:2;margin:.2rem 0 .4rem;letter-spacing:-.04em}
.welcome-hypha{position:relative;width:min(700px,76vw);height:3.8rem;margin:-.15rem auto .6rem}
.welcome-hypha::before,.welcome-hypha::after{content:"";position:absolute;top:50%;width:45%;height:1px;background:linear-gradient(90deg,transparent,rgba(243,255,247,.85))}
.welcome-hypha::before{left:0}.welcome-hypha::after{right:0;transform:scaleX(-1)}
.welcome-hypha b{position:absolute;left:50%;top:50%;width:1.25rem;height:1.25rem;border:3px solid #eefcf0;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 16px rgba(215,255,218,.8)}
.welcome-hypha i{position:absolute;top:50%;width:.8rem;height:.8rem;border:2px solid rgba(242,255,246,.78);border-radius:50%;transform:translateY(-50%)}
.welcome-hypha i:first-child{left:4%}.welcome-hypha i:last-child{right:4%}
.welcome-seed-label{display:flex;flex-direction:column;align-items:center;gap:.55rem;margin-top:8rem}
.welcome-seed-label strong{font-size:clamp(2rem,4vw,3.3rem);color:rgba(230,239,232,.62)}
.welcome-seed-label button{min-width:15rem;border:2px solid rgba(67,235,72,.72);background:rgba(0,10,5,.62);color:#61ff72;border-radius:.75rem;padding:.45rem 2.1rem;font-size:clamp(1.6rem,3vw,2.4rem);cursor:pointer;box-shadow:0 0 28px rgba(69,241,84,.12);transition:.25s ease}
.welcome-seed-label button:hover,.welcome-seed-label button:focus-visible{background:rgba(30,113,42,.35);box-shadow:0 0 32px rgba(83,255,102,.42);transform:scale(1.035)}
.welcome-particles{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.welcome-particles i{position:absolute;left:var(--x);top:var(--y);width:5%;height:9%;border-radius:80%;background:#1aa4ce3f;box-shadow:0 0 10px rgba(2, 243, 223, 0.466);animation:welcome-mote var(--d) ease-in-out var(--delay) infinite}
@keyframes welcome-mote{0%,100%{opacity:0;transform:translateY(25px) scale(.4)}24%{opacity:.75}70%{opacity:.4}100%{transform:translateY(-90px) scale(1.1)}}
.welcome-footer{position:relative;display:grid;grid-template-columns:1.3fr .8fr 1fr auto;gap:clamp(1.4rem,5vw,5rem);padding:2rem clamp(1rem,4vw,4rem) 3rem;background:#f7f8f5;color:#153e43;min-height:220px;text-transform:none;letter-spacing:normal;width:100%;margin:0;border:0;font-size:.85rem}
.welcome-footer>div{display:flex;flex-direction:column;gap:.6rem;align-items:flex-start}.welcome-footer strong{font-size:1rem}.footer-brand>strong{font-size:1.9rem}.welcome-footer a{color:#153e43;text-decoration:none}.welcome-footer a:hover{text-decoration:underline}.footer-social{font-weight:900;border:2px solid #153e43;padding:.05rem .2rem;height:max-content}.footer-copy{position:absolute;left:clamp(1rem,4vw,4rem);bottom:1rem}
body.hub-entering .welcome-screen{animation:welcome-exit .68s ease forwards}
@keyframes welcome-exit{to{opacity:0;transform:scale(1.015);filter:blur(4px)}}
.scene-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:0;transition:opacity .6s ease;transform:scale(1.025);will-change:transform,opacity}
.art-scene.video-ready .scene-video{opacity:1;animation:scene-video-drift 14s ease-in-out infinite alternate}
.art-scene.video-ready .scene-image{opacity:0}
@keyframes scene-video-drift{from{transform:scale(1.025) translate3d(-.35%,0,0)}to{transform:scale(1.055) translate3d(.35%,-.3%,0)}}
.dialog-art[data-theme="locked"] .scene-video{filter:grayscale(.82) blur(1.8px) brightness(.58)}
@media(max-width:760px){.welcome-brand{left:1rem;top:1rem}.welcome-brand-mark{width:3.1rem;height:3.1rem}.welcome-copy{padding-top:8rem}.welcome-seed-label{margin-top:5rem}.welcome-footer{grid-template-columns:1fr 1fr}.footer-social{position:absolute;right:1rem;top:1.5rem}}

:root{
  color-scheme: dark;
  --ink:#edf7ed;
  --muted:#a8bbb3;
  --night:#050b10;
  --deep:#071217;
  --panel:rgba(9,25,27,.88);
  --line:rgba(227,190,94,.58);
  --gold:#e6bd5e;
  --gold-soft:#f4d68b;
  --mint:#79e0ba;
  --cyan:#62d5e6;
  --violet:#ad7dff;
  --danger:#b68d68;
  --shadow:0 30px 80px rgba(0,0,0,.48);
}

*{box-sizing:border-box}
html{min-height:100%;background:var(--night);scroll-behavior:smooth}
body{
  min-height:100vh;
  margin:0;
  color:var(--ink);
  background:
    radial-gradient(circle at 50% 45%, rgba(17,83,65,.22), transparent 36%),
    radial-gradient(circle at 12% 85%, rgba(53,33,93,.25), transparent 28%),
    linear-gradient(180deg,#050b10 0%,#071317 48%,#04090d 100%);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  overflow-x:hidden;
}
button,input{font:inherit}
button{color:inherit}
button:focus-visible,input:focus-visible{outline:3px solid var(--cyan);outline-offset:4px}

.skip-link{position:fixed;left:1rem;top:-5rem;z-index:1000;background:#fff;color:#000;padding:.75rem 1rem;border-radius:.5rem}
.skip-link:focus{top:1rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.ambient{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.ambient span{position:absolute;width:4px;height:4px;border-radius:50%;background:rgba(180,255,221,.65);box-shadow:0 0 18px rgba(121,224,186,.8);animation:drift 12s linear infinite}
.ambient span:nth-child(1){left:8%;top:72%;animation-duration:15s}
.ambient span:nth-child(2){left:24%;top:86%;animation-delay:-7s}
.ambient span:nth-child(3){left:56%;top:90%;animation-duration:18s;animation-delay:-3s}
.ambient span:nth-child(4){left:78%;top:80%;animation-delay:-9s}
.ambient span:nth-child(5){left:92%;top:66%;animation-duration:20s;animation-delay:-13s}
.ambient span:nth-child(6){left:40%;top:74%;animation-duration:14s;animation-delay:-5s}
@keyframes drift{0%{transform:translateY(10vh) scale(.6);opacity:0}20%{opacity:1}100%{transform:translateY(-90vh) scale(1.4);opacity:0}}

.topbar{
  position:relative;z-index:20;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  width:min(1480px,calc(100% - 2rem));margin:0 auto;padding:1rem 0;
  border-bottom:1px solid rgba(230,189,94,.22)
}
.brand{display:flex;align-items:center;gap:.8rem;background:none;border:0;text-align:left;cursor:pointer;padding:.3rem}
.brand-mark{display:grid;place-items:center;width:2.8rem;height:2.8rem;border:1px solid rgba(230,189,94,.5);border-radius:50%;color:var(--gold);font-size:1.7rem;box-shadow:0 0 30px rgba(230,189,94,.12)}
.brand strong{display:block;font-size:clamp(1.2rem,2vw,1.8rem);letter-spacing:.02em}
.brand small{display:block;color:var(--muted);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;margin-top:.12rem}
.top-actions{display:flex;align-items:center;gap:.55rem}
.ghost-button,.icon-button{border:1px solid rgba(230,189,94,.25);background:rgba(255,255,255,.035);border-radius:999px;padding:.65rem .95rem;cursor:pointer;backdrop-filter:blur(12px)}
.ghost-button:hover,.icon-button:hover{border-color:var(--gold);background:rgba(230,189,94,.08)}
.icon-button{width:2.65rem;height:2.65rem;padding:0;font-weight:800}

.world-shell{position:relative;z-index:2;width:min(1480px,calc(100% - 2rem));margin:0 auto}
.intro-copy{text-align:center;max-width:780px;margin:1.3rem auto .4rem}
.eyebrow,.dialog-eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;color:var(--gold-soft);font-weight:800;margin:0 0 .5rem}
.intro-copy h1{font-family:Georgia,"Times New Roman",serif;font-weight:500;font-size:clamp(1.7rem,3.5vw,3.4rem);line-height:1.05;margin:.25rem 0 .65rem;text-wrap:balance}
.intro-copy p:last-child{color:var(--muted);max-width:650px;margin:0 auto;line-height:1.55}

.world-stage{
  position:relative;
  min-height:min(820px,74vh);
  margin:1rem 0 .4rem;
  border:1px solid rgba(230,189,94,.18);
  border-radius:2.2rem;
  overflow:hidden;
  background:
    radial-gradient(circle at center,rgba(80,184,129,.16) 0,rgba(7,25,24,.55) 28%,rgba(3,10,15,.93) 72%),
    linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);
  background-size:auto,70px 70px,70px 70px;
  box-shadow:inset 0 0 100px rgba(0,0,0,.75),var(--shadow);
}
.world-stage::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,transparent 0 30%,rgba(1,7,10,.3) 60%,rgba(1,5,8,.84) 100%);pointer-events:none}
#hypha-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.world-orbit{position:absolute;inset:3.5rem 3rem 7.5rem;z-index:3}

.region-node{
  --node-size:clamp(112px,12vw,170px);
  position:absolute;left:50%;top:50%;
  width:var(--node-size);aspect-ratio:1/.88;
  left:calc(50% + var(--x));top:calc(50% + var(--y));
  transform:translate(-50%,-50%);
  clip-path:polygon(25% 3%,75% 3%,100% 50%,75% 97%,25% 97%,0 50%);
  border:0;
  padding:1rem .7rem;
  cursor:pointer;
  color:#f6fff9;
  background:
    linear-gradient(180deg,rgba(3,12,14,.12) 0%,rgba(3,12,14,.45) 48%,rgba(3,12,14,.92) 100%),
    radial-gradient(circle at 50% 28%,rgba(100,223,188,.16),transparent 48%),
    var(--region-image),
    rgba(10,39,35,.92);
  background-size:cover;
  background-position:center;
  filter:drop-shadow(0 14px 25px rgba(0,0,0,.55));
  transition:transform .32s ease,filter .32s ease,opacity .32s ease;
}
.region-node::before{content:"";position:absolute;inset:4px;clip-path:inherit;border:1px solid transparent;background:linear-gradient(145deg,rgba(230,189,94,.8),rgba(100,220,198,.15),rgba(230,189,94,.45)) border-box;mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);mask-composite:exclude;pointer-events:none}
.region-node:hover,.region-node:focus-visible{transform:translate(-50%,-50%) scale(1.08);filter:drop-shadow(0 0 24px rgba(121,224,186,.35)) drop-shadow(0 16px 28px rgba(0,0,0,.55));z-index:10}
.region-node.locked{opacity:.52;filter:grayscale(.75) blur(.25px) drop-shadow(0 14px 25px rgba(0,0,0,.5));background:
  linear-gradient(180deg,rgba(25,30,31,.35),rgba(7,12,15,.92)),
  var(--region-image),
  rgba(9,17,21,.94);
  background-size:cover;background-position:center;}
.region-node.locked:hover,.region-node.locked:focus-visible{opacity:.8;filter:grayscale(.5) drop-shadow(0 0 20px rgba(185,195,198,.18));}
.node-number{display:block;color:var(--gold-soft);font-weight:800;font-size:.7rem;letter-spacing:.12em;margin-bottom:.2rem}
.node-title{display:block;font-family:Georgia,"Times New Roman",serif;font-size:clamp(.92rem,1.25vw,1.25rem);line-height:1.02;text-wrap:balance}
.node-subtitle{display:block;color:#c5d6ce;font-size:clamp(.58rem,.72vw,.72rem);margin-top:.35rem;line-height:1.2}
.node-status{display:inline-block;margin-top:.5rem;padding:.15rem .48rem;border-radius:999px;background:rgba(121,224,186,.13);color:#aaf5d7;font-size:.58rem;text-transform:uppercase;letter-spacing:.13em;font-weight:900}
.locked .node-status{background:rgba(255,255,255,.06);color:#c8d0d1}

.seed-node{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:clamp(150px,16vw,230px);aspect-ratio:1/.88;
  clip-path:polygon(25% 3%,75% 3%,100% 50%,75% 97%,25% 97%,0 50%);
  border:0;cursor:pointer;color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:
    radial-gradient(circle at 50% 46%,rgba(196,255,174,.22),transparent 28%),
    linear-gradient(180deg,rgba(3,18,14,.12),rgba(3,18,14,.84)),
    var(--seed-image),
    radial-gradient(circle at 50% 50%,rgba(34,114,72,.95),rgba(8,37,31,.98) 58%,rgba(5,18,19,1) 100%);
  background-size:cover;
  background-position:center;
  filter:drop-shadow(0 0 30px rgba(138,239,164,.28)) drop-shadow(0 18px 35px rgba(0,0,0,.7));
  transition:transform .3s ease,filter .3s ease;
  z-index:8;
}
.seed-node::before{content:"";position:absolute;inset:5px;clip-path:inherit;border:1px solid transparent;background:linear-gradient(150deg,#f3d67d,#81efc7,#d7a940) border-box;mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);mask-composite:exclude}
.seed-node:hover,.seed-node:focus-visible{transform:translate(-50%,-50%) scale(1.055);filter:drop-shadow(0 0 45px rgba(138,239,164,.5)) drop-shadow(0 20px 40px rgba(0,0,0,.72))}
.seed-glow{position:absolute;width:55%;aspect-ratio:1;border-radius:50%;background:rgba(161,255,173,.1);box-shadow:0 0 50px rgba(161,255,173,.48);animation:pulse 3.4s ease-in-out infinite}
@keyframes pulse{50%{transform:scale(1.2);opacity:.55}}
.seed-sprout{position:relative;color:#d5ff9f;font-size:3.1rem;line-height:.8;text-shadow:0 0 20px rgba(201,255,153,.9);transform:rotate(-15deg)}
.seed-title{position:relative;margin-top:.75rem;font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.4rem,2vw,2rem)}
.seed-subtitle{position:relative;color:#bdebcf;font-size:.72rem;text-transform:uppercase;letter-spacing:.18em;margin-top:.25rem}

.journey-dock{position:absolute;z-index:8;left:50%;bottom:1.2rem;transform:translateX(-50%);width:min(880px,calc(100% - 2rem));display:flex;align-items:center;justify-content:center;gap:.7rem;flex-wrap:wrap;padding:.7rem .9rem;border:1px solid rgba(230,189,94,.18);border-radius:1rem;background:rgba(4,14,17,.72);backdrop-filter:blur(14px);box-shadow:0 10px 32px rgba(0,0,0,.25)}
.journey-dock>span{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--gold-soft);font-weight:800}
.journey-buttons{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center}
.journey-buttons button{border:1px solid rgba(121,224,186,.22);background:rgba(121,224,186,.07);border-radius:999px;padding:.42rem .7rem;cursor:pointer;font-size:.78rem}
.journey-buttons button:hover{background:rgba(121,224,186,.18);border-color:var(--mint)}
.world-key{display:flex;justify-content:center;gap:1.2rem;flex-wrap:wrap;color:var(--muted);font-size:.72rem;margin:.8rem 0 1.6rem}
.world-key span{display:flex;align-items:center;gap:.4rem}.key-dot{width:.65rem;height:.65rem;border-radius:50%;display:inline-block}.key-dot.open{background:var(--mint);box-shadow:0 0 10px var(--mint)}.key-dot.future{background:#687176}.key-line{width:1.6rem;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}

footer{position:relative;z-index:2;width:min(1480px,calc(100% - 2rem));margin:0 auto;padding:1.2rem 0 1.6rem;border-top:1px solid rgba(230,189,94,.16);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;color:#738882;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase}

dialog{border:0;padding:0;color:var(--ink);background:transparent}
dialog::backdrop{background:rgba(1,6,9,.78);backdrop-filter:blur(10px)}
.region-dialog{width:min(1050px,calc(100% - 1.5rem));max-height:min(820px,calc(100vh - 1.5rem));border:1px solid rgba(230,189,94,.26);border-radius:1.6rem;overflow:hidden;background:#081416;box-shadow:var(--shadow)}
.region-dialog[open]{display:grid;grid-template-columns:minmax(260px,.75fr) minmax(0,1.25fr)}
.dialog-art{
  min-height:520px;
  position:relative;
  overflow:hidden;
  background:#0b1517;
  --shift-x:0px;
  --shift-y:0px;
  isolation:isolate;
}
.art-scene{position:absolute;inset:0;overflow:hidden;background:#071114}
.scene-image-wrap{
  position:absolute;inset:-3%;
  transform:translate3d(var(--shift-x),var(--shift-y),0);
  transition:transform .5s ease-out;
  will-change:transform;
}
.scene-image{
  width:100%;height:100%;
  transition:opacity .55s ease;
  object-fit:cover;
  object-position:center;
  display:block;
  transform:scale(1.06);
  animation:scene-image-drift 20s ease-in-out infinite alternate;
  will-change:transform,filter;
}
@keyframes scene-image-drift{
  0%{transform:scale(1.06) translate3d(-.7%,0,0)}
  100%{transform:scale(1.12) translate3d(.7%,-.8%,0)}
}
.scene-colourwash{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,12,14,.08),rgba(5,13,15,.08) 48%,rgba(2,8,10,.46));
  mix-blend-mode:multiply;
  pointer-events:none;
}
.dialog-art[data-theme="mind"] .scene-colourwash,.dialog-art[data-theme="seed"] .scene-colourwash{background:linear-gradient(180deg,rgba(16,75,62,.05),rgba(4,19,19,.35))}
.dialog-art[data-theme="quiet"] .scene-colourwash{background:linear-gradient(180deg,rgba(27,83,119,.08),rgba(4,20,30,.4))}
.dialog-art[data-theme="sound"] .scene-colourwash{background:linear-gradient(180deg,rgba(75,26,112,.1),rgba(10,9,32,.42))}
.dialog-art[data-theme="community"] .scene-colourwash{background:linear-gradient(180deg,rgba(71,35,125,.08),rgba(11,9,32,.42))}
.dialog-art[data-theme="practical"] .scene-colourwash{background:linear-gradient(180deg,rgba(126,72,18,.02),rgba(17,10,4,.28))}
.scene-sunbeam{
  position:absolute;
  width:72%;height:125%;
  right:-42%;top:-30%;
  background:linear-gradient(110deg,transparent 20%,rgba(255,232,177,.04) 42%,rgba(255,224,147,.27) 50%,rgba(255,244,211,.06) 58%,transparent 76%);
  transform:rotate(8deg);
  filter:blur(10px);
  opacity:.75;
  animation:sunbeam-wander 11s ease-in-out infinite alternate;
  pointer-events:none;
}
@keyframes sunbeam-wander{
  from{transform:translate3d(-12%,0,0) rotate(8deg);opacity:.36}
  to{transform:translate3d(20%,3%,0) rotate(5deg);opacity:.86}
}
.scene-mist{
  position:absolute;
  left:-30%;width:160%;height:35%;
  background:
    radial-gradient(ellipse at 15% 50%,rgba(230,244,231,.12),transparent 28%),
    radial-gradient(ellipse at 48% 50%,rgba(230,244,231,.10),transparent 32%),
    radial-gradient(ellipse at 78% 50%,rgba(230,244,231,.08),transparent 27%);
  filter:blur(18px);
  opacity:.34;
  pointer-events:none;
}
.scene-mist-one{bottom:9%;animation:mist-pass-one 18s linear infinite}
.scene-mist-two{bottom:34%;opacity:.18;transform:scale(.85);animation:mist-pass-two 25s linear infinite}
@keyframes mist-pass-one{0%{transform:translateX(-8%)}50%{transform:translateX(8%)}100%{transform:translateX(-8%)}}
@keyframes mist-pass-two{0%{transform:translateX(8%) scale(.85)}50%{transform:translateX(-8%) scale(.9)}100%{transform:translateX(8%) scale(.85)}}
.scene-vignette{
  position:absolute;inset:0;
  background:radial-gradient(circle at 55% 42%,transparent 28%,rgba(1,5,7,.10) 62%,rgba(1,5,7,.58) 100%);
  box-shadow:inset 0 0 70px rgba(0,0,0,.42);
  pointer-events:none;
}
.scene-particles{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.scene-particles i{
  position:absolute;
  left:var(--left);top:var(--top);
  width:var(--size);height:var(--size);
  border-radius:50%;
  background:rgba(170, 161, 111, 0.92);
  box-shadow:0 0 8px rgb(175, 161, 97),0 0 30px rgba(255, 206, 100, 0.226);
  animation:art-mote var(--duration) ease-in-out var(--delay) infinite;
}
@keyframes art-mote{
  0%,100%{transform:translate3d(0,12px,0) scale(.65);opacity:0}
  18%{opacity:.85}
  55%{transform:translate3d(var(--drift),-42px,0) scale(1);opacity:.72}
  82%{opacity:.34}
}
.dialog-art .art-symbol{
  position:absolute;right:1rem;bottom:.8rem;
  display:grid;place-items:center;
  font-size:clamp(4rem,10vw,7rem);
  opacity:.2;
  text-shadow:0 0 45px currentColor;
  color:var(--gold);
  z-index:3;
}
.dialog-art[data-theme="locked"] .scene-image{
  filter:grayscale(.82) blur(1.8px) brightness(.58);
  transform:scale(1.12);
}
.dialog-art[data-theme="locked"] .scene-colourwash{background:rgba(18,25,28,.42)}
.dialog-art[data-theme="locked"] .scene-mist{opacity:.7}
.dialog-art[data-theme="locked"] .scene-sunbeam{opacity:.12}
.dialog-content{position:relative;padding:clamp(1.5rem,4vw,3.3rem);overflow:auto;max-height:min(820px,calc(100vh - 1.5rem))}
.dialog-close{position:absolute;right:1rem;top:1rem;z-index:5;width:2.6rem;height:2.6rem;border-radius:50%;border:1px solid rgba(255,255,255,.16);background:rgba(0,0,0,.25);cursor:pointer;font-size:1.55rem;line-height:1}
.dialog-content h2,.simple-dialog h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2rem,4vw,3.4rem);font-weight:500;margin:.15rem 0 .7rem}
.dialog-intro{color:#c7d8d0;font-size:1.03rem;line-height:1.65;margin:0 0 1.5rem}
.experience-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;margin:1.2rem 0}
.experience-card{border:1px solid rgba(121,224,186,.16);background:rgba(255,255,255,.035);border-radius:1rem;padding:1rem;min-height:150px;display:flex;flex-direction:column}
.experience-card strong{font-family:Georgia,"Times New Roman",serif;font-size:1.05rem}.experience-card p{color:var(--muted);font-size:.82rem;line-height:1.45;margin:.45rem 0 auto}.experience-card button{align-self:flex-start;margin-top:.8rem;border:1px solid rgba(230,189,94,.3);background:rgba(230,189,94,.08);border-radius:999px;padding:.45rem .7rem;cursor:pointer;font-size:.72rem}
.path-strip{margin-top:1.2rem;border-top:1px solid rgba(255,255,255,.1);padding-top:1rem}.path-strip h3{font-size:.78rem;text-transform:uppercase;letter-spacing:.14em;color:var(--gold-soft);margin:0 0 .6rem}.path-links{display:flex;gap:.5rem;flex-wrap:wrap}.path-links button{border:1px solid rgba(121,224,186,.2);background:rgba(121,224,186,.06);border-radius:999px;padding:.48rem .75rem;cursor:pointer}
.locked-card{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.035);padding:1rem;border-radius:1rem;color:#c4cfcb}.locked-card strong{color:var(--gold-soft)}
.seed-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.seed-choice{border:1px solid rgba(121,224,186,.18);background:rgba(121,224,186,.06);border-radius:1rem;padding:1rem;text-align:left;cursor:pointer}.seed-choice strong{display:block;font-family:Georgia,"Times New Roman",serif;font-size:1.08rem}.seed-choice span{display:block;color:var(--muted);font-size:.8rem;margin-top:.3rem}

.simple-dialog{width:min(700px,calc(100% - 1.5rem));border:1px solid rgba(230,189,94,.25);border-radius:1.4rem;background:#081416;box-shadow:var(--shadow)}
.simple-dialog-inner{position:relative;padding:clamp(1.4rem,4vw,2.8rem)}
.simple-dialog p{color:var(--muted);line-height:1.6}
kbd{border:1px solid rgba(255,255,255,.2);border-bottom-width:2px;border-radius:.35rem;padding:.08rem .35rem;background:rgba(255,255,255,.06)}
.search-box{display:flex;gap:.55rem;border:1px solid rgba(121,224,186,.3);padding:.45rem;border-radius:1rem;background:rgba(255,255,255,.035)}
.search-box input{flex:1;min-width:0;border:0;background:transparent;color:#fff;padding:.7rem;outline:0}
.search-box button{border:0;border-radius:.7rem;background:#1f6c53;color:#fff;font-weight:800;padding:.7rem 1rem;cursor:pointer}
.search-results{display:grid;gap:.6rem;margin-top:1rem}
.search-result{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%;text-align:left;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.035);border-radius:.85rem;padding:.8rem 1rem;cursor:pointer}.search-result:hover{border-color:rgba(121,224,186,.5)}.search-result strong{display:block}.search-result small{display:block;color:var(--muted);margin-top:.2rem}.search-result em{font-style:normal;text-transform:uppercase;letter-spacing:.1em;color:var(--gold-soft);font-size:.62rem}
.map-dialog{width:min(1200px,calc(100% - 1rem));max-height:calc(100vh - 1rem);border:1px solid rgba(230,189,94,.3);border-radius:1rem;background:#020607;box-shadow:var(--shadow);overflow:auto}.map-dialog img{display:block;width:100%;height:auto}.map-close{position:fixed;right:max(1rem,calc((100vw - 1200px)/2 + 1rem));top:1rem;background:rgba(2,8,10,.85)}

@media (max-width:1100px){
  .world-stage{min-height:760px}.world-orbit{inset:3rem 1rem 7.5rem}.region-node{--node-size:clamp(100px,13vw,140px)}
}
@media (max-width:760px){
  .topbar{align-items:flex-start}.brand small{display:none}.ghost-button{padding:.55rem .7rem;font-size:.78rem}
  .intro-copy{margin-top:.7rem}.intro-copy p:last-child{font-size:.9rem}
  .world-stage{min-height:auto;padding:1rem 1rem 8rem}.world-orbit{position:relative;inset:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;padding-top:190px}
  .region-node{position:relative;left:auto;top:auto;width:100%;aspect-ratio:auto;min-height:105px;transform:none!important;clip-path:polygon(10% 0,90% 0,100% 50%,90% 100%,10% 100%,0 50%);}
  .region-node:hover,.region-node:focus-visible{transform:scale(1.02)!important}.seed-node{top:18px;width:170px;transform:translateX(-50%)}.seed-node:hover,.seed-node:focus-visible{transform:translateX(-50%) scale(1.04)}
  .journey-dock{bottom:.8rem}.journey-dock>span{width:100%;text-align:center}
  .region-dialog[open]{display:block}.dialog-art{min-height:260px}.dialog-content{max-height:none}.experience-grid{grid-template-columns:1fr}.seed-choices{grid-template-columns:1fr}
  #hypha-canvas{display:none}.world-key{margin-top:1rem}
}
@media (max-width:480px){
  .world-shell,.topbar,footer{width:min(100% - 1rem,1480px)}.top-actions .ghost-button:nth-child(2){display:none}.world-orbit{grid-template-columns:1fr}.region-node{min-height:88px}.node-title{font-size:1.05rem}.journey-buttons button{font-size:.72rem}.search-box{display:grid}.map-dialog{width:calc(100% - .4rem)}
}

.region-effects{position:absolute;inset:0;pointer-events:none;z-index:4}
.candle-layer{position:absolute;inset:0;pointer-events:none}
.candle-effect{
  position:absolute;
  left:var(--x);top:var(--y);
  width:var(--size);height:calc(var(--size) * 1.55);
  transform:translate(-50%,-50%);
  filter:drop-shadow(0 0 6px rgba(255,214,127,.55));
  animation:candle-sway var(--duration) ease-in-out var(--delay) infinite;
  will-change:transform,opacity,filter;
}
.candle-effect::before,
.candle-effect::after{content:"";position:absolute;left:50%;transform:translateX(-50%);border-radius:999px;pointer-events:none}
.candle-effect::before{
  bottom:2%;
  width:calc(var(--size) * 0.52);
  height:calc(var(--size) * 0.9);
  background:radial-gradient(circle at 50% 58%,rgba(255,210,115,.95) 0%,rgba(255,171,57,.82) 38%,rgba(255,102,16,.46) 68%,rgba(255,102,16,0) 100%);
  filter:blur(4px);
  opacity:.95;
  box-shadow:0 0 22px rgba(255,187,75,.45),0 0 46px rgba(255,145,38,.25);
  animation:candle-glow calc(var(--duration) * 0.9) steps(7,end) var(--delay) infinite;
}
.candle-effect::after{
  bottom:18%;
  width:calc(var(--size) * 0.32);
  height:calc(var(--size) * 0.8);
  background:radial-gradient(circle at 50% 28%,rgba(255,252,224,1) 0%,rgba(255,229,132,.98) 36%,rgba(255,156,48,.72) 68%,rgba(255,156,48,0) 100%);
  filter:blur(0.8px);
  opacity:.98;
  transform:translateX(calc(-50% + var(--sway))) scaleY(1.02);
  box-shadow:0 0 12px rgba(255,221,126,.78),0 0 24px rgba(255,167,53,.46);
  animation:candle-flame calc(var(--duration) * 0.78) ease-in-out var(--delay) infinite;
}
.candle-effect .candle-spill,
.candle-effect .candle-spark{display:none}
.candle-effect{
  background:radial-gradient(circle,rgba(255,205,120,.42) 0%,rgba(255,178,77,.15) 28%,rgba(255,167,53,0) 68%);
  border-radius:50%;
}
@keyframes candle-sway{
  0%,100%{transform:translate(-50%,-50%) translateX(0) translateY(0)}
  35%{transform:translate(-50%,-50%) translateX(calc(var(--sway) * 0.75)) translateY(-1px)}
  70%{transform:translate(-50%,-50%) translateX(calc(var(--sway) * -0.55)) translateY(.6px)}
}
@keyframes candle-glow{
  0%,100%{opacity:.65;transform:translateX(-50%) scale(calc(0.88 * var(--flare)), calc(0.92 * var(--flare)))}
  16%{opacity:.95;transform:translateX(-50%) scale(calc(1.06 * var(--flare)), calc(1.12 * var(--flare)))}
  30%{opacity:.74;transform:translateX(-50%) scale(calc(0.94 * var(--flare)), calc(0.9 * var(--flare)))}
  47%{opacity:.88;transform:translateX(-50%) scale(calc(1.14 * var(--flare)), calc(1.02 * var(--flare)))}
  63%{opacity:.58;transform:translateX(-50%) scale(calc(0.82 * var(--flare)), calc(0.84 * var(--flare)))}
  82%{opacity:.9;transform:translateX(-50%) scale(calc(1.1 * var(--flare)), calc(1.08 * var(--flare)))}
}
@keyframes candle-flame{
  0%,100%{opacity:.92;transform:translateX(calc(-50% + var(--sway))) scale(1,.96) rotate(-2deg)}
  18%{opacity:1;transform:translateX(calc(-50% + var(--sway))) scale(.92,1.08) rotate(2deg)}
  37%{opacity:.78;transform:translateX(calc(-50% + var(--sway))) scale(1.06,.9) rotate(-4deg)}
  55%{opacity:.96;transform:translateX(calc(-50% + var(--sway))) scale(.98,1.14) rotate(3deg)}
  72%{opacity:.84;transform:translateX(calc(-50% + var(--sway))) scale(1.08,.9) rotate(-1deg)}
}

@media (prefers-reduced-motion:reduce){.scene-image{animation:none!important;transform:scale(1.04)!important}.scene-mist,.scene-sunbeam,.scene-particles,.region-effects{display:none!important}.scene-video,.welcome-video{animation:none!important}*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}.ambient{display:none}}
.dialog-art[data-theme="practical"] .candle-layer{
  display:none !important;
}
/* Practical Village: remove particles and all camera movement */
.dialog-art[data-theme="practical"] .scene-particles{
  display:none !important;
}

/* Stop mouse-following/parallax movement */
.dialog-art[data-theme="practical"] .scene-image-wrap{
  transform:none !important;
  transition:none !important;
}

/* Stop the automatic slow zoom and drift */
.dialog-art[data-theme="practical"] .scene-video,
.dialog-art[data-theme="practical"] .scene-image{
  animation:none !important;
  transform:scale(1) !important;
}