:root{font-family:Inter,"Geist",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#030b12;color:#f4f8fa;color-scheme:dark;font-synthesis:none;scroll-behavior:auto;scroll-padding-top:0px}*{box-sizing:border-box}html{scroll-snap-type:none;overscroll-behavior-y:contain}body{margin:0;overflow-x:hidden;--bg:#030b12;--card:rgba(9,26,34,.79);--muted:#9fb3bb;--border:rgba(127,177,185,.19);--accent:#71e6d6;--warm:#ff8647;--text:#f6f8f7;background:var(--bg);color:var(--text)}body[data-variant=atlas]{--accent:#76dfd1;--warm:#ff8747;--card:rgba(8,28,34,.84);--bg:#06131a}button,a{font:inherit}a{color:inherit}button{cursor:pointer}.skip{position:fixed;z-index:200;left:16px;top:-100px;padding:12px;background:#fff;color:#111;border-radius:7px}.skip:focus{top:12px}:focus-visible{outline:2px solid #86eadf;outline-offset:4px}
/* Shared cinematic canvas persists across every section */
#cosmos{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse 36% 46% at 66% 45%,rgba(8,61,78,.27),transparent 90%),radial-gradient(ellipse at 15% 15%,#0a2634,transparent 50%),#030a11}body[data-variant=atlas] #cosmos{background:radial-gradient(ellipse at 70% 45%,#0c3840 0,transparent 47%),linear-gradient(145deg,#04161d,#020b11 84%)}#cosmos::after{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,#98cbd6 0.8px,transparent 1.2px),radial-gradient(circle,#649faa .65px,transparent 1px);background-size:147px 149px,223px 211px;background-position:12px 41px,75px 94px;opacity:.21;mask-image:linear-gradient(90deg,transparent 5%,#000 65%)}.grid-sheen{position:absolute;inset:0;background-image:linear-gradient(rgba(95,191,195,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(95,191,195,.05) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(90deg,transparent 23%,#000 90%);opacity:.7}#earth{position:absolute;inset:0;width:100%;height:100%}.geo-label{position:absolute;right:clamp(36px,5vw,90px);bottom:clamp(50px,8vh,100px);letter-spacing:.22em;font-size:10px;font-weight:650;color:#8bb6be;text-align:right;transition:opacity .3s}.geo-label strong{display:block;color:var(--accent);font-size:11px;margin-top:10px;font-weight:550;letter-spacing:.13em}.reticle{position:absolute;left:57%;top:49%;height:clamp(330px,43vw,720px);aspect-ratio:1;border:1px solid rgba(88,209,207,.08);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}.reticle::before,.reticle::after{content:"";position:absolute;inset:-11%;border:1px dashed rgba(109,218,215,.11);border-radius:50%;animation:reticle-spin 75s linear infinite}.reticle::after{inset:-22%;animation-direction:reverse;opacity:.35}@keyframes reticle-spin{to{transform:rotate(360deg)}}body[data-variant=atlas] .reticle{display:none}
.topbar{position:fixed;z-index:80;inset:0 0 auto;height:88px;padding:0 clamp(22px,5vw,82px);display:flex;align-items:center;justify-content:space-between;gap:20px;background:linear-gradient(#030b13ee,#030b1300);transition:background .3s,height .3s}.topbar.scrolled{height:72px;background:rgba(4,15,22,.87);backdrop-filter:blur(20px);border-bottom:1px solid var(--border)}.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;white-space:nowrap;font-size:20px;font-weight:780;letter-spacing:-.045em}.brand-symbol{width:35px;height:35px;flex:none}.brand-symbol circle{stroke:#f2f7f6}.brand-symbol path{stroke:#ff8647}.brand-symbol .seed{fill:#d5e568}.brand em{font-style:normal;color:#ff8647}.brand-official{display:none;object-fit:contain;width:191px;height:42px}.brand:has(.brand-official.loaded) .brand-symbol,.brand:has(.brand-official.loaded) .brand-letters{display:none}.brand-official.loaded{display:block}.header-actions{display:flex;align-items:center;gap:22px}.header-actions a:not(.header-cta){color:#b4c9d0;text-decoration:none;font-size:12px}.header-actions a:not(.header-cta):hover{color:#fff}.header-cta,.solid-btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:47px;padding:0 19px;background:var(--accent);border:1px solid var(--accent);border-radius:7px;color:#041116;text-decoration:none;font-size:12px;font-weight:740;letter-spacing:.015em;transition:transform .26s cubic-bezier(.2,.75,.2,1),box-shadow .26s,background .26s}.header-cta{min-height:42px}.header-cta:hover,.solid-btn:hover{transform:translateY(-3px);box-shadow:0 13px 45px #51dccc31}.outline-btn{border:1px solid rgba(154,207,214,.29);background:rgba(14,39,47,.48);min-height:47px;border-radius:7px;color:#e5f0f2;padding:0 18px;display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-size:12px;font-weight:650;backdrop-filter:blur(15px);transition:background .24s,border-color .24s}.outline-btn:hover{background:rgba(30,78,83,.42);border-color:var(--accent)}.outline-btn svg,.solid-btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8}
/* Native CSS snap preserves normal input/trackpad momentum, chapters lock near settled position */
.story{position:relative;z-index:1;pointer-events:none}.panel{position:relative;display:flex;align-items:center;min-height:100svh;scroll-snap-align:start;scroll-snap-stop:normal;padding:118px clamp(22px,7vw,126px) 65px;isolation:isolate;pointer-events:none}.copy{position:relative;max-width:610px;width:48%;pointer-events:auto;opacity:.28;transform:translate3d(0,36px,0);transition:opacity .95s cubic-bezier(.18,.65,.22,1),transform .95s cubic-bezier(.18,.65,.22,1)}.panel.is-active .copy{opacity:1;transform:translateZ(0)}.eyebrow{display:flex;align-items:center;gap:12px;color:var(--accent);font-weight:750;font-size:10px;letter-spacing:.21em;text-transform:uppercase}.eyebrow::before{content:"";width:24px;height:1px;background:var(--accent)}h1,h2,h3,p{margin-top:0}h1,h2{font-size:clamp(62px,6.8vw,120px);font-weight:620;letter-spacing:-.085em;line-height:.98;margin:22px 0 27px;text-wrap:balance;max-width:780px}h2{font-size:clamp(56px,6.1vw,106px)}h1 span,h2 span{color:var(--accent)}.copy p{font-size:clamp(15px,1.22vw,18px);color:#a4b8c0;line-height:1.7;max-width:410px;letter-spacing:-.012em;text-wrap:pretty}.copy .short{max-width:425px}.action-set{display:flex;gap:11px;align-items:center;flex-wrap:wrap;margin-top:35px}.chapter-number{display:block;margin-top:38px;letter-spacing:.24em;color:#647f89;font-size:10px}.micro-panel{border:1px solid var(--border);background:var(--card);backdrop-filter:blur(20px);padding:19px 21px;border-radius:12px;margin-top:28px;width:min(100%,424px);box-shadow:0 19px 45px #0004;transform:translateY(0);transition:transform .35s,border-color .35s}.micro-panel:hover{transform:translateY(-4px);border-color:#4c9e9e70}.micro-label{font-size:9px;letter-spacing:.18em;color:var(--accent);font-weight:750;margin-bottom:11px}.micro-panel h3{font-size:16px;letter-spacing:-.04em;margin-bottom:5px;font-weight:700}.micro-panel p{font-size:12px;line-height:1.65;margin:0;color:#a7bcc4}.micro-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;gap:15px}.source-chip{font-size:9px;border:1px solid #47858970;background:#163c4166;padding:6px 8px;border-radius:5px;color:#9ce6d5}.data-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--border);font-size:12px;color:#d7e4e4}.data-row b{font-weight:650;margin-left:auto;font-size:10px;color:#9db4bd}.dot{width:8px;height:8px;border-radius:50%;background:var(--accent);flex:none}.dot.orange{background:var(--warm)}.rail{position:fixed;z-index:55;right:clamp(18px,3vw,52px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:17px;align-items:flex-end}.rail a{pointer-events:auto;display:flex;align-items:center;gap:11px;text-decoration:none;color:#859ba5;font-size:10px;letter-spacing:.09em;opacity:.72;transition:color .3s,opacity .3s}.rail a i{width:12px;height:2px;background:currentColor;transition:width .3s}.rail a[aria-current=step]{opacity:1;color:var(--accent)}.rail a[aria-current=step] i{width:33px}.rail a:hover{opacity:1}.scroll-indicator{position:fixed;z-index:60;bottom:39px;left:clamp(22px,7vw,126px);color:#7f9ba4;letter-spacing:.16em;font-size:10px;display:flex;align-items:center;gap:15px;pointer-events:none}.scroll-indicator::before{content:"";height:1px;width:37px;background:var(--accent)}.page-progress{height:2px;position:fixed;top:0;left:0;right:0;z-index:100;background:#23505d}.page-progress span{display:block;height:100%;width:0;background:var(--accent)}.top-status{position:fixed;top:115px;left:clamp(22px,7vw,126px);z-index:15;display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:.19em;color:#8da6af;pointer-events:none}.live{height:6px;width:6px;background:#59e3ce;border-radius:50%;box-shadow:0 0 11px #70ffdf;animation:beat 2.8s infinite}@keyframes beat{50%{opacity:.3;transform:scale(.65)}}.top-status .preview{border:1px solid #59767d70;padding:5px 8px;color:#a6bbc1;border-radius:4px;margin-left:7px;letter-spacing:.08em}
/* Atlas aligns itself to the hemisphere without becoming a cloned Orbit */
body[data-variant=atlas] .panel{padding-left:clamp(25px,9.7vw,164px)}body[data-variant=atlas] .copy{width:49%;max-width:650px}body[data-variant=atlas] h1,body[data-variant=atlas] h2{font-weight:505;letter-spacing:-.095em}body[data-variant=atlas] .panel:nth-child(even) .copy{transform:translate3d(0,32px,0)}body[data-variant=atlas] .panel:nth-child(even).is-active .copy{transform:translateZ(0)}body[data-variant=atlas] .micro-panel{border-left:2px solid #68dbd1;border-radius:5px}body[data-variant=atlas] .geo-label{color:#82adb6}body[data-variant=atlas] #cosmos::after{opacity:.10}
@media(min-width:1200px){.panel.is-active .copy{will-change:transform,opacity}}@media(max-width:960px){.panel .copy,body[data-variant=atlas] .copy{width:55%}h1,h2{font-size:clamp(55px,7vw,88px)}.header-actions a:not(.header-cta){display:none}.rail a span{display:none}.rail a i{width:13px}}@media(max-width:700px){html{scroll-snap-type:none}.topbar{height:70px;padding:0 20px}.topbar.scrolled{height:66px}.brand{font-size:18px}.brand-symbol{height:30px;width:30px}.brand-official{width:160px}.header-cta{padding:0 12px;min-height:42px;font-size:11px}#cosmos{background:radial-gradient(ellipse at 54% 23%,#0c3540,#05131c 53%,#020911 88%)}.reticle{top:31%;left:50%;height:65vw;max-height:40svh}.geo-label{bottom:auto;top:49%;right:18px;font-size:8px}.geo-label strong{font-size:9px}.top-status{left:21px;top:82px;font-size:8px;letter-spacing:.08em}.top-status .preview{font-size:8px}.panel,body[data-variant=atlas] .panel{padding:51svh 24px max(45px,9svh);align-items:flex-end;min-height:100svh}.panel .copy,body[data-variant=atlas] .copy{width:100%;max-width:550px;transform:translateY(22px)}h1,h2{font-size:clamp(43px,11.2vw,75px);margin:14px 0 16px;line-height:1.01;max-width:600px}.copy p{font-size:13px;line-height:1.55;max-width:410px}.action-set{margin-top:20px;gap:8px}.outline-btn,.solid-btn{min-height:44px;padding:0 13px;font-size:11px}.chapter-number{margin-top:16px}.micro-panel{padding:13px 15px;margin-top:14px;border-radius:8px}.micro-panel p{font-size:11px;line-height:1.4}.data-row{padding:7px 0;font-size:11px}.micro-label{margin-bottom:5px}.micro-panel h3{font-size:13px;margin-bottom:3px}.rail{right:14px;gap:11px;top:31%}.rail a{min-height:22px}.scroll-indicator{left:24px;bottom:19px;font-size:8px}.scroll-indicator::before{width:22px}.map-entry-header{top:25px;right:17px;font-size:9px}.map-entry .back-story{left:15px;top:15px;min-height:44px}.fallback-info{left:15px;bottom:30px;width:calc(100% - 30px)}body[data-variant=atlas] #cosmos{background:radial-gradient(ellipse at 54% 26%,#12464c,#04131b 51%,#020c13 90%)}}@media(max-height:660px) and (max-width:700px){.panel,body[data-variant=atlas] .panel{padding-top:43svh;min-height:100svh}.copy p{font-size:12px}.micro-panel{margin-top:10px;padding:10px 13px}h1,h2{font-size:clamp(39px,10vw,62px)}.chapter-number{display:none}.top-status{display:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;scroll-snap-type:none}*,*::before,*::after{animation:none!important;transition-duration:.01ms!important}.copy{opacity:1!important;transform:none!important}}

.marker-overlay{position:absolute;inset:0;pointer-events:none}.earth-pin{position:absolute;width:7px;height:7px;transform:translate(-50%,-50%);border-radius:50%;background:var(--pin);box-shadow:0 0 16px var(--pin);transition:opacity .4s}.earth-pin::after{content:"";position:absolute;inset:-8px;border:1px solid var(--pin);border-radius:50%;animation:pinwave 2.7s ease-out infinite}@keyframes pinwave{0%{transform:scale(.35);opacity:.9}90%,100%{transform:scale(1.7);opacity:0}}@media(prefers-reduced-motion:reduce){.earth-pin::after{animation:none;opacity:.4}}

/* Direction V3: deliberate scroll choreography + selectable globe. */
#earth{pointer-events:auto;cursor:grab;touch-action:pan-y;user-select:none}
#earth.dragging{cursor:grabbing}
#earth:focus-visible{outline:2px solid #87e0e9;outline-offset:-7px}
.earth-pin{width:9px;height:9px;box-shadow:0 0 11px 4px color-mix(in srgb,var(--pin) 45%,transparent),0 0 28px var(--pin)}
.earth-pin::before{content:"";position:absolute;inset:-3px;opacity:.7;border:1px solid var(--pin);border-radius:50%}
.earth-pin::after{inset:-10px;animation:pinwave 2.35s ease-out infinite;animation-delay:var(--delay,0s)}
.panel .copy{transition:opacity 1.06s cubic-bezier(.18,.65,.22,1),transform 1.06s cubic-bezier(.18,.65,.22,1)}
@media(max-width:700px){.panel{scroll-snap-align:none}}

/* V4 – precise launch status, brand variants and contrasting themes */
body{transition:background-color .45s,color .45s}
.topbar .brand-official{width:216px;height:auto;max-height:45px}
.header-actions{gap:12px}
.theme-switch{border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:9px;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:0 12px;font-size:12px;backdrop-filter:blur(15px);transition:background .25s,border-color .25s}
.theme-switch:hover{border-color:var(--accent)}.theme-symbol{font-size:18px;line-height:1}
.cta-with-subtext{gap:12px;text-align:left;min-height:54px;line-height:1.05;white-space:nowrap}
.cta-with-subtext > span:first-child{display:flex;flex-direction:column;gap:5px}
.cta-with-subtext small{font-size:10px;letter-spacing:.012em;font-weight:530;opacity:.72}
.header-cta.cta-with-subtext{min-height:48px}
.cta-with-subtext svg{flex:none}
.leaving-story #cosmos,.leaving-story .story,.leaving-story .topbar,.leaving-story .rail,.leaving-story .top-status{opacity:0;transition:opacity .43s ease}
body[data-theme='light']{--bg:#f3f7f8;--card:rgba(255,255,255,.87);--border:rgba(26,69,82,.20);--muted:#506572;--text:#112b37;--accent:#036c79;--warm:#cb5725;color-scheme:light}
body[data-theme='light'][data-variant='atlas']{--bg:#f0f6f7;--card:rgba(255,255,255,.90);--accent:#026977}
body[data-theme='light'] #cosmos,body[data-theme='light'][data-variant='atlas'] #cosmos{background:radial-gradient(ellipse at 64% 42%,rgba(132,204,219,.28),transparent 60%),linear-gradient(145deg,#f8fbfd 0%,#e4f0f3 100%)}
body[data-theme='light'] #cosmos::after{opacity:.23;background-image:radial-gradient(circle,#427f8b 0.8px,transparent 1.2px),radial-gradient(circle,#73a6ad .65px,transparent 1px)}
body[data-theme='light'] .grid-sheen{background-image:linear-gradient(#2479880e 1px,transparent 1px),linear-gradient(90deg,#2479880e 1px,transparent 1px)}
body[data-theme='light'] .reticle,body[data-theme='light'] .reticle::before,body[data-theme='light'] .reticle::after{border-color:rgba(23,114,131,.18)}
body[data-theme='light'] .topbar{background:linear-gradient(#f7fbfceF,#f7fbfc00)}
body[data-theme='light'] .topbar.scrolled{background:rgba(246,250,251,.9)}
body[data-theme='light'] .header-actions a:not(.header-cta){color:#425e69}
body[data-theme='light'] .header-actions a:not(.header-cta):hover{color:#062935}
body[data-theme='light'] .copy p{color:#385561}
body[data-theme='light'] .micro-panel{box-shadow:0 15px 55px #35616a13}
body[data-theme='light'] .micro-panel p{color:#455e68}
body[data-theme='light'] .data-row{color:#1c404e}
body[data-theme='light'] .source-chip{color:#03535d;background:#c9edef82;border-color:#78bfc7}
body[data-theme='light'] .outline-btn{color:#163a46;border-color:#8ab0b9a8;background:#ffffffe3}
body[data-theme='light'] .outline-btn:hover{background:#e9f9fa}
body[data-theme='light'] .header-cta,body[data-theme='light'] .solid-btn{color:#fff}
body[data-theme='light'] .geo-label,body[data-theme='light'][data-variant='atlas'] .geo-label,body[data-theme='light'] .top-status,body[data-theme='light'] .scroll-indicator{color:#3d6672}
body[data-theme='light'] .chapter-number{color:#5b7a87}
body[data-theme='light'] .page-progress{background:#d9e6e9}
body[data-theme='light'] .rail a{color:#567884}
body[data-theme='light'] .brand{color:#173442}
body[data-theme='light'] .top-status .preview{color:#2d7378}
body[data-theme='light'] .earth-pin{box-shadow:0 0 9px 3px color-mix(in srgb,var(--pin) 30%,transparent),0 0 18px var(--pin)}
@media(max-width:960px){.header-actions .theme-label{display:none}}
@media(max-width:700px){.topbar .brand-official{width:155px;max-height:38px}.theme-switch{min-width:44px;padding:0 10px}.header-actions{gap:7px}.header-cta.cta-with-subtext{font-size:10px;padding:0 9px;min-height:44px}.header-cta.cta-with-subtext small{font-size:9px}.cta-with-subtext{min-height:48px}.cta-with-subtext small{font-size:9px}}
@media(max-width:370px){.topbar .brand-official{width:138px}.header-cta.cta-with-subtext{padding:0 7px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.leaving-story #cosmos,.leaving-story .story,.leaving-story .topbar{transition:none}}

.brand-official,.topbar .brand-official{display:block}.brand-symbol,.brand-letters{display:none}

/* Atlas review: readable narrative surfaces and measured, intrinsically sized type. */
body[data-variant="atlas"] .copy {
  isolation:isolate;
  min-width:0;
  max-width:min(670px,100%);
  opacity:.80;
  overflow-wrap:break-word;
}
body[data-variant="atlas"] .copy::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:-30px -42px;
  pointer-events:none;
  border-radius:28px;
  background:linear-gradient(100deg,rgba(2,12,18,.95) 0%,rgba(2,12,18,.93) 59%,rgba(2,12,18,.78) 82%,rgba(2,12,18,.06) 100%);
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 80%,transparent 100%);
  mask-image:linear-gradient(90deg,#000 0%,#000 80%,transparent 100%);
}
body[data-variant="atlas"][data-theme="light"] .copy::before {
  background:linear-gradient(100deg,rgba(247,251,252,.97),rgba(247,251,252,.94) 68%,rgba(247,251,252,.70) 86%,transparent);
}
/* Section titles retain the original Atlas display scale and tight tracking. */
body[data-variant="atlas"] h1,
body[data-variant="atlas"] h2 {
  font-weight:505;
  line-height:.98;
  letter-spacing:-.095em;
  max-width:780px;
  overflow-wrap:normal;
  text-wrap:balance;
}
body[data-variant="atlas"] .copy p {color:#d2e0e4}
body[data-variant="atlas"] .copy .micro-panel p {color:#c7d7dc}
body[data-variant="atlas"] .data-row b {color:#c7dbe0}
body[data-variant="atlas"] .chapter-number {color:#b0c8cf}
body[data-variant="atlas"][data-theme="light"] .copy p {color:#244553}
body[data-variant="atlas"][data-theme="light"] .copy .micro-panel p {color:#2f4f5a}
body[data-variant="atlas"][data-theme="light"] .data-row b {color:#2d5460}
body[data-variant="atlas"][data-theme="light"] .chapter-number {color:#375967}
body[data-variant="atlas"][data-theme="light"] .micro-label {color:#05616c}
body[data-variant="atlas"] .micro-panel {max-width:100%;overflow-wrap:anywhere}
body[data-variant="atlas"] .data-row {flex-wrap:wrap}
body[data-variant="atlas"] .data-row b {margin-left:auto}
body[data-variant="atlas"] .action-set>a {max-width:100%;white-space:normal}
body[data-variant="atlas"] .cta-with-subtext {white-space:normal}

/* Three receding spatial planes: distant star field, horizon, near perspective floor.
   Decorative only: no pointer interception and no continuous animation. */
body[data-variant="atlas"] .grid-sheen {
  inset:18% -35% -20%;
  opacity:.48;
  transform:perspective(850px) rotateX(68deg) translateY(4%) scale(1.45);
  transform-origin:50% 80%;
  background-image:
    linear-gradient(90deg,rgba(100,193,201,.16) 1px,transparent 1px),
    linear-gradient(rgba(100,193,201,.16) 1px,transparent 1px);
  background-size:clamp(45px,5vw,94px) clamp(45px,5vw,94px);
  mask-image:radial-gradient(ellipse 55% 60% at 52% 55%,#0008 10%,transparent 95%);
}
body[data-variant="atlas"] .grid-sheen::before {
  content:"";position:absolute;inset:-80% -20%;
  background-image:linear-gradient(90deg,rgba(94,185,203,.11) 1px,transparent 1px),linear-gradient(rgba(94,185,203,.11) 1px,transparent 1px);
  background-size:130px 130px;
  transform:translateY(-10%) scale(.82);
  opacity:.7;
}
body[data-variant="atlas"] .grid-sheen::after {
  content:"";position:absolute;inset:10% 20% 0;
  border-top:1px solid rgba(102,200,211,.11);
  box-shadow:0 0 130px 40px rgba(13,96,114,.08);
}
body[data-variant="atlas"][data-theme="light"] .grid-sheen,
body[data-variant="atlas"][data-theme="light"] .grid-sheen::before {
  filter:none;
  background-image:linear-gradient(90deg,rgba(6,96,119,.20) 1px,transparent 1px),linear-gradient(rgba(6,96,119,.20) 1px,transparent 1px);
}

/* Put preview first, mode control to its immediate right. */
body[data-variant="atlas"] .header-actions {gap:clamp(6px,.8vw,12px)}
body[data-variant="atlas"] .theme-switch {flex-shrink:0}
body[data-variant="atlas"] .header-cta {flex-shrink:0}

@media (max-width:1100px) {
 body[data-variant="atlas"] .copy {width:min(57%,610px)}
 
}
@media (max-width:700px) {
 body[data-variant="atlas"] .panel {
   min-height:100svh;
   height:auto;
   padding: max(47svh,190px) clamp(18px,5vw,28px) max(50px,7svh);
   align-items:flex-end;
 }
 body[data-variant="atlas"] .copy {width:100%;max-width:100%}
 body[data-variant="atlas"] .copy::before {
   inset:-16px -16px -23px;
   border-radius:20px;
   background:linear-gradient(180deg,rgba(3,13,20,.68),rgba(3,13,20,.95) 23%,rgba(3,13,20,.97) 100%);
   -webkit-mask-image:none;mask-image:none;
 }
 body[data-variant="atlas"][data-theme="light"] .copy::before {
   background:linear-gradient(180deg,rgba(249,252,253,.67),rgba(249,252,253,.96) 23%,rgba(249,252,253,.98));
 }
 body[data-variant="atlas"] h1,body[data-variant="atlas"] h2 {line-height:1.01;letter-spacing:-.095em;max-width:600px}
 body[data-variant="atlas"] .copy p {font-size:clamp(.88rem,3.7vw,1rem);line-height:1.52}
 body[data-variant="atlas"] .action-set {align-items:stretch}
 body[data-variant="atlas"] .grid-sheen {opacity:.29;inset:0 -95% 27%;transform:perspective(950px) rotateX(65deg) scale(1.4)}
 body[data-variant="atlas"] .topbar {gap:5px;padding-inline:clamp(10px,3vw,20px)}
 body[data-variant="atlas"] .topbar .brand-official {width:clamp(108px,34vw,160px)}
 body[data-variant="atlas"] .header-actions {gap:5px}
 body[data-variant="atlas"] .theme-switch {min-width:40px;min-height:44px;padding-inline:8px}
 body[data-variant="atlas"] .header-cta.cta-with-subtext {min-height:44px;padding-inline:8px;gap:5px}
 body[data-variant="atlas"] .header-cta.cta-with-subtext>span:last-child {display:none}
 body[data-variant="atlas"] .rail {top:33%}
}
@media (max-width:370px) {
 body[data-variant="atlas"] .topbar .brand-official {width:102px}
 body[data-variant="atlas"] .header-cta.cta-with-subtext {font-size:10px}
 body[data-variant="atlas"] .header-cta.cta-with-subtext small {font-size:9px}
 body[data-variant="atlas"] .copy {padding-right:0}
}
@media(max-width:700px) and (max-height:660px){
 body[data-variant="atlas"] .panel {padding-top:max(39svh,160px)}
 body[data-variant="atlas"] .copy::before {inset:-12px -12px -20px}
}
@media (prefers-reduced-motion: reduce){
 body[data-variant="atlas"] .copy{opacity:1!important}
 body[data-variant="atlas"] .grid-sheen{transform:none;opacity:.18}
}

@media(max-width:700px){body[data-variant="atlas"] .geo-label{display:none}}

/* Coming-soon launch state. App-entry controls are disabled until the product launches. */
.app-entry-disabled:disabled {
  cursor:not-allowed;
  opacity:1;
  transform:none !important;
  box-shadow:none !important;
}
.header-cta.app-entry-disabled:disabled,
.solid-btn.app-entry-disabled:disabled {
  background:color-mix(in srgb,var(--card) 91%,var(--accent));
  border-color:color-mix(in srgb,var(--accent) 45%,var(--border));
  color:var(--text);
}
.outline-btn.app-entry-disabled:disabled {
  background:var(--card);
  color:var(--text);
  border-color:var(--border);
}
.app-entry-disabled:disabled small {opacity:.87;font-weight:650;}
body[data-theme="light"] .app-entry-disabled:disabled {color:var(--text);}
.launch-status {
  display:flex; align-items:center; gap:9px;
  margin-top:clamp(16px,3vh,28px);
  font-size:clamp(10px,.85vw,12px);
  font-weight:760;letter-spacing:.16em;
  color:var(--accent);
}
.launch-status-dot {
  width:8px;height:8px;flex:none;border-radius:50%;
  background:var(--warm);box-shadow:0 0 14px color-mix(in srgb,var(--warm) 50%,transparent);
}
#chapter-6 .eyebrow {letter-spacing:.18em;}
#chapter-6 h2 span {color:var(--accent);}
@media(max-width:700px) {
  #chapter-6.panel {padding-top:max(41svh,160px)}
  #chapter-6 .micro-panel {margin-top:12px}
  #chapter-6 .launch-status {letter-spacing:.09em;margin-top:15px}
  #chapter-6 .action-set {margin-top:13px}
}
/* The last chapter is the destination: don't prompt visitors to keep scrolling. */
body:has(#chapter-6.is-active) .scroll-indicator {opacity:0;visibility:hidden;}

/* Atlas launch CTA — deliberately simple, no clock or animated badge. */
body[data-variant="atlas"] .app-entry-disabled .app-lock-icon {
  flex: 0 0 20px;
  display: block;
  width: 20px;
  height: 20px;
  opacity: .85;
}
body[data-variant="atlas"] .app-entry-disabled:disabled {
  gap: 12px; /* 4px spacing scale */
}
@media (max-width:700px) {
  body[data-variant="atlas"] .app-entry-disabled .app-lock-icon {
    flex-basis:16px;
    width:16px;
    height:16px;
  }
  body[data-variant="atlas"] .app-entry-disabled:disabled {gap:8px}
}


/* Atlas final-chapter subscription panel — 4px spacing rhythm. */
body[data-variant="atlas"] #chapter-6 .copy {max-width:680px;}
body[data-variant="atlas"] #chapter-6 .signup-panel {
  margin-top:24px;
  border:1px solid var(--border);
  border-left:2px solid var(--accent);
  border-radius:8px;
  background:var(--card);
  backdrop-filter:blur(16px);
  padding:20px 24px;
  max-width:480px;
  box-shadow:0 12px 48px rgba(0,0,0,.15);
}
body[data-variant="atlas"] #chapter-6 .signup-kicker {
  color:var(--accent);
  font-size:10px;
  font-weight:750;
  line-height:1.4;
  letter-spacing:.12em;
}
body[data-variant="atlas"] #chapter-6 .signup-panel h3 {
  font-size:20px;
  line-height:1.25;
  letter-spacing:-.035em;
  font-weight:650;
  margin:8px 0 4px;
}
body[data-variant="atlas"] #chapter-6 .signup-panel .signup-summary {
  margin:0 0 12px;
  max-width:100%;
  font-size:13px;
  line-height:1.5;
}
body[data-variant="atlas"] #chapter-6 .signup-panel .signup-privacy {
  max-width:100%;font-size:11px;line-height:1.45;margin:12px 0 0;
}
body[data-variant="atlas"] #chapter-6 .signup-panel .signup-privacy {color:var(--muted)}
body[data-variant="atlas"] #chapter-6 .action-set {margin-top:20px;}
body[data-variant="atlas"] #chapter-6 .chapter-number {margin-top:20px;}
@media (min-width:701px) and (max-height:850px){
  body[data-variant="atlas"] #chapter-6.panel {padding-top:84px;padding-bottom:32px;}
  body[data-variant="atlas"] #chapter-6 h2 {margin:12px 0 16px;}
  body[data-variant="atlas"] #chapter-6 .signup-panel {margin-top:16px;padding:16px 20px;}
  body[data-variant="atlas"] #chapter-6 .signup-panel .signup-summary {margin-bottom:8px;}
  body[data-variant="atlas"] #chapter-6 .action-set {margin-top:12px;}
  body[data-variant="atlas"] #chapter-6 .chapter-number {margin-top:12px;}
}
@media (max-width:700px){
  body[data-variant="atlas"] #chapter-6 .signup-panel {margin-top:16px;padding:16px;}
  body[data-variant="atlas"] #chapter-6 .signup-panel h3 {font-size:18px;}
  body[data-variant="atlas"] #chapter-6 .signup-panel .signup-summary {font-size:12px;}
}
/* Reserve some globe atmosphere while making the subscription panel discoverable on phones. */
@media (max-width:700px) {
  body[data-variant="atlas"] #chapter-6.panel {padding-top:max(30svh,148px);}
}


/* Atlas + official EmailOctopus inline embed (kept in the existing signup panel).
   Native vendor inputs handle submissions, consent, messages and verification.
   Scoped overrides make provider output follow Atlas tokens in both themes.
   No in-app email collection or API credentials. All spacing uses 4px steps. */
body[data-variant="atlas"] #chapter-6 .signup-embed {
  width:100%; min-width:0; margin-top:12px;
  font-family:Inter,"Geist",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--text);
}
body[data-variant="atlas"] #chapter-6 .signup-embed :is(.inline-container,.eo-form-wrapper) {
  width:100%; max-width:100%; margin:0!important;
  padding:0!important; border:0!important;
  background:transparent!important; box-shadow:none!important;
  color:var(--text);
  font-family:inherit;
}
body[data-variant="atlas"] #chapter-6 .signup-embed :is(.text-block,h1,h2,h3,p) {color:var(--text);}
body[data-variant="atlas"] #chapter-6 .signup-embed :is(label,.form-label) {
  display:block;
  color:var(--text)!important;
  font-size:12px; font-weight:650;
  line-height:1.5; margin-bottom:8px;
}
body[data-variant="atlas"] #chapter-6 .signup-embed input:is([type="email"],[type="text"]) {
  box-sizing:border-box;
  display:block;
  width:100%; max-width:100%; min-width:0; min-height:48px;
  padding:12px!important;
  border:1px solid var(--border)!important;
  border-radius:8px!important;
  background:color-mix(in srgb,var(--bg) 64%,var(--card))!important;
  color:var(--text)!important;
  font-size:14px; line-height:1.5;
}
body[data-variant="atlas"] #chapter-6 .signup-embed input::placeholder {color:var(--muted)!important;opacity:1;}
body[data-variant="atlas"] #chapter-6 .signup-embed :is(button[type="submit"],input[type="submit"]) {
  box-sizing:border-box;
  min-height:48px;
  padding:12px 20px!important;
  border:1px solid var(--accent)!important;
  border-radius:8px!important;
  background:var(--accent)!important;
  color:#041116!important;
  font:700 12px/1.5 Inter,"Geist",sans-serif!important;
  cursor:pointer;
  transition:background-color .2s ease,box-shadow .2s ease;
}
body[data-variant="atlas"] #chapter-6 .signup-embed :is(button[type="submit"],input[type="submit"]):hover {
  filter:brightness(1.06);
}
body[data-variant="atlas"] #chapter-6 .signup-embed :is(input,button,select,textarea):focus-visible {
  outline:2px solid var(--accent)!important;
  outline-offset:4px;
}
body[data-variant="atlas"][data-theme="light"] #chapter-6 .signup-embed :is(button[type="submit"],input[type="submit"]) {
  color:#fff!important;
}
body[data-variant="atlas"] #chapter-6 .signup-embed a {color:var(--accent);text-underline-offset:4px;}
body[data-variant="atlas"] #chapter-6 .signup-nojs {
  color:var(--muted);font-size:12px;line-height:1.5;
}
body[data-variant="atlas"] #chapter-6 .signup-panel .signup-privacy {margin-top:12px;}
@media (max-width:700px){
  body[data-variant="atlas"] #chapter-6 .signup-embed {margin-top:8px;}
  body[data-variant="atlas"] #chapter-6 .signup-embed :is(button[type="submit"],input[type="submit"]) {width:100%;}
}
@media(prefers-reduced-motion:reduce){
  body[data-variant="atlas"] #chapter-6 .signup-embed :is(button[type="submit"],input[type="submit"]) {transition:none;}
}

/* Restore original Atlas system font selection, rather than loading a new web font. */
body[data-variant="atlas"] {
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
}

/* Atlas chapter title sizes live in assets/atlas-typography.css. */

/*
 * Atlas chapter navigation accessibility.
 * These markers sit on top of a moving globe and can cross very light surfaces.
 * Give every item a stable opaque contrast surface rather than relying on the
 * slide background. Shared styles cover ALL six chapters and both themes.
 */
body[data-variant="atlas"] .rail {
  align-items:stretch;
  gap:4px;
  padding:8px;
  border:1px solid rgba(118,223,209,.25);
  border-radius:14px;
  background:#091d25;
  box-shadow:0 8px 24px rgba(0,0,0,.2);
}
body[data-variant="atlas"] .rail a {
  box-sizing:border-box;
  justify-content:flex-end;
  min-height:40px;
  padding:0 9px;
  border-radius:8px;
  font-weight:700;
  color:#d9edf0;
  opacity:1;
}
body[data-variant="atlas"] .rail a i {
  height:3px;
  min-width:13px;
  background:currentColor;
}
body[data-variant="atlas"] .rail a[aria-current="step"] {
  color:#78e5d6;
  background:#173d43;
  opacity:1;
}
body[data-variant="atlas"] .rail a:hover {
  color:#fff;
  background:#22505a;
  opacity:1;
}
body[data-variant="atlas"] .rail a:focus-visible {
  outline:3px solid #fff;
  outline-offset:2px;
  background:#22505a;
}
body[data-variant="atlas"][data-theme="light"] .rail {
  border-color:#9fb7bf;
  background:#ffffff;
  box-shadow:0 8px 24px rgba(28,61,75,.15);
}
body[data-variant="atlas"][data-theme="light"] .rail a {
  color:#24434f;
  opacity:1;
}
body[data-variant="atlas"][data-theme="light"] .rail a[aria-current="step"] {
  color:#063946;
  background:#cfeced;
}
body[data-variant="atlas"][data-theme="light"] .rail a:hover,
body[data-variant="atlas"][data-theme="light"] .rail a:focus-visible {
  color:#052c37;
  background:#dcf0f2;
}
body[data-variant="atlas"][data-theme="light"] .rail a:focus-visible {
  outline-color:#063946;
}
@media (max-width:960px) {
  body[data-variant="atlas"] .rail {
    padding:5px;
    right:8px;
  }
  body[data-variant="atlas"] .rail a {
    min-width:36px;
    min-height:40px;
    padding:0 8px;
  }
}

/*
 * Atlas marketing-only refinements: no duplicate feature demonstration cards.
 * The final chapter must remain readable when EmailOctopus injects taller form
 * controls, validation messages, or confirmation text.
 */
body[data-variant="atlas"] #chapter-5 .storage-note {
  max-width:540px;
  margin-top:12px;
  font-size:clamp(12px,.92vw,14px);
  line-height:1.55;
  color:#b8cbd1;
}
body[data-variant="atlas"][data-theme="light"] #chapter-5 .storage-note {
  color:#375967;
}
body[data-variant="atlas"] #chapter-6.panel {
  min-height:100svh;
  height:auto;
  align-items:center;
  padding-top:clamp(86px,10svh,120px);
  padding-bottom:max(28px,5svh);
}
body[data-variant="atlas"] #chapter-6 .copy {max-width:610px;}
body[data-variant="atlas"] #chapter-6 h2 {
  margin-top:10px;
  margin-bottom:12px;
}
body[data-variant="atlas"] #chapter-6 .copy > .short {
  line-height:1.4;
  margin-bottom:0;
}
body[data-variant="atlas"] #chapter-6 .signup-panel {
  margin-top:14px;
  padding:14px 18px;
}
body[data-variant="atlas"] #chapter-6 .signup-panel h3 {
  margin:5px 0 3px;
}
body[data-variant="atlas"] #chapter-6 .signup-panel .signup-summary {
  margin-bottom:6px;
  line-height:1.4;
}
body[data-variant="atlas"] #chapter-6 .signup-panel .signup-privacy {
  margin-top:8px;
  line-height:1.4;
}
body[data-variant="atlas"] #chapter-6 .action-set {margin-top:12px;}
body[data-variant="atlas"] #chapter-6 .chapter-number {margin-top:10px;}
@media (max-width:700px) {
  body[data-variant="atlas"] #chapter-6.panel {
    padding-top:max(84px,12svh);
    padding-bottom:28px;
    align-items:center;
  }
  body[data-variant="atlas"] #chapter-6 .signup-panel {
    margin-top:12px;
    padding:12px 14px;
  }
  body[data-variant="atlas"] #chapter-6 .signup-panel .signup-privacy {
    margin-top:6px;
  }
}
@media (max-height:660px) {
  body[data-variant="atlas"] #chapter-6.panel {
    padding-top:80px;
    padding-bottom:24px;
  }
  body[data-variant="atlas"] #chapter-6 .chapter-number {margin-top:6px;}
}