:root {
  --black: #101317;
  --graphite: #1b2026;
  --steel: #c9cdd0;
  --silver: #edf0f1;
  --paper: #e7e9e9;
  --muted: #687077;
  --line: rgba(28,34,39,.17);
  --orange: #ff6f35;
  --cyan: #16b9bd;
  --white: #fff;
  --shadow: 0 28px 70px rgba(14,18,22,.18);
  --metal: repeating-linear-gradient(100deg,#f4f5f5 0,#d6dadd 1px,#f0f2f2 3px,#bdc2c5 5px,#e9ebec 7px);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--black);
  background: #dfe2e2;
  font-family: "Microsoft YaHei UI","PingFang SC",Arial,sans-serif;
  line-height: 1.72;
  -webkit-font-smoothing: antialiased;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -3;
  opacity: .72;
  background:
    radial-gradient(circle at 88% 8%,rgba(22,185,189,.13),transparent 24%),
    radial-gradient(circle at 7% 42%,rgba(255,111,53,.1),transparent 20%),
    repeating-linear-gradient(90deg,#e8eaea 0,#d8dbdc 1px,#e4e6e6 3px,#d5d8d9 5px);
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; }
h1,h2,h3,p { margin-top: 0; }
:focus-visible { outline: 3px solid rgba(255,111,53,.48); outline-offset: 4px; }
.container { width: min(1190px,calc(100% - 40px)); margin-inline: auto; }
.skip { position: fixed; top: -60px; left: 16px; z-index: 100; padding: 10px 16px; background: #fff; }
.skip:focus { top: 16px; }
.plate { border: 1px solid rgba(255,255,255,.74); background: var(--metal); box-shadow: inset 0 0 0 1px rgba(30,36,41,.1),var(--shadow); }
.site-header { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid rgba(10,13,16,.19); background: rgba(228,231,231,.85); backdrop-filter: blur(17px); }
.nav { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 11px; font-size: 19px; font-weight: 950; letter-spacing: -.02em; }
.brand-mark { width: 42px; height: 42px; display: grid; place-items: center; position: relative; border: 1px solid #6f7579; background: var(--metal); box-shadow: inset 0 0 0 4px rgba(255,255,255,.35),4px 5px 12px rgba(22,26,30,.2); }
.brand-mark::before { content: ""; width: 12px; height: 19px; border: solid #1b2026; border-width: 0 5px 5px 0; transform: rotate(45deg) translate(-2px,2px); }
.brand-mark::after { content: ""; position: absolute; inset: 4px; border: 1px solid rgba(27,32,38,.18); }
.nav-links { display: flex; align-items: center; gap: 28px; color: #4f575d; font-size: 13px; font-weight: 850; }
.nav-links a:hover,.nav-links a[aria-current="page"] { color: #13171b; }
.nav-toggle { display: none; border: 0; background: transparent; font-size: 25px; cursor: pointer; }
.btn {
  min-width: 136px;
  min-height: 48px;
  padding: 12px 21px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #090b0d;
  background: #171b20;
  color: #fff;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: .03em;
  white-space: nowrap;
  word-break: keep-all;
  writing-mode: horizontal-tb;
  box-shadow: inset 0 1px rgba(255,255,255,.12),0 12px 24px rgba(17,21,25,.2);
  transition: transform .2s ease,background .2s ease;
}
.btn:hover { transform: translateY(-2px); background: #242a31; }
.btn-orange { background: var(--orange); border-color: #d7521e; box-shadow: inset 0 1px rgba(255,255,255,.35),0 13px 28px rgba(209,76,26,.24); }
.btn-orange:hover { background: #ff7c48; }
.btn-steel { color: #161a1e; background: var(--metal); border-color: #9ca2a6; }

.hero { min-height: 800px; display: grid; align-items: center; padding: 90px 0 110px; overflow: hidden; position: relative; }
.hero::after { content: ""; position: absolute; width: 360px; height: 100%; right: 0; top: 0; z-index: -1; background: repeating-linear-gradient(90deg,rgba(15,19,23,.03) 0,rgba(15,19,23,.03) 1px,transparent 1px,transparent 8px); }
.hero-grid { display: grid; grid-template-columns: 76px .86fr 1.14fr; gap: 42px; align-items: center; }
.hero-rail { min-height: 510px; padding: 20px 0; display: flex; flex-direction: column; align-items: center; justify-content: space-between; border-left: 1px solid #6b7277; border-right: 1px solid rgba(255,255,255,.75); }
.rail-text { writing-mode: vertical-rl; color: #596168; font-family: Consolas,monospace; font-size: 11px; font-weight: 800; letter-spacing: .18em; }
.rail-light { width: 9px; height: 9px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 7px rgba(255,111,53,.12); }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 20px; color: #596168; font-family: Consolas,"Microsoft YaHei UI",sans-serif; font-size: 11px; font-weight: 900; letter-spacing: .15em; }
.eyebrow::before { content: ""; width: 25px; height: 3px; background: var(--orange); }
h1 { margin-bottom: 24px; font-size: clamp(49px,5.8vw,84px); font-weight: 950; line-height: .96; letter-spacing: -.07em; }
h1 .cut { display: block; color: transparent; -webkit-text-stroke: 1.5px #20262b; background: repeating-linear-gradient(180deg,#242a30 0,#242a30 2px,transparent 2px,transparent 5px); background-clip: text; -webkit-background-clip: text; }
.hero-copy { max-width: 600px; margin-bottom: 29px; color: var(--muted); font-size: 17px; }
.actions { display: flex; flex-wrap: wrap; gap: 11px; }
.platforms { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 25px; }
.tag { padding: 7px 10px; border: 1px solid #a1a6a9; background: rgba(239,241,241,.68); color: #51595f; font-family: Consolas,monospace; font-size: 10px; font-weight: 800; }
.hero-media { align-self: center; height: auto; padding: 0; margin: 0; position: relative; }
.hero-media::before { content: ""; position: absolute; inset: 15% 4% 5%; z-index: -1; background: rgba(16,20,24,.12); filter: blur(35px); }
.hero-media img { filter: drop-shadow(0 32px 32px rgba(16,20,24,.23)); }
.status-plate { position: absolute; right: 4%; bottom: 9%; padding: 13px 16px; border: 1px solid #8c9296; background: var(--metal); font-family: Consolas,monospace; font-size: 11px; font-weight: 900; box-shadow: var(--shadow); }
.status-dot { display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 5px rgba(22,185,189,.12); }

.metrics { margin-top: -58px; position: relative; z-index: 4; }
.metric-strip { display: grid; grid-template-columns: 1.2fr repeat(5,1fr); border: 1px solid #8f969a; background: #171b20; box-shadow: var(--shadow); }
.metric-title { padding: 26px; display: flex; align-items: center; color: #9da5aa; font-family: Consolas,monospace; font-size: 11px; letter-spacing: .12em; }
.metric { padding: 24px 12px; border-left: 1px solid #373d43; text-align: center; }
.metric strong { display: block; color: #f5f6f6; font-size: 25px; line-height: 1.2; letter-spacing: -.04em; }
.metric span { color: #858e94; font-size: 10px; }

.section { padding: 118px 0; }
.section-dark { color: #edf0f1; background: #15191e; }
.section-head { max-width: 740px; margin-bottom: 52px; }
.section-head.center { margin-inline: auto; text-align: center; }
.section-head.center .eyebrow { justify-content: center; }
h2 { margin-bottom: 18px; font-size: clamp(37px,4.3vw,60px); font-weight: 930; line-height: 1.06; letter-spacing: -.052em; }
.lead { color: var(--muted); font-size: 17px; }
.section-dark .lead { color: #929ba1; }

.feature-rack { display: grid; grid-template-columns: repeat(4,1fr); gap: 2px; border: 1px solid #0d1013; background: #0d1013; }
.feature { min-height: 430px; padding: 31px; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; background: #20262c; }
.feature:nth-child(even) { background: #1a1f25; }
.feature::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: var(--cyan); }
.feature:nth-child(2)::before { background: var(--orange); }.feature:nth-child(3)::before { background: #b7bdc1; }.feature:nth-child(4)::before { background: #dfa93a; }
.feature-code { color: #788188; font-family: Consolas,monospace; font-size: 11px; letter-spacing: .12em; }
.feature-icon { width: 70px; height: 70px; display: grid; place-items: center; border: 1px solid #555d64; background: repeating-linear-gradient(100deg,#aeb4b8 0,#dde0e1 2px,#8e969b 4px,#ccd0d2 6px); color: #171b20; font-size: 25px; font-weight: 950; box-shadow: inset 0 0 0 5px rgba(255,255,255,.2),0 15px 25px rgba(0,0,0,.25); }
.feature h3 { margin: 25px 0 10px; color: #f1f3f3; font-size: 23px; }
.feature p { color: #9ba3a8; font-size: 14px; }
.feature-readout { padding-top: 20px; border-top: 1px solid #3a4248; color: #737d84; font-family: Consolas,monospace; font-size: 10px; }

.device-section { overflow: hidden; }
.device-layout { display: grid; grid-template-columns: 1.08fr .92fr; gap: 78px; align-items: center; }
.device-media { align-self: center; height: auto; padding: 0; margin: 0; }
.device-media img { filter: drop-shadow(0 30px 35px rgba(18,22,26,.18)); }
.persona-list { margin-top: 30px; border-top: 1px solid #92999d; }
.persona { padding: 19px 0; display: grid; grid-template-columns: 92px 1fr; gap: 18px; border-bottom: 1px solid #b2b7ba; }
.persona b { color: #596168; font-family: Consolas,monospace; font-size: 10px; letter-spacing: .1em; }
.persona strong { display: block; margin-bottom: 2px; }
.persona span { color: var(--muted); font-size: 13px; }

.news-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 1px; border: 1px solid #8b9296; background: #8b9296; }
.news-main { min-height: 480px; padding: 42px; display: flex; flex-direction: column; justify-content: space-between; background: var(--metal); color: #171b20; }
.news-side { display: grid; gap: 1px; background: #8b9296; }
.story { padding: 34px; background: #d8dcdd; }
.story:nth-child(2) { background: #cdd2d4; }
.story-label { color: #687177; font-family: Consolas,monospace; font-size: 10px; font-weight: 900; letter-spacing: .12em; }
.news-main h3 { margin: 21px 0 13px; font-size: 38px; line-height: 1.2; letter-spacing: -.04em; }
.story h3 { margin: 14px 0 9px; font-size: 24px; }
.news-main p,.story p { color: #626a70; }
.text-link { display: inline-flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 900; }

.reviews { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.review { padding: 32px; position: relative; border: 1px solid #9ca2a6; background: var(--metal); box-shadow: var(--shadow); }
.review::before,.review::after { content: ""; position: absolute; width: 7px; height: 7px; border-radius: 50%; background: #747b80; box-shadow: inset 1px 1px 2px rgba(0,0,0,.45),1px 1px 1px #fff; }
.review::before { left: 11px; top: 11px; }.review::after { right: 11px; bottom: 11px; }
.stars { color: var(--orange); font-size: 12px; letter-spacing: 3px; }
.review blockquote { margin: 21px 0 27px; color: #3f474d; font-size: 16px; }
.person { display: flex; align-items: center; gap: 12px; }
.avatar { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid #838a8e; background: #1d2228; color: #fff; font-weight: 900; }
.person span { display: block; color: var(--muted); font-size: 12px; }

.pricing { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; border: 1px solid #8c9397; background: #8c9397; }
.price-card { padding: 37px; background: #e0e3e3; }
.price-card.best { background: #1a1f25; color: #fff; transform: translateY(-11px); box-shadow: var(--shadow); }
.plan { color: #666e73; font-family: Consolas,monospace; font-size: 11px; font-weight: 900; letter-spacing: .1em; }
.best .plan,.best .price-note,.best li { color: #9aa2a8; }
.price { margin: 20px 0 5px; font-size: 49px; font-weight: 950; line-height: 1; letter-spacing: -.05em; }
.price small { font-size: 14px; letter-spacing: 0; }
.price-note { min-height: 44px; color: var(--muted); font-size: 13px; }
.price-card ul { margin: 25px 0; padding: 20px 0 0; border-top: 1px solid rgba(72,80,86,.22); list-style: none; }
.price-card li { margin: 10px 0; color: #596168; font-size: 14px; }
.price-card li::before { content: "■"; margin-right: 9px; color: var(--orange); font-size: 7px; }
.price-card .btn { width: 100%; }
.price-disclaimer { margin-top: 23px; color: var(--muted); text-align: center; font-size: 12px; }

.faq-list { max-width: 940px; margin: auto; border-top: 1px solid #8f969a; }
.faq-list details { border-bottom: 1px solid #8f969a; }
.faq-list summary { padding: 23px 58px 23px 5px; position: relative; cursor: pointer; list-style: none; font-weight: 900; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; position: absolute; right: 4px; top: 17px; width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid #858c90; background: var(--metal); color: #3c4449; font-size: 21px; }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { padding: 0 58px 24px 5px; margin: 0; color: var(--muted); }

.final-cta { padding: 65px 0 115px; }
.cta-panel { padding: 72px; position: relative; overflow: hidden; border: 1px solid #0f1215; background: #181d22; color: #fff; box-shadow: var(--shadow); }
.cta-panel::before { content: ""; position: absolute; width: 330px; height: 100%; right: 0; top: 0; background: repeating-linear-gradient(100deg,#7d858a 0,#d0d4d5 2px,#697277 4px,#abb1b4 7px); opacity: .8; clip-path: polygon(36% 0,100% 0,100% 100%,0 100%); }
.cta-panel h2,.cta-panel p,.cta-panel .actions,.cta-panel .eyebrow { position: relative; z-index: 2; max-width: 720px; }
.cta-panel p { color: #a4acb1; }

.site-footer { padding: 70px 0 25px; border-top: 1px solid #8e9599; background: #cfd3d4; }
.footer-grid { display: grid; grid-template-columns: 1.5fr repeat(4,1fr); gap: 44px; }
.footer-intro p { max-width: 280px; margin-top: 20px; color: var(--muted); font-size: 13px; }
.footer-col h3 { margin-bottom: 15px; font-size: 13px; }
.footer-col a { display: block; margin: 9px 0; color: var(--muted); font-size: 13px; }
.footer-bottom { margin-top: 52px; padding-top: 20px; display: flex; justify-content: space-between; gap: 20px; border-top: 1px solid #a2a8ab; color: #727a7f; font-family: Consolas,monospace; font-size: 11px; }

.page-hero { padding: 135px 0 90px; border-bottom: 1px solid #92999d; }
.page-hero-grid { display: grid; grid-template-columns: 1fr .8fr; gap: 70px; align-items: center; }
.page-hero h1 { font-size: clamp(48px,5.7vw,77px); }
.page-hero p { max-width: 640px; color: var(--muted); font-size: 17px; }
.page-gauge { min-height: 320px; padding: 38px; display: grid; place-items: center; position: relative; }
.gauge-ring { width: 190px; height: 190px; display: grid; place-items: center; border: 22px solid #20262c; border-top-color: var(--orange); border-right-color: var(--cyan); border-radius: 50%; background: var(--metal); font-family: Consolas,monospace; font-size: 13px; font-weight: 900; box-shadow: inset 0 0 0 1px #858c90,0 20px 35px rgba(18,22,26,.18); transform: rotate(-25deg); }
.gauge-ring span { transform: rotate(25deg); }
.download-list { display: grid; gap: 10px; }
.download-card { padding: 25px; display: grid; grid-template-columns: 62px 1fr auto; gap: 20px; align-items: center; border: 1px solid #949b9f; background: var(--metal); box-shadow: 0 12px 28px rgba(20,24,28,.1); }
.platform-icon { width: 62px; height: 62px; display: grid; place-items: center; border: 1px solid #626a70; background: #1c2127; color: #fff; font-family: Consolas,monospace; font-size: 20px; font-weight: 900; }
.download-card h2 { margin: 0 0 4px; font-size: 21px; }
.download-card p { margin: 0; color: var(--muted); font-size: 13px; }
.download-card .btn { min-width: 144px; }
.steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; border: 1px solid #8d9498; background: #8d9498; }
.step { padding: 32px; background: #dfe2e2; }
.step b { display: block; margin-bottom: 30px; color: #687177; font-family: Consolas,monospace; font-size: 10px; letter-spacing: .14em; }

.help-layout { display: grid; grid-template-columns: 260px 1fr; gap: 60px; align-items: start; }
.help-menu { position: sticky; top: 100px; border: 1px solid #92999d; background: var(--metal); }
.help-menu strong { display: block; padding: 17px 19px; border-bottom: 1px solid #989fa3; }
.help-menu a { display: block; padding: 10px 19px; color: var(--muted); font-size: 13px; }
.help-menu a:hover { color: #fff; background: #20262c; }
.help-content article { padding: 0 0 58px; margin-bottom: 58px; border-bottom: 1px solid #a2a8ab; scroll-margin-top: 110px; }
.help-content h2 { font-size: 39px; }
.help-content h3 { margin-top: 28px; }
.help-content p,.help-content li { color: var(--muted); }
.notice { padding: 20px 22px; border-left: 5px solid var(--orange); background: #d4d8d9; color: #565f65; box-shadow: inset 0 0 0 1px rgba(255,255,255,.5); }

@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media(max-width:980px){
  .nav-links{display:none;position:absolute;top:72px;left:20px;right:20px;padding:20px;flex-direction:column;align-items:stretch;gap:4px;border:1px solid #8d9498;background:#dfe2e2;box-shadow:var(--shadow)}
  .nav-links.open{display:flex}.nav-links a{padding:10px}.nav-toggle{display:block}.nav>.btn{display:none}
  .hero-grid{grid-template-columns:45px 1fr}.hero-media{grid-column:2;max-width:700px;margin-inline:auto}
  .hero-rail{grid-row:span 2}.metric-strip{grid-template-columns:repeat(3,1fr)}.metric-title{grid-column:span 3;justify-content:center}
  .metric:nth-child(5){border-left:0}.feature-rack{grid-template-columns:1fr 1fr}.device-layout,.page-hero-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1.5fr 1fr 1fr}
}
@media(max-width:700px){
  .container{width:min(100% - 28px,1190px)}.section{padding:86px 0}.hero{padding-top:75px}.hero-grid{grid-template-columns:1fr}.hero-rail{display:none}h1{font-size:49px}
  .metric-strip{grid-template-columns:1fr 1fr}.metric-title{grid-column:span 2}.metric{border-top:1px solid #373d43}.feature-rack,.reviews,.pricing,.steps{grid-template-columns:1fr}
  .feature{min-height:350px}.price-card.best{transform:none}.cta-panel{padding:46px 27px}.cta-panel::before{opacity:.2}
  .footer-grid{grid-template-columns:1fr 1fr}.footer-intro{grid-column:span 2}.footer-bottom{flex-direction:column}
  .download-card{grid-template-columns:54px 1fr}.download-card .btn{grid-column:span 2;width:100%;min-width:160px}.help-layout{grid-template-columns:1fr}.help-menu{position:static}
}

/* Hero media sizing guard */
.hero-grid{align-items:center}
.hero-media{align-self:center;height:auto;padding:0;margin-top:0;margin-bottom:0;overflow:visible;transform:none;clip-path:none}
.hero-media img{display:block;width:100%;height:auto;min-height:0;max-height:none;margin:0;padding:0;object-fit:contain;object-position:center;transform:none;clip-path:none}
.device-layout{align-items:center}
.device-media{align-self:center;height:auto;padding:0;margin-top:0;margin-bottom:0;overflow:visible;transform:none;clip-path:none}
.device-media img{display:block;width:100%;height:auto;min-height:0;max-height:none;margin:0;padding:0;object-fit:contain;object-position:center;transform:none;clip-path:none}