:root{font-family:Inter,sans-serif;color:#edf4ff;background:#02040b;scroll-behavior:smooth}*{box-sizing:border-box}body{margin:0;min-width:320px;overflow-x:hidden}a{color:inherit;text-decoration:none}#space{position:fixed;inset:0;width:100%;height:100%;z-index:-1}body:before{content:'';position:fixed;inset:0;background:radial-gradient(ellipse at 60% 48%,transparent 5%,#02040b33 65%,#02040baa);pointer-events:none;z-index:0}header,main,footer{position:relative;z-index:1}header{height:78px;padding:0 clamp(20px,5vw,88px);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #c6dcff16}.brand{font:700 16px 'Space Grotesk',sans-serif;letter-spacing:.12em}.brand span{font-weight:400;color:#8e9ebc}nav{display:flex;gap:32px;font-size:12px;color:#c4cce0}nav a:hover{color:#fff}main{min-height:calc(100svh - 138px);display:grid;grid-template-columns:minmax(270px,34%) minmax(0,1fr);align-items:center;padding:25px clamp(20px,5vw,88px)}.intro{align-self:center;z-index:3;pointer-events:none}.intro a{pointer-events:auto}.kicker,.hint,.card-kicker{font-size:10px;letter-spacing:.18em;color:#96b9e9;font-weight:600}.intro h1{font:600 clamp(49px,5.2vw,90px)/1.05 'Space Grotesk',sans-serif;letter-spacing:-.065em;margin:24px 0}.intro h1 em{font-style:normal;color:#8daee1}.intro>p:not(.kicker){max-width:390px;font-size:15px;line-height:1.85;color:#aab7cd}.hint{margin-top:48px;color:#c7d4eb}.hint span{margin-left:14px}.universe{height:min(760px,calc(100svh - 110px));min-height:580px;position:relative;isolation:isolate;--scale:1}.orbits{position:absolute;inset:0;pointer-events:none;background:repeating-radial-gradient(ellipse at 50% 50%,transparent 0px,transparent 50px,#c6ddff19 51px,transparent 52px,transparent 77px);mask-image:radial-gradient(ellipse,black 30%,transparent 74%);opacity:.9;transform:scale(var(--scale)) rotate(-15deg)}.sun{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;cursor:pointer}.sun-core{width:105px;height:105px;border-radius:50%;background:radial-gradient(circle at 30% 28%,#fff8ca,#ffe8a0 15%,#ffb548 43%,#fa621e 75%,#c73510);box-shadow:0 0 28px 12px #ff8d3366,0 0 100px 35px #f06c1e3b,0 0 180px 70px #f26d161c;animation:pulse 5s ease-in-out infinite}.sun-label{position:absolute;top:118px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:9px;letter-spacing:.16em;color:#f7ca94}@keyframes pulse{50%{box-shadow:0 0 40px 18px #ff8d3380,0 0 120px 55px #f06c1e40,0 0 200px 80px #f26d161c}}.planet{position:absolute;left:50%;top:50%;width:var(--size);height:var(--size);border:0;padding:0;border-radius:50%;cursor:pointer;background:radial-gradient(circle at 30% 26%,var(--light),var(--base) 45%,var(--dark) 78%,#02030a 100%);box-shadow:inset -10px -7px 15px #0008,0 0 18px var(--glow);transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y)));z-index:4;transition:filter .25s,box-shadow .25s;animation:planetFloat var(--duration) ease-in-out infinite alternate}.planet:before{content:'';position:absolute;inset:12%;border-radius:50%;background:repeating-linear-gradient(168deg,transparent 0 9px,#ffffff13 11px 15px,transparent 18px 28px);mix-blend-mode:screen;opacity:.8}.planet:after{content:attr(data-name);position:absolute;left:50%;top:calc(100% + 13px);transform:translateX(-50%);color:#c2cce1;font:500 10px 'Space Grotesk',sans-serif;letter-spacing:.1em;white-space:nowrap;text-shadow:0 2px 8px #000}.planet:hover,.planet:focus-visible,.planet.active{outline:2px solid #e0efffa8;outline-offset:7px;filter:brightness(1.4);box-shadow:inset -10px -7px 15px #0008,0 0 28px var(--glow),0 0 45px var(--glow)}.planet[data-name=Saturn] .ring{position:absolute;left:-38%;top:30%;width:176%;height:40%;border:8px solid #d5b99199;border-left-color:#ecd9b1;border-right-color:#9a826f;border-radius:50%;transform:rotate(-25deg);pointer-events:none}.planet[data-name=Uranus] .ring{position:absolute;left:-25%;top:22%;width:150%;height:60%;border:3px solid #c0f7ff88;border-radius:50%;transform:rotate(70deg);pointer-events:none}@keyframes planetFloat{to{translate:0 -8px}}.connectors{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:5}.connectors path{fill:none;stroke:#b7d7ff;stroke-width:1.3;stroke-dasharray:4 5;filter:drop-shadow(0 0 5px #7db5ff)}.planet-card{position:absolute;right:2%;bottom:7%;width:min(300px,49%);padding:22px 24px;background:#07101fdf;backdrop-filter:blur(22px);border:1px solid #a3c4f944;border-radius:13px;box-shadow:0 15px 55px #0008;z-index:6;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .2s,transform .2s,visibility .2s}.planet-card.open{opacity:1;visibility:visible;transform:translateY(0)}.planet-card h2{font:600 27px 'Space Grotesk',sans-serif;margin:10px 0}.planet-card p:not(.card-kicker){color:#b7c5dd;font-size:13px;line-height:1.7}.planet-card a{display:flex;justify-content:space-between;border-top:1px solid #ffffff25;margin-top:20px;padding-top:15px;color:#e0ecff;font-size:12px;font-weight:600}.mobile-help{display:none}footer{display:flex;justify-content:space-between;gap:20px;padding:22px clamp(20px,5vw,88px);font-size:10px;letter-spacing:.1em;color:#7c8da9;border-top:1px solid #c6dcff16}@media(max-width:950px){main{display:block;padding-top:60px}.intro{max-width:650px}.intro h1{font-size:clamp(55px,9vw,85px)}.universe{height:680px}.hint{margin-top:25px}}@media(max-width:600px){header{height:66px}.brand{font-size:13px}.brand span{display:none}nav{gap:15px;font-size:11px}main{padding:52px 12px 20px}.intro{padding:0 14px}.intro h1{font-size:55px}.intro>p:not(.kicker){font-size:13px}.universe{height:550px;min-height:550px;margin-top:0}.sun-core{width:65px;height:65px}.sun-label{top:79px}.planet-card{right:2%;bottom:0;width:75%;padding:14px 17px}.planet-card h2{font-size:22px}.planet-card p:not(.card-kicker){font-size:12px}.mobile-help{display:block;text-align:center;font-size:11px;color:#879cbb;margin:12px 0 28px}footer{font-size:9px}footer span:last-child{display:none}}@media(prefers-reduced-motion:reduce){.sun-core,.planet{animation:none}}
.planet-card{right:auto;bottom:auto;width:clamp(185px,19vw,270px);padding:17px 19px;z-index:8;transition:opacity .2s,transform .2s,visibility .2s,left .24s,top .24s}
.planet-card h2{font-size:23px}.planet-card p:not(.card-kicker){font-size:12px}
.connectors{z-index:7}.planet{z-index:6}
.ship{position:absolute;width:36px;height:15px;left:-12%;top:16%;z-index:2;pointer-events:none;filter:drop-shadow(0 0 7px #68aaff);animation:shipFlight 32s linear infinite}
.ship:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#9ec9ff,#f3f7ff 45%,#5d79a6);clip-path:polygon(0 50%,43% 10%,68% 35%,100% 50%,68% 65%,43% 90%)}
.ship:after{content:'';position:absolute;right:25px;top:7px;width:80px;height:2px;background:linear-gradient(90deg,transparent,#4d9aff 75%,#d8f2ff);box-shadow:0 0 9px #409dff}
.ship-one{top:16%}.ship-two{top:77%;animation-duration:43s;animation-delay:-19s;scale:.7}.ship-three{top:42%;animation-duration:38s;animation-delay:-28s;scale:.5}
@keyframes shipFlight{0%{left:-12%;translate:0 0;opacity:0}5%{opacity:.9}90%{opacity:.9}100%{left:108%;translate:0 -55px;opacity:0}}
@media(max-width:950px){.planet-card{width:210px}}
@media(max-width:600px){.universe{height:590px;min-height:590px}.planet-card{width:min(205px,55vw);padding:12px 14px}.planet-card h2{font-size:19px}.planet-card p:not(.card-kicker){font-size:11px}.planet-card a{margin-top:10px;padding-top:10px}.ship{scale:.6}}
@media(prefers-reduced-motion:reduce){.ship{display:none}}

/* Interactive orbital camera: all planet layers share one transform. */
.universe{overflow:hidden;touch-action:pan-y;cursor:grab}
.universe.dragging{cursor:grabbing;touch-action:none}
.universe-camera{position:absolute;inset:0;transform-origin:50% 50%;will-change:transform}
.universe-camera .planet-card{cursor:default}