:root{--p:#ff3d7f;--p2:#7b5cff;--ink:#1d1b2c;--mut:#6b6880;--bg:#f7f6fb;--card:#fff;--line:#ebe8f3;--r:14px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;font:15px/1.75 -apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;color:var(--ink);background:var(--bg)}
a{color:inherit;text-decoration:none}a:hover{color:var(--p)}
img{max-width:100%;height:auto;display:block}
.w{max-width:1200px;margin:0 auto;padding-left:16px;padding-right:16px}
.hd{position:sticky;top:0;z-index:9;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line)}
.hd .w{display:flex;align-items:center;gap:18px;height:60px}
.logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:19px;white-space:nowrap}
.logo i{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--p),var(--p2));display:grid;place-items:center;color:#fff;font-style:normal;font-size:15px}
.logo b{background:linear-gradient(90deg,var(--p),var(--p2));-webkit-background-clip:text;background-clip:text;color:transparent}
.nav{display:flex;gap:4px;flex:1;overflow:auto}
.nav a{padding:6px 11px;border-radius:999px;font-size:14px;color:#3b3852;white-space:nowrap}
.nav a:hover,.nav a.on{background:#fff0f5;color:var(--p)}
.cta{flex:none;padding:8px 16px;border-radius:999px;background:linear-gradient(90deg,var(--p),var(--p2));color:#fff!important;font-weight:700;font-size:14px;box-shadow:0 6px 18px -6px rgba(255,61,127,.6)}
.cta:hover{filter:brightness(1.07)}
.mnav{display:none}
.hero{background:radial-gradient(1200px 400px at 10% -10%,#ffd9e8 0,transparent 60%),radial-gradient(900px 400px at 100% 0,#e3dcff 0,transparent 60%),#fff;border-bottom:1px solid var(--line)}
.hero .w{padding-top:46px;padding-bottom:40px;display:grid;grid-template-columns:1.25fr 1fr;gap:34px;align-items:center}
.hero h1{font-size:36px;line-height:1.3;margin:0 0 14px;letter-spacing:.5px}
.hero h1 em{font-style:normal;background:linear-gradient(90deg,var(--p),var(--p2));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{color:var(--mut);margin:0 0 18px;font-size:16px}
.btns{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-block;padding:12px 22px;border-radius:12px;font-weight:700}
.btn.pri{background:linear-gradient(90deg,var(--p),var(--p2));color:#fff;box-shadow:0 10px 24px -10px rgba(123,92,255,.7)}
.btn.pri:hover{color:#fff;filter:brightness(1.06)}
.btn.gh{background:#fff;border:1px solid var(--line)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.chips span,.chips a{font-size:13px;padding:4px 11px;border-radius:999px;background:#fff;border:1px solid var(--line);color:#4b4862}
.mos{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.mos a{border-radius:12px;overflow:hidden;aspect-ratio:3/4;background:#eee;position:relative}
.mos a:nth-child(2){transform:translateY(18px)}.mos a:nth-child(5){transform:translateY(18px)}
.mos img{width:100%;height:100%;object-fit:cover}
.stats{display:flex;gap:26px;margin-top:22px}.stats b{display:block;font-size:22px;color:var(--ink)}.stats span{font-size:13px;color:var(--mut)}
.sec{padding:34px 0 8px}
.sh{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:16px}
.sh h2{margin:0;font-size:22px;position:relative;padding-left:14px}
.sh h2:before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:5px;border-radius:3px;background:linear-gradient(var(--p),var(--p2))}
.sh a{font-size:14px;color:var(--mut)}
.sh p{margin:4px 0 0 14px;color:var(--mut);font-size:14px}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{background:var(--card);border-radius:var(--r);overflow:hidden;border:1px solid var(--line);transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-3px);box-shadow:0 14px 30px -18px rgba(40,20,90,.35)}
.card .th{aspect-ratio:16/10;background:linear-gradient(135deg,#ffe1ec,#e6e0ff);overflow:hidden;position:relative}
.card .th img{width:100%;height:100%;object-fit:cover}
.card .th .ph{position:absolute;inset:0;display:grid;place-items:center;font-weight:800;color:#8a7fb8;font-size:15px;padding:10px;text-align:center}
.card .tg{position:absolute;left:8px;top:8px;background:rgba(20,16,40,.66);color:#fff;font-size:12px;padding:2px 8px;border-radius:999px}
.card .bd{padding:11px 12px 13px;display:flex;flex-direction:column;gap:6px;flex:1}
.card h3{margin:0;font-size:14.5px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card .mt{font-size:12px;color:var(--mut);margin-top:auto}
.bjs{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.bj{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:12px;text-align:center}
.bj .av{width:74px;height:74px;border-radius:50%;margin:0 auto 8px;overflow:hidden;background:linear-gradient(135deg,var(--p),var(--p2));display:grid;place-items:center;color:#fff;font-weight:800;font-size:22px}
.bj .av img{width:100%;height:100%;object-fit:cover}
.bj b{display:block;font-size:14px}.bj span{font-size:12px;color:var(--mut)}
.guide{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.gd{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px}
.gd h3{margin:0 0 6px;font-size:16px}.gd p{margin:0;color:#4b4862;font-size:14px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin-bottom:10px}
.faq summary{font-weight:700;cursor:pointer}.faq details p{margin:8px 0 0;color:#4b4862}
.band{margin:34px 0 0;background:linear-gradient(100deg,#2a1d55,#4b2a7a 55%,#7a2a62);color:#fff;border-radius:18px;padding:28px;display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.band h2{margin:0 0 4px;font-size:22px}.band p{margin:0;opacity:.85}
.band .btn{background:#fff;color:#4b2a7a}
.ft{margin-top:46px;background:#16131f;color:#bdb8d0;font-size:14px}
.ft .w{padding-top:30px;padding-bottom:26px}
.ft h4{color:#fff;margin:0 0 10px;font-size:15px}
.fl{display:flex;flex-wrap:wrap;gap:8px 16px;margin-bottom:20px}.fl a:hover{color:#fff}
.ft .cp{border-top:1px solid #2b2638;padding-top:14px;font-size:12.5px;color:#8b86a0}
.bc{font-size:13px;color:var(--mut);padding-top:16px;padding-bottom:6px}
.bc ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.bc li:not(:last-child):after{content:"›";margin-left:6px;color:#b8b4c8}
.lay{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}
.art{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px}
.art h1{font-size:25px;line-height:1.45;margin:0 0 10px}
.meta{display:flex;flex-wrap:wrap;gap:8px 16px;color:var(--mut);font-size:13px;margin-bottom:16px}
.meta a{color:var(--p)}
.lead{font-size:16px;color:#33304a;background:linear-gradient(90deg,#fff3f8,#f4f1ff);border-left:4px solid var(--p);padding:14px 16px;border-radius:10px;margin:0 0 18px}
.info{width:100%;border-collapse:collapse;margin:6px 0 18px;font-size:14px}
.info th,.info td{border:1px solid var(--line);padding:8px 12px;text-align:left}.info th{background:#faf9fd;width:32%;font-weight:600;color:#4b4862}
.art h2{font-size:19px;margin:24px 0 10px}
.art p{margin:0 0 12px}
.art figure{margin:0 0 14px;border-radius:12px;overflow:hidden;background:#f2f0f8}
.art figcaption{font-size:12.5px;color:var(--mut);padding:6px 10px;background:#fff}
.box{border:1px dashed #d9cff7;background:#fbfaff;border-radius:14px;padding:16px 18px;margin:20px 0}
.box .btn{margin-top:8px}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 4px}.tags span,.tags a{font-size:12.5px;padding:3px 10px;border-radius:999px;background:#f4f1ff;color:#5b4ca8}
.pn{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}.pn a{background:#faf9fd;border:1px solid var(--line);border-radius:12px;padding:10px 14px;font-size:14px}.pn small{display:block;color:var(--mut)}
.side{display:flex;flex-direction:column;gap:16px;position:sticky;top:76px}
.sb{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px}
.sb h3{margin:0 0 10px;font-size:16px}
.sb ul{list-style:none;margin:0;padding:0}.sb li{padding:7px 0;border-bottom:1px dashed var(--line);font-size:14px;line-height:1.5}.sb li:last-child{border:0}
.sb.cta2{background:linear-gradient(135deg,#ff3d7f,#7b5cff);color:#fff;border:0}.sb.cta2 p{margin:0 0 12px;opacity:.92;font-size:14px}.sb.cta2 .btn{background:#fff;color:#7b5cff;display:block;text-align:center}
.pg{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:26px 0 0}
.pg a,.pg span{min-width:38px;text-align:center;padding:7px 11px;border-radius:10px;background:#fff;border:1px solid var(--line);font-size:14px}.pg .on{background:var(--p);color:#fff;border-color:var(--p)}
.ph1{padding:26px 0 6px}.ph1 h1{margin:0 0 6px;font-size:27px}.ph1 p{margin:0;color:var(--mut);max-width:860px}
.prose{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px}.prose h2{font-size:20px;margin:22px 0 8px}.prose p,.prose li{color:#3b3852}
@media(max-width:1020px){.grid{grid-template-columns:repeat(3,1fr)}.bjs{grid-template-columns:repeat(4,1fr)}.lay{grid-template-columns:1fr}.side{position:static}.guide{grid-template-columns:1fr 1fr}}
@media(max-width:760px){
 .nav,.hd .cta{display:none}.mnav{display:block;margin-left:auto;position:relative}
 .mnav summary{list-style:none;cursor:pointer;padding:7px 12px;border-radius:10px;border:1px solid var(--line);font-size:14px}.mnav summary::-webkit-details-marker{display:none}
 .mnav .dd{position:absolute;right:0;top:44px;width:230px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:8px;box-shadow:0 18px 40px -20px rgba(0,0,0,.35);display:flex;flex-direction:column}
 .mnav .dd a{padding:9px 12px;border-radius:9px}.mnav .dd a.cta{margin-top:6px;text-align:center}
 .hero .w{grid-template-columns:1fr;padding-top:28px;padding-bottom:26px;gap:22px}.hero h1{font-size:26px}
 .grid{grid-template-columns:repeat(2,1fr);gap:10px}.bjs{grid-template-columns:repeat(3,1fr);gap:8px}.guide{grid-template-columns:1fr}
 .card h3{font-size:13.5px}.card .bd{padding:9px 10px 11px}
 .art{padding:16px;border-radius:14px}.art h1{font-size:20px}.pn{grid-template-columns:1fr}.ph1 h1{font-size:22px}.prose{padding:18px}
 .stats{gap:18px}.band{padding:20px}
}