/* ====================== 定旺坤 · 公共样式 ====================== */

*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;background:linear-gradient(180deg,#1a0a00 0%,#2d1410 30%,#f5f0eb 30%,#ede3d9 100%);min-height:100vh;color:#333}

/* === 头部 === */
.header{text-align:center;padding:36px 20px 28px;color:#e8c170}
.header h1{font-size:26px;font-weight:700;letter-spacing:3px;margin-bottom:4px;text-shadow:0 2px 8px rgba(0,0,0,.3)}
.header .sub{font-size:13px;opacity:.85;letter-spacing:2px}

/* === 容器 & 卡片 === */
.container{max-width:460px;margin:0 auto;padding:0 16px 40px}
.card{background:#fff;border-radius:16px;padding:24px 20px;box-shadow:0 4px 20px rgba(0,0,0,.08);margin-bottom:20px}
.card-title{font-size:18px;font-weight:700;color:#5c2a0e;margin-bottom:20px;display:flex;align-items:center;gap:8px}
.card-title::before{content:'';display:inline-block;width:4px;height:20px;background:#c8923b;border-radius:2px}

/* === 表单 === */
.form-group{margin-bottom:14px}
.form-group label{display:block;font-size:13px;color:#888;margin-bottom:5px}
.form-row{display:flex;gap:10px}
.form-row .form-group{flex:1}
input,select{width:100%;height:44px;border:1.5px solid #e0d5c8;border-radius:10px;padding:0 12px;font-size:15px;color:#333;background:#faf8f5;outline:none;-webkit-appearance:none;appearance:none}
input:focus,select:focus{border-color:#c8923b;background:#fff}
.gender-toggle{display:flex;border-radius:10px;overflow:hidden;border:1.5px solid #e0d5c8}
.gender-toggle button{flex:1;height:44px;border:none;background:#faf8f5;font-size:15px;color:#888;cursor:pointer}
.gender-toggle button:first-child{border-right:1px solid #e0d5c8}
.gender-toggle button.active{background:#5c2a0e;color:#e8c170;font-weight:600}

/* === 按钮 === */
.btn-go{width:100%;height:50px;background:linear-gradient(135deg,#8b4513,#5c2a0e);color:#e8c170;border:none;border-radius:12px;font-size:18px;font-weight:700;letter-spacing:3px;cursor:pointer;margin-top:8px}
.btn-go:active{transform:scale(.98)}
.btn-go:disabled{background:#ccc;color:#999;pointer-events:none}

/* === 结果卡片 === */
.result-card{position:relative;display:none;animation:fadeIn .4s}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.result-card.show{display:block}
.r-content{font-size:14px;line-height:1.85;color:#444;word-break:break-all}
.r-content h2{font-size:20px;color:#5c2a0e;margin:8px 0 12px;text-align:center}
.r-content h3{font-size:16px;color:#5c2a0e;margin:20px 0 10px;padding-left:8px;border-left:3px solid #c8923b}
.r-content b{color:#5c2a0e}
.r-content blockquote{background:#faf8f5;border-left:3px solid #c8923b;padding:10px 14px;margin:12px 0;color:#8b6914;border-radius:0 8px 8px 0;font-size:13px}
.r-content .green{color:#2e7d32}
.r-content .orange{color:#e65100}
.r-content .red{color:#c62828}
.r-content .tag{display:inline-block;background:#5c2a0e;color:#e8c170;padding:2px 10px;border-radius:10px;font-size:12px;margin:2px 4px}
.r-content .highlight{background:#fdf3e0;padding:12px 16px;border-radius:10px;margin:10px 0;border:1px solid #e8c170}
.r-content .wx-tag{display:inline-block;padding:1px 7px;border-radius:8px;font-size:11px;margin:1px 3px;color:#fff}
.wx-wood{background:#4caf50}
.wx-fire{background:#f44336}
.wx-earth{background:#8d6e3f}
.wx-metal{background:#fbc02d;color:#333}
.wx-water{background:#2196f3}

/* === 四柱对齐表格 === */
.pillars-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #e0d5c8;border-radius:14px;overflow:hidden;margin:16px 0;background:#fdfaf5}
.pg-cell{text-align:center;padding:12px 6px;border-right:1px solid #eee;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:130px}
.pg-cell:last-child{border-right:none}
.pg-head{font-size:12px;color:#888;padding:10px 0 8px;letter-spacing:1px;background:#faf6ef;text-align:center;font-weight:600}
.pg-cell.self{box-shadow:inset 0 0 0 2px #c8923b;background:linear-gradient(135deg,#fef9f0,#fdf3e0);position:relative;z-index:1;border-radius:2px}
.pg-cell.self::after{content:"您";position:absolute;top:4px;right:8px;font-size:10px;color:#c8923b;font-weight:700}
.pg-gan{font-size:28px;font-weight:700;color:#5c2a0e;line-height:1.2;width:100%;padding:2px 0}
.pg-zhi{font-size:22px;font-weight:600;color:#4a2008;line-height:1.2;width:100%;padding:1px 0 4px}
.pg-ss{font-size:12px;color:#c8923b;padding:2px 0;line-height:1.3;width:100%}
.pg-cang{font-size:11px;color:#999;line-height:1.6;width:100%;padding:4px 0 2px}

/* === 八字一排 === */
.bazi-row{text-align:center;font-size:26px;font-weight:700;color:#5c2a0e;letter-spacing:8px;margin:8px 0 2px;display:flex;justify-content:center;align-items:center;gap:4px}
.bazi-row .pz-char{display:inline-flex;flex-direction:column;align-items:center;min-width:42px}

/* === 大运表 === */
.dayun-table{width:100%;border-collapse:collapse;margin:10px 0;font-size:13px}
.dayun-table th{background:#5c2a0e;color:#e8c170;padding:8px 6px;text-align:center}
.dayun-table td{padding:7px 6px;text-align:center;border-bottom:1px solid #e0d5c8}
.dayun-table .current{background:#fdf3e0;font-weight:700}
.dayun-table .past{color:#aaa}

/* === 五行条 === */
.wx-bar-wrap{display:flex;align-items:center;margin:4px 0;font-size:12px}
.wx-bar-label{width:24px;text-align:center;font-weight:600}
.wx-bar-track{flex:1;height:10px;background:#f0e6d8;border-radius:5px;overflow:hidden;margin:0 8px}
.wx-bar-fill{height:100%;border-radius:5px;transition:width .8s}
.wx-bar-val{width:20px;font-weight:600;text-align:right}

/* === 加载动画 === */
.loading{display:none;text-align:center;padding:40px 0}
.loading.show{display:block}
.spinner{width:40px;height:40px;border:3px solid #f0e6d8;border-top-color:#c8923b;border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 16px}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-text{color:#888;font-size:13px;letter-spacing:2px}

/* === 师父卡片 === */
.master-card{background:linear-gradient(135deg,#5c2a0e,#8b4513);color:#fff;border-radius:16px;padding:20px;text-align:center;box-shadow:0 4px 20px rgba(139,69,19,.2)}
.master-av{width:64px;height:64px;border-radius:50%;background:#2d1410;border:3px solid #e8c170;margin:0 auto 12px;display:flex;align-items:center;justify-content:center;font-size:28px}
.master-name{font-size:20px;font-weight:700;color:#e8c170;margin-bottom:4px}
.master-desc{font-size:13px;opacity:.85;margin-bottom:12px}
.master-btn{display:inline-block;background:#e8c170;color:#5c2a0e;padding:10px 28px;border-radius:24px;font-size:15px;font-weight:600;text-decoration:none}
.master-btn:active{transform:scale(.96)}

/* === 通用元素 === */
.credit{text-align:center;font-size:12px;color:#bbb;padding:16px 0 8px;letter-spacing:1px}
.close-btn{position:absolute;top:12px;right:14px;width:32px;height:32px;border:none;background:#f0e6d8;border-radius:50%;font-size:18px;color:#888;cursor:pointer;line-height:32px;text-align:center;padding:0;z-index:5}
.advice-box{background:#f0f7f0;border:1px solid #a5d6a7;border-radius:10px;padding:12px 14px;margin:10px 0;font-size:13px}
.warn-box{background:#fef3e0;border:1px solid #ffcc80;border-radius:10px;padding:12px 14px;margin:10px 0;font-size:13px}

/* === 收费漏斗 === */
.funnel-section{margin-top:16px;border-top:2px solid #c8923b;padding-top:20px}
.funnel-section h3{font-size:18px;color:#5c2a0e;text-align:center;margin:0 0 4px}
.funnel-intro{font-size:13px;color:#888;text-align:center;margin:0 0 16px}
.funnel-cards{display:flex;flex-direction:column;gap:12px}
.funnel-card{background:#fdfaf5;border:1.5px solid #e0d5c8;border-radius:14px;padding:18px 16px;position:relative}
.funnel-card.featured{border-color:#c8923b;background:linear-gradient(135deg,#fef9f0,#fdf3e0);box-shadow:0 2px 12px rgba(200,146,59,.15)}
.fc-badge{display:inline-block;font-size:11px;padding:2px 10px;border-radius:10px;margin-bottom:8px;font-weight:600}
.funnel-card:not(.featured) .fc-badge{background:#e0d5c8;color:#888}
.funnel-card.featured .fc-badge{background:#5c2a0e;color:#e8c170}
.fc-price{font-size:32px;font-weight:700;color:#5c2a0e;margin:4px 0}
.fc-price small{font-size:14px;font-weight:400;color:#999}
.fc-name{font-size:15px;font-weight:600;color:#4a2008;margin-bottom:10px}
.funnel-card ul{list-style:none;padding:0;margin:0 0 14px}
.funnel-card li{font-size:12px;color:#666;padding:4px 0 4px 18px;position:relative;line-height:1.6}
.funnel-card li::before{content:'\2713';position:absolute;left:0;color:#c8923b;font-weight:700}
.funnel-card .fc-btn{display:block;width:100%;height:40px;border-radius:10px;border:none;font-size:14px;font-weight:600;cursor:pointer;text-align:center;line-height:40px;text-decoration:none}
.funnel-card:not(.featured) .fc-btn{background:#5c2a0e;color:#e8c170}
.funnel-card.featured .fc-btn{background:linear-gradient(135deg,#c8923b,#8b4513);color:#fff;font-size:15px;height:44px;line-height:44px;box-shadow:0 3px 10px rgba(139,69,19,.25)}
.fc-btn:hover{opacity:.92}
.funnel-expert{text-align:center;margin-top:16px;padding:14px;background:#faf8f5;border-radius:12px;border:1px dashed #e0d5c8}
.funnel-expert p{font-size:13px;color:#666;margin:0 0 6px}
.expert-price{font-size:24px;color:#c0392b;font-weight:700;margin-bottom:10px}
.expert-price small{font-size:13px;color:#999;font-weight:400}
.expert-btn{display:inline-block;background:#e8c170;color:#5c2a0e;padding:10px 28px;border-radius:24px;font-size:14px;font-weight:600;text-decoration:none}
.expert-btn:hover{opacity:.9}

/* === 锁定区域样式 === */
.locked-section{position:relative;margin-top:8px}
.locked-banner{text-align:center;background:linear-gradient(135deg,#f5e6c8,#e8c170);color:#5c2a0e;font-size:13px;font-weight:600;padding:10px;border-radius:8px;margin:12px 0 0;letter-spacing:1px}
.locked-content{filter:blur(5px);-webkit-filter:blur(5px);pointer-events:none;user-select:none;-webkit-user-select:none;min-height:300px}
.locked-overlay{position:absolute;bottom:0;left:0;right:0;text-align:center;background:linear-gradient(transparent,rgba(255,255,255,0.95) 40%);padding:30px 16px 16px;font-size:14px;font-weight:600;color:#5c2a0e;letter-spacing:1px}

/* === 手机端响应式 === */
@media (max-width: 420px) {
  .header {padding:24px 14px 18px}
  .header h1 {font-size:22px;letter-spacing:2px}
  .header .sub {font-size:12px}
  .container {padding:0 10px 30px;max-width:100%}
  .card {padding:18px 14px;border-radius:14px}
  .card-title {font-size:16px}
  .form-row {flex-direction:column;gap:8px}
  .form-row .form-group {flex:none}
  .pg-gan {font-size:22px}
  .pg-zhi {font-size:17px}
  .pg-head {font-size:11px;padding:8px 0 6px}
  .pg-cell {padding:8px 4px;min-height:108px}
  .pg-ss {font-size:10px}
  .pg-cang {font-size:10px}
  .bazi-row {font-size:20px;letter-spacing:4px;gap:2px}
  .bazi-row .pz-char {min-width:34px}
  .r-content {overflow-x:auto}
  .dayun-table {min-width:340px;font-size:11px}
  .dayun-table th,.dayun-table td {padding:6px 4px}
  .wx-bar-wrap {font-size:11px}
  .r-content h2 {font-size:17px}
  .r-content h3 {font-size:14px}
  .btn-go {font-size:16px;height:46px}
  .master-btn {padding:8px 22px;font-size:14px}
  .funnel-card {padding:14px 12px}
  .fc-price {font-size:28px}
  .funnel-card.featured .fc-btn {font-size:14px;height:42px;line-height:42px}
}

/* === 付费版内容预览 === */
.fc-preview-toggle{display:block;text-align:center;font-size:13px;color:#c8923b;font-weight:600;padding:8px 0;margin:6px 0 4px;cursor:pointer;border-top:1px dashed #e0d5c8;border-bottom:1px dashed #e0d5c8;transition:color .2s}
.fc-preview-toggle:hover{color:#8b4513}
.fc-preview-toggle.expanded{color:#8b4513}
.fc-preview{margin:8px 0 12px;animation:fadeIn .3s}
.preview-content{background:#faf8f5;border-radius:10px;padding:14px 12px}
.preview-block{margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid #ede3d9}
.preview-block:last-of-type{border-bottom:none;margin-bottom:6px}
.preview-tag{display:inline-block;font-size:10px;padding:2px 8px;border-radius:8px;margin-bottom:6px;font-weight:600}
.preview-tag{background:#5c2a0e;color:#e8c170}
.preview-block h4{font-size:14px;color:#5c2a0e;margin:0 0 6px;font-weight:700}
.preview-desc{font-size:12px;color:#666;line-height:1.7;margin:0 0 6px}
.preview-teaser{font-size:12px;color:#555;line-height:1.8;margin:0 0 8px;padding:8px 10px;background:#fdf3e0;border-radius:8px;border-left:3px solid #c8923b}
.preview-locked{font-size:11px;color:#999;padding:8px 10px;background:#f0ede8;border-radius:8px;text-align:center;border:1px dashed #d5cabd;margin-top:4px}
.preview-footer{text-align:center;font-size:11px;color:#bbb;margin-top:8px;padding-top:6px;border-top:1px solid #ede3d9}
.preview-year-item{display:flex;justify-content:space-between;align-items:center;padding:4px 8px;margin:3px 0;background:#fdfaf5;border-radius:6px;font-size:12px}
.py-year{font-weight:600;color:#5c2a0e}
.py-ss{color:#c8923b;font-size:11px}
.py-judge.good{color:#2e7d32;font-weight:600}
.py-judge.bad{color:#e65100;font-weight:600}
.preview-turn-item{display:flex;justify-content:space-between;align-items:center;padding:4px 8px;margin:3px 0;background:#fdfaf5;border-radius:6px;font-size:12px}
.pt-age{font-weight:700;color:#5c2a0e}
.pt-year{color:#888;font-size:11px}
.pt-ss{color:#c8923b;font-size:11px}
.preview-dayun-list{margin:6px 0}
.pdl-item{display:flex;justify-content:space-between;align-items:center;padding:4px 8px;margin:2px 0;background:#fdfaf5;border-radius:6px;font-size:12px}
.pdl-item.current{background:#fdf3e0;border:1px solid #c8923b}
.pdl-gz{font-weight:700;color:#5c2a0e;min-width:40px}
.pdl-age{color:#888;font-size:11px}
.pdl-ss{color:#c8923b;font-size:11px}
.pdl-now{color:#c8923b;font-size:10px;font-weight:600}