:root { --bg:#071015; --panel:#0c171d; --ink:#e9f3f4; --muted:#82979a; --line:#1d3036; --teal:#6ee7d8; --gold:#d7a85c; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
html:not([data-language="en"]) [data-lang="en"],html[data-language="en"] [data-lang="zh"] { display:none!important; }
body { margin:0; color:var(--ink); background:var(--bg); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans SC",sans-serif; line-height:1.6; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.wrap { width:min(1160px,calc(100% - 40px)); margin-inline:auto; }
.loom-bg { position:fixed; inset:0; pointer-events:none; overflow:hidden; opacity:.34; z-index:-1; background:radial-gradient(circle at 75% 12%,#12343a 0,transparent 34%),radial-gradient(circle at 15% 50%,#152b36 0,transparent 30%); }
.loom-bg i { position:absolute; width:1px; height:140%; top:-20%; background:linear-gradient(transparent,var(--teal),transparent); transform:rotate(32deg); opacity:.12; }
.loom-bg i:nth-child(1){left:20%}.loom-bg i:nth-child(2){left:38%}.loom-bg i:nth-child(3){left:57%}.loom-bg i:nth-child(4){left:72%}.loom-bg i:nth-child(5){left:88%}
.nav { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid rgba(112,156,162,.16); }
.brand { display:flex; align-items:center; gap:10px; letter-spacing:.02em; white-space:nowrap; }
.brand span { width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--teal); border-radius:8px; color:var(--teal); font-weight:800; }
.nav nav { display:flex; align-items:center; gap:24px; color:var(--muted); font-size:14px; }
.nav nav a:hover { color:var(--ink); }
.nav-cta { padding:8px 14px; border:1px solid var(--line); border-radius:999px; }
.language-switch { display:flex; padding:3px; border:1px solid var(--line); border-radius:999px; background:#091419; }
.language-switch button { min-width:35px; border:0; border-radius:999px; padding:4px 8px; color:var(--muted); background:transparent; cursor:pointer; font-size:11px; font-weight:700; }
.language-switch button.active { color:#071015; background:var(--teal); }
.hero { padding:130px 0 100px; }
.kicker,.section-heading p { color:var(--teal); font-size:11px; letter-spacing:.18em; font-weight:700; }
.hero h1 { margin:22px 0; font-size:clamp(58px,9vw,118px); line-height:.92; letter-spacing:-.075em; max-width:1040px; }
.hero h1 span { color:#9eafb1; }
.lead { max-width:760px; font-size:19px; color:#9eb0b2; }
.hero-actions { display:flex; gap:12px; margin:38px 0 30px; flex-wrap:wrap; }
.button { display:inline-flex; align-items:center; justify-content:center; padding:12px 20px; border-radius:7px; font-weight:700; font-size:14px; }
.button.primary { color:#071015; background:var(--teal); }
.button.ghost { border:1px solid var(--line); color:#aababc; }
.button:hover { transform:translateY(-1px); }
.status { color:#71878a; font-size:12px; display:flex; align-items:center; gap:8px; }
.status span { width:7px; height:7px; border-radius:50%; background:var(--gold); box-shadow:0 0 14px var(--gold); }
.manifest { display:grid; grid-template-columns:repeat(3,1fr); border-block:1px solid var(--line); }
.manifest p { margin:0; padding:26px 22px; color:#b5c3c4; border-right:1px solid var(--line); }
.manifest p:last-child { border:0; }
.section { padding:120px 0; }
.section-heading { display:grid; grid-template-columns:60px minmax(0,820px); gap:20px; align-items:start; margin-bottom:55px; }
.section-heading>span { color:#4f696d; font-size:13px; padding-top:8px; }
.section-heading p { margin:0 0 10px; }
.section-heading h2 { margin:0; font-size:clamp(34px,5vw,60px); line-height:1.12; letter-spacing:-.045em; }
.cards { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.card { padding:34px; min-height:260px; border:1px solid var(--line); background:linear-gradient(145deg,rgba(15,31,36,.96),rgba(8,18,23,.88)); border-radius:12px; }
.card b { color:var(--teal); font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.card h3 { font-size:25px; margin:38px 0 12px; }
.card p { color:var(--muted); margin:0; max-width:470px; }
.architecture { background:#091419; border-block:1px solid var(--line); }
.architecture-grid { max-width:850px; margin:0 auto; }
.layer { padding:28px; border:1px solid #294047; border-radius:10px; background:#0c1a20; text-align:center; }
.layer small { display:block; color:#5c777b; letter-spacing:.15em; font-size:10px; }
.layer strong { display:block; font-size:24px; margin:8px 0; }
.layer p { color:var(--muted); margin:0; font-size:13px; }
.layer.ir { border-color:#34746d; box-shadow:0 0 50px rgba(63,192,177,.07); }
.flow { display:flex; flex-direction:column; align-items:center; height:88px; color:#597074; font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.flow i { flex:1; width:1px; background:#315057; }
.engines { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.engines div { padding:20px 8px; text-align:center; border:1px solid var(--line); border-radius:9px; background:#0b171c; }
.engines b { display:block; color:var(--teal); font-size:20px; }
.engines span { color:var(--muted); font-size:11px; }
.architecture-note { text-align:center; color:#70878a; margin:34px auto 0; max-width:760px; }
.patch-flow { display:grid; grid-template-columns:1fr auto 1fr auto 1fr auto 1fr; align-items:center; gap:14px; }
.patch-flow>div { min-height:175px; padding:25px; border:1px solid var(--line); border-radius:10px; background:rgba(11,25,30,.72); }
.patch-flow>i { color:#496267; font-style:normal; }
.patch-flow span { color:var(--gold); font-size:12px; }
.patch-flow b { display:block; font-size:17px; margin:26px 0 5px; }
.patch-flow p { color:var(--muted); font-size:12px; margin:0; }
.milestones { display:grid; grid-template-columns:repeat(7,1fr); border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.milestone { padding:24px 14px; min-height:150px; border-right:1px solid var(--line); background:#0a151a; }
.milestone:last-child { border:0; }
.milestone span,.milestone b,.milestone small { display:block; }
.milestone span { color:#547075; font-size:11px; }
.milestone b { margin:35px 0 4px; font-size:14px; }
.milestone small { color:#697d80; }
.milestone.active { background:#10241f; box-shadow:inset 0 3px var(--teal); }
.milestone.active span { color:var(--teal); }
.roadmap-cta { margin-top:28px; padding:24px; display:flex; align-items:center; justify-content:space-between; gap:20px; border:1px solid var(--line); border-radius:10px; color:var(--muted); }
.roadmap-cta p { margin:0; }
.closing { padding:110px 0 130px; text-align:center; }
.closing p { color:var(--teal); letter-spacing:.15em; font-size:11px; text-transform:uppercase; }
.closing h2 { font-size:clamp(42px,6vw,76px); letter-spacing:-.055em; max-width:900px; line-height:1.08; margin:22px auto 38px; }
footer { min-height:90px; display:flex; align-items:center; justify-content:space-between; gap:24px; color:#5d7275; font-size:12px; border-top:1px solid var(--line); }
.reveal { opacity:0; transform:translateY(18px); transition:opacity .7s ease,transform .7s ease; }
.reveal.visible { opacity:1; transform:none; }
.roadmap-hero { padding:100px 0 70px; }
.roadmap-hero h1 { margin:18px 0; max-width:920px; font-size:clamp(48px,7vw,90px); line-height:.98; letter-spacing:-.065em; }
.roadmap-hero .lead { max-width:840px; }
.roadmap-meta { display:flex; flex-wrap:wrap; gap:10px; margin-top:30px; }
.roadmap-meta span { padding:7px 11px; border:1px solid var(--line); border-radius:999px; color:var(--muted); font-size:12px; }
.roadmap-list { display:grid; gap:16px; padding-bottom:80px; }
.roadmap-phase { display:grid; grid-template-columns:130px minmax(0,1fr); gap:28px; padding:30px; border:1px solid var(--line); border-radius:12px; background:linear-gradient(145deg,rgba(15,31,36,.93),rgba(8,18,23,.86)); }
.roadmap-phase.active { border-color:#34746d; box-shadow:inset 4px 0 var(--teal); }
.phase-index span,.phase-index b,.phase-index small { display:block; }
.phase-index span { color:var(--teal); font-size:12px; letter-spacing:.12em; }
.phase-index b { margin:14px 0 5px; font-size:18px; }
.phase-index small { color:var(--muted); }
.phase-content h2 { margin:0 0 8px; font-size:27px; }
.phase-content>p { margin:0 0 22px; color:var(--muted); }
.phase-columns { display:grid; grid-template-columns:1fr 1fr; gap:26px; }
.phase-columns h3 { margin:0 0 10px; color:#b8c7c8; font-size:13px; letter-spacing:.08em; text-transform:uppercase; }
.phase-columns ul { margin:0; padding-left:18px; color:var(--muted); }
.phase-columns li+li { margin-top:6px; }
.scope-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.scope-card { padding:28px; border:1px solid var(--line); border-radius:12px; background:#0a151a; }
.scope-card h3 { margin-top:0; }
.scope-card ul { padding-left:18px; color:var(--muted); }
.scope-card.keep { border-color:#2f655e; }
.scope-card.cut { border-color:#5c4432; }
@media (max-width:850px){
  .nav { padding-block:15px; align-items:flex-start; }
  .nav nav { gap:10px; flex-wrap:wrap; justify-content:flex-end; }
  .nav nav>a:not(.nav-cta){display:none}
  .hero{padding-top:90px}
  .manifest,.cards,.scope-grid{grid-template-columns:1fr}
  .manifest p{border-right:0;border-bottom:1px solid var(--line)}
  .patch-flow{grid-template-columns:1fr}
  .patch-flow>i{transform:rotate(90deg);text-align:center}
  .milestones{grid-template-columns:1fr 1fr}
  .milestone{border-bottom:1px solid var(--line)}
  .roadmap-cta{align-items:flex-start;flex-direction:column}
  .roadmap-phase{grid-template-columns:1fr;padding:24px}
  .phase-columns{grid-template-columns:1fr}
  footer{padding-block:22px;flex-wrap:wrap}
  .section{padding:85px 0}
  .section-heading{grid-template-columns:35px 1fr}
  .engines{grid-template-columns:1fr 1fr}
}