.download-page { background: #f6f5f8; color: #171522; }
.download-page h1, .download-page h2, .download-page h3 { color: #171522; text-wrap: balance; }
.download-hero { padding: var(--page-hero-padding-start) 0 var(--page-hero-padding-end); background: radial-gradient(circle at 82% 18%,rgba(137,86,188,.2),transparent 31%),linear-gradient(180deg,#f7f6f9,#eeedf2); overflow: hidden; }
.download-hero .blog-breadcrumbs { margin-bottom: var(--page-hero-breadcrumb-gap); }
.download-hero-grid { display: block; }
.download-hero-copy h1 { max-width: 760px; margin: 0 0 var(--heading-copy-gap); font-size: var(--type-page-title); line-height: var(--line-page-title); letter-spacing: var(--tracking-page-title); }
.download-hero-copy > p { max-width: 720px; margin: 0; color: #625f6b; font-size: 18px; line-height: 1.68; }
.download-hero-copy > .download-availability-note { margin-top: 14px; font-size: 15px; font-weight: 700; line-height: 1.5; }
.download-hero-copy .button-row { margin-top: var(--copy-to-action-gap); }
.download-facts { margin: 42px 0 0; display: grid; grid-template-columns: repeat(4,1fr); border: 1px solid #e0dce4; border-radius: 24px; background: #fff; box-shadow: 0 22px 60px rgba(55,40,68,.1); overflow: hidden; }
.download-facts > div { min-width: 0; min-height: 112px; padding: 24px 26px; display: grid; align-content: center; gap: 5px; border-right: 1px solid #e0dce4; }
.download-facts > div:last-child { border-right: 0; }
.download-facts dt { color: #7b7680; font-size: 10px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.download-facts dd { margin: 0; color: #241d2d; font-size: 16px; font-weight: 850; line-height: 1.35; }
html[data-locale="ja"] .download-facts dt { letter-spacing: .04em; text-transform: none; }
html[data-locale="zh-CN"] .download-facts dt { letter-spacing: 0; text-transform: none; }

.download-section { padding: var(--section-edge-space) 0; }
.download-heading { max-width: 820px; margin-bottom: var(--section-heading-gap); }
.download-heading h2, .download-after-grid h2, .download-final h2 { margin: 0 0 16px; font-size: var(--type-section-title); line-height: var(--line-section-title); letter-spacing: var(--tracking-section-title); }
.download-heading p, .download-final p { max-width: 760px; margin: 0; color: #6b6772; font-size: 17px; line-height: 1.7; }
.download-heading.is-on-dark h2 { color: #fff; }
.download-heading.is-on-dark p { color: #ccc4d4; }

.download-video-section { background: #29252f; }
.download-video-frame { margin: 0; padding: 18px; border: 1px solid rgba(255,255,255,.1); border-radius: 32px; background: #17131d; box-shadow: 0 32px 80px rgba(13,9,17,.34); }
.download-video-frame video { width: 100%; height: auto; aspect-ratio: 16/9; border-radius: 22px; background: #0d0a10; object-fit: contain; }
.download-video-frame figcaption { min-height: 54px; padding: 16px 8px 0; display: flex; align-items: center; gap: 10px; color: #fff; font-size: 13px; font-weight: 750; }
.download-live-dot { width: 10px; height: 10px; flex: 0 0 auto; border-radius: 50%; background: #50d68c; box-shadow: 0 0 0 5px rgba(80,214,140,.13); }

.download-requirements { background: #f6f5f8; }
.download-requirement-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.download-requirement-grid article { min-height: 260px; padding: 28px; display: flex; flex-direction: column; border: 1px solid #e0dce4; border-radius: 24px; background: #fff; }
.download-requirement-grid article > span { width: 38px; height: 4px; border-radius: 999px; background: linear-gradient(90deg,#a467dc,#7544ba); }
.download-requirement-grid h3 { margin: 42px 0 12px; font-size: 21px; line-height: 1.2; }
.download-requirement-grid p { margin: 0; color: #6d6975; font-size: 14px; line-height: 1.65; }

.download-installation { background: #fff; }
.download-step-grid { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; list-style: none; }
.download-step-grid li { min-height: 315px; padding: 30px; display: flex; flex-direction: column; border: 1px solid #dfdae4; border-radius: 26px; background: #f8f7fa; }
.download-step-grid li > span { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 16px; background: #e9e1fb; color: #6947be; font-size: 16px; font-weight: 900; }
.download-step-grid h3 { margin: 52px 0 12px; font-size: 24px; line-height: 1.2; }
.download-step-grid p { margin: 0; color: #6d6975; font-size: 15px; line-height: 1.65; }

.download-after-installation { background: linear-gradient(135deg,#eee9f5,#f8f7fa); }
.download-after-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 90px; align-items: start; }
.download-after-grid h2 { margin-top: 0; }
.download-after-grid p { margin: 0; color: #625f6b; font-size: 18px; line-height: 1.75; }
.download-next-links { margin-top: 28px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.download-next-links.is-single { grid-template-columns: minmax(260px,420px); }
.download-next-links a { min-height: 58px; padding: 0 18px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border: 1px solid #ddd6e5; border-radius: 16px; background: rgba(255,255,255,.72); color: #4f2b79; font-size: 14px; font-weight: 850; }
.download-next-links a:focus-visible { outline: 3px solid rgba(137,86,188,.3); outline-offset: 3px; }

html[data-locale="zh-CN"] body .download-hero .blog-breadcrumbs [aria-current="page"],
html[data-locale="zh-CN"] body .download-facts dt,
html[data-locale="zh-CN"] body .download-facts dd,
html[data-locale="zh-CN"] body .download-video-frame figcaption,
html[data-locale="zh-CN"] body .download-step-grid li > span,
html[data-locale="zh-CN"] body .download-next-links a { font-weight: 700; }

.download-final { padding: var(--section-edge-space) 0 var(--footer-adjacent-space); background: #211a2c; color: #fff; }
.download-final-grid { display: grid; grid-template-columns: 1fr auto; gap: 70px; align-items: center; }
.download-final h2 { color: #fff; }
.download-final p { color: #d0c9d8; }

@media (max-width: 1040px) {
  .download-requirement-grid { grid-template-columns: repeat(2,1fr); }
  .download-after-grid { gap: 48px; }
}

@media (max-width: 820px) {
  .download-hero { padding: var(--page-hero-padding-start) 0 var(--page-hero-padding-end); }
  .download-hero .blog-breadcrumbs { margin-bottom: var(--page-hero-breadcrumb-gap); }
  .download-after-grid, .download-final-grid { grid-template-columns: 1fr; }
  .download-hero-copy h1 { font-size: var(--type-page-title); }
  .download-facts { grid-template-columns: repeat(2,1fr); }
  .download-facts > div:nth-child(2) { border-right: 0; }
  .download-facts > div:nth-child(-n+2) { border-bottom: 1px solid #e0dce4; }
  .download-step-grid { grid-template-columns: 1fr; }
  .download-step-grid li { min-height: 0; }
  .download-step-grid h3 { margin-top: 38px; }
  .download-final-grid { gap: 30px; }
}

@media (max-width: 640px) {
  .download-hero-copy h1 { font-size: var(--type-page-title); }
  .download-hero-copy > p, .download-heading p, .download-after-grid p, .download-final p { font-size: 16px; }
  .download-hero-copy .button-row, .download-final .button-row { align-items: stretch; }
  .download-hero-copy .button, .download-final .button { flex: 1 1 170px; }
  .download-facts { margin-top: 28px; border-radius: 20px; }
  .download-facts > div { min-height: 102px; padding: 18px; }
  .download-facts dd { font-size: 14px; }
  .download-heading h2, .download-after-grid h2, .download-final h2 { font-size: var(--type-section-title); }
  .download-video-frame { padding: 10px; border-radius: 23px; }
  .download-video-frame video { border-radius: 16px; }
  .download-video-frame figcaption { min-height: 50px; padding: 14px 5px 2px; font-size: 11px; }
  .download-requirement-grid { grid-template-columns: 1fr; }
  .download-requirement-grid article { min-height: 0; padding: 24px; }
  .download-requirement-grid h3 { margin-top: 32px; }
  .download-step-grid li { padding: 24px; }
  .download-next-links { grid-template-columns: 1fr; }
  .download-next-links.is-single { grid-template-columns: 1fr; }
}

@media (max-width: 380px) {
  .download-hero-copy h1 { font-size: var(--type-page-title); }
  .download-hero-copy .button, .download-final .button { width: 100%; }
  .download-facts > div { padding-inline: 14px; }
}