/* 阿飞健身官网样式：柔和极简 · 健康绿；手机优先 */
:root{
  --g:#1E8E5A; --g-d:#14683f; --g-50:#f0f8f3; --g-100:#e0f1e7; --g-200:#bfe2cf;
  --ink:#14231b; --mut:#5d6c63; --bg:#faf8f4; --card:#fff; --line:rgba(20,35,27,.09);
  --amb:#e79a2b;
  --sh-s:0 1px 2px rgba(20,35,27,.05),0 4px 14px rgba(20,35,27,.05);
  --sh-m:0 2px 6px rgba(20,35,27,.05),0 16px 40px rgba(20,35,27,.09);
  --sh-l:0 30px 80px rgba(20,60,40,.22);
  --r:24px;
  --font:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC","Source Han Sans SC",system-ui,sans-serif;
  --num:ui-rounded,"SF Pro Rounded","PingFang SC",var(--font);
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:72px}
body{font:16px/1.7 var(--font);color:var(--ink);background:var(--bg);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit}
.num,.tn{font-variant-numeric:tabular-nums;font-family:var(--num)}
.wrap{width:min(1120px,100% - 40px);margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--g);outline-offset:3px;border-radius:8px}

/* 按钮 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border-radius:999px;font-weight:700;font-size:16px;text-decoration:none;border:1.5px solid transparent;transition:transform .2s,box-shadow .2s,background .2s;cursor:pointer}
.btn-p{background:linear-gradient(180deg,#25a068,var(--g));color:#fff;box-shadow:0 8px 24px rgba(30,142,90,.35),inset 0 1px 0 rgba(255,255,255,.25)}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(30,142,90,.42)}
.btn-s{background:#fff;color:var(--g-d);border-color:var(--g-200)}
.btn-s:hover{background:var(--g-50)}
.btn-sm{min-height:40px;padding:0 18px;font-size:14px}
.btn-lg{min-height:58px;padding:0 34px;font-size:18px}

/* 顶栏 */
.nav{position:sticky;top:0;z-index:50;background:rgba(250,248,244,.78);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid transparent;transition:border-color .2s,box-shadow .2s}
.nav.stuck{border-color:var(--line);box-shadow:0 4px 20px rgba(20,35,27,.04)}
.nav .wrap{display:flex;align-items:center;gap:20px;height:64px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px;text-decoration:none;letter-spacing:.5px}
.brand img{width:34px;height:34px;border-radius:10px}
.nav-links{display:none;margin-left:auto;gap:28px}
.nav-links a{text-decoration:none;font-size:15px;color:var(--mut);font-weight:500}
.nav-links a:hover{color:var(--g-d)}
.nav .btn{margin-left:auto}
@media(min-width:860px){.nav-links{display:flex}.nav .btn{margin-left:8px}}

/* Hero */
.hero{position:relative;overflow:hidden;padding:44px 0 0;background:
  radial-gradient(900px 480px at 85% 0%,rgba(30,142,90,.16),transparent 60%),
  radial-gradient(700px 420px at 0% 30%,rgba(231,154,43,.10),transparent 60%)}
.hero-grid{display:grid;gap:36px;align-items:end}
.hero-copy{padding-bottom:8px}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--g-d);background:var(--g-100);padding:5px 12px;border-radius:999px;letter-spacing:.5px}
.eyebrow i{width:6px;height:6px;border-radius:50%;background:var(--g)}
h1{font-size:clamp(36px,9.2vw,68px);line-height:1.12;font-weight:800;letter-spacing:-.5px;margin:18px 0 16px}
h1 .big{color:var(--g);white-space:nowrap}
.lead{font-size:clamp(16px,4.2vw,19px);color:var(--mut);max-width:30em}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0 22px}
.hero-meta{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:14px;color:var(--mut)}
.hero-meta span{display:flex;align-items:center;gap:6px}
.hero-meta svg{width:16px;height:16px;color:var(--g)}
.ticker{display:flex;align-items:baseline;gap:10px;margin-top:26px;padding:14px 18px;background:rgba(255,255,255,.7);border:1px solid var(--line);border-radius:18px;width:fit-content;box-shadow:var(--sh-s)}
.ticker b{font-size:34px;line-height:1;font-weight:800;color:var(--ink)}
.ticker small{font-size:13px;color:var(--mut)}
.ticker .arrow{color:var(--g);font-weight:800}
.hero-visual{position:relative;display:flex;justify-content:center;margin-top:6px}
.hero-visual .phone{width:min(300px,78vw)}
.chip{position:absolute;display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border:1px solid var(--line);box-shadow:var(--sh-m);padding:10px 14px;border-radius:16px;font-size:13.5px;font-weight:600;white-space:nowrap}
.chip b{font-family:var(--num);font-size:18px;color:var(--g)}
.chip .dot{width:30px;height:30px;border-radius:10px;background:var(--g-100);display:grid;place-items:center;color:var(--g)}
.chip .dot svg{width:18px;height:18px}
.chip.c1{left:max(-6px,calc(50% - 215px));top:360px;animation:float 6s ease-in-out infinite}
.chip.c2{right:max(-6px,calc(50% - 215px));top:8px;animation:float 7s ease-in-out -2s infinite}
@keyframes float{50%{transform:translateY(-8px)}}
@media(max-width:480px){.chip{font-size:12.5px;padding:8px 11px}.chip.c1{left:-4px}.chip.c2{right:-4px}}
@media(min-width:900px){
  .hero{padding-top:64px}
  .hero-grid{grid-template-columns:1.05fr .95fr;gap:20px}
  .hero-copy{padding-bottom:70px}
  .hero-visual .phone{width:340px}
  .chip.c1{left:-24px}.chip.c2{right:-24px}
}

