/* ============================================
   dun-uni-v2.css - 屏墩墩联盟 OPC 统一样式 v3.1
   深黑科技风 + 金色#D4AF37强调
   ============================================ */

:root{
  --bg:#0a0a0f;
  --bg2:#12121a;
  --bg-card:#16161f;
  --bg-card2:#1c1c28;
  --gold:#c9a84c;
  --gold2:#e0c878;
  --gold3:#D4AF37;
  --text:#e8e6e0;
  --text2:#9a98a0;
  --text3:#6a6870;
  --line:#2a2a35;
  --line2:#3a3a48;
  --error:#ff4d4f;
  --success:#52c41a;
  --warning:#faad14;
  --radius:8px;
  --radius-lg:12px;
  --shadow:0 4px 24px rgba(0,0,0,.4);
  --shadow-gold:0 4px 24px rgba(212,175,55,.15);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.6;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
a{text-decoration:none;color:inherit;transition:color .2s}
a:hover{color:var(--gold)}
img{max-width:100%;display:block}
ul,ol{list-style:none}

/* ===== 导航 ===== */
.nav{
  position:sticky;top:0;z-index:100;
  background:rgba(10,10,15,.95);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-inner{
  max-width:1200px;margin:0 auto;
  padding:14px 24px;
  display:flex;align-items:center;gap:24px;
}
.logo{
  display:flex;align-items:center;gap:10px;
  font-weight:800;font-size:18px;color:var(--gold);
}
.logo img{height:36px;border-radius:50%}
.nav-links{
  display:flex;gap:28px;margin-left:32px;font-size:14px;
}
.nav-links a{color:var(--text2);transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--gold)}
.nav-right{margin-left:auto;display:flex;gap:12px;align-items:center}

/* ===== 按钮 ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:9px 20px;border-radius:var(--radius);
  font-size:14px;font-weight:600;cursor:pointer;
  transition:all .2s;border:none;
}
.btn-gold{
  background:linear-gradient(135deg,var(--gold),var(--gold2));
  color:#0a0a0f;
}
.btn-gold:hover{
  background:linear-gradient(135deg,var(--gold2),var(--gold));
  transform:translateY(-1px);
  box-shadow:var(--shadow-gold);
}
.btn-outline{
  border:1px solid var(--gold);color:var(--gold);background:transparent;
}
.btn-outline:hover{background:var(--gold);color:var(--bg)}
.btn-ghost{
  border:1px solid var(--line2);color:var(--text2);background:transparent;
}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold)}
.btn-submit{width:100%;padding:12px;font-size:15px}
.btn-sm{padding:6px 14px;font-size:13px}
.btn-lg{padding:14px 32px;font-size:16px}

/* ===== 表单 ===== */
.form-group{margin-bottom:18px}
.form-group label{
  display:block;margin-bottom:6px;
  font-size:13px;color:var(--text2);font-weight:500;
}
.form-group input,
.form-group select,
.form-group textarea{
  width:100%;padding:11px 14px;
  background:var(--bg2);border:1px solid var(--line);
  border-radius:var(--radius);color:var(--text);
  font-size:14px;transition:border-color .2s;
  outline:none;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(212,175,55,.1);
}
.form-group input::placeholder{color:var(--text3)}
.form-row{display:flex;gap:14px}
.form-row .form-group{flex:1}
.error-msg{
  color:var(--error);font-size:12px;margin-top:4px;
  display:none;
}
.form-group.has-error .error-msg{display:block}
.form-group.has-error input{border-color:var(--error)}

/* ===== 卡片 ===== */
.card{
  background:var(--bg-card);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:24px;
  transition:all .3s;
}
.card:hover{
  border-color:var(--gold);
  box-shadow:var(--shadow-gold);
  transform:translateY(-2px);
}
.card-gold{
  border:1px solid var(--gold);
  background:linear-gradient(135deg,rgba(212,175,55,.08),var(--bg-card));
}

/* ===== 布局容器 ===== */
.container{max-width:1200px;margin:0 auto;padding:0 24px}
.section{padding:60px 0}
.section-alt{background:var(--bg2)}
.center{text-align:center}
.muted{color:var(--text2)}
.gold{color:var(--gold)}

/* ===== 页头 ===== */
.page-header{
  text-align:center;padding:60px 20px 40px;
}
.page-header h1{
  font-size:clamp(26px,3.6vw,38px);
  font-weight:900;margin-bottom:12px;
  background:linear-gradient(135deg,var(--gold2),var(--gold));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
}
.page-header .subtitle{color:var(--text2);font-size:16px;max-width:640px;margin:0 auto}
.badge{
  display:inline-block;padding:5px 14px;
  background:rgba(212,175,55,.12);
  border:1px solid rgba(212,175,55,.3);
  color:var(--gold);border-radius:20px;
  font-size:12px;font-weight:600;margin-bottom:16px;
}

/* ===== 网格 ===== */
.grid{display:grid;gap:20px}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.grid-4{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}

/* ===== 登录/注册卡片 ===== */
.login-wrap,.register-wrap{
  flex:1;display:flex;align-items:center;justify-content:center;
  padding:40px 20px;
}
.login-card,.register-card{
  width:100%;max-width:420px;
  background:var(--bg-card);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:36px 32px;
  box-shadow:var(--shadow);
}
.login-card h2,.register-card h2{
  font-size:24px;font-weight:800;margin-bottom:6px;
  color:var(--gold);text-align:center;
}
.login-card .subtitle,.register-card .subtitle{
  text-align:center;color:var(--text2);font-size:14px;margin-bottom:28px;
}
.divider{
  display:flex;align-items:center;gap:12px;
  margin:20px 0;color:var(--text3);font-size:12px;
}
.divider::before,.divider::after{
  content:"";flex:1;height:1px;background:var(--line);
}
.register-link,.login-link{
  text-align:center;margin-top:20px;font-size:14px;color:var(--text2);
}
.register-link a,.login-link a{color:var(--gold);font-weight:600}

/* ===== 微信/二维码 ===== */
.wechat-btn{
  width:100%;padding:11px;
  background:#07c160;color:#fff;border:none;
  border-radius:var(--radius);font-size:14px;font-weight:600;
  cursor:pointer;transition:opacity .2s;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.wechat-btn:hover{opacity:.9}
.qrcode-box{
  text-align:center;padding:20px;
  background:var(--bg2);border-radius:var(--radius);
  margin-top:16px;
}
.qrcode-placeholder{
  width:140px;height:140px;margin:0 auto 10px;
  background:#fff;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-size:48px;
}
.qrcode-tip{font-size:12px;color:var(--text3)}

/* ===== 密码强度 ===== */
.password-strength{margin-top:8px}
.password-strength-bar{
  height:4px;background:var(--line);border-radius:2px;overflow:hidden;
}
.password-strength-bar span{
  display:block;height:100%;width:0;
  background:var(--error);transition:all .3s;
}
.strength-text{font-size:12px;color:var(--text3);margin-top:4px}

/* ===== 权益/福利 ===== */
.benefits{margin:24px 0}
.benefit-list{display:flex;flex-direction:column;gap:12px}
.benefit-item{
  display:flex;align-items:flex-start;gap:12px;
  padding:14px;background:var(--bg2);border-radius:var(--radius);
}
.benefit-item .icon{font-size:20px;flex-shrink:0}
.benefit-item h4{font-size:14px;color:var(--text);margin-bottom:2px}
.benefit-item p{font-size:12px;color:var(--text2)}

/* ===== 页脚 ===== */
.footer{
  padding:28px 24px;text-align:center;
  border-top:1px solid var(--line);
  color:var(--text3);font-size:13px;
}
.footer a{color:var(--text2)}
.footer a:hover{color:var(--gold)}

/* ===== Toast / Modal ===== */
.toast{
  position:fixed;top:20px;left:50%;transform:translateX(-50%);
  background:var(--bg-card);border:1px solid var(--gold);
  color:var(--text);padding:12px 24px;border-radius:var(--radius);
  z-index:9999;opacity:0;transition:opacity .3s;
  box-shadow:var(--shadow);
}
.toast.show{opacity:1}
.modal-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.7);
  z-index:1000;display:none;align-items:center;justify-content:center;
}
.modal-overlay.show{display:flex}
.modal{
  background:var(--bg-card);border:1px solid var(--line);
  border-radius:var(--radius-lg);padding:28px;max-width:400px;width:90%;
  position:relative;
}
.modal-close{
  position:absolute;top:12px;right:16px;
  background:none;border:none;color:var(--text3);
  font-size:20px;cursor:pointer;
}
.modal-close:hover{color:var(--gold)}

