/* 遇球 · 官网 / 下载页 共用样式
   色板：梅墨 #2A1236 · 莓粉 #FF2E93 · 兰紫 #C026F0 · 台呢紫 #8A5CF6 · 雾粉 #FFF5F9 · 金 #FFD35A */
:root{
  --plum:#2A1236; --plum2:#5B4566; --mute:#9A8AA6;
  --berry:#FF2E93; --orchid:#C026F0; --felt:#8A5CF6; --felt2:#B37BFF;
  --mist:#FFF5F9; --lilac:#F1EAFF; --line:rgba(42,18,54,.08); --gold:#FFD35A;
  --grad:linear-gradient(110deg,#FF2E93 0%,#C026F0 55%,#8A5CF6 100%);
  --r-lg:32px; --r-md:22px;
  --ff-cn:"PingFang SC","HarmonyOS Sans SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  --ff-en:"Unbounded","PingFang SC",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden}
body{font-family:var(--ff-cn);color:var(--plum);background:var(--mist);-webkit-font-smoothing:antialiased;line-height:1.6}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid rgba(192,38,240,.55);outline-offset:3px;border-radius:12px}
.wrap{width:min(1200px,92vw);margin:0 auto}
.en{font-family:var(--ff-en);letter-spacing:.02em}

/* ---------- 导航 ---------- */
.nav{position:sticky;top:0;z-index:50;backdrop-filter:saturate(1.4) blur(16px);background:rgba(255,245,249,.78);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;height:72px;gap:28px}
.brand{display:flex;align-items:center;gap:12px;font-weight:900;font-size:20px}
.brand img{width:40px;height:40px;border-radius:12px;box-shadow:0 6px 14px rgba(150,60,200,.25)}
.brand small{display:block;font-family:var(--ff-en);font-size:9px;letter-spacing:.32em;color:var(--mute);font-weight:600;margin-top:-2px}
.nav ul{display:flex;gap:30px;list-style:none;margin-left:auto;font-size:15px;font-weight:700;color:var(--plum2)}
.nav ul a{position:relative;padding:6px 0}
.nav ul a:hover{color:var(--berry)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 26px;border-radius:999px;
  font-size:16px;font-weight:900;cursor:pointer;border:0;transition:transform .18s,box-shadow .18s;font-family:var(--ff-cn)}
.btn:active{transform:scale(.97)}
.btn-pri{color:#fff;background:var(--grad);box-shadow:0 14px 30px rgba(255,46,147,.32)}
.btn-pri:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(255,46,147,.38)}
.btn-ghost{color:var(--plum);background:#fff;box-shadow:inset 0 0 0 1.5px rgba(42,18,54,.12)}
.btn-ghost:hover{box-shadow:inset 0 0 0 1.5px var(--berry);color:var(--berry)}
.btn svg{width:20px;height:20px}
.nav .btn{height:42px;padding:0 20px;font-size:14px}

/* ---------- 手机外壳 ---------- */
.ph{position:relative;aspect-ratio:1170/2532;border-radius:13% / 6%;padding:3.2%;
  background:linear-gradient(158deg,#fff 0%,#F7F1FC 45%,#ECE3F7 75%,#fff 100%);
  box-shadow:0 30px 70px rgba(70,20,110,.28),0 0 0 1px rgba(255,255,255,.9),inset 0 2px 3px #fff}
.ph>img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:10.5% / 4.9%}

/* ---------- 球台（品牌标志性元素） ---------- */
.table{position:relative;border-radius:46px;padding:22px;
  background:linear-gradient(150deg,#4A1C5E 0%,#2E1140 55%,#3D1752 100%);
  box-shadow:0 40px 90px rgba(60,10,90,.35),inset 0 2px 0 rgba(255,255,255,.16),inset 0 -6px 14px rgba(0,0,0,.35)}
.felt{position:relative;height:100%;border-radius:28px;overflow:hidden;
  background:
    radial-gradient(60% 50% at 30% 25%,rgba(255,255,255,.22),transparent 70%),
    radial-gradient(70% 60% at 80% 90%,rgba(255,46,147,.28),transparent 70%),
    linear-gradient(160deg,var(--felt2) 0%,var(--felt) 55%,#7046E8 100%);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.12),inset 0 18px 40px rgba(40,0,80,.35)}
.felt::before{content:"";position:absolute;inset:0;opacity:.18;
  background-image:radial-gradient(rgba(255,255,255,.7) 1px,transparent 1.2px);background-size:6px 6px}
.pocket{position:absolute;width:44px;height:44px;border-radius:50%;z-index:3;
  background:radial-gradient(circle at 50% 40%,#0E0414 55%,#2B0F3A 100%);box-shadow:0 0 0 5px #3A1650,inset 0 4px 8px rgba(0,0,0,.6)}
.pocket.tl{left:-4px;top:-4px}.pocket.tr{right:-4px;top:-4px}.pocket.bl{left:-4px;bottom:-4px}.pocket.br{right:-4px;bottom:-4px}
.pocket.ml{left:-6px;top:50%;margin-top:-22px}.pocket.mr{right:-6px;top:50%;margin-top:-22px}
.diamond{position:absolute;width:8px;height:8px;background:#F2D7A6;transform:rotate(45deg);opacity:.75;z-index:2}

/* ---------- 通用排版 ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:10px;height:34px;padding:0 16px;border-radius:999px;font-size:13px;font-weight:900;
  color:var(--orchid);background:#fff;box-shadow:0 8px 20px rgba(192,38,240,.12)}
.eyebrow i{width:8px;height:8px;border-radius:50%;background:var(--grad)}
.h-sec{font-size:clamp(32px,4vw,52px);line-height:1.15;font-weight:900;letter-spacing:.02em}
.h-sec em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:17px;color:var(--plum2);line-height:1.85}

.store{display:flex;flex-wrap:wrap;gap:14px}
.qr{display:flex;align-items:center;gap:16px;padding:12px 18px 12px 12px;border-radius:22px;background:#fff;box-shadow:0 14px 32px rgba(90,30,140,.12)}
.qr img{width:96px;height:96px;border-radius:12px;background:#fff}
.qr b{display:block;font-size:15px;font-weight:900}
.qr span{display:block;font-size:13px;color:var(--mute);margin-top:2px}

.toast{position:fixed;left:50%;bottom:40px;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:99;
  padding:14px 22px;border-radius:999px;background:rgba(42,18,54,.92);color:#fff;font-size:14px;font-weight:700;transition:.25s}
.toast.on{opacity:1;transform:translate(-50%,0)}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}