:root { color-scheme: light; --ink:#171738; --muted:#5f6078; --brand:#29266f; --brand-soft:#eeedff; --accent:#159f9b; --surface:#fff; --line:#dfdfea; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:#f8f8fc; line-height:1.65; }
a { color:var(--brand); }
.topbar { background:var(--brand); color:#fff; }
.nav { max-width:960px; margin:auto; padding:18px 24px; display:flex; gap:24px; align-items:center; }
.nav strong { margin-right:auto; font-size:1.15rem; }
.nav a { color:#fff; text-decoration:none; }
main { max-width:820px; margin:40px auto; padding:0 24px 56px; }
.hero, article { background:var(--surface); border:1px solid var(--line); border-radius:20px; padding:clamp(24px,5vw,48px); box-shadow:0 18px 55px rgba(34,31,94,.08); }
.app-icon { width:96px; height:96px; border-radius:24px; box-shadow:0 12px 30px rgba(34,31,94,.22); }
h1 { margin-top:0; font-size:clamp(2rem,6vw,3.4rem); line-height:1.08; }
h2 { margin-top:2rem; line-height:1.25; }
.lead { color:var(--muted); font-size:1.15rem; }
.badge { display:inline-block; padding:5px 11px; border-radius:999px; background:var(--brand-soft); color:var(--brand); font-weight:700; }
.button { display:inline-block; margin-top:16px; padding:12px 18px; border-radius:12px; color:#fff; background:var(--brand); text-decoration:none; font-weight:700; }
.notice { border-left:4px solid var(--accent); padding:12px 16px; background:#edfafa; }
footer { max-width:820px; margin:auto; padding:24px; color:var(--muted); text-align:center; }
@media (max-width:620px) { .nav { flex-wrap:wrap; } .nav strong { width:100%; } }