:root { color: #f7f5ff; background: #17112f; font-family: Inter, ui-sans-serif, system-ui, sans-serif; }
* { box-sizing: border-box; }
body { min-width: 320px; margin: 0; background: radial-gradient(circle at 50% -15%, #8f73ef, transparent 34rem), linear-gradient(160deg, #2b1c57, #17112f 65%); }
.page { width: min(100% - 40px, 760px); margin: 0 auto; }
.hero { max-width: 650px; margin: 0 auto; padding: 88px 0 60px; text-align: center; }
.mark { display: grid; width: 92px; height: 92px; margin: 0 auto; place-items: center; border-radius: 29px; color: #25144b; background: linear-gradient(135deg, #e9e1ff, #a894ff); box-shadow: 0 20px 45px rgba(5, 1, 25, .4); font-size: 3rem; font-weight: 800; }
.eyebrow { margin: 28px 0 14px; color: #d2c8ff; font-size: .72rem; font-weight: 800; letter-spacing: .16em; }
h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 18px; font-size: clamp(2.5rem, 7vw, 4.4rem); line-height: 1; letter-spacing: -.055em; }
.intro { max-width: 540px; margin: 0 auto 30px; color: #ddd8f5; font-size: 1.06rem; line-height: 1.65; }
.download-button { display: inline-flex; align-items: center; gap: 10px; padding: 17px 23px; border-radius: 15px; color: #20113e; background: linear-gradient(135deg, #f0eaff, #baa8ff); box-shadow: 0 14px 32px rgba(4, 2, 34, .35); font-weight: 800; text-decoration: none; }
.download-button:hover, .download-button:focus-visible { transform: translateY(-2px); }
.release { min-height: 1.25rem; margin: 16px 0 0; color: #c2bbde; font-size: .8rem; }
.install-note { max-width: 650px; margin: 0 auto 72px; padding: 26px 28px; border: 1px solid rgba(224, 218, 255, .18); border-radius: 22px; background: rgba(255, 255, 255, .08); }
.install-note h2 { margin-bottom: 8px; font-size: 1.1rem; }
.install-note ol { margin: 0; padding-left: 22px; }
.install-note li { color: #d7d2e9; font-size: .92rem; line-height: 1.6; }
.install-note li + li { margin-top: 8px; }
strong { color: #fff; }
footer { padding: 26px; color: #a9a0c8; border-top: 1px solid rgba(216, 212, 255, .12); text-align: center; font-size: .82rem; }
@media (max-width: 680px) { .hero { padding-top: 54px; } }