@charset "UTF-8";
:root {
  color-scheme:light;
  --ink:#182133;
  --muted:#626e82;
  --blue:#266cf1;
  --line:#e1e7f0;
  --surface:#f8faff;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-synthesis:none;
  scroll-behavior:smooth;
  scroll-padding-top:96px
}
* {
  box-sizing:border-box
}
body {
  margin:0;
  background:white;
  color:var(--ink);
  -webkit-font-smoothing:antialiased
}
a {
  color:inherit;
  text-decoration:none
}
button,a {
  -webkit-tap-highlight-color:transparent
}
a:focus-visible,button:focus-visible,summary:focus-visible {
  outline:3px solid var(--blue);
  outline-offset:5px
}
img {
  max-width:100%;
  height:auto
}
svg {
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round
}
h1,h2,h3,p {
  margin:0
}
h1,h2,h3 {
  text-wrap:balance
}
p {
  line-height:1.8
}
h2 {
  font-size:clamp(2rem,3.4vw,2.9rem);
  line-height:1.35;
  letter-spacing:-.055em
}
h3 {
  font-size:1.15rem;
  letter-spacing:-.025em;
  line-height:1.5
}
.wrap {
  width:min(1120px,calc(100% - 64px));
  margin-inline:auto
}
.skip-link {
  position:fixed;
  top:10px;
  left:10px;
  z-index:100;
  padding:12px 18px;
  background:white;
  border:2px solid var(--blue);
  transform:translateY(-160%)
}
.skip-link:focus {
  transform:none
}
.site-header {
  position:sticky;
  top:0;
  z-index:20;
  background:#ffffffed;
  border-bottom:1px solid #e1e7f08c;
  backdrop-filter:blur(16px)
}
.navigation {
  height:80px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px
}
.brand {
  display:flex;
  align-items:center;
  gap:10px;
  white-space:nowrap;
  font-size:1.03rem;
  font-weight:650;
  letter-spacing:-.025em
}
.brand img {
  flex:none
}
.nav-links {
  display:flex;
  align-items:center;
  gap:32px;
  margin-left:auto;
  margin-right:22px;
  font-size:.9rem;
  font-weight:500;
  color:var(--muted)
}
.nav-links a:hover,.footer a:hover {
  color:var(--blue)
}
.button {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  min-height:54px;
  padding:14px 25px;
  border:1px solid var(--blue);
  border-radius:13px;
  background:var(--blue);
  color:#fff;
  font-size:1rem;
  line-height:1.45;
  font-weight:550;
  box-shadow:0 5px 16px #266cf119;
  transition:background .18s,transform .18s,box-shadow .18s
}
.button svg {
  width:20px;
  height:20px
}
.button:hover {
  background:#1859d3;
  transform:translateY(-2px);
  box-shadow:0 9px 23px #266cf128
}
.button-small {
  min-height:39px;
  padding:8px 15px;
  border-radius:10px;
  font-size:.875rem
}
.button-secondary {
  background:#fff;
  color:var(--ink);
  border-color:#dae1ec;
  box-shadow:0 3px 8px #162a4410
}
.button-secondary:hover {
  background:#f5f7fc;
  border-color:#bbc8da;
  box-shadow:0 5px 12px #162a4412
}
.hero {
  position:relative;
  text-align:center;
  padding:67px 0 65px
}
.hero:before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:-80px -20px -10px;
  background:radial-gradient(ellipse 47% 51% at 50% 34%,#e8f0ff 0%,#f8faff80 70%,transparent 100%);
  pointer-events:none
}
.hero-mark {
  margin-bottom:17px
}
.hero-mark img {
  filter:drop-shadow(0 10px 18px #234b8425)
}
.eyebrow {
  font-size:.875rem;
  font-weight:550;
  color:var(--blue);
  letter-spacing:.05em;
  line-height:1.6
}
.eyebrow span {
  padding:0 8px;
  color:#a8b3c4
}
.hero h1 {
  font-size:clamp(2.7rem,5.5vw,4.9rem);
  font-weight:650;
  line-height:1.18;
  letter-spacing:-.065em;
  margin-top:22px
}
.hero h1 span {
  color:var(--blue)
}
.hero-description {
  margin-top:24px;
  font-size:1.12rem;
  color:var(--muted);
  line-height:1.8
}
.hero-actions {
  display:flex;
  justify-content:center;
  gap:12px;
  margin-top:28px
}
.release-note {
  font-size:.8rem;
  color:#748095;
  margin-top:17px
}
.release-note span {
  padding:0 7px
}
.shortcut {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  margin-top:36px;
  font-size:.8rem;
  color:var(--muted)
}
.shortcut>div {
  display:flex;
  gap:5px
}
kbd {
  min-width:30px;
  padding:4px 7px;
  background:linear-gradient(#fff,#f3f5f8);
  border:1px solid #d8dfe8;
  border-bottom-width:3px;
  border-radius:7px;
  font:500 .9rem/1.2 -apple-system,BlinkMacSystemFont,sans-serif;
  color:#535f72
}
.features {
  padding-top:58px;
  padding-bottom:90px
}
.section-heading {
  text-align:center
}
.section-heading h2 {
  margin-top:15px
}
.section-heading>p:last-child {
  color:var(--muted);
  font-size:1rem;
  margin-top:15px
}
.feature-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:44px;
  margin-top:58px
}
.feature {
  padding:0 8px
}
.feature-icon {
  display:block;
  width:30px;
  height:30px;
  color:var(--blue);
  margin-bottom:22px;
  font-size:2.4rem;
  line-height:25px
}
.feature h3 {
  margin-bottom:12px
}
.feature p {
  font-size:1rem;
  color:var(--muted)
}
.install-section {
  padding:85px 0;
  background:var(--surface);
  border-block:1px solid var(--line)
}
.install-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px
}
.install-layout h2 {
  margin:16px 0 21px
}
.install-layout>div>p:not(.eyebrow) {
  color:var(--muted);
  font-size:1rem
}
.text-link {
  display:inline-flex;
  gap:8px;
  align-items:center;
  color:var(--blue);
  font-size:.93rem;
  font-weight:550;
  margin-top:27px
}
.text-link:hover {
  text-decoration:underline;
  text-underline-offset:5px
}
.install-steps {
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  justify-content:center
}
.install-steps li {
  display:flex;
  gap:24px;
  padding:24px 0;
  border-bottom:1px solid var(--line)
}
.install-steps li:first-child {
  padding-top:0
}
.install-steps li:last-child {
  border:0;
  padding-bottom:0
}
.step-number {
  font-variant-numeric:tabular-nums;
  color:#87a1c5;
  font-size:.9rem;
  line-height:1.9
}
.install-steps h3 {
  margin-bottom:8px
}
.install-steps p {
  color:var(--muted);
  font-size:1rem
}
.footer {
  display:flex;
  align-items:center;
  gap:30px;
  padding-block:35px;
  font-size:.8rem;
  color:var(--muted)
}
.footer .brand {
  color:var(--ink);
  font-size:.9rem
}
.footer p {
  margin-right:auto
}
.footer>div {
  display:flex;
  gap:22px;
  white-space:nowrap
}
@media(max-width:760px) {
  .wrap {
    width:calc(100% - 40px)
  }
  .navigation {
    height:68px;
    gap:14px
  }
  .brand {
    font-size:.92rem;
    gap:7px
  }
  .brand img {
    width:31px
  }
  .nav-links {
    gap:18px;
    margin-right:0
  }
  .nav-source {
    display:none
  }
  .button-small {
    padding:7px 12px
  }
  .hero {
    padding-top:46px
  }
  .hero-mark img {
    width:76px
  }
  .hero h1 {
    font-size:clamp(2.65rem,8vw,4rem);
    margin-top:18px
  }
  .hero-description {
    font-size:1rem
  }
  .feature-grid {
    gap:22px
  }
  .feature {
    padding:0
  }
  .feature p {
    font-size:1rem
  }
  .install-layout {
    gap:38px
  }
  .footer {
    flex-wrap:wrap;
    justify-content:space-between;
    gap:15px
  }
  .footer p {
    order:3;
    width:100%;
    margin:0
  }
  .footer>div {
    gap:17px
  }
  .features {
    padding-top:44px;
    padding-bottom:65px
  }
  .install-section {
    padding:60px 0
  }
}
@media(max-width:520px) {
  .navigation {
    gap:8px
  }
  .nav-links {
    gap:16px;
    font-size:.82rem
  }
  .nav-links a[href="#install"] {
    display:none
  }
  .desktop-only {
    display:none
  }
  .button-small {
    min-height:36px;
    font-size:.8rem
  }
  .hero {
    padding-bottom:40px
  }
  .hero-actions {
    gap:10px;
    flex-direction:column;
    align-items:center
  }
  .hero-actions .button {
    padding:12px 16px;
    font-size:1rem;
    min-height:49px;
    width:100%;
    max-width:320px
  }
  .release-note {
    font-size:.75rem
  }
  .release-note span {
    padding:0 4px
  }
  .shortcut {
    gap:10px;
    font-size:.75rem;
    margin-top:27px
  }
  .hero h1 {
    font-size:2.7rem
  }
  .feature-grid {
    grid-template-columns:1fr;
    gap:30px;
    margin-top:35px
  }
  .feature {
    position:relative;
    padding-left:48px
  }
  .feature-icon {
    position:absolute;
    left:0;
    top:3px;
    width:27px;
    height:27px
  }
  .feature h3 {
    margin-bottom:6px
  }
  .section-heading {
    text-align:left
  }
  .section-heading h2 {
    font-size:2rem
  }
  .install-layout {
    grid-template-columns:1fr;
    gap:36px
  }
  .install-layout h2 {
    font-size:2rem
  }
  .install-steps li {
    gap:18px;
    padding:20px 0
  }
  .footer {
    padding-block:26px
  }
  .footer .brand {
    font-size:.84rem
  }
  .footer>div {
    font-size:.77rem;
    gap:12px
  }
}
@media(prefers-reduced-motion:reduce) {
  :root {
    scroll-behavior:auto
  }
  *,*:before,*:after {
    transition:none!important;
    animation:none!important
  }
}
/* Product imagery and the next-version preview share the app's quiet blue palette. */
[hidden]{display:none!important}.brand img,.hero-mark img,.closing img{border-radius:24%}.hero{padding-top:40px;padding-bottom:42px}.hero-mark{margin-bottom:12px}.hero-mark img{width:64px}.hero h1{font-size:clamp(2.7rem,5vw,4.3rem);margin-top:16px}.hero-description{margin-top:18px;font-size:1.06rem}.hero-actions{margin-top:24px}.showcase{position:relative}.preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:16px}.preview-label{font-size:.9rem;color:var(--muted)}.preview-tabs{display:flex;padding:4px;background:#f1f4f9;border-radius:11px;border:1px solid var(--line);gap:3px}.preview-tabs button{font-family:inherit;font-size:.875rem;font-weight:500;line-height:1.4;border:0;border-radius:7px;padding:7px 18px;background:transparent;color:var(--muted);cursor:pointer;min-height:34px}.preview-tabs button[aria-selected=true]{background:white;box-shadow:0 2px 6px #162a4414;color:var(--ink)}.preview-frame{border:1px solid #10264921;border-radius:22px;overflow:hidden;background:#0b253e;box-shadow:0 22px 55px -20px #172f614d,0 5px 15px #172f6110}.preview-frame img{display:block;width:100%;height:auto}.preview-frame [role=tabpanel]{outline-offset:-4px}.preview-caption{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:20px;font-size:.8rem;color:var(--muted)}.preview-caption .shortcut{margin-top:0}.next-version{background:linear-gradient(115deg,#f2f6ff,#f8faff);border:1px solid #e3eaf7;border-radius:24px;padding:50px 56px;display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;margin-bottom:90px}.version-badge{display:inline-block;color:#416aa2;background:#e6edfa;border:1px solid #dce5f5;font-size:.8rem;border-radius:7px;padding:5px 9px;line-height:1.5}.next-intro h2{margin:18px 0;font-size:2.3rem}.next-intro>p{color:var(--muted);font-size:1rem}.next-features{display:flex;flex-direction:column;justify-content:center;gap:28px}.next-features article{display:flex;gap:19px}.next-number{color:#829cbf;line-height:1.9;font-size:.85rem;font-variant-numeric:tabular-nums}.next-features h3{font-size:1.05rem;margin-bottom:6px}.next-features p{font-size:1rem;color:var(--muted)}.faq{padding-block:88px;display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}.faq h2{margin-top:16px;font-size:2.3rem}.faq details{padding:20px 0;border-bottom:1px solid var(--line)}.faq details:first-child{padding-top:0}.faq summary{list-style:none;cursor:pointer;font-size:1rem;font-weight:550;line-height:1.6;display:flex;align-items:center;justify-content:space-between;gap:18px}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";font-weight:400;font-size:1.35rem;color:#7b8ca8;flex:none}.faq details[open] summary:after{content:"−"}.faq details p{margin-top:13px;color:var(--muted);font-size:1rem}.closing{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:30px;padding-block:34px}.closing>div{display:flex;align-items:center;gap:22px}.closing h2{font-size:1.6rem;letter-spacing:-.04em}.closing .button{flex:none}
@media(max-width:760px){.hero{padding-top:32px}.hero-mark img{width:62px}.preview-frame{border-radius:16px}.preview-caption{font-size:.75rem}.next-version{grid-template-columns:1fr 1fr;gap:35px;padding:32px;margin-bottom:60px}.next-intro h2{font-size:2rem}.next-features{gap:24px}.next-features article{gap:12px}.faq{gap:32px;padding-block:60px}.faq h2{font-size:1.95rem}.closing{gap:20px}.closing h2{font-size:1.2rem}.closing img{width:46px}.closing>div{gap:14px}.closing .button{font-size:.875rem;padding:12px 16px}}
@media(max-width:520px){.hero{padding-top:30px;padding-bottom:30px}.hero h1{font-size:2.65rem}.preview-toolbar{gap:12px;margin-bottom:12px}.preview-label{font-size:.8rem}.preview-tabs button{font-size:.8rem;padding:6px 12px}.preview-frame{border-radius:12px}.preview-caption{align-items:flex-start;flex-direction:column;gap:14px}.preview-caption .shortcut{align-self:center}.next-version{grid-template-columns:1fr;padding:26px;gap:32px;border-radius:18px}.next-intro h2 br{display:none}.next-intro>p br{display:none}.next-features{gap:25px}.faq{grid-template-columns:1fr;gap:28px}.faq h2 br{display:none}.faq details{padding:18px 0}.closing{flex-direction:column;align-items:flex-start;gap:23px}.closing h2{font-size:1.22rem}.closing .button{align-self:stretch}}
@media(max-width:360px){.nav-links{display:none}.hero h1{font-size:2.3rem}.preview-toolbar{flex-direction:column;align-items:flex-start}.preview-tabs{align-self:stretch}.preview-tabs button{flex:1}.closing h2{font-size:1.05rem}.next-version{padding:24px}.footer>div{font-size:.875rem}}
.inline-link{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
