:root{
  --humus:#12100c;
  --humus-2:#1a1710;
  --duff:#241f15;
  --duff-2:#332916;
  --teal:#57e6c4;
  --teal-soft:#a7f7e7;
  --amber:#d9a441;
  --amber-2:#f0c86d;
  --moss:#94b86f;
  --moss-dark:#536d3b;
  --rust:#b45f37;
  --cream:#f0e6cf;
  --muted:#bcb097;
  --line:rgba(240,230,207,.17);
  --line-strong:rgba(87,230,196,.34);
  --shadow:rgba(0,0,0,.48);
  --font-display:'Newsreader', serif;
  --font-body:'Epilogue', sans-serif;
  --header-h:72px;
  --ease-out:cubic-bezier(.18,.84,.24,1);
  --ease-snap:cubic-bezier(.2,1,.2,1);
}

*,*::before,*::after{box-sizing:border-box}
html{
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-h) + 18px);
  background:var(--humus);
  color-scheme:dark;
  scrollbar-color:var(--moss-dark) var(--humus);
  scrollbar-width:thin;
}
html,body{margin:0;min-height:100%;overflow-x:clip}
body{
  color:var(--cream);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.65;
  background:
    radial-gradient(ellipse at 28% -8%, rgba(87,230,196,.2), transparent 36rem),
    radial-gradient(ellipse at 88% 11%, rgba(217,164,65,.16), transparent 34rem),
    radial-gradient(ellipse at 18% 84%, rgba(148,184,111,.15), transparent 42rem),
    linear-gradient(180deg, #15120d 0%, var(--humus) 34%, #080705 100%);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  font-kerning:normal;
  font-feature-settings:"kern" 1, "liga" 1;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:100;
  pointer-events:none;
  opacity:.48;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 .63 0 0 0 0 .55 0 0 0 0 .39 0 0 0 .11 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:99;
  pointer-events:none;
  background:
    radial-gradient(120% 75% at 50% 10%, transparent 48%, rgba(0,0,0,.48) 100%),
    linear-gradient(90deg, rgba(87,230,196,.035) 1px, transparent 1px),
    linear-gradient(180deg, rgba(217,164,65,.026) 1px, transparent 1px);
  background-size:auto, 72px 72px, 72px 72px;
}

::selection{background:var(--teal);color:#06241f}
::-webkit-scrollbar{width:12px}
::-webkit-scrollbar-track{background:#0d0b08}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--moss-dark),#2f4026);border:3px solid #0d0b08;border-radius:999px}

a{color:var(--teal-soft);text-underline-offset:.2em;transition:color .18s var(--ease-out), border-color .18s var(--ease-out), background-color .18s var(--ease-out)}
a:hover{color:var(--amber-2)}
button,a{touch-action:manipulation}
:focus-visible{
  outline:2px solid var(--amber-2);
  outline-offset:4px;
  border-radius:8px;
}
.skip-link{
  position:fixed;
  left:1rem;
  top:.8rem;
  z-index:120;
  translate:0 -150%;
  padding:.7rem 1rem;
  min-height:44px;
  display:inline-flex;
  align-items:center;
  color:#120e07;
  background:var(--teal);
  border:1px solid rgba(255,255,255,.35);
  font:700 .72rem/1 var(--font-body);
  letter-spacing:.12em;
  text-transform:uppercase;
  text-decoration:none;
  transition:translate .22s ease;
}
.skip-link:focus-visible{translate:0 0}

.site-header{
  position:relative;
  top:auto;
  z-index:80;
  min-height:var(--header-h);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.75rem clamp(1rem,4vw,3.4rem);
  background:rgba(18,16,12,.74);
  border-bottom:1px solid rgba(87,230,196,.18);
  backdrop-filter:blur(18px) saturate(1.1);
}
.brand{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  gap:.7rem;
  color:var(--cream);
  text-decoration:none;
  font:800 .78rem/1 var(--font-body);
  letter-spacing:.16em;
  text-transform:uppercase;
}
.brand-mark{
  width:42px;
  height:42px;
  color:var(--teal);
  filter:drop-shadow(0 0 12px rgba(87,230,196,.36));
  transition:transform .24s ease, filter .24s ease;
}
.brand:hover .brand-mark,.brand:focus-visible .brand-mark{
  transform:rotate(-8deg) scale(1.04);
  filter:drop-shadow(0 0 18px rgba(87,230,196,.56));
}
.site-nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:.25rem;
}
.site-nav a{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  padding:.65rem .85rem;
  color:var(--muted);
  text-decoration:none;
  font:700 .68rem/1 var(--font-body);
  letter-spacing:.14em;
  text-transform:uppercase;
  border:1px solid transparent;
  border-radius:999px;
  transition:color .18s var(--ease-out), border-color .18s var(--ease-out), background-color .18s var(--ease-out), transform .18s var(--ease-out);
}
.site-nav a:hover,.site-nav a:focus-visible{
  color:var(--teal-soft);
  border-color:rgba(87,230,196,.34);
  background:rgba(87,230,196,.08);
  transform:translateY(-1px);
}

main{position:relative;z-index:1}
section{
  padding:clamp(4rem,9vw,8rem) clamp(1rem,5vw,4.5rem);
  scroll-margin-top:calc(var(--header-h) + 16px);
}
.hero{
  min-height:calc(100svh - var(--header-h));
  display:grid;
  grid-template-columns:minmax(18rem,.68fr) minmax(0,1.32fr);
  align-items:center;
  gap:clamp(1.2rem,3vw,3.6rem);
  padding-top:clamp(1.5rem,4vw,3.8rem);
  padding-bottom:clamp(2rem,5vw,4rem);
  isolation:isolate;
}
.hero::before{
  content:"";
  position:absolute;
  inset:var(--header-h) 0 auto;
  height:70vh;
  pointer-events:none;
  background:
    radial-gradient(circle at 62% 45%, rgba(87,230,196,.16), transparent 24rem),
    radial-gradient(circle at 38% 40%, rgba(217,164,65,.11), transparent 22rem);
  filter:blur(8px);
}
.hero::after{
  content:"";
  position:absolute;
  inset:14% 0 6%;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(112deg, transparent 0 27%, rgba(87,230,196,.13) 27.2% 27.5%, transparent 27.8% 100%),
    linear-gradient(78deg, transparent 0 62%, rgba(217,164,65,.1) 62.1% 62.35%, transparent 62.55% 100%),
    radial-gradient(circle at 70% 48%, rgba(87,230,196,.16), transparent 25rem);
  opacity:.7;
}
.hero-copy,.map-shell{position:relative}
.hero-copy{z-index:12}
.map-shell{z-index:9}
.eyebrow,.panel-kicker{
  margin:0 0 .7rem;
  color:var(--amber-2);
  font:800 .72rem/1.35 var(--font-body);
  letter-spacing:.16em;
  text-transform:uppercase;
  overflow-wrap:anywhere;
}
.hero h1{
  margin:0;
  color:var(--cream);
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(4.35rem,8.7vw,9.35rem);
  line-height:.8;
  letter-spacing:0;
  text-wrap:balance;
  text-shadow:0 16px 42px rgba(0,0,0,.55);
}
.hero h1 span,.hero h1 em{display:block}
.hero h1 em{
  color:var(--teal);
  font-weight:400;
  font-style:italic;
  margin-left:clamp(1.1rem,4vw,4rem);
  filter:drop-shadow(0 0 22px rgba(87,230,196,.28));
}
.hero-deck{
  max-width:33.5rem;
  margin:clamp(1.4rem,3vw,2.4rem) 0 0;
  color:#d7ccb3;
  font-size:clamp(1rem,1.35vw,1.18rem);
}
.hero-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.6rem;
  max-width:42rem;
  margin:clamp(1.8rem,4vw,3rem) 0 0;
}
.hero-stats div{
  position:relative;
  padding:1rem .85rem;
  background:linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016));
  border:1px solid rgba(240,230,207,.16);
  border-left-color:rgba(87,230,196,.55);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  overflow:hidden;
}
.hero-stats div::after{
  content:"";
  position:absolute;
  inset:auto .55rem .45rem;
  height:1px;
  background:linear-gradient(90deg, var(--teal), transparent);
  opacity:.55;
}
.hero-stats dt{
  color:var(--muted);
  font-size:.66rem;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.hero-stats dd{
  margin:.25rem 0 0;
  color:var(--teal-soft);
  font:500 clamp(1.28rem,2.1vw,1.95rem)/1 var(--font-display);
  font-variant-numeric:tabular-nums lining-nums;
  white-space:nowrap;
}

.map-shell{
  min-width:0;
  border:1px solid rgba(87,230,196,.28);
  background:
    radial-gradient(circle at 30% 10%, rgba(87,230,196,.13), transparent 19rem),
    linear-gradient(180deg, rgba(20,26,18,.82), rgba(8,7,5,.94)),
    radial-gradient(circle at 50% 55%, rgba(87,230,196,.11), transparent 48%);
  box-shadow:
    0 34px 90px rgba(0,0,0,.62),
    0 0 80px rgba(87,230,196,.14),
    inset 0 1px 0 rgba(255,255,255,.08);
  overflow:hidden;
  transform:translateZ(0);
}
.map-shell::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border:1px solid rgba(217,164,65,.16);
  margin:10px;
  z-index:4;
}
.map-shell::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:5;
  pointer-events:none;
  background:
    linear-gradient(90deg, transparent 0 47%, rgba(87,230,196,.08) 49%, transparent 51% 100%),
    linear-gradient(180deg, transparent 0 47%, rgba(217,164,65,.055) 49%, transparent 51% 100%);
  background-size:64px 64px;
  mix-blend-mode:screen;
  opacity:.34;
}
.map-bar,.map-footer{
  position:relative;
  z-index:8;
  display:flex;
  justify-content:space-between;
  gap:1rem;
  padding:1rem 1.1rem;
  background:rgba(18,16,12,.78);
  border-bottom:1px solid rgba(87,230,196,.16);
}
.map-bar h2{
  margin:0;
  max-width:42rem;
  color:var(--cream);
  font:500 clamp(1.15rem,1.72vw,1.6rem)/1.1 var(--font-display);
  text-wrap:balance;
}
.signal{
  align-self:start;
  min-height:44px;
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  flex:0 0 auto;
  color:var(--teal-soft);
  max-width:15.5rem;
  font:700 .61rem/1.25 var(--font-body);
  letter-spacing:.11em;
  text-transform:uppercase;
  padding:.6rem .75rem;
  border:1px solid rgba(87,230,196,.25);
  background:rgba(87,230,196,.065);
  border-radius:999px;
}
.signal-dot{
  width:.62rem;
  height:.62rem;
  border-radius:50%;
  background:var(--teal);
  box-shadow:0 0 0 .35rem rgba(87,230,196,.12),0 0 16px rgba(87,230,196,.72);
  animation:signal-pulse 1.6s ease-in-out infinite;
}
@keyframes signal-pulse{50%{transform:scale(.72);box-shadow:0 0 0 .12rem rgba(87,230,196,.12),0 0 8px rgba(87,230,196,.55)}}

