:root { --red:#f63731; --ink:#252328; --muted:#77747a; --cream:#fff8f5; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB",Arial,sans-serif; background:#fff; }
a { color:inherit; }
.topbar { height:76px; display:flex; align-items:center; justify-content:space-between; max-width:1180px; margin:auto; padding:0 24px; }
.brand { display:flex; gap:10px; align-items:center; font-size:18px; font-weight:750; text-decoration:none; }
.brand img { width:36px; height:36px; border-radius:10px; }
nav { display:flex; align-items:center; gap:34px; font-size:14px; color:#55515a; }
nav a { text-decoration:none; }
.nav-download { background:var(--red); color:#fff; border-radius:6px; padding:10px 18px; font-weight:650; }
.hero { min-height:590px; padding:74px max(24px,calc((100% - 1132px)/2)); overflow:hidden; display:grid; grid-template-columns:1fr 480px; align-items:center; background:radial-gradient(circle at 81% 35%,#ffe5d8 0 12%,transparent 31%),linear-gradient(105deg,#fff8f6 0%,#fff 64%); }
.hero-copy { z-index:1; }
.eyebrow { display:flex; align-items:center; gap:8px; color:var(--red); font-size:14px; font-weight:650; margin:0 0 17px; }
.eyebrow span { width:7px; height:7px; border-radius:50%; background:var(--red); box-shadow:0 0 0 5px #ffe1df; }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:58px; line-height:1.16; margin:0 0 19px; letter-spacing:0; }
.hero-text { max-width:420px; color:var(--muted); font-size:16px; line-height:1.9; margin-bottom:27px; }
.hero-actions { display:flex; align-items:center; gap:22px; }
.download-button { display:flex; gap:10px; align-items:center; text-decoration:none; background:var(--red); color:#fff; padding:10px 22px 10px 17px; border-radius:7px; box-shadow:0 9px 18px #f6373130; }
.download-button small { display:block; font-size:10px; opacity:.75; line-height:1; }.download-button span:last-child { font-size:15px; font-weight:700; line-height:1.4; }.android-mark { font-size:25px; transform:rotate(180deg); }
.text-button { border:0; background:transparent; color:#85818a; font-size:13px; cursor:pointer; padding:8px 0; }.version { font-size:12px; color:#aba7ad; margin:15px 0 0; }.version i { height:11px; border-left:1px solid #d0cdd0; margin:0 8px; }
.phone-wrap { height:450px; position:relative; }.phone { width:246px; height:496px; padding:10px; background:#19171b; border:6px solid #2f2c31; border-radius:36px; box-shadow:0 26px 50px #5820153d; transform:rotate(8deg); position:absolute; top:-19px; left:110px; }.speaker { position:absolute; width:67px; height:16px; background:#2f2c31; border-radius:0 0 12px 12px; z-index:2; left:83px; top:-1px; }.phone-screen { height:100%; overflow:hidden; border-radius:23px; background:#fff; padding:28px 10px 45px; position:relative; }.app-head { display:flex; justify-content:space-between; font-size:13px; }.app-head span { font-size:19px; line-height:13px; }.search { background:#f6f5f5; border-radius:12px; color:#aaa; font-size:8px; padding:7px 9px; margin:10px 0; }.banner-card { height:133px; overflow:hidden; border-radius:9px; }.banner-art { height:100%; padding:19px 15px; color:#fff; display:flex; flex-direction:column; justify-content:space-between; }.banner-art b { font-size:19px; line-height:1.25; }.banner-art small { font-size:8px; }.banner-one { background:linear-gradient(120deg,#502d70,#b25d7d 55%,#eebc9d); }.tabs { display:flex; justify-content:space-between; margin:14px 0; font-size:10px; color:#89858b; }.tabs b { color:#f03834; position:relative; }.tabs b:after { content:""; height:2px; background:#f03834; width:13px; left:3px; bottom:-5px; position:absolute; }.phone-title { font-size:12px; font-weight:700; margin-bottom:9px; }.phone-title em { color:#999; float:right; font-style:normal; }.mini-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }.mini-grid .cover { height:95px; border-radius:5px; margin-bottom:4px; }.mini-grid b { display:block; font-size:8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.mini-grid small { color:#aaa; font-size:7px; }.cover-a { background:linear-gradient(145deg,#60515e,#e2abb1); }.cover-b { background:linear-gradient(145deg,#51425a,#d6c1ba); }.cover-c { background:linear-gradient(145deg,#618598,#f2bd93); }.app-nav { position:absolute; bottom:7px; left:0; right:0; display:flex; justify-content:space-around; border-top:1px solid #eee; padding-top:5px; color:#aaa; }.app-nav span { display:flex; flex-direction:column; align-items:center; font-size:13px; }.app-nav small { font-size:7px; }.app-nav .active { color:#f03834; }.float-pill { position:absolute; z-index:2; padding:8px 13px; border-radius:20px; background:#fff; color:#5b565e; box-shadow:0 8px 21px #6d343421; font-size:12px; font-weight:600; }.pill-one { top:79px; left:20px; }.pill-two { bottom:61px; right:0; color:#f03834; }
.section { max-width:1132px; margin:auto; padding:104px 24px; }.section-heading { display:flex; align-items:end; justify-content:space-between; margin-bottom:30px; }.section-heading p { color:var(--red); font-size:13px; margin-bottom:6px; }.section-heading h2 { font-size:30px; margin:0; }.section-heading a { color:#777; text-decoration:none; font-size:13px; }.section-heading a span { color:var(--red); font-size:18px; margin-left:3px; }.show-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }.show-card { min-width:0; }.poster { aspect-ratio:3/4; border-radius:7px; padding:12px; display:flex; flex-direction:column; justify-content:space-between; color:#fff; box-shadow:inset 0 -55px 25px #0005; overflow:hidden; }.poster span { align-self:flex-start; padding:2px 7px; border-radius:3px; background:#ffffffd1; color:#cc3636; font-size:10px; font-weight:700; }.poster b { font-size:23px; line-height:1.28; text-shadow:0 2px 4px #0007; }.poster-1 { background:linear-gradient(150deg,#876d6b,#f3c1b3 44%,#3d3638); }.poster-2 { background:linear-gradient(145deg,#242d51,#8f839d 48%,#291f23); }.poster-3 { background:linear-gradient(145deg,#e0af87,#a66867 55%,#3e3b45); }.poster-4 { background:linear-gradient(145deg,#4b6d69,#b4a285 50%,#263343); }.show-card h3 { font-size:15px; margin:12px 0 3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.show-card p { font-size:12px; color:#959197; margin:0; }.features { background:var(--cream); max-width:none; padding-left:max(24px,calc((100% - 1132px)/2)); padding-right:max(24px,calc((100% - 1132px)/2)); }.centered { display:block; text-align:center; }.feature-list { display:grid; grid-template-columns:repeat(3,1fr); gap:64px; max-width:810px; margin:40px auto 0; text-align:center; }.feature-icon { width:55px; height:55px; border-radius:8px; display:grid; place-items:center; margin:0 auto 16px; font-size:22px; font-weight:700; }.coral{background:#ffe5e1;color:#ed594b}.yellow{background:#fff0d5;color:#e99c25}.blue{background:#dff0fd;color:#4f9bda}.feature-list h3{font-size:17px;margin:0 0 7px}.feature-list p{font-size:13px;color:#858188;margin:0;line-height:1.7}.cta-section{background:#f63832;color:#fff;padding:47px max(24px,calc((100% - 1132px)/2));display:flex;align-items:center;justify-content:space-between}.cta-section p{font-size:13px;opacity:.8;margin-bottom:4px}.cta-section h2{font-size:26px;margin:0}.cta-section a{background:#fff;color:#e93630;padding:13px 20px;border-radius:6px;text-decoration:none;font-size:14px;font-weight:700}.cta-section a span{font-size:19px;margin-left:12px}footer{background:#29262a;color:#a8a5a9;text-align:center;padding:40px 20px;font-size:12px}.footer-brand{display:flex;align-items:center;justify-content:center;gap:8px;color:#fff;margin-bottom:13px;font-size:15px}.footer-brand img{width:26px;height:26px;border-radius:7px}footer p{margin:5px}.legal{margin-top:18px;color:#777278}.legal a{color:inherit;text-decoration:none;margin:0 4px}dialog{border:0;border-radius:12px;padding:32px;max-width:340px;text-align:center;box-shadow:0 20px 70px #0004}dialog::backdrop{background:#0008}dialog img{width:58px;border-radius:16px}dialog h2{font-size:20px;margin:14px 0 8px}dialog p{color:#777;line-height:1.7;font-size:14px;margin-bottom:20px}dialog a{display:block;background:var(--red);padding:11px;border-radius:6px;color:#fff;text-decoration:none;font-size:14px}.close-dialog{position:absolute;top:8px;right:10px;border:0;background:transparent;color:#999;font-size:24px;cursor:pointer}
@media (max-width:760px){.topbar{height:64px;padding:0 18px}.brand{font-size:16px}.brand img{width:32px;height:32px}nav a:not(.nav-download){display:none}nav{gap:0}.nav-download{padding:8px 12px}.hero{padding:48px 24px 0;display:block;min-height:auto;text-align:center;background:radial-gradient(circle at 80% 8%,#ffe5d8 0 8%,transparent 29%),#fff9f7}.eyebrow{justify-content:center}h1{font-size:48px}.hero-text{margin-left:auto;margin-right:auto;font-size:14px}.hero-actions{justify-content:center;gap:16px}.phone-wrap{height:431px;margin-top:26px}.phone{left:50%;margin-left:-123px;transform:rotate(0);top:0}.pill-one{left:9%;top:55px}.pill-two{right:9%;bottom:58px}.section{padding:64px 18px}.section-heading{display:block;margin-bottom:24px}.section-heading h2{font-size:24px}.section-heading a{display:block;margin-top:12px}.show-grid{grid-template-columns:repeat(2,1fr);gap:24px 13px}.poster b{font-size:20px}.features{padding:64px 24px}.feature-list{gap:28px;margin-top:30px}.feature-list p{font-size:12px}.cta-section{padding:34px 24px;display:block;text-align:center}.cta-section h2{font-size:22px;margin-bottom:22px}.cta-section a{display:inline-block}.footer-brand{margin-top:2px}}
.legal-page { background:#fff8f5; }
.legal-header { height:76px; max-width:1000px; margin:auto; padding:0 24px; display:flex; justify-content:space-between; align-items:center; }
.back-home { color:#625e65; font-size:14px; text-decoration:none; }
.back-home:hover, .legal-document a { color:var(--red); }
.legal-document { max-width:900px; margin:0 auto 72px; padding:58px 74px 66px; background:#fff; border-radius:8px; box-shadow:0 10px 36px #612e220d; }
.legal-document h1 { font-size:34px; margin:0 0 8px; }
.document-kicker { margin:0 0 12px; color:var(--red); font-size:14px; font-weight:700; }
.document-date { margin:0 0 36px; color:#8c888e; font-size:13px; }
.legal-document h2 { margin:38px 0 13px; font-size:19px; color:#302c31; }
.legal-document h3 { margin:0 0 10px; font-size:16px; color:#302c31; }
.legal-document p { margin:0 0 14px; color:#625e65; font-size:15px; line-height:1.9; }
.legal-document strong { color:#363137; }
.sdk-item { margin:16px 0; padding:20px 22px; border-left:3px solid var(--red); background:#fff8f5; }
.sdk-item p { margin-bottom:7px; }
@media (max-width:760px){.legal-header{height:64px;padding:0 18px}.legal-document{margin:0; padding:38px 24px 48px; border-radius:0; box-shadow:none}.legal-document h1{font-size:28px}.legal-document h2{font-size:18px;margin-top:31px}.legal-document p{font-size:14px;line-height:1.85}.document-date{line-height:1.8;margin-bottom:28px}.sdk-item{margin:14px 0;padding:17px 16px}}
.download-button { transition:transform .2s,box-shadow .2s; }
.download-button:hover { transform:translateY(-2px); box-shadow:0 12px 24px #f6373142; }
.ios-button { border-bottom:1px solid #d8d4d7; }
.platform-status { display:block; margin-top:9px; font-size:12px; opacity:.82; }
.cta-section a { transition:transform .2s; }
.cta-section a:hover { transform:translateY(-2px); }