/* ===== H5 style.css — 樱花粉主题 ===== */
*{margin:0;padding:0;box-sizing:border-box}
html{height:auto!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch}
:root{
  --pk50:#FFF0F3;--pk100:#FFE0E8;--pk200:#FFC2D4;--pk300:#FFA0B8;
  --pk400:#FF7A9C;--pk500:#FF5580;--pk600:#E83D6B;
  --lav100:#F3EFFF;--lav300:#C9B8FF;--lav400:#9B82E8;
  --pch100:#FFF2EC;--gold:#F5C842;
  --g50:#FAFAFA;--g100:#F5F5F5;--g200:#EEE;--g300:#E0E0E0;
  --g400:#BDBDBD;--g500:#9E9E9E;--g600:#757575;--g800:#424242;
  --bg:#FFF5F7;--card:#FFF;
  --sh-card:0 4px 20px rgba(255,85,128,.1);
  --sh-float:0 10px 32px rgba(255,85,128,.22);
  --r-lg:16px;--r-xl:20px;--r-2xl:24px;--r-full:999px;
}
body{background:var(--bg);font-family:-apple-system,"PingFang SC","Helvetica Neue",sans-serif;
  color:var(--g800);font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased;
  max-width:430px;margin:0 auto;min-height:100vh;overflow-x:hidden;
  overflow-y:auto;-webkit-overflow-scrolling:touch}

/* Page routing */
.page{display:none;padding-bottom:30px}
.page.active{display:block;animation:fadeUp .4s ease}

/* ===== Animations ===== */
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@keyframes shimmer{0%{left:-100%}100%{left:200%}}

/* ===== Hero ===== */
.hero,.hero-sm{position:relative;overflow:hidden}
.hero{height:260px}.hero-sm{height:220px}
.hero-bg{position:absolute;inset:0;background:linear-gradient(150deg,var(--pk600),var(--pk500) 40%,var(--pk400))}
.orb{position:absolute;border-radius:50%}
.o1{width:200px;height:200px;top:-50px;right:-40px;background:radial-gradient(circle,rgba(255,255,255,.15),transparent 65%);animation:float 6s ease-in-out infinite}
.o2{width:140px;height:140px;bottom:10px;left:-30px;background:radial-gradient(circle,rgba(201,184,255,.18),transparent 65%);animation:float 5s ease-in-out infinite 1s}
.hero-body{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding-bottom:30px;color:#fff;text-align:center}
.hero-badge{font-size:11px;background:rgba(255,255,255,.18);border-radius:var(--r-full);padding:4px 16px;margin-bottom:12px;backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.2)}
.hero-title{font-size:42px;font-weight:900;letter-spacing:6px;text-shadow:0 3px 12px rgba(0,0,0,.12)}
.hero-sub{font-size:14px;letter-spacing:4px;margin-top:6px;opacity:.88}
.hero-body h2{font-size:28px;font-weight:900;letter-spacing:4px;text-shadow:0 2px 8px rgba(0,0,0,.1)}
.hero-body p{font-size:13px;opacity:.85;margin-top:4px}
.wave{position:absolute;bottom:-1px;left:0;right:0;height:28px;background:var(--bg);border-radius:24px 24px 0 0;z-index:2}

/* ===== Quick Grid ===== */
.quick-grid{display:flex;flex-wrap:wrap;justify-content:center;column-gap:26px;row-gap:20px;padding:12px 20px 6px;position:relative;z-index:3;margin-top:-6px}
.quick-item{display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer}
.qi-icon{width:56px;height:56px;border-radius:var(--r-lg);display:flex;align-items:center;justify-content:center;font-size:26px;box-shadow:var(--sh-card);transition:transform .15s}
.qi-icon:active{transform:scale(.92)}
.quick-item span{font-size:11px;color:var(--g600);font-weight:600}

/* ===== Section Title ===== */
.sec-title{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:800;padding:22px 20px 12px}
.sec-dot{width:4px;height:18px;border-radius:2px;background:linear-gradient(180deg,var(--pk400),var(--pk500))}

