.desktop-download-page { color: var(--ink); background: #fff; }
.desktop-download-page p { color: var(--muted); }
.download-hero { padding-top: 52px; padding-bottom: 34px; text-align: center; }
.download-app-icon { display: grid; place-items: center; width: 76px; height: 76px; margin: 0 auto 20px; border: 1px solid #e4dced; border-radius: 21px; background: linear-gradient(145deg,#fff 30%,#f0e8fa); box-shadow: 0 9px 22px -12px #5d228a50, inset 0 1px 0 #fff; transform: rotate(-7deg); }
.download-app-icon img { transform: rotate(7deg); }
.desktop-download-page .download-eyebrow { margin: 0 0 16px; color: #665774; font-size: 14px; line-height: 1.5; font-weight: 500; }
.download-hero h1 { margin: 0; font-size: clamp(44px,5.2vw,72px); font-weight: 700; line-height: 1.08; letter-spacing: -.035em; text-wrap: balance; }
.download-hero h1 span { display: block; color: var(--purple); }
.desktop-download-page .download-introduction { max-width: 620px; margin: 25px auto 32px; font-size: 19px; line-height: 1.55; text-wrap: pretty; }
.download-primary { display: flex; justify-content: center; }
.download-primary-cta { display: inline-flex; justify-content: center; align-items: center; gap: 12px; min-height: 58px; max-width: 100%; padding: 16px 30px; border-radius: 999px; background: var(--purple); color: #fff; font-size: 17px; line-height: 1.45; font-weight: 500; transition: background-color 160ms ease; }
.download-primary-cta > svg { flex-shrink: 0; }
.download-primary-cta:hover { background: #5212ac; }
.download-divider { width: min(620px,100%); height: 1px; margin: 34px auto 15px; border: 0; background: #e9e3ee; }
.download-options { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; margin-inline: auto; scroll-margin-top: 100px; }
.desktop-download-page .desktop-download-link { padding: 10px 15px; color: var(--purple); font-size: 13px; line-height: 1.5; font-weight: 400; text-underline-offset: 4px; }
.desktop-download-link + .desktop-download-link { border-left: 1px solid #ddd3e7; }
.desktop-download-page .desktop-download-link:hover { text-decoration: underline; }
.download-release-note { display: flex; justify-content: center; align-items: baseline; flex-wrap: wrap; gap: 6px 12px; margin-top: 18px; color: #746a7c; font-size: 12px; }
.download-mac-help summary { display: inline-flex; align-items: center; gap: 5px; color: #5d4a72; cursor: pointer; list-style: none; }
.download-mac-help summary::-webkit-details-marker { display: none; }
.download-mac-help[open] { flex-basis: 100%; }
.desktop-download-page .download-mac-help p { max-width: 510px; margin: 10px auto 0; padding: 14px 18px; border-radius: 12px; background: #f6f3fa; color: #5d4a72; font-size: 13px; text-align: left; }
.desktop-download-page .download-account-note { margin: 20px auto 0; max-width: 700px; font-size: 13px; line-height: 1.7; }
.download-account-note a { display: inline-flex; align-items: center; gap: 4px; margin-left: 5px; color: var(--purple); text-decoration: underline; text-underline-offset: 3px; }
.download-explore { display: grid; place-items: center; width: 44px; height: 44px; margin: 27px auto 0; border-radius: 50%; color: #877496; }
.download-explore:hover { background: #f5f0fa; color: var(--purple); }
.desktop-download-page :is(a,summary):focus-visible { outline: 3px solid #6716d8; outline-offset: 5px; border-radius: 5px; }
.desktop-download-page .download-primary-cta:focus-visible { border-radius: 999px; }
.download-workflow { padding: 86px 0 72px; background: #f5f2fa; scroll-margin-top: 80px; overflow: clip; }
.download-workflow-grid { display: grid; grid-template-columns: .84fr 1.16fr; gap: 65px; align-items: center; }
.desktop-download-page h2 { text-wrap: balance; }
.download-workflow-copy h2, .download-section-heading h2, .download-faq > h2 { margin: 0; font-size: clamp(32px,3.1vw,44px); line-height: 1.12; letter-spacing: -.025em; font-weight: 700; }
.download-workflow-copy > p:not(.download-eyebrow) { max-width: 420px; margin: 22px 0 0; font-size: 17px; line-height: 1.6; }
.download-workflow-copy ul { display: grid; gap: 25px; padding: 0; margin: 35px 0 0; list-style: none; }
.download-workflow-copy li { display: flex; gap: 15px; }
.download-workflow-copy li > svg { flex: 0 0 auto; margin-top: 3px; color: #7b549f; }
.download-workflow-copy h3 { margin: 0 0 5px; font-size: 16px; line-height: 1.5; font-weight: 600; }
.download-workflow-copy li p { margin: 0; font-size: 14px; line-height: 1.6; }
.download-workflow-figure { min-width: 0; margin: 0; }
.download-workflow-scene { position: relative; aspect-ratio: 1.1; border: 1px solid #e6dbef; border-radius: 23px; background: radial-gradient(ellipse at 10% 20%,#fff1dc,transparent 60%),radial-gradient(ellipse at 100% 90%,#dcd0f4,transparent 65%),#eee6f5; box-shadow: 0 25px 70px -50px #6b398c77; container-type: inline-size; overflow: hidden; }
.download-scene-bar { display: flex; align-items: center; justify-content: space-between; height: 10%; padding-inline: 5%; background: #ffffff45; }
.download-scene-bar > span, .download-window-dots { display: flex; gap: 4px; }
.download-scene-bar i, .download-window-dots i { width: 5px; height: 5px; border-radius: 50%; background: #aa97b7; }
.download-canvas { position: absolute; top: 23%; left: 5%; width: 72%; height: 58%; border: 1px solid #e3dce9; border-radius: 11px; background: #fff; box-shadow: 0 16px 30px -10px #58356b25; overflow: hidden; transform: rotate(-4deg); }
.download-window-bar { display: flex; align-items: center; justify-content: space-between; height: 12%; padding-inline: 5%; border-bottom: 1px solid #eee8f2; background: #fff; color: #796b84; font-size: 1.5cqw; }
.download-window-bar > img { width: 28%; height: auto; }
.download-canvas-art { display: flex; align-items: center; position: absolute; inset: 21% 8% 16%; background: #f8f3ec; overflow: hidden; }
.download-canvas-art > span { position: relative; z-index: 1; width: 52%; padding-left: 8%; font-size: 4.5cqw; font-weight: 750; line-height: .98; letter-spacing: -.05em; color: #322440; }
.download-canvas-art em { display: block; margin-top: 9%; font-family: Georgia,serif; font-size: 2.6cqw; font-weight: 400; line-height: 1; letter-spacing: -.03em; }
.download-canvas-art > img { position: absolute; right: 0; height: 100%; width: 51%; object-fit: cover; }
.download-canvas-tools { display: flex; gap: 4px; position: absolute; left: 7%; right: 7%; bottom: 5%; }
.download-canvas-tools i { width: 4%; height: 3px; border-radius: 3px; background: #d4c6dd; }
.download-canvas-tools span { margin-left: auto; font-size: 1.2cqw; color: #80748a; }
.download-pickit-window { position: absolute; top: 15%; right: 5%; width: 42%; height: 60%; border: 1px solid #ded2e9; border-radius: 12px; background: #fff; box-shadow: 0 15px 40px -12px #4c276a38; overflow: hidden; transform: rotate(3deg); }
.download-pickit-window .download-window-bar { height: 15%; }
.download-scene-search { display: flex; align-items: center; gap: 5px; height: 10%; margin: 7% 7% 0; padding: 0 5%; border: 1px solid #e6dced; border-radius: 6px; color: #82738c; font-size: 1.6cqw; white-space: nowrap; }
.download-scene-search svg, .download-scene-collection svg { width: 2.3cqw; height: 2.3cqw; flex-shrink: 0; }
.download-scene-collection { display: flex; align-items: center; gap: 5px; padding: 7% 7% 5%; font-size: 1.6cqw; color: #73627f; }
.download-scene-assets { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-inline: 7%; }
.download-scene-assets > div:first-child { grid-column: 1 / -1; position: relative; aspect-ratio: 1.8; overflow: hidden; border-radius: 5px; outline: 2px solid #9663d3; outline-offset: 2px; }
.download-scene-assets > div:first-child > img { width: 100%; height: 100%; object-fit: cover; }
.download-scene-assets > div:first-child > span { position: absolute; display: flex; gap: 3px; align-items: center; left: 5%; bottom: 7%; padding: 3px 5px; background: #fffc; border-radius: 3px; color: #4b315c; font-size: 1.2cqw; }
.download-scene-logo,.download-scene-color { display: flex; align-items: center; justify-content: center; gap: 3px; aspect-ratio: 1.5; border-radius: 5px; background: #f3edf7; }
.download-scene-logo img { width: 60%; height: auto; }
.download-scene-color i { width: 15%; height: 50%; background: #9c62db; border-radius: 2px; }
.download-scene-color i:nth-child(2) { background: #b5cce4; }.download-scene-color i:nth-child(3) { background: #ecc9b4; }
.download-dragged-asset { position: absolute; top: 49%; left: 44%; width: 24%; aspect-ratio: 1.2; border: 3px solid #fff; border-radius: 9px; box-shadow: 0 15px 24px #4f2a6844; transform: rotate(-10deg); }
.download-dragged-asset > img { width: 100%; height: 100%; object-fit: cover; border-radius: 6px; }
.download-dragged-asset > svg { position: absolute; right: -13px; bottom: -20px; transform: rotate(10deg); }
.download-scene-note { position: absolute; bottom: 7%; left: 9%; right: 9%; display: flex; align-items: center; justify-content: space-between; font-size: 2.3cqw; color: #69517e; letter-spacing: -.02em; }
.download-workflow-figure figcaption { max-width: 470px; margin: 16px auto 0; color: #7a6f84; font-size: 11px; line-height: 1.6; text-align: center; }
.download-setup { padding-top: 92px; padding-bottom: 88px; text-align: center; }
.download-setup ol { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 50px; margin: 45px 0 32px; padding: 0; list-style: none; text-align: left; }
.download-step-number { display: block; color: #b5a2c7; font-size: 30px; font-weight: 500; letter-spacing: -.04em; }
.download-setup h3 { margin: 16px 0 10px; font-size: 21px; font-weight: 600; letter-spacing: -.02em; }
.download-setup li p { margin: 0; font-size: 15px; line-height: 1.65; }
.download-setup > .text-link { font-size: 15px; }
.download-faq { display: grid; grid-template-columns: .85fr 1.15fr; gap: 70px; border-top: 1px solid #e9e3ee; padding-top: 65px; padding-bottom: 70px; }
.download-faq details { border-bottom: 1px solid #e9e3ee; }
.download-faq summary { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 21px 0; cursor: pointer; list-style: none; font-size: 16px; font-weight: 500; line-height: 1.5; }
.download-faq details:first-child summary { padding-top: 4px; }
.download-faq summary::-webkit-details-marker { display: none; }
.download-faq summary > svg { flex-shrink: 0; color: #8f7c9e; }
.download-faq details[open] summary > svg,.download-mac-help[open] summary > svg { transform: rotate(180deg); }
.download-faq details p { margin: 0; padding: 0 24px 24px 0; font-size: 15px; line-height: 1.7; }
.download-help { display: flex; justify-content: space-between; align-items: center; gap: 40px; margin-bottom: 70px; padding: 32px 36px; background: #f7f5fa; border-radius: 18px; }
.download-help h2 { margin: 0 0 8px; font-size: 24px; font-weight: 600; letter-spacing: -.025em; }
.download-help p { margin: 0; font-size: 14px; line-height: 1.6; }
.download-help > div:last-child { display: grid; gap: 12px; }
.download-help .text-link { font-size: 14px; }
@media (max-width: 1000px) {
  .download-workflow-grid { gap: 35px; }
  .download-workflow-copy h2 { font-size: 33px; }
  .download-workflow-copy ul { gap: 19px; margin-top: 26px; }
  .download-setup ol { gap: 30px; }
  .download-faq { gap: 40px; }
}
@media (max-width: 760px) {
  .download-hero { padding-top: 38px; }
  .download-app-icon { width: 64px; height: 64px; border-radius: 18px; }
  .download-app-icon img { width: 38px; height: 38px; }
  .download-hero h1 { font-size: clamp(38px,7vw,54px); }
  .desktop-download-page .download-introduction { max-width: 500px; font-size: 17px; }
  .download-primary-cta { font-size: 16px; padding-inline: 24px; }
  .download-divider { margin-top: 28px; }
  .download-workflow { padding: 56px 0; }
  .download-workflow-grid { grid-template-columns: 1fr; gap: 35px; }
  .download-workflow-copy { max-width: 540px; }
  .download-workflow-copy h2 { max-width: 370px; }
  .download-workflow-figure { max-width: 560px; width: 100%; margin-inline: auto; }
  .download-setup { padding-top: 60px; padding-bottom: 56px; }
  .download-setup ol { grid-template-columns: 1fr; gap: 28px; max-width: 500px; margin-inline: auto; }
  .download-setup li { display: grid; grid-template-columns: 44px 1fr; gap: 6px 18px; }
  .download-step-number { grid-row: span 2; font-size: 27px; }
  .download-setup h3 { margin: 2px 0 0; font-size: 20px; }
  .download-faq { grid-template-columns: 1fr; gap: 30px; padding-top: 45px; padding-bottom: 48px; }
  .download-help { align-items: start; flex-direction: column; gap: 24px; padding: 26px; margin-bottom: 48px; }
}
@media (max-width: 600px) {
  .download-options { flex-direction: column; }
  .desktop-download-page .desktop-download-link { padding: 7px 12px; }
  .desktop-download-link + .desktop-download-link { border-left: 0; }
}
@media (prefers-reduced-motion:reduce) { .download-primary-cta { transition: none; } }