.canvas-field{
  position:relative;
  z-index:6;
  min-height:390px;
  aspect-ratio:1.62/1;
  overflow:hidden;
  --lens-x:50%;
  --lens-y:50%;
  background:
    radial-gradient(circle at 16% 28%, rgba(217,164,65,.12), transparent 18%),
    radial-gradient(circle at 72% 66%, rgba(87,230,196,.12), transparent 24%),
    #090806;
}
.canvas-field::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
  background:linear-gradient(100deg, transparent 0 42%, rgba(87,230,196,.2) 49%, rgba(217,164,65,.16) 50%, transparent 58% 100%);
  mix-blend-mode:screen;
  opacity:0;
  animation:survey-sweep 2.8s cubic-bezier(.18,.86,.2,1) .45s 1 both;
}
@keyframes survey-sweep{
  0%{opacity:0;transform:translateX(-72%)}
  18%{opacity:.75}
  100%{opacity:0;transform:translateX(72%)}
}
#physarumMap{
  display:block;
  width:100%;
  height:100%;
}
.canvas-field::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:2;
  background:
    radial-gradient(circle at center, transparent 0 55%, rgba(0,0,0,.55) 100%),
    linear-gradient(180deg, rgba(217,164,65,.08), transparent 32%, rgba(87,230,196,.06) 100%);
}
.map-node{
  position:absolute;
  left:calc(var(--x) * 1%);
  top:calc(var(--y) * 1%);
  z-index:7;
  transform:translate(-50%,-50%);
  min-width:116px;
  min-height:44px;
  max-width:148px;
  padding:.58rem .7rem .55rem;
  border:1px solid rgba(87,230,196,.38);
  background:
    linear-gradient(180deg, rgba(19,23,16,.9), rgba(8,9,6,.8)),
    rgba(11,14,10,.74);
  color:var(--cream);
  border-radius:0;
  box-shadow:0 0 0 1px rgba(0,0,0,.35),0 0 22px rgba(87,230,196,.16);
  font-family:var(--font-body);
  text-align:left;
  cursor:pointer;
  backdrop-filter:blur(10px);
  transition:transform .22s ease, border-color .22s ease, background-color .22s ease, box-shadow .22s ease;
}
.map-node::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:.56rem;
  height:.56rem;
  translate:-50% -50%;
  border-radius:50%;
  background:var(--teal);
  box-shadow:0 0 0 .45rem rgba(87,230,196,.13),0 0 22px rgba(87,230,196,.8);
}
.map-node span,.map-node small{display:block;position:relative;z-index:1}
.map-node span{
  font:800 .68rem/1.2 var(--font-body);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.map-node small{
  margin-top:.15rem;
  color:var(--amber-2);
  font-size:.62rem;
  line-height:1.15;
}
.map-node:hover,.map-node:focus-visible{
  border-color:var(--amber-2);
  background:rgba(36,31,21,.88);
  transform:translate(-50%,-50%) scale(1.03);
  box-shadow:0 0 0 1px rgba(0,0,0,.35),0 0 30px rgba(217,164,65,.24);
}
.nutrient-pings{
  position:absolute;
  inset:0;
  z-index:9;
  pointer-events:none;
}
.nutrient-ping{
  position:absolute;
  width:1rem;
  height:1rem;
  margin:-.5rem 0 0 -.5rem;
  border:1px solid var(--amber-2);
  border-radius:50%;
  box-shadow:0 0 24px rgba(217,164,65,.82);
  animation:ping 1.2s ease-out forwards;
}
@keyframes ping{to{opacity:0;transform:scale(9)}}
.spore-lens{
  position:absolute;
  left:var(--lens-x);
  top:var(--lens-y);
  z-index:6;
  width:clamp(7.5rem,14vw,12rem);
  aspect-ratio:1;
  translate:-50% -50%;
  pointer-events:none;
  opacity:0;
  transform:scale(.72);
  border:1px solid rgba(167,247,231,.58);
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%, rgba(87,230,196,.3) 0 .16rem, transparent .21rem),
    radial-gradient(circle at 50% 50%, transparent 0 28%, rgba(87,230,196,.18) 28.5% 30%, transparent 30.5% 49%, rgba(217,164,65,.2) 49.5% 50.7%, transparent 51.5%),
    conic-gradient(from 18deg, transparent 0 18deg, rgba(87,230,196,.42) 18deg 22deg, transparent 22deg 148deg, rgba(217,164,65,.38) 148deg 153deg, transparent 153deg 360deg);
  box-shadow:
    0 0 0 .42rem rgba(87,230,196,.08),
    0 0 32px rgba(87,230,196,.32),
    inset 0 0 30px rgba(87,230,196,.12);
  mix-blend-mode:screen;
  transition:opacity .28s var(--ease-out), transform .32s var(--ease-snap);
}
.spore-lens::before,
.spore-lens::after{
  content:"";
  position:absolute;
  inset:14%;
  border:1px solid rgba(87,230,196,.38);
  border-radius:50%;
  animation:lens-breathe 2.4s ease-in-out infinite;
}
.spore-lens::after{
  inset:33%;
  border-color:rgba(217,164,65,.42);
  animation-duration:1.65s;
  animation-direction:reverse;
}
.spore-lens span{
  position:absolute;
  left:50%;
  bottom:.65rem;
  translate:-50% 0;
  white-space:nowrap;
  color:var(--teal-soft);
  text-shadow:0 0 12px rgba(87,230,196,.8),0 1px 6px #000;
  font:900 .55rem/1 var(--font-body);
  letter-spacing:.14em;
  text-transform:uppercase;
}
.canvas-field.is-lensing .spore-lens{
  opacity:.95;
  transform:scale(1);
}
@keyframes lens-breathe{
  50%{transform:scale(.84);opacity:.62}
}
.map-footer{
  align-items:center;
  border-top:1px solid rgba(87,230,196,.16);
  border-bottom:0;
}
.readout span{
  display:block;
  color:var(--muted);
  font:800 .65rem/1 var(--font-body);
  letter-spacing:.13em;
  text-transform:uppercase;
}
.readout strong{
  display:block;
  margin-top:.22rem;
  color:var(--teal-soft);
  font:500 clamp(1rem,1.7vw,1.35rem)/1.2 var(--font-display);
}
.map-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:.45rem;
}
button{
  color:var(--cream);
  font-family:var(--font-body);
}
.map-actions button,.exchange-tabs button{
  min-height:44px;
  border:1px solid rgba(217,164,65,.3);
  background:rgba(217,164,65,.08);
  color:var(--cream);
  padding:.66rem .85rem;
  font:800 .65rem/1 var(--font-body);
  letter-spacing:.12em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background-color .18s var(--ease-out), color .18s var(--ease-out), border-color .18s var(--ease-out), transform .18s var(--ease-out), box-shadow .18s var(--ease-out);
}
.map-actions button:hover,.map-actions button:focus-visible,
.exchange-tabs button:hover,.exchange-tabs button:focus-visible,
.exchange-tabs button.is-active{
  background:var(--amber);
  color:#1a1206;
  border-color:var(--amber-2);
  box-shadow:0 0 28px rgba(217,164,65,.18);
}
.map-actions button:active,.exchange-tabs button:active{transform:translateY(1px)}