/* 手机样机：纯 CSS，下沿被裁切，像从屏幕底部升起 */
.phone{position:relative;border-radius:46px 46px 0 0;padding:11px 11px 0;background:linear-gradient(150deg,#3a423d,#0e1310 55%,#2b332e);box-shadow:var(--sh-l),inset 0 0 0 1.5px rgba(255,255,255,.14);
  -webkit-mask-image:linear-gradient(#000 80%,transparent 100%);mask-image:linear-gradient(#000 80%,transparent 100%)}
.phone.nofade{-webkit-mask-image:none;mask-image:none}
.screen{position:relative;border-radius:36px 36px 0 0;overflow:hidden;background:#faf8f4}
.sbar{display:flex;align-items:center;justify-content:space-between;height:30px;padding:2px 20px 0;font-size:12.5px;font-weight:700;color:#1d2a22;font-family:var(--num);position:relative}
.sbar::after{content:"";position:absolute;left:50%;top:7px;width:54px;height:15px;border-radius:9px;background:#0e1310;transform:translateX(-50%)}
.sbar svg{height:11px;width:auto}
.screen img{width:100%;height:auto}
.screen .fab{position:absolute;right:14px;bottom:60px;width:46px;height:46px;border-radius:50%;background:var(--g);display:grid;place-items:center;box-shadow:0 6px 16px rgba(30,142,90,.4)}
.screen .fab svg{width:22px;height:22px;color:#fff}

/* 章节 */
section{position:relative}
.sec{padding:72px 0}
.sec-head{max-width:40em;margin-bottom:36px}
.kicker{font-size:13px;font-weight:800;letter-spacing:2px;color:var(--g-d);text-transform:uppercase}
h2{font-size:clamp(28px,6.6vw,44px);line-height:1.2;font-weight:800;margin:8px 0 12px;letter-spacing:-.3px}
.sec-head p{color:var(--mut);font-size:clamp(15px,3.8vw,17px)}
.band{background:linear-gradient(180deg,#fff,var(--g-50))}

/* 数据：KPI + 图表卡片（bento） */
.kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:16px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:18px 18px 16px;box-shadow:var(--sh-s)}
.kpi b{display:block;font-size:clamp(28px,7.5vw,40px);line-height:1.1;font-weight:800;font-family:var(--num);font-variant-numeric:tabular-nums;color:var(--g-d)}
.kpi b small{font-size:.45em;font-weight:700;margin-left:3px;color:var(--mut)}
.kpi span{font-size:13.5px;color:var(--mut)}
.kpi.hl{background:linear-gradient(145deg,#25a068,#14683f);color:#fff;border:0}
.kpi.hl b,.kpi.hl b small,.kpi.hl span{color:#fff}.kpi.hl span{opacity:.85}
@media(min-width:760px){.kpis{grid-template-columns:repeat(4,1fr)}}
.bento{display:grid;gap:16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:22px 20px;box-shadow:var(--sh-s);min-width:0}
.card h3{font-size:18px;font-weight:800;line-height:1.35}
.card .sub{font-size:14px;color:var(--mut);margin:2px 0 14px}
.card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.big-delta{font-family:var(--num);font-weight:800;font-size:clamp(34px,9vw,52px);line-height:1;color:var(--g);font-variant-numeric:tabular-nums}
.big-delta small{font-size:.38em;color:var(--mut);font-weight:700;margin-left:4px}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:var(--mut);margin-top:8px}
.legend i{display:inline-block;width:18px;height:3px;border-radius:2px;vertical-align:middle;margin-right:6px;background:var(--g)}
.legend i.d{background:none;border-top:3px dotted var(--g-d);height:0}
.legend i.a{background:none;border-top:2px dashed var(--amb);height:0}
.legend i.sq{width:11px;height:11px;border-radius:3px;border:0;vertical-align:-1px}
.v-narrow{display:none}
@media(max-width:600px){.v-wide{display:none}.v-narrow{display:block}}
@media(min-width:900px){.bento{grid-template-columns:repeat(6,1fr)}.b-wide{grid-column:span 6}.b-3{grid-column:span 3}.b-2{grid-column:span 2}.b-4{grid-column:span 4}.card{padding:28px 28px 24px}}
.stat-row{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.stat-row div{flex:1;min-width:96px;background:var(--g-50);border-radius:14px;padding:10px 12px}
.stat-row b{display:block;font-family:var(--num);font-size:20px;font-variant-numeric:tabular-nums}
.stat-row span{font-size:12.5px;color:var(--mut)}
.ring-wrap{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.ring-svg{width:150px;height:150px;flex:none}
.heat-card .chart-svg{max-width:400px;margin-inline:auto}
.note{font-size:13px;color:var(--mut);margin-top:10px}
.chart-svg{width:100%;height:auto;overflow:visible}
.hit{cursor:pointer;outline:none}
.hit .hd{opacity:0;transition:opacity .15s;pointer-events:none}
.hit:hover .hd,.hit.on .hd{opacity:1}
.hit:hover .bar,.hit.on .bar,.hit:hover .hc,.hit.on .hc{filter:brightness(.9)}
.pulse{animation:pulse 2s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes pulse{0%{transform:scale(.8);opacity:.5}100%{transform:scale(2.6);opacity:0}}
.tip{position:fixed;z-index:80;pointer-events:none;background:#14231b;color:#fff;font-size:13px;line-height:1.4;padding:7px 11px;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.25);max-width:240px;opacity:0;transform:translateY(4px);transition:opacity .12s,transform .12s}
.tip.on{opacity:1;transform:none}

/* 功能故事 */
.story{padding:56px 0}
.story-grid{display:grid;gap:32px;align-items:center}
.story-text .no{font-family:var(--num);font-size:14px;font-weight:800;color:var(--g-d);letter-spacing:1px}
.story-text h3{font-size:clamp(26px,6.4vw,38px);line-height:1.22;font-weight:800;margin:6px 0 14px;letter-spacing:-.3px}
.tale{font-size:clamp(16px,4vw,17.5px);color:#33453a;margin-bottom:12px}
.tale q{quotes:"「" "」";color:var(--g-d);font-weight:700}
.pts{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:10px}
.pts li{display:flex;gap:10px;font-size:15px;color:var(--mut);align-items:flex-start}
.pts li::before{content:"";flex:none;width:20px;height:20px;margin-top:3px;border-radius:50%;background:var(--g-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-6.5' fill='none' stroke='%231E8E5A' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat}
.story-visual{position:relative;display:flex;justify-content:center}
.story-visual::before{content:"";position:absolute;inset:6% 4% 0;border-radius:44px;background:linear-gradient(160deg,var(--g-100),#fff3dc);opacity:.85;z-index:0}
.story-visual .phone,.story-visual .panel{position:relative;z-index:1}
.story-visual .phone{width:min(290px,80vw);margin-top:28px;border-radius:44px 44px 0 0}
.quote{margin:16px 0 0;padding:14px 16px;border-left:4px solid var(--g);background:var(--g-50);border-radius:0 14px 14px 0;font-size:15px;color:#2d4036}
.quote small{display:block;color:var(--mut);margin-top:4px;font-size:12.5px}
@media(min-width:900px){
  .story{padding:84px 0}
  .story-grid{grid-template-columns:1fr 1fr;gap:72px}
  .story.rev .story-text{order:2}
  .story-visual .phone{width:330px}
}
.panel{width:min(420px,100%);background:#fff;border:1px solid var(--line);border-radius:28px;box-shadow:var(--sh-m);padding:26px 22px}
.voice-bar{display:flex;align-items:center;gap:12px}
.voice-bar .ico{width:38px;height:38px;border-radius:12px;background:var(--g-50);display:grid;place-items:center;color:var(--ink);flex:none}
.voice-bar .ico svg{width:22px;height:22px}
.voice-bar .hold{flex:1;height:54px;border-radius:999px;background:#f4f1ea;display:grid;place-items:center;font-weight:700;letter-spacing:3px}
.voice-demo{margin-top:22px;border-radius:22px;background:linear-gradient(160deg,#25a068,#14683f);color:#fff;padding:22px;text-align:center}
.voice-demo p{font-size:14px;opacity:.9;margin-top:10px}
.wave{display:flex;gap:5px;align-items:center;justify-content:center;height:56px}
.wave i{width:5px;border-radius:3px;background:#fff;height:12px;animation:wave 1.1s ease-in-out infinite;animation-delay:calc(var(--k)*-.09s)}
@keyframes wave{0%,100%{height:10px;opacity:.6}50%{height:calc(14px + var(--h)*38px);opacity:1}}
.steps-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px;text-align:center;font-size:13px;color:var(--mut)}
.steps-mini b{display:block;color:var(--ink);font-size:14px}
.sync-art{width:min(440px,100%)}

/* 更多功能 */
.grid-f{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:640px){.grid-f{grid-template-columns:repeat(2,1fr)}}
@media(min-width:960px){.grid-f{grid-template-columns:repeat(3,1fr)}}
.fc{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:var(--sh-s)}
.fc svg{width:28px;height:28px;color:var(--g);margin-bottom:10px}
.fc h3{font-size:17px;font-weight:800;margin-bottom:4px}
.fc p{font-size:14.5px;color:var(--mut);line-height:1.6}

/* 价格 */
.plans{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:640px){.plans{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.plans{grid-template-columns:repeat(5,1fr);gap:12px}}
.plan{position:relative;background:#fff;border:1px solid var(--line);border-radius:24px;padding:24px 20px;box-shadow:var(--sh-s);display:flex;flex-direction:column;gap:2px}
.plan h3{font-size:15px;color:var(--mut);font-weight:700}
.plan .days{font-size:28px;font-weight:800;font-family:var(--num)}
.plan .days small{font-size:15px;font-weight:700;color:var(--mut);margin-left:2px}
.plan .price{font-family:var(--num);font-variant-numeric:tabular-nums;font-size:34px;font-weight:800;color:var(--g-d);margin-top:10px;line-height:1.1}
.plan .price small{font-size:16px;margin-right:2px}
.plan .per{font-size:14px;color:var(--mut);font-variant-numeric:tabular-nums}
.plan .save{display:inline-block;margin-top:10px;width:fit-content;font-size:12.5px;font-weight:800;color:var(--g-d);background:var(--g-100);padding:3px 10px;border-radius:999px}
.plan.rec{border:2px solid var(--g);box-shadow:var(--sh-m);background:linear-gradient(180deg,#fff,var(--g-50))}
.plan.rec::before{content:"推荐";position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--g);color:#fff;font-size:12.5px;font-weight:800;padding:3px 14px;border-radius:999px;letter-spacing:2px}
.plan.try{background:#fffaf0;border-style:dashed;border-color:#ecd49c}
.plan.try .save{background:#fbe9c4;color:#8a5a0b}
.pay{display:grid;gap:12px;margin-top:26px}
@media(min-width:760px){.pay{grid-template-columns:repeat(4,1fr)}}
.pay div{background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px;font-size:14px;color:var(--mut);line-height:1.6}
.pay b{display:flex;align-items:center;gap:8px;color:var(--ink);font-size:15px;margin-bottom:4px}
.pay b i{font-style:normal;width:24px;height:24px;border-radius:50%;background:var(--g);color:#fff;font-size:13px;display:grid;place-items:center;font-family:var(--num)}
.fine{font-size:13.5px;color:var(--mut);margin-top:18px}

/* 下载 */
.dl{background:linear-gradient(160deg,#14683f,#1E8E5A 60%,#2aa56d);color:#fff;border-radius:36px;padding:34px 22px;display:grid;gap:30px;box-shadow:0 30px 70px rgba(20,104,63,.32);position:relative;overflow:hidden}
.dl::after{content:"";position:absolute;right:-80px;top:-80px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.18),transparent 65%)}
.dl h2{color:#fff;margin-top:6px}
.dl .kicker{color:#bfe9d1}
.dl p{opacity:.92}
.dl .btn-w{background:#fff;color:var(--g-d);box-shadow:0 10px 30px rgba(0,0,0,.2)}
.dl .btn-w:hover{transform:translateY(-2px)}
.dl-meta{font-size:13.5px;opacity:.85;margin-top:12px}
.qr{background:#fff;border-radius:24px;padding:16px;width:196px;height:196px;box-shadow:0 14px 40px rgba(0,0,0,.22);flex:none;position:relative;z-index:1}
.qr svg{width:100%;height:100%}
.qr-wrap{display:flex;gap:18px;align-items:center;flex-wrap:wrap;position:relative;z-index:1}
.qr-wrap p{font-size:14px;max-width:14em}
.steps{counter-reset:s;display:grid;gap:12px;margin-top:8px;list-style:none;padding:0;position:relative;z-index:1}
.steps li{counter-increment:s;display:flex;gap:12px;align-items:flex-start;font-size:15px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:12px 14px}
.steps li::before{content:counter(s);flex:none;width:26px;height:26px;border-radius:50%;background:#fff;color:var(--g-d);font-weight:800;font-size:14px;display:grid;place-items:center;font-family:var(--num)}
.steps a{color:#fff;font-weight:700}
.dl-left,.dl-right{position:relative;z-index:1;min-width:0}
@media(min-width:900px){.dl{grid-template-columns:1.1fr .9fr;padding:56px 56px;gap:56px;align-items:center}}

/* FAQ */
.faq{max-width:820px;margin-inline:auto;display:grid;gap:10px}
details{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--sh-s);overflow:hidden}
summary{list-style:none;cursor:pointer;padding:17px 20px;font-weight:700;display:flex;justify-content:space-between;align-items:center;gap:14px;min-height:56px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";flex:none;width:28px;height:28px;border-radius:50%;background:var(--g-100);color:var(--g-d);display:grid;place-items:center;font-size:20px;line-height:1;transition:transform .25s}
details[open] summary::after{transform:rotate(45deg)}
details p{padding:0 20px 18px;color:var(--mut);font-size:15px}
details a{color:var(--g-d);font-weight:600}

/* 页脚 */
.foot{padding:44px 0 36px;border-top:1px solid var(--line);margin-top:70px;font-size:14px;color:var(--mut)}
.foot-grid{display:grid;gap:22px}
@media(min-width:760px){.foot-grid{grid-template-columns:1.4fr 1fr}}
.foot a{color:var(--g-d);text-decoration:none;font-weight:600}
.foot a:hover{text-decoration:underline}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 20px}
.disc{margin-top:20px;font-size:12.5px;line-height:1.7;color:#5d6c63}

/* 动画（JS 加 .anim 后才生效；prefers-reduced-motion 时不加，直接显示终态） */
.anim .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.anim .reveal.in{opacity:1;transform:none}
.anim .c-line{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2s cubic-bezier(.4,0,.2,1)}
.anim .in .c-line,.anim .c-line.in{stroke-dashoffset:0}
.anim .c-area,.anim .c-avg{opacity:0;transition:opacity 1s .9s}
.anim .in .c-area,.anim .in .c-avg{opacity:1}
.anim .c-mark{opacity:0;transition:opacity .6s 1.5s}
.anim .in .c-mark{opacity:1}
.anim .bar{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0);transition:transform .9s cubic-bezier(.2,.8,.2,1) calc(var(--i)*100ms)}
.anim .in .bar{transform:none}
.anim .bar-v{opacity:0;transition:opacity .5s calc(var(--i)*100ms + .6s)}
.anim .in .bar-v{opacity:1}
.anim .hc{opacity:0;transition:opacity .5s calc(var(--i)*28ms)}
.anim .in .hc{opacity:1}
.ring-fg{stroke-dashoffset:calc(var(--len) * (1 - var(--pct)) * 1px)}
.anim .ring-fg{stroke-dashoffset:calc(var(--len) * 1px);transition:stroke-dashoffset 1.6s cubic-bezier(.3,.7,.2,1)}
.anim .in .ring-fg{stroke-dashoffset:calc(var(--len) * (1 - var(--pct)) * 1px)}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* —— 打磨 —— */
.chip{z-index:3}
.desk-only{display:none!important}
@media(min-width:900px){.desk-only{display:flex!important}}
@media(max-width:639px){
  .plans{gap:10px}
  .plan{display:grid;grid-template-columns:1fr auto;grid-template-areas:"n p" "d r" "s s";align-items:center;column-gap:12px;padding:16px 18px;border-radius:20px}
  .plan h3{grid-area:n}.plan .days{grid-area:d;font-size:22px}.plan .price{grid-area:p;margin:0;text-align:right;font-size:30px}
  .plan .per{grid-area:r;text-align:right}.plan .save{grid-area:s;margin-top:8px}
  .plan.rec::before{top:-12px;left:auto;right:18px;transform:none}
}
h1,h2,h3{text-wrap:balance}