*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:88px}body{margin:0;background:#fff;color:#172442;font:16px/1.7 "Segoe UI","Microsoft YaHei",sans-serif}a{color:#3454d1;text-decoration-thickness:1px;text-underline-offset:4px}button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #087f8c;outline-offset:4px}header{border-bottom:1px solid #dde4f4;background:#ffffffed;position:sticky;top:0;z-index:10;backdrop-filter:blur(10px)}nav{max-width:1220px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:18px 28px;gap:20px}.brand{font-weight:700;text-decoration:none;color:#172442;letter-spacing:-.5px}.navlinks{display:flex;gap:22px;font-size:14px}.navlinks a{color:#475775;text-decoration:none}.hero{max-width:1220px;margin:auto;padding:64px 28px 48px;display:grid;grid-template-columns:1fr 1.2fr;gap:36px;align-items:center}h1{font-size:clamp(32px,3.9vw,51px);line-height:1.28;letter-spacing:-1.5px;margin:16px 0 24px}h2{font-size:31px;line-height:1.4;letter-spacing:-.6px}h3{font-size:25px;margin:0 0 12px}.version{display:inline-flex;gap:9px;align-items:center;font-size:13px;color:#087f8c;background:#e9f5f3;border-radius:30px;padding:5px 13px}.version i{height:7px;width:7px;background:#087f8c;border-radius:50%}.lead{color:#53627d;max-width:32em}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0}.button{padding:11px 18px;border:1px solid #b9c6e4;border-radius:7px;text-decoration:none;display:inline-block;font-weight:600;font-size:15px;background:white;color:#3454d1}.primary{background:#3454d1;color:white;border-color:#3454d1}.hero figure{margin:0}.hero img{display:block;width:100%;height:auto}.caption,figcaption{font-size:12px;color:#6c7990;margin-top:9px}.platform{font-size:13px;color:#67758d}.section{max-width:1220px;margin:auto;padding:48px 28px}.intro{max-width:780px;color:#53627d}.workbench{display:grid;grid-template-columns:210px minmax(0,1fr);gap:28px;margin-top:30px;align-items:start}.feature-tabs{display:flex;flex-direction:column;gap:5px;position:sticky;top:94px}.feature-tabs button{border:0;text-align:left;padding:12px 14px;background:transparent;border-radius:7px;color:#52617d;font-size:15px}.feature-tabs button[aria-selected=true]{background:#eaf0ff;color:#2745b4;font-weight:700;border-left:3px solid #3454d1}.feature-panel{padding:26px;border:1px solid #dde4f4;border-radius:12px;min-width:0}.feature-panel p{margin:8px 0;color:#53627d}.feature-panel ul{display:flex;gap:7px;flex-wrap:wrap;list-style:none;padding:0;margin:20px 0}.feature-panel li{background:#f0f4fb;border-radius:5px;padding:5px 10px;color:#53627d;font-size:13px}.screen-button{padding:0;border:0;width:100%;background:#edf1fa;border-radius:8px;overflow:hidden;display:block}.screen-button img{width:100%;display:block;height:auto}.diagram{width:100%;display:block;margin-top:20px;border-radius:8px}.note{font-size:13px!important;border-left:2px solid #95b5bd;padding-left:12px;margin-top:18px!important}.feature-panel[hidden]{display:none}.demo{background:#f5f8fe;border-radius:12px;padding:28px;display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:12px}.demo h3{font-size:21px}.demo-controls{display:flex;gap:20px;align-items:center;margin:18px 0;font-size:14px}.demo-controls label{display:grid;gap:6px}.demo-grid{display:grid;grid-template-columns:repeat(var(--columns,3),1fr);gap:var(--gap,12px);max-width:410px;margin:auto;width:100%}.demo-tile{aspect-ratio:1.5;border-radius:3px;background:radial-gradient(ellipse at 30% 58%,#3287a7 0 12%,transparent 13%),radial-gradient(ellipse at 70% 30%,#58bba0 0 13%,transparent 14%),#142c43;position:relative}.demo-tile span{position:absolute;top:3px;left:7px;color:white;font-weight:bold}.demo-tile:nth-child(2n){filter:hue-rotate(28deg)}.download-area{border-top:1px solid #dde4f4;margin-top:38px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin:26px 0}.steps h3{font-size:18px}.steps p{color:#53627d;font-size:15px}details{border-top:1px solid #dde4f4;padding:18px 0;max-width:900px}summary{cursor:pointer;font-weight:600}details p,details li{font-size:14px;color:#53627d}pre{padding:18px;background:#eff3fa;border-radius:7px;overflow:auto;font-size:13px}footer{border-top:1px solid #dde4f4;padding:28px;text-align:center;color:#69758b;font-size:13px}dialog{border:0;border-radius:10px;padding:12px;width:min(96vw,1500px);max-height:94vh;overflow:auto}dialog::backdrop{background:#111d36d9}dialog img{display:block;width:100%}.dialog-close{position:sticky;top:0;float:right;border:1px solid #c6d1e6;background:#fff;border-radius:5px;padding:5px 14px;margin-bottom:8px}.split-note{font-size:13px;color:#6c7990}.skip{position:fixed;left:12px;top:-80px;background:white;padding:9px;z-index:30}.skip:focus{top:8px}@media(max-width:800px){.hero{grid-template-columns:1fr;padding-top:35px;gap:10px}.hero figure{max-width:650px}.navlinks{gap:12px}.navlinks .optional{display:none}.workbench{grid-template-columns:1fr}.feature-tabs{position:static;display:grid;grid-template-columns:repeat(2,1fr);gap:3px}.feature-tabs button{padding:9px 10px}.feature-panel{padding:18px}.demo{grid-template-columns:1fr}.steps{grid-template-columns:1fr;gap:8px}.section{padding:32px 20px}nav{padding:14px 20px}.hero{padding-left:20px;padding-right:20px}h1{letter-spacing:-.7px}.demo-controls{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media(max-width:500px){nav{flex-wrap:wrap;gap:6px}.brand{flex-basis:100%;font-size:15px}.navlinks{width:100%;justify-content:space-between;white-space:nowrap;font-size:13px;gap:12px}.hero{padding-top:25px}h1{font-size:31px}.feature-panel{padding:14px}.feature-tabs button{font-size:13px}}
