/* 同伴官网首页样式（2026-10-12 改版：日出渐变 + 信号烟花）。
   · 初始隐藏态（逐字弹出 / 淡入）全部挂在 .js 下——<head> 里一行脚本才会加这个类，所以没有 JS / 爬虫不执行脚本时，全部文字直接可见
   · 文末的「下载提示 / 安卓商店弹窗」样式原样取自旧版官网样式表（已删除），逻辑在 download.js（没动）
   · 颜色：渐变取自 logo 里蓝与橙两个圆叠出的颜色；信号分类色与 App SignalCategoryStyle 一致 */
:root{--ink:#16161a;--bg:#0b0b0d;--g1:#2f6bff;--g2:#7a5cff;--g3:#ff6fa0;--g4:#ff9a4d;--gut:clamp(0px,19vw,300px)}
@media(max-width:899px){:root{--gut:0px}}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{background:var(--bg);scroll-behavior:smooth}
body{background:var(--bg);color:#fff;font-weight:700;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC","Helvetica Neue","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}img{display:block}
.mb{display:none}.ph{display:inline-block;font-style:normal}
html[lang=en] .cn-only,html[lang=en] .hm{display:none!important}
/* 安卓按钮图标：中文版 = 安卓机器人（单色 currentColor），英文版 = Google Play 官方四色 logo（颜色写在 SVG 里） */
.pill .ic-gp{display:none}html[lang=en] .pill .ic-and{display:none}html[lang=en] .pill .ic-gp{display:block}

/* ═══ 首屏：渐变色面（缓慢流动）═══ */
.hero{position:relative;margin:12px 16px 0;border-radius:44px 44px 0 0;min-height:min(calc(100svh - 12px),920px);padding:0 28px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden;background:linear-gradient(176deg,var(--g1) 0%,var(--g2) 36%,var(--g3) 70%,var(--g4) 100%)}
.hero::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-120px;height:180px;border-radius:50%;background:var(--bg);z-index:4}
.bl{position:absolute;border-radius:50%;pointer-events:none;mix-blend-mode:screen;will-change:transform}
.bl.a{width:60vmax;height:60vmax;left:-18vmax;top:-26vmax;background:radial-gradient(circle,rgba(120,190,255,.55),rgba(120,190,255,0) 62%);animation:bd1 17s ease-in-out infinite alternate}
.bl.b{width:56vmax;height:56vmax;right:-16vmax;bottom:-22vmax;background:radial-gradient(circle,rgba(255,170,110,.55),rgba(255,170,110,0) 62%);animation:bd2 21s ease-in-out infinite alternate}
.bl.c{width:44vmax;height:44vmax;right:8vmax;top:-18vmax;background:radial-gradient(circle,rgba(255,120,190,.45),rgba(255,120,190,0) 62%);animation:bd3 19s ease-in-out infinite alternate}
@keyframes bd1{to{transform:translate(18vw,14vh) scale(1.14)}}@keyframes bd2{to{transform:translate(-20vw,-12vh) scale(1.12)}}@keyframes bd3{to{transform:translate(-16vw,20vh) scale(.9)}}

.nav{position:absolute;top:0;left:0;right:0;height:96px;display:flex;align-items:center;justify-content:space-between;padding:0 32px;z-index:8}
.logo{display:flex;align-items:center;gap:12px;font-size:27px;font-weight:900;letter-spacing:.04em}
.logo img{width:42px;height:42px;border-radius:12px}
.lang{display:inline-flex;align-items:center;padding:4px;border-radius:99px;background:#0b0b0d}
.lang button{min-width:48px;height:38px;padding:0 14px;border-radius:99px;font-size:15px;font-weight:800;letter-spacing:.04em;color:rgba(255,255,255,.7);transition:background .25s,color .25s}
.lang button.on{background:#fff;color:#0b0b0d}

h1{position:relative;z-index:5;font-size:clamp(54px,min(9.8vw,17vh),178px);font-weight:900;letter-spacing:-.045em;line-height:1.04;white-space:nowrap;text-shadow:0 6px 40px rgba(60,20,120,.25)}
html[lang=en] h1{font-size:clamp(46px,min(7.6vw,15.4vh),156px);letter-spacing:-.035em}   /* 最长一行「frequencies meet」≈7.85em，7.6vw 时两边正好留出演示卡片的宽度 */
h1 .ln1,h1 .ln2{display:inline-block;animation:rise .9s cubic-bezier(.2,.9,.25,1) both}h1 .ln2{animation-delay:.14s}
@keyframes rise{from{opacity:0;transform:translateY(.42em);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
.sub{position:relative;z-index:5;margin-top:clamp(14px,2.4vh,26px);font-size:clamp(17px,1.9vw,27px);font-weight:600;letter-spacing:.06em;opacity:.95;animation:rise .9s .32s cubic-bezier(.2,.9,.25,1) both}
.cta{position:relative;z-index:6;margin-top:clamp(26px,4.6vh,48px);display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:wrap;animation:rise .9s .46s cubic-bezier(.2,.9,.25,1) both}
/* 下载按钮：商店徽章式的深色圆角矩形（两行字：小字「下载」+ 大字平台名），三个等权；深色与顶部「中/EN」、页面下半部的深色底呼应 */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:12px;height:clamp(62px,8.6vh,76px);padding:0 30px 0 24px;border-radius:20px;color:#fff;background:#0b0b0d;box-shadow:0 14px 34px rgba(30,10,80,.3),inset 0 0 0 1px rgba(255,255,255,.14);text-align:left;white-space:nowrap;transition:transform .2s,box-shadow .2s}
.pill:hover{transform:translateY(-3px);box-shadow:0 20px 40px rgba(30,10,80,.36),inset 0 0 0 1px rgba(255,255,255,.22)}
.pill svg{width:31px;height:31px;flex:none}.pill .ic-and{color:#3ddc84}
.pill .tx{display:flex;flex-direction:column;gap:3px;line-height:1}
.pill small{font-size:13px;font-weight:600;letter-spacing:.05em;opacity:.7}
.pill b{font-size:clamp(20px,1.8vw,25px);font-weight:800;letter-spacing:.01em}
.scroll{position:absolute;left:0;right:0;bottom:22px;z-index:6;display:flex;align-items:center;justify-content:center;gap:10px;font-size:19px;font-weight:800}
.scroll svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;animation:bob 1.6s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(4px)}}

.em{position:absolute;z-index:3;font-size:clamp(70px,9vw,140px);line-height:1;filter:drop-shadow(0 12px 22px rgba(40,10,90,.28));animation:fl 6s ease-in-out infinite;user-select:none}
.em.e1{left:8%;top:14%;--r:-14deg}.em.e2{right:13%;top:13%;--r:12deg;animation-delay:-2s}.em.e3{left:9%;bottom:13%;--r:-8deg;animation-delay:-4s}.em.e4{right:9%;bottom:11%;--r:10deg;animation-delay:-1s}
@keyframes fl{0%,100%{transform:translateY(0) rotate(var(--r,0deg))}50%{transform:translateY(-14px) rotate(calc(var(--r,0deg) + 4deg))}}

/* 演示卡片：信号 → 等待 → 回复，循环换下一组 */
.sc{--c:94,166,217;--r:-7deg;position:absolute;z-index:6;width:clamp(170px,15.2vw,236px);padding:16px 18px 14px;border-radius:26px;background:#fff;color:var(--ink);text-align:left;box-shadow:0 20px 56px rgba(30,10,80,.28);transform:rotate(var(--r));transition:opacity .45s ease,transform .6s cubic-bezier(.2,.9,.25,1)}
.sc small{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:800;color:rgb(var(--c))}
.sc small svg{width:15px;height:15px;fill:rgb(var(--c));flex:none}
.sc p{margin-top:8px;min-height:2.9em;font-size:clamp(15px,1.4vw,21px);line-height:1.45;font-weight:800}
.sc .tg{display:block;margin-top:3px;text-align:right;line-height:1.2;font-size:11px;font-weight:600;color:#a0a0ab}
.sc .cr{display:inline-block;width:2px;height:1em;margin-left:2px;vertical-align:-.14em;background:rgb(var(--c));animation:cr 1s steps(2) infinite}
@keyframes cr{50%{opacity:0}}
.sc.pre{opacity:0;transform:translateY(26px) rotate(calc(var(--r) - 5deg)) scale(.9);transition:none}
.sc.out{opacity:0;transform:translateY(-20px) rotate(var(--r)) scale(.94)}
.sc.l{left:2.4%;top:33%;--r:-7deg}
.rslot{position:absolute;z-index:6;right:2.4%;top:50%;width:clamp(170px,15.2vw,236px);height:130px}
.rslot .sc.r{right:0;top:0;width:100%;--r:6deg;background:#16131f;color:#fff;box-shadow:0 20px 56px rgba(30,10,80,.34)}
.rslot .sc.r small{color:rgb(var(--c))}.rslot .sc.r .tg{color:rgba(255,255,255,.4)}
.rslot .sc.r{opacity:0;transform:translateY(20px) rotate(calc(var(--r) + 4deg)) scale(.8);transition:opacity .45s ease,transform .6s cubic-bezier(.3,1.5,.5,1)}
.rslot.show .sc.r{opacity:1;transform:rotate(var(--r))}
.rslot.gone .sc.r{opacity:0;transform:translateY(-18px) rotate(var(--r)) scale(.94);transition:opacity .4s ease,transform .5s ease}
.wt{position:absolute;right:10px;top:16px;display:inline-flex;align-items:center;gap:9px;padding:10px 18px;border-radius:99px;background:rgba(14,10,36,.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-size:14.5px;font-weight:700;opacity:0;transform:scale(.7);transition:opacity .35s ease,transform .45s cubic-bezier(.3,1.5,.5,1);white-space:nowrap}
.wt svg{width:15px;height:15px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round}
.wt .dts{display:inline-flex;gap:3px}.wt .dts i{width:5px;height:5px;border-radius:50%;background:#fff;animation:dt 1.2s ease-in-out infinite}.wt .dts i:nth-child(2){animation-delay:.15s}.wt .dts i:nth-child(3){animation-delay:.3s}
@keyframes dt{0%,60%,100%{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-3px)}}
.rslot.wait .wt{opacity:1;transform:none}

/* ═══ 关键词：6 个大字，每个逐字弹出 + emoji 弹跳 + 各自一段小循环动画 ═══ */
.kws{padding:clamp(80px,12vw,190px) calc(var(--gut) + clamp(16px,2vw,32px)) clamp(80px,10vw,150px)}
.kr{max-width:980px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.8fr);align-items:center;gap:clamp(28px,5vw,84px);padding:clamp(48px,8vw,128px) 0;border-bottom:1px solid rgba(255,255,255,.1)}
.kr:first-child{border-top:1px solid rgba(255,255,255,.1)}
.kr .w{display:flex;align-items:center;gap:clamp(14px,2vw,30px);font-size:clamp(60px,10.2vw,172px);font-weight:900;letter-spacing:-.01em;line-height:1;transition:color .3s}
html[lang=en] .kr{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr)}
html[lang=en] .kr .w{font-size:clamp(46px,5.6vw,96px);letter-spacing:-.025em}
.kr .w .t{display:inline-flex;font:inherit;letter-spacing:inherit;margin:0}
.ltr{display:inline-block;transition:opacity .7s ease,transform .8s cubic-bezier(.2,.9,.25,1),filter .7s ease;transition-delay:calc(var(--i)*90ms)}
.js .ltr{opacity:0;transform:translateY(.55em) rotate(6deg);filter:blur(12px)}
.js .kr.in .ltr{opacity:1;transform:none;filter:none}
.kr .w .e{display:inline-block;font-style:normal;font-size:.5em;transform:rotate(var(--er,-8deg));transition:opacity .4s ease .4s,transform .9s cubic-bezier(.3,1.7,.5,1) .4s;filter:drop-shadow(0 8px 16px rgba(0,0,0,.4))}
.js .kr .w .e{opacity:0;transform:scale(.2) rotate(-40deg)}
.js .kr.in .w .e{opacity:1;transform:rotate(var(--er,-8deg));animation:efl 5.4s ease-in-out 1.4s infinite}
@keyframes efl{0%,100%{transform:translateY(0) rotate(var(--er,-8deg))}50%{transform:translateY(-8px) rotate(calc(var(--er,-8deg) + 5deg))}}
.kr:hover .w .t{background:linear-gradient(90deg,#7aa2ff,#ff9a4d);-webkit-background-clip:text;background-clip:text;color:transparent}
.kr:hover .w .ltr{color:transparent}
.kr .tx p{max-width:14em;font-size:clamp(19px,2vw,31px);line-height:1.7;font-weight:700;color:rgba(255,255,255,.78);transition:opacity .8s ease .5s,transform .8s ease .5s}
.js .kr .tx p{opacity:0;transform:translateY(16px)}
.js .kr.in .tx p{opacity:1;transform:none}
.mini{position:relative;margin-top:clamp(22px,2.8vw,40px);height:48px;width:min(100%,380px);transition:opacity .8s ease .85s}
.js .mini{opacity:0}
.js .kr.in .mini{opacity:1}
/* 极简：一个点送信号，对方亮一下，再回一个 */
.m1 .lk{position:absolute;left:8px;right:8px;top:50%;height:2px;background:rgba(255,255,255,.18)}
.m1 .a,.m1 .b{position:absolute;top:50%;width:16px;height:16px;margin-top:-8px;border-radius:50%}
.m1 .a{left:0;background:#7fb2ff;box-shadow:0 0 14px rgba(127,178,255,.7)}.m1 .b{right:0;background:#ffb27a;box-shadow:0 0 14px rgba(255,178,122,.7)}
.m1 .p{position:absolute;top:50%;left:0;width:10px;height:10px;margin:-5px 0 0 3px;border-radius:50%;background:#fff;box-shadow:0 0 14px 4px rgba(255,255,255,.7);animation:m1p 4.6s ease-in-out infinite}
@keyframes m1p{0%{left:0;opacity:0;background:#fff}6%{opacity:1}44%{left:calc(100% - 13px);opacity:1}48%{left:calc(100% - 13px);opacity:0}52%{left:calc(100% - 13px);opacity:0;background:#ffb27a}56%{opacity:1}94%{left:0;opacity:1}98%,100%{left:0;opacity:0}}
.m1 .rg{position:absolute;right:0;top:50%;width:16px;height:16px;margin-top:-8px;border-radius:50%;border:2px solid #ffb27a;opacity:0;animation:m1r 4.6s ease-out infinite}
@keyframes m1r{0%,44%{opacity:0;transform:scale(1)}47%{opacity:.9}72%{opacity:0;transform:scale(3.6)}100%{opacity:0}}
/* 轻量：「没有」的东西被划掉，飘走 */
.m2{display:flex;flex-wrap:wrap;gap:10px;align-items:center}   /* 英文标签更宽，手机上必须能换行，否则会把整页布局视口撑宽 */
.m2 span{position:relative;padding:7px 15px;border:1.5px solid rgba(255,255,255,.65);border-radius:99px;font-size:15px;font-weight:700;white-space:nowrap;animation:m2c 6.4s ease-in-out infinite;animation-delay:calc(var(--i)*.8s)}
html[lang=en] .m2 span{padding:7px 12px;font-size:14px}   /* 英文词更宽，收紧一点让三个标签在桌面右栏里一行放下 */
.m2 span::after{content:"";position:absolute;left:-3%;top:50%;height:2.5px;width:0;margin-top:-1px;border-radius:2px;background:#7fd0ff;animation:m2s 6.4s ease-in-out infinite;animation-delay:calc(var(--i)*.8s)}
@keyframes m2s{0%,12%{width:0}28%,100%{width:106%}}
@keyframes m2c{0%{opacity:0;transform:translateY(10px)}7%,24%{opacity:1;transform:none}34%,70%{opacity:.45;transform:none}88%{opacity:0;transform:translateY(-26px)}100%{opacity:0;transform:translateY(-26px)}}
/* 安心：两个靠近的东西，被屏障挡在外面 */
.m3 .rg{position:absolute;left:50%;top:50%;width:46px;height:46px;margin:-23px;border-radius:50%;border:1.5px solid rgba(255,255,255,.5);animation:m3r 3.8s ease infinite}
@keyframes m3r{0%,52%{border-color:rgba(255,255,255,.5);box-shadow:none}60%{border-color:#9fe0ff;box-shadow:0 0 22px rgba(159,224,255,.8)}80%,100%{border-color:rgba(255,255,255,.5);box-shadow:none}}
.m3 .me{position:absolute;left:50%;top:50%;width:12px;height:12px;margin:-6px;border-radius:50%;background:#9fe0ff;box-shadow:0 0 14px #9fe0ff}
.m3 .pb{position:absolute;top:50%;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:#fff}
.m3 .pb.l{left:0;animation:m3l 3.8s ease-in infinite}.m3 .pb.r{right:0;animation:m3rr 3.8s ease-in infinite}
@keyframes m3l{0%{left:0;opacity:0}10%{opacity:1}56%{left:calc(50% - 38px);opacity:1}62%,100%{left:calc(50% - 46px);opacity:0}}
@keyframes m3rr{0%{right:0;opacity:0}10%{opacity:1}56%{right:calc(50% - 38px);opacity:1}62%,100%{right:calc(50% - 46px);opacity:0}}
/* 开口：声波 */
.m4{display:flex;align-items:center;gap:5px}
.m4 i{display:block;width:5px;height:100%;border-radius:99px;background:linear-gradient(#9fe0ff,#ffd485);transform:scaleY(.2);animation:m4b 1.3s ease-in-out infinite;animation-delay:calc(var(--i)*-.09s)}
.m4 i:nth-child(3n){--h:.5}.m4 i:nth-child(3n+1){--h:1}.m4 i:nth-child(3n+2){--h:.74}
@keyframes m4b{0%,100%{transform:scaleY(.18)}50%{transform:scaleY(var(--h,1))}}
/* 隐身：头像淡成虚线圈，波纹停下，再回来 */
.m5 .bx{position:absolute;left:0;top:50%;width:38px;height:38px;margin-top:-19px}
.m5 .av{position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,#7fb2ff,#ffb27a);animation:m5a 5.4s ease-in-out infinite}
.m5 .gh{position:absolute;inset:0;border-radius:50%;border:2px dashed #fff;opacity:0;animation:m5g 5.4s ease-in-out infinite}
.m5 .rp{position:absolute;inset:0;border-radius:50%;border:1.5px solid #9fe0ff;opacity:0;animation:m5r 5.4s ease-out infinite}.m5 .rp.b{animation-delay:.7s}
@keyframes m5a{0%,30%{opacity:1;filter:none;transform:scale(1)}42%,68%{opacity:.14;filter:blur(2px);transform:scale(.9)}80%,100%{opacity:1;filter:none;transform:scale(1)}}
@keyframes m5g{0%,34%{opacity:0}44%,66%{opacity:.9}76%,100%{opacity:0}}
@keyframes m5r{0%{opacity:.7;transform:scale(1)}26%{opacity:0;transform:scale(3)}100%{opacity:0;transform:scale(3)}}
/* 新鲜：7 格慢慢走满，卡片褪色 */
.m6{display:flex;align-items:center;gap:14px}
.m6 .cd{flex:none;width:54px;height:34px;border:1.5px solid #fff;border-radius:9px;animation:m6c 9s linear infinite}
@keyframes m6c{0%{opacity:1;filter:none}84%{opacity:.28;filter:blur(1px)}94%,99%{opacity:0}100%{opacity:1;filter:none}}
.m6 .tk{display:flex;gap:6px;flex:1}
.m6 .tk i{position:relative;flex:1;height:8px;border-radius:2px;background:rgba(255,255,255,.16);overflow:hidden}
.m6 .tk i::after{content:"";position:absolute;inset:0;background:#fff;transform-origin:left;transform:scaleX(0);animation:m6f 9s linear infinite;animation-delay:calc(var(--i)*.8s - 1s)}
@keyframes m6f{0%{transform:scaleX(0)}8%{transform:scaleX(1)}80%{transform:scaleX(1)}92%,100%{transform:scaleX(0)}}

/* ═══ 信号烟花（复用旧官网星球第三屏的效果）：关键词区进入视野才放，只在左右两道夜空里 ═══ */
#sky{position:fixed;inset:0;z-index:30;pointer-events:none;opacity:0;transition:opacity .6s ease}#sky.on{opacity:1}
#sky canvas{position:absolute;left:0;top:0;width:100%;height:100%}
#sigs{position:absolute;inset:0;overflow:hidden}
.sig{--c:94,166,217;position:absolute;left:0;top:0;width:230px;padding:17px 19px 15px;border-radius:22px;background:rgba(8,14,30,.72);border:1px solid rgba(var(--c),.45);box-shadow:0 16px 44px rgba(0,0,0,.5),0 0 28px rgba(var(--c),.22);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);opacity:0;text-align:left;transition:transform .75s cubic-bezier(.2,.9,.25,1),opacity .5s}
.sig::before{content:"";position:absolute;inset:0;border-radius:inherit;background:rgba(var(--c),.09);pointer-events:none}
.sig .t{position:relative;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;letter-spacing:.08em;color:rgb(var(--c))}
.sig .t svg{width:17px;height:17px;flex:none;fill:rgba(var(--c),.95)}
.sig p{position:relative;margin-top:10px;font-size:17px;line-height:1.5;font-weight:600;color:rgba(255,255,255,.92)}
.sig .m{position:relative;display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-size:11.5px;font-weight:500;color:rgba(255,255,255,.36)}
.sig .m i{width:7px;height:7px;border-radius:50%;background:rgb(var(--c));box-shadow:0 0 7px rgba(var(--c),.9)}
@media(max-width:899px){#sky{display:none}}
footer{max-width:1440px;margin:0 auto;padding:clamp(24px,3vw,48px) clamp(28px,6vw,96px) 52px;font-size:14px;line-height:2;font-weight:500;color:rgba(255,255,255,.55)}
footer .about{max-width:44em;margin-bottom:26px;line-height:1.9;color:rgba(255,255,255,.5)}
footer .fr{display:flex;justify-content:space-between;align-items:flex-start;gap:30px;flex-wrap:wrap;padding-top:22px;border-top:1px solid rgba(255,255,255,.1)}
footer nav{display:flex;gap:26px;flex-wrap:wrap}footer nav a{color:rgba(255,255,255,.85);font-weight:600}footer nav a:hover{color:#fff}
footer .cp a{color:inherit;text-decoration:underline;text-underline-offset:3px}


@media(max-width:1000px){
  .em.e1{left:6%;top:15%}.em.e2{right:6%;top:13%}
  .kr,html[lang=en] .kr{grid-template-columns:1fr;gap:16px;padding:clamp(44px,12vw,80px) 0}   /* html[lang=en] .kr 特异性更高，不一起写会让英文在手机上仍是左右两栏 */
  html[lang=en] .kr .w{font-size:clamp(50px,13vw,96px)}
  html[lang=en] h1{font-size:clamp(40px,5.6vw,76px)}   /* 卡片还在两侧，标题不能再宽 */
}
@media(max-width:760px){
  .hero{margin:10px 10px 0;border-radius:32px 32px 0 0;padding:0 18px}
  .nav{height:76px;padding:0 20px}.logo{font-size:22px}.logo img{width:36px;height:36px}.lang button{min-width:42px;height:34px;padding:0 11px;font-size:14px}
  h1{font-size:clamp(46px,14vw,84px)}html[lang=en] h1{font-size:clamp(32px,10.8vw,76px)}
  .cta{width:100%;flex-wrap:nowrap;gap:10px}
  .pill{flex:1 1 0;flex-direction:column;height:86px;border-radius:22px;gap:8px;padding:0 4px}
  .pill svg{width:26px;height:26px}.pill small{display:none}.pill .tx{align-items:center}.pill b{font-size:15px}
  .em{display:none}   /* 手机上标题已上移、卡片占了下半屏，emoji 全部让位 */
  .hero{justify-content:flex-start;padding-top:clamp(112px,17.5vh,156px)}
  .sc{width:min(54vw,214px);padding:12px 14px 11px;border-radius:20px}.sc p{font-size:14.5px;min-height:2.6em}.sc small{font-size:12px}
  .sc.l{left:5%;top:auto;bottom:21%}
  .rslot{right:5%;top:auto;bottom:8.5%;width:min(54vw,214px);height:116px}
  .scroll{bottom:14px;font-size:16px}
  footer{padding:28px 28px 44px}footer .fr{flex-direction:column;gap:14px}
}
@media(prefers-reduced-motion:reduce){.bl,.em,.scroll svg,.kr .mini *,.kr.in .w .e,.sc .cr,.wt .dts i,h1 .ln1,h1 .ln2,.sub,.cta{animation:none!important}.js .ltr,.js .kr .w .e,.js .kr .tx p,.js .mini{opacity:1;transform:none;filter:none;transition:none}}

/* 下载提示（鸿蒙「即将上线」等） */
.dl-toast{position:fixed;left:50%;bottom:max(90px,calc(env(safe-area-inset-bottom) + 80px));transform:translate(-50%,12px);z-index:320;padding:11px 20px;border-radius:99px;font-size:14px;letter-spacing:.04em;color:#fff;background:rgba(10,14,24,.92);border:1px solid rgba(94,166,217,.35);box-shadow:0 12px 36px rgba(0,0,0,.5);opacity:0;transition:opacity .25s,transform .25s;pointer-events:none;white-space:nowrap}
.dl-toast.on{opacity:1;transform:translate(-50%,0)}

/* ── ANDROID STORE MODAL ── 点击"安卓下载"弹出的应用商店选择弹窗 ── */
    .store-modal-overlay {
      position: fixed;
      inset: 0;
      z-index: 300;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(0, 0, 0, .55);
      backdrop-filter: blur(6px);
      -webkit-backdrop-filter: blur(6px);
      animation: storeModalFadeIn .18s ease;
      padding: 20px;
    }

    @keyframes storeModalFadeIn {
      from { opacity: 0; }
      to { opacity: 1; }
    }

    .store-modal {
      width: 100%;
      max-width: 360px;
      max-height: 80vh;
      overflow-y: auto;
      background: rgba(10, 14, 24, .92);
      border: 1px solid rgba(94, 166, 217, .22);
      border-radius: 20px;
      box-shadow: 0 24px 64px rgba(0, 0, 0, .5), 0 0 32px rgba(94, 166, 217, .08);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
      font-weight: 400;
      animation: storeModalRise .22s cubic-bezier(.2, .8, .2, 1);
    }

    @keyframes storeModalRise {
      from { opacity: 0; transform: translateY(10px) scale(.98); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }

    .store-modal-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 20px 20px 14px;
      border-bottom: 1px solid rgba(255, 255, 255, .08);
    }

    .store-modal-title {
      font-size: 16px;
      font-weight: 600;
      color: rgba(255, 255, 255, .92);
      letter-spacing: .01em;
    }

    .store-modal-close {
      appearance: none;
      border: none;
      background: rgba(255, 255, 255, .06);
      color: rgba(255, 255, 255, .6);
      width: 28px;
      height: 28px;
      border-radius: 50%;
      font-size: 17px;
      line-height: 1;
      cursor: pointer;
      transition: background .15s, color .15s;
    }

    .store-modal-close:hover {
      background: rgba(255, 255, 255, .14);
      color: #fff;
    }

    .store-modal-list {
      display: flex;
      flex-direction: column;
      padding: 10px;
      gap: 4px;
    }

    .store-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      width: 100%;
      appearance: none;
      border: none;
      background: transparent;
      border-radius: 12px;
      padding: 12px 12px;
      cursor: pointer;
      text-align: left;
      transition: background .15s;
      font-family: inherit;
    }

    .store-row:hover:not(:disabled) {
      background: rgba(94, 166, 217, .1);
    }

    .store-row--disabled {
      cursor: default;
      opacity: .5;
    }

    .store-row-icon {
      flex-shrink: 0;
      width: 34px;
      height: 34px;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 9.5px;
      font-weight: 700;
      letter-spacing: .01em;
      color: #fff;
      text-transform: uppercase;
    }

    .store-row-icon--logo {
      background: #fff;
      padding: 6px;
      box-sizing: border-box;
    }

    .store-row-icon--logo svg {
      width: 100%;
      height: 100%;
      display: block;
    }

    .store-row-icon--bare {
      background: transparent;
    }

    .store-row-icon--bare svg {
      width: 100%;
      height: 100%;
      display: block;
    }

    .store-row-main {
      display: flex;
      flex-direction: column;
      gap: 2px;
      min-width: 0;
      flex: 1;
    }

    .store-row-name {
      font-size: 14.5px;
      font-weight: 500;
      color: rgba(255, 255, 255, .92);
    }

    .store-row-desc {
      font-size: 11.5px;
      color: rgba(255, 255, 255, .4);
    }

    .store-row-status {
      flex-shrink: 0;
      font-size: 12px;
      font-weight: 600;
      padding: 5px 12px;
      border-radius: 100px;
      white-space: nowrap;
    }

    .store-row-status.is-live {
      color: #cfe6f7;
      background: rgba(94, 166, 217, .22);
    }

    .store-row-status.is-soon {
      color: rgba(255, 255, 255, .38);
      background: rgba(255, 255, 255, .06);
    }

    .store-modal-note {
      padding: 2px 20px 18px;
      font-size: 11.5px;
      line-height: 1.6;
      color: rgba(255, 255, 255, .32);
    }

    @media (max-width: 600px) {
      .store-modal {
        max-width: 320px;
      }
    }
