@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&family=Noto+Serif+TC:wght@400;500;600&display=swap');
:root{--ink:#282436;--paper:#f7f5f0;--accent:#b3a0eb;--muted:#655f6d;--line:#ded9e1;--serif:'Instrument Serif','Noto Serif TC',Georgia,serif;--sans:'DM Sans',system-ui,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid #875cd4;outline-offset:5px}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:400}em{font-weight:400}::selection{background:#d6c7f2;color:#211731}.skip-link{position:fixed;z-index:30;left:20px;top:-100px;padding:12px;background:#fff;color:#222}.skip-link:focus{top:10px}.site-header{position:absolute;top:0;left:0;width:100%;height:106px;padding:0 5%;z-index:10;display:flex;align-items:center;gap:36px;color:#fff}.wordmark{font-family:var(--serif);font-size:43px;line-height:1;letter-spacing:-2px}.wordmark span{color:#baa6e7}nav{display:flex;gap:30px;margin-left:auto;font-size:14px}nav a{opacity:.85}nav a:hover{opacity:1}.header-actions{display:flex;gap:25px;align-items:center}#language{background:transparent;color:inherit;border:0;font-size:14px;padding:10px}.button{display:inline-flex;align-items:center;justify-content:center;gap:40px;background:#efe8ff;color:#332445;border:1px solid transparent;padding:16px 27px;border-radius:100px;font-size:14px;font-weight:500;transition:background .2s,transform .2s}.button:hover{background:#fff;transform:translateY(-2px)}.button-small{padding:12px 22px}.hero{position:relative;isolation:isolate;min-height:min(900px,100svh);height:850px;max-height:1100px;background:radial-gradient(ellipse at 80% 40%,#8f79a9 0,#4e3c6f 35%,#221d38 75%);color:#fff;overflow:hidden}.hero-art{position:absolute;inset:0;z-index:-3;background-position:center;background-size:cover;transform:scale(1.045);transition:transform .2s linear}.hero-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(23,16,42,.6),rgba(25,15,42,.06) 72%),linear-gradient(0deg,rgba(25,16,39,.35),transparent 35%)}.hero-copy{width:58%;max-width:880px;padding:190px 0 135px 7%}.eyebrow{font-size:12px;font-weight:500;letter-spacing:2px;line-height:1.5}.hero .eyebrow{color:#e4daf6;margin-bottom:27px}.hero h1{font-family:var(--serif);font-size:clamp(66px,6.9vw,110px);letter-spacing:-2.5px;line-height:.99}.hero h1 em{color:#e5d8fa}.hero-intro{font-size:16px;line-height:1.7;color:#e7dfee;max-width:350px;margin-top:28px}.hero-actions{display:flex;align-items:center;gap:24px;margin-top:35px;flex-wrap:wrap}.text-link{font-size:14px;border-bottom:1px solid #b1a4bf;padding:8px 0}.hero-foot{position:absolute;bottom:29px;left:5%;right:5%;display:flex;justify-content:space-between;border-top:1px solid #ffffff35;padding-top:20px;font-size:11px;letter-spacing:1.5px;color:#e5daef}.section-pad{padding:110px 8%}.about h2{font-family:var(--serif);font-size:clamp(44px,5.5vw,76px);line-height:1.06;margin:30px 0}.about .lead{font-size:20px;max-width:600px;color:var(--muted)}footer{padding:40px 5%;border-top:1px solid var(--line);display:flex;gap:30px;align-items:center;font-size:13px}footer>a:last-child{margin-left:auto}
@media(min-width:1600px){.hero-copy{padding-top:220px}.hero{height:980px}}@media(max-width:1000px){nav{gap:17px}.site-header{gap:25px}.hero-copy{width:70%;padding-top:185px}.hero{height:800px;max-height:none}.hero h1{font-size:80px}}@media(max-width:650px){.site-header{height:85px;padding:0 6%;gap:16px}nav{display:none}.header-actions{margin-left:auto;gap:8px}.wordmark{font-size:37px}.button-small{font-size:12px;padding:10px 16px}.hero{height:820px;min-height:0}.hero-copy{width:100%;padding:140px 7% 40px}.hero h1{font-size:64px;letter-spacing:-1.5px}.hero .eyebrow{font-size:10px;letter-spacing:1.5px}.hero-intro{font-size:15px;max-width:280px}.hero-actions{gap:16px;align-items:flex-start;flex-direction:column}.hero-foot{font-size:9px;letter-spacing:.7px;gap:20px}.hero-art{background-position:62% center}.hero-shade{background:linear-gradient(0deg,rgba(25,16,39,.4),transparent 50%),linear-gradient(90deg,rgba(23,16,42,.65),rgba(23,16,42,.1))}.section-pad{padding:75px 7%}.about .lead{font-size:18px}footer{flex-wrap:wrap}footer span{width:70%}footer>a:last-child{margin-left:0}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Wonder Atlas: an editorial story with one immersive world at each end. */
.hero{min-height:850px;max-height:none;height:min(900px,100svh)}
.hero-art{background-image:url('./assets/wonder-atlas.png')}
.hero-shade{background:linear-gradient(90deg,rgba(22,15,36,.67),rgba(22,15,36,.32) 38%,transparent 69%),linear-gradient(0deg,rgba(26,14,42,.38),transparent 38%)}
#hero-canvas{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none}
.hero-copy{position:relative;width:58%;padding-top:155px}
.hero h1{font-size:clamp(68px,6.2vw,96px)}
.hero-intro{max-width:390px}
.chapter-strip{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:25px 7%;background:#eae3f3;color:#5d4a6e;font-family:var(--serif);font-size:22px;line-height:1.2}
.chapter-strip>span:nth-child(even){font-size:13px;color:#9780ac}
.about{display:grid;grid-template-columns:1.2fr 1fr;gap:65px 100px;align-items:center}
.about-copy{max-width:620px}.about h2 em,.section-heading h2 em,.journey h3 em{color:#85719c}
.about-detail{margin-top:22px;max-width:510px;color:var(--muted);line-height:1.85}
.signature{font-family:var(--serif);font-style:italic;font-size:35px;margin-top:30px;color:#68577a}.signature span{font-size:15px;font-style:normal;margin-left:20px;letter-spacing:3px}
figure{margin:0}.portrait{max-width:390px;width:100%;justify-self:end;transform:rotate(3deg);background:white;padding:12px 12px 0;box-shadow:0 16px 48px #25203310}.portrait img{display:block;width:100%;height:410px;object-fit:cover;object-position:28% center}.portrait figcaption{display:flex;justify-content:space-between;align-items:center;padding:16px 4px;font-size:12px;color:#5c5263;gap:20px}.portrait figcaption>span:last-child{font-size:22px}
.journey{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr 1fr;gap:50px;border-top:1px solid var(--line);margin-top:35px;padding-top:50px;align-items:start}.journey h3{font-family:var(--serif);font-size:40px;line-height:1.1;margin-top:17px}.journey-step{position:relative;padding-top:4px}.journey-step .eyebrow{font-size:11px;letter-spacing:1.3px;padding-right:35px}.journey h4{font-family:var(--serif);font-size:40px;font-weight:400;margin:13px 0 10px}.journey-step>p:last-child{font-size:15px;color:var(--muted);max-width:300px}.chapter-number{position:absolute;right:0;top:0;font-family:var(--serif);font-style:italic;font-size:40px;color:#b6a7c7}
.interests{background:#eeeaf2}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:45px;margin-bottom:55px}.section-heading h2{font-family:var(--serif);font-size:clamp(44px,5.2vw,72px);line-height:1.07;margin-top:25px}.section-heading>p{color:var(--muted);max-width:370px;margin-bottom:8px;line-height:1.8}
.interest-layout{display:grid;grid-template-columns:.8fr 1.75fr;gap:60px}.interest-menu{display:flex;flex-direction:column;align-self:start}.interest-menu button{display:flex;align-items:center;gap:17px;color:#766e7e;background:none;border:0;border-bottom:1px solid #d8d0df;text-align:left;padding:28px 0;transition:color .2s}.interest-menu button:first-child{border-top:1px solid #d8d0df}.interest-menu button>span:first-child{font-size:12px;align-self:center;opacity:.7}.interest-menu button>span:nth-child(2){font-family:var(--serif);font-size:30px;line-height:1.2}.interest-menu button>span:last-child{font-size:22px;margin-left:auto}.interest-menu button[aria-selected=true]{color:#33243f}.interest-menu button[aria-selected=true]>span:last-child{transform:rotate(45deg)}
.interest-panel{display:grid;grid-template-columns:1fr 1fr;gap:35px;align-items:center}.interest-panel figure{position:relative}.interest-panel img{display:block;object-fit:cover;width:100%;height:420px;border-radius:140px 140px 3px 3px;object-position:center;filter:saturate(.8)}.interest-panel figcaption{margin-top:15px;text-align:center;font-size:10px;letter-spacing:1.3px;color:#716479}.interest-text .eyebrow{font-size:10px;letter-spacing:1.2px;color:#7e6991}.interest-text h3{font-family:var(--serif);font-size:38px;line-height:1.14;margin:20px 0}.interest-text>p:not(.eyebrow){font-size:15px;line-height:1.85;color:var(--muted)}.interest-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:23px}.interest-tags span{border:1px solid #d6cbdc;border-radius:50px;padding:6px 12px;font-size:11px;color:#706078}
.milestone{border-top:1px solid var(--line);display:grid;grid-template-columns:.5fr 2fr 40px;gap:50px;padding:32px 0;align-items:start}.milestone:last-child{border-bottom:1px solid var(--line)}.milestone-date{font-size:12px;letter-spacing:1.2px;color:#776880;padding-top:6px}.milestone .eyebrow{font-size:10px;letter-spacing:1.5px;color:#776880}.milestone h3{font-family:var(--serif);font-size:38px;line-height:1.15;margin:10px 0}.milestone p:last-child{max-width:650px;color:var(--muted);font-size:15px}.milestone-index{font-family:var(--serif);font-style:italic;font-size:36px;color:#b2a4bf}.archive-note{font-size:12px;color:#84788e;margin-top:24px}
.play{position:relative;display:grid;grid-template-columns:1fr 1.2fr;min-height:680px;overflow:hidden;background:radial-gradient(ellipse at 77% 50%,#35234e,#171222 65%);color:#f4ecfa;align-items:center;gap:20px;padding-top:75px;padding-bottom:75px}.play-copy{position:relative;z-index:2}.play .eyebrow{color:#b29acb}.play h2{font-family:var(--serif);font-size:clamp(48px,5.4vw,78px);line-height:1.07;margin:28px 0}.play h2 em{color:#cfb4ef}.play-copy>p:not(.eyebrow){color:#c5b7d4;line-height:1.8;font-size:17px}.play .button{margin-top:35px}.destination{display:block;font-size:12px;letter-spacing:1px;color:#ae99c4;margin-top:14px;margin-left:28px}.portal-wrap{position:relative;align-self:stretch;min-height:480px;touch-action:pan-y}.portal-wrap canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:grab;touch-action:pan-y}.portal-wrap canvas:active{cursor:grabbing}.portal-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:80% center;border-radius:50%;opacity:.85}.portal-ready .portal-fallback{display:none}.portal-ready canvas{opacity:1}.portal-controls{display:none;position:absolute;bottom:0;left:50%;transform:translateX(-50%);align-items:center;gap:18px;white-space:nowrap;color:#c4afd9;font-size:10px;letter-spacing:1.2px}.portal-ready .portal-controls{display:flex}.portal-controls button{border:1px solid #77608c;background:#ffffff06;color:#e8d8f6;border-radius:50%;width:42px;height:42px;font-size:20px}.portal-controls button:hover{background:#ffffff14}
.closing{text-align:center;padding:95px 6% 75px}.closing p{font-family:var(--serif);font-size:clamp(36px,4.5vw,63px);line-height:1.15}.closing em{color:#8b729e}.back-top{display:inline-block;font-size:13px;border-bottom:1px solid #c5b6d0;margin-top:30px;padding-bottom:5px;color:#776182}footer{padding-top:30px;padding-bottom:30px;color:#75697f}.footer-links{margin-left:auto;display:flex;gap:24px;align-items:center}.footer-links button{border:0;background:none;color:inherit;font-size:12px;padding:5px 0}.footer-links a{font-size:12px}.reveal-enabled .reveal{opacity:0;translate:0 24px;transition:opacity .8s ease,translate .8s ease}.reveal-enabled .reveal.is-visible{opacity:1;translate:0 0}.motion-paused .reveal{opacity:1;translate:0 0;transition:none!important}.motion-paused{scroll-behavior:auto}
/* Cosmic Explorer changes both the tone and the typographic system. */
body[data-direction=cosmic]{--paper:#0d1420;--ink:#e7edf7;--muted:#a3b3c9;--line:#293448;--accent:#7ce0fb}
[data-direction=cosmic] .hero{background:#060c19}[data-direction=cosmic] .hero-art{background-image:url('./assets/cosmic-explorer.png')}
[data-direction=cosmic] .hero h1{font-family:var(--sans);font-size:clamp(56px,5.6vw,86px);line-height:1.04;font-weight:500;letter-spacing:-4px}[data-direction=cosmic] .hero h1 em{font-family:var(--serif);color:#9edff2;font-size:1.13em;letter-spacing:-2px}[data-direction=cosmic] .hero-copy{width:60%;padding-top:190px}[data-direction=cosmic] .hero-shade{background:linear-gradient(90deg,#020914b0,transparent 75%)}
[data-direction=cosmic] .chapter-strip{background:#142033;color:#b7d0ea}[data-direction=cosmic] .interests{background:#121e2e}[data-direction=cosmic] .about h2 em,[data-direction=cosmic] .section-heading h2 em,[data-direction=cosmic] .journey h3 em,[data-direction=cosmic] .closing em{color:#8fcade}[data-direction=cosmic] .interest-menu button{color:#a4b0c5;border-color:#344155}[data-direction=cosmic] .interest-menu button[aria-selected=true]{color:#9fe5ff}[data-direction=cosmic] .interest-text .eyebrow,[data-direction=cosmic] .interest-tags span,[data-direction=cosmic] .milestone-date,[data-direction=cosmic] .milestone .eyebrow,[data-direction=cosmic] .signature,[data-direction=cosmic] .back-top{color:#95b5cb}[data-direction=cosmic] .button{background:#c9f2ff;color:#152333}[data-direction=cosmic] .portrait{transform:rotate(-2deg);background:#26354a}[data-direction=cosmic] .portrait figcaption{color:#c3d2e8}
/* Creative Sketchbook is a bright, tactile editorial alternative. */
body[data-direction=sketch]{--paper:#faf7ef;--ink:#39322d;--muted:#736a5d;--line:#dcd4c6}
[data-direction=sketch] .site-header{color:#423529}[data-direction=sketch] .hero{color:#403129;background:#f5eddd}[data-direction=sketch] .hero-art{background-image:url('./assets/creative-sketchbook.png')}
[data-direction=sketch] .hero-shade{background:linear-gradient(90deg,#faf5e995,#faf5e925 45%,transparent 60%)}[data-direction=sketch] .hero h1{font-size:clamp(72px,7.8vw,117px);letter-spacing:-3px}[data-direction=sketch] .hero h1 em{color:#8a769b}[data-direction=sketch] .hero-intro,[data-direction=sketch] .hero .eyebrow,[data-direction=sketch] .hero-foot{color:#6a5e6e}[data-direction=sketch] .hero-foot{border-color:#89777050}[data-direction=sketch] .button{background:#65526e;color:#fff}[data-direction=sketch] .button:hover{background:#48394f}[data-direction=sketch] .chapter-strip{background:#ede5d8;color:#796950}[data-direction=sketch] .interests{background:#f0ebdf}[data-direction=sketch] .interest-panel img{border-radius:3px;transform:rotate(-3deg);border:10px solid white;box-shadow:0 8px 30px #40321c14}[data-direction=sketch] .play .button{background:#e5d8f1;color:#392746}
html[lang=zh-Hant] h1,html[lang=zh-Hant] h2,html[lang=zh-Hant] h3,html[lang=zh-Hant] .closing p{font-family:'Noto Serif TC',Georgia,serif;letter-spacing:0;line-height:1.38}html[lang=zh-Hant] .hero h1{font-size:clamp(48px,5vw,76px)}html[lang=zh-Hant] .hero-copy{padding-top:165px}html[lang=zh-Hant] .about h2,html[lang=zh-Hant] .section-heading h2,html[lang=zh-Hant] .play h2{font-size:clamp(36px,4vw,56px)}html[lang=zh-Hant] .interest-menu button>span:nth-child(2){font-family:'Noto Serif TC',serif;font-size:24px}html[lang=zh-Hant] .interest-text h3{font-size:29px}html[lang=zh-Hant] .milestone h3{font-size:30px}html[lang=zh-Hant] .closing p{font-size:clamp(29px,4vw,48px)}
@media(max-width:1100px){.about{gap:60px}.interest-layout{gap:35px;grid-template-columns:.85fr 1.8fr}.interest-panel{gap:23px}.interest-menu button>span:nth-child(2){font-size:25px}.interest-text h3{font-size:32px}.interest-panel img{height:365px}.hero-actions{gap:20px}.hero .text-link{font-size:12px}.play{padding-left:6%;padding-right:4%}}
@media(max-width:850px){.about{grid-template-columns:1.2fr 1fr;gap:40px}.portrait img{height:350px}.journey{gap:27px}.journey-step .eyebrow{font-size:10px}.journey h3{font-size:33px}.interest-layout{grid-template-columns:1fr}.interest-menu{display:grid;grid-template-columns:repeat(4,1fr)}.interest-menu button{gap:9px;padding:18px 10px;border-top:1px solid #d8d0df}.interest-menu button>span:first-child{display:none}.interest-menu button>span:nth-child(2){font-size:23px}.interest-menu button>span:last-child{font-size:16px}.interest-panel{grid-template-columns:1fr 1.2fr;gap:40px;max-width:650px;margin:0 auto}.interest-panel img{height:400px}.play{grid-template-columns:1fr 1fr;min-height:630px}.portal-wrap{min-height:410px}.chapter-strip{font-size:18px;gap:14px}.chapter-strip>span:last-child,.chapter-strip>span:nth-last-child(2){display:none}.milestone{gap:25px}.hero h1{font-size:76px}}
@media(max-width:650px){
 .hero{height:auto;min-height:880px}.hero-copy{padding-top:132px;padding-bottom:340px;width:100%}.hero h1{font-size:clamp(52px,12vw,70px)}.hero-art{background-size:auto 630px;background-position:66% bottom;background-repeat:no-repeat}.hero-shade{background:linear-gradient(180deg,#30233fee 0%,#392847ee 22%,#39284766 53%,transparent 68%,#271a3740 100%)}.hero-intro{font-size:16px;max-width:330px}.hero-actions{flex-direction:row;align-items:center;gap:18px}.hero .button{padding:13px 22px}.hero .text-link{font-size:12px;max-width:130px;line-height:1.5}.hero-foot{font-size:10px;letter-spacing:.4px}.eyebrow{font-size:11px;letter-spacing:1.4px}.hero .eyebrow{font-size:11px}.chapter-strip{padding:22px 7%;font-size:17px}.chapter-strip>span:nth-child(5),.chapter-strip>span:nth-child(4){display:none}.about{grid-template-columns:1fr;gap:45px}.portrait{width:80%;max-width:320px;justify-self:center}.portrait img{height:330px}.about h2{font-size:48px}.about-detail{font-size:16px}.journey{grid-template-columns:1fr 1fr;gap:32px 25px;padding-top:35px;margin-top:15px}.journey>div:first-child{grid-column:1/-1}.journey h3{font-size:35px}.journey-step>p:last-child{font-size:14px}.chapter-number{font-size:28px}.journey h4{font-size:36px}.section-heading{display:block;margin-bottom:35px}.section-heading h2{font-size:47px}.section-heading>p{margin-top:25px;font-size:16px}.interest-menu{grid-template-columns:1fr 1fr}.interest-menu button{padding:18px 8px}.interest-menu button>span:nth-child(2){font-size:25px}.interest-panel{gap:25px;grid-template-columns:1fr;max-width:100%}.interest-panel figure{max-width:290px;width:85%;margin:0 auto}.interest-panel img{height:365px}.interest-panel figcaption{font-size:11px}.interest-text{margin-top:10px}.interest-text h3{font-size:38px}.interest-text .eyebrow{font-size:11px}.interest-text>p:not(.eyebrow){font-size:16px}.interest-tags span{font-size:12px}.milestone{grid-template-columns:1fr 30px;gap:12px 15px;padding:27px 0}.milestone-date{grid-column:1}.milestone>div{grid-column:1}.milestone-index{grid-column:2;grid-row:1/3}.milestone h3{font-size:35px}.milestone p:last-child{font-size:16px}.milestone .eyebrow{font-size:11px}.play{grid-template-columns:1fr;padding:65px 7% 40px;gap:0}.play h2{font-size:52px}.portal-wrap{min-height:390px;max-width:450px;width:100%;margin:auto}.play-copy>p:not(.eyebrow){font-size:16px}.portal-controls{bottom:5px}.closing{padding:65px 7%}.closing p{font-size:38px}footer{gap:18px;padding:27px 7%}footer>span{font-size:12px;flex:1}.footer-links{width:100%;margin-left:0;justify-content:space-between}.footer-links a,.footer-links button{font-size:12px;padding:10px 0}
 [data-direction=cosmic] .hero-copy{width:100%;padding-top:140px}[data-direction=cosmic] .hero h1{font-size:clamp(46px,10.5vw,66px);letter-spacing:-2px}[data-direction=cosmic] .hero-shade{background:linear-gradient(180deg,#050b18 0%,#050b18f0 30%,#050b1870 53%,transparent 80%)}[data-direction=cosmic] .hero-art{background-position:65% bottom}
 [data-direction=sketch] .hero h1{font-size:clamp(60px,13vw,79px)}[data-direction=sketch] .hero-shade{background:linear-gradient(180deg,#f8f2e5 0%,#f8f2e5f5 32%,#f8f2e530 70%,transparent)}[data-direction=sketch] .hero-art{background-position:67% bottom}
 html[lang=zh-Hant] .hero-copy{padding-top:145px;padding-bottom:350px}html[lang=zh-Hant] .hero h1{font-size:clamp(40px,9.5vw,54px)}html[lang=zh-Hant] .about h2,html[lang=zh-Hant] .section-heading h2{font-size:37px}html[lang=zh-Hant] .interest-menu button>span:nth-child(2){font-size:21px}html[lang=zh-Hant] .closing p{font-size:29px}
}
@media(prefers-reduced-motion:reduce){.reveal-enabled .reveal{opacity:1;translate:0 0}.hero-art{transform:none!important}}
