@charset "UTF-8";
:root{color-scheme:dark;--ink:#f3f2ec;--muted:#c5cbd0;--blue:#8dd8ff;--line:rgba(222,234,241,.32);font-family:"Segoe UI Variable","Segoe UI",Arial,sans-serif;font-synthesis:none}
*{box-sizing:border-box}
html{min-height:100%;background:#101a23}
body{margin:0;min-height:100svh;color:var(--ink);overflow-x:hidden}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,a:focus-visible{outline:2px solid var(--blue);outline-offset:6px}
button[hidden],[hidden]{display:none!important}
.scene,.shade{position:fixed;inset:0;pointer-events:none}
.scene{background:#16202a url("threshold.png") center 46%/cover no-repeat;z-index:-2;transform:scale(1.025);animation:arrive 2.4s cubic-bezier(.2,.6,.2,1) forwards}
.shade{z-index:-1;background:linear-gradient(90deg,rgba(5,13,20,.75) 0%,rgba(5,13,20,.32) 49%,rgba(5,13,20,.03) 76%),linear-gradient(0deg,rgba(4,12,20,.78) 0%,transparent 68%,rgba(4,12,20,.3) 100%);transition:background .7s}
.masthead{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:35px 5.5vw}
.wordmark{color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;gap:14px;font-size:20px;font-weight:650;letter-spacing:.19em}
.brand-divider{height:18px;width:1px;background:var(--blue);opacity:.75}
.preview-button{display:flex;align-items:center;gap:9px;background:rgba(8,18,26,.36);border:1px solid rgba(225,238,244,.22);padding:9px 13px;border-radius:3px;font-size:11px;letter-spacing:.055em;color:#d3dce2;backdrop-filter:blur(12px)}
.status-dot{width:5px;height:5px;background:#91b8c9;border-radius:50%}
main{position:relative;min-height:calc(100svh - 162px)}
.arrival{padding:clamp(64px,14vh,160px) 5.5vw 84px;max-width:920px}
.intro-copy{animation:reveal 1.1s .18s both}
.eyebrow{display:flex;align-items:center;gap:13px;margin:0 0 22px;color:#bddcec;font-size:10px;font-weight:550;letter-spacing:.22em;line-height:1.5}
.fine-line{height:1px;width:36px;background:var(--blue)}
h1{margin:0;font-size:clamp(54px,6.6vw,100px);font-weight:350;letter-spacing:-.045em;line-height:1.04;text-wrap:balance}
.arrival-description{margin:22px 0 0;font-size:clamp(16px,1.4vw,20px);line-height:1.65;font-weight:350;color:#d8dce0}
.choices{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:47px;max-width:650px;animation:reveal 1s .48s both}
.choice{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;border:0;border-top:1px solid var(--line);background:linear-gradient(180deg,rgba(10,20,28,.30),rgba(10,20,28,.02));padding:17px 10px 14px 0;transition:background .25s,border-color .25s,transform .25s}
.choice:hover{border-color:var(--blue);background:linear-gradient(180deg,rgba(31,67,85,.36),transparent);transform:translateY(-3px)}
.choice-top{display:flex;align-items:center;justify-content:space-between;width:100%}
.choice-number{font-size:9px;letter-spacing:.17em;color:#b9d5e3}
.arrow{font-size:20px;color:var(--blue);font-weight:300}
.choice-title{font-size:27px;line-height:1.3;font-weight:450;letter-spacing:-.02em;margin:14px 0 9px}
.choice-description{color:#c4cbd0;font-size:13px;line-height:1.6;font-weight:350}
.arrival-footer{display:flex;justify-content:space-between;gap:20px;padding:0 5.5vw 25px;color:#aebdc7;font-size:9px;line-height:1.6;letter-spacing:.15em}
.arrival-mark{display:flex;align-items:center;gap:8px;white-space:nowrap}
.arrival-mark i{display:inline-block;width:24px;height:1px;background:#80c3e9}
.exploration{padding:30px 5.5vw 70px;animation:reveal .6s both}
.section-nav{display:flex;gap:34px;align-items:center;max-width:760px;min-height:43px;border-bottom:1px solid rgba(210,228,240,.2)}
.section-nav button{position:relative;white-space:nowrap;border:0;background:none;padding:0 0 18px;font-size:12px;letter-spacing:.025em;color:#aebdca}
.section-nav button[aria-current="page"]{color:#f7f7f3}
.section-nav button[aria-current="page"]:after{content:"";position:absolute;height:2px;background:var(--blue);left:0;right:0;bottom:-1px;box-shadow:0 0 10px #7bceff44}
.story{max-width:600px;padding-top:clamp(50px,10vh,105px);min-height:440px}
.story h1{font-size:clamp(42px,4.9vw,70px);line-height:1.08;outline:none}
.story-copy{color:#d5dce0;font-size:17px;line-height:1.8;font-weight:350;margin:24px 0 0;max-width:535px}
.story-foot{border-left:1px solid #76c6f0;margin:27px 0 0;padding:2px 0 2px 15px;font-size:12px;line-height:1.7;color:#aebfc9;max-width:490px}
.tour-controls{display:flex;align-items:center;gap:24px;margin-top:32px;padding-top:18px;border-top:1px solid var(--line)}
.text-button{border:0;background:none;padding:8px 0;font-size:12px;color:#d2dce2}
.text-button:disabled{opacity:.35;cursor:default}
.tour-count{font-size:10px;letter-spacing:.15em;color:#9bb9ca}
.next{margin-left:auto;color:var(--blue)}
.mode-dock{display:flex;align-items:center;flex-wrap:wrap;gap:20px;margin-top:44px;border-top:1px solid var(--line);padding-top:20px;max-width:760px}
#modeLabel{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:#a7c5d7}
.dock-button{padding:10px 14px;border:1px solid rgba(156,213,245,.4);background:rgba(16,35,48,.65);font-size:12px;border-radius:2px}
#chooseAgain{margin-left:auto}
body[data-mode="guided"] .section-nav{opacity:.8}
body[data-mode="guided"] .shade,body[data-mode="self"] .shade{background:linear-gradient(90deg,rgba(5,13,20,.91),rgba(5,13,20,.56) 48%,rgba(5,13,20,.14) 80%),linear-gradient(0deg,rgba(4,12,20,.7),transparent 85%)}
body[data-mode="guided"] .arrival-footer,body[data-mode="self"] .arrival-footer{display:none}
.fade-out{animation:exit .26s forwards!important;pointer-events:none}
dialog{position:fixed;border:1px solid #4c616d;border-radius:4px;background:#14212c;color:var(--ink);width:min(520px,calc(100vw - 40px));padding:40px;box-shadow:0 30px 120px #0008}
dialog::backdrop{background:#050c13b8;backdrop-filter:blur(6px)}
dialog h2{font-size:34px;letter-spacing:-.03em;font-weight:400;margin:0 0 22px}
dialog p:not(.eyebrow){font-size:14px;line-height:1.75;color:#c2d0d9}
.dialog-close{position:absolute;right:15px;top:10px;background:none;border:0;font-size:28px;font-weight:200}
.replay-button{display:flex;justify-content:space-between;width:100%;margin-top:26px;background:none;border:0;border-top:1px solid var(--line);padding:20px 0 0;color:var(--blue)}
@keyframes arrive{to{transform:scale(1)}}
@keyframes reveal{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@keyframes exit{to{opacity:0;transform:translateY(-6px)}}
@media(min-width:1700px){.arrival{padding-top:17vh;max-width:1000px}.choices{max-width:700px}}
@media(max-width:700px){.masthead{padding:23px 6vw}.wordmark{font-size:17px;gap:11px}.preview-button{font-size:10px;padding:7px 9px}.scene{background-position:62% center}.shade{background:linear-gradient(90deg,#07131bb8,#07131b35),linear-gradient(0deg,#07131bec,transparent 95%)}.arrival{padding:clamp(80px,24svh,190px) 6vw 55px}.eyebrow{font-size:9px;letter-spacing:.17em}.arrival h1{font-size:64px}.choices{gap:20px;margin-top:36px}.choice-title{font-size:23px}.choice-description{font-size:12px}.choice-number{font-size:8px;letter-spacing:.1em}.arrival-footer{padding:0 6vw 22px;font-size:8px;letter-spacing:.08em}.arrival-mark i{width:14px}.exploration{padding:32px 6vw 35px}.section-nav{gap:22px;overflow:auto;scrollbar-width:thin}.section-nav button{font-size:11px;padding-bottom:15px}.story{padding-top:52px;min-height:380px}.story-copy{font-size:16px}.mode-dock{gap:12px;margin-top:35px}#modeLabel{width:100%}#chooseAgain{margin-left:0}.tour-controls{gap:15px}dialog{padding:32px 26px}}
@media(max-width:370px){.arrival h1{font-size:55px}.choices{gap:14px}.choice-title{font-size:21px}.arrival-footer{flex-direction:column;gap:7px}.choice-description{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.scene{transform:none}}