*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro SC","PingFang SC","Helvetica Neue","Hiragino Sans GB","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased;letter-spacing:-.01em;overflow:hidden}
.wrap{height:100vh;height:100dvh;overflow-y:auto;scroll-snap-type:y mandatory;scroll-behavior:smooth}
.pg{min-height:100vh;min-height:100dvh;height:100dvh;scroll-snap-align:start;position:relative;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.in{width:min(1080px,88vw);margin:0 auto;position:relative;z-index:2}
.rv{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.pg.on .rv{opacity:1;transform:none}
.pg.on .d1{transition-delay:.12s}.pg.on .d2{transition-delay:.24s}.pg.on .d3{transition-delay:.36s}.pg.on .d4{transition-delay:.5s}
/* 下滑提示 */
.next{position:absolute;left:50%;bottom:max(26px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:5;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;font-size:12px;letter-spacing:.2em;text-decoration:none;color:inherit;opacity:.85}
.next i{width:42px;height:42px;border-radius:50%;border:1px solid currentColor;display:grid;place-items:center;animation:bob 1.8s ease-in-out infinite}
.next i:after{content:"";width:9px;height:9px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:translateY(-2px) rotate(45deg)}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}
/* 页码 */
.dots{position:fixed;right:18px;top:50%;transform:translateY(-50%);z-index:9;display:flex;flex-direction:column;gap:10px}
.dots a{width:6px;height:6px;border-radius:3px;background:currentColor;opacity:.25;transition:all .4s}
.dots a.on{height:22px;opacity:.9}
.top{position:fixed;top:0;left:0;right:0;z-index:9;height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 max(6vw,20px);font-size:15px;font-weight:600;letter-spacing:.02em;backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px)}
.top small{font-weight:400;font-size:12px;opacity:.6;letter-spacing:.04em}
.fine{font-size:10px;line-height:1.6;opacity:.45;letter-spacing:0}
.qrc{background:#fff;border-radius:28px;padding:22px 22px 18px;box-shadow:0 30px 80px -20px rgba(0,0,0,.35),0 0 0 1px rgba(0,0,0,.04);color:#1d1d1f;text-align:center;width:240px}
.qrc img{width:196px;height:196px;display:block;margin:0 auto}
.qrc b{display:block;font-size:17px;margin-top:12px;letter-spacing:.02em}
.qrc span{display:block;font-size:12px;color:#86868b;margin-top:3px}
@media(max-width:640px){.dots{right:8px}.qrc{width:220px}.qrc img{width:176px;height:176px}}
.qrc em{display:block;font-style:normal;font-size:13px;font-weight:600;margin-top:12px;padding:8px 0 0;border-top:1px solid #e8e8ed;color:#1d1d1f;letter-spacing:.02em}
.qrc em i{font-style:normal;color:#0071e3}

/*fit-next*/.pg{box-sizing:border-box;padding-top:48px;padding-bottom:96px}
@media(max-height:760px){.pg{padding-top:36px;padding-bottom:80px}.next{gap:5px;font-size:11px;bottom:max(14px,env(safe-area-inset-bottom))}.next i{width:34px;height:34px}}
@media(max-height:700px) and (max-width:820px){.pg{padding-top:28px;padding-bottom:70px}h1,h2{font-size:min(1em,9.4vw)!important}.lead{font-size:15px!important;margin-top:10px!important}}