:root{--paper:#f6f7f2;--paper2:#e9ede7;--ink:#17231f;--muted:#617069;--line:#c8d2cc;--blue:#315ef6;--yellow:#f2b84b;--orange:#ec6842;--mint:#cbddd4;--serif:"Songti SC","STSong",serif;--sans:"PingFang SC","Microsoft YaHei",sans-serif;--mono:"SFMono-Regular",Consolas,monospace;--max:1180px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.65}button{font:inherit}a{color:inherit}:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}.skip{position:fixed;z-index:99;top:10px;left:10px;padding:10px 15px;background:var(--ink);color:white;transform:translateY(-150%)}.skip:focus{transform:none}
header{position:sticky;z-index:40;top:0;display:flex;align-items:center;min-height:70px;padding:0 max(24px,calc((100vw - var(--max))/2));border-bottom:1px solid #17231f28;background:#f6f7f2e8;backdrop-filter:blur(14px)}.brand{display:flex;align-items:center;gap:10px;font-weight:800;text-decoration:none}.brand i{display:grid;width:33px;height:33px;place-items:center;border-radius:50%;background:var(--ink);color:white;font:700 12px var(--mono)}header>nav{display:flex;gap:28px;margin-left:auto}header nav a{font-size:14px;text-decoration:none}header nav a:hover{color:var(--blue)}.menu,#mobile{display:none}.section,.hero,footer{width:min(var(--max),calc(100% - 48px));margin:auto}.section{padding:105px 0}.hero{display:grid;grid-template-columns:1.08fr .92fr;gap:70px;align-items:center;min-height:calc(100vh - 70px);padding:70px 0 90px}.eyebrow,.kicker{font:700 12px var(--mono);letter-spacing:.1em}.eyebrow b{margin-right:10px;padding:5px 9px;border:1px solid;border-radius:99px}.kicker{color:var(--blue)}h1,h2,h3,p{margin-top:0}h1{margin:28px 0 26px;font:800 clamp(46px,6vw,78px)/1.04 var(--serif);letter-spacing:-.055em}h1 em{color:var(--blue);font-style:normal}.lead{max-width:650px;color:var(--muted);font-size:18px}.actions{display:flex;align-items:center;gap:25px;margin:32px 0 18px}.btn{display:inline-flex;min-height:48px;align-items:center;justify-content:center;padding:0 20px;border:1px solid var(--ink);border-radius:3px;background:none;cursor:pointer;font-weight:750;text-decoration:none;transition:.18s}.btn:hover{transform:translateY(-2px);box-shadow:4px 4px 0 var(--ink)}.primary{background:var(--ink);color:white}.hero small{color:var(--muted)}
.ticket{position:relative;padding:18px;border:1px solid var(--ink);background:#fcfdf9;box-shadow:12px 12px 0 var(--mint);transform:rotate(1.2deg)}.ticket:before{position:absolute;top:-15px;left:42%;width:110px;height:30px;background:#f2b84bb8;content:"";transform:rotate(-4deg)}.ticket-head{display:flex;justify-content:space-between;padding:8px 6px 14px;color:var(--muted);font:700 10px var(--mono)}.route{display:grid;grid-template-columns:52px 1fr auto;gap:15px;align-items:center;min-height:100px;padding:15px;border-top:1px solid var(--line)}.route:nth-last-child(2){border-bottom:1px solid var(--line)}.route i{display:grid;width:44px;height:44px;place-items:center;border:1px solid;border-radius:50%;font:700 13px var(--mono)}.route span{display:flex;flex-direction:column}.route strong{font:800 23px var(--serif)}.route small{color:var(--muted)}.route>b{padding:4px 8px;background:var(--mint);font:800 12px var(--mono)}.route:nth-child(3)>b{background:var(--yellow)}.route:nth-child(4)>b{background:var(--orange);color:white}
.heading{margin-bottom:45px}.heading h2{max-width:760px;margin:8px 0 14px;font:800 clamp(36px,5vw,58px)/1.08 var(--serif);letter-spacing:-.04em}.heading>p:last-child{max-width:630px;color:var(--muted)}.heading.split{display:grid;grid-template-columns:1.35fr .65fr;gap:60px;align-items:end}.dark{width:100%;max-width:none;padding-right:max(24px,calc((100vw - var(--max))/2));padding-left:max(24px,calc((100vw - var(--max))/2));background:var(--ink);color:var(--paper)}.dark .heading>p:last-child{color:#afbbb5}.quiz{overflow:hidden;border:1px solid #58655f;background:#202d28}.progress{display:flex;align-items:center;gap:22px;padding:17px 28px;border-bottom:1px solid #58655f;color:#b7c1bc;font:700 11px var(--mono)}.progress>i{flex:1;height:3px;background:#46534d}.progress>i b{display:block;width:25%;height:100%;background:var(--yellow);transition:.3s}#quiz-form{padding:44px}.step{display:none;margin:0;padding:0;border:0}.step.active{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.step:not(:first-child).active{grid-template-columns:repeat(2,1fr)}.step legend{grid-column:1/-1;width:100%;margin-bottom:25px;font:750 clamp(26px,3.5vw,39px)/1.2 var(--serif)}.step label{position:relative;display:grid;grid-template-columns:34px 1fr;gap:13px;min-height:135px;padding:21px;border:1px solid #52605a;cursor:pointer}.step label:has(input:checked){border-color:var(--yellow);background:#2c3934;box-shadow:inset 0 -4px var(--yellow)}.step input{position:absolute;opacity:0}.step label>b{display:grid;width:30px;height:30px;place-items:center;border:1px solid #718078;border-radius:50%;font:700 12px var(--mono)}.step label span{display:flex;flex-direction:column}.step label small{margin-top:7px;color:#aebbb5}.quiz-actions{display:flex;justify-content:space-between;margin-top:30px}.ghost{border-color:#7b8982;color:inherit}.yellow{border-color:var(--yellow);background:var(--yellow);color:var(--ink)}.btn:disabled{opacity:.3;pointer-events:none}.result{display:grid;grid-template-columns:250px 1fr}.result>aside{display:flex;min-height:550px;align-items:center;justify-content:center;flex-direction:column;background:var(--yellow);color:var(--ink)}.result>aside span{font:700 11px var(--mono)}.result>aside strong{margin-top:25px;font:800 43px var(--serif);letter-spacing:.08em;writing-mode:vertical-rl}.result>div{padding:45px}.result h3{margin:6px 0 12px;font:800 38px var(--serif)}.result>div>p{color:#b7c2bc}.project{display:flex;gap:14px;margin:24px 0;padding:15px;border-left:4px solid var(--yellow);background:#2b3833}.project span{color:#b9c4be}.result ul{display:grid;grid-template-columns:repeat(2,1fr);color:#d7dedb}.starter{border:1px solid #58655f}.starter>span{display:flex;justify-content:space-between;padding:9px 13px;border-bottom:1px solid #58655f;color:#b4beb9;font:700 11px var(--mono)}.starter button{border:0;background:none;color:var(--yellow);cursor:pointer}.starter pre{margin:0;padding:16px;white-space:pre-wrap;font:13px/1.7 var(--mono)}
.stations{position:relative;display:grid;grid-template-columns:repeat(5,1fr)}.stations:before{position:absolute;top:25px;right:7%;left:7%;height:2px;background:var(--line);content:""}.stations article{position:relative;padding:0 20px}.stations article:first-child{padding-left:0}.stations article i{position:relative;z-index:1;display:grid;width:52px;height:52px;place-items:center;margin-bottom:24px;border:2px solid;border-radius:50%;background:var(--paper);font:800 12px var(--mono);font-style:normal}.stations article:nth-child(3) i{background:var(--blue);color:white}.stations h3{font:800 25px var(--serif)}.stations p{min-height:105px;color:var(--muted);font-size:14px}.stations b{font-size:12px}.callout{display:grid;grid-template-columns:44px 1fr auto;gap:18px;align-items:center;margin-top:55px;padding:21px;border:1px solid;background:white}.callout i{display:grid;width:42px;height:42px;place-items:center;border-radius:50%;background:var(--orange);color:white;font:bold 20px var(--mono)}.callout p{margin:0}.callout a{font-weight:750}.paper{width:100%;max-width:none;padding-right:max(24px,calc((100vw - var(--max))/2));padding-left:max(24px,calc((100vw - var(--max))/2));background:var(--paper2)}.scenario-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid;border-left:1px solid}.scenario{padding:32px;border-right:1px solid;border-bottom:1px solid;background:var(--paper)}.scenario>span{display:flex;justify-content:space-between;color:var(--muted);font:700 11px var(--mono)}.scenario>span b{padding:4px 8px;background:var(--mint);color:var(--ink)}.scenario:nth-child(2)>span b{background:var(--yellow)}.scenario:nth-child(3)>span b{background:var(--orange);color:white}.scenario:nth-child(4)>span b{background:var(--blue);color:white}.scenario h3{margin:26px 0 8px;font:800 29px var(--serif)}.scenario>p{color:var(--muted)}.scenario li{padding:4px}.scenario aside{margin:20px 0 16px;padding:14px;background:var(--paper2);color:var(--muted);font-size:12px}.scenario aside strong{display:block;color:var(--ink);font:700 12px var(--mono)}
.tabs{display:flex;overflow:auto;border-bottom:1px solid;scrollbar-width:none}.tabs button{flex:1 0 auto;padding:14px 17px;border:0;background:none;color:var(--muted);cursor:pointer}.tabs button[aria-selected=true]{background:var(--ink);color:white}.template{border:1px solid;border-top:0;background:white}.template section{position:relative;min-height:470px;padding:34px}.template h3{display:inline-block;width:50%;font:800 27px var(--serif)}.template section>p{display:inline-block;width:45%;color:var(--muted)}.template pre{overflow:auto;margin:22px 0 65px;padding-top:22px;border-top:1px solid var(--line);white-space:pre-wrap;font:14px/1.8 var(--mono)}.copy{position:absolute;right:32px;bottom:28px;padding:12px 20px;border:0;background:var(--blue);color:white;cursor:pointer;font-weight:750}.faq-list{border-top:1px solid}.faq details{border-bottom:1px solid}.faq summary{display:grid;grid-template-columns:1fr auto auto;gap:25px;align-items:center;padding:24px 8px;cursor:pointer;list-style:none;font:750 19px var(--serif)}.faq summary::-webkit-details-marker{display:none}.faq summary b{padding:5px 10px;background:var(--mint);font:700 11px var(--mono)}.faq summary:after{content:"+";font:25px var(--mono)}.faq details[open] summary:after{transform:rotate(45deg)}.faq details>p{max-width:820px;padding:0 8px 24px;color:var(--muted)}.faq details>p small{display:inline-block;margin-top:10px;padding:4px 8px;border:1px solid var(--line);font:700 10px var(--mono)}.about{display:grid;grid-template-columns:1.1fr .9fr;gap:35px 70px;padding:55px;border:1px solid;background:var(--yellow)}.about h2{margin:0;font:800 36px var(--serif)}.about>p{grid-column:1/-1;margin:0}.legend{display:flex;flex-direction:column;justify-content:center}.legend i{display:inline-block;width:10px;height:10px;margin-right:8px;border-radius:50%;background:var(--blue)}.legend span:nth-child(2) i{background:var(--ink)}.legend span:nth-child(3) i{border:2px solid;background:none}footer{display:flex;align-items:center;gap:25px;margin-top:80px;padding:40px 0;border-top:1px solid var(--line)}footer p{margin:0 auto 0 0;color:var(--muted)}.toast{position:fixed;z-index:80;right:24px;bottom:24px;padding:14px 18px;background:var(--ink);color:white;transform:translateY(150%);transition:.25s}.toast.show{transform:none}.reveal{opacity:0;transform:translateY(18px);transition:.6s}.reveal.visible{opacity:1;transform:none}
@media(max-width:900px){header>nav{display:none}.menu{display:block;margin-left:auto;border:0;background:none;font-weight:700}#mobile{position:absolute;top:70px;right:0;left:0;display:grid;padding:16px 24px 24px;border-bottom:1px solid;background:var(--paper);box-shadow:0 15px 30px #17231f20}#mobile[hidden]{display:none}#mobile a{padding:10px}.hero{grid-template-columns:1fr;min-height:auto}.ticket{width:min(620px,95%);margin:auto}.heading.split{grid-template-columns:1fr;gap:10px}.stations{grid-template-columns:1fr}.stations:before{top:20px;bottom:20px;left:25px;width:2px;height:auto}.stations article{display:grid;grid-template-columns:70px 1fr;padding:0 0 25px}.stations article i{grid-row:1/4}.stations h3,.stations p,.stations b{grid-column:2}.stations p{min-height:0}.step.active,.step:not(:first-child).active{grid-template-columns:1fr}.step label{min-height:auto}.result{grid-template-columns:1fr}.result>aside{min-height:100px;flex-direction:row;gap:20px}.result>aside strong{margin:0;writing-mode:horizontal-tb}.scenario-grid{grid-template-columns:1fr}.about{grid-template-columns:1fr}.about>p{grid-column:auto}}
@media(max-width:600px){body{overflow-x:hidden}.section,.hero,footer{width:calc(100% - 30px)}.section{padding:76px 0}.dark,.paper{width:100%;padding-right:15px;padding-left:15px}header{padding:0 15px}.menu{position:absolute;right:15px}.hero{padding:55px 0;gap:55px}h1{font-size:clamp(36px,10.5vw,42px);letter-spacing:-.06em}.actions{align-items:stretch;flex-direction:column}.ticket{padding:10px;box-shadow:7px 7px var(--mint)}.route{grid-template-columns:42px 1fr auto;gap:9px;min-height:82px;padding:10px 6px}.route i{width:37px;height:37px}.route strong{font-size:19px}.route small{font-size:11px}#quiz-form{padding:28px 17px}.progress{padding:14px 17px}.quiz-actions{gap:10px}.quiz-actions .btn{flex:1;padding:0 10px}.result>div{padding:28px 17px}.result h3{font-size:31px}.project{flex-direction:column}.result ul{grid-template-columns:1fr}.callout{grid-template-columns:42px 1fr}.callout a{grid-column:2}.scenario{padding:25px 19px}.template section{padding:24px 17px}.template h3,.template section>p{display:block;width:auto}.copy{right:17px;bottom:18px}.faq summary{grid-template-columns:1fr auto}.faq summary b{grid-column:1;grid-row:2;width:max-content}.faq summary:after{grid-column:2;grid-row:1/3}.about{width:100%;padding:38px 22px;border-right:0;border-left:0}footer{align-items:flex-start;flex-direction:column;gap:12px}footer p{margin:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}