
:root{color-scheme:dark;--bg:#101e29;--panel:#172a35;--line:#2d414a;--text:#eef3e9;--muted:#95a9b2;--mint:#b9efd5;--yellow:#e9ca87;--red:#f0a597}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:"Microsoft YaHei","PingFang SC",sans-serif;font-size:14px;line-height:1.6}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid var(--yellow);outline-offset:5px}button{transition:background .18s,transform .18s,border-color .18s}button:active{transform:translateY(1px)}button:disabled{cursor:default}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.app{max-width:1280px;margin:auto;padding:0 54px}.topbar{min-height:108px;display:flex;align-items:center;gap:28px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;font-size:16px;font-weight:700;white-space:nowrap}.brand small{display:block;letter-spacing:3px;font-size:9px;color:var(--muted);font-weight:400}.brand-icon{display:grid;place-items:center;width:41px;height:44px;border-radius:11px;background:var(--mint);color:#19382f;font-size:31px}.event{font-size:12px;color:#bed0d5;border-left:1px solid var(--line);padding-left:28px}.event span{display:block;color:var(--muted);font-size:11px;margin-bottom:3px}.online{margin-left:auto;font-size:11px;color:var(--muted);white-space:nowrap}.online i,.art-bottom i,.art-top i{display:inline-block;width:6px;height:6px;background:var(--mint);border-radius:50%;margin-right:7px}main{min-height:calc(100vh - 181px)}.hero{display:grid;grid-template-columns:1fr 1.05fr;gap:36px;padding:62px 0 51px;align-items:center}.eyebrow{font-size:11px;font-weight:600;letter-spacing:2px;color:var(--mint)}.eyebrow>span{display:inline-block;width:17px;height:3px;background:var(--mint);vertical-align:middle;margin-right:8px}h1,h2,h3,p{margin:0}.hero h1{font-size:65px;line-height:1.22;letter-spacing:2px;margin:22px 0}.hero h1>span{display:block}.title-dot{color:var(--mint)}.lead{font-size:16px;line-height:1.9;color:#b7c7cc}.hero-tags{display:flex;gap:18px;color:#b6c7cb;font-size:12px;margin:26px 0}.primary{border:0;border-radius:9px;background:var(--mint);color:#16352d;padding:15px 22px;font-weight:700;display:flex;align-items:center;justify-content:space-between;gap:28px}.primary:hover:not(:disabled){background:#d2f8e4;box-shadow:0 4px 22px #b9efd515}.primary:disabled{background:#2b424a;color:#829a9e}.start-button{width:246px;font-size:16px}.start-button span{font-size:23px;line-height:1}.hint{font-size:10px;color:#8297a2;margin-top:13px}.rail-art{border:1px solid #344a50;background:#132630;border-radius:18px;position:relative;overflow:hidden;transform:rotate(-2deg);box-shadow:0 20px 50px #0002}.art-top,.art-bottom{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;padding:20px 23px;font-size:10px;color:#a9c0c3}.art-top{border-bottom:1px solid #29404a}.art-top>span:last-child{font-size:8px;letter-spacing:1px}.art-top i{margin:0 0 0 5px;width:4px;height:4px}.rail-svg{display:block;width:100%;margin:-8px 0}.ai-chip{position:absolute;left:28px;top:102px;display:flex;gap:12px;align-items:center;padding:14px 18px;border:1px solid #3f5b60;background:#1b3540eb;border-radius:10px;box-shadow:0 9px 25px #0002;font-size:11px;color:#a9c0c3;transform:rotate(2deg)}.ai-chip>span{font-size:27px;color:var(--mint)}.ai-chip strong{font-size:12px;color:#e7f3e8;font-weight:500}.art-bottom{border-top:1px solid #29404a;letter-spacing:1px}.intro-bottom{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:27px 0;display:grid;grid-template-columns:.8fr 1fr 1fr 1fr;gap:20px}.section-label{font-size:16px;font-weight:700}.section-label small{display:block;color:#75909a;font-size:9px;letter-spacing:2px;margin-top:5px}.instruction{display:flex;gap:17px;align-items:center}.instruction b{font-size:25px;font-weight:400;color:#84b3a9}.instruction h3{font-size:14px;font-weight:500}.instruction p{font-size:11px;color:var(--muted);margin-top:4px}.intro-note{color:#859aa4;font-size:11px;text-align:center;margin:17px 0 25px}footer{min-height:73px;display:flex;justify-content:space-between;align-items:center;gap:20px;color:#708792;font-size:10px;border-top:1px solid #203540}.game-title{display:flex;justify-content:space-between;align-items:center;padding:28px 0 22px}.game-title h2{font-size:23px;margin-top:6px}.quiet{background:transparent;color:#bed0d4;border:1px solid #3d525a;border-radius:8px;padding:10px 18px}.quiet:hover{background:#223b45}.dashboard{display:flex;gap:28px;align-items:center;padding:18px 24px;background:var(--panel);border:1px solid var(--line);border-radius:12px 12px 0 0}.route{flex:1;display:flex;align-items:center}.route-stop{flex:1;position:relative;color:#7e939e;font-size:11px}.route-stop:after{content:"";position:absolute;left:34px;right:8px;top:14px;height:1px;background:#3b515c}.route-stop:last-child:after{display:none}.stop-number{display:grid;place-items:center;width:29px;height:29px;border:1px solid #48616a;border-radius:50%;margin-bottom:7px;font-size:10px;background:var(--panel);position:relative;z-index:1}.route-stop.active{color:var(--mint)}.route-stop.active .stop-number{background:var(--mint);color:#1b3930;border-color:var(--mint);box-shadow:0 0 0 5px #b9efd50b}.route-stop.done{color:#bdd4cf}.route-stop.done .stop-number{border-color:var(--mint)}.timer,.score{min-width:100px;border-left:1px solid #334952;padding-left:24px;display:flex;flex-direction:column}.timer small,.score small{font-size:10px;color:var(--muted)}.timer strong,.score strong{font-size:28px;font-variant-numeric:tabular-nums;line-height:1.4;font-weight:500;letter-spacing:1px}.timer span,.score span{font-size:10px;color:var(--mint)}.timer.urgent strong{color:var(--yellow)}.time-track{height:3px;background:#2a404b;border-radius:0 0 6px 6px;overflow:hidden}#time-bar{height:100%;width:100%;background:var(--mint);transition:width .2s linear}.stage-banner{padding:12px 0;color:#acc0c6;font-size:12px;min-height:43px}.stage-banner b{color:var(--mint);margin-right:10px}.play-layout{display:grid;grid-template-columns:.95fr 1.15fr;gap:26px}.mission{background:#192e39;border:1px solid #35505a;border-radius:15px;min-height:363px;padding:24px;display:flex;flex-direction:column;position:relative;overflow:hidden}.mission:after{content:"";position:absolute;width:200px;height:200px;border:1px solid #344b543d;border-radius:50%;right:-115px;bottom:30px;box-shadow:0 0 0 25px #344b5417,0 0 0 50px #344b5410;pointer-events:none}.mission-meta{display:flex;justify-content:space-between;font-size:10px;color:#95b2ba;letter-spacing:1px}.live-dot{color:var(--mint)}.live-dot:before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--mint);margin-right:6px}.scene-icon{margin:21px 0 13px;display:grid;place-items:center;width:50px;height:50px;background:#284d51;border:1px solid #43675f;color:var(--mint);border-radius:13px;font-size:27px}.scene-place{font-size:11px;color:var(--yellow);margin-bottom:8px}.mission h2{font-size:23px;line-height:1.5;position:relative;z-index:1}.mission>p{color:#b0c2c9;font-size:13px;margin-top:12px}.mission-footer{border-top:1px solid #36505a;padding-top:16px;margin-top:auto;padding-bottom:0;font-size:10px;color:#95afb7}.mission-footer span{display:inline-block;margin-right:9px;color:var(--mint)}.tools-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.tools-heading h3{font-size:14px}.tools-heading span{font-size:10px;color:var(--muted)}.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.tool{position:relative;text-align:left;background:#162934;border:1px solid #344c57;border-radius:11px;color:var(--text);min-height:121px;padding:16px;display:flex;flex-direction:column;gap:7px}.tool:hover:not(:disabled){background:#213b43;border-color:#759f99}.tool.selected{border-color:var(--mint);background:#24453f;box-shadow:inset 0 0 0 1px var(--mint)}.tool.correct{border-color:var(--mint);background:#24453f}.tool.wrong{border-color:var(--red);background:#46383b}.tool-code{font-size:10px;color:#90b2b8;letter-spacing:1px;display:flex;justify-content:space-between;width:100%}.tool.selected .tool-code{color:var(--mint)}.tool strong{font-size:16px;font-weight:500}.tool small{color:#9eb5bd;font-size:11px}.confirm{width:100%;margin-top:14px;height:49px}.feedback{padding:11px 14px;margin-top:12px;border-radius:9px;background:#203c36;border:1px solid #385e50;font-size:12px;color:#d4e9db}.feedback.error{background:#3b3333;border-color:#73554b;color:#f0dbd1}.feedback strong{display:block;margin-bottom:3px;font-size:13px}.feedback button{background:none;border:none;padding:7px 0 0;color:var(--mint);font-size:11px}.knowledge{display:flex;gap:20px;border:1px solid var(--line);border-radius:9px;padding:15px 20px;margin:23px 0 28px;align-items:center}.knowledge>span{color:var(--yellow);font-size:11px;white-space:nowrap}.knowledge p{font-size:11px;color:#a2b7c0}.result-screen{text-align:center;max-width:800px;margin:auto;padding:38px 0}.result-medal{margin:24px auto 16px;width:72px;height:72px;display:grid;place-items:center;border:1px solid #61897d;border-radius:23px;background:#284c43;color:var(--mint);font-size:40px;transform:rotate(-8deg)}.result-screen h1{font-size:34px}.result-screen>p{color:var(--muted);margin:10px 0 24px}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);padding:22px;background:var(--panel);border:1px solid var(--line);border-radius:12px}.result-stats>div+div{border-left:1px solid var(--line)}.result-stats strong{display:block;color:var(--mint);font-size:31px;font-weight:500}.result-stats span{color:var(--muted);font-size:11px}.result-stages{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:17px 0}.stage-result{padding:14px;text-align:left;border:1px solid var(--line);border-radius:9px}.stage-result h3{font-size:12px;color:var(--mint);margin-bottom:5px}.stage-result p{font-size:11px;color:#a0b4bc}.stage-result b{font-size:14px;color:var(--text)}.takeaway{text-align:left;padding:18px 23px;background:#20332f;border:1px solid #3a5048;border-radius:10px}.takeaway h3{font-size:12px;color:var(--yellow);margin-bottom:5px}.takeaway p{font-size:12px;color:#bed1c7;line-height:1.9}.result-actions{display:flex;justify-content:center;gap:15px;margin-top:24px}.modal{position:fixed;inset:0;background:#08131ddc;backdrop-filter:blur(8px);display:grid;place-items:center;z-index:9;padding:22px}.modal-card{max-width:390px;width:100%;border:1px solid #49625d;border-radius:18px;background:#172e37;padding:32px;text-align:center;box-shadow:0 25px 80px #0004}.modal-card h2{font-size:26px;margin-top:16px}.modal-card p{font-size:12px;color:var(--muted);margin:14px 0 25px}.modal-card button{width:100%;justify-content:center;margin-top:12px}
@media(min-width:1500px){.hero{padding-top:82px;padding-bottom:72px}.hero h1{font-size:74px}}
@media(max-width:1000px){.app{padding:0 30px}.online{display:none}.hero{gap:24px;padding-top:40px}.hero h1{font-size:54px}.hero-tags{gap:12px;font-size:10px}.art-top{padding:14px}.art-top>span:last-child{display:none}.ai-chip{top:70px;left:15px;padding:10px}.intro-bottom{grid-template-columns:.6fr 1fr 1fr 1fr;gap:12px}.instruction{gap:10px}.instruction p{font-size:10px}.play-layout{gap:18px}.mission{padding:20px}.mission h2{font-size:21px}.dashboard{gap:18px}.tool{padding:13px}}
@media(max-width:680px){.app{padding:0 20px}.topbar{min-height:88px;gap:16px}.brand{font-size:12px;gap:8px}.brand-icon{width:31px;height:35px;font-size:25px}.brand small{font-size:7px;letter-spacing:1.5px}.event{padding-left:14px;font-size:9px;line-height:1.7}.event span{font-size:9px}.hero{grid-template-columns:1fr;padding:32px 0 30px;gap:30px}.hero-copy{position:relative}.eyebrow{font-size:9px;letter-spacing:1.5px}.hero h1{font-size:49px;line-height:1.2;margin:16px 0}.hero h1>span{display:inline}.lead{font-size:14px}.hero-tags{margin:20px 0;font-size:11px;gap:16px}.start-button{width:100%}.hint{text-align:center;font-size:9px}.rail-art{max-width:460px;width:100%;margin:auto;transform:rotate(-1deg)}.rail-svg{height:230px}.art-top,.art-bottom{padding:13px 16px;font-size:9px}.ai-chip{top:65px;left:18px}.intro-bottom{grid-template-columns:1fr;gap:18px;padding:22px 0}.section-label{display:flex;align-items:center;gap:12px}.section-label small{margin:0}.instruction{gap:17px}.instruction p{font-size:11px}.instruction h3{font-size:13px}.instruction>div{display:flex;gap:12px;align-items:center}.instruction p{margin:0}.instruction b{font-size:20px}.intro-note{font-size:10px;text-align:left}footer{min-height:65px;display:block;padding:15px 0;font-size:9px}footer span{display:block}.game-title{padding:21px 0 17px;gap:10px}.game-title h2{font-size:17px}.quiet{padding:8px 12px;font-size:12px}.dashboard{padding:14px 12px;gap:10px}.route-stop{font-size:9px}.stop-number{width:23px;height:23px;font-size:9px}.route-stop:after{top:11px;left:26px;right:5px}.timer,.score{min-width:65px;padding-left:11px}.score{min-width:48px}.timer strong,.score strong{font-size:22px}.timer small,.score small,.timer span,.score span{font-size:8px}.play-layout{grid-template-columns:1fr;gap:19px}.stage-banner{font-size:10px;min-height:39px}.mission{min-height:240px;padding:17px 18px}.scene-icon{width:38px;height:38px;font-size:22px;margin:12px 0 8px}.scene-place{font-size:10px;margin-bottom:5px}.mission h2{font-size:19px}.mission>p{font-size:12px;margin-top:8px}.mission-footer{margin-top:17px;padding-top:11px;font-size:9px}.tools-heading{margin-bottom:10px}.tools-heading h3{font-size:13px}.tool-grid{gap:10px}.tool{min-height:106px;padding:13px;gap:5px}.tool strong{font-size:15px}.tool small{font-size:10px}.confirm{height:46px;margin-top:12px}.knowledge{gap:10px;padding:12px;margin-top:18px;align-items:flex-start}.knowledge>span,.knowledge p{font-size:10px}.result-screen{padding:30px 0}.result-screen h1{font-size:27px}.result-screen>p{font-size:12px}.result-stats{padding:17px 8px}.result-stats strong{font-size:26px}.result-stages{gap:8px}.stage-result{padding:11px 8px}.stage-result h3{font-size:10px}.stage-result p{font-size:10px}.takeaway{padding:16px}.takeaway p{font-size:11px}.result-actions .primary{padding:12px 18px}.feedback{font-size:11px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
