:root{--world-veil:rgba(241,244,240,.74)}
.webgl-world{position:fixed;z-index:0;inset:0;overflow:hidden;pointer-events:none;background:linear-gradient(145deg,var(--canvas),var(--nav))}
.webgl-world canvas{display:block;width:100%;height:100%}
.world-fallback{position:absolute;inset:0;background:radial-gradient(circle at 72% 28%,rgba(252,252,250,.8),transparent 28%),linear-gradient(145deg,var(--canvas),var(--nav))}
.webgl-world canvas+.world-fallback{display:none}
.webgl-world:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(241,244,240,.88),rgba(241,244,240,.42) 47%,rgba(241,244,240,.06) 75%),linear-gradient(0deg,rgba(241,244,240,.45),transparent 42%);mix-blend-mode:normal}
.page,.home-sections,.journal-main,.article-view{position:relative;z-index:3}
.home-main,.philosophy-cover,.roadmap-hero,.about-main{isolation:isolate}
.home-main:before,.philosophy-cover:before,.roadmap-hero:before,.about-main:before{content:'';position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,rgba(241,244,240,.24),transparent 74%)}
body[data-page=home] .home-prologue,body[data-page=home] .detail-band,body[data-page=home] .portal-section{background:rgba(241,244,240,.9);backdrop-filter:blur(14px)}
body[data-page=home] .complexity-section{background:linear-gradient(180deg,rgba(232,237,232,.78),rgba(241,244,240,.9));backdrop-filter:blur(9px)}
body[data-page=home] .boundary-section{background:rgba(80,100,87,.92)}
body[data-page=philosophy] .philosophy-summary{position:relative;background:rgba(241,244,240,.92);backdrop-filter:blur(16px)}
body[data-page=philosophy] .webgl-world:after{background:linear-gradient(90deg,rgba(241,244,240,.91),rgba(241,244,240,.43) 50%,transparent 78%)}
body[data-page=about] .webgl-world:after{background:linear-gradient(90deg,rgba(241,244,240,.92),rgba(241,244,240,.38) 55%,rgba(241,244,240,.04))}
body[data-page=about] .about-main{min-height:280svh;align-items:start;padding-top:22svh}
body[data-page=about] .about-identity{position:sticky;top:22svh}
body[data-page=about] .about-note{position:sticky;top:54svh}
body[data-page=roadmap] .webgl-world:after{background:linear-gradient(90deg,rgba(241,244,240,.38),rgba(241,244,240,.06) 53%,rgba(241,244,240,.25)),linear-gradient(0deg,rgba(241,244,240,.48),transparent 46%)}
body[data-page=roadmap] .roadmap-page{background:linear-gradient(180deg,transparent,rgba(241,244,240,.06) 25%,rgba(241,244,240,.48) 86%,var(--canvas))}
body[data-page=roadmap] .milestone-card{background:rgba(243,246,242,.82);backdrop-filter:blur(17px) saturate(.75)}
body[data-page=roadmap] .roadmap-hero .display span{color:var(--accent-active);font-style:normal;-webkit-text-stroke:0}
body[data-page=roadmap] .milestone{--trail-link:var(--outline)}
body[data-page=roadmap] .milestone.is-complete{--trail-link:var(--success)}
body[data-page=roadmap] .milestone.is-current{--trail-link:var(--warning)}
body[data-page=roadmap] .milestone-card{
  position:relative;
  border:1px solid rgba(216,222,216,.94);
  border-radius:8px;
  background:rgba(248,249,246,.94);
  box-shadow:0 18px 48px rgba(80,100,87,.09),inset 0 1px rgba(252,252,250,.9);
  backdrop-filter:blur(10px);
  transition:border-color .45s,box-shadow .45s,filter .45s;
}
body[data-page=roadmap] .milestone:not(.is-near) .milestone-card{filter:saturate(.72)}
body[data-page=roadmap] .milestone.is-near .milestone-card{
  border-color:var(--trail-link);
  box-shadow:0 24px 62px rgba(80,100,87,.16),inset 0 1px rgba(252,252,250,.95);
}
body[data-page=roadmap] .milestone-card:before{
  content:'';
  position:absolute;
  top:50%;
  width:clamp(3.5rem,10vw,10rem);
  height:2px;
  background:linear-gradient(90deg,transparent,var(--trail-link));
  opacity:.24;
  transition:opacity .4s,transform .55s var(--ease);
  transform:scaleX(.55);
}
body[data-page=roadmap] .milestone-card:after{
  content:'';
  position:absolute;
  top:calc(50% - .3rem);
  width:.6rem;height:.6rem;
  border:2px solid var(--trail-link);
  border-radius:50%;
  background:var(--surface);
  opacity:.35;
  transition:opacity .4s,transform .5s var(--ease);
}
body[data-page=roadmap] .milestone:nth-child(odd) .milestone-card:before{right:100%;transform-origin:right}
body[data-page=roadmap] .milestone:nth-child(odd) .milestone-card:after{right:calc(100% + clamp(3.2rem,9.7vw,9.7rem))}
body[data-page=roadmap] .milestone:nth-child(even) .milestone-card:before{left:100%;background:linear-gradient(90deg,var(--trail-link),transparent);transform-origin:left}
body[data-page=roadmap] .milestone:nth-child(even) .milestone-card:after{left:calc(100% + clamp(3.2rem,9.7vw,9.7rem))}
body[data-page=roadmap] .milestone.is-near .milestone-card:before,
body[data-page=roadmap] .milestone.is-near .milestone-card:after{opacity:.9;transform:scale(1)}
body[data-page=roadmap] .milestone.is-current .milestone-card{border-color:var(--warning)}
body[data-page=roadmap] .milestone.is-current .stage{color:#927442}

body[data-page=blog]{background:var(--canvas)}
body[data-page=blog] .journal-main{background:radial-gradient(circle at 84% 14%,rgba(113,139,124,.15),transparent 28%),linear-gradient(180deg,var(--canvas),var(--surface))}
.article-view[hidden],.journal-view[hidden]{display:none}
.article-page .nav{background:rgba(232,237,232,.9)}
.article-view{min-height:100vh;padding:clamp(8rem,14vw,12rem) var(--gutter) 8rem;background:radial-gradient(circle at 78% 4%,rgba(113,139,124,.13),transparent 25%),var(--canvas)}
.article-visual-title{display:none}
.article-shell{display:block;max-width:78rem;margin:auto}
.article-page .article{width:min(100%,48rem);margin:0 auto;padding:clamp(2rem,5vw,4.5rem);background:rgba(252,252,250,.88);border:1px solid rgba(216,222,216,.8);border-radius:1.35rem;box-shadow:var(--soft-shadow);backdrop-filter:blur(12px)}
.article .article-heading{display:block;margin:0 0 clamp(3rem,7vw,5rem);padding-bottom:2.2rem;border-bottom:1px solid var(--divider)}
.article-heading .article-eyebrow{display:flex;gap:.75rem;align-items:center;margin-bottom:1.2rem;color:var(--secondary);font-size:.68rem;text-transform:uppercase;letter-spacing:.14em}
.article-heading .article-eyebrow span+span:before{content:'·';margin-right:.75rem;color:var(--muted)}
.article-heading h1{max-width:12ch;margin:0;font-size:clamp(3rem,7vw,6.6rem);font-weight:330;line-height:.94;letter-spacing:-.065em}
.article-heading>p{margin-top:1.4rem;color:var(--secondary)}
.article-aside{position:fixed;z-index:12;left:max(1rem,calc((100vw - 70rem)/2));bottom:1.5rem;display:flex;align-items:center;gap:.65rem}
.article-aside>span,.article-aside>b{display:none}
.article-toolbar{display:flex;gap:.6rem}
.copy-link,.back-to-journal{display:inline-flex;min-height:2.8rem;align-items:center;padding:.68rem 1rem;border:1px solid rgba(216,222,216,.95);border-radius:.9rem;background:rgba(243,246,242,.93);box-shadow:var(--soft-shadow-small);color:var(--ink);font:inherit;font-size:.75rem;text-decoration:none;cursor:pointer;backdrop-filter:blur(12px);transition:transform .25s var(--ease),background .25s,color .25s}
.copy-link:hover,.back-to-journal:hover{transform:translateY(-2px);background:var(--elevated)}
.copy-link.is-copied{background:var(--accent);color:var(--elevated)}
.article table{display:block;overflow-x:auto}.article input[type=checkbox]{accent-color:var(--accent);margin-right:.55rem}
.article li:has(>input[type=checkbox]){list-style:none;margin-left:-1.4rem}

@media(max-width:800px){
  .webgl-world:after{background:linear-gradient(90deg,rgba(241,244,240,.82),rgba(241,244,240,.32)),linear-gradient(0deg,rgba(241,244,240,.36),transparent)}
  .article-view{padding-inline:1rem;padding-bottom:7rem}.article-page .article{padding:2rem 1.35rem;border-radius:1rem}
  .article-aside{left:50%;bottom:max(.8rem,env(safe-area-inset-bottom));transform:translateX(-50%);white-space:nowrap}
  body[data-page=about] .about-main{min-height:230svh;padding-top:18svh}
  body[data-page=about] .about-identity{top:18svh}
  body[data-page=about] .about-note{top:58svh}
  body[data-page=roadmap] .milestone-card:before,
  body[data-page=roadmap] .milestone-card:after{display:none}
}
@media(prefers-reduced-motion:reduce){.webgl-world canvas{opacity:.8}}

/* Roadmap focus stops: the trail holds while each sign opens and closes. */
body[data-page=roadmap] .site-header{z-index:220}
body[data-page=roadmap] .site-header .brand img.brand-mark{
  width:48px;
  height:48px;
  padding:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  object-fit:contain;
}
body[data-page=roadmap] .roadmap-hero{
  height:100svh;
  min-height:40rem;
  justify-content:flex-end;
  padding-top:8rem;
  padding-bottom:clamp(2.5rem,6vh,4.5rem);
  overflow:visible;
}
body[data-page=roadmap] .roadmap-hero .display{line-height:.9}
body[data-page=roadmap] .journey{padding-bottom:18vh}
body[data-page=roadmap] .milestone{min-height:170svh;pointer-events:none}
body[data-page=roadmap].has-roadmap-focus .milestone-card{opacity:0!important;visibility:hidden}
.roadmap-focus{
  --sign-focus:0;
  --sign-edge:var(--outline);
  position:fixed;
  z-index:18;
  inset:0;
  display:grid;
  place-items:center;
  padding:clamp(5.5rem,9vw,8rem) clamp(1rem,5vw,4rem) clamp(1rem,5vw,4rem);
  opacity:var(--sign-focus);
  pointer-events:none;
}
.roadmap-focus[aria-hidden=true]{visibility:hidden}
.roadmap-focus:before{
  content:'';
  position:absolute;
  inset:0;
  background:rgba(232,237,232,.72);
  backdrop-filter:blur(12px);
}
.roadmap-focus.is-complete{--sign-edge:var(--success)}
.roadmap-focus.is-current{--sign-edge:var(--warning)}
.roadmap-focus-sign{
  position:relative;
  width:min(90vw,68rem);
  min-height:min(72svh,43rem);
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(2rem,7vw,7rem);
  border:clamp(3px,.55vw,8px) solid var(--sign-edge);
  border-radius:14px;
  background:rgba(248,249,246,.97);
  box-shadow:0 35px 100px rgba(54,67,58,.2),inset 0 1px rgba(255,255,255,.95);
  transform:scale(calc(.14 + var(--sign-focus) * .86));
  transform-origin:center 72%;
}
.roadmap-focus-stage{
  margin:0 0 clamp(1.3rem,3vw,2.6rem);
  color:var(--sign-edge);
  font-size:.72rem;
  font-weight:650;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.roadmap-focus h2{
  max-width:13ch;
  margin:0;
  font-family:Geist,system-ui,sans-serif;
  font-size:clamp(2.8rem,7vw,7.2rem);
  font-weight:350;
  line-height:.94;
  letter-spacing:-.065em;
}
.roadmap-focus-description{
  max-width:45rem;
  margin:clamp(1.5rem,4vw,3rem) 0 0;
  color:var(--secondary);
  font-size:clamp(1rem,1.6vw,1.3rem);
  line-height:1.75;
}
.journey-end .button{margin-top:2rem}
body[data-page=roadmap] .milestone-card{border-radius:14px}
.roadmap-focus-hint{
  position:absolute;
  right:clamp(1.5rem,4vw,3rem);
  bottom:clamp(1.3rem,3vw,2.4rem);
  margin:0;
  color:var(--muted);
  font-size:.64rem;
  letter-spacing:.12em;
  text-transform:uppercase;
}
@media(max-width:800px){
  body[data-page=roadmap] .milestone{min-height:150svh}
  .roadmap-focus-sign{width:94vw;min-height:70svh;padding:2rem 1.5rem 5rem}
  .roadmap-focus-description{margin-left:0}
}