:root{color-scheme:dark;--bg:#0e1422;--header:#0f1726;--panel:#151b2b;--text:#f7f8fc;--muted:#a9b3c9;--border:#324057;--pink:#f23585;--pink2:#ff5da1;--blue:#258cf5;--radius:20px;--shadow:0 20px 55px rgba(0,0,0,.37)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);font:15px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--text);min-width:320px}button,a{font:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #70c0ff;outline-offset:3px}.shell{position:relative;overflow:hidden;min-height:100vh;background:radial-gradient(ellipse at 50% 550px,#1b1a2e 0%,transparent 600px),var(--bg)}
.site-header{height:70px;z-index:10;position:relative;background:rgba(11,18,31,.92);border-bottom:1px solid rgba(255,255,255,.1)}.topbar{max-width:1200px;height:100%;margin:0 auto;padding:0 24px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:13px;min-width:0}.brand-icon{display:grid;place-items:center;width:39px;height:39px;border-radius:10px;flex-shrink:0;background:linear-gradient(135deg,#ff73b7,#e52b82);box-shadow:0 6px 20px #ff2e7c40}.brand-icon img{filter:brightness(0) invert(1);width:21px;height:21px}.brand strong{font-size:20px;display:block;letter-spacing:.02em;line-height:1.15}.brand small{font-size:10px;display:block;margin-top:2px;color:#aab0bf}.links{display:flex;align-items:center;gap:24px}.links>*{display:flex;align-items:center;gap:5px;color:#d6d8e7;white-space:nowrap;font-size:13px;background:none;border:none;padding:12px 0}.links img{width:17px;height:17px;filter:brightness(0) invert(1);opacity:.75}.links>*:hover,.links>*:focus-visible{color:#ff63aa}
.hero-backdrop{position:absolute;z-index:0;top:70px;left:0;right:0;height:850px;background:linear-gradient(180deg,rgba(12,17,30,.22),rgba(13,18,31,.35) 30%,rgba(14,20,34,.88) 76%,#0e1422 100%),linear-gradient(90deg,rgba(10,15,26,.77),rgba(10,15,26,.15)),var(--hero-desktop, url('/uploads/site/hero_desktop.webp')) center 20%/cover no-repeat;pointer-events:none}.hero,.purchase-panel,.resources,.purchase-details,.page-footer{position:relative;z-index:1}.hero{text-align:center;max-width:960px;margin:0 auto;padding:55px 20px 32px}.hero h1{font-size:clamp(30px,3vw,43px);margin:0;line-height:1.25;font-weight:800;text-shadow:0 3px 18px #0009;letter-spacing:.01em}.hero h1 span{color:#ff59a2;white-space:nowrap}.hero>p{color:#e2e6f2;font-size:16px;margin:10px 0 24px;text-shadow:0 2px 10px #000c}.trustline{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:30px}.trustline span{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:500;color:#edf0f9;text-shadow:0 2px 10px #000}.trustline img{width:24px;height:24px;filter:invert(80%) sepia(75%) saturate(2008%) hue-rotate(144deg) brightness(106%)}
.purchase-panel{max-width:580px;margin:0 auto 30px;padding:25px 30px 22px;border:1px solid rgba(255,90,162,.86);background:linear-gradient(155deg,rgba(66,30,58,.95),rgba(20,25,40,.985) 52%,rgba(13,23,38,.985));border-radius:22px;box-shadow:0 12px 50px #03050a99,0 0 30px #ed267544,inset 0 1px 0 #ff8bc32b}.panel-topline{display:flex;justify-content:center;gap:15px;align-items:center;text-align:left}.ticket-badge{display:grid;place-items:center;background:linear-gradient(135deg,#ff5ba8,#f12e84);border-radius:15px;width:57px;height:57px;transform:rotate(-12deg);box-shadow:0 10px 24px #ff2d8040}.ticket-badge img{height:31px;width:31px;filter:brightness(0) invert(1);transform:rotate(12deg)}.panel-name h2{font-size:22px;margin:0;letter-spacing:.01em}.panel-name p{font-size:12px;color:#d3c4d0;margin:3px 0 0}.price-area{text-align:center;margin:10px 0 6px}.price{display:flex;justify-content:center;align-items:baseline;color:#ff5c9e;text-shadow:0 0 25px #ff1b7e69;line-height:1.06}.price strong{font-size:73px;font-weight:850;letter-spacing:-.065em;font-variant-numeric:tabular-nums}.currency{font-size:32px;font-weight:800;margin-right:9px}.price-area p{color:#b6b4c1;font-size:12px;margin:7px 0 13px}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;font-size:12px;color:#f0e9ee;margin:0 0 14px}.benefits div{display:flex;align-items:center;gap:5px;white-space:nowrap}.benefits img{width:17px;height:17px;filter:invert(65%) sepia(87%) saturate(3012%) hue-rotate(293deg) brightness(100%)}.divide{height:1px;background:#77819736;margin:14px 0 15px}.payment-fieldset{padding:0;border:0;margin:0}.payment-fieldset legend{margin:0 0 12px;font-size:14px;font-weight:650}.payment-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.payment{position:relative;min-height:61px;background:#192336;border:1px solid #3a5b94;border-radius:11px;color:#f7f9fe;display:flex;justify-content:center;align-items:center;gap:10px;font-weight:650;transition:.18s ease;box-shadow:inset 0 1px #ffffff0a}.payment:hover{filter:brightness(1.15)}.payment.active{background:linear-gradient(130deg,#3c213b,#2c1c39);border:2px solid #ff4b99;box-shadow:0 0 18px #fc2b8742}.pay-mark{width:31px;height:31px;border-radius:8px;display:grid;place-items:center;font-size:20px;font-weight:bold;color:#fff;line-height:1}.pay-mark.wechat{background:#13b953}.pay-mark.alipay{background:#158de9}.select-check{position:absolute;top:5px;right:6px;background:#ff51a2;color:#232035;border-radius:50%;width:18px;height:18px;font-size:12px;font-weight:900;display:none;align-items:center;justify-content:center}.payment.active .select-check{display:flex}.buy-button{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;margin-top:16px;min-height:57px;border:0;border-radius:35px;background:linear-gradient(90deg,#ff60a5,#f51e83);color:white;font-size:20px;font-weight:750;box-shadow:0 6px 25px #ff2f8c6b;transition:transform .17s,filter .17s}.buy-button img{width:22px;height:22px;filter:brightness(0) invert(1)}.buy-button:hover{transform:translateY(-2px);filter:brightness(1.07)}.buy-button:active{transform:translateY(1px)}.delivery-note{color:#cbd7e6;text-align:center;margin:16px 0 0;font-size:12px}.delivery-note img{width:17px;height:17px;vertical-align:middle;margin-right:3px;filter:invert(66%) sepia(89%) saturate(339%) hue-rotate(97deg)}.delivery-note a,.page-footer a,.page-footer button{color:#51abff}.delivery-note a:hover,.page-footer a:hover,.page-footer button:hover{text-decoration:underline}
.resources,.purchase-details{max-width:900px;margin:0 auto;padding:0 24px}.resources{text-align:center;margin-top:20px}.resources h2{font-size:20px;margin:0 0 2px}.resource-caption{font-size:12px;color:#aeb9cd;margin:0 0 17px}.resource-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.resource{padding:19px 7px 17px;display:flex;gap:7px;flex-direction:column;align-items:center;border:1px solid #293852;border-radius:12px;background:linear-gradient(180deg,#1c2a3d,#142033);box-shadow:inset 0 1px #ffffff08}.resource-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:11px}.resource-icon img{width:33px;height:33px;filter:brightness(0) invert(1)}.resource-icon.blue{background:linear-gradient(135deg,#3577ee,#2049a2)}.resource-icon.purple{background:linear-gradient(135deg,#8a64f1,#43308d)}.resource-icon.pink{background:linear-gradient(135deg,#fc4bb0,#9f267f)}.resource-icon.cyan{background:linear-gradient(135deg,#20dae0,#0f6376)}.resource b{font-size:14px}.resource small{font-size:11px;color:#a5afc3}.purchase-details{margin-top:24px}.purchase-details-header{display:flex;justify-content:space-between;align-items:center}.purchase-details-header h2{font-size:15px;margin:0}.purchase-details-header button{background:none;border:none;color:#71b8ff;font-size:12px}.purchase-details{background:linear-gradient(#182338,#151f31);padding:18px 22px;border:1px solid #293952;border-radius:13px}.purchase-details ul{margin:9px 0 0;padding-left:18px;color:#bac6d9;font-size:12px}.purchase-details li{padding:3px 0}.page-footer{text-align:center;display:flex;justify-content:center;gap:11px;align-items:center;padding:22px 12px 40px;color:#b4bed0;font-size:12px;flex-wrap:wrap}.page-footer button{background:none;border:0;padding:0;font-size:12px}.footer-sep{opacity:.4}
#info-dialog{max-width:420px;width:calc(100% - 34px);background:#1b2536;border:1px solid #52617b;border-radius:17px;color:#f8f8fb;padding:20px;box-shadow:var(--shadow)}#info-dialog::backdrop{background:#020611be;backdrop-filter:blur(3px)}.dialog-header{display:flex;justify-content:space-between;align-items:center}.dialog-header h2{margin:0;font-size:19px}.dialog-header button{background:none;border:0;color:#b9c3d5;font-size:24px}.dialog-ok{display:block;margin:19px 0 0 auto;background:#f23585;color:white;border:0;border-radius:9px;padding:9px 24px}
@media(max-width:768px){.site-header{height:61px}.topbar{padding:0 16px}.brand-icon{width:34px;height:34px}.brand strong{font-size:16px}.brand small{font-size:9px}.links{gap:12px}.links>*{font-size:12px}.links [data-action="help"]{display:none}.links img{display:none}.hero-backdrop{top:61px;height:640px;background:linear-gradient(180deg,rgba(8,13,24,.11),rgba(8,13,24,.24) 40%,rgba(12,18,30,.9) 75%,#0e1422),linear-gradient(90deg,#0e142280,#0e142211),var(--hero-mobile, url('/uploads/site/hero_mobile.webp')) 66% 25%/cover no-repeat}.hero{padding:38px 14px 24px}.hero h1{font-size:clamp(25px,5vw,33px)}.hero>p{font-size:13px;margin:9px 0 20px}.trustline{gap:16px}.trustline span{font-size:11px}.trustline img{width:20px;height:20px}.purchase-panel{margin:0 16px 22px;padding:22px 20px 18px}.resources,.purchase-details{margin-left:16px;margin-right:16px}.resources{padding:0}.resources h2{font-size:17px}.resource-grid{grid-template-columns:repeat(2,1fr)}.purchase-details{padding:15px 17px}}
@media(max-width:480px){.brand{gap:8px}.brand strong{font-size:15px}.brand small{display:none}.links [data-action="service"]{display:none}.site-header{height:57px}.hero-backdrop{top:57px;height:640px;background-position:center,center,65% 25%}.hero{padding:34px 10px 22px}.hero h1{max-width:365px;font-size:28px;line-height:1.33;margin:0 auto}.hero h1 span{display:block;font-size:36px;letter-spacing:.1em}.hero>p{font-size:12px;margin:6px 0 15px}.trustline{gap:13px}.trustline img{width:18px;height:18px}.trustline span{font-size:11px;gap:3px}.purchase-panel{margin:0 12px 18px;padding:16px 16px 16px;border-radius:18px}.ticket-badge{width:42px;height:42px;border-radius:11px}.ticket-badge img{width:25px;height:25px}.panel-name h2{font-size:17px}.panel-name p{font-size:11px}.price-area{margin:8px 0 4px}.price strong{font-size:58px}.currency{font-size:26px}.price-area p{font-size:11px;margin:4px 0 11px}.benefits{grid-template-columns:1fr;gap:3px;font-size:11px;margin-bottom:9px;max-width:250px;margin-left:auto;margin-right:auto}.divide{margin:11px 0 10px}.payment-fieldset legend{font-size:12px;margin-bottom:8px}.payment-options{gap:8px}.payment{font-size:12px;gap:5px;min-height:51px;padding:5px 8px}.pay-mark{width:26px;height:26px;font-size:17px}.select-check{width:14px;height:14px;font-size:10px;top:3px;right:3px}.buy-button{min-height:50px;font-size:16px;margin-top:12px;gap:7px}.buy-button img{width:19px;height:19px}.delivery-note{margin-top:12px;font-size:10px}.resources h2{font-size:16px}.resource-caption{font-size:11px}.resource-grid{gap:9px}.resource{padding:14px 8px}.resource b{font-size:13px}.resource small{font-size:10px}.resource-icon{width:38px;height:38px}.resource-icon img{width:27px;height:27px}.purchase-details{margin-top:14px}.page-footer{padding-top:16px}.page-footer button:last-child{width:100%;margin-top:2px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}


/* ==========================================================================
   真实业务接入部分的补充样式（原 v1 沿用 + 新增）
   ========================================================================== */

/* 支付方式：优先用站内已有的官方 Logo，没有 Logo 时退回「微/支」文字标 */
.payment img.pay-logo { width: 26px; height: 26px; border-radius: 6px; object-fit: contain; }

/* 主按钮提交态 */
.buy-button:disabled { opacity: .78; cursor: progress; transform: none; filter: none; }
.buy-button.is-loading { position: relative; }
.buy-button.is-loading::after {
    content: ""; position: absolute; right: 22px; top: 50%; width: 16px; height: 16px;
    margin-top: -8px; border: 2px solid rgba(255,255,255,.35); border-top-color: #fff;
    border-radius: 50%; animation: xgSpin .7s linear infinite;
}
@keyframes xgSpin { to { transform: rotate(360deg); } }

/* 售罄 / 未开启支付时的提示条 */
.buy-off-note {
    margin: 14px 0 0; padding: 11px 14px; border-radius: 11px; text-align: center; font-size: 12.5px;
    color: #FFE0A8; background: rgba(255, 176, 32, .12); border: 1px solid rgba(255, 176, 32, .34);
}
.buy-off-note button { background: none; border: 0; padding: 0; color: #FFC978; font: inherit; cursor: pointer; }
.buy-off-note button:hover { text-decoration: underline; }

/* 正文里内联的「联系客服」：去掉浏览器默认按钮外观，表现为链接 */
.purchase-details li button, .buy-off-note button {
    background: none; border: 0; padding: 0; margin: 0;
    font: inherit; color: #51abff; cursor: pointer; vertical-align: baseline;
}
.purchase-details li button:hover, .buy-off-note button:hover { text-decoration: underline; }

/* 说明弹窗里的富文本 */
#info-dialog p { margin: 14px 0 0; font-size: 13px; line-height: 1.75; color: #cfd7e6; white-space: normal; }
#info-dialog ul { margin: 10px 0 0; padding-left: 19px; font-size: 12.5px; line-height: 1.85; color: #c3cbdb; }
#info-dialog li { padding: 2px 0; }
#info-dialog a { color: #51abff; }

/* ---------- 在线客服（沿用 chat-v5.js 的 DOM 结构，仅换肤） ---------- */
.chat-mask {
    position: fixed; inset: 0; z-index: 80;
    background: rgba(6, 9, 16, .72);
    backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px);
    display: none; align-items: flex-end; justify-content: center;
}
.chat-mask.open { display: flex; }
.visitor-chat {
    width: min(520px, calc(100vw - 24px));
    background: #151C2A;
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 20px 20px 0 0;
    overflow: hidden; color: #f7f8fc;
    box-shadow: 0 -22px 60px rgba(0, 0, 0, .6);
}
.visitor-chat header {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 15px 18px; border-bottom: 1px solid rgba(255, 255, 255, .07);
}
.visitor-chat header strong { font-size: 15px; }
.visitor-chat small { display: block; color: #8A96AC; margin-top: 3px; font-size: 11px; line-height: 1.4; }
#close-chat {
    width: 34px; height: 34px; flex: none; border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 50%; background: rgba(255, 255, 255, .06); cursor: pointer; position: relative;
}
.close-lines::before, .close-lines::after {
    content: ""; position: absolute; left: 10px; right: 10px; top: 16px; height: 2px;
    background: #D8DEEA; border-radius: 999px;
}
.close-lines::before { transform: rotate(45deg); }
.close-lines::after { transform: rotate(-45deg); }
.chat-welcome {
    padding: 11px 18px; font-size: 12px; line-height: 1.7; color: #F3DCE8;
    background: rgba(242, 53, 133, .12); border-bottom: 1px solid rgba(255, 255, 255, .06);
}
.chat-messages { max-height: 340px; overflow: auto; padding: 14px; background: #0F1521; }
.chat-bubble {
    max-width: 82%; margin: 8px 0; padding: 9px 12px; border-radius: 12px;
    background: #202A3C; border: 1px solid rgba(255, 255, 255, .07);
    color: #E6EBF5; font-size: 13px; line-height: 1.6; word-break: break-word;
}
.chat-bubble.admin { margin-left: auto; background: rgba(49, 143, 244, .18); border-color: rgba(49, 143, 244, .32); }
.chat-bubble img { max-width: 200px; border-radius: 10px; display: block; }
.visitor-chat form { display: flex; gap: 8px; padding: 12px; border-top: 1px solid rgba(255, 255, 255, .07); }
.visitor-chat input[name=message] {
    flex: 1; min-width: 0; border: 1px solid rgba(255, 255, 255, .12); border-radius: 10px;
    padding: 10px 12px; background: #0F1521; color: #E6EBF5; font-size: 13px; font-family: inherit;
}
.visitor-chat input[name=message]::placeholder { color: #6C7A93; }
.chat-image { display: inline-flex; align-items: center; cursor: pointer; }
.chat-image input { display: none; }
.chat-image, .chat-send {
    border: 0; border-radius: 10px; background: rgba(255, 255, 255, .08);
    color: #D8DEEA; padding: 10px 12px; font-weight: 700; font-size: 12.5px; cursor: pointer;
}
.chat-send { background: linear-gradient(90deg, #FF5C9C, #F02486); color: #fff; }

/* 超小屏保护：不再压缩已经在动对字号的关键元素 */
@media (max-width: 340px) {
    .brand strong { font-size: 14px; }
    .price strong { font-size: 52px; }
}