.section-head{
  max-width:78rem;
  margin:0 auto clamp(2rem,5vw,3.4rem);
}
h2{
  margin:0;
  color:var(--cream);
  font:500 clamp(2.4rem,6vw,5.6rem)/.95 var(--font-display);
  letter-spacing:0;
  text-wrap:balance;
  font-optical-sizing:auto;
}
h2 em{font-style:italic;color:var(--teal)}
h3{
  margin:.25rem 0 .65rem;
  color:var(--cream);
  font:500 clamp(1.35rem,2vw,1.85rem)/1.08 var(--font-display);
  text-wrap:balance;
  font-optical-sizing:auto;
}
p{max-width:68ch;text-wrap:pretty}

.briefing{
  background:
    radial-gradient(circle at 12% 38%, rgba(87,230,196,.13), transparent 24rem),
    radial-gradient(circle at 90% 6%, rgba(217,164,65,.12), transparent 24rem),
    linear-gradient(180deg, rgba(148,184,111,.06), rgba(18,16,12,.1));
  border-top:1px solid rgba(240,230,207,.1);
  border-bottom:1px solid rgba(240,230,207,.1);
}
.brief-grid{
  max-width:78rem;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.08fr .92fr 1fr;
  gap:1rem;
}
.brief-card{
  position:relative;
  min-height:22rem;
  padding:1.35rem;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:1rem;
  overflow:hidden;
  background:
    radial-gradient(circle at 30% 20%, rgba(87,230,196,.18), transparent 16rem),
    linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.018));
  border:1px solid rgba(240,230,207,.14);
}
.brief-card:nth-child(2){margin-top:2.5rem;background:radial-gradient(circle at 70% 20%, rgba(217,164,65,.18), transparent 16rem),linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.018))}
.brief-card:nth-child(3){margin-top:1rem;background:radial-gradient(circle at 35% 65%, rgba(148,184,111,.2), transparent 15rem),linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.018))}
.brief-card::before{
  content:"";
  position:absolute;
  inset:1rem 1rem auto auto;
  width:4.5rem;
  height:4.5rem;
  border:1px solid rgba(87,230,196,.28);
  background:repeating-radial-gradient(circle, rgba(87,230,196,.18) 0 1px, transparent 1px 8px);
  opacity:.7;
}
.brief-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, transparent 0 22%, rgba(87,230,196,.1) 22.2% 22.5%, transparent 22.8%),
    linear-gradient(160deg, transparent 0 56%, rgba(217,164,65,.12) 56.2% 56.5%, transparent 56.8%),
    repeating-linear-gradient(180deg, transparent 0 2.8rem, rgba(240,230,207,.04) 2.85rem 2.9rem);
  opacity:.7;
}
.card-index{
  position:absolute;
  top:1.2rem;
  left:1.2rem;
  color:var(--amber-2);
  font:500 2.9rem/.8 var(--font-display);
  opacity:.8;
}
.brief-card > *{position:relative;z-index:1}
.brief-card p,.exchange-copy p,.note p,.protocol-panel p,.guide-panel p,.guide-panel li{color:#d3c8b1}
.brief-readings{
  margin-top:auto;
  padding-top:.8rem;
  border-top:1px solid rgba(240,230,207,.12);
}
.brief-readings span{
  display:flex;
  justify-content:space-between;
  gap:.8rem;
  color:var(--muted);
  font:800 .65rem/1.2 var(--font-body);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.brief-readings b{
  color:var(--teal-soft);
  font-size:.9rem;
}
.brief-readings i{
  display:block;
  height:.28rem;
  width:100%;
  margin-top:.55rem;
  background:linear-gradient(90deg, var(--teal) var(--p), rgba(240,230,207,.12) var(--p));
  box-shadow:0 0 18px rgba(87,230,196,.22);
}

.exchange{
  display:grid;
  grid-template-columns:minmax(18rem,.55fr) minmax(0,1fr);
  gap:clamp(1.5rem,5vw,4rem);
  align-items:center;
}
.exchange-copy p{font-size:1rem}
.exchange-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  margin:1.5rem 0;
}
.contract{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.5rem;
  margin:0;
}
.contract div{
  padding:.85rem;
  border:1px solid rgba(87,230,196,.2);
  background:rgba(87,230,196,.055);
}
.contract dt{
  color:var(--muted);
  font:800 .62rem/1.2 var(--font-body);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.contract dd{
  margin:.25rem 0 0;
  color:var(--teal-soft);
  font:500 1.35rem/1 var(--font-display);
}
.exchange-note{
  margin:.9rem 0 0;
  max-width:38rem;
  color:var(--muted);
  font-size:.88rem;
}
.exchange-figure{
  margin:0;
  position:relative;
}
#exchangeDiagram{
  width:100%;
  display:block;
  overflow:visible;
  filter:drop-shadow(0 28px 60px rgba(0,0,0,.45));
}
.diagram-frame{
  fill:rgba(15,13,9,.82);
  stroke:rgba(87,230,196,.24);
  stroke-width:2;
}
.soil-band{fill:rgba(51,41,22,.78);stroke:rgba(217,164,65,.22);stroke-width:2}
.trunk{fill:#4f3520;stroke:#d6ba76;stroke-width:2}
.canopy{fill:rgba(83,109,59,.68);stroke:#b9d48c;stroke-width:2}
.leaf-vein,.roots,.gill,.hyphae{fill:none;stroke:#b9d48c;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.roots{stroke:#d7bd78}
.fungal-body{fill:url(#capGradient);stroke:#f0d58c;stroke-width:2;filter:url(#softGlow);opacity:.92}
.gill{stroke:#1a1206;stroke-width:2;opacity:.65}
.hyphae{stroke:var(--teal-soft);stroke-width:2.5}
.exchange-flow{
  fill:none;
  stroke-width:9;
  stroke-linecap:round;
  stroke-dasharray:2 26;
  animation:flow-dash 1.45s linear infinite;
  filter:url(#softGlow);
}
.flow-carbon{stroke:#d9a441;animation-duration:1.8s}
.flow-water{stroke:#57e6c4;animation-duration:1.35s}
.flow-phos{stroke:#94b86f;animation-duration:1.55s}
.flow-alarm{stroke:#f0c86d;animation-duration:.95s}
.exchange[data-flow="mast"] .flow-carbon{stroke-width:13;animation-duration:1.25s}
.exchange[data-flow="mast"] .flow-water{stroke-width:6;opacity:.68}
.exchange[data-flow="scar"] .flow-water{stroke-width:13;animation-duration:1.05s}
.exchange[data-flow="scar"] .flow-alarm{stroke-width:12}
.exchange[data-flow="drought"] .flow-alarm{stroke-width:12;animation-duration:.78s}
.diagram-labels text{
  fill:#f0e6cf;
  font:800 18px var(--font-body);
  letter-spacing:.08em;
  text-transform:uppercase;
}
@keyframes flow-dash{to{stroke-dashoffset:-56}}

.notes{
  background:
    radial-gradient(circle at 15% 12%, rgba(87,230,196,.09), transparent 24rem),
    radial-gradient(circle at 80% 85%, rgba(217,164,65,.1), transparent 24rem);
}
.notes-grid{
  max-width:78rem;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:1rem;
}
.note{
  position:relative;
  min-height:15.5rem;
  padding:1.25rem;
  border:1px solid rgba(240,230,207,.15);
  background:
    linear-gradient(90deg, transparent 0 calc(100% - 3.2rem), rgba(87,230,196,.055) calc(100% - 3.16rem) calc(100% - 3.1rem), transparent calc(100% - 3.04rem)),
    linear-gradient(180deg, rgba(255,255,255,.062), rgba(255,255,255,.016)),
    radial-gradient(circle at 80% 15%, rgba(87,230,196,.12), transparent 12rem);
  overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
  transition:transform .24s var(--ease-out), border-color .24s var(--ease-out), box-shadow .24s var(--ease-out), background-color .24s var(--ease-out);
}
.note::before{
  content:"";
  position:absolute;
  right:-2.5rem;
  bottom:-2.8rem;
  width:13rem;
  height:13rem;
  pointer-events:none;
  opacity:.42;
  background:
    radial-gradient(circle, rgba(87,230,196,.34) 0 .12rem, transparent .16rem),
    repeating-radial-gradient(circle, transparent 0 1rem, rgba(87,230,196,.18) 1.04rem 1.08rem, transparent 1.12rem 1.9rem);
  filter:drop-shadow(0 0 18px rgba(87,230,196,.22));
}
.note::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(125deg, transparent 0 52%, rgba(87,230,196,.13) 52.2% 52.5%, transparent 52.8%),
    linear-gradient(28deg, transparent 0 59%, rgba(217,164,65,.1) 59.2% 59.45%, transparent 59.7%);
  opacity:.65;
}
.note > *{position:relative;z-index:1}
.note:hover{
  transform:translateY(-.18rem);
  border-color:rgba(87,230,196,.34);
  box-shadow:0 18px 44px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.075),0 0 34px rgba(87,230,196,.08);
}
.note.large{grid-row:span 2;min-height:29rem;padding:1.6rem}
.note.large::before{width:20rem;height:20rem;right:-4rem;bottom:-4rem;opacity:.5}
.note time{
  color:var(--amber-2);
  font:800 .68rem/1 var(--font-body);
  letter-spacing:.14em;
  text-transform:uppercase;
  font-variant-numeric:tabular-nums lining-nums;
}
.note.large h3{font-size:clamp(2rem,4vw,3.9rem)}
.note-tag{
  position:absolute;
  left:1.25rem;
  bottom:1.1rem;
  color:var(--teal-soft);
  font:800 .62rem/1 var(--font-body);
  letter-spacing:.13em;
  text-transform:uppercase;
}

.ledger{
  border-top:1px solid rgba(240,230,207,.1);
}
.ledger-table{
  max-width:78rem;
  margin:0 auto;
  border:1px solid rgba(87,230,196,.26);
  background:
    linear-gradient(90deg, rgba(87,230,196,.035) 1px, transparent 1px),
    rgba(10,9,6,.62);
  background-size:4rem 100%, auto;
  box-shadow:0 24px 70px rgba(0,0,0,.28);
}
.ledger-row{
  display:grid;
  grid-template-columns:1.25fr .7fr 1.6fr .55fr;
  gap:1rem;
  align-items:center;
  padding:1rem 1.15rem;
  border-top:1px solid rgba(240,230,207,.1);
  transition:background-color .2s var(--ease-out), transform .2s var(--ease-out), box-shadow .2s var(--ease-out);
}
.ledger-row:first-child{border-top:0}
.ledger-head{
  color:#1a1206;
  background:linear-gradient(90deg,var(--teal),var(--amber));
  font:800 .68rem/1.2 var(--font-body);
  letter-spacing:.13em;
  text-transform:uppercase;
}
.ledger-row span{min-width:0}
.ledger-row em{
  display:block;
  color:var(--cream);
  font:italic 500 1.28rem/1.08 var(--font-display);
}
.ledger-row small{
  display:block;
  color:var(--muted);
  margin-top:.22rem;
}
.ledger-row:not(.ledger-head) span:nth-child(2),
.ledger-row:not(.ledger-head) span:nth-child(4){
  color:var(--teal-soft);
  font-weight:800;
}
.ledger-row:not(.ledger-head):hover{
  background:rgba(87,230,196,.06);
  transform:translateX(.25rem);
  box-shadow:inset .22rem 0 0 var(--teal);
}
.reliability{
  display:block;
  min-width:5rem;
  color:var(--teal-soft);
  font-weight:800;
  font-variant-numeric:tabular-nums;
}
.reliability::after{
  content:"";
  display:block;
  width:calc(var(--score) * 1%);
  max-width:100%;
  height:.36rem;
  margin-top:.35rem;
  background:linear-gradient(90deg, var(--teal), var(--amber));
  box-shadow:0 0 16px rgba(87,230,196,.3);
}

.protocol{
  padding-bottom:clamp(5rem,10vw,9rem);
}
.protocol-panel{
  position:relative;
  max-width:78rem;
  margin:0 auto;
  padding:clamp(1.25rem,4vw,3rem);
  display:grid;
  grid-template-columns:minmax(0,.68fr) minmax(16rem,.32fr);
  gap:clamp(1.2rem,4vw,3rem);
  align-items:center;
  border:1px solid rgba(217,164,65,.26);
  background:
    radial-gradient(circle at 85% 10%, rgba(217,164,65,.16), transparent 20rem),
    linear-gradient(135deg, rgba(87,230,196,.08), rgba(255,255,255,.025));
  box-shadow:0 26px 70px rgba(0,0,0,.35);
  overflow:hidden;
}
.protocol-panel::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.42;
  background:
    linear-gradient(112deg, transparent 0 44%, rgba(87,230,196,.13) 44.2% 44.45%, transparent 44.7%),
    repeating-linear-gradient(90deg, transparent 0 5.8rem, rgba(217,164,65,.04) 5.85rem 5.9rem);
}
.protocol-panel > *{position:relative;z-index:1}
.protocol-copy{min-width:0}
.method-list{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.8rem;
  margin:1.5rem 0 0;
  padding:0;
  list-style:none;
}
.method-list li{
  padding:1rem;
  border-left:2px solid var(--teal);
  background:rgba(18,16,12,.58);
  color:#d5cab5;
}
.method-list strong{display:block;color:var(--amber-2)}
.method-orbit{
  position:relative;
  min-height:22rem;
  border:1px solid rgba(87,230,196,.25);
  background:
    radial-gradient(circle at 50% 48%, rgba(87,230,196,.14), transparent 48%),
    repeating-radial-gradient(circle at 50% 50%, transparent 0 2.5rem, rgba(87,230,196,.12) 2.55rem 2.62rem);
  box-shadow:inset 0 0 60px rgba(87,230,196,.08), 0 0 42px rgba(87,230,196,.08);
}
.method-orbit::before,.method-orbit::after{
  content:"";
  position:absolute;
  inset:11% 12%;
  border:1px solid rgba(217,164,65,.22);
  transform:rotate(28deg);
}
.method-orbit::after{
  inset:23% 20%;
  border-color:rgba(87,230,196,.24);
  transform:rotate(-18deg);
}
.method-orbit span{
  position:absolute;
  left:calc(var(--x) * 1%);
  top:calc(var(--y) * 1%);
  width:2.5rem;
  height:2.5rem;
  display:grid;
  place-items:center;
  translate:-50% -50%;
  color:#120e07;
  background:var(--teal);
  box-shadow:0 0 0 .55rem rgba(87,230,196,.12),0 0 22px rgba(87,230,196,.54);
  font:900 .72rem/1 var(--font-body);
  letter-spacing:.08em;
  border-radius:50%;
}
.method-orbit span:nth-child(even){
  background:var(--amber);
  box-shadow:0 0 0 .55rem rgba(217,164,65,.12),0 0 22px rgba(217,164,65,.45);
}

.site-footer{
  position:relative;
  z-index:1;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:.6rem 1rem;
  padding:1.4rem clamp(1rem,5vw,4rem) 1.7rem;
  color:var(--muted);
  background:#0a0806;
  border-top:1px solid rgba(87,230,196,.18);
  font:700 .72rem/1.4 var(--font-body);
  letter-spacing:.1em;
  text-transform:uppercase;
}
.site-footer a{
  color:var(--teal-soft);
  min-height:44px;
  display:inline-flex;
  align-items:center;
  text-decoration:none;
  border-bottom:1px solid rgba(87,230,196,.35);
}
.site-footer a:hover,.site-footer a:focus-visible{color:var(--amber-2);border-bottom-color:var(--amber-2)}

.load-rise{
  opacity:0;
  transform:translateY(22px);
  animation:load-rise .9s cubic-bezier(.2,.8,.2,1) forwards;
  animation-delay:calc(.12s + var(--d,0) * .13s);
}
@keyframes load-rise{to{opacity:1;transform:none}}
.reveal{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .75s ease, transform .75s cubic-bezier(.2,.8,.2,1);
  transition-delay:calc(var(--reveal-i,0) * 55ms);
}
.reveal.is-visible{opacity:1;transform:none}
.reveal.is-visible.note:hover{
  transform:translateY(-.18rem);
  transition-delay:0ms;
}

/* Guide route */
.guide-main{
  padding:clamp(2.5rem,7vw,6rem) clamp(1rem,5vw,4rem) clamp(4rem,8vw,7rem);
}
.guide-hero{
  max-width:76rem;
  margin:0 auto clamp(2rem,5vw,4rem);
  display:grid;
  grid-template-columns:minmax(0,.64fr) minmax(17rem,.36fr);
  gap:clamp(1.2rem,5vw,4rem);
  align-items:center;
  min-height:calc(66svh - var(--header-h));
  align-content:center;
}
.guide-hero-copy{min-width:0}
.guide-hero h1{
  margin:0;
  max-width:11.5ch;
  font:500 clamp(4rem,9vw,8.8rem)/.8 var(--font-display);
  text-wrap:balance;
}
.guide-hero h1 em{display:block;color:var(--teal);font-style:italic}
.guide-hero p{
  margin:1rem 0 0;
  color:#d6cab4;
  font-size:clamp(1rem,1.55vw,1.25rem);
}
.guide-specimen{
  position:relative;
  min-height:22rem;
  display:grid;
  align-content:end;
  padding:1rem;
  border:1px solid rgba(87,230,196,.26);
  background:
    radial-gradient(circle at 40% 35%, rgba(87,230,196,.16), transparent 14rem),
    radial-gradient(circle at 80% 18%, rgba(217,164,65,.14), transparent 12rem),
    rgba(9,8,6,.58);
  box-shadow:0 28px 70px rgba(0,0,0,.42), inset 0 0 60px rgba(87,230,196,.06);
  overflow:hidden;
}
.guide-specimen::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(87,230,196,.1) 1px, transparent 1px),
    linear-gradient(180deg, rgba(217,164,65,.07) 1px, transparent 1px);
  background-size:3rem 3rem;
  opacity:.45;
}
.guide-specimen svg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  filter:drop-shadow(0 0 20px rgba(87,230,196,.2));
}
.guide-specimen circle{
  fill:var(--teal);
  filter:drop-shadow(0 0 12px rgba(87,230,196,.7));
}
.guide-specimen circle:nth-of-type(even){fill:var(--amber)}
.specimen-vein{
  fill:none;
  stroke-width:9;
  stroke-linecap:round;
  stroke-dasharray:1 22;
  animation:flow-dash 1.6s linear infinite;
}
.specimen-vein.teal{stroke:var(--teal)}
.specimen-vein.amber{stroke:var(--amber);animation-duration:1.2s}
.specimen-vein.moss{stroke:var(--moss);animation-duration:2s}
.guide-specimen span{
  position:relative;
  z-index:1;
  color:var(--teal-soft);
  font:800 .65rem/1.3 var(--font-body);
  letter-spacing:.14em;
  text-transform:uppercase;
}
.guide-specimen:hover .specimen-vein{stroke-dasharray:1 15}
.guide-specimen:hover circle{filter:drop-shadow(0 0 18px rgba(87,230,196,.88))}
.guide-panel{
  max-width:76rem;
  margin:0 auto;
  padding:clamp(1.2rem,4vw,3rem);
  border:1px solid rgba(87,230,196,.25);
  background:
    radial-gradient(circle at 88% 8%, rgba(87,230,196,.14), transparent 20rem),
    radial-gradient(circle at 8% 96%, rgba(217,164,65,.13), transparent 20rem),
    rgba(13,11,8,.74);
  box-shadow:0 24px 70px rgba(0,0,0,.4);
  position:relative;
  overflow:hidden;
}
.guide-panel::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, transparent 0 18%, rgba(87,230,196,.09) 18.2% 18.35%, transparent 18.55%),
    linear-gradient(150deg, transparent 0 64%, rgba(217,164,65,.08) 64.2% 64.45%, transparent 64.7%);
  opacity:.75;
}
.guide-panel > *{position:relative;z-index:1}
.guide-panel h2{
  font-size:clamp(2rem,5vw,4.2rem);
  margin-top:2.3rem;
}
.guide-panel h2:first-child{margin-top:0}
.guide-panel p,.guide-panel li{font-size:1rem}
.guide-panel ul,.guide-panel ol{padding-left:1.2rem}
.guide-panel li{margin:.65rem 0}
.guide-panel code{
  color:var(--teal-soft);
  background:rgba(87,230,196,.09);
  border:1px solid rgba(87,230,196,.18);
  padding:.08rem .28rem;
  font-family:var(--font-body);
}
.token-row{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.6rem;
  margin:1rem 0 0;
}
.token{
  min-height:6rem;
  padding:.8rem;
  display:flex;
  align-items:end;
  border:1px solid rgba(255,255,255,.16);
  color:#fff;
  text-shadow:0 1px 8px rgba(0,0,0,.9);
  box-shadow:inset 0 -4.6rem 3.4rem rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.08);
  font:800 .68rem/1.25 var(--font-body);
  letter-spacing:.1em;
  text-transform:uppercase;
}
.token.humus{background:#12100c}
.token.teal{background:#157d6d}
.token.amber{background:#9b6810}
.token.moss{background:#536d3b}

@media (max-width:1040px){
  .hero,.exchange,.guide-hero{grid-template-columns:1fr}
  .hero{min-height:auto}
  .hero-copy{max-width:48rem}
  .map-shell{max-width:58rem;width:100%;justify-self:center}
  .protocol-panel{grid-template-columns:1fr}
  .method-orbit{min-height:18rem}
  .brief-grid{grid-template-columns:1fr 1fr}
  .brief-card:nth-child(3){grid-column:1/-1;min-height:16rem}
  .notes-grid{grid-template-columns:1fr}
  .note.large{grid-row:auto;min-height:25rem}
}

@media (max-width:760px){
  :root{--header-h:112px}
  .site-header{
    align-items:stretch;
    flex-direction:column;
    gap:.55rem;
    padding:.65rem .8rem .75rem;
  }
  .brand{justify-content:center}
  .site-nav{
    width:100%;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:.3rem;
  }
  .site-nav a{
    justify-content:center;
    padding:.68rem .35rem;
    font-size:.62rem;
    border-color:rgba(240,230,207,.12);
  }
  section{padding:3.5rem 1rem}
  .hero h1{font-size:clamp(3.9rem,17.2vw,6.25rem)}
  .hero h1 em{margin-left:.8rem}
  .hero .eyebrow{font-size:.62rem;line-height:1.55;letter-spacing:.12em}
  .hero-stats{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:.35rem;
  }
  .hero-stats div{padding:.72rem .55rem}
  .hero-stats dt{font-size:.52rem;letter-spacing:.08em}
  .hero-stats dd{font-size:1.08rem}
  .contract,.method-list,.token-row{grid-template-columns:1fr}
  .guide-specimen{min-height:18rem}
  .map-bar,.map-footer{
    flex-direction:column;
    align-items:stretch;
  }
  .signal{align-self:flex-start}
  .canvas-field{min-height:480px;aspect-ratio:auto}
  .map-node{
    min-width:88px;
    max-width:106px;
    padding:.52rem .58rem;
  }
  .map-node span{font-size:.59rem}
  .map-node small{display:none}
  .map-node::before{width:.45rem;height:.45rem}
  .spore-lens{width:8.25rem}
  .map-actions{justify-content:flex-start}
  .brief-grid{grid-template-columns:1fr}
  .brief-card,.brief-card:nth-child(2),.brief-card:nth-child(3){
    min-height:16rem;
    margin-top:0;
  }
  .exchange-tabs{display:grid;grid-template-columns:1fr}
  .ledger-table{border:0;background:transparent}
  .ledger-head{display:none}
  .ledger-row{
    grid-template-columns:1fr;
    gap:.45rem;
    margin-bottom:.75rem;
    padding:1rem;
    border:1px solid rgba(87,230,196,.24);
    background:rgba(10,9,6,.62);
  }
  .ledger-row span:nth-child(2)::before{content:"Signal: ";color:var(--muted)}
  .ledger-row span:nth-child(3)::before{content:"Bargain: ";color:var(--muted);font-weight:800}
  .ledger-row span:nth-child(4)::before{content:"Reliability: ";color:var(--muted)}
  .note.large{min-height:22rem}
  .site-footer{
    flex-direction:column;
    align-items:center;
    text-align:center;
  }
}

@media (max-width:430px){
  body{font-size:15px}
  .brand{font-size:.68rem;letter-spacing:.11em}
  .brand-mark{width:36px;height:36px}
  .hero{padding-left:.8rem;padding-right:.8rem}
  .hero h1{font-size:clamp(3.55rem,15.7vw,4.4rem)}
  .hero-deck{font-size:.98rem}
  h2{font-size:clamp(2.28rem,13vw,3.45rem)}
  .map-shell::before{margin:6px}
  .map-bar,.map-footer{padding:.85rem}
  .canvas-field{min-height:500px}
  .diagram-labels text{font-size:24px}
  .guide-main{padding-left:.85rem;padding-right:.85rem}
  .guide-hero{min-height:auto;align-content:center}
  .guide-specimen{min-height:15rem}
  .specimen-vein{stroke-width:7}
  .spore-lens span{font-size:.5rem}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
  .exchange-flow{stroke-dasharray:12 18}
}