/* ===== Loading ===== */
.loading{
  display:inline-block;width:18px;height:18px;
  border:2px solid var(--line);border-top-color:var(--gold);
  border-radius:50%;animation:spin .8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* ===== 响应式 ===== */
@media(max-width:768px){
  .nav-inner{padding:12px 16px;gap:12px}
  .nav-links{display:none}
  .container{padding:0 16px}
  .section{padding:40px 0}
  .page-header{padding:40px 16px 28px}
  .page-header h1{font-size:26px}
  .form-row{flex-direction:column;gap:0}
  .login-card,.register-card{padding:28px 20px}
}
@media(max-width:480px){
  .nav-right .btn-outline{display:none}
}

/* FIX: prevent huge logo from img{max-width:100%} */
.logo img{height:36px !important;width:auto !important;max-height:36px !important;max-width:none !important;}
.nav .logo img{height:36px !important;width:auto !important;max-height:36px !important;max-width:none !important;}

body.theme-light .seo-tldr{color:#333!important}

/* ============================================================
   PDDUN THEME V2 (2026-09-18) 双主题权威收口 — 小八
   深色: 大标题/重点 = 金色 #D4AF37, 小字 = 白色 #E6E6E6
   浅色: 大标题/重点 = 金色 #D4AF37, 小字 = 黑色 #333333
   ============================================================ */
/* ========== 深色主题 ========== */
html[data-theme="dark"] body{background:#0A0E1A!important;color:#f2f5f9!important}
html[data-theme="dark"] h1,html[data-theme="dark"] h2,html[data-theme="dark"] h3,html[data-theme="dark"] h4,html[data-theme="dark"] h5,html[data-theme="dark"] h6{color:#e8c547!important}
html[data-theme="dark"] p,html[data-theme="dark"] li,html[data-theme="dark"] td,html[data-theme="dark"] th,html[data-theme="dark"] label,html[data-theme="dark"] small,html[data-theme="dark"] dd,html[data-theme="dark"] dt{color:#f2f5f9!important}
html[data-theme="dark"] span{color:#f2f5f9!important}
html[data-theme="dark"] .btn,html[data-theme="dark"] .btn-gold,html[data-theme="dark"] .btn-primary,html[data-theme="dark"] .tab-btn.active,html[data-theme="dark"] .rank,html[data-theme="dark"] .rank-num,html[data-theme="dark"] .buy-btn{color:#0A0E1A!important}
html[data-theme="dark"] .hl,html[data-theme="dark"] .amt,html[data-theme="dark"] .gold,html[data-theme="dark"] .ticker-label{color:#e8c547!important}
html[data-theme="dark"] .card,html[data-theme="dark"] .stat,html[data-theme="dark"] .step,html[data-theme="dark"] .news-card,html[data-theme="dark"] .feature-card,html[data-theme="dark"] .pricing-card,html[data-theme="dark"] .matrix-card,html[data-theme="dark"] .testimonial-card,html[data-theme="dark"] .faq-item,html[data-theme="dark"] .entry-card,html[data-theme="dark"] .role-card,html[data-theme="dark"] .action-card,html[data-theme="dark"] .user-card{background:#141B2D!important;border:1px solid #2D333B!important;color:#f2f5f9!important}
html[data-theme="dark"] .card h3,html[data-theme="dark"] .card h4,html[data-theme="dark"] .news-card h3,html[data-theme="dark"] .feature-card h3,html[data-theme="dark"] .pricing-card h3,html[data-theme="dark"] .matrix-card h3,html[data-theme="dark"] .entry-card h3,html[data-theme="dark"] .role-card h3,html[data-theme="dark"] .action-card h3{color:#e8c547!important}
html[data-theme="dark"] .card p,html[data-theme="dark"] .news-card p,html[data-theme="dark"] .feature-card p,html[data-theme="dark"] .pricing-card p,html[data-theme="dark"] .matrix-card p,html[data-theme="dark"] .entry-card p,html[data-theme="dark"] .role-card p,html[data-theme="dark"] .action-card p{color:#C9CDD4!important}
html[data-theme="dark"] .tbl{background:#141B2D!important}
html[data-theme="dark"] .tbl th{background:#1A2233!important;color:#e8c547!important}
/* ========== 浅色主题 ========== */
html[data-theme="light"] body{background:#F4F5F8!important;color:#333333!important}
html[data-theme="light"] h1,html[data-theme="light"] h2,html[data-theme="light"] h3,html[data-theme="light"] h4,html[data-theme="light"] h5,html[data-theme="light"] h6{color:#c9a227!important}
html[data-theme="light"] p,html[data-theme="light"] li,html[data-theme="light"] td,html[data-theme="light"] th,html[data-theme="light"] label,html[data-theme="light"] small,html[data-theme="light"] dd,html[data-theme="light"] dt{color:#333333!important}
html[data-theme="light"] span{color:#333333!important}
html[data-theme="light"] .hl{color:#c9a227!important}
html[data-theme="light"] .amt,html[data-theme="light"] .gold,html[data-theme="light"] .ticker-label{color:#c9a227!important}
html[data-theme="light"] .btn,html[data-theme="light"] .btn-gold,html[data-theme="light"] .btn-primary,html[data-theme="light"] .tab-btn.active,html[data-theme="light"] .rank,html[data-theme="light"] .rank-num,html[data-theme="light"] .buy-btn{color:#0A0E1A!important}
html[data-theme="light"] .card,html[data-theme="light"] .stat,html[data-theme="light"] .step,html[data-theme="light"] .news-card,html[data-theme="light"] .feature-card,html[data-theme="light"] .pricing-card,html[data-theme="light"] .matrix-card,html[data-theme="light"] .testimonial-card,html[data-theme="light"] .faq-item,html[data-theme="light"] .entry-card,html[data-theme="light"] .role-card,html[data-theme="light"] .action-card,html[data-theme="light"] .user-card{background:#FFFFFF!important;border:1px solid #E5E7EB!important;color:#333333!important}
html[data-theme="light"] section{background:#F4F5F8!important}
html[data-theme="light"] .hero{background:linear-gradient(135deg,#F4F5F8 0%,#FFFFFF 55%,#EFF1F5 100%)!important}
html[data-theme="light"] .nav{background:rgba(255,255,255,.92)!important}
html[data-theme="light"] .live-ticker{background:#F5F5F5!important}
html[data-theme="light"] .tbl{background:#FFFFFF!important}

/* ==== V2 别名轨(body class) ==== */
/* ============================================================
   PDDUN THEME V2 (2026-09-18) 双主题权威收口 — 小八
   深色: 大标题/重点 = 金色 #D4AF37, 小字 = 白色 #E6E6E6
   浅色: 大标题/重点 = 金色 #D4AF37, 小字 = 黑色 #333333
   ============================================================ */
/* ========== 深色主题 ========== */
body.theme-dark body{background:#0A0E1A!important;color:#f2f5f9!important}
body.theme-dark h1,body.theme-dark h2,body.theme-dark h3,body.theme-dark h4,body.theme-dark h5,body.theme-dark h6{color:#e8c547!important}
body.theme-dark p,body.theme-dark li,body.theme-dark td,body.theme-dark th,body.theme-dark label,body.theme-dark small,body.theme-dark dd,body.theme-dark dt{color:#f2f5f9!important}
body.theme-dark span{color:#f2f5f9!important}
body.theme-dark .btn,body.theme-dark .btn-gold,body.theme-dark .btn-primary,body.theme-dark .tab-btn.active,body.theme-dark .rank,body.theme-dark .rank-num,body.theme-dark .buy-btn{color:#0A0E1A!important}
body.theme-dark .hl,body.theme-dark .amt,body.theme-dark .gold,body.theme-dark .ticker-label{color:#e8c547!important}
body.theme-dark .card,body.theme-dark .stat,body.theme-dark .step,body.theme-dark .news-card,body.theme-dark .feature-card,body.theme-dark .pricing-card,body.theme-dark .matrix-card,body.theme-dark .testimonial-card,body.theme-dark .faq-item,body.theme-dark .entry-card,body.theme-dark .role-card,body.theme-dark .action-card,body.theme-dark .user-card{background:#141B2D!important;border:1px solid #2D333B!important;color:#f2f5f9!important}
body.theme-dark .card h3,body.theme-dark .card h4,body.theme-dark .news-card h3,body.theme-dark .feature-card h3,body.theme-dark .pricing-card h3,body.theme-dark .matrix-card h3,body.theme-dark .entry-card h3,body.theme-dark .role-card h3,body.theme-dark .action-card h3{color:#e8c547!important}
body.theme-dark .card p,body.theme-dark .news-card p,body.theme-dark .feature-card p,body.theme-dark .pricing-card p,body.theme-dark .matrix-card p,body.theme-dark .entry-card p,body.theme-dark .role-card p,body.theme-dark .action-card p{color:#C9CDD4!important}
body.theme-dark .tbl{background:#141B2D!important}
body.theme-dark .tbl th{background:#1A2233!important;color:#e8c547!important}
/* ========== 浅色主题 ========== */
body.theme-light body{background:#F4F5F8!important;color:#333333!important}
body.theme-light h1,body.theme-light h2,body.theme-light h3,body.theme-light h4,body.theme-light h5,body.theme-light h6{color:#c9a227!important}
body.theme-light p,body.theme-light li,body.theme-light td,body.theme-light th,body.theme-light label,body.theme-light small,body.theme-light dd,body.theme-light dt{color:#333333!important}
body.theme-light span{color:#333333!important}
body.theme-light .hl{color:#c9a227!important}
body.theme-light .amt,body.theme-light .gold,body.theme-light .ticker-label{color:#c9a227!important}
body.theme-light .btn,body.theme-light .btn-gold,body.theme-light .btn-primary,body.theme-light .tab-btn.active,body.theme-light .rank,body.theme-light .rank-num,body.theme-light .buy-btn{color:#0A0E1A!important}
body.theme-light .card,body.theme-light .stat,body.theme-light .step,body.theme-light .news-card,body.theme-light .feature-card,body.theme-light .pricing-card,body.theme-light .matrix-card,body.theme-light .testimonial-card,body.theme-light .faq-item,body.theme-light .entry-card,body.theme-light .role-card,body.theme-light .action-card,body.theme-light .user-card{background:#FFFFFF!important;border:1px solid #E5E7EB!important;color:#333333!important}
body.theme-light section{background:#F4F5F8!important}
body.theme-light .hero{background:linear-gradient(135deg,#F4F5F8 0%,#FFFFFF 55%,#EFF1F5 100%)!important}
body.theme-light .nav{background:rgba(255,255,255,.92)!important}
body.theme-light .live-ticker{background:#F5F5F5!important}
body.theme-light .tbl{background:#FFFFFF!important}

/* === 购买/主CTA按钮统一金底深字 v5 20260919 === */
html[data-theme="dark"] .buy-btn,html[data-theme="dark"] a.buy-btn,html[data-theme="dark"] .btn-primary,html[data-theme="dark"] .btn-gold,html[data-theme="dark"] .buy-now{background:linear-gradient(135deg,#F0D26B 0%,#D4AF37 100%)!important;background-color:#D4AF37!important;color:#0A0E1A!important;-webkit-text-fill-color:#0A0E1A!important;border:1px solid #D4AF37!important;box-shadow:0 4px 16px rgba(212,175,55,.25)!important}
html[data-theme="dark"] .buy-btn:hover,html[data-theme="dark"] .btn-primary:hover,html[data-theme="dark"] .btn-gold:hover,html[data-theme="dark"] .buy-now:hover{background:linear-gradient(135deg,#F5DD7E 0%,#D4AF37 100%)!important;color:#0A0E1A!important;-webkit-text-fill-color:#0A0E1A!important}
html[data-theme="light"] .buy-btn,html[data-theme="light"] a.buy-btn,html[data-theme="light"] .btn-primary,html[data-theme="light"] .btn-gold,html[data-theme="light"] .buy-now{background:linear-gradient(135deg,#F0D26B 0%,#D4AF37 100%)!important;background-color:#D4AF37!important;color:#0A0E1A!important;-webkit-text-fill-color:#0A0E1A!important;border:1px solid #D4AF37!important}
html[data-theme="light"] .buy-btn:hover,html[data-theme="light"] .btn-primary:hover,html[data-theme="light"] .btn-gold:hover,html[data-theme="light"] .buy-now:hover{background:linear-gradient(135deg,#F5DD7E 0%,#D4AF37 100%)!important;color:#0A0E1A!important;-webkit-text-fill-color:#0A0E1A!important}

/* ===== 深色默认态统一兜底 v6 20260919（高特异度覆盖独立内页硬编码暗灰/纯白） ===== */
html body:not(.theme-light){background-color:#0A0E1A!important;color:#ffffff!important;}
html body:not(.theme-light) header,html body:not(.theme-light) nav,html body:not(.theme-light) main,html body:not(.theme-light) section,html body:not(.theme-light) footer,html body:not(.theme-light) .pricing,html body:not(.theme-light) .feature,html body:not(.theme-light) .cta,html body:not(.theme-light) .final-cta{background-color:#0A0E1A!important;}
html body:not(.theme-light) .hero{background:#0A0E1A!important;}
html body:not(.theme-light) .card,html body:not(.theme-light) .feature-card,html body:not(.theme-light) .pricing-card,html body:not(.theme-light) .matrix-card,html body:not(.theme-light) .testimonial-card,html body:not(.theme-light) .faq-item,html body:not(.theme-light) .entry-card,html body:not(.theme-light) .role-card,html body:not(.theme-light) .action-card,html body:not(.theme-light) .user-card,html body:not(.theme-light) .stat-card,html body:not(.theme-light) .case-card,html body:not(.theme-light) .news-card,html body:not(.theme-light) .video-card,html body:not(.theme-light) .panel{background-color:#0E1426!important;border:1px solid #232B45!important;color:#ffffff!important;}
html body:not(.theme-light) p,html body:not(.theme-light) li,html body:not(.theme-light) td,html body:not(.theme-light) th,html body:not(.theme-light) label,html body:not(.theme-light) small,html body:not(.theme-light) .role,html body:not(.theme-light) .desc,html body:not(.theme-light) .muted,html body:not(.theme-light) .text-muted,html body:not(.theme-light) .subtitle,html body:not(.theme-light) .nav-links a,html body:not(.theme-light) .stat-label,html body:not(.theme-light) .case-meta,html body:not(.theme-light) .agent-info p,html body:not(.theme-light) .filter-btn,html body:not(.theme-light) .tag-btn,html body:not(.theme-light) .card p,html body:not(.theme-light) .feature-card p,html body:not(.theme-light) .users{color:#D7DEEA!important;-webkit-text-fill-color:#D7DEEA!important;}
html body:not(.theme-light) h1,html body:not(.theme-light) h2,html body:not(.theme-light) h3,html body:not(.theme-light) h4{color:#f5dd7e!important;-webkit-text-fill-color:#f5dd7e!important;}