:root { --ink:#111827; --muted:#6f7787; --line:#e7eaf0; --surface:#fff; --blue:#5069e9; --blue2:#7458e8; --green:#25b978; }
* { box-sizing:border-box; }
html { min-height:100%; background:#f6f8fc; }
body { min-height:100vh; margin:0; color:var(--ink); font-family:Inter,"SF Pro Display","PingFang SC","Microsoft YaHei",system-ui,sans-serif; background:radial-gradient(circle at 15% 20%,#eef1ff 0,transparent 27%),radial-gradient(circle at 88% 76%,#eff9f7 0,transparent 26%),#f8f9fc; overflow-x:hidden; }
.page-glow { position:fixed; border-radius:50%; filter:blur(2px); pointer-events:none; opacity:.6; }
.glow-one { width:360px;height:360px;left:-200px;top:20%;background:#e5e9ff; }
.glow-two { width:280px;height:280px;right:-130px;bottom:5%;background:#e0f7f0; }
.shell { width:min(1120px,calc(100% - 48px)); margin-inline:auto; position:relative; }
.site-header { height:92px; display:flex; align-items:center; justify-content:space-between; }
.brand { display:flex; align-items:center; gap:11px; color:var(--ink); text-decoration:none; font-size:20px; font-weight:750; letter-spacing:-.4px; }
.logo-shell { width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto; }
.logo-shell>.app-logo,.logo-shell>.brand-mark,.qr-logo>.app-logo,.qr-logo>.brand-mark { grid-area:1/1; }
.app-logo { width:34px;height:34px;display:block;object-fit:cover;border-radius:10px;box-shadow:0 7px 16px #303b6440; }
.app-logo[hidden],.brand-mark[hidden] { display:none!important; }
.mini-logo { width:32px;height:32px;border-radius:8px;box-shadow:none; }
.brand-mark { width:34px;height:34px;border-radius:10px;background:linear-gradient(145deg,#566bf0,#7561eb);display:inline-flex;position:relative;box-shadow:0 7px 16px #586ce440;transform:rotate(-6deg); }
.brand-mark i { position:absolute;width:11px;height:17px;border-radius:6px;background:#fff;top:8px;transform:rotate(38deg); }
.brand-mark i:first-child { left:8px; }.brand-mark i:last-child { right:7px;transform:rotate(-38deg);opacity:.82; }
.brand-mark.mini { width:30px;height:30px;border-radius:9px;box-shadow:none; }.brand-mark.mini i { top:7px;width:9px;height:15px; }.brand-mark.mini i:first-child{left:7px}.brand-mark.mini i:last-child{right:6px}
.official-badge { display:flex;gap:8px;align-items:center;color:#657084;background:#ffffffa8;border:1px solid #eaedf2;border-radius:999px;padding:8px 13px;font-size:12px;font-weight:650;box-shadow:0 5px 20px #1e293b08;backdrop-filter:blur(12px); }
.official-badge i,.device-note>span:first-child { width:7px;height:7px;background:var(--green);border-radius:50%;box-shadow:0 0 0 4px #25b97817; }
.hero { min-height:calc(100vh - 188px); display:grid;grid-template-columns:minmax(0,1.12fr) minmax(350px,.76fr);align-items:center;gap:88px;padding-block:42px 60px; }
.intro { padding-bottom:12px; }
.eyebrow { display:flex;align-items:center;gap:10px;color:#5969c7;font-size:12px;letter-spacing:1.7px;text-transform:uppercase;margin-bottom:23px; }
.eyebrow span { width:29px;height:2px;background:linear-gradient(90deg,var(--blue),#8b74f1);border-radius:4px; }
.eyebrow b { font-weight:750; }
h1 { margin:0;font-size:clamp(58px,7vw,92px);line-height:.98;letter-spacing:-5px;font-weight:780;background:linear-gradient(112deg,#111827 22%,#38425a 77%);-webkit-background-clip:text;color:transparent; }
.tagline { font-size:clamp(25px,3vw,38px);line-height:1.25;font-weight:680;letter-spacing:-1.2px;margin:20px 0 18px;color:#252c3a; }
.description { max-width:560px;color:var(--muted);line-height:1.85;font-size:15px;margin:0; }
.feature-row { display:flex;flex-wrap:wrap;gap:22px;margin-top:38px;color:#5b6475; }
.feature-row span { display:flex;align-items:center;gap:7px;font-size:12px; }
.feature-row svg { width:18px;height:18px;fill:none;stroke:#6c7ce7;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.feature-row b { font-weight:620; }
.download-card { width:100%;background:#ffffffd9;border:1px solid #fff;border-radius:28px;box-shadow:0 28px 80px #3d476118,0 3px 12px #3d47610c;padding:20px 30px 24px;text-align:center;backdrop-filter:blur(20px); }
.platform-switch { display:flex;background:#f1f3f7;padding:4px;border-radius:12px;margin-bottom:21px; }
.platform-switch button { flex:1;border:0;background:transparent;border-radius:9px;color:#9298a5;font:650 12px/1 system-ui;padding:10px;display:flex;justify-content:center;align-items:center;gap:7px;cursor:pointer;transition:.2s; }
.platform-switch button svg { width:15px;height:15px;fill:currentColor; }
.platform-switch button.active { background:#fff;color:#28324a;box-shadow:0 4px 13px #24304c12; }
.download-card h2 { margin:0;font-size:17px;letter-spacing:-.2px; }.download-card h2 strong { font-weight:750; }
.scan-hint { margin:7px 0 16px;color:#9aa0ac;font-size:11px; }
.qr-wrap { width:226px;height:226px;margin:0 auto 18px;padding:8px;background:#fff;border:1px solid #edf0f4;border-radius:16px;box-shadow:0 8px 26px #3741510e;position:relative; }
#qr-code { width:100%;height:100%;display:grid;place-items:center;overflow:hidden;border-radius:7px; }
#qr-code img,#qr-code canvas,#qr-code table { width:100%!important;height:100%!important;display:block;border:0;border-radius:7px; }
.qr-logo { position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);display:grid;place-items:center;background:#fff;border:1px solid #eef0f5;border-radius:12px;padding:5px;box-shadow:0 3px 10px #11182726; }
.download-button { min-height:60px;border-radius:14px;background:linear-gradient(135deg,#536cf0,#7658e7);color:#fff;text-decoration:none;display:flex;align-items:center;text-align:left;padding:11px 17px;box-shadow:0 12px 28px #5b65e53d;transition:.2s; }
.download-button:hover { transform:translateY(-2px);box-shadow:0 16px 32px #5b65e54b; }.download-button:active{transform:translateY(0)}
.download-button>svg { width:24px;height:24px;fill:currentColor;margin-right:12px; }.download-button span { display:flex;flex-direction:column;gap:3px;flex:1; }.download-button b{font-size:14px}.download-button small{opacity:.72;font-size:10px}.download-button>i{font-size:18px;font-style:normal;opacity:.88}
.device-note { margin:14px 0 0;display:flex;align-items:center;justify-content:center;gap:8px;color:#9097a4;font-size:10px; }
footer { min-height:96px;border-top:1px solid #e8eaf0;display:flex;align-items:center;justify-content:space-between;color:#9298a5;font-size:10px; }
footer div { display:flex;gap:6px;align-items:center; } footer div i { width:3px;height:3px;background:#c8ccd4;border-radius:50%;margin:0 5px; } footer b { color:#777f8d;font-weight:650; } footer p{margin:0}
.toast { position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;background:#111827;color:white;padding:10px 16px;border-radius:10px;font-size:12px;transition:.25s;pointer-events:none;z-index:10; }.toast.show{opacity:1;transform:translate(-50%,0)}
@media (max-width:820px){.site-header{height:75px}.hero{grid-template-columns:1fr;gap:38px;padding-block:40px 55px;text-align:center}.intro{display:flex;flex-direction:column;align-items:center}.eyebrow{margin-bottom:18px}h1{font-size:clamp(52px,16vw,78px);letter-spacing:-3.5px}.tagline{margin-top:16px}.description{font-size:14px}.feature-row{justify-content:center;margin-top:28px}.download-card{max-width:420px;margin:auto}.shell{width:min(100% - 32px,680px)}footer{flex-direction:column;justify-content:center;gap:8px;text-align:center}}
@media (max-width:480px){.official-badge{padding:7px 10px}.hero{padding-top:28px}.description{line-height:1.7}.feature-row{gap:13px}.download-card{padding:17px 18px 21px;border-radius:23px}.qr-wrap{width:min(218px,67vw);height:min(218px,67vw)}footer{margin-top:20px}.platform-switch.single{display:none}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
