:root{
  --bg:#fff;--bg2:#f5f5f7;--bg3:#ececf0;--tx:#1d1d1f;--tx2:#6e6e73;--tx3:#a1a1a6;
  --line:#e5e5ea;--ac:#0071e3;--ac-soft:#e8f2fd;--r:0.875rem;--r-lg:1.375rem;
  --sh:0 1px 2px rgba(0,0,0,.04),0 0.5rem 1.5rem rgba(0,0,0,.06);
  --sh-h:0 2px 0.375rem rgba(0,0,0,.06),0 1.125rem 2.5rem rgba(0,0,0,.14);
  --hd:3.75rem;
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;font-size:clamp(16px,.446vw + 9.6px,22px)}
body{font-family:var(--font);color:var(--tx);background:var(--bg);line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
img{display:block;max-width:100%}
svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.wrap{width:100%;max-width:2560px;margin:0 auto;padding:0 clamp(1rem,3vw,4rem)}

/* header */
.hd{position:sticky;top:0;z-index:50;height:var(--hd);background:rgba(255,255,255,.78);backdrop-filter:saturate(180%) blur(1.25rem);-webkit-backdrop-filter:saturate(180%) blur(1.25rem);border-bottom:1px solid rgba(0,0,0,.06)}
.hd-in{height:100%;display:flex;align-items:center;gap:1.75rem}
.logo{display:flex;align-items:center;gap:0.625rem;font-weight:700;font-size:1.125rem;letter-spacing:.5px;white-space:nowrap}
.logo-mark{display:block;width:1.75rem;height:1.75rem;object-fit:contain}
.nav{display:flex;gap:0.25rem}
.nav a{padding:0.375rem 0.875rem;border-radius:6.1875rem;font-size:0.9375rem;color:var(--tx2);transition:.2s}
.nav a:hover{color:var(--tx);background:var(--bg2)}
.nav a.on{color:var(--tx);background:var(--bg2);font-weight:600}
.nav a{display:flex;align-items:center;gap:0.375rem}
.nav a svg{display:none;font-size:1.375rem}
.search{margin-left:auto;position:relative;width:min(21.25rem,100%)}
.me{position:relative;flex:none}
.me-b{height:2.375rem;padding:0 1.25rem;border-radius:6.1875rem;background:var(--tx);color:#fff;display:inline-flex;align-items:center;font-size:0.875rem;font-weight:600;transition:.2s}
.me-b:hover{background:#000}
.me-m{position:absolute;right:0;top:2.875rem;min-width:11.25rem;padding:0.375rem;border-radius:0.875rem;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.06),0 1rem 2.5rem rgba(0,0,0,.16);opacity:0;visibility:hidden;transform:translateY(-0.375rem);transition:.2s}
.me-m.open{opacity:1;visibility:visible;transform:none}
.me-m a,.me-m button{display:flex;align-items:center;gap:0.625rem;width:100%;padding:0.625rem 0.75rem;border-radius:0.5625rem;font-size:0.875rem;text-align:left}
.me-m a:hover,.me-m button:hover{background:var(--bg2)}
.me-m svg{font-size:1.0625rem;color:var(--tx2)}
.me-a{width:2.375rem;height:2.375rem;border-radius:50%;overflow:hidden;display:grid;place-items:center;color:#fff;font-size:0.9375rem;font-weight:700;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.me-a{position:relative}
.me-a img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.me-a span{display:grid;place-items:center;width:100%;height:100%;color:#fff;font-size:0.9375rem;font-weight:700}
.me-n{padding:0.5rem 0.75rem 0.625rem;margin-bottom:0.25rem;border-bottom:1px solid var(--line);font-size:0.875rem;font-weight:600;max-width:14rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.search svg{position:absolute;left:0.875rem;top:50%;transform:translateY(-50%);color:var(--tx3);font-size:1rem}
.search input{width:100%;height:2.375rem;border-radius:6.1875rem;border:1px solid transparent;background:var(--bg2);padding:0 1rem 0 2.375rem;font:inherit;font-size:0.875rem;outline:0;transition:.2s}
.search input:focus{background:#fff;border-color:var(--ac);box-shadow:0 0 0 0.25rem var(--ac-soft)}
@media(max-width:900px){.hd-in{gap:0.875rem}}
@media(max-width:700px){
  body{padding-bottom:3.875rem}
  .nav{position:fixed;left:0;right:0;bottom:0;z-index:60;height:3.875rem;gap:0;justify-content:space-around;background:rgba(255,255,255,.88);backdrop-filter:saturate(180%) blur(1.25rem);-webkit-backdrop-filter:saturate(180%) blur(1.25rem);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
  .nav a{flex:1;flex-direction:column;justify-content:center;gap:2px;border-radius:0;font-size:0.6875rem;background:none!important;padding:0.375rem 0}
  .nav a svg{display:block}
  .nav a.on{color:var(--ac)}
  .logo{font-size:1rem}
}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;height:2.625rem;padding:0 1.375rem;border-radius:6.1875rem;font-size:0.9375rem;font-weight:600;transition:.2s;white-space:nowrap}
.btn svg{font-size:1.125rem}
.btn-p{background:var(--tx);color:#fff}.btn-p:hover{background:#000;transform:translateY(-1px)}
.btn-ac{background:var(--ac);color:#fff}.btn-ac:hover{background:#0077ed}
.btn-s{background:var(--bg2);color:var(--tx)}.btn-s:hover{background:var(--bg3)}
.btn-w{background:rgba(255,255,255,.92);color:var(--tx)}.btn-w:hover{background:#fff}
.btn-lg{height:3.25rem;padding:0 1.875rem;font-size:1rem}

/* section */
.sec{padding-top:clamp(2.25rem,3.2vw,4.5rem);padding-bottom:0.5rem}
.sec-h{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:1.25rem;gap:0.75rem}
.sec-h h2{font-size:1.625rem;font-weight:700;letter-spacing:-.3px}
.sec-h p{color:var(--tx2);font-size:0.875rem;margin-top:2px}
.more{color:var(--ac);font-size:0.9375rem;display:inline-flex;align-items:center;gap:2px;white-space:nowrap}
.more:hover{text-decoration:underline}

/* grid + card */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(0.75rem,1.1vw,1.5rem)}
@media(max-width:1100px){.grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.grid{grid-template-columns:repeat(2,1fr);gap:0.625rem}}
.grid.is-win{display:block;position:relative}
.grid.is-win .win{position:absolute;left:0;right:0;top:0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(0.75rem,1.1vw,1.5rem)}
@media(max-width:1100px){.grid.is-win .win{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.grid.is-win .win{grid-template-columns:repeat(2,1fr);gap:0.625rem}}
.grid.is-win .card{height:100%;aspect-ratio:auto}
.card{position:relative;display:block;aspect-ratio:16/10;border-radius:var(--r);overflow:hidden;background:var(--bg3);box-shadow:0 0 0 1px rgba(0,0,0,.04);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.card img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.card:hover{transform:translateY(-0.1875rem);box-shadow:var(--sh-h)}
.card:hover img{transform:scale(1.045)}
.card .tag{position:absolute;left:0.625rem;top:0.625rem;padding:0.1875rem 0.625rem;border-radius:6.1875rem;font-size:0.75rem;font-weight:500;color:#fff;background:rgba(0,0,0,.32);backdrop-filter:blur(0.625rem);-webkit-backdrop-filter:blur(0.625rem)}
.card .cap{position:absolute;inset:auto 0 0 0;padding:2.125rem 0.75rem 0.625rem 0.875rem;display:flex;align-items:flex-end;justify-content:space-between;gap:0.5rem;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.6));opacity:0;transition:.25s}
.card:hover .cap{opacity:1}
@media(hover:none){.card .cap{opacity:1}}
.card .cap span{font-size:0.8125rem;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ca{display:flex;gap:0.375rem}
.ib{width:2rem;height:2rem;border-radius:50%;display:grid;place-items:center;font-size:1rem;color:#fff;background:rgba(255,255,255,.22);backdrop-filter:blur(0.625rem);-webkit-backdrop-filter:blur(0.625rem);transition:.2s}
.ib:hover{background:rgba(255,255,255,.4)}
.ib.on{background:#ff375f}.ib.on svg{fill:#fff}

/* login */
body{min-height:100vh;display:flex;flex-direction:column}
.hd+*:not(.ft){flex:1 0 auto;width:100%}
body:has(#loginMain) .ft{margin-top:0}
.lg{flex:1;display:flex;padding:clamp(0.75rem,1.2vw,1.5rem) clamp(1rem,3vw,4rem)}
.lg [hidden]{display:none!important}
.lg-wrap{position:relative;flex:1;width:100%;max-width:2560px;margin:0 auto;display:grid;place-items:center}

.lg-x{position:absolute;z-index:4;left:0;top:0;height:2rem;padding:0 0.875rem 0 0.5rem;border-radius:6.1875rem;background:var(--bg2);color:var(--tx2);font-size:0.8125rem;font-weight:600;display:inline-flex;align-items:center;gap:0.125rem;transition:.2s}
.lg-x svg{font-size:1.125rem}
.lg-x:hover{background:var(--bg3);color:var(--tx)}

.lg-pane{width:100%;display:flex;justify-content:center}
.lg-box{width:min(26rem,100%);padding:clamp(1.5rem,2vw,2rem);border-radius:var(--r-lg);background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.05),var(--sh)}
.lg-ok{display:inline-flex;align-items:center;gap:0.375rem;height:1.75rem;padding:0 0.75rem 0 0.5rem;margin-bottom:1rem;border-radius:6.1875rem;background:#e7f7ee;color:#168a48;font-size:0.8125rem;font-weight:600}
.lg-ok svg{font-size:1rem;stroke-width:2.4}
.lg-box h1{font-size:clamp(1.75rem,2.2vw,2.25rem);font-weight:800;letter-spacing:-.04em;line-height:1.15}
.lg-sub{margin-top:0.5rem;color:var(--tx2);font-size:0.9375rem}
.lg-tabs{display:grid;grid-template-columns:1fr 1fr;margin-top:1.5rem;padding:0.1875rem;border-radius:0.875rem;background:var(--bg2)}
.lg-tabs button{display:inline-flex;align-items:center;justify-content:center;gap:0.4375rem;height:2.5rem;border-radius:0.6875rem;font-size:0.9375rem;font-weight:500;color:var(--tx2);transition:.2s}
.lg-tabs button svg{font-size:1.125rem}
.lg-tabs button.on{background:#fff;color:var(--tx);font-weight:600;box-shadow:0 1px 0.25rem rgba(0,0,0,.1),0 0 0 1px rgba(0,0,0,.03)}
.lg-tabs button[data-tab="wx"].on svg{color:#07c160}
.lg-body{margin-top:1.25rem}
.lg-tabs[hidden]+.lg-body{margin-top:1.75rem}
.lg-body>:not([hidden]){animation:lgin .3s cubic-bezier(.2,.8,.2,1)}
@keyframes lgin{from{opacity:0;transform:translateY(0.375rem)}}

.lg-qrw{display:flex;flex-direction:column;align-items:center;text-align:center}
.lg-qr{position:relative;width:16.5rem;height:16.5rem;padding:0.5rem;display:grid;place-items:center;border-radius:1.125rem;background:#fff;box-shadow:0 0 0 1px var(--line),0 0.75rem 2rem rgba(0,0,0,.07)}
.lg-qr #lgQr,.lg-qr svg.q{display:block;width:100%;height:100%}
#lgQr{display:grid;place-items:center}
#lgQr iframe{display:block;width:100%!important;height:100%!important;border:0}
/* 微信内嵌二维码：iframe 固定 291，内容只占上方一块，这里裁切后放大居中 */
.lg-qrw.is-wx .lg-qr{width:273px;height:273px;min-width:273px;min-height:273px;padding:0;overflow:hidden;flex-shrink:0}
.lg-qrw.is-wx .lg-qr #lgQr{position:absolute;inset:0}
.lg-qrw.is-wx #lgQr iframe{position:absolute;top:1.25rem;left:50%;width:291px!important;height:291px!important;transform:translateX(-50%) scale(1.5);transform-origin:50% 0;border:0}
.lg-qr-err{width:100%;height:100%;border-radius:0.75rem;font-size:0.875rem;line-height:1.7;color:var(--tx2);background:var(--bg2)}
.lg-qr-logo{position:absolute;left:50%;top:50%;width:2.875rem;height:2.875rem;margin:-1.4375rem 0 0 -1.4375rem;border-radius:0.8125rem;background:#fff;display:grid;place-items:center}
.lg-qr-logo i{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:0.625rem;background:#07c160;color:#fff}
.lg-qr-logo svg{font-size:1.25rem;stroke-width:1.9}
.lg-qr-s{position:absolute;inset:0;border-radius:inherit;background:rgba(255,255,255,.93);backdrop-filter:blur(0.375rem);-webkit-backdrop-filter:blur(0.375rem);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.375rem;font-size:1rem;font-weight:700}
.lg-qr-s b{display:grid;place-items:center;width:2.875rem;height:2.875rem;margin-bottom:0.25rem;border-radius:50%;background:#07c160;color:#fff}
.lg-qr-s b svg{font-size:1.5rem;stroke-width:2.4}
.lg-qr-s small{font-size:0.8125rem;font-weight:400;color:var(--tx2)}
.lg-qr-t{margin-top:1rem;font-size:1rem;font-weight:600}
.lg-qr-n{margin-top:0.25rem;font-size:0.8125rem;color:var(--tx2)}
.lg-demo{margin-top:0.875rem;font-size:0.75rem;color:var(--tx3);transition:.2s}
.lg-demo:hover{color:var(--tx2)}

.lg-in{display:flex;align-items:center;height:3.25rem;border-radius:0.875rem;background:var(--bg2);border:1px solid transparent;transition:.2s;cursor:text}
.lg-in:focus-within{background:#fff;border-color:var(--ac);box-shadow:0 0 0 0.25rem var(--ac-soft)}
.lg-cc{position:relative;padding:0 0.875rem 0 1rem;font-size:0.9375rem;font-weight:600}
.lg-cc:after{content:"";position:absolute;right:0;top:50%;width:1px;height:1.125rem;margin-top:-0.5625rem;background:rgba(0,0,0,.14)}
.lg-in input{flex:1;min-width:0;height:100%;border:0;background:none;outline:0;padding:0 1rem 0 0.875rem;font:inherit;font-size:1.0625rem;letter-spacing:.02em}
.lg-in input::placeholder{color:var(--tx3);letter-spacing:0}
.lg-btn{width:100%;margin-top:1rem}
.lg-btn:disabled{opacity:.3;cursor:default;transform:none}
.btn-p.lg-btn:disabled:hover{background:var(--tx);transform:none}
.lg-hint{margin-top:0.875rem;font-size:0.8125rem;color:var(--tx3);text-align:center}

.lg-sent{margin-bottom:1.125rem;font-size:0.9375rem;color:var(--tx2)}
.lg-sent b{margin:0 0.375rem;color:var(--tx);font-weight:600}
.lg-sent button{font-size:0.9375rem;color:var(--ac)}
.lg-codes{display:grid;grid-template-columns:repeat(6,1fr);gap:0.5rem}
.lg-codes input{min-width:0;height:3.5rem;text-align:center;font:inherit;font-size:1.5rem;font-weight:700;border:1px solid transparent;border-radius:0.875rem;background:var(--bg2);outline:0;caret-color:var(--ac);transition:.2s}
.lg-codes input:focus{background:#fff;border-color:var(--ac);box-shadow:0 0 0 0.25rem var(--ac-soft)}
.lg-resend{margin-top:1rem;text-align:center}
.lg-resend button{font-size:0.8125rem;font-weight:500;color:var(--ac)}
.lg-resend button:disabled{color:var(--tx3);font-weight:400;cursor:default}

.lg-skip{display:block;margin:0.5rem auto 0;padding:0.5rem 1rem;font-size:0.75rem;color:var(--tx3);transition:.2s}
.lg-skip:hover{color:var(--tx2)}
.lg-qr-m{position:absolute;inset:0;isolation:isolate;overflow:hidden;border-radius:inherit;background:rgba(255,255,255,.4);display:flex;align-items:center;justify-content:center;cursor:pointer}
.lg-qr-g{position:absolute;inset:0.75rem;z-index:-1;opacity:.13;filter:blur(0.0625rem)}
.lg-qr-g svg.q{display:block;width:100%;height:100%}
.lg-qr-p{display:flex;flex-direction:column;align-items:center;gap:0.5rem;padding:0.875rem 0.75rem 0.75rem;border-radius:0.875rem;background:rgba(255,255,255,.96);box-shadow:0 0 0 1px rgba(0,0,0,.05),0 0.5rem 1.5rem rgba(0,0,0,.1);transition:transform .2s}
.lg-qr-m:hover .lg-qr-p{transform:translateY(-1px)}
.lg-qr-m i{display:grid;place-items:center;width:2.125rem;height:2.125rem;border-radius:50%;background:var(--bg2);color:var(--tx);transition:transform .5s cubic-bezier(.2,.8,.2,1),background .2s}
.lg-qr-m i svg{font-size:1.0625rem;stroke-width:2}
.lg-qr-m:hover i{background:var(--bg3)}
.lg-qr-m.spin i{transform:rotate(360deg)}
.lg-qr-w{font-size:0.75rem;line-height:1.5;color:var(--tx2);text-align:center}
.lg-qr-w b{display:block;color:var(--tx);font-weight:600}

.lg-agree{display:flex;align-items:center;gap:0.3125rem;margin:1.25rem -0.75rem 0;padding:0.375rem 0.75rem;border-radius:0.75rem;font-size:0.8125rem;line-height:1.5;color:var(--tx2);transition:background .25s,color .25s}
.lg-ckw{position:relative;flex:none;display:grid;place-items:center;width:1.75rem;height:1.75rem;margin-left:-0.3125rem;cursor:pointer}
.lg-ckw input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.lg-ck{display:grid;place-items:center;width:1.125rem;height:1.125rem;border-radius:0.3125rem;border:1.5px solid #c4c4c9;background:#fff;color:#fff;transition:.2s;pointer-events:none}
.lg-ck svg{font-size:0.875rem;stroke-width:3.2;opacity:0;transform:scale(.6);transition:.2s}
.lg-agree input:checked+.lg-ck{background:var(--ac);border-color:var(--ac)}
.lg-agree input:checked+.lg-ck svg{opacity:1;transform:none}
.lg-agree input:focus-visible+.lg-ck{box-shadow:0 0 0 0.25rem var(--ac-soft)}
.lg-ln{color:var(--tx);font-weight:500}
a.lg-ln:hover{text-decoration:underline}
.lg-agree.warn{background:#fff1f0;color:#b3261e;animation:lgshake .42s}
.lg-agree.warn .lg-ck{border-color:#ff3b30;box-shadow:0 0 0 0.25rem rgba(255,59,48,.16)}
.lg-agree.warn .lg-ln{color:#b3261e}
@keyframes lgshake{0%,100%{transform:none}20%{transform:translateX(-0.375rem)}40%{transform:translateX(0.375rem)}60%{transform:translateX(-0.25rem)}80%{transform:translateX(0.25rem)}}
.lg-agree-tip{margin-top:0.125rem;font-size:0.75rem;font-weight:500;color:#e5382d}

@media(max-width:600px){
  .lg-box{padding:1.5rem 1.25rem;box-shadow:none}
  .lg-pane{padding-top:2.75rem}
}

/* 协议文档：纸张、宋体、条款编号 */
.doc-p{counter-reset:c;width:min(250mm,100% - 2.5rem);margin:3rem auto 4rem;padding:2.5rem 3rem 2.75rem;background:#fff;color:var(--tx);line-height:1.7;font-family:"Songti SC","Noto Serif CJK SC","Source Han Serif SC",STSong,SimSun,serif;box-shadow:0 0 0 1px var(--line),0 0.5rem 2rem rgba(0,0,0,.04);border-radius:0.75rem}
.doc-p h1{margin-bottom:0.4rem;text-align:center;font-size:1.0625rem;font-weight:700;letter-spacing:.3em;text-indent:.3em}
.doc-p .lead{margin-bottom:1.5rem;text-align:center;font-size:0.6875rem;color:var(--tx3)}
.doc-p h2{margin-top:1.1rem;padding-bottom:0.3rem;border-bottom:1px solid var(--line);font-size:0.8125rem;font-weight:700}
.doc-p h2:before{counter-increment:c;content:"第" counter(c,cjk-ideographic) "条　"}
.doc-p p{margin-top:0.3rem;font-size:0.75rem;text-align:justify;text-indent:2em}
.doc-p .doc-k{margin:0.7rem 0 0.5rem;padding:0.6rem 0.875rem;border-left:3px solid var(--tx);background:var(--bg2);font-size:0.75rem;font-weight:700;line-height:1.65}
.doc-p .sig{margin-top:2.25rem;text-align:right;font-size:0.75rem;text-indent:0}
.doc-p .sig span{display:block;margin-top:0.15rem;color:var(--tx2);font-size:0.6875rem}
@media(max-width:600px){.doc-p{width:auto;margin:1.5rem 0.75rem 2.5rem;padding:2rem 1.25rem;border-radius:0.5rem}}

/* footer */
.ft{margin-top:4.5rem;border-top:1px solid var(--line);padding:1.75rem 0 2.25rem;color:var(--tx2);font-size:0.8125rem}
.dnote{margin-top:0.875rem;font-size:0.6875rem;line-height:1.7;color:var(--tx3)}
.err{display:grid;place-items:center;min-height:62vh;padding:3rem 1.25rem}
.err-in{text-align:center;max-width:26rem}
.err-code{font-size:clamp(4rem,10vw,6rem);font-weight:800;letter-spacing:-.04em;line-height:1;color:var(--bg3)}
.err h1{margin-top:1rem;font-size:1.5rem;font-weight:700;letter-spacing:-.02em}
.err-msg{margin-top:0.75rem;color:var(--tx2);font-size:0.9375rem;line-height:1.7}
.err-acts{margin-top:2rem;display:flex;gap:0.75rem;justify-content:center;flex-wrap:wrap}
.ft-line{display:flex;justify-content:space-between;align-items:center;gap:1rem 2rem;flex-wrap:wrap}
.ft-nav{display:flex;gap:0.5rem 1.75rem;flex-wrap:wrap}
.ft-info{display:flex;align-items:center;gap:0.5rem 1.25rem;flex-wrap:wrap;font-size:0.75rem;color:var(--tx2)}
.ft-beian{display:flex;gap:0 1rem}
.ft a{color:var(--tx2);transition:color .2s}
.ft a:hover{color:var(--tx)}

/* toast */
.toast{position:fixed;left:50%;bottom:2.25rem;transform:translate(-50%,1.25rem);z-index:300;background:rgba(29,29,31,.92);color:#fff;padding:0.625rem 1.25rem;border-radius:6.1875rem;font-size:0.875rem;opacity:0;pointer-events:none;transition:.3s;backdrop-filter:blur(0.625rem)}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ===== detail view ===== */
.ov{position:fixed;inset:0;z-index:100;background:#fff;opacity:0;visibility:hidden;transform:scale(.985);transition:opacity .25s,transform .3s cubic-bezier(.2,.8,.2,1),visibility .25s}
.ov.open{opacity:1;visibility:visible;transform:none}
body.lock{overflow:hidden}
.dv{--vh:100vh;height:var(--vh);display:flex;flex-direction:column;background:#fff}
.dv-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) clamp(25rem,26vw,38.75rem)}
.dv-stage{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:0.875rem;min-height:0;container-type:size;background:var(--bg3)}
.dv-stage .bg{position:absolute;inset:0;overflow:hidden}
.dv-stage .bg img{width:100%;height:100%;object-fit:cover;filter:blur(2.625rem) saturate(1.25);transform:scale(1.25);opacity:.85}
.dv-stage .bg:after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.28)}
.frame{position:relative;z-index:1;width:min(100cqw,160cqh);aspect-ratio:16/10;border-radius:0.75rem;overflow:hidden;background:var(--bg3);box-shadow:0 2px 0.5rem rgba(0,0,0,.1),0 1.75rem 4.375rem rgba(0,0,0,.28)}
.frame>img{width:100%;height:100%;object-fit:cover}
.dv-stage .x{position:absolute;z-index:3;left:1rem;top:1rem;height:2rem;padding:0 0.875rem;border-radius:6.1875rem;background:rgba(29,29,31,.55);color:#fff;backdrop-filter:blur(0.75rem);-webkit-backdrop-filter:blur(0.75rem);font-size:0.8125rem;font-weight:600;letter-spacing:.04em;display:inline-flex;align-items:center;transition:background .2s}
.dv-stage .x:hover{background:rgba(29,29,31,.78)}
.nv{opacity:0;transition:opacity .25s,background .2s,transform .2s}
.dv-stage:hover .nv{opacity:1}
@media(hover:none){.nv{opacity:1}}
.nv{position:absolute;top:50%;transform:translateY(-50%);width:3rem;height:3rem;border-radius:50%;background:rgba(255,255,255,.92);box-shadow:0 2px 0.75rem rgba(0,0,0,.18);display:grid;place-items:center;font-size:1.375rem;z-index:3}
.nv:hover{background:#fff;transform:translateY(-50%) scale(1.08)}
.nv.l{left:1rem}.nv.r{right:1rem}
.nv[disabled]{opacity:0!important;pointer-events:none}
.dv-side{overflow-y:auto;padding:1.625rem 1.75rem 2.5rem;border-left:1px solid var(--line);scrollbar-width:thin}
.dv-side{overflow-y:auto;padding:1.625rem 1.75rem 2.5rem;border-left:1px solid var(--line);scrollbar-width:thin}
.chips{display:flex;gap:0.5rem;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;height:1.75rem;padding:0 0.75rem;border-radius:6.1875rem;background:var(--bg2);font-size:0.8125rem;color:var(--tx2);transition:.2s}
a.chip:hover{background:var(--ac-soft);color:var(--ac)}
.dv-side h1{font-size:1.5rem;line-height:1.3;font-weight:700;letter-spacing:-.3px;margin:0.875rem 0 0.375rem}
.meta{font-size:0.8125rem;color:var(--tx3)}
.blk{margin-top:1.625rem}
.blk>h3{font-size:0.8125rem;font-weight:600;color:var(--tx2);margin-bottom:0.75rem;letter-spacing:.3px;display:flex;justify-content:space-between;align-items:center}
.blk>h3 small{font-weight:400;color:var(--tx3)}
.tiers{display:grid;gap:0.5rem}
.tier{display:flex;align-items:center;gap:0.75rem;padding:0.6875rem 0.875rem;border:1.5px solid var(--line);border-radius:0.75rem;cursor:pointer;transition:.18s;text-align:left;width:100%}
.tier:hover{border-color:#c7c7cc}
.tier.on{border-color:var(--ac);background:var(--ac-soft)}
.tier .rd{width:1.125rem;height:1.125rem;border-radius:50%;border:2px solid #c7c7cc;display:grid;place-items:center;flex:none}
.tier.on .rd{border-color:var(--ac)}.tier.on .rd:after{content:"";width:0.5rem;height:0.5rem;border-radius:50%;background:var(--ac)}
.tier .t1{font-weight:600;font-size:0.9375rem;display:flex;align-items:center;gap:0.5rem}
.tier .t2{font-size:0.75rem;color:var(--tx2)}
.tier .sz{margin-left:auto;font-size:0.75rem;color:var(--tx3);white-space:nowrap}
.tier em{font-style:normal;font-size:0.6875rem;font-weight:600;color:var(--ac);background:#fff;border:1px solid rgba(0,113,227,.25);border-radius:6.1875rem;padding:0 0.4375rem;line-height:1.125rem}
.dl{margin-top:0.75rem;width:100%}
.acts{display:grid;grid-template-columns:repeat(3,1fr);gap:0.5rem;margin-top:0.625rem}
.acts .btn{height:2.5rem;padding:0 0.5rem;font-size:0.875rem}
.acts .btn.on{background:#ffe9ee;color:#ff375f}.acts .btn.on svg{fill:#ff375f}
.radar{display:block;width:15.3rem;height:auto;margin:0 auto;overflow:visible}
.radar text{stroke:none}
.radar .rg{fill:none;stroke:var(--line);stroke-width:1}
.radar .ax{stroke:var(--line);stroke-width:1}
.radar .pl{fill:rgba(0,113,227,.16);stroke:var(--ac);stroke-width:1.6;stroke-linejoin:round}
.radar .dt{fill:#fff;stroke:var(--ac);stroke-width:1.6}
.radar .lb{font-size:20.1px;font-weight:400;fill:#3a3a3c;font-family:var(--font)}
.radar .vl{font-size:20.1px;font-weight:400;fill:#3a3a3c;font-family:var(--font)}
.desc{font-size:0.9062rem;line-height:1.75;color:#3a3a3c}
.desc.clamp{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.tg{margin-top:0.375rem;color:var(--ac);font-size:0.8125rem}
@media(max-width:1000px){
  .dv{height:auto;min-height:var(--vh)}
  .ov .dv{height:100%;overflow-y:auto}
  .dv-body{display:block}
  .dv-stage{container-type:inline-size;padding:0.75rem;display:flex}
  .dv-stage .frame{width:100cqw}
  .nv{width:2.5rem;height:2.5rem}.nv.l{left:0.375rem}.nv.r{right:0.375rem}
  .dv-side{border-left:0;overflow:visible;padding:1.375rem 1.125rem 2.5rem}
}

/* album card */
.alb{display:block}
.alb-st{position:relative;display:block;padding-bottom:0.8rem}
.alb .ly{position:absolute;border-radius:var(--r);background:#e3e3e8;box-shadow:0 0 0 1px rgba(0,0,0,.03)}
.alb .ly.l1{left:3%;right:3%;top:0.45rem;bottom:0.4rem;background:#e9e9ee}
.alb .ly.l2{left:6%;right:6%;top:0.9rem;bottom:0;background:#f0f0f4}
.alb-cv{position:relative;z-index:1;display:block;aspect-ratio:16/10;border-radius:var(--r);overflow:hidden;background:var(--bg3);box-shadow:0 1px 0.25rem rgba(0,0,0,.08);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.alb-cv img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.alb:hover .alb-cv{transform:translateY(-0.2rem);box-shadow:var(--sh-h)}
.alb:hover img{transform:scale(1.045)}
.alb .tag,.alb .cnt{position:absolute;top:0.625rem;padding:0.1875rem 0.625rem;border-radius:99px;font-size:0.75rem;font-weight:500;color:#fff;background:rgba(0,0,0,.34);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.alb .tag{left:0.625rem}.alb .cnt{right:0.625rem}
.alb-t{display:block;margin-top:0.625rem}
.alb-t b{display:block;font-size:1rem;font-weight:600;letter-spacing:-.01em}
.alb-t small{font-size:0.8125rem;color:var(--tx2)}
.albrow{display:flex;align-items:center;gap:0.625rem;margin-top:1rem;padding:0.625rem 0.875rem;border-radius:0.75rem;background:var(--bg2);font-size:0.8125rem;transition:.2s}
.albrow:hover{background:var(--ac-soft)}
.albrow span{color:var(--tx3);flex:none}.albrow b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.albrow em{font-style:normal;color:var(--tx2);margin-left:auto;flex:none}.albrow svg{flex:none;color:var(--tx3)}

.btn.on{color:#ff375f}.btn.on svg{fill:#ff375f}

/* ===== gallery ===== */
.ph{padding-top:clamp(1.25rem,2vw,2.75rem);padding-bottom:0.375rem}
.ph h1{font-size:1.875rem;font-weight:800;letter-spacing:-.6px}
.ph p{color:var(--tx2);font-size:0.875rem;margin-top:2px}
.fb{position:sticky;top:var(--hd);z-index:40;background:rgba(255,255,255,.86);backdrop-filter:saturate(180%) blur(1.25rem);-webkit-backdrop-filter:saturate(180%) blur(1.25rem);border-bottom:1px solid var(--line);margin-top:0.875rem}
.fb-in{padding-top:0.75rem;padding-bottom:0.75rem;display:flex;align-items:center;gap:1rem}
.seg2{display:flex;padding:0.1875rem;border-radius:6.1875rem;background:var(--bg2);flex:none}
.seg2 a{display:inline-flex;align-items:center;white-space:nowrap;height:2rem;padding:0 1rem;border-radius:6.1875rem;font-size:0.875rem;font-weight:500;color:var(--tx2);transition:.2s}
.seg2 a.on{background:#fff;color:var(--tx);box-shadow:0 1px 0.25rem rgba(0,0,0,.12)}
.types{display:flex;gap:0.5rem;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0}
.types::-webkit-scrollbar{display:none}
.types a{display:inline-flex;align-items:center;flex:none;height:2rem;padding:0 0.875rem;border-radius:6.1875rem;border:1px solid var(--line);font-size:0.875rem;color:var(--tx2);transition:.2s;background:#fff}
.types a:hover{border-color:#c7c7cc;color:var(--tx)}
.types a.on{background:var(--tx);border-color:var(--tx);color:#fff}
.sort{flex:none;position:relative}
.sort select{appearance:none;-webkit-appearance:none;height:2.125rem;border-radius:6.1875rem;border:1px solid var(--line);background:#fff;padding:0 2rem 0 0.875rem;font:inherit;font-size:0.875rem;cursor:pointer;outline:0}
.sort:after{content:"";position:absolute;right:0.8125rem;top:0.875rem;width:0.375rem;height:0.375rem;border:solid var(--tx2);border-width:0 1.5px 1.5px 0;transform:rotate(45deg);pointer-events:none}
.stat{display:flex;align-items:center;justify-content:space-between;padding:1.125rem 0 0.875rem;font-size:0.8125rem;color:var(--tx2)}
.stat b{color:var(--tx)}
.stat .kw{display:inline-flex;align-items:center;gap:0.375rem;margin-left:0.625rem;padding:2px 0.25rem 2px 0.75rem;border-radius:6.1875rem;background:var(--ac-soft);color:var(--ac)}
.stat .kw a{display:inline-grid;place-items:center;width:1.25rem;height:1.25rem;border-radius:50%;font-size:0.875rem}
.stat .kw a:hover{background:rgba(0,113,227,.15)}
.end{text-align:center;color:var(--tx3);font-size:0.8125rem;padding:2.5rem 0 0.25rem}
.empty{text-align:center;padding:5.625rem 0;color:var(--tx2)}
.empty b{display:block;font-size:1.25rem;color:var(--tx);margin-bottom:0.375rem}
.sk{display:grid;grid-template-columns:repeat(auto-fill,minmax(16.875rem,1fr));gap:1rem;margin-top:1rem}
.sk i{aspect-ratio:16/10;border-radius:var(--r);background:linear-gradient(90deg,var(--bg2),var(--bg3),var(--bg2));background-size:200% 100%;animation:sh 1.2s infinite}
@keyframes sh{to{background-position:-200% 0}}
@media(max-width:900px){.fb-in{flex-wrap:wrap;gap:0.625rem}.types{order:3;flex-basis:100%}.sort{margin-left:auto}}

/* ===== home ===== */
.intro{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;padding-top:clamp(1.25rem,2vw,2.75rem);padding-bottom:clamp(1rem,1.4vw,1.75rem)}
.intro h1{font-size:clamp(1.75rem,2.6vw,3.25rem);font-weight:800;letter-spacing:-.035em;line-height:1.15;margin-top:0.75rem}
@media(max-width:900px){.intro{flex-direction:column;align-items:stretch;gap:1rem}}
.feat{--bh:clamp(24rem,calc(100vh - var(--hd) - 15rem),42rem);display:grid;grid-template-columns:calc(var(--bh)*1.6) minmax(0,1fr);gap:clamp(0.75rem,1.2vw,1.5rem);height:var(--bh)}
.feat-cv{position:relative;display:block;border-radius:var(--r-lg);overflow:hidden;background:var(--bg3);box-shadow:var(--sh)}
.feat-cv img{width:100%;height:100%;object-fit:cover}
.feat-cv:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.5),transparent 40%)}
.feat-cv .lb{position:absolute;z-index:2;left:1.25rem;top:1.25rem;padding:0.3125rem 0.875rem;border-radius:99px;background:rgba(255,255,255,.9);font-size:0.8125rem;font-weight:600}
.feat-cap{position:absolute;z-index:2;left:1.5rem;right:1.5rem;bottom:1.375rem;color:#fff}
.feat-cap b{display:block;font-size:clamp(1.25rem,1.9vw,2.25rem);letter-spacing:-.02em;line-height:1.2}
.feat-cap span{font-size:0.875rem;opacity:.85}
.feat-pn{display:flex;flex-direction:column;min-width:0;min-height:0;padding:clamp(1.25rem,2vw,2.5rem);border-radius:var(--r-lg);background:var(--bg2)}
.feat-pn .ey{font-size:0.8125rem;font-weight:600;color:var(--ac)}
.feat-pn h2{font-size:clamp(1.375rem,2vw,2.375rem);font-weight:800;letter-spacing:-.03em;line-height:1.2;margin:0.5rem 0 0.625rem}
.feat-pn p{font-size:0.9375rem;line-height:1.7;color:var(--tx2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.feat-pn .th{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0.75rem;margin-top:auto;padding-top:1.25rem}
.feat-pn .th a{aspect-ratio:16/10;border-radius:0.75rem;overflow:hidden;background:var(--bg3)}
.feat-pn .th img{width:100%;height:100%;object-fit:cover}
.feat-pn .row{display:flex;gap:0.625rem;margin-top:1.25rem}
.feat-pn .row .btn:first-child{flex:1}
@media(max-width:1100px){.feat{grid-template-columns:1fr;height:auto}.feat-cv{aspect-ratio:16/10}}
.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(0.75rem,1.1vw,1.5rem)}
@media(max-width:1000px){.cats{grid-template-columns:repeat(2,1fr)}}
.cat{position:relative;display:block;aspect-ratio:16/10;border-radius:var(--r);overflow:hidden;background:var(--bg3)}
.cat img{width:100%;height:100%;object-fit:cover}
.cat:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.62),transparent 62%)}
.cat:hover{transform:translateY(-0.1875rem);box-shadow:var(--sh-h)}
.cat div{position:absolute;z-index:2;left:1rem;bottom:0.75rem;right:1rem;color:#fff;display:flex;justify-content:space-between;align-items:flex-end}
.cat b{font-size:1.1875rem}.cat small{font-size:0.75rem;opacity:.85}
.cat i{position:absolute;z-index:2;left:0.875rem;top:0.75rem;font-style:normal;font-size:0.75rem;color:#fff;background:rgba(0,0,0,.3);padding:0.125rem 0.625rem;border-radius:99px}
.albs{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(0.75rem,1.1vw,1.5rem)}
@media(max-width:1100px){.albs{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.albs{grid-template-columns:repeat(2,1fr);gap:0.625rem}}
.more svg{font-size:1rem;vertical-align:-0.15em}

/* album page */
.ah{position:relative;overflow:hidden;background:var(--bg3)}
.ah-bg{position:absolute;inset:0}
.ah-bg img{width:100%;height:100%;object-fit:cover;filter:blur(3rem) saturate(1.3);transform:scale(1.3);opacity:.9}
.ah-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,.82))}
.ah-in{position:relative;display:grid;grid-template-columns:minmax(0,min(62%,calc((100vh - var(--hd) - 9rem)*1.6))) minmax(0,1fr);gap:clamp(1.5rem,3.2vw,5rem);align-items:center;padding-top:clamp(1.25rem,2.4vw,3.5rem);padding-bottom:clamp(1.25rem,2.4vw,3.5rem)}
.ah-cv{position:relative;display:block;aspect-ratio:16/10;border-radius:var(--r-lg);overflow:hidden;box-shadow:0 1.75rem 4.375rem rgba(0,0,0,.25);background:var(--bg3)}
.ah-cv img{width:100%;height:100%;object-fit:cover}
.crumb{display:flex;align-items:center;gap:0.375rem;font-size:0.8125rem;color:var(--tx2);margin-bottom:1rem}
.crumb a:hover{color:var(--ac)}
.ah-t .ey{display:inline-block;padding:0.25rem 0.75rem;border-radius:99px;background:rgba(255,255,255,.75);font-size:0.8125rem;font-weight:600;color:var(--ac)}
.ah-t h1{font-size:clamp(1.75rem,3vw,3.5rem);font-weight:800;letter-spacing:-.035em;line-height:1.15;margin:0.875rem 0 0.75rem}
.ah-t p{font-size:1rem;line-height:1.8;color:#3a3a3c;max-width:32em}
.ah-t .chips{margin-top:1.25rem}
.ah-t .row{display:flex;gap:0.625rem;margin-top:1.75rem;flex-wrap:wrap}
@media(max-width:1000px){.ah-in{grid-template-columns:1fr}}
.pn{display:grid;grid-template-columns:1fr 1fr;gap:clamp(0.75rem,1.1vw,1.5rem)}
@media(max-width:700px){.pn{grid-template-columns:1fr}}
.pn a,.pn .none{display:flex;align-items:center;gap:1rem;padding:0.875rem;border-radius:var(--r);background:var(--bg2);min-width:0}
.pn a:hover{background:#fff;box-shadow:var(--sh)}
.pn a.r,.pn .none.r{flex-direction:row-reverse;text-align:right}
.pn img{width:7.5rem;aspect-ratio:16/10;object-fit:cover;border-radius:0.625rem;flex:none}
.pn small{display:block;font-size:0.75rem;color:var(--tx3)}
.pn b{display:block;font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pn .none{opacity:.45}

/* about / favorites */
.ab{max-width:46rem;margin:0 auto;padding:3rem 0 0}
.ab h1{font-size:clamp(1.875rem,4vw,2.875rem);font-weight:800;letter-spacing:-1px;line-height:1.15}
.ab .lead{margin-top:1rem;font-size:1.0625rem;color:var(--tx2);line-height:1.7}
.nums{display:grid;grid-template-columns:repeat(3,1fr);gap:0.875rem;margin:2rem 0 0.5rem}
.nums div{padding:1.25rem;border-radius:var(--r-lg);background:var(--bg2)}
.nums b{display:block;font-size:1.75rem;font-weight:800;letter-spacing:-1px}
.nums span{font-size:0.8125rem;color:var(--tx2)}
.ab h2{font-size:1.25rem;margin:2.25rem 0 0.5rem}
.ab p,.ab li{color:#3a3a3c;line-height:1.8}
.ab ul{padding-left:1.25rem}
@media(max-width:700px){.nums{grid-template-columns:1fr}}
.fav-empty .ico{width:5.25rem;height:5.25rem;margin:0 auto 1.25rem;border-radius:50%;background:var(--bg2);display:grid;place-items:center;font-size:2rem;color:var(--tx3)}
.fav-empty{padding-top:4rem}

.pager{display:none}
html:not(.js) .pager{display:inline-flex}
.pgs{display:flex;gap:0.75rem;justify-content:center;padding-top:1.5rem}
.loading{text-align:center;color:var(--tx3);font-size:0.8125rem;padding:2.5rem 0 0.25rem}

/* featured list：长条卡片，图贴左上下，文字居中，查看在右 */
.fl{display:flex;flex-direction:column;gap:clamp(0.75rem,1.1vw,1.25rem);padding-bottom:2rem}
.fi{--h:clamp(9.5rem,13vw,13rem);display:grid;grid-template-columns:calc(var(--h)*1.6) minmax(0,1fr) auto;align-items:stretch;height:var(--h);border-radius:var(--r-lg);overflow:hidden;background:var(--bg2);transition:background .25s,box-shadow .25s}
.fi:hover{background:#fff;box-shadow:var(--sh)}
.fi-cv{display:block;overflow:hidden;background:var(--bg3)}
.fi-cv img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.fi:hover .fi-cv img{transform:scale(1.04)}
.fi-t{display:flex;flex-direction:column;justify-content:space-between;min-width:0;padding:clamp(1rem,1.6vw,1.75rem) clamp(1rem,2vw,2.25rem)}
.fi-top{display:block;min-width:0}
.fi-m{display:flex;align-items:center;gap:0.625rem;min-height:1.25rem;font-size:0.8125rem;font-variant-numeric:tabular-nums;color:var(--tx3)}
.fi-new{font-style:normal;font-weight:700;font-size:0.6875rem;letter-spacing:0.16em;line-height:1;color:#e10600}
.fi-new:before{content:"";display:inline-block;width:0.3125rem;height:0.3125rem;margin-right:0.375rem;border-radius:50%;background:#e10600;vertical-align:0.05em}
.fi-t b{display:block;font-size:clamp(1.125rem,1.6vw,1.5rem);letter-spacing:-.02em;margin:0.25rem 0 0.375rem}
.fi-p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:0.9375rem;line-height:1.7;color:var(--tx2)}
.fi-n{display:block;font-size:0.8125rem;color:var(--tx3)}
.fi-go{display:flex;align-items:center;padding-right:clamp(1rem,2vw,2rem)}
.fi-go .btn{background:#fff;box-shadow:0 1px 0.25rem rgba(0,0,0,.06)}
.fi-go .btn svg{font-size:1rem}
.fi:hover .fi-go .btn{background:var(--tx);color:#fff}
@media(max-width:700px){.fi{height:auto;grid-template-columns:1fr}.fi-cv{aspect-ratio:16/10}.fi-go{padding:0 1rem 1rem}}


/* VIP 页：照 demo/vip.html 的样式，全部限定在 .vippage 下 */
.vippage{--gold:#f1d3a0;--gold2:#c99a52;--ink:#16161a}
.vippage{--gold:#f1d3a0;--gold2:#c99a52;--ink:#16161a}.vippage .gate{display:flex;align-items:center;gap:0.75rem;margin-top:clamp(1rem,1.6vw,2rem);padding:0.75rem 1.125rem;border-radius:0.875rem;background:#fff8ec;border:1px solid #f3dfb9;color:#7a5a1f;font-size:0.9375rem}.vippage .gate svg{font-size:1.25rem;flex:none}.vippage .gate b{font-weight:700}.vippage .gate a{margin-left:auto;color:#7a5a1f;font-size:0.875rem;text-decoration:underline;white-space:nowrap}.vippage /* hero */
.vh{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(1.5rem,4vw,6rem);align-items:center;padding-top:clamp(1.5rem,3vw,4.5rem);padding-bottom:clamp(1rem,2vw,3rem)}.vippage .crown{display:inline-flex;align-items:center;gap:0.5rem;padding:0.3125rem 0.875rem;border-radius:99px;background:linear-gradient(135deg,var(--ink),#34343a);color:var(--gold);font-size:0.8125rem;font-weight:700;letter-spacing:.06em}.vippage .crown svg{font-size:1rem}.vippage .vh h1{font-size:clamp(2rem,3.8vw,4.5rem);font-weight:800;letter-spacing:-.04em;line-height:1.12;margin:1.125rem 0 1rem}.vippage .vh h1 span{background:linear-gradient(90deg,var(--gold2),#e8b866 50%,#b57d2e);-webkit-background-clip:text;background-clip:text;color:transparent}.vippage .vh p{font-size:1.0625rem;line-height:1.75;color:var(--tx2);max-width:30em}.vippage .vh .row{display:flex;gap:0.75rem;margin-top:1.75rem;flex-wrap:wrap;align-items:center}.vippage .vh .row small{color:var(--tx3);font-size:0.8125rem}.vippage .btn-gold{background:linear-gradient(135deg,#f6dcae,#d9aa62);color:#3b2a0c;box-shadow:0 0.375rem 1.25rem rgba(201,154,82,.35)}.vippage .btn-gold:hover{transform:translateY(-1px);box-shadow:0 0.625rem 1.75rem rgba(201,154,82,.45)}.vippage /* 清晰度对比：左 免费 / 右 VIP */
.cmp{position:relative;aspect-ratio:16/10;border-radius:var(--r-lg);overflow:hidden;box-shadow:0 0.125rem 0.5rem rgba(0,0,0,.1),0 1.75rem 4.375rem rgba(0,0,0,.22);background:var(--bg3)}.vippage .cmp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.vippage .cmp .lo{filter:blur(0.1875rem) saturate(.85) contrast(.95);clip-path:inset(0 50% 0 0)}.vippage .cmp .ln{position:absolute;top:0;bottom:0;left:50%;width:2px;background:#fff;box-shadow:0 0 0.75rem rgba(0,0,0,.35);z-index:2}.vippage .cmp .kn{position:absolute;z-index:3;left:50%;top:50%;width:2.5rem;height:2.5rem;margin:-1.25rem 0 0 -1.25rem;border-radius:50%;background:#fff;box-shadow:0 0.125rem 0.75rem rgba(0,0,0,.3);display:grid;place-items:center;font-size:1.125rem;color:var(--tx2)}.vippage .cmp .tg{position:absolute;z-index:3;bottom:1rem;padding:0.375rem 0.875rem;border-radius:99px;font-size:0.8125rem;font-weight:700;backdrop-filter:blur(10px)}.vippage .cmp .tg.a{left:1rem;background:rgba(0,0,0,.45);color:#fff}.vippage .cmp .tg.b{right:1rem;background:linear-gradient(135deg,#f6dcae,#d9aa62);color:#3b2a0c}.vippage /* 价值点 */
.vals{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(0.75rem,1.1vw,1.5rem)}@media(max-width:900px){.vippage .vals{grid-template-columns:1fr}}.vippage .val{padding:1.75rem;border-radius:var(--r-lg);background:var(--bg2)}.vippage .val .ic{width:2.75rem;height:2.75rem;border-radius:0.875rem;background:var(--ink);color:var(--gold);display:grid;place-items:center;font-size:1.375rem}.vippage .val h3{font-size:1.25rem;margin:1.125rem 0 0.5rem;letter-spacing:-.02em}.vippage .val p{font-size:0.9375rem;line-height:1.7;color:var(--tx2)}.vippage /* 价格 */
.plans{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.18fr);gap:clamp(0.75rem,1.4vw,1.75rem);align-items:stretch;max-width:68rem;margin:0 auto}@media(max-width:800px){.vippage .plans{grid-template-columns:1fr}}.vippage .plan{position:relative;padding:clamp(1.5rem,2.2vw,2.5rem);border-radius:var(--r-lg);display:flex;flex-direction:column}.vippage .plan h3{font-size:1.25rem;font-weight:700;display:flex;align-items:center;gap:0.625rem}.vippage .plan .cur{font-size:0.75rem;font-weight:600;padding:0.125rem 0.625rem;border-radius:99px;background:var(--bg3);color:var(--tx2)}.vippage .plan .sub{font-size:0.875rem;margin-top:0.25rem}.vippage .plan ul{list-style:none;margin:1.5rem 0 0;display:grid;gap:0.75rem;font-size:0.9375rem}.vippage .plan li{display:flex;gap:0.625rem;align-items:flex-start;line-height:1.5}.vippage .plan li svg{margin-top:0.2rem;font-size:1rem}.vippage .free{background:var(--bg2);border:1px solid var(--line)}.vippage .free .sub{color:var(--tx2)}.vippage .free .price{font-size:3rem;font-weight:800;letter-spacing:-.04em;margin:1.25rem 0 0.25rem}.vippage .free .price small{font-size:1rem;font-weight:500;color:var(--tx2);margin-left:0.25rem}.vippage .free li svg{color:var(--tx3)}.vippage .free li.no{color:var(--tx3)}.vippage .free .btn{margin-top:auto}.vippage .free ul{margin-bottom:1.75rem}.vippage .vip{background:radial-gradient(120% 90% at 100% 0%,#3a3126 0,#1b1b1f 55%);color:#fff;box-shadow:0 1.5rem 4rem rgba(22,22,26,.3)}.vippage .vip .sub{color:#b9b1a3}.vippage .vip h3 .rec{font-size:0.75rem;font-weight:700;padding:0.1875rem 0.625rem;border-radius:99px;background:linear-gradient(135deg,#f6dcae,#d9aa62);color:#3b2a0c}.vippage .vip li svg{color:var(--gold)}.vippage .vip li b{color:var(--gold);font-weight:600}.vippage .tog{display:inline-flex;margin-top:1.25rem;padding:0.25rem;border-radius:99px;background:rgba(255,255,255,.1);align-self:flex-start}.vippage .tog button{height:2.25rem;padding:0 1.125rem;border-radius:99px;font-size:0.875rem;font-weight:600;color:#cfc7b8;display:inline-flex;align-items:center;gap:0.5rem}.vippage .tog button.on{background:#fff;color:var(--ink)}.vippage .tog button i{font-style:normal;font-size:0.6875rem;padding:0.0625rem 0.4375rem;border-radius:99px;background:#ff5c3a;color:#fff}.vippage .vip .price{display:flex;align-items:baseline;gap:0.75rem;margin:1.125rem 0 0.25rem;flex-wrap:wrap}.vippage .vip .price .now{font-size:3.25rem;font-weight:800;letter-spacing:-.04em;color:var(--gold);line-height:1}.vippage .vip .price .now small{font-size:1.25rem;font-weight:700;margin-right:0.125rem}.vippage .vip .price .per{font-size:1rem;color:#cfc7b8}.vippage .vip .price s{font-size:1rem;color:#8c8578}.vippage .vip .hint{font-size:0.8125rem;color:#cfc7b8}.vippage .vip .hint b{color:#ff9d85;font-weight:600}.vippage .vip .cta{margin-top:auto;padding-top:1.75rem}.vippage .vip .cta .btn{width:100%}.vippage .vip .cta small{display:block;text-align:center;margin-top:0.75rem;font-size:0.75rem;color:#9a9283}.vippage .vip ul{margin-top:1.375rem}.vippage /* 对比表 */
.tb{width:100%;max-width:68rem;margin:0 auto;border-collapse:separate;border-spacing:0;font-size:0.9375rem}.vippage .tb th,.vippage .tb td{padding:0.875rem 1rem;border-bottom:1px solid var(--line);text-align:center}.vippage .tb th:first-child,.vippage .tb td:first-child{text-align:left;width:42%}.vippage .tb thead th{position:sticky;top:var(--hd);z-index:5;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);font-size:1rem;padding:1rem}.vippage .tb thead th.v{color:var(--gold2)}.vippage .tb .grp td{background:var(--bg2);font-size:0.8125rem;font-weight:700;color:var(--tx2);letter-spacing:.06em;text-align:left;padding:0.625rem 1rem}.vippage .tb td.v{background:#fffaf1;font-weight:600}.vippage .tb .grp td.v{background:#fbf1de}.vippage .tb .k small{display:block;color:var(--tx3);font-size:0.8125rem;margin-top:0.125rem;font-weight:400}.vippage .tb .y{color:#1ea75a;font-size:1.125rem}.vippage .tb .n{color:var(--tx3)}.vippage .tb td.v .y{color:var(--gold2)}@media(max-width:700px){.vippage .tb th,.vippage .tb td{padding:0.75rem 0.5rem;font-size:0.8125rem}.vippage .tb th:first-child,.vippage .tb td:first-child{width:46%}}.vippage /* faq + 底部 CTA */
.faq{max-width:52rem;margin:0 auto}.vippage .faq details{border-bottom:1px solid var(--line);padding:1.125rem 0}.vippage .faq summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;align-items:center}.vippage .faq summary::-webkit-details-marker{display:none}.vippage .faq summary:after{content:"+";font-size:1.375rem;color:var(--tx3);transition:.2s}.vippage .faq details[open] summary:after{transform:rotate(45deg)}.vippage .faq p{margin-top:0.625rem;color:var(--tx2);line-height:1.75;font-size:0.9375rem}.vippage .end{margin-top:clamp(2rem,4vw,5rem);padding:clamp(2rem,4vw,4.5rem) 1.5rem;border-radius:var(--r-lg);text-align:center;color:#fff;background:radial-gradient(100% 140% at 50% 0%,#3a3126 0,#16161a 60%)}.vippage .end h2{font-size:clamp(1.5rem,2.6vw,2.75rem);letter-spacing:-.03em;line-height:1.2}.vippage .end p{color:#b9b1a3;margin:0.75rem 0 1.5rem}.vippage .sec-c{text-align:center;margin-bottom:1.75rem}.vippage .sec-c h2{font-size:clamp(1.5rem,2.2vw,2.5rem);font-weight:800;letter-spacing:-.03em}.vippage .sec-c p{color:var(--tx2);margin-top:0.375rem}@media(max-width:1000px){.vippage .vh{grid-template-columns:1fr}}

/* 个人中心 */
.uc{padding-top:clamp(2rem,4vw,4rem);padding-bottom:clamp(3rem,6vw,6rem);max-width:64rem}
.uc-hero{display:flex;align-items:center;gap:clamp(1rem,2vw,1.75rem);padding:clamp(1.25rem,2vw,2rem);border-radius:var(--r-lg);background:var(--bg2)}
.uc-av{flex:none;width:clamp(4.5rem,6vw,5.5rem);height:clamp(4.5rem,6vw,5.5rem);border-radius:50%;overflow:hidden;box-shadow:0 0 0 1px rgba(0,0,0,.06)}
.uc-av{position:relative}
.uc-av img,.uc-av span{display:grid;place-items:center;width:100%;height:100%;object-fit:cover;color:#fff;font-size:1.75rem;font-weight:700}
.uc-av img{position:absolute;inset:0}
.uc-who{flex:1;min-width:0}
.uc-who h1{font-size:clamp(1.5rem,2.2vw,2rem);font-weight:800;letter-spacing:-.03em}
.uc-note{margin-top:0.25rem;font-size:0.8125rem;color:var(--tx3)}
.uc-meta{display:flex;gap:1rem;flex-wrap:wrap;margin-top:0.75rem;font-size:0.8125rem;color:var(--tx2)}
.uc-tier{flex:none;padding:0.375rem 0.875rem;border-radius:99px;background:#fff;font-size:0.8125rem;font-weight:600;color:var(--tx2);box-shadow:0 0 0 1px var(--line)}
.uc-tier.vip{background:linear-gradient(135deg,var(--ink,#16161a),#34343a);color:#f1d3a0;box-shadow:none}
.uc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(0.75rem,1.2vw,1.25rem);margin-top:clamp(0.75rem,1.2vw,1.25rem)}
@media(max-width:760px){.uc-grid{grid-template-columns:1fr}}
.uc-card{display:flex;flex-direction:column;padding:clamp(1.25rem,1.8vw,1.75rem);border-radius:var(--r-lg);background:#fff;box-shadow:0 0 0 1px var(--line)}
.uc-h h2{font-size:0.8125rem;font-weight:700;letter-spacing:.04em;color:var(--tx2)}
.uc-big{margin-top:0.875rem;font-size:1.125rem;color:var(--tx)}
.uc-big b{font-size:1.75rem;font-weight:800;letter-spacing:-.03em}
.uc-unit{font-size:0.875rem;color:var(--tx3)}
.uc-sub{margin-top:0.375rem;font-size:0.875rem;line-height:1.6;color:var(--tx2)}
.uc-btn{align-self:flex-start;margin-top:auto;padding-top:0}
.uc-card .uc-btn{margin-top:1.25rem}
.uc-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0.875rem 0;border-bottom:1px solid var(--line)}
.uc-row:first-of-type{margin-top:0.75rem}
.uc-row:last-child{border-bottom:0}
.uc-row b{display:block;font-size:0.9375rem;font-weight:600}
.uc-row small{display:block;margin-top:0.25rem;font-size:0.8125rem;line-height:1.5;color:var(--tx2)}
.uc-ok{flex:none;font-size:0.8125rem;font-weight:600;color:#1ea75a}
.uc-soon{flex:none;padding:0.375rem 0.75rem;border-radius:99px;background:var(--bg2);font-size:0.8125rem;color:var(--tx3)}
.uc-foot{display:flex;justify-content:center;margin-top:clamp(2rem,4vw,3.5rem)}
.uc-out{height:2.5rem;padding:0 1.25rem;border-radius:99px;font-size:0.875rem;color:var(--tx2);background:transparent;box-shadow:0 0 0 1px var(--line)}
.uc-out:hover{color:var(--tx);background:var(--bg2)}
.uc-acts{display:flex;gap:0.5rem;flex-wrap:wrap;margin-top:1.25rem}
.uc-acts .uc-btn{margin-top:0}
.uc-acts .btn:disabled{opacity:.6;cursor:default}
.uc-notice{margin-top:clamp(0.75rem,1.2vw,1.25rem);padding:0.75rem 1rem;border-radius:0.875rem;background:#fff8ec;color:#7a5a1f;font-size:0.875rem}
.uc-tags{display:flex;align-items:center;gap:0.5rem;flex:none}
.uc-ck{height:2rem;padding:0 0.875rem;border-radius:99px;font-size:0.8125rem;font-weight:600;background:var(--ac,#0071e3);color:#fff;transition:.2s}
.uc-ck:hover{background:#0077ed}
.uc-ck:disabled{background:var(--bg2);color:var(--tx3);cursor:default}
.uc-line{margin-top:0.75rem;font-size:0.8125rem;color:var(--tx3)}
.uc-gold{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;height:2.625rem;margin-top:1.25rem;padding:0 1.375rem;border-radius:6.1875rem;font-size:0.9375rem;font-weight:700;color:#3b2a0c;background:linear-gradient(135deg,#f6dcae,#d9aa62);box-shadow:0 0.375rem 1.25rem rgba(201,154,82,.35);transition:.2s}
.uc-gold:hover{transform:translateY(-1px);box-shadow:0 0.625rem 1.75rem rgba(201,154,82,.45)}

/* VIP 页：购买须知 */
.vippage .vp-notice{max-width:52rem;margin:0 auto;padding:clamp(1.25rem,2vw,2rem);border-radius:var(--r-lg);background:var(--bg2)}
.vippage .vp-notice p{font-size:0.875rem;line-height:1.8;color:var(--tx2)}
.vippage .vp-notice p+p{margin-top:0.75rem}
.vippage .vp-notice b{color:var(--tx);font-weight:600}

/* 详情页：超清档位的 VIP 标签（黑金） */
.tier .t1 em.vb{display:inline-flex;align-items:center;height:1.125rem;padding:0 0.4375rem;border-radius:99px;font-style:normal;font-size:0.6875rem;font-weight:700;letter-spacing:.06em;color:#f1d3a0;background:linear-gradient(135deg,#1a1a1d,#34343a);box-shadow:0 0 0 1px rgba(201,154,82,.55) inset}
