body.home-page { --bg:#101319; --panel:#171b24; --line:#282d38; --muted:#9094a3; --ink:#eeedf3; --accent:#b8a3f2; --path-red:#ee7e86; --path-green:#7bdfb5; --button-ink:#17131f; background:var(--bg); }
.home-header { height:100px; max-width:1500px; margin:auto; display:flex; align-items:center; justify-content:space-between; padding:0 64px; border-bottom:1px solid var(--line); gap:35px; }
.home-header .brand { font-size:30px; font-weight:500; gap:10px; }
.home-header .orbit-brand { width:46px; height:46px; }
.home-header nav { display:flex; gap:35px; font-size:12px; }
.home-header nav a:hover,.home-logo-link:hover { color:var(--accent); }
.home-logo-link { color:var(--muted); font-size:11px; }
.home-hero { display:grid; grid-template-columns:.92fr 1.15fr; align-items:center; min-height:700px; max-width:1500px; margin:auto; padding:20px 64px; gap:10px; }
.home-copy { z-index:3; padding:40px 0; }
.home-eyebrow { display:flex; align-items:center; gap:8px; font:8px var(--mono); letter-spacing:1.8px; color:var(--muted); }
.home-eyebrow.home-eyebrow--large { font-size:clamp(9px,.75vw,10px); }
.home-eyebrow span { height:4px; width:4px; border-radius:50%; background:var(--accent); }
.home-copy h1 { font-size:clamp(64px,6.15vw,90px); font-weight:450; line-height:1.025; letter-spacing:-4.5px; margin-top:31px; white-space:nowrap; }
.home-copy h1 em { font:italic 400 1.06em/.95 var(--serif); color:var(--accent); }
#home-description { font-size:14px; line-height:1.8; color:var(--muted); margin-top:28px; }
.home-copy .button { margin-top:29px; gap:38px; padding:0 22px; min-height:49px; }
.home-copy .hero-emblem { display:none; }
body.home-page .neural-stage { position:relative; width:100%; height:640px; min-height:640px; margin:0; border:0; border-radius:0; isolation:isolate; }
.home-stage-meta { position:absolute; top:31px; left:10px; right:0; display:flex; justify-content:space-between; gap:20px; color:var(--muted); font:7px var(--mono); letter-spacing:1px; z-index:3; }
.home-stage-meta .study-number { opacity:.6; font-size:6px; white-space:nowrap; }
.home-page .neural-visual { position:absolute; inset:70px -22px 86px -25px; }
.home-page #neural-canvas { opacity:.35; }
.home-page .stage-grid { opacity:.12; }
.home-page .neural-visual .orbit { width:80%; top:49%; opacity:.3; }
.home-page .neural-visual .orbit-two { width:96%; opacity:.18; }
.home-page #pathway-svg { width:100%; height:100%; position:absolute; inset:0; z-index:2; overflow:visible; }
.home-page .gap-title { font-size:12px; letter-spacing:.7px; }
.home-page .route-label { font-size:9px; }
.home-page .agent-whisper { position:absolute; bottom:57px; left:10px; right:10px; display:flex; justify-content:center; align-items:center; gap:10px; z-index:3; }
.whisper-spark { color:var(--accent); font-size:14px; }
.agent-whisper p { font:italic 20px var(--serif); color:#c2b4df; }
.home-controls { position:absolute; bottom:0; left:10px; right:0; display:flex; align-items:center; justify-content:space-between; gap:25px; border-top:1px solid var(--line); padding-top:14px; }
.repeat-control { display:flex; align-items:center; gap:22px; }
.repeat-control label { font:8px var(--mono); color:var(--muted); white-space:nowrap; }
.repeat-control output { font-size:7px; color:var(--ink); margin-left:7px; }
.home-page #repetition-range { width:135px; height:20px; margin:0; }
.play-controls { display:flex; gap:8px; }
.play-controls button { width:29px; height:29px; border:1px solid var(--line); border-radius:50%; font-size:12px; background:transparent; }
.play-controls button:hover { color:var(--accent); border-color:var(--accent); }
.home-bottom { display:flex; justify-content:space-between; align-items:center; max-width:1372px; margin:0 auto; border-top:1px solid var(--line); padding:24px 0; gap:25px; }
.home-bottom>span { font:italic 19px var(--serif); color:#b3a4ce; }
.home-bottom>a { color:var(--muted); font-size:9px; }
.home-bottom>a:hover { color:var(--ink); }
body.home-page footer.home-footer { max-width:1500px; padding:18px 64px 100px; display:flex; align-items:center; gap:25px; font:8px var(--mono); color:var(--muted); margin:auto; }
.home-footer>span { margin:0 auto 0 0; width:auto; }
.home-footer>a { font-size:9px; }
.home-switcher { position:fixed; bottom:18px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:20px; padding:7px 8px 7px 18px; border:1px solid #b8a3f22c; border-radius:10px; background:#191c25eb; backdrop-filter:blur(15px); z-index:20; box-shadow:0 8px 35px #0002; }
.home-switcher>span { font:7px var(--mono); letter-spacing:1px; color:var(--muted); }
.home-switcher>div { display:flex; gap:3px; }
.home-switcher button { color:#bfc0cf; background:none; border-radius:6px; padding:11px 13px; font-size:10px; display:flex; align-items:center; gap:7px; white-space:nowrap; }
.home-switcher button[aria-pressed="true"] { background:var(--accent); color:#17131f; }
.home-switcher small { font:7px var(--mono); opacity:.65; }
.home-page dialog .orbit-brand { width:36px; height:36px; }

/* A centered composition, with several guides creating a constellation. */
body[data-view="constellation"] .home-hero { display:flex; flex-direction:column; min-height:0; padding-top:18px; background:radial-gradient(ellipse at 50% 66%,#69549e17,transparent 60%); }
body[data-view="constellation"] .home-copy { text-align:center; padding:25px 0 0; }
body[data-view="constellation"] .home-copy .hero-emblem { display:block; margin:0 auto 22px; width:65px; height:65px; }
body[data-view="constellation"] .home-eyebrow { justify-content:center; font-size:7px; }
body[data-view="constellation"] .home-copy h1 { font-size:clamp(64px,6.3vw,92px); margin-top:22px; line-height:1.01; }
body[data-view="constellation"] #home-description { margin-top:19px; font-size:13px; }
body[data-view="constellation"] .home-copy .button { margin-top:20px; border-radius:30px; }
body.home-page[data-view="constellation"] .neural-stage { width:min(100%,900px); height:600px; min-height:600px; margin:15px auto 20px; }
body[data-view="constellation"] .neural-visual { inset:43px 0 83px; }
body[data-view="constellation"] .home-stage-meta { top:18px; }
body[data-view="constellation"] .neural-visual .orbit { width:63%; }
body[data-view="constellation"] .neural-visual .orbit-two { width:74%; }
body[data-view="constellation"] .home-controls { left:19%; right:19%; }
body[data-view="constellation"] .agent-whisper { bottom:58px; }

/* A quieter portrait: the guide stays at the gap; the green destination breathes. */
body[data-view="sanctuary"] { --bg:#101719; --panel:#182124; --line:#2a3538; --muted:#92a4a7; --accent:#bdb2e2; --path-green:#90d7ba; }
body[data-view="sanctuary"] .home-header { border-bottom:0; }
body[data-view="sanctuary"] .home-header .brand { font-family:var(--serif); font-size:37px; }
body[data-view="sanctuary"] .home-hero { grid-template-columns:1.2fr 1fr; gap:70px; min-height:750px; }
body[data-view="sanctuary"] .home-copy { grid-column:2; grid-row:1; padding-left:20px; }
body[data-view="sanctuary"] .home-copy h1 { font-family:var(--serif); font-weight:400; font-size:clamp(72px,7.2vw,102px); letter-spacing:-2.5px; line-height:.98; }
body[data-view="sanctuary"] .home-copy h1 em { font-size:1em; }
body[data-view="sanctuary"] .home-copy .button { border-radius:30px; background:transparent; border:1px solid #bdb2e270; color:var(--accent); }
body.home-page[data-view="sanctuary"] .neural-stage { grid-column:1; grid-row:1; height:660px; min-height:660px; border-radius:48% 48% 5px 5px; background:radial-gradient(ellipse at 60% 55%,#53856c18,transparent 70%); }
body[data-view="sanctuary"] .home-stage-meta { left:30px; right:30px; top:33px; }
body[data-view="sanctuary"] .home-stage-meta>span:first-child { font-size:6px; letter-spacing:.4px; }
body[data-view="sanctuary"] .study-number { display:none; }
body[data-view="sanctuary"] .neural-visual { inset:65px -10px 110px; }
body[data-view="sanctuary"] #neural-canvas { opacity:.22; }
body[data-view="sanctuary"] .neural-visual .orbit { opacity:.23; }
body[data-view="sanctuary"] .agent-whisper { bottom:75px; }
body[data-view="sanctuary"] .home-controls { left:25px; right:25px; bottom:15px; }

@media(min-width:1600px) { .home-hero { min-height:780px; }.home-copy h1 { font-size:96px; }body.home-page .neural-stage { height:710px; min-height:710px; } }
@media(max-width:1499px) { .home-bottom { margin-inline:64px; } }
@media(max-width:1100px) and (min-width:761px) {
  .home-header { padding-inline:35px; }.home-hero { padding-inline:35px; grid-template-columns:.95fr 1.1fr; }.home-copy h1 { font-size:65px; letter-spacing:-3px; }.home-stage-meta { font-size:6px; letter-spacing:.5px; }.home-stage-meta .study-number { display:none; }.repeat-control { gap:12px; }.home-page #repetition-range { width:90px; }.home-controls { gap:10px; }.home-bottom { margin-inline:35px; }body.home-page footer.home-footer { padding-inline:35px; }body[data-view="sanctuary"] .home-hero { gap:20px; }body[data-view="sanctuary"] .home-copy { padding-left:0; }body[data-view="sanctuary"] .home-copy h1 { font-size:77px; }body[data-view="sanctuary"] .home-controls { left:0; right:0; }body[data-view="constellation"] .home-copy h1 { font-size:76px; }body[data-view="constellation"] .home-controls { left:14%; right:14%; }
}
@media(max-width:760px) {
  .home-header { height:80px; padding-inline:24px; gap:15px; }.home-header .brand { font-size:25px; gap:5px; }.home-header .orbit-brand { width:37px; height:37px; }.home-header nav { gap:20px; font-size:10px; }.home-header nav a:first-child { display:none; }.home-logo-link { display:none; }
  .home-hero { display:flex; flex-direction:column; padding:0 24px; min-height:0; gap:0; }.home-copy { width:100%; padding:42px 0 0; }.home-eyebrow { font-size:7px; letter-spacing:1.2px; }.home-copy h1 { font-size:clamp(57px,10vw,78px); margin-top:22px; letter-spacing:-2.9px; line-height:1.02; }#home-description { font-size:12px; margin-top:22px; }.home-copy .button { margin-top:23px; min-height:46px; font-size:11px; }
  body.home-page .neural-stage { height:430px; min-height:430px; margin:27px 0 18px; max-width:550px; }.home-stage-meta { top:15px; left:0; right:0; font-size:5.5px; letter-spacing:.4px; }.home-stage-meta .study-number { font-size:5px; }.home-page .neural-visual { inset:35px -17px 70px; }.home-page #neural-canvas { opacity:.34; }.home-page .gap-title { font-size:15px; }.home-page .route-label { font-size:11px; }.home-page .outcome-label { font-size:23px; }.home-page .agent-label { font-size:14px; }.home-page .agent-whisper { bottom:50px; }.agent-whisper p { font-size:18px; }.home-controls { left:0; right:0; bottom:0; padding-top:10px; gap:15px; }.repeat-control { gap:14px; }.home-page #repetition-range { width:100px; }.repeat-control label { font-size:7px; }.repeat-control output { font-size:6px; }.play-controls button { width:28px; height:28px; }
  .home-bottom { margin:0 24px; padding:23px 0 18px; flex-direction:column; align-items:flex-start; gap:13px; }.home-bottom>span { font-size:19px; }.home-bottom>a { font-size:8px; line-height:1.6; }body.home-page footer.home-footer { padding:16px 24px 100px; font-size:7px; gap:15px; }.home-footer>a { font-size:8px; }.home-switcher { max-width:calc(100% - 18px); padding:6px; bottom:12px; border-radius:8px; gap:0; }.home-switcher>span { display:none; }.home-switcher button { font-size:9px; padding:11px 10px; gap:5px; }.home-switcher small { font-size:6px; }
  body[data-view="constellation"] .home-hero { padding-top:0; }body[data-view="constellation"] .home-copy { padding-top:28px; }body[data-view="constellation"] .home-copy .hero-emblem { width:58px; height:58px; margin-bottom:20px; }body[data-view="constellation"] .home-copy h1 { font-size:clamp(36px,7.5vw,58px); letter-spacing:-1.8px; }body[data-view="constellation"] .home-eyebrow { font-size:6px; }body[data-view="constellation"] #home-description { font-size:12px; margin-top:20px; }body.home-page[data-view="constellation"] .neural-stage { height:450px; min-height:450px; margin:18px 0; width:100%; }body[data-view="constellation"] .neural-visual { inset:40px -17px 80px; }body[data-view="constellation"] .home-controls { left:0; right:0; }body[data-view="constellation"] .agent-whisper { bottom:50px; }
  body[data-view="sanctuary"] .home-header .brand { font-size:31px; }body[data-view="sanctuary"] .home-hero { display:flex; gap:0; min-height:0; }body[data-view="sanctuary"] .home-copy { padding:38px 0 0; }body[data-view="sanctuary"] .home-copy h1 { font-size:clamp(65px,12vw,88px); letter-spacing:-2px; }body[data-view="sanctuary"] #home-description { font-size:11px; }body.home-page[data-view="sanctuary"] .neural-stage { height:460px; min-height:460px; margin:25px 0 15px; }body[data-view="sanctuary"] .home-stage-meta { left:0; right:0; top:18px; }body[data-view="sanctuary"] .home-stage-meta>span:first-child { font-size:5.5px; }body[data-view="sanctuary"] .neural-visual { inset:35px -17px 80px; }body[data-view="sanctuary"] .agent-whisper { bottom:56px; }body[data-view="sanctuary"] .home-controls { left:0; right:0; bottom:0; }
}
@media(max-width:360px) { .home-copy h1 { font-size:51px; }.home-page #repetition-range { width:74px; }.repeat-control { gap:9px; }.repeat-control label { font-size:6px; }.play-controls { gap:5px; }.home-stage-meta .study-number { display:none; }.home-switcher button { padding-inline:8px; font-size:8px; }.home-switcher small { display:none; }body[data-view="constellation"] .home-copy h1 { font-size:32px; }body[data-view="sanctuary"] .home-copy h1 { font-size:59px; } }