:root{color-scheme:dark;--cream:#fff8e9;--muted:#c1c1db;--gold:#ffdc89;--night:#101431}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--night);color:var(--cream);font-family:"Avenir Next",Avenir,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:5px}.site-header{max-width:1180px;margin:auto;padding:24px 85px 0;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1}/* Offset the logo’s transparent left inset; center its visible artwork on phones. */
.logo{width:205px;height:auto;display:block;transform:translateX(-3.581871345%)}.header-link{font-size:13px;color:#e0dced}.hero{max-width:1180px;min-height:460px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:10px 85px 45px;gap:40px}.hero-copy{max-width:620px}.eyebrow{color:var(--gold);font-size:10px;letter-spacing:2px;font-weight:650}h1{font-size:58px;line-height:1.1;letter-spacing:-2.5px;font-weight:650;margin:20px 0}.hero-description{font-size:19px;line-height:1.65;color:#d8d5e9}.cosmo{width:290px;height:auto;filter:drop-shadow(0 16px 30px #03082080)}.journey-link{display:inline-flex;align-items:center;gap:35px;padding:14px 23px;border-radius:30px;background:var(--gold);color:var(--night);font-size:13px;font-weight:700;margin-top:13px}.journey-link:hover{text-decoration:none;background:#ffe5a6}.platforms{font-size:11px;color:var(--muted);margin-top:20px}.platforms strong{font-weight:600;color:var(--cream);margin-right:5px}.journey{max-width:1180px;margin:auto;padding:0 40px}.chapter{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:60px;padding:65px 0;border-top:1px solid #ffffff18}.chapter-number{color:var(--gold);font-size:10px;letter-spacing:2px;font-weight:650}.chapter h2{font-size:36px;line-height:1.15;letter-spacing:-1.2px;font-weight:600;margin:18px 0}.chapter p{font-size:15px;line-height:1.8;color:var(--muted);max-width:330px;margin:0}.shot{padding:0;background:transparent;border:0;text-align:left;color:var(--cream);display:block;width:100%;cursor:pointer}.shot>img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;border-radius:12px;border:1px solid #c7bdff40;box-shadow:0 12px 35px #0003;transition:transform .2s,border-color .2s}.shot:hover>img{transform:translateY(-3px);border-color:var(--gold)}.shot>span{display:flex;justify-content:space-between;gap:15px;font-size:11px;color:#b5b6d0;padding:11px 2px 0}.shot>span>span{color:var(--gold)}.constellation-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:center}.constellation-pair .shot:first-child{grid-column:1/-1}.constellation-pair .shot:last-child{grid-column:2;width:100%;margin-top:-60px;position:relative;background:var(--night);border:7px solid var(--night);border-radius:15px}.constellation-pair .shot:last-child>span{font-size:10px}.friends{grid-template-columns:1fr}.friends .chapter-copy{display:grid;grid-template-columns:1fr 1fr;column-gap:60px;align-items:center}.friends .chapter-number{grid-column:1/-1}.friends h2{margin-bottom:0}.friends p{max-width:420px;margin-top:16px}.friends-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:-25px}.puzzles .chapter-image{grid-column:1;grid-row:1}.puzzles .chapter-copy{grid-column:2;grid-row:1}.puzzles{grid-template-columns:1.2fr .8fr}.closing{text-align:center;padding:55px 25px 60px;background:radial-gradient(ellipse at bottom,#302047,transparent 65%)}.closing>span{font-size:32px;color:var(--gold)}.closing h2{font-size:29px;line-height:1.3;letter-spacing:-.8px;font-weight:500}.closing p{color:var(--muted);font-size:12px}footer{max-width:1100px;margin:auto;border-top:1px solid #ffffff20;padding:20px 0 28px}footer>p{font-size:10px;color:#9d9fba;text-align:center;margin:0 0 25px}.footer-row{display:flex;justify-content:space-between;align-items:center}.footer-row small{font-size:10px;color:#b6b6d0}.footer-row nav{display:flex;gap:25px;font-size:12px}dialog{border:1px solid #ffffff40;border-radius:16px;background:#111630;color:var(--cream);padding:48px 16px 8px;max-width:1100px;width:calc(100% - 40px);max-height:94vh;box-shadow:0 20px 90px #000a}dialog::backdrop{background:#030617df;backdrop-filter:blur(6px)}dialog>img{display:block;width:100%;max-height:73vh;object-fit:contain}dialog>p{font-size:13px;text-align:center;margin:15px 0 8px}.close{position:absolute;top:5px;right:10px;width:40px;height:40px;background:transparent;border:0;color:var(--cream);font-size:30px;cursor:pointer}.skip{position:absolute;top:-100px;left:15px;padding:15px;background:var(--gold);color:#111630;z-index:5}.skip:focus{top:10px}.legal{max-width:720px;padding:30px 24px 70px;margin:auto}.legal h1{font-size:35px}.legal h2{font-size:21px;margin-top:30px}.legal p{font-size:15px;line-height:1.75;color:var(--muted)}.legal a{color:var(--gold);text-decoration:underline}.notice{border-left:2px solid var(--gold);padding-left:20px}body>header:not(.site-header){max-width:720px;margin:30px auto;padding:0 24px}body>footer:not(:has(.footer-row)){padding:25px;display:flex;justify-content:space-between}body>footer>div:not(.footer-row){display:flex;gap:25px}@media(max-width:900px){.site-header{padding-inline:40px}.hero{padding:10px 40px 40px;min-height:400px}.cosmo{width:220px}h1{font-size:43px}.hero-description{font-size:16px}.chapter{gap:30px}.chapter h2{font-size:30px}.chapter p{font-size:14px}.constellation-pair .shot:last-child{margin-top:-25px}.friends-gallery{gap:14px}footer{margin:0 40px}.friends .chapter-copy{column-gap:30px}}@media(max-width:600px){.site-header{padding:20px 24px 0;justify-content:center}.logo{width:170px;transform:translateX(-.621345029%)}.header-link{font-size:11px}.hero{padding:35px 24px 40px;display:flex;flex-direction:column;text-align:center;gap:10px}.hero-copy{max-width:350px}.eyebrow{font-size:9px;letter-spacing:1.5px}h1{font-size:39px;letter-spacing:-1.8px;margin:16px 0}.hero-description{font-size:15px}.cosmo{width:160px;margin-top:5px}.platforms{font-size:10px}.journey{padding:0 24px}.chapter,.puzzles{grid-template-columns:1fr;padding:38px 0;gap:26px}.chapter h2{font-size:31px;margin:14px 0}.chapter p{max-width:100%;font-size:14px;line-height:1.7}.chapter h2 br{display:none}.constellation-pair{gap:15px}.constellation-pair .shot:last-child{margin-top:0;grid-column:1/-1;border:0}.constellation-pair .shot:last-child>span{font-size:11px}.friends .chapter-copy{display:block}.friends h2{margin-bottom:14px}.friends p{margin-top:0}.friends-gallery{grid-template-columns:1fr;gap:23px;margin:0}.puzzles .chapter-image,.puzzles .chapter-copy{grid-column:auto;grid-row:auto}.closing{padding:35px 24px 45px}.closing h2{font-size:26px}footer{margin:0 24px}footer>p{line-height:1.6;max-width:290px;margin:0 auto 22px}.footer-row nav{font-size:11px;gap:18px}.footer-row small{font-size:9px}.shot>img{border-radius:10px}dialog{width:calc(100% - 20px);padding-left:8px;padding-right:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.hero-copy{max-width:590px}.hero-description{max-width:510px;font-size:17px}.hero h1{font-size:52px}.friends-gallery{margin-top:-25px}@media(max-width:900px){.hero h1{font-size:39px}.hero-description{font-size:15px}}@media(max-width:600px){.hero h1{font-size:37px}.hero-description{font-size:14px;line-height:1.75}.friends-gallery{margin-top:0}}

.friends{grid-template-columns:.8fr 1.2fr}.friends .chapter-copy{display:block}.friends h2{margin-bottom:18px}.friends p{margin-top:0;max-width:330px}.character-pair{display:flex;align-items:end;justify-content:center;gap:24px;background:radial-gradient(ellipse at center,#30234b60,transparent 70%)}.character-pair figure{margin:0;width:46%;max-width:265px}.character-pair img{width:100%;height:auto;display:block}.crab-character{width:100%;aspect-ratio:1;background:url('assets/crab-characters.webp') center center/300% 100% no-repeat}.character-pair figcaption{text-align:center;font-size:12px;color:var(--muted);margin-top:12px}.quiz{grid-template-columns:1.2fr .8fr}.quiz .chapter-image{grid-column:1;grid-row:1}.quiz .chapter-copy{grid-column:2;grid-row:1}@media(max-width:600px){.friends,.quiz{grid-template-columns:1fr}.character-pair{gap:12px}.character-pair figure{width:48%}.character-pair figcaption{font-size:11px}.quiz .chapter-image,.quiz .chapter-copy{grid-column:auto;grid-row:auto}}

#shot-caption:empty{display:none}

.release-platforms{margin-top:23px}.release-label{font-size:11px;color:var(--gold);margin:0 0 10px;letter-spacing:.5px}.platform-icons{display:flex;align-items:center;gap:27px}.platform-item{display:inline-flex;align-items:center;gap:10px;font-size:12px;color:#e2dfef}.apple-icon{height:36px;width:28px;overflow:hidden;display:inline-block;position:relative}.apple-icon img{position:absolute;width:28px;height:88px;top:-23px;left:0;filter:invert(1)}.android-icon{width:34px;height:30px;object-fit:contain}@media(max-width:600px){.platform-icons{justify-content:center;gap:25px}.platform-item{font-size:11px}}

/* One prominent release announcement, with a still reduced-motion state. */
.release-platforms{margin-top:25px}.release-label{display:inline-flex;align-items:center;gap:15px;position:relative;margin:0 0 16px;padding:12px 22px;border:1px solid #ffdc8970;border-radius:16px;background:linear-gradient(110deg,#332443,#28253c);color:#ffe5a3;font-size:25px;font-weight:700;letter-spacing:.3px;box-shadow:0 0 24px #ffcf6615;animation:release-glow 3.8s ease-in-out infinite}.release-spark{font-size:18px;display:inline-block;animation:release-spark 3.8s ease-in-out infinite}.release-spark:last-child{animation-delay:1.9s;font-size:13px}.platform-icons{padding-left:4px}@keyframes release-glow{0%,100%{box-shadow:0 0 18px #ffcf6612;border-color:#ffdc8970}50%{box-shadow:0 0 32px #ffcf6633;border-color:#ffdc89c0}}@keyframes release-spark{0%,100%{opacity:.55;transform:scale(.9)}50%{opacity:1;transform:scale(1.12)}}@media(max-width:600px){.release-label{font-size:24px;padding:12px 20px;gap:14px}.platform-icons{padding-left:0}}@media(prefers-reduced-motion:reduce){.release-label,.release-spark{animation:none!important}.release-spark{opacity:1;transform:none}}

/* One continuous sky starts at the page top, behind the logo and all content. */
.homepage{position:relative;isolation:isolate;--sky-height:850px}
.homepage::before{content:"";position:absolute;inset:0 0 auto;height:var(--sky-height);background:linear-gradient(0deg,var(--night),#10143120 65%),url('assets/sky.webp') center 45%/cover;pointer-events:none;z-index:0}
.homepage>.site-header,.homepage>main,.homepage>footer{position:relative;z-index:2}
/* Stars share the sky’s page origin and height, so both scroll together. */
.ambient-stars{position:absolute;inset:0 0 auto;height:var(--sky-height);z-index:1;overflow:hidden;pointer-events:none}
.ambient-stars i{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);border-radius:50%;background:#fff8ed;box-shadow:0 0 6px 2px #f0e8ffcc,0 0 18px 5px #b6a0ff80,0 0 32px 8px #9173ff30;opacity:.8;animation:ambient-twinkle 5s ease-in-out infinite;animation-delay:var(--delay)}
.ambient-stars i:nth-child(3n){background:#fff2bd;box-shadow:0 0 7px 2px #ffe5a6cc,0 0 20px 5px #ffd47b70,0 0 34px 8px #ffca6830;animation-duration:7s}
.ambient-stars i:nth-child(2n)::after{content:"";position:absolute;inset:-6px;background:linear-gradient(90deg,transparent 42%,#fff7e9 50%,transparent 58%),linear-gradient(0deg,transparent 42%,#fff7e9 50%,transparent 58%);opacity:.85}
@keyframes ambient-twinkle{0%,100%{opacity:.5;transform:scale(.85)}50%{opacity:1;transform:scale(1.2)}}
@media(max-width:600px){.homepage{--sky-height:1000px}}
@media(prefers-reduced-motion:reduce){.ambient-stars i{animation:none!important;opacity:.8;transform:none}}

.closing .game-summary{max-width:580px;margin:20px auto 0;font-size:14px;line-height:1.8}