:root{--ink:#1c1c24;--muted:#656572;--violet:#5b43d6;--lime:#d9f66f;--paper:#f7f5ee;--line:#e6e2ee}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:ui-sans-serif,system-ui,-apple-system,'PingFang SC','Microsoft YaHei',sans-serif;line-height:1.7}a{color:inherit;text-decoration:none}a:focus-visible,summary:focus-visible{outline:3px solid var(--violet);outline-offset:6px}img{display:block;max-width:100%}.skip{position:absolute;left:-9999px}.skip:focus{left:20px;top:10px;background:white;padding:10px;z-index:10}header{max-width:1240px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:24px 32px}.brand{display:flex;align-items:center;gap:12px;font-size:21px;font-weight:800;letter-spacing:-.5px}.brand img{width:40px;height:40px;border-radius:12px}nav{display:flex;align-items:center;gap:28px;font-size:14px}.pill{padding:10px 22px;border:1px solid var(--line);border-radius:99px;font-weight:650}.pill.primary{background:var(--ink);color:white;border-color:var(--ink)}main{max-width:1240px;margin:auto;padding:0 32px}.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:70px;align-items:center;padding:65px 0 90px;min-height:680px}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:750;color:var(--violet);text-transform:uppercase}.badge{display:inline-flex;gap:8px;align-items:center;background:#eae5fb;padding:5px 12px;border-radius:99px;font-size:12px;font-weight:650}.badge:before{content:'';width:6px;height:6px;border-radius:50%;background:var(--violet)}h1{font-size:clamp(45px,5.7vw,76px);line-height:1.18;letter-spacing:-4px;margin:26px 0}h1 span{color:var(--violet)}.lead{font-size:18px;max-width:460px;color:var(--muted)}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.button{padding:15px 26px;border:1px solid var(--line);border-radius:99px;font-weight:650;display:inline-flex;align-items:center;gap:16px;background:white}.button.primary{background:var(--violet);color:white;border-color:var(--violet)}.fine{font-size:12px;color:var(--muted);margin-top:16px}.stage{position:relative;display:flex;justify-content:center;align-items:center;min-height:530px;background:#e9e4f8;border-radius:52% 48% 45% 55%/40% 52% 48% 60%}.phone{width:250px;padding:9px;background:#1c1c24;border:2px solid #555461;border-radius:42px;transform:rotate(5deg);box-shadow:0 30px 65px #21163c26}.phone img{border-radius:32px;height:auto}.float{position:absolute;padding:12px 20px;background:white;border:1px solid #ffffff;border-radius:18px;box-shadow:0 10px 30px #21163c10;font-weight:700}.float.one{left:-10px;top:95px;transform:rotate(-8deg)}.float.two{bottom:75px;right:-5px;background:var(--lime);transform:rotate(6deg)}.caption{position:absolute;bottom:18px;font-size:11px;color:var(--muted)}section{padding:75px 0;border-top:1px solid var(--line)}.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:36px}h2{font-size:clamp(30px,3.3vw,44px);line-height:1.3;letter-spacing:-1.5px;margin:12px 0}h3{font-size:22px;margin:12px 0}.section-head p{max-width:350px;color:var(--muted)}.examples{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.example{padding:30px;border-radius:28px;background:white;border:1px solid var(--line)}.number{font-size:13px;color:var(--violet);font-weight:700}.example p{font-size:14px;color:var(--muted)}.choice{padding:8px 12px;border:1px solid var(--line);border-radius:12px;font-size:13px;margin-top:8px}.scene{display:inline-block;font-size:12px;background:#f3f0fb;color:var(--violet);border-radius:8px;padding:4px 10px;margin-top:14px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:38px}.steps p{color:var(--muted);font-size:15px}.principles{display:grid;grid-template-columns:1fr 1fr;gap:60px}.principles ul{list-style:none;padding:0;margin:0}.principles li{padding:20px 0;border-bottom:1px solid var(--line)}.principles li span{display:block;color:var(--muted);font-size:14px;margin-top:5px}.tint{background:#ece7fa;border-radius:32px;padding:36px}.tint b{font-size:55px;letter-spacing:-3px;display:block;line-height:1.2;margin:30px 0}.download{text-align:center;background:var(--lime);border-radius:38px;padding:55px 24px;margin-bottom:70px;border:0}.download .actions{justify-content:center}.download p{max-width:590px;margin:16px auto}.download .fine{color:#434933}.faq{max-width:850px;margin:auto;padding:10px 0 70px;border:0}details{padding:20px 0;border-bottom:1px solid var(--line)}summary{font-size:17px;font-weight:650;cursor:pointer}details p{color:var(--muted)}footer{border-top:1px solid var(--line);max-width:1240px;margin:auto;padding:28px 32px 40px;display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:12px}.footer-links{display:flex;gap:24px}.document{max-width:780px;padding-top:40px;padding-bottom:80px}.document h1{font-size:40px;letter-spacing:-1px}.document h2{font-size:24px;margin-top:35px}.document p{color:var(--muted)}@media(max-width:800px){header,main,footer{padding-left:22px;padding-right:22px}nav a:not(.pill){display:none}.hero{grid-template-columns:1fr;padding:35px 0 55px;gap:35px;min-height:0}h1{letter-spacing:-2px}.stage{min-height:480px;margin:0 15px}.phone{width:220px}.float.one{left:-20px}.float.two{right:-20px}.examples,.steps,.principles{grid-template-columns:1fr;gap:18px}.section-head{display:block}section{padding:48px 0}.tint b{font-size:45px}footer{flex-direction:column}.download{margin-bottom:45px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}@media(prefers-contrast:more){:root{--muted:#333;--line:#777}.stage{background:#ded5f2}}









.languages{display:flex;flex-wrap:wrap;gap:12px;font-size:12px}.languages a{padding:5px 8px;border-radius:10px;border:1px solid var(--line)}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .5s ease,transform .5s ease}.reveal.seen{opacity:1;transform:none}.phone{animation:phone-float 6s ease-in-out infinite}.float.one{animation:bubble-one 5s ease-in-out infinite}.float.two{animation:bubble-two 5.5s ease-in-out infinite}@keyframes phone-float{0%,100%{transform:translateY(0) rotate(5deg)}50%{transform:translateY(-8px) rotate(4deg)}}@keyframes bubble-one{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(6px) rotate(-5deg)}}@keyframes bubble-two{0%,100%{transform:translateY(0) rotate(6deg)}50%{transform:translateY(-6px) rotate(3deg)}}.demo-layout{display:grid;grid-template-columns:1fr 1.3fr;gap:40px;align-items:center}.demo-controls{display:grid;gap:12px}.demo-tab{font:inherit;text-align:left;background:white;border:1px solid var(--line);border-radius:20px;padding:18px 24px;color:var(--ink);cursor:pointer;min-height:48px;transition:background .18s,border .18s}.demo-tab[aria-pressed=true]{background:#ece7fa;border-color:var(--violet);color:var(--violet);font-weight:700}.demo-tab:focus-visible{outline:3px solid var(--violet);outline-offset:4px}.demo-card{background:white;border:1px solid var(--line);border-radius:30px;padding:36px;min-height:260px;box-shadow:0 12px 35px #21163c08}.demo-card .scene{margin-right:8px}.muted{color:var(--muted)}@media(max-width:800px){.demo-layout{grid-template-columns:1fr;gap:20px}.demo-controls{display:flex;flex-wrap:wrap}.demo-tab{padding:12px 16px;flex:1}.demo-card{padding:24px}}@media(prefers-reduced-motion:reduce){.phone,.float.one,.float.two{animation:none}.reveal{opacity:1;transform:none;transition:none}.demo-tab{transition:none}}





.policy-list{display:grid;gap:12px}.policy-list a{padding:18px;background:white;border:1px solid var(--line);border-radius:16px;color:var(--violet)}

@media(prefers-color-scheme:dark){:root{color-scheme:dark;--paper:#15141a;--ink:#f0edf5;--muted:#c5bfce;--violet:#c1b2ff;--line:#49434f}.button,.example,.demo-tab,.demo-card,.float,.policy-list a,.skip:focus{background:#211f28}.badge,.scene,.tint,.stage,.demo-tab[aria-pressed=true]{background:#40315d}.pill.primary,.button.primary{color:#281064;background:var(--violet);border-color:var(--violet)}.download,.float.two{color:#1c1c24}.float{border-color:var(--line)}.download .button{background:#f7f5ee;color:#1c1c24}.download .fine{color:#434933}}
