:root{
  --bg:#061833; --bg2:#0b2545; --cyan:#4df5ff; --blue:#6ea8ff; --gold:#ffd166; --pink:#ff7ad9; --green:#7cffb2; --text:#f5fbff; --muted:#b9cee4; --glass:rgba(255,255,255,.10); --line:rgba(255,255,255,.18);
  font-family:"Noto Sans CJK SC","Microsoft YaHei",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box} html,body{margin:0;min-height:100%;background:radial-gradient(circle at 20% 10%,#164575 0,#061833 40%,#020813 100%);color:var(--text);overflow-x:hidden}
button{font:inherit;color:inherit;border:0;cursor:pointer} .app-shell{min-height:100vh;padding:72px 16px 86px;position:relative;max-width:560px;margin:0 auto}
.starfield,.starfield span{position:fixed;inset:0;pointer-events:none;overflow:hidden}.starfield:before,.starfield:after,.starfield span:before,.starfield span:after{content:"";position:absolute;border-radius:50%;background:#fff;box-shadow:80px 120px #fff,220px 40px #fff,320px 250px #fff,470px 180px #fff,140px 420px #9ee7ff,410px 560px #fff,30px 650px #fff;opacity:.65;animation:twinkle 5s infinite alternate}.starfield:before{width:2px;height:2px;left:20%;top:10%}.starfield:after{width:3px;height:3px;left:70%;top:25%;animation-delay:1s}.starfield span:nth-child(1):before{width:1px;height:1px;left:50%;top:55%;animation-delay:2s}.starfield span:nth-child(2):before{width:2px;height:2px;left:10%;top:65%;animation-delay:3s}@keyframes twinkle{to{opacity:.2;transform:translateY(8px)}}
.topbar{position:fixed;z-index:20;left:50%;transform:translateX(-50%);top:0;width:min(560px,100vw);height:64px;display:flex;align-items:center;gap:10px;padding:10px 14px;background:linear-gradient(180deg,rgba(2,10,24,.92),rgba(2,10,24,.50));backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.brand{flex:1;line-height:1.1}.brand small{display:block;color:var(--muted);font-size:10px;margin-bottom:4px}.brand strong{font-size:16px;letter-spacing:.5px}.icon-btn{width:40px;height:40px;border-radius:14px;background:var(--glass);border:1px solid var(--line)}.icon-btn.music-on{background:rgba(77,245,255,.18);border-color:rgba(77,245,255,.45);box-shadow:0 0 18px rgba(77,245,255,.22)}
.screen{display:none;animation:fadeIn .35s ease}.screen.active{display:block}@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.glass{background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.07));border:1px solid var(--line);box-shadow:0 20px 50px rgba(0,0,0,.35),inset 0 1px rgba(255,255,255,.18);backdrop-filter:blur(16px);border-radius:26px}.hero-card{padding:30px 24px 24px;min-height:560px;position:relative;overflow:hidden}.hero-card:after{content:"";position:absolute;right:-90px;bottom:-90px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,var(--cyan),transparent 65%);opacity:.16}.eyebrow{color:var(--cyan);letter-spacing:2px;text-transform:uppercase;font-weight:700;font-size:12px}.hero-card h1{font-size:46px;line-height:1.08;margin:18px 0 14px;letter-spacing:1px}.hero-card h1 span{background:linear-gradient(90deg,var(--cyan),var(--gold),#fff);-webkit-background-clip:text;color:transparent}.lead{color:#dcecff;line-height:1.75;font-size:15px}.orbit-logo{width:132px;height:132px;margin:6px auto 22px;position:relative;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#143a69,#081d3b 70%);box-shadow:0 0 40px rgba(77,245,255,.32)}.orbit-logo b{font-size:42px;color:var(--gold)}.orbit-logo i{position:absolute;inset:14px;border:1.5px solid rgba(77,245,255,.65);border-radius:50%;transform:rotate(0deg) skew(12deg);animation:spin 9s linear infinite}.orbit-logo i:nth-child(2){transform:rotate(60deg) skew(12deg);animation-duration:12s;border-color:rgba(255,209,102,.7)}.orbit-logo i:nth-child(3){transform:rotate(120deg) skew(12deg);animation-duration:15s;border-color:rgba(255,122,217,.7)}@keyframes spin{to{rotate:360deg}}.hero-actions,.button-row{display:flex;gap:12px;margin-top:22px}.primary,.secondary{border-radius:18px;padding:14px 18px;font-weight:800;letter-spacing:.5px}.primary{background:linear-gradient(135deg,#19d7ff,#5e6bff 60%,#a87cff);box-shadow:0 12px 25px rgba(42,142,255,.34)}.secondary{background:rgba(255,255,255,.10);border:1px solid var(--line)}.full{width:100%;margin-top:12px}.mission-summary{margin-top:14px;display:grid;grid-template-columns:repeat(3,1fr);padding:16px 10px;text-align:center}.mission-summary b{font-size:24px;display:block}.mission-summary span{font-size:11px;color:var(--muted)}.section-title{margin:18px 2px 18px}.section-title h2,.scene-head h2{margin:5px 0 8px;font-size:28px}.section-title p,.scene-head p{color:var(--muted);line-height:1.6}.lab-grid{display:grid;gap:14px}.lab-card{padding:20px;min-height:148px;position:relative;overflow:hidden}.lab-card:active{transform:scale(.985)}.lab-no{font-size:12px;color:var(--gold);font-weight:900;letter-spacing:2px}.lab-card h3{margin:8px 0;font-size:22px}.lab-card p{color:#d1e2f5;line-height:1.55;margin:0 0 12px}.lab-card b{color:var(--cyan);font-size:13px}.lab-card:after{content:"";position:absolute;right:-45px;top:-45px;width:130px;height:130px;border-radius:50%;background:radial-gradient(circle,rgba(77,245,255,.35),transparent 70%)}.copy-card{padding:22px}.copy-card p{color:#dcecff;line-height:1.75}.scene-head{padding:4px 2px}.tag{display:inline-block;background:rgba(77,245,255,.12);border:1px solid rgba(77,245,255,.35);color:var(--cyan);border-radius:999px;padding:7px 12px;font-size:12px;font-weight:800}.quantum-stage,.tokamak,.magnet-stage,.deep-stage{position:relative;margin:18px 0;padding:18px;min-height:285px;overflow:hidden}.satellite{position:absolute;left:50%;top:24px;transform:translateX(-50%);width:92px;height:60px;border-radius:16px;background:linear-gradient(135deg,#dfeaff,#7bbcff);color:#082246;text-align:center;font-weight:900;padding-top:10px;box-shadow:0 0 26px rgba(77,245,255,.55)}.beam{position:absolute;left:50%;top:88px;width:5px;height:135px;background:linear-gradient(var(--cyan),transparent);box-shadow:0 0 20px var(--cyan);transform-origin:top;animation:pulse 1.5s infinite}.station{position:absolute;bottom:22px;width:118px;height:72px;border-radius:18px;background:rgba(255,255,255,.13);border:1px solid var(--line);display:grid;place-items:center;text-align:center;font-weight:800}.station small,.satellite small{font-size:10px;color:#d9f7ff}.station-a{left:22px}.station-b{right:22px}.eavesdropper{position:absolute;right:36%;top:128px;width:46px;height:46px;border-radius:50%;background:var(--pink);display:grid;place-items:center;font-weight:900;box-shadow:0 0 28px rgba(255,122,217,.7);opacity:.95}@keyframes pulse{50%{height:160px;opacity:.55}}
.control-panel{padding:18px;margin-top:14px}.control-panel h3{margin-top:0}.control-panel p{color:#d1e2f5;line-height:1.65}.photon-row{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:16px 0}.photon{height:54px;border-radius:16px;background:radial-gradient(circle at 35% 35%,#fff,var(--cyan));color:#07172b;font-weight:900;border:2px solid transparent}.photon.chosen{border-color:var(--gold);box-shadow:0 0 18px var(--gold)}.result-box{margin-top:14px;border-radius:18px;padding:14px;background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.12);color:#eaffff;line-height:1.55}.tokamak{height:300px;display:grid;place-items:center}.plasma-ring{width:240px;height:152px;border:20px solid rgba(77,245,255,.42);border-radius:50%;box-shadow:0 0 45px rgba(77,245,255,.48), inset 0 0 35px rgba(255,122,217,.35);animation:ring 5s linear infinite}.plasma-core{position:absolute;width:112px;height:112px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,var(--gold),#ff7a2a 46%,rgba(255,122,217,.1));font-weight:900;color:#1e0b00;box-shadow:0 0 50px rgba(255,209,102,.68)}.heat-wave{position:absolute;width:280px;height:180px;border-radius:50%;border:1px solid rgba(255,209,102,.45);animation:breath 2.2s infinite alternate}@keyframes ring{to{transform:rotate(360deg)}}@keyframes breath{to{transform:scale(1.14);opacity:.35}}label{display:block;font-weight:700;margin:12px 0}input[type=range]{width:100%;accent-color:#4df5ff}.magnet-stage{height:320px}.coil{position:absolute;top:52px;width:92px;height:190px;border-radius:24px;border:16px solid rgba(77,245,255,.55);box-shadow:0 0 28px rgba(77,245,255,.35)}.coil.left{left:24px}.coil.right{right:24px}.field-lines{position:absolute;inset:70px 82px}.field-lines i{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);box-shadow:0 0 14px var(--cyan);animation:flow 1.8s infinite}.field-lines i:nth-child(1){top:10%}.field-lines i:nth-child(2){top:35%;animation-delay:.2s}.field-lines i:nth-child(3){top:60%;animation-delay:.4s}.field-lines i:nth-child(4){top:85%;animation-delay:.6s}@keyframes flow{50%{transform:scaleX(.65);opacity:.45}}.sample{position:absolute;left:50%;top:85px;transform:translateX(-50%);width:84px;height:84px;border-radius:22px;background:linear-gradient(135deg,#eef9ff,#93e9ff);color:#0a2543;display:grid;place-items:center;font-weight:900}#signalCanvas{position:absolute;left:18px;right:18px;bottom:18px;width:calc(100% - 36px);height:110px;border-radius:18px;background:rgba(0,0,0,.24)}.deep-stage{height:300px}.planet{width:160px;height:160px;border-radius:50%;margin:8px auto 24px;background:radial-gradient(circle at 30% 25%,#b6fff9,#528dff 45%,#332065 75%);box-shadow:0 0 55px rgba(110,168,255,.65);position:relative}.planet span{position:absolute;inset:28px;border-radius:50%;border:2px solid rgba(255,255,255,.25);transform:rotate(-20deg)}.spectrum{height:68px;border-radius:20px;background:linear-gradient(90deg,#3e1c64,#2255a4,#18a88e,#ffca57,#ff5d7e);position:relative;overflow:hidden}.spectrum i{position:absolute;top:0;width:4px;height:100%;background:#fff;box-shadow:0 0 14px #fff}.hint{text-align:center;color:#dcecff}.choice-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.choice-grid button{padding:14px;border-radius:16px;background:rgba(255,255,255,.10);border:1px solid var(--line);font-weight:800}.choice-grid button.selected{background:rgba(77,245,255,.26);border-color:var(--cyan)}.certificate{text-align:center;padding:32px 22px;margin-top:42px}.certificate h2{font-size:36px;margin:10px 0;color:var(--gold)}.cert-badges{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:22px 0}.cert-badges span{display:grid;place-items:center;width:66px;height:66px;border-radius:20px;background:rgba(255,255,255,.14);border:1px solid var(--line);font-size:28px}.bottom-nav{position:fixed;left:50%;bottom:0;z-index:20;transform:translateX(-50%);width:min(560px,100vw);height:70px;display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:8px 12px 12px;background:linear-gradient(0deg,rgba(2,10,24,.94),rgba(2,10,24,.55));backdrop-filter:blur(14px);border-top:1px solid var(--line)}.bottom-nav button{border-radius:16px;background:rgba(255,255,255,.08);font-size:12px;color:#d8ebff}.bottom-nav button.active{background:rgba(77,245,255,.20);color:var(--cyan);font-weight:900}@media(min-width:680px){.app-shell{max-width:1180px;padding:84px 22px 88px}.topbar,.bottom-nav{max-width:1180px}.screen-home{display:none}.screen-home.active{display:grid;grid-template-columns:1.25fr .75fr;gap:18px;align-items:end}.hero-card{min-height:570px}.lab-grid{grid-template-columns:repeat(2,1fr)}.scene.active{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}.scene-head{grid-column:1/-1}.quantum-stage,.tokamak,.magnet-stage,.deep-stage{margin:0;min-height:360px}.control-panel{margin-top:0}.bottom-nav{height:62px}.hero-card h1{font-size:64px}}
