@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=DM+Sans:wght@400;500;600&display=swap');
:root{color-scheme:dark;--bg:#080d21;--panel:#10182e;--line:#344461;--text:#edf4ff;--soft:#adbed6;--mint:#9bffe1;--gold:#ffda8a;--purple:#b6a4ff}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.6 'DM Sans',Arial,sans-serif;background-image:radial-gradient(ellipse at 75% 30%,#27305c42,transparent 55%)}button,a,input{touch-action:manipulation}button,a{font:inherit}button{cursor:pointer}a{color:inherit;text-underline-offset:5px}button{color:var(--text);background:#18223b;border:1px solid var(--line);border-radius:9px;padding:10px 16px}button:hover{border-color:var(--mint)}:focus-visible{outline:3px solid var(--gold);outline-offset:4px}[hidden]{display:none!important}header{height:100px;max-width:1440px;padding:22px 5%;margin:auto;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #ffffff18}.brand{font:italic 29px Georgia,serif;text-decoration:none}.brand span{display:block;font:9px 'Space Grotesk',sans-serif;letter-spacing:2px;margin-top:7px}.header-right{display:flex;align-items:center;gap:25px;font-size:11px}.header-right a{text-decoration:none}.live{color:var(--mint);letter-spacing:1px}.live:before{content:'●';font-size:8px;margin-right:8px}main{max-width:1440px;margin:auto;padding:0 5%}h1,h2,h3,.eyebrow,.status{font-family:'Space Grotesk',sans-serif}h1{font-size:clamp(48px,5.8vw,85px);font-weight:500;line-height:1.03;letter-spacing:-4px;margin:22px 0}h1 em{font-style:normal;color:var(--mint)}h2{font-weight:500;line-height:1.15;letter-spacing:-1px}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--mint)}.intro{min-height:calc(100svh - 100px);position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:55px 0 90px;gap:20px}.lead{color:var(--soft);font-size:16px;max-width:510px}.primary{background:var(--mint);color:#092321;border:0;border-radius:7px;padding:16px 25px;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;justify-content:space-between;gap:45px}.primary:hover{background:#c8ffef}.start-row{display:flex;align-items:center;gap:20px;margin:30px 0 20px}.start-row>span{font-size:10px;color:var(--soft)}.quiet{font-size:11px;color:var(--soft)}.intro-bottom{position:absolute;bottom:25px;left:0;right:0;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;color:var(--soft);border-top:1px solid #ffffff18;padding-top:18px}.intro-planet{position:relative;aspect-ratio:1;display:grid;place-items:center;max-height:560px}.planet{width:61%;height:61%;border-radius:50%;background:radial-gradient(circle at 30% 25%,#68a49c,#21505b 40%,#0c172f 75%);box-shadow:inset -25px -20px 45px #02071c,0 0 100px #9bffe11a;display:flex;flex-direction:column;justify-content:center;align-items:center;transform:rotate(-13deg);border:1px solid #9bffe156}.planet span{font:500 clamp(40px,7vw,105px) 'Space Grotesk';letter-spacing:-6px;color:#c8fff0}.planet small{font-size:8px;letter-spacing:3px;color:#b1dfd8}.orbit{position:absolute;inset:6%;border:1px solid #9bffe139;border-radius:50%;transform:rotate(-28deg) scaleY(.65)}.o2{inset:0;transform:rotate(50deg) scaleY(.75);border-style:dashed;border-color:#b6a4ff40}.satellite{position:absolute;left:9%;top:25%;color:var(--gold);font-size:40px;animation:float 5s ease-in-out infinite}.coord{position:absolute;right:0;top:20%;font:10px monospace;color:var(--soft)}.planet-label{position:absolute;right:3%;bottom:15%;font:10px monospace;color:var(--soft)}@keyframes float{50%{transform:translateY(-18px) rotate(40deg)}}
.hud{display:flex;justify-content:space-between;gap:25px;align-items:center;padding:30px 0 20px}.hud h2{font-size:30px;margin:10px 0}.hud p{color:var(--soft);font-size:13px;margin:0;max-width:720px}.status{text-align:right;min-width:140px;font-size:10px;color:var(--gold)}#steps{font-size:20px;letter-spacing:8px;color:var(--mint);margin-top:6px}.arena{position:relative;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#080e22}canvas{display:block;width:100%;height:430px;touch-action:none}.map-caption{position:absolute;top:16px;left:20px;right:20px;display:flex;justify-content:space-between;pointer-events:none;font:9px monospace;color:var(--soft)}.interact{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);background:var(--mint);color:#092321;font-size:12px;font-weight:700;white-space:nowrap}.controls{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:14px 0}.controls p{font-size:10px;color:var(--soft)}.dpad{display:flex;gap:5px}.dpad button{padding:5px 15px}.mission-panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.mission-panel h3{margin:0 0 8px;font-size:18px}.mission-panel p{font-size:12px;color:var(--soft);margin:0 0 14px}.station{padding:17px;border:1px solid var(--line);border-radius:10px}.station button{font-size:11px}.station.chosen{border-color:var(--mint);background:#9bffe10b}.charge{display:flex;gap:7px;align-items:center}.charge span{min-width:32px;text-align:center;font-size:24px;color:var(--gold)}.charge button{width:37px;padding:6px}.panel-full{grid-column:1/-1}.announcement{min-height:25px;font-size:12px;color:var(--mint)}.result{max-width:950px;padding:65px 0;margin:auto}.result h1{font-size:clamp(40px,5vw,65px)}.logbook{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:35px 0}.logbook article{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:20px}.logbook h3{font-size:12px;color:var(--mint);margin:0 0 10px}.logbook p{font-size:13px;color:var(--soft)}.recommendation{border-left:2px solid var(--mint);background:linear-gradient(90deg,#9bffe10c,transparent);padding:25px 30px}.recommendation h2{font-size:35px}.recommendation p{color:var(--soft);max-width:600px}.result-actions{display:flex;gap:15px;align-items:center;flex-wrap:wrap;margin-top:30px;font-size:12px}.fine{font-size:11px;color:var(--soft);margin-top:30px;max-width:700px}footer{max-width:1440px;margin:30px auto 0;padding:25px 5%;border-top:1px solid #ffffff18;display:flex;justify-content:space-between;gap:20px;font-size:10px;color:var(--soft)}
@media(max-width:750px){header{height:85px}.header-right{gap:12px}.live{display:none}.brand{font-size:25px}.brand span{font-size:7px}.intro{grid-template-columns:1fr;padding:35px 0 85px}.intro-copy{z-index:1}h1{letter-spacing:-2px;font-size:53px}.intro-planet{position:absolute;width:250px;right:-15px;top:55px;opacity:.25;z-index:-1}.intro-bottom{font-size:8px;gap:15px}.intro-bottom span:last-child{text-align:right}.start-row{gap:12px}.primary{padding:14px 20px;gap:25px}.hud{align-items:flex-start}.hud h2{font-size:24px}.status{min-width:75px;font-size:8px}#steps{font-size:13px;letter-spacing:2px}.hud p{font-size:12px}canvas{height:350px}.mission-panel{grid-template-columns:1fr;padding:15px}.controls{align-items:flex-start}.controls p{max-width:160px}.logbook{grid-template-columns:1fr}.result{padding:40px 0}.recommendation{padding:20px}.result h1{font-size:43px}.result-actions{align-items:flex-start;flex-direction:column}footer{flex-direction:column}.station{padding:14px}.station button{min-height:40px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media(max-width:750px){header{gap:12px}.brand{min-width:0}.brand span{max-width:125px;line-height:1.5;letter-spacing:1px}.header-right{flex-shrink:0}.header-right button{padding:8px 10px;font-size:10px}.header-right a{font-size:10px}.intro-planet{z-index:0;pointer-events:none}.intro-copy{position:relative}.planet-label,.coord{display:none}}
/* Órbita / nueva dirección visual */
:root{--bg:#070e1c;--panel:#111c2d;--line:#34475a;--text:#f4f5ed;--soft:#bdcbd0;--mint:#b4e7cf;--gold:#eabe72;--purple:#bbb5e8}
body{background:#070e1c;background-image:radial-gradient(ellipse at 78% 26%,#25455a66 0%,transparent 45%),radial-gradient(ellipse at 12% 60%,#172b3980 0%,transparent 45%);overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.25;background-image:radial-gradient(#b9ecde 1px,transparent 1px),radial-gradient(#e2c895 1px,transparent 1px);background-size:187px 189px,241px 229px;background-position:20px 25px,108px 65px}
header{height:92px;padding-top:18px;padding-bottom:18px;border-bottom:1px solid #b6d5ca25;position:relative;z-index:4}
.brand{font:italic 31px/1 Georgia,serif;letter-spacing:-1.4px}.brand::after{content:'✳';color:var(--gold);font:19px Arial;position:absolute;margin-left:3px;top:24px}.brand span{font:8px 'Space Grotesk',sans-serif;letter-spacing:2px;color:var(--soft);margin-top:6px}.header-right{gap:27px}.header-right a{color:#dbe9e5;letter-spacing:.03em}.header-right button{border:1px solid #b6d5ca45;background:#ffffff08;border-radius:50px;padding:8px 18px;font-size:11px}.live{color:var(--mint);font-size:9px;letter-spacing:.18em}
main{max-width:1440px}.intro{min-height:min(800px,calc(100svh - 92px));grid-template-columns:1fr 1.05fr;gap:0;padding:35px 0 100px;isolation:isolate}.intro-copy{position:relative;z-index:2}.intro-copy::before{content:'04';display:block;font:11px 'Space Grotesk',sans-serif;letter-spacing:.25em;color:#bbd7d1;margin-bottom:45px}.eyebrow{font-size:10px;letter-spacing:.2em;color:var(--mint)}.eyebrow-star{font-size:18px;color:var(--gold);vertical-align:middle;margin-right:7px}h1{font-family:'Space Grotesk',sans-serif;font-weight:400;font-size:clamp(56px,6.3vw,90px);letter-spacing:-.065em;line-height:1.04;margin:26px 0}h1 em{font-family:Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.05em;color:#c4e9d5}.lead{font-size:clamp(14px,1.15vw,16px);line-height:1.85;color:#c4d0d1}.start-row{margin:34px 0 22px}.start-row>span{font-size:10px;letter-spacing:.02em;line-height:1.6}.primary{background:#d7b379;color:#101c1d;border-radius:50px;padding:16px 24px;font-size:12px;transition:transform .2s,background .2s,box-shadow .2s;box-shadow:0 8px 30px #ddad6040}.primary:hover{background:#f6d79b;transform:translateY(-2px)}.quiet{color:#bed1cf;font-size:11px;text-decoration-color:#9ab1a990}.intro-bottom{color:#94aba9;border-color:#b6d5ca25;font-size:9px;letter-spacing:.1em}.intro-bottom b{color:var(--gold)}
.intro-planet{position:relative;height:min(640px,55vw);max-height:none;width:120%;max-width:none;aspect-ratio:auto;transform:translateX(-7%);isolation:isolate}.hero-art{position:absolute;inset:-10% -18% -10% -18%;z-index:-2;background-image:linear-gradient(90deg,#070e1c 0%,#070e1c55 23%,transparent 45%),url('assets/orbita-universe.png');background-position:center;background-size:cover;mask-image:radial-gradient(ellipse at center,#000 38%,transparent 75%)}.intro-planet .planet{width:48%;height:auto;aspect-ratio:1;background:radial-gradient(circle at 28% 24%,#96d4ba,#438a80 28%,#173c4c 62%,#0a1b2c 87%);border:1px solid #c5e8d44a;box-shadow:inset -28px -24px 55px #06101dcc,0 0 80px #8dd5bd38;transform:rotate(-13deg)}.intro-planet .planet span{font:500 clamp(46px,5vw,75px) 'Space Grotesk',sans-serif;letter-spacing:-6px;color:#dbf5e4;text-shadow:0 1px 15px #183633}.planet small{font-size:7px;letter-spacing:.25em}.orbit{inset:16%;border-color:#c4ddbd70;transform:rotate(-23deg) scaleY(.46);box-shadow:0 0 15px #d8b77b1a}.o2{inset:7%;border-color:#e7c58c40;transform:rotate(43deg) scaleY(.67)}.satellite{font-size:24px;left:20%;top:17%;color:var(--gold)}.coord,.planet-label{font:9px/1.7 'Space Grotesk',sans-serif;letter-spacing:.12em}.coord{right:9%;top:21%}.planet-label{right:3%;bottom:20%}.hero-orbit-label{position:absolute;left:3%;bottom:12%;z-index:2;padding:14px 16px;background:#111d2ba3;border:1px solid #b0d5c138;border-radius:10px;backdrop-filter:blur(10px);box-shadow:0 20px 50px #0003}.hero-orbit-label span,.hero-orbit-label small{display:block;color:#b6cbc6;font:8px/1.5 'Space Grotesk',sans-serif;letter-spacing:.13em}.hero-orbit-label strong{display:block;font:500 16px/1.15 'Space Grotesk',sans-serif;margin:7px 0;color:#f1f4e6}.hero-orbit-label small{color:#d7b379}
.game-heading,.panel-heading,.result-divider{display:flex;justify-content:space-between;gap:12px;color:#94aaa8;font:9px 'Space Grotesk',sans-serif;letter-spacing:.17em;padding:24px 0 0}.game-heading span:first-child,.panel-heading span:first-child,.result-divider span:first-child{color:var(--gold)}.hud{padding:25px 0 22px;align-items:end}.hud h2{font-size:clamp(28px,3.3vw,43px);letter-spacing:-.045em;margin:10px 0}.hud p{font-size:13px;line-height:1.7;max-width:700px}.status{background:#102332;border:1px solid #8eb8a64a;border-radius:12px;padding:14px 18px;color:var(--gold);min-width:170px;font-size:10px}#steps{letter-spacing:7px;font-size:15px}.arena{border:1px solid #8eb8a650;border-radius:18px;background:#081421;box-shadow:0 30px 80px #0005,0 0 0 5px #fff1;isolation:isolate}.arena:after{content:'';position:absolute;inset:8px;border:1px solid #d5ebd311;border-radius:11px;pointer-events:none}.arena-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 40%,#040b19aa 100%);z-index:1}.map-caption,.arena-coordinates{z-index:2;color:#c0d5cf;letter-spacing:.12em}.map-caption{font:9px 'Space Grotesk',sans-serif;top:20px;left:25px;right:25px}.arena-coordinates{position:absolute;bottom:16px;left:24px;right:24px;display:flex;justify-content:space-between;font:8px 'Space Grotesk',sans-serif;pointer-events:none}.interact{z-index:3;bottom:43px;border-radius:50px;background:#e4c58b;color:#152b2c;box-shadow:0 5px 24px #dcb97666;padding:12px 20px}.controls{margin:15px 0 8px}.controls p{color:#a9c0bc}.dpad button{background:#17283a;border-color:#456157;border-radius:8px;min-width:42px;min-height:40px;font-size:16px}.panel-heading{padding:25px 0 12px}.mission-panel{background:linear-gradient(145deg,#142536,#101c2b);border:1px solid #789d8d48;border-radius:16px;padding:18px;gap:12px;box-shadow:0 20px 70px #0003}.station{position:relative;background:linear-gradient(145deg,#1a3040,#142331);border:1px solid #829f9047;border-radius:12px;padding:23px;transition:transform .2s,border .2s,background .2s}.station::before{content:'✳';display:block;color:var(--gold);font-size:19px;margin-bottom:20px}.station:hover{border-color:#b8ddcb99;transform:translateY(-2px)}.station h3{font-size:19px;letter-spacing:-.03em}.station p{min-height:38px;line-height:1.65;color:#c0cfcc}.station button{font-size:11px;margin:5px 5px 0 0;border-radius:30px;background:#ffffff08;border-color:#8eb3a95c}.station button:hover{background:#b4e7cf;color:#102b28}.station.chosen{background:#1b433d;border-color:#b4e7cf}.station.chosen::before{content:'✓';color:#b4e7cf}.charge{margin-top:12px}.charge span{font:500 28px 'Space Grotesk';color:var(--gold)}.charge button{width:40px;height:40px;margin:0}.mission-panel>.primary{justify-content:center;margin-top:3px}.announcement{color:#d4e8d7}.result{max-width:1020px;padding:75px 0}.result h1{max-width:840px}.result-divider{border-bottom:1px solid #b6d5ca35;padding-bottom:18px;margin-top:45px}.logbook{grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0 35px}.logbook article{background:linear-gradient(145deg,#1a3040,#101e2b);border:1px solid #789d8d48;border-radius:13px;padding:25px 20px}.logbook article::before{content:'✳';display:block;color:var(--gold);font-size:18px;margin-bottom:25px}.logbook h3{font-size:10px;letter-spacing:.12em;text-transform:uppercase}.logbook p{font-size:13px;line-height:1.65;color:#c0cfcc}.recommendation{border:1px solid #91bdab55;border-left:3px solid var(--gold);border-radius:14px;background:linear-gradient(115deg,#223c3d,#142630);padding:32px}.recommendation h2{font-size:36px;margin:15px 0}.recommendation .primary{margin-top:15px}.result-actions button{border-radius:40px}.fine{color:#a7bdbb}footer{border-color:#b6d5ca25;letter-spacing:.03em}
@media(max-width:750px){header{height:82px}.intro{min-height:0;display:flex;flex-direction:column;align-items:stretch;padding:35px 0 80px}.intro-copy::before{margin-bottom:25px}.intro-copy h1{font-size:clamp(48px,11vw,68px);letter-spacing:-.065em}.intro-copy{order:1}.intro-planet{order:2;position:relative;right:auto;top:auto;width:100%;height:330px;transform:none;opacity:1;margin:10px 0 0;z-index:0}.hero-art{inset:-15% -16%;mask-image:radial-gradient(ellipse at center,#000 38%,transparent 74%)}.intro-planet .planet{width:47%}.intro-planet .planet span{font-size:42px}.intro-planet .orbit{inset:13%}.intro-planet .o2{inset:5%}.hero-orbit-label{left:1%;bottom:5%;padding:10px}.hero-orbit-label strong{font-size:12px}.hero-orbit-label span,.hero-orbit-label small{font-size:7px}.intro-bottom{font-size:8px;bottom:18px}.hud{align-items:flex-start;gap:10px}.hud h2{font-size:27px}.status{min-width:104px;padding:10px;font-size:8px}#steps{letter-spacing:3px}.arena-coordinates{font-size:7px}.map-caption{font-size:8px;left:17px;right:17px}.mission-panel{grid-template-columns:1fr;padding:12px}.station{padding:19px}.station::before{margin-bottom:12px}.station p{min-height:0}.logbook{grid-template-columns:1fr 1fr}.logbook article{padding:18px}.logbook article::before{margin-bottom:12px}.result h1{font-size:clamp(40px,10vw,55px)}.recommendation h2{font-size:28px}}
@media(max-width:400px){.start-row{align-items:flex-start;flex-direction:column}.intro-planet{height:280px}.header-right{gap:8px}.logbook{grid-template-columns:1fr}.arena-coordinates span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){.station,.primary{transition:none}.station:hover,.primary:hover{transform:none}}
/* La ilustración es el planeta de portada; las órbitas quedan superpuestas. */
.intro-planet .planet{display:none}.hero-art{inset:-12% -22%;background-position:center;background-size:cover;mask-image:radial-gradient(ellipse at center,#000 35%,transparent 75%)}
