﻿*{box-sizing:border-box;margin:0;padding:0}
:root{
  --paper:#f5f7fa;--white:#fff;--navy:#13243f;--blue:#2667e8;--blue-2:#4a86f7;
  --sky:#eaf1ff;--ink:#1c2b42;--text:#56647a;--muted:#8490a2;--line:#dde3eb;
  --green:#1b9b70;--orange:#f26c3d;--shadow:0 22px 65px rgba(24,52,91,.11)
}
html{scroll-behavior:smooth}
body{min-width:320px;color:var(--text);background:var(--paper);font:16px/1.75 "Microsoft YaHei","PingFang SC","Noto Sans CJK SC",Arial,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;height:auto}
a:focus-visible{outline:3px solid rgba(38,103,232,.28);outline-offset:4px}
.container{width:min(1180px,calc(100% - 48px));margin-inline:auto}
.utility{border-bottom:1px solid #263a59;color:#b9c5d5;background:var(--navy);font-size:11px}
.utility-inner{display:flex;align-items:center;justify-content:space-between;min-height:38px;gap:20px}
.live{display:flex;align-items:center;gap:8px}
.live:before{content:"";width:7px;height:7px;border-radius:50%;background:#5ee0ac}
.nav{position:sticky;top:0;z-index:60;border-bottom:1px solid rgba(221,227,235,.95);background:rgba(245,247,250,.94);backdrop-filter:blur(15px)}
.nav-inner{display:grid;grid-template-columns:230px 1fr auto;align-items:center;min-height:72px;gap:30px}
.brand{display:flex;align-items:center;gap:11px;color:var(--navy);font-weight:900}
.brand-mark{display:grid;width:38px;height:38px;place-items:center;border-radius:10px;color:#fff;background:var(--blue);font:900 19px/1 Arial}
.nav-links{display:flex;justify-content:center;gap:26px;color:#68758a;font-size:13px}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--blue)}
.nav-action{display:inline-flex;min-width:116px;min-height:40px;align-items:center;justify-content:center;padding:0 18px;border-radius:9px;color:#fff;background:var(--blue);font-size:13px;font-weight:900;white-space:nowrap;word-break:keep-all;writing-mode:horizontal-tb}
.hero{position:relative;padding:88px 0 105px;overflow:hidden}
.hero:before{content:"";position:absolute;top:-220px;right:-150px;width:600px;height:600px;border:100px solid rgba(38,103,232,.045);border-radius:50%}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;gap:58px}
.release{display:inline-flex;align-items:center;gap:9px;padding:8px 12px;border:1px solid #c6d5f2;border-radius:7px;color:var(--blue);background:#f4f8ff;font-size:12px;font-weight:900;letter-spacing:.07em}
.release:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--orange)}
h1{margin-top:23px;color:var(--navy);font-size:clamp(48px,6.3vw,80px);line-height:1.04;letter-spacing:-.07em}
.hero-copy{max-width:610px;margin-top:23px;color:#65738a;font-size:17px;line-height:1.9}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:29px}
.button{display:inline-flex;min-width:154px;min-height:52px;align-items:center;justify-content:center;padding:0 24px;border:1px solid var(--blue);border-radius:10px;font-weight:900;white-space:nowrap;word-break:keep-all;writing-mode:horizontal-tb;transition:transform .2s ease,box-shadow .2s ease}
.button:hover{transform:translateY(-2px)}
.button-primary{color:#fff;background:var(--blue);box-shadow:0 14px 32px rgba(38,103,232,.2)}
.button-light{color:var(--blue);background:#fff}
.trust{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:18px;color:#7b8798;font-size:12px}
.trust span:before{content:"✓";margin-right:6px;color:var(--green);font-weight:900}
.workspace{align-self:center;position:relative;height:auto;padding:0;margin:0;border:1px solid #d8e0eb;border-radius:20px;background:#fff;box-shadow:var(--shadow);overflow:visible}
.window-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 15px;border-bottom:1px solid var(--line);color:#8b96a6;font-size:11px}
.window-dots{display:flex;gap:5px}.window-dots i{width:7px;height:7px;border-radius:50%;background:#cbd3de}.window-dots i:first-child{background:var(--orange)}.window-dots i:last-child{background:var(--green)}
.hero-media{align-self:center;height:auto;padding:0;margin:0;border-radius:0 0 19px 19px;background:#fff;overflow:hidden}
.hero-media picture,.hero-media img{display:block;width:100%;height:auto;object-fit:contain;object-position:center;margin:0;padding:0;transform:none;clip-path:none}
.ime{position:absolute;right:20px;bottom:-64px;left:20px;padding:16px 18px;border:1px solid #d3dce8;border-radius:12px;background:#fff;box-shadow:0 18px 42px rgba(22,49,87,.15)}
.ime-top{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.pinyin{color:var(--blue);font:800 19px/1.2 "Segoe UI",Arial,sans-serif;letter-spacing:.06em}
.ai-state{color:var(--green);font-size:11px;font-weight:900}
.candidates{display:flex;gap:17px;margin-top:10px;color:#5f6c80;font-size:12px;white-space:nowrap}
.candidates b{color:var(--blue)}
.keyboard{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;margin-top:10px}
.key{display:grid;height:23px;place-items:center;border:1px solid #e0e5ec;border-radius:4px;color:#8190a3;background:#f8fafc;font-size:9px}
.section{padding:96px 0;border-top:1px solid var(--line)}
.section-white{background:#fff}
.section-navy{color:#fff;background:var(--navy)}
.section-head{display:grid;grid-template-columns:210px 1fr;gap:45px;margin-bottom:43px}
.eyebrow{padding-top:7px;color:var(--blue);font:900 11px/1.4 "Segoe UI","Microsoft YaHei",sans-serif;letter-spacing:.13em;text-transform:uppercase}
.section-navy .eyebrow{color:#83aeff}
h2{max-width:800px;color:var(--navy);font-size:clamp(35px,4.5vw,56px);line-height:1.14;letter-spacing:-.05em}
.section-navy h2{color:#fff}
.lead{max-width:720px;margin-top:14px;color:#7a8799}
.section-navy .lead{color:#aebbd0}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.feature{min-height:238px;padding:27px;border:1px solid var(--line);border-radius:15px;background:#fff}
.feature-icon{display:grid;width:45px;height:45px;place-items:center;border-radius:10px;color:var(--blue);background:var(--sky);font-weight:900}
.feature h3{margin-top:28px;color:var(--navy);font-size:21px}
.feature p{margin-top:9px;color:#8190a2;font-size:14px}
.platforms{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.platform{display:flex;min-width:0;min-height:320px;flex-direction:column;padding:27px;border:1px solid var(--line);border-radius:15px;background:#f8fafc}
.os{display:grid;width:45px;height:45px;place-items:center;border-radius:10px;color:#fff;background:var(--navy);font:900 11px/1 Arial}
.platform h3{margin-top:33px;color:var(--navy);font-size:22px}
.platform small{margin-top:4px;color:#909bac}
.platform p{margin:14px 0 24px;color:#7c899a;font-size:14px}
.platform a{display:inline-flex;min-width:120px;min-height:42px;align-items:center;justify-content:center;align-self:flex-start;margin-top:auto;padding:0 16px;border-radius:8px;color:#fff;background:var(--blue);font-size:13px;font-weight:900;white-space:nowrap;word-break:keep-all;writing-mode:horizontal-tb}
.stories{display:grid;gap:24px}
.story{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:48px;padding:23px;border:1px solid var(--line);border-radius:18px;background:#fff}
.story:nth-child(even) .story-media{order:2}
.story-media{align-self:center;height:auto;padding:0;margin:0;border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden}
.story-media picture,.story-media img{display:block;width:100%;height:auto;max-height:none;min-height:0;object-fit:contain;object-position:center;margin:0;padding:0;transform:none;clip-path:none}
.story-copy{padding:18px}
.label{color:var(--blue);font-size:11px;font-weight:900;letter-spacing:.1em}
.story h3{margin-top:12px;color:var(--navy);font-size:clamp(28px,3.2vw,41px);line-height:1.2;letter-spacing:-.04em}
.story p{margin-top:14px;color:#78869a}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:17px;list-style:none}
.chips li{padding:6px 9px;border:1px solid var(--line);border-radius:6px;color:#67758a;background:#f8fafc;font-size:12px}
.deep-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.deep{min-height:325px;padding:28px;border:1px solid #304561;border-radius:15px;background:#182c49}
.deep-icon{display:grid;width:50px;height:50px;place-items:center;border-radius:50%;color:var(--navy);background:#8bb4ff;font-weight:900}
.deep h3{margin-top:58px;color:#fff;font-size:25px}
.deep p{margin-top:12px;color:#a9b7ca;font-size:14px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:16px;background:#fff;overflow:hidden}
.stat{padding:35px 22px;border-right:1px solid var(--line);text-align:center}
.stat:last-child{border-right:0}
.stat strong{display:block;color:var(--blue);font:800 clamp(40px,5vw,62px)/1 "Segoe UI",Arial,sans-serif;letter-spacing:-.05em}
.stat span{display:block;margin-top:12px;color:#8490a2;font-size:12px}
.news-list{display:grid;gap:10px}
.news{display:grid;grid-template-columns:130px 1fr 1fr;gap:30px;padding:25px;border:1px solid var(--line);border-radius:12px;background:#fff}
.news time{color:var(--blue);font:800 12px/1.6 "Segoe UI",Arial,sans-serif}
.news h3{color:var(--navy);font-size:18px}
.news p{color:#8190a2;font-size:14px}
.final{padding:76px 0;background:var(--blue)}
.final-inner{display:flex;align-items:center;justify-content:space-between;gap:40px}
.final h2{color:#fff}
.final .lead{color:#dce8ff}
.final .button-light{border-color:#fff}
.page-hero{padding:82px 0 72px;border-bottom:1px solid var(--line);background:#fff}
.breadcrumb{color:#8a96a7;font-size:12px}
.breadcrumb a{color:var(--blue)}
.page-hero h1{max-width:900px;margin-top:18px;font-size:clamp(43px,5.5vw,70px)}
.page-hero p{max-width:760px;margin-top:18px;color:#758296;font-size:17px}
.download-matrix{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.download-card{display:grid;grid-template-columns:62px 1fr auto;align-items:center;gap:20px;padding:27px;border:1px solid var(--line);border-radius:15px;background:#fff}
.download-card .os{width:54px;height:54px}
.download-card h3{color:var(--navy);font-size:21px}
.download-card p{margin-top:5px;color:#8793a4;font-size:13px}
.download-card a{display:inline-flex;min-width:116px;min-height:42px;align-items:center;justify-content:center;padding:0 15px;border-radius:8px;color:#fff;background:var(--blue);font-size:13px;font-weight:900;white-space:nowrap;word-break:keep-all;writing-mode:horizontal-tb}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.step{padding:27px;border:1px solid var(--line);border-radius:15px;background:#fff}
.step-no{display:grid;width:38px;height:38px;place-items:center;border-radius:50%;color:#fff;background:var(--blue);font:900 13px/1 Arial}
.step h3{margin-top:24px;color:var(--navy);font-size:20px}
.step p{margin-top:9px;color:#8390a2;font-size:14px}
.help-layout{display:grid;grid-template-columns:280px 1fr;align-items:start;gap:28px}
.help-nav{position:sticky;top:104px;padding:22px;border:1px solid var(--line);border-radius:14px;background:#fff}
.help-nav strong{color:var(--navy)}
.help-nav a{display:block;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);color:#718096;font-size:13px}
.help-content{display:grid;gap:14px}
.help-block{padding:29px;border:1px solid var(--line);border-radius:14px;background:#fff}
.help-block h2{font-size:29px}
.help-block h3{margin-top:22px;color:var(--navy);font-size:18px}
.help-block p,.help-block li{margin-top:9px;color:#758397;font-size:14px}
.help-block ol,.help-block ul{padding-left:20px}
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line);background:#fff}
.faq summary{padding:20px 4px;color:var(--navy);font-weight:900;cursor:pointer}
.faq p{padding:0 4px 20px;color:#7b899b;font-size:14px}
footer{padding:29px 0;border-top:1px solid var(--line);color:#8490a2;font-size:12px}
.footer-inner{display:flex;justify-content:space-between;gap:24px}
.footer-links{display:flex;gap:18px}
@media(max-width:980px){
  .hero-grid{grid-template-columns:1fr;gap:92px}.workspace{max-width:760px}
  .feature-grid{grid-template-columns:repeat(2,1fr)}.platforms{grid-template-columns:repeat(2,1fr)}
  .download-matrix{grid-template-columns:1fr}
}
@media(max-width:720px){
  .container{width:min(100% - 28px,1180px)}.utility-inner span:last-child{display:none}
  .nav-inner{grid-template-columns:1fr auto}.nav-links{display:none}
  .hero{padding-top:58px}h1{font-size:clamp(44px,14vw,67px)}
  .ime{position:relative;right:auto;bottom:auto;left:auto;margin:10px -4px -78px}.hero-grid{gap:112px}
  .candidates{justify-content:center;gap:8px;font-size:10px}.keyboard{grid-template-columns:repeat(5,1fr)}
  .section{padding:72px 0}.section-head{grid-template-columns:1fr;gap:12px}
  .feature-grid,.platforms{grid-template-columns:1fr}
  .story{grid-template-columns:1fr;gap:10px}.story:nth-child(even) .story-media{order:0}
  .deep-grid{grid-template-columns:1fr}.deep{min-height:260px}.deep h3{margin-top:30px}
  .stats{grid-template-columns:repeat(2,1fr)}.stat:nth-child(2){border-right:0}.stat:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .news{grid-template-columns:1fr;gap:8px}.final-inner{align-items:flex-start;flex-direction:column}
  .download-card{grid-template-columns:54px 1fr}.download-card a{grid-column:2;justify-self:start}
  .steps{grid-template-columns:1fr}.help-layout{grid-template-columns:1fr}.help-nav{position:static}
  .footer-inner{flex-direction:column}
}
@media(max-width:460px){
  .actions .button{width:100%}.stats{grid-template-columns:1fr}.stat{border-right:0;border-bottom:1px solid var(--line)}.stat:last-child{border-bottom:0}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}
/* Hero media final override */
.hero-grid{align-items:center}
.workspace,.hero-media{align-self:center;height:auto}
.hero-media picture,.hero-media img{display:block;width:100%;height:auto;max-height:none;min-height:0;object-fit:contain;object-position:center;margin:0;padding:0;transform:none;clip-path:none}

/* Cursor performance optimization */
:root{--shadow:0 14px 36px rgba(24,52,91,.09)}
.nav{background:rgba(245,247,250,.98);backdrop-filter:blur(6px)}
.section{content-visibility:auto;contain-intrinsic-size:1px 780px}
.ime{box-shadow:0 12px 28px rgba(22,49,87,.12)}
@media(max-width:720px){.nav{backdrop-filter:none}.hero:before{display:none}.workspace{box-shadow:0 10px 26px rgba(24,52,91,.08)}}