/* ===== Module Cards ===== */
.card-list{padding:0 16px}
.mod-card{display:flex;align-items:center;background:var(--card);border-radius:var(--r-xl);padding:16px 14px;margin-bottom:12px;box-shadow:var(--sh-card);gap:12px;cursor:pointer;transition:transform .15s}
.mod-card:active{transform:scale(.98)}
.mc-icon{width:52px;height:52px;border-radius:var(--r-lg);display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0}
.mc-info{flex:1}.mc-info b{display:block;font-size:15px;color:var(--g800)}.mc-info span{font-size:12px;color:var(--g500)}
.mc-tag{font-size:10px;font-weight:700;border-radius:var(--r-full);padding:3px 10px;white-space:nowrap}
.mc-arrow{width:30px;height:30px;border-radius:50%;background:var(--pk50);display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--pk400);font-weight:700}

/* ===== Reviews ===== */
.reviews-scroll{display:flex;gap:12px;padding:0 16px 16px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.reviews-scroll::-webkit-scrollbar{display:none}
.rv-card{min-width:260px;background:var(--card);border-radius:var(--r-xl);padding:16px;box-shadow:var(--sh-card);flex-shrink:0}
.rv-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.rv-avatar{font-size:22px;width:40px;height:40px;background:linear-gradient(135deg,var(--pk50),var(--pch100));border-radius:50%;display:flex;align-items:center;justify-content:center}
.rv-head b{font-size:13px;display:block}.rv-stars{color:var(--gold);font-size:11px;letter-spacing:1px}
.rv-card p{font-size:12px;color:var(--g600);line-height:1.7}
.disclaimer{text-align:center;font-size:11px;color:var(--g400);padding:16px}

/* ===== Couple Visual ===== */
.couple-vis{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:14px;padding:16px 0}
.gbox{width:60px;height:60px;border-radius:var(--r-lg);display:flex;align-items:center;justify-content:center;font-size:30px;background:rgba(255,255,255,.22);color:#fff;backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.25)}
.heart-c{font-size:28px;color:#fff;filter:drop-shadow(0 0 8px rgba(255,150,150,.8));animation:pulse 2s ease-in-out infinite}

/* ===== Form Card ===== */
.form-card{background:var(--card);border-radius:var(--r-2xl);margin:-8px 16px 16px;padding:24px 20px;box-shadow:0 6px 28px rgba(255,85,128,.12);position:relative;z-index:3;border:1px solid rgba(255,85,128,.06)}
.form-title{font-size:16px;font-weight:800;text-align:center;margin-bottom:20px}
.inp-row{display:flex;align-items:center;background:var(--g50);border-radius:var(--r-lg);padding:12px 14px;margin-bottom:12px;border:1px solid var(--g200)}
.inp-row:focus-within{border-color:var(--pk200)}
.inp-label{width:44px;height:44px;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0;margin-right:12px;line-height:1.3}
.f-label{background:linear-gradient(135deg,var(--pk500),var(--pk400))}
.m-label{background:linear-gradient(135deg,var(--lav400),var(--lav300))}
.inp-row input{flex:1;border:none;outline:none;background:transparent;font-size:14px;color:var(--g800)}
.inp-row input::placeholder{color:var(--g400)}
.note{font-size:11px;color:var(--g400);margin-bottom:16px}

/* Form rows for bazi */
.form-row{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--pk50);padding:14px 0}
.fl{font-size:14px;font-weight:600;min-width:60px}
.form-row select{border:none;outline:none;background:transparent;font-size:14px;color:var(--pk500);font-weight:600;text-align:right;-webkit-appearance:none;appearance:none;cursor:pointer}
.gender-sel{display:flex;gap:10px}
.g-opt{padding:8px 20px;border-radius:var(--r-full);font-size:13px;font-weight:600;color:var(--g500);background:var(--g100);border:2px solid transparent;cursor:pointer;transition:all .2s}
.g-active{color:var(--pk500)!important;background:var(--pk50)!important;border-color:var(--pk200)!important}

/* ===== Buttons ===== */
.btn-pink,.btn-gold{display:block;width:100%;border:none;border-radius:var(--r-full);padding:14px 0;font-size:18px;font-weight:700;color:#fff;cursor:pointer;position:relative;overflow:hidden;letter-spacing:2px}
.btn-pink{background:linear-gradient(135deg,var(--pk500),var(--pk600));box-shadow:var(--sh-float)}
.btn-gold{background:linear-gradient(135deg,#FFD76E,var(--gold),#EBB000);box-shadow:0 10px 28px rgba(245,200,66,.35)}
.btn-pink::after,.btn-gold::after{content:'';position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);animation:shimmer 2.5s infinite}

.back-btn{display:block;margin:20px auto 0;background:none;border:none;color:var(--pk500);font-size:14px;font-weight:600;cursor:pointer;padding:8px 24px}

/* ===== Score Card (name result) ===== */
.score-card{background:linear-gradient(160deg,var(--pk600),var(--pk500) 40%,var(--pk300));border-radius:0 0 28px 28px;padding:30px 22px 36px;position:relative;overflow:hidden}
.score-card::before{content:'';position:absolute;width:200px;height:200px;border-radius:50%;top:-60px;right:-40px;background:radial-gradient(circle,rgba(255,255,255,.12),transparent 60%)}
.names-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.name-bbl{display:flex;flex-direction:column;align-items:center;background:rgba(255,255,255,.2);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.2);border-radius:var(--r-lg);padding:12px 18px;flex:1;max-width:130px}
.ng{font-size:24px;color:#fff}.nt{font-size:17px;font-weight:800;color:#fff;margin-top:4px}
.score-circle{display:flex;flex-direction:column;align-items:center;background:rgba(255,255,255,.18);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.2);border-radius:50%;width:90px;height:90px;justify-content:center;flex-shrink:0}
.sn{font-size:36px;font-weight:900;color:#fff;line-height:1}.sl{font-size:11px;color:rgba(255,255,255,.85);margin-top:2px}
.stars-row{text-align:center;margin-bottom:16px;font-size:24px;color:var(--gold);letter-spacing:4px}
.wx-row{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:16px}
.wx-item{display:flex;flex-direction:column;align-items:center}
.wx-char{font-size:26px;font-weight:800;color:#fff;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;line-height:46px}
.wx-lbl{font-size:11px;color:rgba(255,255,255,.82);margin-top:4px}
.wx-vs{font-size:16px;font-weight:800;color:rgba(255,255,255,.55)}
.short-desc{background:rgba(255,255,255,.18);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:10px 14px;display:flex;align-items:center;gap:8px;font-size:13px;color:#fff}

/* ===== Detail / Lock ===== */
.detail-sec{margin:24px 16px 30px}
.sec-h{text-align:center;font-size:16px;font-weight:800;margin-bottom:14px}
.locked-area{position:relative;border-radius:var(--r-xl);overflow:hidden;cursor:pointer}
.locked-blur{filter:blur(5px);pointer-events:none;background:var(--card);padding:20px;border-radius:var(--r-xl)}
.lock-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(255,255,255,.75);backdrop-filter:blur(3px);gap:8px}
.lock-ico{font-size:40px}.lock-txt{font-size:16px;font-weight:800}
.btn-unlock{background:linear-gradient(135deg,var(--pk500),var(--pk600));color:#fff;font-size:16px;font-weight:700;padding:14px 50px;border-radius:var(--r-full);margin-top:10px;box-shadow:var(--sh-float)}
.det-card{background:var(--card);border-radius:var(--r-xl);padding:16px;margin-bottom:10px;box-shadow:var(--sh-card)}
.det-card b{display:block;font-size:14px;color:var(--pk500);margin-bottom:8px}
.det-card p{font-size:13px;color:var(--g600);line-height:1.8}

/* Paid content */
.paid-content .fc{background:var(--card);border-radius:var(--r-xl);padding:16px 18px;margin-bottom:12px;box-shadow:var(--sh-card);border:1px solid rgba(255,85,128,.05)}
.paid-content .fc-h{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.paid-content .fc-h span:first-child{font-size:20px}
.paid-content .fc-h span:last-child{font-size:16px;font-weight:700;color:var(--pk500)}
.paid-content .fc p{font-size:13px;color:var(--g600);line-height:1.8}
.paid-content .tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.paid-content .tag{font-size:12px;color:var(--pk500);background:var(--pk50);border-radius:var(--r-full);padding:4px 14px;font-weight:500}
.paid-content .tips{margin-top:8px}.paid-content .tip{display:flex;gap:8px;margin-bottom:6px;font-size:13px;color:var(--g600)}
.paid-content .tip span:first-child{color:var(--pk500);flex-shrink:0}
.lucky-card{background:linear-gradient(135deg,var(--pk50),var(--pk100))!important;border:1px solid rgba(255,85,128,.08)!important}
.lucky-row{display:flex;gap:6px;margin-bottom:8px;font-size:13px}
.lucky-row span:first-child{color:var(--pk500);font-weight:600;min-width:60px}

/* Fortune tabs */
.ftab{display:inline-block;background:var(--pk50);color:var(--pk500);font-size:13px;font-weight:600;padding:10px 18px;border-radius:var(--r-full);margin:4px}

/* ===== Bazi Top ===== */
.bazi-top{background:linear-gradient(160deg,var(--pk600),var(--pk500) 40%,var(--pk300));border-radius:0 0 28px 28px;padding:50px 22px 36px;position:relative;overflow:visible;color:#fff;text-align:center}
.bazi-top::before{content:'';position:absolute;width:220px;height:220px;border-radius:50%;top:-70px;right:-50px;background:radial-gradient(circle,rgba(255,255,255,.12),transparent 60%)}
.bazi-str{font-size:16px;font-weight:800;letter-spacing:4px;margin-bottom:4px}
.bazi-sub{font-size:12px;opacity:.72;margin-bottom:24px}
.pillars-row{display:flex;justify-content:space-between;gap:8px;margin-bottom:20px}
.pillar{flex:1;display:flex;flex-direction:column;align-items:center;background:rgba(255,255,255,.14);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:10px 4px}
.pillar .pl{font-size:11px;opacity:.75;margin-bottom:8px}
.pillar .pg{font-size:22px;font-weight:800}.pillar .pz{font-size:22px;font-weight:800;color:rgba(255,220,240,.9)}
.wx-bar{background:rgba(255,255,255,.14);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.15);border-radius:var(--r-lg);padding:12px 16px;margin-bottom:16px;text-align:left}
.wx-bar-title{font-size:12px;opacity:.75;margin-bottom:10px;display:block}
.wx-items{display:flex;justify-content:space-between}
.wxi{display:flex;flex-direction:column;align-items:center;gap:4px}
.wxi .wn{font-size:13px;font-weight:700}.wxi .wd{font-size:10px;letter-spacing:1px}.wxi .wc{font-size:11px;opacity:.7}
.xi-row{display:flex;gap:10px}
.xi-item{flex:1;background:rgba(255,255,255,.14);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:10px 14px;display:flex;flex-direction:column;gap:4px}
.xi-l{font-size:11px;opacity:.7}.xi-v{font-size:14px;font-weight:700}.xi-gold{color:var(--gold)}

/* ===== Modal ===== */
.modal-mask{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1000;display:flex;align-items:flex-end;justify-content:center}
.modal-box{width:100%;max-width:430px;background:#fff;border-radius:var(--r-2xl) var(--r-2xl) 0 0;padding:30px 24px 36px;display:flex;flex-direction:column;align-items:center;position:relative;overflow:hidden}
.modal-top-line{position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--pk400),var(--lav300),var(--pk400))}
.modal-box h3{font-size:22px;font-weight:800;margin-top:6px}
.modal-sub{font-size:13px;color:var(--g500);margin-top:4px;margin-bottom:18px}
.preview-wrap{width:100%;background:linear-gradient(135deg,var(--pk50),var(--pch100));border-radius:var(--r-lg);padding:14px 18px;margin-bottom:20px;border:1px solid rgba(255,85,128,.08)}
.pv-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:13px;color:var(--g600);font-weight:600}
.pv-row:last-child{margin-bottom:0}
.pv-blur{color:var(--pk500);filter:blur(3px);font-size:12px}
.price-row{display:flex;align-items:baseline;margin-bottom:20px}
.pt{font-size:18px;color:var(--pk500);font-weight:700}
.pn{font-size:44px;color:var(--pk500);font-weight:900;line-height:1}
.po{font-size:12px;color:var(--g400);text-decoration:line-through;margin-left:10px}
.modal-pay{max-width:360px}
.modal-close{font-size:13px;color:var(--g400);margin-top:16px;cursor:pointer;padding:8px 20px}
.modal-priv{font-size:11px;color:var(--g400);margin-top:4px}

/* ===== Login Page ===== */
@keyframes sakuraFall{0%{transform:translateY(-20px) rotate(0);opacity:0}10%{opacity:.7}100%{transform:translateY(110vh) rotate(360deg);opacity:0}}
.login-bg{position:fixed;inset:0;background:linear-gradient(160deg,var(--pk600),var(--pk500) 40%,var(--pk300));z-index:0}
.login-bg .orb{z-index:1}
.sakura{position:absolute;font-size:18px;z-index:1;opacity:0;animation:sakuraFall 6s linear infinite}
.s1{left:15%;animation-delay:0s}.s2{left:55%;animation-delay:2s;font-size:14px}.s3{left:80%;animation-delay:4s;font-size:22px}
.login-body{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:20px}
.logo-ring{width:90px;height:90px;border-radius:50%;background:rgba(255,255,255,.15);border:3px solid rgba(255,255,255,.35);display:flex;align-items:center;justify-content:center;font-size:40px;animation:pulse 3s ease-in-out infinite;backdrop-filter:blur(8px);margin-bottom:16px;box-shadow:0 0 30px rgba(255,200,220,.4)}
.login-title{font-size:38px;font-weight:900;color:#fff;letter-spacing:8px;text-shadow:0 3px 16px rgba(0,0,0,.12)}
.login-sub{font-size:14px;color:rgba(255,255,255,.85);letter-spacing:4px;margin-top:6px;margin-bottom:32px}
.login-card{background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.45);border-radius:var(--r-2xl);padding:28px 24px;width:100%;max-width:380px;position:relative;overflow:hidden;box-shadow:0 8px 40px rgba(0,0,0,.1)}
.login-strip{position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--pk400),var(--lav300),var(--pk400))}
.login-desc{font-size:13px;color:var(--g500);text-align:center;margin-bottom:20px}
.login-btn{margin-bottom:12px}
.btn-guest{display:block;width:100%;background:transparent;border:2px solid var(--pk200);border-radius:var(--r-full);padding:12px 0;font-size:15px;font-weight:600;color:var(--pk500);cursor:pointer;margin-bottom:16px;transition:all .2s}
.btn-guest:active{background:var(--pk50)}
.login-agree{display:flex;align-items:center;justify-content:center;gap:6px;font-size:12px;color:var(--g500)}
.login-check{width:20px;height:20px;border-radius:50%;border:2px solid var(--g300);display:inline-flex;align-items:center;justify-content:center;font-size:12px;color:var(--pk500);cursor:pointer;transition:all .2s}
.login-check.checked{border-color:var(--pk500);background:var(--pk50)}
.agree-link{color:var(--pk500);font-weight:500;cursor:pointer}

/* ===== Invite Page ===== */
.inv-stats{display:flex;background:var(--card);border-radius:var(--r-xl);margin:-10px 16px 16px;padding:20px 0;box-shadow:0 6px 28px rgba(255,85,128,.12);position:relative;z-index:3;border:1px solid rgba(255,85,128,.06)}
.inv-stat{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px}
.inv-num{font-size:32px;font-weight:900;color:var(--g800)}.inv-free{color:var(--pk500)}
.inv-lbl{font-size:12px;color:var(--g500)}
.inv-div{width:1px;background:linear-gradient(180deg,transparent,var(--pk100),transparent);margin:6px 0}
.inv-rules{background:var(--card);border-radius:var(--r-xl);margin:0 16px 16px;padding:20px;box-shadow:var(--sh-card);border:1px solid rgba(255,85,128,.06)}
.inv-rules-title{font-size:16px;font-weight:800;margin-bottom:16px}
.inv-rule{display:flex;align-items:flex-start;gap:14px;margin-bottom:14px}
.inv-rn{width:30px;height:30px;background:linear-gradient(135deg,var(--pk500),var(--pk600));border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0;box-shadow:0 3px 10px rgba(255,85,128,.25)}
.inv-rule span:last-child{font-size:13px;color:var(--g600);line-height:1.7;padding-top:5px}
.inv-code-card{background:linear-gradient(135deg,var(--pk50),var(--pk100));border-radius:var(--r-xl);margin:0 16px 16px;padding:18px 20px;border:2px dashed var(--pk200)}
.inv-code-lbl{font-size:12px;color:var(--g500);display:block;margin-bottom:8px}
.inv-code-row{display:flex;align-items:center;justify-content:space-between}
.inv-code{font-size:26px;font-weight:900;color:var(--pk500);letter-spacing:6px}
.inv-copy{background:linear-gradient(135deg,var(--pk500),var(--pk600));color:#fff;font-size:13px;font-weight:600;padding:8px 20px;border-radius:var(--r-full);border:none;cursor:pointer;box-shadow:0 3px 12px rgba(255,85,128,.25)}

/* ===== Tab Navigation ===== */
.result-tabs{display:flex;gap:4px;overflow-x:auto;padding:0 0 12px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.result-tabs::-webkit-scrollbar{display:none}
.tab-btn{flex-shrink:0;padding:8px 14px;border-radius:var(--r-full);font-size:12px;font-weight:600;color:var(--g500);background:var(--g100);border:none;cursor:pointer;transition:all .2s}
.tab-btn.tab-active{color:#fff;background:linear-gradient(135deg,var(--pk500),var(--pk600));box-shadow:0 3px 10px rgba(255,85,128,.3)}

/* ===== Solo Name Display ===== */
.solo-name-display{display:flex;flex-direction:column;align-items:center;padding:16px 0 0}
.solo-wx-info{padding:0 16px}
.solo-score-bar{padding:0 16px}

/* ===== Decade Fortune List ===== */
.decade-list{display:flex;flex-direction:column;gap:10px;padding:8px 0}
.decade-item{background:rgba(255,85,128,.04);border-radius:var(--r-lg);padding:12px 14px;border:1px solid rgba(255,85,128,.08)}
.dec-year{font-size:14px;font-weight:800;color:var(--pk500);margin-bottom:4px}
.dec-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.dec-tg{font-size:13px;color:var(--g600);font-weight:600}
.dec-rate{font-size:13px;letter-spacing:2px}
.dec-desc{font-size:12px;color:var(--g500);line-height:1.7}

/* ===== Monthly Grid ===== */
.month-grid{display:flex;flex-direction:column;gap:6px;padding:8px 0}
.month-item{background:rgba(255,85,128,.03);border-radius:10px;padding:10px 14px;font-size:12.5px;color:var(--g600);line-height:1.6;border-left:3px solid var(--pk200)}

/* ===== Premium CTA Card ===== */
.premium-cta-wrap{padding:0 16px;margin-bottom:16px}
.premium-cta{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#1a1a2e,#16213e);border-radius:var(--r-xl);padding:16px;cursor:pointer;box-shadow:0 4px 20px rgba(255,215,0,.15);border:1px solid rgba(255,215,0,.2);transition:transform .15s}
.premium-cta:active{transform:scale(.97)}
.premium-cta-badge{background:linear-gradient(135deg,#FFD700,#FFA500);color:#333;font-size:11px;font-weight:900;padding:4px 10px;border-radius:var(--r-full);white-space:nowrap}
.premium-cta-body{flex:1}
.premium-cta-title{font-size:14px;font-weight:700;color:#FFD700;margin-bottom:3px}
.premium-cta-desc{font-size:11px;color:rgba(255,255,255,.6);line-height:1.5}
.premium-cta-price{text-align:center;color:#FFD700;font-size:18px;font-weight:900;white-space:nowrap}
.premium-cta-price span{display:block;font-size:11px;font-weight:600;color:rgba(255,255,255,.5)}

/* ===== Premium Modal ===== */
.premium-modal-box{background:linear-gradient(160deg,#1a1a2e 0%,#16213e 100%)!important;color:#fff}
.premium-modal-box h3{color:#FFD700!important}
.premium-modal-box .modal-sub{color:rgba(255,255,255,.6)!important}
.premium-preview{padding:12px 0;display:flex;flex-direction:column;gap:8px}
.pp-item{font-size:13px;color:rgba(255,255,255,.85);padding:8px 14px;background:rgba(255,215,0,.08);border-radius:10px;border-left:3px solid #FFD700}

/* ===== Premium Unlocked Cards ===== */
.premium-unlocked{padding:0 16px 16px}
.premium-card{border:1px solid rgba(255,215,0,.15)!important;background:linear-gradient(135deg,#FFFEF5,#FFF8E1)!important}
.premium-card .fc-h span:first-child{background:linear-gradient(135deg,#FFD700,#FFA500)!important;-webkit-background-clip:text;-webkit-text-fill-color:transparent}

/* ===== Toast ===== */
.toast{position:fixed;top:20px;left:50%;transform:translateX(-50%) translateY(-100px);background:rgba(0,0,0,.75);color:#fff;padding:10px 24px;border-radius:var(--r-full);font-size:13px;z-index:9999;transition:transform .3s;pointer-events:none}
.toast.show{transform:translateX(-50%) translateY(0)}

/* ===== Profile Page ===== */
.profile-header{display:flex;align-items:center;gap:14px;padding:16px 20px;margin:0 16px;background:var(--card);border-radius:var(--r-xl);box-shadow:var(--sh-card)}
.profile-avatar{width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,var(--pk100),var(--pk200));display:flex;align-items:center;justify-content:center;font-size:28px}
.profile-info{flex:1}
.profile-name{font-size:16px;font-weight:700;color:var(--g800)}
.profile-id{font-size:12px;color:var(--g500);margin-top:2px}
.profile-stats{display:flex;gap:8px;padding:12px 16px}
.ps-item{flex:1;background:var(--card);border-radius:var(--r-lg);padding:14px 10px;text-align:center;box-shadow:var(--sh-card);display:flex;flex-direction:column;gap:4px}
.ps-val{font-size:20px;font-weight:800;color:var(--pk500)}
.ps-lbl{font-size:11px;color:var(--g500)}
.my-order-list{padding:0 16px}
.my-order-item{display:flex;align-items:center;gap:12px;padding:14px 16px;background:var(--card);border-radius:var(--r-lg);margin-bottom:8px;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.moi-icon{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--pk50),var(--pk100));display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.moi-info{flex:1}
.moi-type{font-size:14px;font-weight:600;color:var(--g800)}
.moi-time{font-size:11px;color:var(--g400);margin-top:2px}
.moi-price{font-size:15px;font-weight:700;color:var(--pk500);white-space:nowrap}
.my-order-empty{text-align:center;padding:40px 20px;color:var(--g400);font-size:13px}
.moi-arrow{font-size:20px;color:var(--g300);font-weight:bold;margin-left:4px}
.my-order-item[onclick]{transition:transform .15s,box-shadow .15s}
.my-order-item[onclick]:active{transform:scale(0.97);box-shadow:0 1px 4px rgba(0,0,0,.08)}

/* ===== 八字高级排盘样式 ===== */
.bazi-lunar-info{font-size:12px;color:rgba(255,255,255,.85);margin-top:6px;letter-spacing:.5px}
.p-shishen{display:block;font-size:10px;color:var(--pk400);background:rgba(255,255,255,.15);border-radius:8px;padding:1px 6px;margin-bottom:2px}
.p-nayin{display:block;font-size:10px;color:rgba(255,255,255,.7);margin-top:4px}
.p-canggan{display:block;font-size:9px;color:rgba(255,255,255,.5);margin-top:2px}
.bazi-extra-row{display:flex;gap:10px;margin:12px 16px;flex-wrap:wrap}
.bazi-mini-card{flex:1;min-width:120px;background:rgba(255,255,255,.12);border-radius:12px;padding:10px 14px;text-align:center}
.bmc-label{display:block;font-size:11px;color:rgba(255,255,255,.6);margin-bottom:4px}
.bmc-val{display:block;font-size:14px;font-weight:600;color:#fff}
.bazi-yiji,.bazi-shensha{margin:10px 16px;background:rgba(255,255,255,.92);border-radius:12px;padding:12px;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.yiji-row,.ss-row{display:flex;align-items:flex-start;gap:8px;margin-bottom:8px}
.yiji-row:last-child,.ss-row:last-child{margin-bottom:0}
.yiji-label{font-size:13px;font-weight:700;min-width:24px;text-align:center;padding:2px 0}
.yiji-row.yi .yiji-label{color:#22c55e}
.yiji-row.ji .yiji-label{color:#ef4444}
.yiji-tags,.ss-tags{display:flex;flex-wrap:wrap;gap:4px}
.yi-tag{background:#dcfce7;color:#166534;font-size:11px;padding:2px 8px;border-radius:6px}
.ji-tag{background:#fee2e2;color:#991b1b;font-size:11px;padding:2px 8px;border-radius:6px}
.sha-tag{background:#fef3c7;color:#92400e;font-size:11px;padding:2px 8px;border-radius:6px}
.ss-label{font-size:12px;font-weight:600;min-width:36px;color:var(--g600)}

/* ===== 五行穿衣模块 ===== */
.clothing-card{background:var(--card);border-radius:var(--r-xl);padding:16px;box-shadow:0 2px 10px rgba(0,0,0,.05);margin-bottom:12px;border:1px solid rgba(171,71,188,.15)}
.clothing-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;border-bottom:1px solid var(--g100);padding-bottom:8px}
.clothing-date{font-size:13px;font-weight:700;color:var(--g800)}
.clothing-lunar{font-size:12px;color:var(--g500)}
.clothing-wx{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:800;color:#AB47BC}
.clothing-grid{display:flex;flex-direction:column;gap:8px}
.c-row{display:flex;align-items:center;gap:12px}
.c-label{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;flex-shrink:0}
.c-best{background:linear-gradient(135deg,#D81B60,#C2185B)}
.c-good{background:linear-gradient(135deg,#42A5F5,#1E88E5)}
.c-bad{background:linear-gradient(135deg,#9E9E9E,#757575)}
.c-colors{display:flex;gap:6px;flex-wrap:wrap}
.c-color-tag{padding:4px 10px;border-radius:12px;font-size:12px;font-weight:600;color:var(--g800);background:var(--g50);border:1px solid var(--g200)}
.clothing-advice{margin-top:12px;padding:12px;background:#F3E5F5;border-radius:10px;font-size:12px;color:#6A1B9A;line-height:1.6}

/* 扩展 quick-grid 让图标更协调 */
.quick-grid .quick-item{width:calc(25% - 20px);margin-bottom:6px}

/* 适配大屏手机下 flex 换行 */
@media screen and (max-width: 380px) {
  .quick-grid .quick-item{width:calc(33.33% - 18px)}
}

/* ===== 品牌商标 ===== */
.brand-logo{display:flex;flex-direction:column;align-items:center;gap:4px}
.brand-img{border-radius:8px;object-fit:contain;filter:drop-shadow(0 2px 8px rgba(0,0,0,.15));background:#fff;padding:2px}
.brand-name{font-size:16px;font-weight:900;color:#fff;letter-spacing:3px;text-shadow:0 1px 4px rgba(0,0,0,.2)}
.brand-name sup{font-size:9px;font-weight:700;position:relative;top:-6px}
/* 小型品牌标识（子页面顶部角落） */
.brand-mini{position:absolute;top:8px;left:12px;z-index:10;display:flex;align-items:center;gap:5px;opacity:.9}
.brand-mini img{border-radius:4px;background:#fff;padding:1px;filter:drop-shadow(0 1px 3px rgba(0,0,0,.2))}
@keyframes spin{to{transform:rotate(360deg)}}
