#roadmap *{box-sizing:border-box}
#roadmap{margin:0;background:#0c0806;color:#efe1c4;font-family:"Microsoft YaHei","PingFang SC",sans-serif}
#roadmap button{font:inherit;color:inherit;cursor:pointer}
#roadmap button:focus-visible,#roadmap a:focus-visible{outline:2px solid #f4ca74;outline-offset:5px}
#roadmap h1,#roadmap h2,#roadmap p{margin:0}
#roadmap a{color:inherit}
#roadmap header{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:34px 5vw;font-size:11px;letter-spacing:.2em;color:#caa975}
#roadmap header a{text-decoration:none}
#roadmap header b{font-size:19px;color:#edc276;letter-spacing:-.04em}
#roadmap .note{font-size:11px;color:#b3a48b;line-height:1.8}
#roadmap .kicker{font-size:10px;letter-spacing:.24em;color:#e0b568}
#roadmap h1{font-size:clamp(30px,3.3vw,50px);letter-spacing:.02em}
#roadmap .brush{font-family:"STXingkai","KaiTi",serif}
#roadmap button{border:0}
#roadmap .roadmap-footer{padding:20px 5vw;display:flex;justify-content:space-between;gap:20px;border-top:1px solid #d9b56826}
#roadmap .code{font:italic 24px Georgia;color:#b79b64}
@media(max-width:700px){#roadmap header{padding:24px 22px;font-size:9px;letter-spacing:.05em}
#roadmap header a{max-width:110px}
#roadmap .roadmap-footer{padding:20px 22px;display:block}
#roadmap .code{display:none}}
@media(prefers-reduced-motion:reduce){#roadmap *,#roadmap *:before,#roadmap *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
#roadmap{background:#0b0907}
#roadmap .composition{min-height:670px;display:grid;grid-template-columns:48% 52%;isolation:isolate}
#roadmap .left{padding:20px 4vw 30px 5vw}
#roadmap .left .premiere-heading{font-size:clamp(28px,2.5vw,39px);line-height:1.45;margin:14px 0 23px}
#roadmap .chapters{border-top:1px solid #63503855}
#roadmap .chapter{display:flex;align-items:center;gap:24px;width:100%;text-align:left;padding:14px 10px 14px 0;background:transparent;border-bottom:1px solid #63503855;position:relative;transition:padding .3s}
#roadmap .chapter .seq{font:italic 29px Georgia;color:#7c664c;width:45px}
#roadmap .chapter .text{display:flex;flex-direction:column;gap:5px}
#roadmap .chapter .date{color:#a08b6b;font-size:11px}
#roadmap .chapter strong{font-size:17px;font-weight:500}
#roadmap .chapter .arrow{margin-left:auto;color:#a2763a;font-size:23px;opacity:0}
#roadmap .chapter.active,#roadmap .chapter:hover{padding-left:17px;background:linear-gradient(90deg,#7b190b55,transparent)}
#roadmap .chapter.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#aa2d19}
#roadmap .chapter.active .seq,#roadmap .chapter.active strong{color:#f1c87e}
#roadmap .chapter.active .arrow{opacity:1}
#roadmap .spotlight{position:relative;min-height:665px;overflow:hidden;background:linear-gradient(#160e0580,#0c0805d4),url('assets/community-premiere.png') center/cover;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 40px;text-align:center;border-left:1px solid #b98a3e33}
#roadmap .spotlight:before{content:"";position:absolute;inset:-30% -60%;background:conic-gradient(from 152deg at 50% 0%,transparent 0deg,#e9be6640 12deg,transparent 23deg,transparent 35deg,#e9be6625 40deg,transparent 48deg);pointer-events:none;animation:beam 12s ease-in-out infinite alternate}
#roadmap .target-label{position:relative;font-size:11px;letter-spacing:.4em;color:#d6b780}
#roadmap .year{font:28px/1 Georgia;color:#c4a574;letter-spacing:.28em;margin:27px 0 6px}
#roadmap .month{font:clamp(110px,12vw,184px)/1 Georgia;color:#eac784;text-shadow:0 0 50px #e2ac3d24;letter-spacing:-.04em;position:relative}
#roadmap .month.long{font-size:clamp(76px,7.5vw,116px)}
#roadmap .month:before,#roadmap .month:after{content:"";position:absolute;left:-45px;right:-45px;top:50%;height:1px;background:#f2d29222}
#roadmap .month:after{height:auto;left:50%;top:-28px;bottom:-28px;right:auto;width:1px}
#roadmap .stage-title{font-family:"STXingkai","KaiTi",serif;font-size:42px;margin:22px 0 16px;color:#f4d18a;position:relative}
#roadmap .stage-copy{position:relative;max-width:365px;font-size:13px;line-height:2;color:#cfbda0;min-height:54px}
#roadmap .ticket{position:relative;margin-top:35px;border-top:1px solid #d3a35477;border-bottom:1px solid #d3a35477;padding:17px 25px;font-size:11px;letter-spacing:.15em}
#roadmap .ticket strong{display:block;font:21px Georgia;margin-bottom:8px;color:#e3ba78}
#roadmap .track-label{font-size:10px;color:#8f7959;margin-top:18px;letter-spacing:.08em}
@keyframes beam{from{transform:rotate(-6deg)}to{transform:rotate(7deg)}}
@media(max-width:700px){#roadmap .composition{display:flex;flex-direction:column}
#roadmap .left{padding:16px 22px 28px}
#roadmap .left .premiere-heading{font-size:30px}
#roadmap .chapter{gap:12px;padding:13px 0}
#roadmap .chapter strong{font-size:16px}
#roadmap .spotlight{min-height:520px;padding:35px 22px;border:0}
#roadmap .month{font-size:135px}
#roadmap .month.long{font-size:90px}
#roadmap .stage-title{font-size:35px}
#roadmap .stage-copy{font-size:12px}
#roadmap .ticket{margin-top:24px}
#roadmap .year{font-size:25px}}
#roadmap{padding-top:38px;border-top:1px solid var(--line)}
#roadmap .premiere-heading{font-size:clamp(28px,2.5vw,39px);line-height:1.45;margin:14px 0 23px;font-weight:700}
#roadmap .chapter .text{min-width:0}
#roadmap .chapter strong{line-height:1.45}
#roadmap .roadmap-footer{display:flex;align-items:center;gap:20px;margin:0}
#roadmap .stage-copy{min-height:78px}
@media(max-width:700px){#roadmap{padding-top:15px}#roadmap .roadmap-footer{display:block}#roadmap .premiere-heading{font-size:30px}}