/* ============================================================
       美感精修层 (质感 / 光影 / 装饰 / 节奏)
       ============================================================ */
    /* 全站统一更柔和的卡片描边光影, 顶部一道极细高光 */
    .verdict-banner, .title-card, .pro-chart, .wuxing-panel, .analysis-card,
    .bullet-card, .strength-panel, .geju-panel, .deep-report, .rel-panel,
    .liuqin-panel, .zhaxin-hook, .paywall, .input-panel {
      position: relative;
    }
    .verdict-banner::after { z-index: 2; }
    .strength-panel, .geju-panel, .deep-report, .rel-panel, .liuqin-panel, .bullet-card, .wuxing-panel {
      background:
        linear-gradient(160deg, rgba(30,43,60,0.92), rgba(14,22,34,0.95)) !important;
      box-shadow: 0 10px 40px rgba(0,0,0,0.4), inset 0 1px 0 rgba(220,232,240,0.06) !important;
    }

    /* 面板大标题: 居中 + 左右描金云纹 + 字距 */
    .rel-panel > h4, .deep-report > h4, .strength-panel > h4,
    .geju-panel > h4, .liuqin-panel > h4 {
      text-align: center; display: flex; align-items: center; justify-content: center; gap: 16px;
    }
    .rel-panel > h4::before, .rel-panel > h4::after,
    .deep-report > h4::before, .deep-report > h4::after,
    .strength-panel > h4::before, .strength-panel > h4::after,
    .geju-panel > h4::before, .geju-panel > h4::after,
    .liuqin-panel > h4::before, .liuqin-panel > h4::after {
      content: '\2756'; font-size: 0.6rem; color: var(--gold);
      -webkit-text-fill-color: var(--gold); opacity: 0.7;
    }

    /* 标题下方居中金线 */
    .rel-panel > .rel-intro, .deep-report > .rel-intro,
    .strength-panel > .rel-intro, .geju-panel > .rel-intro, .liuqin-panel > .rel-intro {
      text-align: center; max-width: 600px; margin-left: auto; margin-right: auto;
      padding-bottom: 14px; position: relative; margin-bottom: 18px;
    }
    .rel-panel > .rel-intro::after, .deep-report > .rel-intro::after,
    .strength-panel > .rel-intro::after, .geju-panel > .rel-intro::after, .liuqin-panel > .rel-intro::after {
      content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
      width: 80px; height: 1px;
      background: linear-gradient(to right, transparent, var(--gold), transparent);
    }

    /* 排盘网格: 干支单元微浮雕, hover 整列描金 */
    .pc-cell { transition: background 0.25s; }
    .pc-big { transition: text-shadow 0.3s, transform 0.3s; display: inline-block; }
    .pc-row:hover .pc-big { text-shadow: 0 0 18px currentColor; transform: translateY(-1px); }

    /* 命格称号卡: 内描金双线边框 */
    .title-card { box-shadow: 0 0 0 1px rgba(245,216,137,0.25) inset, 0 14px 50px rgba(0,0,0,0.5); }

    /* 关键词/徽章: 玻璃质感 */
    .verdict-keywords span, .pw-rarity-badge, .rel-badge, .gj-mark, .tc-rarity {
      backdrop-filter: blur(4px);
    }

    /* 卡片入场: 滚动进入视口时淡入 (纯 CSS, 默认显示, 仅做轻微提升) */
    .layer-body > div, .bullet-card { transition: transform 0.3s, box-shadow 0.3s; }
    .bullet-card:hover, .lq-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 14px 36px rgba(212,175,55,0.16) !important;
      border-color: var(--gold) !important;
    }
    .lq-card { transition: transform 0.3s, box-shadow 0.3s, border-color 0.3s; }

    /* 评分环: 外圈呼吸光晕 */
    .verdict-score { position: relative; }
    .verdict-score::before {
      content: ''; position: absolute; inset: -6px; border-radius: 50%;
      background: radial-gradient(circle, rgba(245,216,137,0.25), transparent 70%);
      z-index: -1; animation: scoreBreath 3s ease-in-out infinite;
    }
    @keyframes scoreBreath { 0%,100%{opacity:0.4;} 50%{opacity:0.9;} }

    /* 顶部导航: 选中态下方金线指示 */
    .nav-item.active { position: relative; }

    /* 主标题: 加一层柔和投影提升立体感 */
    h1 { filter: drop-shadow(0 4px 18px rgba(212,175,55,0.2)); }

    /* 分隔线统一更雅致 */
    .ink-line { width: 1px; height: 48px; opacity: 0.6; }

    /* 滚动锚点平滑 */
    html { scroll-behavior: smooth; }

    @media (prefers-reduced-motion: reduce) {
      .verdict-score::before { animation: none !important; }
    }

    /* ===== 主题切换开关 ===== */
    .theme-switch {
      position: fixed; top: 16px; right: 16px; z-index: 50;
      display: flex; gap: 8px; padding: 8px 10px; border-radius: 22px;
      background: var(--input-bg); border: 1px solid var(--line);
      backdrop-filter: blur(8px); box-shadow: 0 4px 16px rgba(0,0,0,0.3);
    }
    .theme-dot {
      width: 22px; height: 22px; border-radius: 50%; cursor: pointer;
      border: 2px solid transparent; transition: transform 0.2s, border-color 0.2s; padding: 0;
    }
    .theme-dot:hover { transform: scale(1.15); }
    .theme-dot.active { border-color: var(--ink); box-shadow: 0 0 8px rgba(255,255,255,0.3); }
    .theme-label { font-size: 0.74rem; color: var(--gold-light); letter-spacing: 0.12em; font-weight: 600; align-self: center; }
    .theme-name { font-size: 0.72rem; color: var(--ink-light); align-self: center; min-width: 24px; }
    .t-blue { background: linear-gradient(135deg, #1e2b3c, #5fb4c4); }
    .t-dark { background: linear-gradient(135deg, #181320, #d4af37); }
    .t-paper { background: linear-gradient(135deg, #f3ecd9, #b5302a); }
    .t-mystic { background: linear-gradient(135deg, #1f1a4d, #c77dff); }
    /* 专业星盘参数表 */
    .natal-tbl { width:100%; border-collapse:collapse; font-size:0.74rem; margin-top:8px; }
    .natal-tbl th, .natal-tbl td { border:1px solid var(--line-soft); padding:5px 8px; text-align:center; color:var(--ink-light); white-space:nowrap; }
    .natal-tbl th { background:var(--title-bg); color:var(--gold-light); font-weight:600; }
    .natal-tbl td:first-child { text-align:left; }
    .aspect-grid td { padding:3px 6px; min-width:26px; font-size:0.66rem; }
    .aspect-grid .asp-label { text-align:left !important; color:var(--gold-light) !important; background:var(--title-bg); }
    @media (max-width: 600px) { .theme-switch { top: 10px; right: 10px; padding: 6px 8px; } .theme-dot { width: 18px; height: 18px; } }

    /* ===== 主题底色: 由变量驱动, 覆盖各面板硬编码底 ===== */
    .input-panel, .pillar-card, .ten-gods, .analysis-card, .analysis-card-item,
    .dayun-card, .zongping, .daily-item, .rel-panel, .deep-report,
    .liuyue-detail, .strength-panel, .geju-panel, .liuqin-panel, .bullet-card, .wuxing-panel {
      background: var(--panel-bg) !important;
    }
    .bazigou-zao, .pro-chart, .lq-card, .tier-card,
    .input-group input, .input-group select,
    .match-row input, .match-row select, #dateStart, #dateEvent {
      background: var(--input-bg) !important;
    }
    .title-card { background: var(--title-bg) !important; border-color: var(--gold) !important; }
    .zhaxin-hook { background: linear-gradient(160deg, var(--vermilion-dim), var(--input-bg)) !important; }
    .paywall { background: linear-gradient(160deg, var(--gold-dim), var(--input-bg)) !important; }
    /* 面板鎏金标题改为本主题金色 */
    .strength-panel h4, .geju-panel h4, .liuqin-panel h4 {
      background: linear-gradient(135deg, var(--gold-light), var(--gold)) !important;
      -webkit-background-clip: text !important; background-clip: text !important;
      -webkit-text-fill-color: transparent !important;
    }

    /* ===== 视觉层次增强 ===== */

    /* 1. 面板顶部彩色条纹 — 按类型区分 */
    .strength-panel::before,
    .geju-panel::before,
    .rel-panel::before,
    .deep-report::before,
    .liuqin-panel::before {
      content: ''; position: absolute; top: 0; left: 20px; right: 20px;
      height: 2px; border-radius: 0 0 2px 2px; opacity: 0.7;
    }
    .strength-panel, .geju-panel, .rel-panel, .deep-report, .liuqin-panel {
      position: relative;
    }
    .strength-panel::before { background: linear-gradient(90deg, transparent, var(--jade), transparent); }
    .geju-panel::before { background: linear-gradient(90deg, transparent, var(--gold), transparent); }
    .rel-panel::before { background: linear-gradient(90deg, transparent, var(--vermilion), transparent); }
    .deep-report::before { background: linear-gradient(90deg, transparent, #c77dff, transparent); }
    .liuqin-panel::before { background: linear-gradient(90deg, transparent, #5fb4c4, transparent); }

    /* 2. 左侧竖线装饰 — 层级感 */
    .strength-panel { border-left: 3px solid var(--jade) !important; }
    .geju-panel { border-left: 3px solid var(--gold) !important; }
    .rel-panel { border-left: 3px solid var(--vermilion) !important; }
    .deep-report { border-left: 3px solid #c77dff !important; }
    .liuqin-panel { border-left: 3px solid #5fb4c4 !important; }

    /* 3. 面板内部微渐变叠加 — 打破纯色背景 */
    .strength-panel::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 0;
      background: radial-gradient(ellipse at top right, rgba(95,180,196,0.04), transparent 60%); }
    .geju-panel::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 0;
      background: radial-gradient(ellipse at top left, rgba(212,175,55,0.05), transparent 60%); }
    .rel-panel::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 0;
      background: radial-gradient(ellipse at bottom right, rgba(224,83,58,0.04), transparent 60%); }
    .deep-report::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 0;
      background: radial-gradient(ellipse at bottom left, rgba(199,125,255,0.04), transparent 60%); }
    .liuqin-panel::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 0;
      background: radial-gradient(ellipse at top center, rgba(95,180,196,0.04), transparent 60%); }

    /* 4. 板块之间中式装饰分隔线 */
    .strength-panel + .geju-panel,
    .geju-panel + .rel-panel,
    .rel-panel + .deep-report,
    .deep-report + .liuqin-panel,
    .liuqin-panel + .strength-panel,
    .geju-panel + .deep-report,
    .rel-panel + .liuqin-panel,
    .bullet-cards + .strength-panel,
    .bullet-cards + .geju-panel,
    .bullet-cards + .rel-panel,
    .bullet-cards + .deep-report {
      margin-top: 40px;
    }

    /* 5. 深度卡片(deep-block)交替底色 */
    .deep-block:nth-child(odd) {
      background: rgba(212,175,55,0.02); border-radius: 8px; padding: 14px 16px; margin-left: -16px; margin-right: -16px;
    }
    .deep-block:nth-child(even) {
      background: rgba(95,180,196,0.02); border-radius: 8px; padding: 14px 16px; margin-left: -16px; margin-right: -16px;
    }

    /* 6. bullet-card 交替边框色 */
    .bullet-card:nth-child(1) { border-top: 2px solid var(--jade); }
    .bullet-card:nth-child(2) { border-top: 2px solid var(--gold); }
    .bullet-card:nth-child(3) { border-top: 2px solid var(--vermilion); }
    .bullet-card:nth-child(4) { border-top: 2px solid #c77dff; }
    .bullet-card:nth-child(5) { border-top: 2px solid #5fb4c4; }
    .bullet-card:nth-child(6) { border-top: 2px solid var(--jade); }
    .bullet-card:nth-child(n+7) { border-top: 2px solid var(--gold); }

    /* 7. 六亲缘分卡片角标序号 */
    .lq-card { position: relative; counter-increment: lq-counter; }
    .lq-grid { counter-reset: lq-counter; }
    .lq-card::after {
      content: counter(lq-counter);
      position: absolute; top: -6px; right: 14px;
      width: 22px; height: 22px; border-radius: 50%;
      background: var(--gold); color: #1a1206;
      font-size: 0.66rem; font-weight: 700;
      display: flex; align-items: center; justify-content: center;
      box-shadow: 0 2px 8px rgba(212,175,55,0.4);
    }

    /* 8. 五行面板内圈光晕 */
    .wuxing-panel {
      position: relative;
      box-shadow: 0 10px 40px rgba(0,0,0,0.4), inset 0 0 40px rgba(212,175,55,0.03) !important;
    }

    /* 9. 格局评定星级头部特殊背景 */
    .gj-head {
      background: linear-gradient(135deg, rgba(212,175,55,0.08), rgba(199,125,255,0.05), rgba(224,83,58,0.04)) !important;
      border: 1px solid rgba(212,175,55,0.3) !important;
      box-shadow: inset 0 1px 0 rgba(245,216,137,0.1);
    }

    /* 10. 命书总论增强边框光效 */
    .grand-summary {
      box-shadow: 0 8px 36px rgba(0,0,0,0.28), inset 0 0 60px rgba(212,175,55,0.05), 0 0 0 1px rgba(212,175,55,0.2) !important;
    }
    .grand-summary::before {
      content: ''; position: absolute; top: 12px; left: 12px; right: 12px; bottom: 12px;
      border: 1px solid rgba(212,175,55,0.12); border-radius: 10px; pointer-events: none;
    }

    /* 11. 日运卡片微渐变底 */
    .daily-item:nth-child(odd) { background: linear-gradient(135deg, var(--panel-bg), rgba(95,180,196,0.03)) !important; }
    .daily-item:nth-child(even) { background: linear-gradient(135deg, var(--panel-bg), rgba(212,175,55,0.03)) !important; }

    /* 12. 大运卡片渐变顶线 */
    .dayun-card { position: relative; overflow: hidden; }
    .dayun-card::before {
      content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
      background: linear-gradient(90deg, var(--vermilion), var(--gold), var(--jade));
      opacity: 0.5;
    }

    /* 13. 分析卡片(analysis-card)角装饰 */
    .analysis-card { position: relative; overflow: hidden; }
    .analysis-card::before {
      content: ''; position: absolute; top: 0; right: 0;
      width: 40px; height: 40px;
      background: linear-gradient(225deg, rgba(212,175,55,0.08) 50%, transparent 50%);
      pointer-events: none;
    }

    /* 14. section-title 增强底部装饰(用 box-shadow 避免与 ::after 云纹冲突) */
    .section-title {
      padding-bottom: 14px; margin-bottom: 24px;
      border-image: linear-gradient(90deg, transparent 35%, var(--gold) 50%, transparent 65%) 1;
      border-bottom: 1px solid;
    }

    /* 移动端微调层次装饰 */
    @media (max-width: 600px) {
      .strength-panel::before, .geju-panel::before, .rel-panel::before,
      .deep-report::before, .liuqin-panel::before { left: 12px; right: 12px; }
      .lq-card::after { width: 18px; height: 18px; font-size: 0.58rem; top: -4px; right: 10px; }
      .deep-block:nth-child(odd), .deep-block:nth-child(even) { margin-left: -10px; margin-right: -10px; padding: 10px 12px; }
      .grand-summary::before { top: 8px; left: 8px; right: 8px; bottom: 8px; }
    }

    /* ===== 生肖运势板块 ===== */
    .sx-hero { display:flex; align-items:center; gap:18px; padding:22px; margin-bottom:18px;
      background:linear-gradient(135deg, var(--gold-dim), var(--input-bg)); border:1px solid var(--gold);
      border-radius:14px; }
    .sx-emoji { font-size:3.6rem; line-height:1; flex-shrink:0; filter:drop-shadow(0 2px 6px rgba(0,0,0,.25)); }
    .sx-hero-info h2 { font-size:1.5rem; color:var(--gold-light); margin:0 0 6px; }
    .sx-hero-info .sx-branch { font-size:0.8rem; color:var(--ink-faint); font-weight:normal; margin-left:6px; }
    .sx-hero-info p { font-size:0.82rem; color:var(--ink); margin:0; line-height:1.7; }
    .sx-hero-info .sx-yearnote { font-size:0.72rem; color:var(--gold); margin-top:6px; }
    .sx-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
    .sx-card { padding:16px; border-radius:12px; }
    .sx-card h4 { font-size:0.92rem; margin:0 0 8px; }
    .sx-card p { font-size:0.78rem; line-height:1.75; color:var(--ink); margin:0; }
    .sx-merit { background:rgba(80,160,110,.10); border:1px solid rgba(80,160,110,.35); }
    .sx-merit h4 { color:#4caf72; }
    .sx-flaw { background:rgba(190,120,70,.10); border:1px solid rgba(190,120,70,.35); }
    .sx-flaw h4 { color:#d08a4e; }
    .sx-line { padding:12px 14px; margin-bottom:10px; background:var(--input-bg); border-radius:10px;
      font-size:0.8rem; line-height:1.75; color:var(--ink); border-left:3px solid var(--gold); }
    .sx-tag { display:inline-block; min-width:42px; padding:2px 10px; margin-right:10px; border-radius:20px;
      background:var(--gold); color:var(--bg-deep); font-size:0.72rem; font-weight:bold; }
    .sx-lucky { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
    .sx-lk { text-align:center; padding:14px 6px; background:var(--input-bg); border:1px solid var(--gold-dim);
      border-radius:10px; }
    .sx-lk span { display:block; font-size:0.7rem; color:var(--ink-faint); margin-bottom:6px; }
    .sx-lk b { font-size:0.82rem; color:var(--gold-light); }
    .sx-pair { display:flex; flex-direction:column; gap:10px; }
    .sx-pr { padding:13px 16px; border-radius:10px; }
    .sx-pr .sx-prk { display:inline-block; font-size:0.72rem; font-weight:bold; padding:2px 10px; border-radius:20px; margin-right:10px; }
    .sx-pr b { font-size:0.9rem; color:var(--ink); }
    .sx-pr em { display:block; font-style:normal; font-size:0.74rem; color:var(--ink-faint); margin-top:6px; line-height:1.65; }
    .sx-pr-good { background:rgba(80,160,110,.10); border:1px solid rgba(80,160,110,.30); }
    .sx-pr-good .sx-prk { background:#4caf72; color:#fff; }
    .sx-pr-bad { background:rgba(200,70,70,.10); border:1px solid rgba(200,70,70,.30); }
    .sx-pr-bad .sx-prk { background:#cc4646; color:#fff; }
    .sx-pr-warn { background:rgba(200,160,60,.10); border:1px solid rgba(200,160,60,.30); }
    .sx-pr-warn .sx-prk { background:#c8a23c; color:#fff; }
    .sx-flow { padding:20px; border-radius:14px; background:var(--input-bg); border:1px solid var(--gold-dim); }
    .sx-flow-head { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
    .sx-flow-head b { font-size:1.15rem; color:var(--gold-light); }
    .sx-flow-badge { font-size:0.72rem; font-weight:bold; padding:3px 12px; border-radius:20px; background:var(--gold); color:var(--bg-deep); }
    .sx-flow > p { font-size:0.82rem; line-height:1.85; color:var(--ink); margin:0 0 14px; }
    .sx-flow-tips { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
    .sx-tip { padding:11px 13px; background:var(--bg-deep); border-radius:9px; font-size:0.76rem; line-height:1.7; color:var(--ink); }
    .sx-tip span { display:inline-block; min-width:34px; font-weight:bold; color:var(--gold); margin-right:6px; }
    .sx-flow-advice { font-size:0.8rem; line-height:1.8; color:var(--gold-light); margin:14px 0 0; padding:12px 14px;
      background:var(--gold-dim); border-radius:10px; }
    .sx-flow-taisui { border-color:#cc4646; }
    .sx-flow-taisui .sx-flow-badge, .sx-flow-chong .sx-flow-badge { background:#cc4646; color:#fff; }
    .sx-flow-chong { border-color:#d08a4e; }
    .sx-flow-good { border-color:#4caf72; }
    .sx-flow-good .sx-flow-badge { background:#4caf72; color:#fff; }
    .sx-flow-warn { border-color:#c8a23c; }
    .sx-flow-warn .sx-flow-badge { background:#c8a23c; color:#fff; }
    .sx-month-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
    .sx-month { padding:12px 10px; border-radius:10px; background:var(--input-bg); border:1px solid var(--gold-dim); border-top:3px solid var(--gold-dim); }
    .sx-m-top { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:5px; }
    .sx-m-top b { font-size:0.86rem; color:var(--ink); }
    .sx-m-top span { font-size:0.64rem; color:var(--ink-faint); }
    .sx-m-rel { font-size:0.72rem; font-weight:bold; margin-bottom:6px; }
    .sx-m-tip { font-size:0.7rem; line-height:1.65; color:var(--ink-faint); }
    .sx-m-good { border-top-color:#4caf72; } .sx-m-good .sx-m-rel { color:#4caf72; }
    .sx-m-taisui { border-top-color:#cc4646; } .sx-m-taisui .sx-m-rel { color:#cc4646; }
    .sx-m-chong { border-top-color:#d08a4e; } .sx-m-chong .sx-m-rel { color:#d08a4e; }
    .sx-m-warn { border-top-color:#c8a23c; } .sx-m-warn .sx-m-rel { color:#c8a23c; }
    .sx-m-normal .sx-m-rel { color:var(--ink-faint); }
    @media (max-width:560px) {
      .sx-grid, .sx-flow-tips { grid-template-columns:1fr; }
      .sx-lucky { grid-template-columns:repeat(2,1fr); }
      .sx-emoji { font-size:2.8rem; }
      .sx-month-grid { grid-template-columns:repeat(2,1fr); }
    }

    /* ===== 每日一卦板块 ===== */
    .gua-head { text-align:center; margin-bottom:18px; }
    .gua-head h2 { font-size:1.5rem; color:var(--gold-light); margin:0; }
    .gua-head .gua-sub { font-size:0.74rem; color:var(--ink-faint); margin:8px 0 0; }
    .gua-main { display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
    .gua-lines { display:flex; flex-direction:column; gap:7px; flex-shrink:0; padding:8px 0; }
    .gua-line { display:flex; align-items:center; gap:8px; }
    .gua-bar { display:inline-block; width:90px; height:11px; border-radius:2px; }
    .gua-yang { background:linear-gradient(90deg, var(--gold), var(--gold-light)); }
    .gua-yin { background:transparent; display:flex; justify-content:space-between; }
    .gua-yin i { display:block; width:40px; height:11px; border-radius:2px; background:linear-gradient(90deg, var(--gold), var(--gold-light)); }
    .gua-chg, .gua-chg-ph { width:14px; text-align:center; font-size:0.8rem; color:#cc4646; font-weight:bold; }
    .gua-info { flex:1; min-width:200px; }
    .gua-name { font-size:1.3rem; color:var(--gold-light); font-weight:bold; margin-bottom:8px; }
    .gua-luck { font-size:0.7rem; padding:2px 12px; border-radius:20px; margin-left:8px; vertical-align:middle; }
    .gua-lk-da { background:#cc4646; color:#fff; } .gua-lk-zhong { background:#4caf72; color:#fff; }
    .gua-lk-ji { background:#5a9b6f; color:#fff; } .gua-lk-ping { background:var(--gold-dim); color:var(--ink); }
    .gua-lk-xiao { background:#c8a23c; color:#fff; } .gua-lk-xiong { background:#7a3030; color:#fff; }
    .gua-judg { font-size:0.82rem; color:var(--gold); margin-bottom:6px; }
    .gua-img { font-size:0.8rem; color:var(--ink-faint); margin-bottom:10px; font-style:italic; }
    .gua-desc { font-size:0.84rem; line-height:1.9; color:var(--ink); margin:0; }
    .gua-bian { padding:16px; background:var(--input-bg); border:1px solid var(--gold-dim); border-radius:12px; }
    .gua-bian .gua-name { font-size:1.1rem; }
    .gua-tip { font-size:0.76rem; line-height:1.8; color:var(--ink-faint); margin:12px 0 0; padding:12px 14px;
      background:var(--input-bg); border-radius:10px; border-left:3px solid var(--gold); }
    .gua-trig-box { margin-top:16px; padding:14px 16px; background:var(--input-bg); border-radius:12px; border:1px solid var(--gold-dim); }
    .gua-trig { display:flex; align-items:center; gap:14px; padding:8px 0; }
    .gua-trig + .gua-trig { border-top:1px dashed var(--gold-dim); }
    .gua-trig-sym { font-size:1.8rem; color:var(--gold-light); width:36px; text-align:center; flex-shrink:0; }
    .gua-trig b { font-size:0.86rem; color:var(--gold); display:block; }
    .gua-trig em { font-size:0.74rem; color:var(--ink-faint); font-style:normal; }
    .gua-trig-read { font-size:0.78rem; line-height:1.8; color:var(--ink); margin:10px 0 0; padding-top:10px; border-top:1px dashed var(--gold-dim); }
    .gua-yao-list { display:flex; flex-direction:column; gap:10px; }
    .gua-yao { padding:11px 14px; background:var(--input-bg); border-radius:10px; border-left:3px solid #cc4646; }
    .gua-yao-pos { display:inline-block; font-size:0.72rem; font-weight:bold; padding:2px 11px; border-radius:20px; background:#cc4646; color:#fff; margin-right:10px; }
    .gua-yao b { font-size:0.84rem; color:var(--gold-light); }
    .gua-yao em { display:block; font-style:normal; font-size:0.78rem; line-height:1.75; color:var(--ink); margin-top:6px; }

    /* ===== 命理词典板块 ===== */
    .dict-cats { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-top:14px; }
    .dict-chip { font-family:inherit; cursor:pointer; padding:5px 16px; border-radius:20px; font-size:0.76rem;
      background:var(--input-bg); color:var(--ink); border:1px solid var(--gold-dim); transition:all .2s; }
    .dict-chip:hover { border-color:var(--gold); }
    .dict-chip.active { background:var(--gold); color:var(--bg-deep); border-color:var(--gold); font-weight:bold; }
    .dict-list { display:flex; flex-direction:column; gap:12px; }
    .dict-item { padding:15px 18px; background:var(--input-bg); border-radius:11px; border:1px solid var(--gold-dim); }
    .dict-term { display:flex; align-items:center; gap:10px; margin-bottom:8px; flex-wrap:wrap; }
    .dict-term b { font-size:1.02rem; color:var(--gold-light); }
    .dict-cat-tag { font-size:0.66rem; padding:2px 10px; border-radius:20px; color:#fff; }
    .dict-cat-八字 { background:#8a6d3b; } .dict-cat-紫微 { background:#6b4f8a; }
    .dict-cat-星座 { background:#3b6d8a; } .dict-cat-周易 { background:#3b8a6d; }
    .dict-cat-通用 { background:#8a3b5a; }
    .dict-def { font-size:0.82rem; line-height:1.85; color:var(--ink); margin:0; }
    .dict-mk { background:var(--gold); color:var(--bg-deep); padding:0 3px; border-radius:3px; }
    .dict-rel { margin-top:10px; padding-top:9px; border-top:1px dashed var(--gold-dim); display:flex; flex-wrap:wrap; gap:7px; align-items:center; }
    .dict-rel-lbl { font-size:0.68rem; color:var(--ink-faint); margin-right:2px; }
    .dict-rel-chip { font-family:inherit; cursor:pointer; font-size:0.7rem; padding:3px 11px; border-radius:20px;
      background:transparent; color:var(--gold-light); border:1px solid var(--gold-dim); transition:all .2s; }
    .dict-rel-chip:hover { background:var(--gold); color:var(--bg-deep); border-color:var(--gold); }
    .dict-rel-chip::before { content:'#'; opacity:0.5; margin-right:1px; }

    /* ===== 趣味测试（五行人格）===== */
    .cs-home { text-align:center; padding:40px 20px; background:linear-gradient(160deg,var(--gold-dim),var(--input-bg)); border:1px solid var(--gold); border-radius:16px; }
    .cs-home-emoji { font-size:3.4rem; margin-bottom:10px; }
    .cs-home h2 { font-size:1.6rem; color:var(--gold-light); margin:0 0 8px; }
    .cs-home-sub { font-size:0.84rem; color:var(--ink-light); margin:0 0 24px; }
    .cs-start { display:inline-block; padding:13px 44px !important; }
    .cs-home-tip { font-size:0.66rem; color:var(--ink-faint); margin-top:18px; }
    .cs-hub-head { text-align:center; margin-bottom:22px; }
    .cs-hub-head h2 { font-size:1.5rem; color:var(--gold-light); margin:6px 0 6px; }
    .cs-cards { display:flex; flex-direction:column; gap:12px; }
    .cs-card { display:flex; align-items:center; gap:14px; width:100%; text-align:left; cursor:pointer; font-family:inherit;
      padding:16px 18px; border-radius:14px; background:linear-gradient(160deg,var(--gold-dim),var(--input-bg));
      border:1px solid var(--gold-dim); transition:all .2s; }
    .cs-card:hover { border-color:var(--gold); transform:translateY(-2px); box-shadow:0 8px 22px rgba(212,175,55,0.15); }
    .cs-card-emoji { font-size:2rem; flex-shrink:0; width:46px; text-align:center; }
    .cs-card-info { flex:1; }
    .cs-card-info b { display:block; font-size:1.02rem; color:var(--ink); }
    .cs-card-info em { font-style:normal; font-size:0.72rem; color:var(--ink-faint); }
    .cs-card-go { font-size:1.6rem; color:var(--gold); flex-shrink:0; }
    .cs-quiz-title { text-align:center; font-size:0.92rem; color:var(--gold-light); margin-bottom:14px; }
    .cs-home-link { background:none; border:none; color:var(--ink-faint); font-family:inherit; font-size:0.78rem;
      cursor:pointer; padding:0; margin-bottom:14px; }
    .cs-home-link:hover { color:var(--gold); }
    .cs-quiz { padding:8px 0; }
    .cs-prog { height:7px; background:rgba(255,255,255,0.07); border-radius:5px; overflow:hidden; margin-bottom:18px; }
    .cs-prog-fill { height:100%; background:linear-gradient(90deg,var(--gold),var(--gold-light)); border-radius:5px; transition:width .4s ease; }
    .cs-qnum { font-size:0.72rem; color:var(--gold); letter-spacing:0.1em; margin-bottom:10px; }
    .cs-q { font-size:1.18rem; color:var(--ink); font-weight:600; line-height:1.6; margin-bottom:22px; }
    .cs-opts { display:flex; flex-direction:column; gap:12px; }
    .cs-opt { font-family:inherit; text-align:left; cursor:pointer; display:flex; align-items:center; gap:12px;
      padding:15px 18px; border-radius:12px; background:var(--input-bg); border:1px solid var(--line);
      color:var(--ink); font-size:0.92rem; transition:all .2s; }
    .cs-opt:hover { border-color:var(--gold); background:var(--gold-dim); transform:translateY(-2px); }
    .cs-opt-idx { flex-shrink:0; width:26px; height:26px; border-radius:50%; background:var(--gold-dim); color:var(--gold-light);
      display:flex; align-items:center; justify-content:center; font-size:0.8rem; font-weight:700; border:1px solid var(--gold-dim); }
    .cs-back { margin-top:18px; background:none; border:none; color:var(--ink-faint); font-family:inherit; font-size:0.8rem; cursor:pointer; }
    .cs-back:hover { color:var(--gold); }
    .cs-result { --cs-c:var(--gold); }
    .cs-res-card { padding:28px 22px; border-radius:16px; text-align:center;
      background:linear-gradient(165deg, color-mix(in srgb, var(--cs-c) 18%, var(--input-bg)), var(--input-bg));
      border:1px solid var(--cs-c); }
    .cs-res-emoji { font-size:3.6rem; line-height:1; margin-bottom:8px; }
    .cs-res-title { font-size:1.7rem; font-weight:700; color:var(--cs-c); letter-spacing:0.04em; }
    .cs-res-key { font-size:0.84rem; color:var(--ink-light); margin:8px 0 18px; letter-spacing:0.1em; }
    .cs-res-desc { font-size:0.88rem; line-height:1.95; color:var(--ink); text-align:left; margin:0 0 20px; }
    .cs-res-dist { background:rgba(0,0,0,0.16); border-radius:12px; padding:14px 16px; margin-bottom:18px; }
    .cs-dist-t { font-size:0.74rem; color:var(--ink-faint); margin-bottom:10px; text-align:left; }
    .cs-bar-row { display:flex; align-items:center; gap:10px; margin:7px 0; }
    .cs-bar-lb { width:18px; font-size:0.8rem; color:var(--ink); flex-shrink:0; }
    .cs-bar-track { flex:1; height:10px; background:rgba(255,255,255,0.08); border-radius:6px; overflow:hidden; }
    .cs-bar-fill { height:100%; border-radius:6px; transition:width .7s ease; }
    .cs-bar-num { width:18px; font-size:0.74rem; color:var(--ink-faint); text-align:right; flex-shrink:0; }
    .cs-res-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; text-align:left; }
    .cs-res-item { background:rgba(0,0,0,0.14); border-radius:10px; padding:13px 15px; }
    .cs-res-item span { display:block; font-size:0.76rem; font-weight:700; color:var(--cs-c); margin-bottom:6px; }
    .cs-res-item p { font-size:0.8rem; line-height:1.75; color:var(--ink-light); margin:0; }
    .cs-res-lucky { font-size:0.82rem; color:var(--ink-light); margin-top:16px; }
    .cs-res-lucky b { color:var(--cs-c); }
    .cs-res-actions { display:flex; gap:12px; justify-content:center; align-items:center; margin-top:20px; flex-wrap:wrap; }
    .cs-retry { background:none; border:1px solid var(--line); color:var(--ink-light); font-family:inherit; font-size:0.84rem;
      padding:10px 22px; border-radius:24px; cursor:pointer; }
    .cs-retry:hover { border-color:var(--gold); color:var(--gold); }
    .cs-hook { margin-top:22px; padding:20px; border-radius:14px; text-align:center;
      background:linear-gradient(160deg, var(--vermilion-dim), var(--input-bg)); border:1px solid var(--gold-dim); }
    .cs-hook p { font-size:0.88rem; color:var(--ink); margin:0 0 14px; line-height:1.7; }
    .cs-hook b { color:var(--gold-light); }
    @media (max-width:560px){ .cs-res-grid { grid-template-columns:1fr; } }

    /* ===== MBTI 独立视图 ===== */
    #viewMbti h1, .mbti-hero h2, .mbti-res-type, .mbti-res-title, .mbti-paywall h2, .mbti-grid h3, .mbti-res-section h3 {
      font-family: 'Noto Serif SC', 'Source Han Serif SC', 'STSong', 'SimSun', 'Songti SC', serif;
    }
    .mbti-hero { text-align:center; padding:32px 20px; background:linear-gradient(160deg,var(--gold-dim),var(--input-bg)); border:1px solid var(--gold-dim); border-radius:16px; margin-bottom:20px; }
    .mbti-hero-icon { font-size:3.2rem; margin-bottom:10px; }
    .mbti-hero h2 { font-size:1.4rem; color:var(--gold-light); margin:0 0 10px; }
    .mbti-hero p { font-size:0.84rem; line-height:1.8; color:var(--ink-light); margin:0; max-width:540px; margin:0 auto; }
    .mbti-dims { display:flex; flex-direction:column; gap:10px; padding:18px 20px; background:var(--input-bg); border:1px solid var(--line); border-radius:14px; margin-bottom:20px; }
    .mbti-dim { display:flex; align-items:center; gap:10px; }
    .mbti-dim-l, .mbti-dim-r { font-size:0.78rem; color:var(--ink-light); min-width:60px; }
    .mbti-dim-l { text-align:right; }
    .mbti-dim-bar { flex:1; height:8px; border-radius:4px; background:linear-gradient(90deg,var(--gold-dim),var(--gold),var(--gold-dim)); opacity:0.5; }
    .mbti-entries { display:flex; gap:14px; margin-bottom:24px; }
    .mbti-entry { flex:1; position:relative; padding:22px 18px; border-radius:14px; border:1px solid var(--line); background:var(--input-bg); cursor:pointer; font-family:inherit; text-align:left; transition:all .2s; }
    .mbti-entry:hover { border-color:var(--gold); transform:translateY(-2px); box-shadow:0 8px 24px rgba(212,175,55,0.12); }
    .mbti-entry strong { display:block; font-size:1.05rem; color:var(--ink); margin-bottom:6px; }
    .mbti-entry p { font-size:0.76rem; color:var(--ink-faint); margin:0; line-height:1.6; }
    .mbti-entry-badge { position:absolute; top:10px; right:12px; font-size:0.62rem; padding:2px 10px; border-radius:20px; background:var(--gold-dim); color:var(--gold-light); font-weight:600; }
    .mbti-entry-pro { border-color:var(--gold-dim); background:linear-gradient(160deg,rgba(155,89,182,0.06),var(--input-bg)); }
    .mbti-entry-pro .mbti-entry-badge { background:linear-gradient(135deg,#9b59b6,#8e44ad); color:#fff; }
    .mbti-grid { margin-bottom:20px; }
    .mbti-grid h3 { font-size:0.92rem; color:var(--gold-light); text-align:center; margin:0 0 14px; }
    .mbti-grid-inner { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
    .mbti-type-card { padding:14px 8px; text-align:center; border-radius:10px; background:var(--input-bg); border:1px solid var(--line); cursor:pointer; transition:all .2s; }
    .mbti-type-card:hover { border-color:var(--gold); transform:translateY(-2px); }
    .mbti-tc-code { font-size:0.88rem; font-weight:700; color:var(--ink); letter-spacing:0.05em; }
    .mbti-tc-name { font-size:0.68rem; color:var(--ink-faint); margin-top:4px; }
    .mbti-paywall { text-align:center; padding:40px 20px; }
    .mbti-pw-icon { font-size:3rem; margin-bottom:12px; }
    .mbti-paywall h2 { font-size:1.5rem; color:var(--gold-light); margin:0 0 12px; }
    .mbti-pw-desc { font-size:0.84rem; color:var(--ink-light); line-height:1.8; margin:0 0 28px; max-width:480px; margin-left:auto; margin-right:auto; }
    .mbti-pw-tiers { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
    .mbti-pw-tier { flex:1; min-width:220px; max-width:300px; padding:26px 20px; border-radius:16px; border:1px solid var(--line); background:var(--input-bg); position:relative; text-align:center; }
    .mbti-pw-tier h3 { font-size:1.1rem; color:var(--ink); margin:10px 0 8px; }
    .mbti-pw-tier p { font-size:0.78rem; color:var(--ink-light); line-height:1.7; margin:0 0 16px; }
    .mbti-pw-tier-badge { font-size:0.62rem; padding:2px 10px; border-radius:20px; display:inline-block; margin-bottom:8px; background:var(--gold-dim); color:var(--gold-light); }
    .mbti-pw-pay { border-color:var(--gold); background:linear-gradient(160deg,var(--gold-dim),var(--input-bg)); }
    .mbti-pw-pay .mbti-pw-tier-badge { background:linear-gradient(135deg,var(--gold),var(--gold-light)); color:#1a1a2e; }
    .mbti-result-pro { padding:10px 0; }
    .mbti-res-header { text-align:center; padding:28px 20px; border-radius:16px; border:2px solid var(--gold); background:linear-gradient(160deg,var(--gold-dim),var(--input-bg)); margin-bottom:20px; }
    .mbti-res-type { font-size:2.4rem; font-weight:800; letter-spacing:0.12em; color:var(--ink); }
    .mbti-res-title { font-size:1rem; color:var(--gold-light); margin-top:6px; }
    .mbti-res-bars { background:var(--input-bg); border:1px solid var(--line); border-radius:14px; padding:18px 20px; margin-bottom:18px; }
    .mbti-res-dim { margin-bottom:14px; }
    .mbti-res-dim:last-child { margin-bottom:0; }
    .mbti-res-dim-label { font-size:0.72rem; color:var(--ink-faint); margin-bottom:6px; letter-spacing:0.08em; }
    .mbti-res-dim-row { display:flex; align-items:center; gap:10px; }
    .mbti-res-dim-row span { font-size:0.76rem; min-width:28px; color:var(--ink-light); }
    .mbti-res-dim-bar { flex:1; height:12px; background:rgba(255,255,255,0.06); border-radius:6px; overflow:hidden; }
    .mbti-res-dim-fill { height:100%; border-radius:6px; transition:width .6s ease; }
    .mbti-res-dim-pct { font-size:0.7rem; color:var(--ink-faint); text-align:center; margin-top:3px; }
    .mbti-res-section { background:var(--input-bg); border:1px solid var(--line); border-radius:14px; padding:18px 20px; margin-bottom:14px; }
    .mbti-res-section h3 { font-size:0.94rem; color:var(--gold-light); margin:0 0 10px; }
    .mbti-res-section p { font-size:0.84rem; line-height:1.85; color:var(--ink); margin:0; }
    .mbti-cog-stack { font-size:1.2rem !important; font-weight:700; letter-spacing:0.1em; color:var(--gold) !important; text-align:center; margin-bottom:10px !important; }
    .mbti-cog-desc { font-size:0.8rem !important; color:var(--ink-light) !important; }
    .mbti-bazi-link { border-color:var(--gold-dim); background:linear-gradient(160deg,var(--vermilion-dim),var(--input-bg)); }
    .mbti-res-upgrade { text-align:center; padding:22px 20px; border-radius:14px; border:1px dashed var(--gold); margin-bottom:14px; }
    .mbti-res-upgrade p { font-size:0.86rem; color:var(--ink-light); margin:0 0 14px; }
    .mbti-res-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:20px; }
    @media (max-width:560px){
      .mbti-entries { flex-direction:column; }
      .mbti-grid-inner { grid-template-columns:repeat(4,1fr); gap:8px; }
      .mbti-type-card { padding:10px 6px; }
      .mbti-tc-code { font-size:0.76rem; }
      .mbti-tc-name { font-size:0.6rem; }
      .mbti-pw-tiers { flex-direction:column; align-items:center; }
    }

    /* ===== 每日签到 + 收藏 ===== */
    .ck-main { text-align:center; padding:26px 20px; border-radius:16px; background:linear-gradient(160deg,var(--gold-dim),var(--input-bg)); border:1px solid var(--gold); margin-bottom:18px; }
    .ck-stats { display:flex; justify-content:center; gap:40px; margin-bottom:18px; }
    .ck-stat b { display:block; font-size:2rem; color:var(--gold-light); line-height:1; }
    .ck-stat span { font-size:0.72rem; color:var(--ink-faint); }
    .ck-btn { display:inline-block; padding:13px 50px !important; }
    .ck-done { font-size:1.05rem; color:var(--jade-light); font-weight:600; margin-bottom:14px; }
    .ck-gift { background:rgba(0,0,0,0.16); border-radius:12px; padding:16px 18px; text-align:left; }
    .ck-gift-t { font-size:0.74rem; color:var(--gold); letter-spacing:0.12em; text-align:center; margin-bottom:10px; }
    .ck-gift-tip { font-size:0.9rem; line-height:1.85; color:var(--ink); margin:0 0 12px; }
    .ck-gift-luck { display:flex; justify-content:center; gap:24px; font-size:0.78rem; color:var(--ink-light); margin-bottom:12px; }
    .ck-gift-luck b { color:var(--gold-light); }
    .ck-gift-links { display:flex; justify-content:center; gap:14px; flex-wrap:wrap; }
    .ck-link { background:none; border:none; color:var(--gold); font-family:inherit; font-size:0.8rem; cursor:pointer; }
    .ck-link:hover { color:var(--gold-light); text-decoration:underline; }
    .ck-ms { font-size:0.82rem; color:var(--gold-light); margin:16px 0 0; }
    .ck-cal { background:var(--input-bg); border:1px solid var(--gold-dim); border-radius:14px; padding:16px 18px; margin-bottom:18px; }
    .ck-cal-t { font-size:0.82rem; color:var(--gold-light); text-align:center; margin-bottom:14px; }
    .ck-cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:6px; }
    .ck-cal-w { text-align:center; font-size:0.66rem; color:var(--ink-faint); padding-bottom:4px; }
    .ck-cal-cell { aspect-ratio:1; display:flex; align-items:center; justify-content:center; font-size:0.76rem;
      border-radius:8px; background:rgba(255,255,255,0.03); color:var(--ink-light); }
    .ck-cal-empty { background:none; }
    .ck-cal-signed { background:var(--jade-dim); color:var(--jade-light); border:1px solid var(--jade); font-weight:700; }
    .ck-cal-today { box-shadow:0 0 0 2px var(--gold); color:var(--gold-light); }
    .fav-box { background:var(--input-bg); border:1px solid var(--gold-dim); border-radius:14px; padding:16px 18px; }
    .fav-t { font-size:0.92rem; color:var(--gold-light); margin-bottom:12px; }
    .fav-t span { font-size:0.74rem; color:var(--ink-faint); }
    .fav-empty { font-size:0.78rem; color:var(--ink-faint); line-height:1.7; margin:0; }
    .fav-list { display:flex; flex-direction:column; gap:10px; }
    .fav-item { background:rgba(255,255,255,0.03); border-radius:10px; padding:12px 14px; border-left:3px solid var(--gold); }
    .fav-head { display:flex; align-items:center; gap:8px; }
    .fav-type { font-size:0.66rem; background:var(--gold-dim); color:var(--gold-light); padding:1px 9px; border-radius:20px; flex-shrink:0; }
    .fav-head b { font-size:0.86rem; color:var(--ink); flex:1; }
    .fav-del { background:none; border:none; color:var(--ink-faint); cursor:pointer; font-size:0.9rem; flex-shrink:0; }
    .fav-del:hover { color:var(--vermilion-light); }
    .fav-content { font-size:0.76rem; line-height:1.7; color:var(--ink-faint); margin:7px 0 0; }
    .fav-star { background:none; border:none; cursor:pointer; color:var(--gold); font-size:1.05rem; margin-left:auto; padding:0 4px; transition:transform .15s; }
    .fav-star:hover { transform:scale(1.25); }
    .fav-star.faved { color:var(--gold-light); }
    .fav-star-wide { border:1px solid var(--gold-dim); border-radius:20px; padding:6px 18px; font-size:0.8rem; color:var(--gold-light); }
    .fav-star-wide:hover { background:var(--gold-dim); transform:none; }
    .ck-toast { position:fixed; left:50%; bottom:40px; transform:translateX(-50%) translateY(20px); z-index:9999;
      background:var(--gold); color:var(--bg-deep); font-size:0.84rem; font-weight:600; padding:10px 24px; border-radius:24px;
      opacity:0; pointer-events:none; transition:all .3s; box-shadow:0 8px 24px rgba(0,0,0,0.4); }
    .ck-toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

    /* ===== 缘分速配 ===== */
    .yf-input { text-align:center; }
    .yf-sides { display:flex; align-items:stretch; justify-content:center; gap:10px; margin-bottom:20px; }
    .yf-side { flex:1; max-width:200px; background:var(--input-bg); border:1px solid var(--gold-dim); border-radius:14px; padding:16px 14px; }
    .yf-side-a { border-color:rgba(224,83,58,0.4); }
    .yf-side-b { border-color:rgba(74,127,208,0.4); }
    .yf-side-t { font-size:1rem; font-weight:700; margin-bottom:10px; }
    .yf-side-a .yf-side-t { color:var(--vermilion-light); }
    .yf-side-b .yf-side-t { color:#7fa8e0; }
    .yf-side label { display:block; font-size:0.7rem; color:var(--ink-faint); margin:10px 0 4px; text-align:left; }
    .yf-side select, .yf-name { width:100%; padding:8px 10px; border-radius:8px; background:var(--bg-deep); border:1px solid var(--line); color:var(--ink); font-family:inherit; font-size:0.86rem; }
    .yf-name { margin-bottom:4px; }
    .yf-heart { display:flex; align-items:center; font-size:1.6rem; color:var(--gold); }
    .yf-go { display:inline-block; padding:13px 40px !important; }
    .yf-tip { font-size:0.66rem; color:var(--ink-faint); margin-top:14px; }
    .yf-card { --yf-c:var(--gold); margin-top:8px; padding:26px 22px; border-radius:18px; text-align:center;
      background:linear-gradient(165deg, color-mix(in srgb, var(--yf-c) 16%, var(--input-bg)), var(--input-bg)); border:1px solid var(--yf-c); }
    .yf-pair-name { font-size:1.3rem; font-weight:700; color:var(--ink); }
    .yf-pair-name span { color:var(--yf-c); margin:0 4px; }
    .yf-pair-sub { font-size:0.74rem; color:var(--ink-faint); margin-top:5px; }
    .yf-ring-wrap { position:relative; width:140px; height:140px; margin:18px auto 10px; }
    .yf-ring { width:140px; height:140px; }
    .yf-ring circle:last-child { transition:stroke-dashoffset 1.1s cubic-bezier(.22,1,.36,1); }
    .yf-ring-num { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
    .yf-ring-num b { font-size:2.4rem; color:var(--yf-c); line-height:1; }
    .yf-ring-num span { font-size:0.66rem; color:var(--ink-faint); margin-top:2px; }
    .yf-tier { font-size:1.25rem; font-weight:700; color:var(--yf-c); margin-bottom:8px; }
    .yf-rels { display:flex; justify-content:center; gap:10px; margin-bottom:16px; }
    .yf-rels span { font-size:0.72rem; padding:2px 12px; border-radius:20px; background:var(--gold-dim); color:var(--gold-light); }
    .yf-dims { display:grid; grid-template-columns:1fr 1fr; gap:12px; text-align:left; margin-bottom:16px; }
    .yf-dim-top { display:flex; justify-content:space-between; font-size:0.78rem; margin-bottom:5px; }
    .yf-dim-top span { color:var(--ink-light); }
    .yf-dim-top b { color:var(--ink); }
    .yf-dim-track { height:8px; background:rgba(255,255,255,0.08); border-radius:5px; overflow:hidden; }
    .yf-dim-fill { height:100%; border-radius:5px; transition:width .9s ease; }
    .yf-verdict { font-size:0.86rem; line-height:1.9; color:var(--ink); text-align:left; margin:0 0 12px; }
    .yf-adv { font-size:0.82rem; line-height:1.8; color:var(--gold-light); text-align:left; margin:0; padding:11px 14px; background:rgba(0,0,0,0.16); border-radius:10px; }
    .yf-actions { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:18px; }
    .yf-link { background:none; border:1px solid var(--line); color:var(--ink-light); font-family:inherit; font-size:0.82rem; padding:9px 18px; border-radius:24px; cursor:pointer; }
    .yf-link:hover { border-color:var(--gold); color:var(--gold); }
    .yf-link.faved { color:var(--gold-light); border-color:var(--gold); }
    .yf-hook { margin-top:20px; padding:18px; border-radius:14px; text-align:center; background:linear-gradient(160deg, var(--vermilion-dim), var(--input-bg)); border:1px solid var(--gold-dim); }
    .yf-hook p { font-size:0.86rem; color:var(--ink); margin:0 0 13px; line-height:1.7; }
    .yf-hook b { color:var(--gold-light); }
    @media (max-width:560px){ .yf-dims { grid-template-columns:1fr; } .yf-side { padding:12px 10px; } .yf-heart { font-size:1.2rem; } }

    /* ===== 互动增强：摇签瓶 ===== */
    .shake-bottle { position:relative; display:flex; flex-direction:column; align-items:center; padding:28px 20px; margin-top:20px; border-radius:16px; background:var(--panel-bg); border:1px solid var(--line); overflow:hidden; }
    .shake-bottle-jar { font-size:4rem; cursor:pointer; transition:transform 0.1s; user-select:none; }
    .shake-bottle-jar.shaking { animation:jarShake 0.08s 8 alternate; }
    @keyframes jarShake { 0%{transform:rotate(-8deg)} 100%{transform:rotate(8deg)} }
    .shake-bottle-result { margin-top:16px; padding:14px 20px; border-radius:12px; background:var(--input-bg); border:1px solid var(--gold-dim); text-align:center; font-size:0.92rem; color:var(--gold-light); line-height:1.8; opacity:0; transform:translateY(10px); transition:all 0.5s ease; min-height:48px; }
    .shake-bottle-result.show { opacity:1; transform:translateY(0); }
    .shake-bottle-hint { font-size:0.72rem; color:var(--ink-faint); margin-top:10px; }
    .shake-bottle-btn { margin-top:12px; padding:10px 28px; border:1px solid var(--gold); border-radius:24px; background:transparent; color:var(--gold-light); cursor:pointer; font-size:0.86rem; transition:all 0.2s; }
    .shake-bottle-btn:hover { background:var(--gold-dim); }

    /* ===== 互动增强：五行粒子 ===== */
    .wx-particle-canvas { position:absolute; top:0; left:0; width:100%; height:100%; pointer-events:none; z-index:2; }
    .wuxing-bar-group { position:relative; cursor:pointer; }
    .wuxing-bar-group:hover .wuxing-bar-fill { filter:brightness(1.3); }
    .wx-burst { position:absolute; width:6px; height:6px; border-radius:50%; pointer-events:none; animation:wxBurst 0.7s ease-out forwards; }
    @keyframes wxBurst { 0%{opacity:1;transform:scale(1)} 100%{opacity:0;transform:scale(0.3) translateY(-30px)} }

    /* ===== 互动增强：能量倒计时 ===== */
    .energy-meter { display:flex; align-items:center; gap:14px; padding:14px 18px; margin-top:16px; border-radius:14px; background:var(--input-bg); border:1px solid var(--line); }
    .energy-ring { position:relative; width:54px; height:54px; flex:none; }
    .energy-ring svg { width:100%; height:100%; }
    .energy-info { flex:1; }
    .energy-hour { font-size:1.1rem; font-weight:700; color:var(--gold-light); }
    .energy-sub { font-size:0.74rem; color:var(--ink-faint); margin-top:3px; }
    .energy-countdown { font-size:0.82rem; color:var(--jade-light); font-variant-numeric:tabular-nums; }

    /* ===== 互动增强：五行猜猜乐 ===== */
    .wx-quiz { padding:20px; margin-top:20px; border-radius:16px; background:var(--panel-bg); border:1px solid var(--line); text-align:center; }
    .wx-quiz-char { font-size:3.2rem; font-weight:900; margin:12px 0; color:var(--ink); font-family:var(--font-serif); }
    .wx-quiz-opts { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:14px; }
    .wx-quiz-opt { width:52px; height:52px; border-radius:50%; border:2px solid var(--line); background:var(--input-bg); cursor:pointer; font-size:1.1rem; font-weight:700; transition:all 0.2s; display:flex; align-items:center; justify-content:center; }
    .wx-quiz-opt:hover { border-color:var(--gold); transform:scale(1.1); }
    .wx-quiz-opt.correct { border-color:#4caf50; background:rgba(76,175,80,0.15); animation:wxCorrect 0.4s ease; }
    .wx-quiz-opt.wrong { border-color:#e53935; background:rgba(229,57,53,0.12); animation:wxWrong 0.3s ease; }
    @keyframes wxCorrect { 0%{transform:scale(1)} 50%{transform:scale(1.2)} 100%{transform:scale(1)} }
    @keyframes wxWrong { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-4px)} 75%{transform:translateX(4px)} }
    .wx-quiz-score { font-size:0.78rem; color:var(--ink-faint); margin-top:12px; }
    .wx-quiz-streak { display:inline-block; padding:2px 10px; border-radius:10px; background:var(--gold-dim); color:var(--gold-light); font-size:0.72rem; margin-left:8px; }
    .wx-quiz-feedback { font-size:0.86rem; margin-top:10px; min-height:24px; transition:opacity 0.3s; }

    /* ===== 互动增强：今日运势弹幕 ===== */
    .danmu-container { position:relative; height:36px; overflow:hidden; margin-top:12px; border-radius:8px; }
    .danmu-item { position:absolute; white-space:nowrap; font-size:0.74rem; color:var(--ink-faint); top:50%; transform:translateY(-50%); animation:danmuScroll 12s linear forwards; padding:4px 12px; border-radius:12px; background:rgba(199,169,107,0.06); border:1px solid var(--line-soft); }
    @keyframes danmuScroll { 0%{left:100%} 100%{left:-100%} }

    /* ===== 互动增强：四柱点击波纹 ===== */
    .pillar-cell { cursor:pointer; position:relative; overflow:hidden; }
    .pillar-ripple { position:absolute; border-radius:50%; background:rgba(199,169,107,0.3); transform:scale(0); animation:rippleOut 0.6s ease-out forwards; pointer-events:none; }
    @keyframes rippleOut { to { transform:scale(4); opacity:0; } }
    .pillar-tooltip { position:absolute; bottom:100%; left:50%; transform:translateX(-50%) translateY(-4px); padding:8px 14px; border-radius:10px; background:var(--paper-dark); border:1px solid var(--gold-dim); font-size:0.74rem; color:var(--ink-light); white-space:nowrap; opacity:0; transition:opacity 0.3s, transform 0.3s; pointer-events:none; z-index:10; box-shadow:0 4px 12px rgba(0,0,0,0.3); }
    .pillar-cell:hover .pillar-tooltip, .pillar-cell.tapped .pillar-tooltip { opacity:1; transform:translateX(-50%) translateY(-8px); }

    /* ===== 移动端触控优化 ===== */
    @media (max-width: 640px) {
      .nav-item { min-height: 44px; min-width: 44px; padding: 10px 16px; font-size: 0.78rem; }
      .top-nav { gap: 6px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 4px; flex-wrap: nowrap; justify-content: flex-start; scroll-snap-type: x mandatory; mask-image: linear-gradient(to right, transparent 0, #000 8px, #000 calc(100% - 24px), transparent 100%); -webkit-mask-image: linear-gradient(to right, transparent 0, #000 8px, #000 calc(100% - 24px), transparent 100%); }
      .top-nav::-webkit-scrollbar { display: none; }
      .nav-item { scroll-snap-align: start; flex-shrink: 0; }
      .btn-calculate, .today-btn { min-height: 44px; padding: 12px 20px; font-size: 0.85rem; }
      .input-group select, .input-group input { min-height: 40px; font-size: 16px; }
      .sc-btn { min-height: 40px; padding: 8px 14px; }
      .theme-dot { width: 28px; height: 28px; }
    }
    @media (max-width: 400px) {
      .nav-item { padding: 8px 12px; font-size: 0.72rem; letter-spacing: 0.06em; }
      .input-panel { padding: 18px 12px; }
      .input-row { gap: 6px; }
    }
    @media (pointer: coarse) {
      .nav-item { min-height: 44px; }
      .btn-calculate, .today-btn, .sc-btn { min-height: 44px; }
      input, select, button { min-height: 40px; }
    }

    /* ===== 卡片交互 ===== */
    .analysis-card, .analysis-card-item, .dayun-card { cursor: pointer; }
    .analysis-card { position: relative; overflow: hidden; }
    .analysis-card::after { content:'▾'; position:absolute; top:20px; right:16px; font-size:0.7rem; color:var(--ink-faint); transition:transform 0.3s; }
    .analysis-card.collapsed::after { transform:rotate(-90deg); }
    .analysis-card.collapsed > *:not(h4) { display:none; }
    .analysis-card-item { position:relative; overflow:hidden; }
    .analysis-card-item::after { content:'▾'; position:absolute; top:16px; right:14px; font-size:0.65rem; color:var(--ink-faint); transition:transform 0.3s; }
    .analysis-card-item.collapsed::after { transform:rotate(-90deg); }
    .analysis-card-item.collapsed > *:not(h4) { display:none; }
    .dayun-card { cursor:pointer; transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s; }
    .dayun-card:hover { transform:translateY(-3px); box-shadow:0 6px 20px rgba(0,0,0,0.12); }
    .dayun-card.active-card { border-color:var(--gold); box-shadow:0 0 12px rgba(199,169,107,0.3); }
    .pc-row:not(.pc-head) .pc-cell { cursor:pointer; transition:background 0.2s; border-radius:4px; }
    .pc-row:not(.pc-head) .pc-cell:hover { background:rgba(199,169,107,0.08); }
    .pc-row:not(.pc-head) .pc-cell.col-highlight { background:rgba(199,169,107,0.12); box-shadow:inset 0 0 0 1px rgba(199,169,107,0.25); }
    @media (hover:hover) {
      .analysis-card:hover, .analysis-card-item:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(44,32,24,0.08); }
    }

    /* ===== 性能优化 ===== */
    [id^="view"] { contain: layout style paint; }
    .analysis-card, .analysis-card-item { opacity: 0; transform: translateY(18px); transition: opacity 0.5s cubic-bezier(0.23,1,0.32,1), transform 0.5s cubic-bezier(0.23,1,0.32,1); }
    .analysis-card.in-view, .analysis-card-item.in-view { opacity: 1; transform: none; }
    /* 交错入场：每张卡片延迟递增 */
    .analysis-card.in-view:nth-child(2) { transition-delay: 0.08s; }
    .analysis-card.in-view:nth-child(3) { transition-delay: 0.16s; }
    .analysis-card.in-view:nth-child(4) { transition-delay: 0.24s; }
    .analysis-card.in-view:nth-child(5) { transition-delay: 0.32s; }
    [id^="view"][style*="display: none"], [id^="view"][style*="display:none"] {
      content-visibility: hidden;
    }
    .coin-loader, .pillar-ripple, .wx-burst, .danmu-item { will-change: transform, opacity; }

    /* ===== 卡片动画特效 ===== */
    /* 大运卡片：悬停浮起 + 光晕 */
    .dayun-card {
      transition: transform 0.3s cubic-bezier(0.23,1,0.32,1), box-shadow 0.3s, border-color 0.3s !important;
      position: relative; overflow: hidden;
    }
    .dayun-card::after {
      content: ''; position: absolute; inset: 0;
      background: linear-gradient(135deg, rgba(199,169,107,0.08), transparent 60%);
      opacity: 0; transition: opacity 0.3s;
      pointer-events: none; border-radius: inherit;
    }
    .dayun-card:hover::after { opacity: 1; }
    .dayun-card:hover { transform: translateY(-4px) scale(1.02); box-shadow: 0 8px 24px rgba(199,169,107,0.15); }
    .dayun-card.active-card { border-color: var(--gold) !important; box-shadow: 0 0 16px rgba(199,169,107,0.3); }

    /* 五行条形图：加载动画 */
    .wuxing-bar-fill {
      transform-origin: left;
      animation: barGrow 0.8s cubic-bezier(0.23,1,0.32,1) both;
    }
    @keyframes barGrow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
    .wuxing-bar-group:nth-child(1) .wuxing-bar-fill { animation-delay: 0s; }
    .wuxing-bar-group:nth-child(2) .wuxing-bar-fill { animation-delay: 0.1s; }
    .wuxing-bar-group:nth-child(3) .wuxing-bar-fill { animation-delay: 0.2s; }
    .wuxing-bar-group:nth-child(4) .wuxing-bar-fill { animation-delay: 0.3s; }
    .wuxing-bar-group:nth-child(5) .wuxing-bar-fill { animation-delay: 0.4s; }

    /* 命格称号卡：呼吸光效 */
    .verdict-card {
      position: relative; overflow: hidden;
    }
    .verdict-card::before {
      content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%;
      background: conic-gradient(from 0deg, transparent, rgba(199,169,107,0.06), transparent, rgba(95,180,196,0.04), transparent);
      animation: cardGlow 8s linear infinite;
      pointer-events: none;
    }
    @keyframes cardGlow { to { transform: rotate(360deg); } }

    /* 星座卡片：入场翻转 */
    .zodiac-card {
      animation: zodiacIn 0.6s cubic-bezier(0.23,1,0.32,1) both;
      transition: transform 0.3s, box-shadow 0.3s;
    }
    .zodiac-card:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,0.12); }
    @keyframes zodiacIn { from { opacity: 0; transform: perspective(600px) rotateX(8deg) translateY(20px); } to { opacity: 1; transform: none; } }

    /* 紫微命盘宫位：交错渐显 */
    .zw-pal {
      opacity: 0; animation: palFade 0.4s ease forwards;
    }
    .zw-pal:nth-child(1) { animation-delay: 0.05s; }
    .zw-pal:nth-child(2) { animation-delay: 0.1s; }
    .zw-pal:nth-child(3) { animation-delay: 0.15s; }
    .zw-pal:nth-child(4) { animation-delay: 0.2s; }
    .zw-pal:nth-child(5) { animation-delay: 0.25s; }
    .zw-pal:nth-child(6) { animation-delay: 0.3s; }
    .zw-pal:nth-child(7) { animation-delay: 0.35s; }
    .zw-pal:nth-child(8) { animation-delay: 0.4s; }
    .zw-pal:nth-child(9) { animation-delay: 0.45s; }
    .zw-pal:nth-child(10) { animation-delay: 0.5s; }
    .zw-pal:nth-child(11) { animation-delay: 0.55s; }
    .zw-pal:nth-child(12) { animation-delay: 0.6s; }
    @keyframes palFade { from { opacity: 0; transform: scale(0.92); } to { opacity: 1; transform: none; } }

    /* 折叠层展开动画 */
    .layer-body {
      transition: max-height 0.4s cubic-bezier(0.23,1,0.32,1), opacity 0.3s;
      overflow: hidden;
    }
    .layer-group.collapsed .layer-body { max-height: 0 !important; opacity: 0; }

    /* bullet卡片：悬停微浮 + 边框流光 */
    .bullet-card {
      transition: transform 0.3s, box-shadow 0.3s, border-color 0.3s;
      position: relative;
    }
    .bullet-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 8px 24px rgba(0,0,0,0.1);
      border-color: var(--gold);
    }
    .bullet-card::after {
      content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
      background: linear-gradient(90deg, transparent, var(--gold), transparent);
      opacity: 0; transition: opacity 0.3s;
    }
    .bullet-card:hover::after { opacity: 1; }

    /* 运势曲线图：渐显 */
    .fortune-chart-section {
      animation: fadeInUp 0.6s 0.2s both;
    }

    /* 评分数字：计数动画占位 */
    .score-num {
      display: inline-block;
      animation: scoreCountUp 1s cubic-bezier(0.23,1,0.32,1) both;
    }
    @keyframes scoreCountUp { from { opacity: 0; transform: translateY(10px) scale(0.8); } to { opacity: 1; transform: none; } }

    /* 输入面板提交按钮：点击波纹 */
    .btn-calculate { position: relative; overflow: hidden; }
    .btn-calculate::after {
      content: ''; position: absolute; inset: 0;
      background: radial-gradient(circle at var(--ripple-x, 50%) var(--ripple-y, 50%), rgba(255,255,255,0.3), transparent 60%);
      transform: scale(0); opacity: 0; transition: transform 0.5s, opacity 0.4s;
      pointer-events: none; border-radius: inherit;
    }
    .btn-calculate:active::after { transform: scale(2.5); opacity: 1; transition: 0s; }

    /* 尊重用户偏好 */
    @media (prefers-reduced-motion: reduce) {
      .wuxing-bar-fill { animation: none; transform: none; }
      .verdict-card::before { animation: none; }
      .zodiac-card { animation: none; }
      .zw-pal { animation: none; opacity: 1; }
      .dayun-card:hover { transform: none; }
    }

    /* ===== 浮动操作按钮 (FAB) ===== */
    .fab-group {
      position: fixed; bottom: 24px; right: 24px; z-index: 1000;
      display: flex; flex-direction: column; gap: 10px;
      opacity: 0; transform: translateY(20px); transition: opacity 0.3s, transform 0.3s;
      pointer-events: none;
    }
    .fab-group.show { opacity: 1; transform: none; pointer-events: auto; }
    .fab-btn {
      width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line);
      background: var(--paper-dark); color: var(--ink-light); font-size: 1.1rem;
      cursor: pointer; display: flex; align-items: center; justify-content: center;
      box-shadow: 0 4px 16px rgba(0,0,0,0.2); transition: all 0.25s;
      backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    }
    .fab-btn:hover { border-color: var(--gold); color: var(--gold-light); transform: scale(1.1); }

    /* ===== 结果快捷导航面板 ===== */
    .result-quicknav {
      position: fixed; bottom: 84px; right: 24px; z-index: 999;
      background: var(--paper-dark); border: 1px solid var(--line);
      border-radius: 12px; padding: 12px 16px; min-width: 160px; max-width: 220px;
      box-shadow: 0 8px 32px rgba(0,0,0,0.3); backdrop-filter: blur(12px);
      display: none; max-height: none; overflow: visible;
    }
    .result-quicknav.show { display: block; animation: fadeInUp 0.2s ease; }
    .rqn-title { font-size: 0.7rem; color: var(--ink-faint); letter-spacing: 0.2em; margin-bottom: 8px; text-align: center; }
    .rqn-list a {
      display: block; padding: 6px 8px; font-size: 0.78rem; color: var(--ink-light);
      text-decoration: none; border-radius: 6px; transition: all 0.15s; margin-bottom: 2px;
    }
    .rqn-list a:hover { background: var(--gold-dim); color: var(--gold-light); }
    @keyframes fadeInUp { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }

    /* ===== 输入面板日期联动提示 ===== */
    .date-hint {
      text-align: center; font-size: 0.7rem; color: var(--jade-light);
      margin-top: 8px; opacity: 0; transition: opacity 0.3s; min-height: 1.2em;
    }
    .date-hint.show { opacity: 1; }

    /* ===== 运势曲线图 ===== */
    .fortune-chart-section { background: var(--paper-dark); border: 1px solid var(--line-soft); border-radius: 8px; padding: 20px; }
    .fortune-chart-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .fortune-chart-wrap canvas { display: block; max-width: 100%; height: auto; }
    .fortune-chart-legend {
      display: flex; justify-content: center; gap: 16px; margin-top: 10px;
      font-size: 0.72rem; color: var(--ink-faint);
    }
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
    }
    [id^="view"] { transition: opacity 0.2s ease; }
    @keyframes shimmer { 0%{background-position:-200% 0} 100%{background-position:200% 0} }
    .skeleton-line { height:14px; border-radius:6px; background:linear-gradient(90deg, var(--paper-dark) 25%, var(--paper-darker) 50%, var(--paper-dark) 75%); background-size:200% 100%; animation:shimmer 1.5s infinite; margin:10px 0; }

/* ===========================================================
   补丁层（合并精简版）
   =========================================================== */

/* --- 导航分级 --- */
.nav-more {
  padding: 8px 18px; border-radius: 22px; font-size: 0.82rem; letter-spacing: 0.1em;
  cursor: pointer; background: transparent; border: 1px dashed var(--line); color: var(--ink-faint);
  flex-shrink: 0; white-space: nowrap; transition: all 0.2s; font-family: inherit;
}
.nav-more:hover { border-color: var(--gold); color: var(--gold-light); }
.nav-overflow { display: none; justify-content: center; gap: 6px; padding: 0; flex-wrap: wrap; }
.nav-overflow.show { display: flex; padding: 8px 0 4px; }

/* --- 结果锚点目录 --- */
.result-toc {
  display: none; position: sticky; top: 0; z-index: 50;
  background: var(--paper-dark); border-bottom: 1px solid var(--line-soft);
  padding: 8px 12px; overflow-x: auto; white-space: nowrap; scrollbar-width: none;
}
.result-toc::-webkit-scrollbar { display: none; }
.result.show .result-toc { display: block; }
.result-toc a {
  display: inline-block; padding: 4px 12px; font-size: 0.7rem; color: var(--ink-faint);
  text-decoration: none; border: 1px solid var(--line-soft); border-radius: 14px; transition: all 0.2s;
}
.result-toc a:hover { border-color: var(--gold); color: var(--gold-light); background: var(--gold-dim); }

/* --- Glassmorphism 面板 --- */
.input-panel, .liuqin-panel, .strength-panel {
  background: rgba(22, 32, 46, 0.65);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(199, 169, 107, 0.1);
  box-shadow: 0 4px 20px rgba(0,0,0,0.15), inset 0 1px 0 rgba(255,255,255,0.03);
}
body[data-theme="paper"] .input-panel,
body[data-theme="paper"] .liuqin-panel,
body[data-theme="paper"] .strength-panel {
  background: rgba(251, 246, 234, 0.8);
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
}

/* --- Hero 隐藏 --- */
.hero { display: none; }
.ink-line { display: none; }

/* --- 装饰伪元素清理（防止重叠） --- */
header::before, header::after { content: none; display: none; }

/* --- 五行条增长动画 --- */
.wuxing-bar-fill { animation: barGrow 0.8s cubic-bezier(0.23,1,0.32,1) both; transform-origin: left; }
@keyframes barGrow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.wuxing-bar-group:nth-child(2) .wuxing-bar-fill { animation-delay: 0.1s; }
.wuxing-bar-group:nth-child(3) .wuxing-bar-fill { animation-delay: 0.2s; }
.wuxing-bar-group:nth-child(4) .wuxing-bar-fill { animation-delay: 0.3s; }
.wuxing-bar-group:nth-child(5) .wuxing-bar-fill { animation-delay: 0.4s; }

/* --- 大运卡片 --- */
.dayun-card:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,0.12); }

/* --- 运势曲线图 --- */
.fortune-chart-section { background: var(--paper-dark); border: 1px solid var(--line-soft); border-radius: 8px; padding: 20px; }
.fortune-chart-wrap { overflow-x: auto; }
.fortune-chart-wrap canvas { display: block; max-width: 100%; height: auto; }
.fortune-chart-legend { display: flex; justify-content: center; gap: 16px; margin-top: 10px; font-size: 0.72rem; color: var(--ink-faint); }

/* --- 奇门遁甲九宫格 --- */
.qm-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin: 16px 0; }
.qm-cell { background: var(--paper-darker); border: 1px solid var(--line-soft); border-radius: 6px; padding: 10px 8px; text-align: center; font-size: 0.76rem; line-height: 1.6; }
.qm-cell.qm-center { background: var(--paper); border-style: dashed; }
.qm-shen { font-size: 0.66rem; }
.qm-xing { font-weight: 600; }
.qm-men { font-weight: 600; }
.qm-tian, .qm-di { font-size: 0.72rem; }
.qm-gong { font-size: 0.64rem; color: var(--ink-faint); margin-top: 2px; }
.qm-legend { text-align: center; font-size: 0.7rem; color: var(--ink-faint); margin-top: 8px; }

/* --- 浮动按钮 --- */
.fab-group { position: fixed; bottom: 24px; right: 24px; z-index: 1000; display: flex; flex-direction: column; gap: 10px; opacity: 0; transform: translateY(20px); transition: opacity 0.3s, transform 0.3s; pointer-events: none; }
.fab-group.show { opacity: 1; transform: none; pointer-events: auto; }
.fab-btn { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line); background: var(--paper-dark); color: var(--ink-light); font-size: 1.1rem; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 16px rgba(0,0,0,0.2); transition: all 0.25s; }
.fab-btn:hover { border-color: var(--gold); color: var(--gold-light); transform: scale(1.1); }

/* --- 减弱动效 --- */
@media (prefers-reduced-motion: reduce) {
  .wuxing-bar-fill { animation: none; transform: none; }
  .dayun-card:hover { transform: none; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* ===== 手风琴折叠 ===== */
.accordion-section { border-bottom: 1px solid var(--line-soft); }
.accordion-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; cursor: pointer; transition: background 0.2s;
  user-select: none;
}
.accordion-head:hover { background: rgba(199,169,107,0.04); }
.accordion-title { font-size: 0.82rem; color: var(--gold-light); letter-spacing: 0.1em; font-weight: 500; }
.accordion-arrow { font-size: 0.8rem; color: var(--ink-faint); transition: transform 0.3s; }
.accordion-section.open .accordion-arrow { transform: rotate(180deg); }
.accordion-body {
  max-height: 0; overflow: hidden; transition: max-height 0.4s cubic-bezier(0.23,1,0.32,1), padding 0.3s;
  padding: 0 16px;
}
.accordion-section.open .accordion-body {
  max-height: 8000px; padding: 0 16px 16px;
}
/* 前3个默认展开 */
.accordion-section:nth-child(-n+3) { }
.accordion-section:nth-child(-n+3) .accordion-body { max-height: 8000px; padding: 0 16px 16px; }
.accordion-section:nth-child(-n+3) .accordion-arrow { transform: rotate(180deg); }

/* ===== 快捷输入 ===== */
.quick-input-row { text-align: center; margin-top: 12px; }
.quick-input {
  width: 100%; max-width: 380px; padding: 10px 16px;
  background: var(--paper); border: 1px solid var(--line); border-radius: 20px;
  color: var(--ink); font-size: 0.85rem; font-family: inherit;
  text-align: center; transition: border-color 0.2s;
}
.quick-input:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 2px var(--gold-dim); }
.quick-input::placeholder { color: var(--ink-faint); font-size: 0.76rem; }

/* ===== 骨架屏 ===== */
.skeleton-loading { padding: 40px 0; }
.skel-row { height: 16px; border-radius: 8px; margin-bottom: 16px; background: var(--paper-darker); animation: skelShimmer 1.5s infinite; }
.skel-wide { width: 80%; }
.skel-mid { width: 50%; }
.skel-short { width: 30%; }
.skel-grid { display: flex; gap: 16px; margin-bottom: 20px; }
.skel-card { flex: 1; height: 80px; border-radius: 8px; background: var(--paper-darker); animation: skelShimmer 1.5s infinite; }
.skel-card:nth-child(2) { animation-delay: 0.3s; }
@keyframes skelShimmer {
  0% { opacity: 0.4; }
  50% { opacity: 0.7; }
  100% { opacity: 0.4; }
}

/* ===== 性格画像 ===== */
.portrait-text p { font-size: 0.88rem; line-height: 2; color: var(--ink); margin-bottom: 12px; text-indent: 2em; }

/* ===== 大运四维详批 ===== */
.dy4d-block { border: 1px solid var(--line-soft); border-radius: 8px; padding: 14px; margin-bottom: 12px; }
.dy4d-head { font-size: 0.88rem; font-weight: 600; color: var(--gold-light); margin-bottom: 10px; }
.dy4d-row { display: flex; align-items: flex-start; gap: 8px; padding: 4px 0; font-size: 0.82rem; line-height: 1.7; }
.dy4d-icon { flex: none; font-size: 0.9rem; }
.dy4d-dim { flex: none; width: 2.5em; color: var(--ink-faint); font-size: 0.76rem; }
.dy4d-text { flex: 1; }

/* ===== 改运指南 ===== */
.gaiyun-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 14px 0; }
.gaiyun-card { background: var(--paper-darker); border: 1px solid var(--line-soft); border-radius: 8px; padding: 12px; text-align: center; }
.gy-icon { font-size: 1.4rem; margin-bottom: 4px; }
.gy-title { font-size: 0.72rem; color: var(--ink-faint); margin-bottom: 4px; }
.gy-text { font-size: 0.82rem; color: var(--ink-light); line-height: 1.6; }
@media (max-width: 480px) { .gaiyun-grid { grid-template-columns: 1fr; } }

/* ===== 每日塔罗（限定作用域，避免与独立牌阵卡片同名样式互相覆盖） ===== */
#dailyTarot .tarot-card { width: auto; height: auto; opacity: 1; animation: none; perspective: none; text-align: center; padding: 24px 16px; border: 1px solid var(--line); border-radius: 12px; margin: 16px 0; background: var(--paper-darker); }
#dailyTarot .tarot-num { font-size: 1.6rem; color: var(--gold); font-weight: 700; margin-bottom: 4px; }
#dailyTarot .tarot-name { font-size: 1.3rem; font-weight: 600; color: var(--ink); margin-bottom: 8px; font-family: var(--font-serif); }
#dailyTarot .tarot-pos { font-size: 0.82rem; margin-bottom: 12px; font-weight: 500; }
#dailyTarot .tarot-reading { width: auto; font-size: 0.88rem; line-height: 1.9; color: var(--ink-light); text-align: left; margin-bottom: 12px; padding: 0; border: 0; }
#dailyTarot .tarot-advice { width: auto; font-size: 0.84rem; line-height: 1.8; color: var(--gold-light); font-style: italic; }

/* ===== 命书阅读模式 ===== */
.reading-mode { max-width: 640px; margin: 0 auto; }
.reading-para { font-size: 0.92rem; line-height: 2.2; text-indent: 2em; margin-bottom: 16px; color: var(--ink); }
.reading-para:last-child { text-align: center; color: var(--ink-faint); font-size: 0.8rem; margin-top: 32px; }

/* ===========================================================
   视觉精炼：去廉价感，建立节奏与质感
   原则：少动效多层次，靠排版和留白说话
   =========================================================== */

/* --- 1. 关闭所有循环动画（止住"乱动"感）--- */
body::after { animation: none !important; opacity: 0.25 !important; }
body::before { animation: none !important; }
.tc-glow { animation: none !important; }
.verdict-score, .score-num { text-shadow: none !important; }
.section-title { text-shadow: none !important; }
.dayun-star { animation: none !important; }
h1 { animation: none !important; -webkit-text-fill-color: var(--ink) !important; background: none !important; }
.btn-calculate { animation: none !important; background: var(--vermilion) !important; background-size: auto !important; }
.btn-calculate::before { display: none !important; }
.btn-calculate::after { display: none !important; }

/* --- 2. 重建标题区域：简约有气质 --- */
header {
  padding: 48px 0 24px !important;
  text-align: center;
}
header h1 {
  font-size: 2.2rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.4em !important;
  color: var(--ink) !important;
  margin-bottom: 8px;
}
header .subtitle {
  font-size: 0.78rem !important;
  color: var(--ink-faint) !important;
  letter-spacing: 0.5em !important;
  font-weight: 400;
}
header .header-ornament {
  width: 40px !important; height: 1px !important;
  background: var(--gold) !important;
  margin: 0 auto 16px !important;
  opacity: 0.6;
}
header .header-ornament::before, header .header-ornament::after { display: none !important; }

/* --- 3. 输入面板：更精致的边框和内间距 --- */
.input-panel {
  background: rgba(22, 32, 46, 0.5) !important;
  border: 1px solid rgba(199, 169, 107, 0.08) !important;
  border-radius: 12px !important;
  padding: 28px 32px !important;
  margin: 20px 0 !important;
  box-shadow: 0 2px 20px rgba(0,0,0,0.12) !important;
  backdrop-filter: blur(8px) !important;
}
.panel-title {
  font-size: 0.72rem !important;
  color: var(--gold) !important;
  opacity: 0.7 !important;
  letter-spacing: 0.5em !important;
  margin-bottom: 20px !important;
}

/* --- 4. 导航条：更克制的样式 --- */
.top-nav { padding: 12px 0 !important; gap: 8px !important; }
.nav-item {
  padding: 7px 18px !important;
  font-size: 0.8rem !important;
  border: 1px solid rgba(180,200,220,0.12) !important;
  border-radius: 6px !important;
  letter-spacing: 0.08em !important;
  transition: all 0.2s ease !important;
}
.nav-item:hover {
  border-color: rgba(199,169,107,0.3) !important;
  color: var(--gold-light) !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
.nav-item.active {
  background: var(--vermilion) !important;
  border-color: var(--vermilion) !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(199,91,84,0.25) !important;
}
.nav-item::after { display: none !important; }

/* --- 5. 排盘按钮：干净有力 --- */
.btn-calculate {
  padding: 11px 28px !important;
  border-radius: 8px !important;
  font-size: 0.84rem !important;
  letter-spacing: 0.15em !important;
  transition: background 0.2s, transform 0.15s, box-shadow 0.2s !important;
  box-shadow: 0 2px 8px rgba(199,91,84,0.2) !important;
}
.btn-calculate:hover {
  background: var(--vermilion-light) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(199,91,84,0.3) !important;
}
.btn-calculate:active { transform: translateY(0) scale(0.98) !important; }

/* --- 6. 合规提示：低调但不消失 --- */
.compliance-banner {
  font-size: 0.64rem !important;
  opacity: 0.5 !important;
  padding: 6px 12px !important;
  border: none !important;
  margin-bottom: 8px !important;
}

/* --- 7. 结果区卡片：有呼吸感的间距 --- */
.analysis-card, .strength-panel, .liuqin-panel {
  border-radius: 10px !important;
  margin-bottom: 20px !important;
}
.analysis-card h4, .strength-panel h4, .liuqin-panel h4 {
  font-size: 0.84rem !important;
  color: var(--gold) !important;
  letter-spacing: 0.2em !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid var(--line-soft) !important;
  margin-bottom: 14px !important;
}

/* --- 8. section-title：简洁装饰 --- */
.section-title {
  font-size: 0.76rem !important;
  color: var(--gold) !important;
  opacity: 0.8 !important;
  letter-spacing: 0.4em !important;
  text-align: center !important;
  padding: 16px 0 !important;
  position: relative !important;
}
.section-title::before, .section-title::after {
  content: '' !important;
  position: absolute !important; top: 50% !important;
  width: 30px !important; height: 1px !important;
  background: var(--gold) !important; opacity: 0.3 !important;
}
.section-title::before { left: 20% !important; }
.section-title::after { right: 20% !important; }

/* --- 9. 大运卡片：统一圆角和间距 --- */
.dayun-card {
  border-radius: 8px !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.dayun-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
}

/* --- 10. 手风琴：更精致 --- */
.accordion-head {
  padding: 12px 0 !important;
  border-bottom: 1px solid var(--line-soft);
}
.accordion-title {
  font-size: 0.8rem !important;
  color: var(--ink-light) !important;
  font-weight: 400 !important;
}
.accordion-section.open .accordion-title { color: var(--gold-light) !important; }

/* --- 11. 纹理感：用微妙的噪点代替纯色 --- */
.container {
  position: relative;
}

/* --- 12. 整体排版节奏 --- */
.st-row { padding: 8px 0 !important; border-bottom: 1px solid rgba(180,200,220,0.06) !important; }
.st-k { color: var(--ink-faint) !important; font-size: 0.76rem !important; }
.st-v { font-size: 0.84rem !important; line-height: 1.8 !important; }
.rel-intro { font-size: 0.76rem !important; color: var(--ink-faint) !important; line-height: 1.7 !important; margin-bottom: 14px !important; }
.st-concl { font-size: 0.74rem !important; color: var(--ink-faint) !important; margin-top: 14px !important; padding-top: 10px !important; border-top: 1px solid var(--line-soft) !important; line-height: 1.7 !important; }

/* --- 13. 主题切换按钮：更融入 --- */
.theme-switch {
  position: fixed !important; top: 12px !important; right: 16px !important;
  z-index: 100 !important; opacity: 0.6 !important;
  transition: opacity 0.2s !important;
}
.theme-switch:hover { opacity: 1 !important; }

/* --- 14. 暖宣纸主题微调 --- */
body[data-theme="paper"] .input-panel { background: rgba(251,246,234,0.7) !important; }
body[data-theme="paper"] header h1 { color: var(--ink) !important; }

/* ===========================================================
   设计原则贯彻：留白·圆角·克制·精致·过渡
   =========================================================== */

/* === 原则1：更大的留白和间距 === */
/* 容器主间距 */
.container { padding: 0 28px 60px !important; }
@media (min-width: 768px) { .container { padding: 0 40px 80px !important; } }

/* 面板之间的垂直节奏：统一为 24px */
.input-panel, .liuqin-panel, .strength-panel, .fortune-chart-section, .layer-group {
  margin-bottom: 24px !important;
}
/* 面板内部间距：上下 24px，左右 28px */
.input-panel { padding: 24px 28px !important; }
.liuqin-panel, .strength-panel { padding: 20px 24px !important; }

/* 标题与内容之间 */
.analysis-card h4, .strength-panel h4, .liuqin-panel h4 {
  margin-bottom: 16px !important;
  padding-bottom: 12px !important;
}
/* 行内容之间 */
.st-row { padding: 10px 0 !important; }
.analysis-row { padding: 8px 0 !important; }

/* 导航到内容的间距 */
.top-nav { margin-bottom: 8px !important; }

/* === 原则2：统一圆角体系 === */
/* 只用3级圆角：小(6px)·中(10px)·大(14px) */
.nav-item, .nav-more, .cal-tab { border-radius: 6px !important; }
.input-panel, .liuqin-panel, .strength-panel,
.fortune-chart-section, .layer-group,
.analysis-card, .dayun-card, .bullet-card { border-radius: 10px !important; }
.btn-calculate, .today-btn, .hero-cta { border-radius: 6px !important; }
.input-group input, .input-group select { border-radius: 6px !important; }
.quick-input { border-radius: 6px !important; }
.result-toc a { border-radius: 6px !important; }
.qm-cell { border-radius: 10px !important; }
.zodiac-card { border-radius: 10px !important; }
.zw-pal { border-radius: 6px !important; }
.share-btn, .sc-btn { border-radius: 6px !important; }
.fab-btn { border-radius: 14px !important; }
.theme-dot { border-radius: 14px !important; }

/* === 原则3：克制的颜色——金色只用于标题级元素 === */
/* 非标题的金色引用降级为更中性的色调 */
.panel-title { color: var(--ink-light) !important; }
.st-k { color: var(--ink-faint) !important; }
.dayun-age { color: var(--ink-light) !important; }
.dayun-note { color: var(--ink-faint) !important; }
.ar-label { color: var(--ink-faint) !important; }
/* 只有这些保持金色 */
.section-title { color: var(--gold) !important; opacity: 0.8 !important; }
.analysis-card h4, .strength-panel h4, .liuqin-panel h4 { color: var(--gold) !important; }
.accordion-section.open .accordion-title { color: var(--gold) !important; }

/* === 原则4：精致的细节 === */
/* 统一边框：1px + 低透明度 */
.input-panel, .liuqin-panel, .strength-panel,
.fortune-chart-section, .dayun-card, .zodiac-card, .qm-cell {
  border: 1px solid rgba(180,200,220,0.08) !important;
}
/* 统一阴影：三级递进 */
.input-panel { box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 4px 12px rgba(0,0,0,0.08) !important; }
.analysis-card, .strength-panel, .liuqin-panel { box-shadow: 0 1px 2px rgba(0,0,0,0.04), 0 2px 8px rgba(0,0,0,0.06) !important; }
.dayun-card { box-shadow: 0 1px 4px rgba(0,0,0,0.06) !important; }

/* 分割线统一 */
.st-row { border-bottom: 1px solid rgba(180,200,220,0.05) !important; }
.st-row:last-child { border-bottom: none !important; }

/* === 原则5：只保留有意义的过渡 === */
/* 统一过渡时长：150ms (快) / 250ms (中) */
.nav-item { transition: border-color 0.15s, color 0.15s, background 0.15s !important; }
.btn-calculate { transition: background 0.15s, transform 0.1s, box-shadow 0.15s !important; }
.dayun-card { transition: transform 0.2s ease, box-shadow 0.2s ease !important; }
.accordion-body { transition: max-height 0.3s ease, padding 0.2s ease !important; }
/* 禁止无意义的全局transition */
.input-panel, .liuqin-panel, .strength-panel { transition: none !important; }

/* === 细节收尾 === */
/* 去除过度的装饰性内容 */
.section-title::before, .section-title::after {
  width: 24px !important;
  opacity: 0.25 !important;
}
/* 输入区label更统一 */
.input-group label {
  font-size: 0.78rem !important;
  color: var(--ink-faint) !important;
  letter-spacing: 0 !important;
}
/* 输入框focus态更精致 */
.input-group input:focus, .input-group select:focus {
  border-color: var(--gold) !important;
  box-shadow: 0 0 0 2px rgba(199,169,107,0.08) !important;
  outline: none !important;
}

/* ===== 首屏引导 + 今日速看 ===== */
.intro-hook {
  text-align: center; padding: 0 0 12px; margin-top: -8px;
}
.hook-copy {
  font-size: 0.82rem; color: var(--ink-faint); letter-spacing: 0.08em; line-height: 1.6;
}
.today-glance {
  margin-bottom: 20px; padding: 16px 20px;
  background: rgba(22,32,46,0.35); border: 1px solid rgba(180,200,220,0.06);
  border-radius: 10px;
}
.tg-title {
  font-size: 0.68rem; color: var(--ink-faint); letter-spacing: 0.3em;
  text-align: center; margin-bottom: 12px;
}
.tg-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
}
.tg-item {
  text-align: center; padding: 8px 4px;
  background: rgba(14,22,34,0.4); border-radius: 6px;
  border: 1px solid rgba(180,200,220,0.04);
}
.tg-label { display: block; font-size: 0.64rem; color: var(--ink-faint); margin-bottom: 4px; }
.tg-value { display: block; font-size: 0.82rem; color: var(--ink-light); }
@media (max-width: 480px) {
  .tg-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ===== 仪式感加载序列 ===== */
.ritual-loader {
  display: none; text-align: center; padding: 60px 0;
}
.ritual-loader.show { display: block; }
.ritual-text {
  font-size: 0.9rem; color: var(--ink-light); letter-spacing: 0.15em;
  animation: ritualFade 0.8s ease-in-out;
}
@keyframes ritualFade { from { opacity: 0; } to { opacity: 1; } }
.ritual-dots { margin-top: 16px; }
.ritual-dots span {
  display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: var(--gold); margin: 0 4px; opacity: 0.3;
  animation: dotPulse 1.2s ease-in-out infinite;
}
.ritual-dots span:nth-child(2) { animation-delay: 0.2s; }
.ritual-dots span:nth-child(3) { animation-delay: 0.4s; }
@keyframes dotPulse { 0%,100%{opacity:0.3;transform:scale(1)} 50%{opacity:1;transform:scale(1.3)} }

/* ===== 三句话总结卡 ===== */
.summary-card {
  margin-bottom: 24px; padding: 24px 28px;
  background: rgba(22,32,46,0.5); border: 1px solid rgba(199,169,107,0.1);
  border-radius: 10px; border-left: 3px solid var(--gold);
}
.summary-card .sc-line {
  padding: 8px 0; font-size: 0.88rem; line-height: 1.7; color: var(--ink);
}
.summary-card .sc-line:not(:last-child) { border-bottom: 1px solid rgba(180,200,220,0.05); }
.summary-card .sc-num {
  display: inline-block; width: 20px; height: 20px; line-height: 20px;
  text-align: center; border-radius: 50%; font-size: 0.7rem;
  background: var(--gold-dim); color: var(--gold); margin-right: 10px;
  font-weight: 600;
}

/* ===== 结果底部引导 ===== */
.next-actions {
  margin-top: 32px; padding: 24px; text-align: center;
  border-top: 1px solid rgba(180,200,220,0.08);
}
.next-actions .na-title { font-size: 0.72rem; color: var(--ink-faint); letter-spacing: 0.3em; margin-bottom: 16px; }
.next-actions .na-grid { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.next-actions .na-btn {
  padding: 10px 20px; border-radius: 6px; font-size: 0.8rem;
  border: 1px solid rgba(180,200,220,0.1); background: rgba(22,32,46,0.4);
  color: var(--ink-light); cursor: pointer; transition: all 0.15s;
}
.next-actions .na-btn:hover { border-color: var(--gold); color: var(--gold-light); }

/* ===== 移动端输入布局优化 ===== */
@media (max-width: 640px) {
  .input-panel { padding: 20px 16px !important; }
  .input-row {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
  }
  /* 年月日占第一行 */
  .input-group:nth-child(1),
  .input-group:nth-child(2),
  .input-group:nth-child(3) { grid-column: auto; }
  /* 时辰和性别占第二行 */
  .input-group:has(#hour),
  .input-group:has(#gender) { grid-column: auto; }
  /* 按钮和今日占满宽 */
  .btn-calculate { grid-column: 1 / -1 !important; width: 100% !important; margin: 4px 0 0 !important; }
  .today-btn { grid-column: 1 / -1 !important; width: 100% !important; }
  /* 闰月组 */
  #leapGroup { grid-column: 1 / -1; }
  /* 快捷输入 */
  .quick-input { max-width: 100% !important; }
  /* 输入框尺寸 */
  .input-group input, .input-group select {
    width: 100% !important; min-width: 0 !important;
    font-size: 15px !important; padding: 10px 8px !important;
  }
  .input-group label { font-size: 0.72rem !important; }
}

/* ===========================================================
   产品化精简：让首屏只剩核心
   =========================================================== */

/* 1. 合规提示移到底部（视觉上隐藏在首屏，滚动到底部可见） */
.compliance-banner {
  position: fixed !important; bottom: 0 !important; left: 0 !important; right: 0 !important;
  background: var(--paper) !important; z-index: 50 !important;
  padding: 6px 16px !important; text-align: center !important;
  border-top: 1px solid var(--line-soft) !important;
  font-size: 0.62rem !important; opacity: 0.6 !important;
}

/* 2. 命例对照库 + 老黄历默认隐藏（开发者内容） */
#caseLibrary { display: none !important; }
#huangliPanel { display: none !important; }

/* 3. 主题切换收到更不显眼的位置 */
.theme-switch {
  position: fixed !important; bottom: 28px !important; left: 12px !important;
  top: auto !important; right: auto !important;
  opacity: 0.4 !important; z-index: 50 !important;
  font-size: 0.7rem !important;
}
.theme-switch:hover { opacity: 1 !important; }
.theme-label { display: none !important; }
.theme-name { display: none !important; }

/* 4. 精确排盘字段收进可展开的高级设置 */
.advanced-inputs {
  max-width: 680px; margin: 14px auto 0; border: 1px solid var(--line-soft);
  border-radius: 8px; background: rgba(14,22,34,0.24); overflow: hidden;
}
.advanced-inputs summary {
  display: flex; align-items: center; gap: 10px; padding: 10px 14px;
  color: var(--ink-light); cursor: pointer; list-style: none; font-size: 0.78rem;
}
.advanced-inputs summary::-webkit-details-marker { display: none; }
.advanced-inputs summary::after { content: '＋'; margin-left: auto; color: var(--gold); font-weight: 700; }
.advanced-inputs[open] summary::after { content: '−'; }
.advanced-summary-title { font-weight: 700; }
.advanced-summary-hint { color: var(--ink-faint); font-size: 0.72rem; }
.advanced-input-grid {
  display: grid; grid-template-columns: minmax(120px, 0.7fr) minmax(220px, 1.3fr);
  gap: 14px; padding: 14px 16px 8px; border-top: 1px solid var(--line-soft);
}
.advanced-inputs .input-group { min-width: 0; }
.advanced-inputs .input-group input,
.advanced-inputs .input-group select { width: 100% !important; display: block; }
.advanced-input-note { padding: 0 16px 14px; color: var(--ink-faint); font-size: 0.7rem; line-height: 1.7; }
@media (max-width: 560px) {
  .advanced-input-grid { grid-template-columns: 1fr; gap: 10px; }
  .advanced-inputs summary { align-items: flex-start; flex-wrap: wrap; }
  .advanced-summary-hint { flex-basis: 100%; }
}

/* 5. 标题重写样式（让副标题更像价值主张而非文言） */
header .subtitle {
  font-size: 0.84rem !important;
  letter-spacing: 0.15em !important;
  color: var(--ink-light) !important;
  font-family: var(--font-sans) !important;
  font-weight: 400 !important;
}

/* 6. 快捷输入更显眼 */
.quick-input-row { margin-top: 16px !important; }
.quick-input {
  border: 1px solid rgba(199,169,107,0.15) !important;
  background: rgba(14,22,34,0.5) !important;
  padding: 12px 20px !important;
  font-size: 0.84rem !important;
}

/* 7. 整体首屏节奏：更紧凑 */
header { padding: 32px 0 12px !important; }
.intro-hook { padding: 0 0 8px !important; }
.today-glance { margin-bottom: 16px !important; padding: 14px 16px !important; }

/* ===========================================================
   结果首屏：命格卡片视觉强化
   让 title-card + verdict-banner 成为视觉焦点
   =========================================================== */

/* 命格称号卡：全宽大卡 */
.title-card {
  padding: 32px 24px !important;
  margin-bottom: 20px !important;
  text-align: center !important;
  border-radius: 14px !important;
  background: linear-gradient(160deg, rgba(30,43,60,0.8), rgba(14,22,34,0.9)) !important;
  border: 1px solid rgba(199,169,107,0.12) !important;
  position: relative !important; overflow: hidden !important;
}
.tc-name {
  font-size: 1.6rem !important;
  letter-spacing: 0.3em !important;
  margin: 8px 0 !important;
}
.tc-rarity {
  font-size: 0.72rem !important;
  letter-spacing: 0.2em !important;
  padding: 3px 12px !important;
  border-radius: 4px !important;
  display: inline-block !important;
  background: var(--gold-dim) !important;
  color: var(--gold-light) !important;
}
.tc-desc {
  font-size: 0.8rem !important;
  color: var(--ink-light) !important;
  margin-top: 8px !important;
  line-height: 1.6 !important;
}
.tc-glow { display: none !important; }

/* 命局评分横幅：更像一个仪表盘 */
.verdict-banner {
  display: flex !important; align-items: center !important;
  gap: 20px !important; padding: 20px 24px !important;
  border-radius: 10px !important; margin-bottom: 20px !important;
  background: rgba(22,32,46,0.4) !important;
  border: 1px solid rgba(180,200,220,0.06) !important;
}
.verdict-score {
  flex: none !important; text-align: center !important;
  min-width: 72px !important;
}
.verdict-score .vs-num {
  font-size: 2.2rem !important; font-weight: 700 !important;
  color: var(--gold-light) !important; line-height: 1 !important;
}
.verdict-score .vs-label {
  font-size: 0.64rem !important; color: var(--ink-faint) !important;
  display: block !important; margin-top: 4px !important;
}
.verdict-text { flex: 1 !important; }
.verdict-tag {
  font-size: 0.7rem !important; color: var(--gold) !important;
  letter-spacing: 0.1em !important;
}
.verdict-title {
  font-size: 0.92rem !important; color: var(--ink) !important;
  margin: 4px 0 !important; font-weight: 500 !important;
}
.verdict-desc {
  font-size: 0.78rem !important; color: var(--ink-faint) !important;
  line-height: 1.6 !important;
}

/* 三句话总结卡在称号卡之后、其他内容之前 */
.summary-card {
  border-left-color: var(--gold) !important;
  margin-bottom: 28px !important;
}

/* 其余详细内容跟总结卡之间加一个视觉分割 */
.layer-group { margin-top: 8px !important; }
#layerChart .layer-head,
#layerDeep .layer-head {
  padding: 14px 16px !important;
  background: rgba(22,32,46,0.3) !important;
  border-radius: 10px !important;
  margin-bottom: 2px !important;
}

/* 结果区标题和钩子/标签墙之间的间距 */
.result-header { margin-bottom: 16px !important; }
.zhaxin-hook { margin: 16px 0 !important; padding: 16px !important; border-radius: 10px !important; }
.tagwall-slot { margin-bottom: 20px !important; }
.share-bar { margin: 20px 0 !important; padding: 16px !important; border-radius: 10px !important; }

/* ===========================================================
   命格身份证：可截图分享的精美卡片
   =========================================================== */
.fate-id-card {
  max-width: 360px; margin: 20px auto;
  background: linear-gradient(160deg, #1a2536, #0e1622);
  border: 1px solid rgba(199,169,107,0.15);
  border-radius: 14px; padding: 24px 20px;
  position: relative; overflow: hidden;
}
.fate-id-card::before {
  content: ''; position: absolute; top: -30%; right: -20%;
  width: 160px; height: 160px; border-radius: 50%;
  background: radial-gradient(circle, rgba(199,169,107,0.06), transparent 70%);
  pointer-events: none;
}
.fid-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 16px; padding-bottom: 12px;
  border-bottom: 1px solid rgba(199,169,107,0.1);
}
.fid-brand { font-size: 0.64rem; color: var(--ink-faint); letter-spacing: 0.2em; }
.fid-year { font-size: 0.64rem; color: var(--gold); opacity: 0.6; }
.fid-title {
  font-size: 1.4rem; font-weight: 700; color: var(--ink);
  letter-spacing: 0.15em; text-align: center; margin-bottom: 4px;
  font-family: var(--font-serif);
}
.fid-subtitle { font-size: 0.76rem; color: var(--gold); text-align: center; margin-bottom: 16px; letter-spacing: 0.1em; }
.fid-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 16px;
}
.fid-field { padding: 8px 10px; background: rgba(14,22,34,0.5); border-radius: 6px; }
.fid-label { font-size: 0.6rem; color: var(--ink-faint); letter-spacing: 0.1em; margin-bottom: 2px; }
.fid-val { font-size: 0.82rem; color: var(--ink-light); }
.fid-pillars {
  text-align: center; padding: 12px; margin-bottom: 12px;
  background: rgba(14,22,34,0.4); border-radius: 8px;
  font-size: 1.1rem; letter-spacing: 0.4em; color: var(--ink);
  font-family: var(--font-serif);
}
.fid-footer {
  text-align: center; font-size: 0.6rem; color: var(--ink-faint);
  padding-top: 12px; border-top: 1px solid rgba(180,200,220,0.06);
  letter-spacing: 0.1em;
}
.fid-keywords {
  display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; margin-bottom: 12px;
}
.fid-kw {
  font-size: 0.68rem; padding: 3px 8px; border-radius: 4px;
  background: var(--gold-dim); color: var(--gold-light);
}

/* ===== 结果分区标题 ===== */
.group-divider {
  font-size: 0.82rem; color: var(--ink-light); letter-spacing: 0.1em;
  padding: 20px 0 8px; margin-top: 12px;
  border-top: 1px solid rgba(180,200,220,0.06);
}

/* ===== 命格DNA图谱 ===== */
.fate-dna-wrap { text-align: center; padding: 20px 0; margin: 16px 0; }
.fdn-title { font-size: 0.76rem; color: var(--ink-faint); letter-spacing: 0.2em; margin-bottom: 12px; }
.fdn-sub { font-size: 0.66rem; color: var(--ink-faint); margin-top: 8px; opacity: 0.6; }
#fateDnaCanvas { display: block; margin: 0 auto; }

/* ===== 人生时间轴 ===== */
.life-timeline-wrap { margin: 20px 0; padding: 16px 0; }
.lt-title { font-size: 0.76rem; color: var(--ink-faint); letter-spacing: 0.2em; text-align: center; margin-bottom: 12px; }
.lt-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.lt-scroll canvas { display: block; min-width: 600px; height: auto; }
.lt-sub { font-size: 0.64rem; color: var(--ink-faint); text-align: center; margin-top: 8px; opacity: 0.6; }

/* ===== 命运模拟器 ===== */
.fate-sim-wrap { margin: 24px 0; padding: 20px; background: rgba(22,32,46,0.3); border-radius: 10px; border: 1px solid rgba(180,200,220,0.06); }
.fsim-title { font-size: 0.82rem; color: var(--ink-light); text-align: center; letter-spacing: 0.15em; margin-bottom: 4px; }
.fsim-desc { font-size: 0.7rem; color: var(--ink-faint); text-align: center; margin-bottom: 16px; }
.fsim-slider-row { display: flex; align-items: center; gap: 12px; justify-content: center; margin-bottom: 16px; }
.fsim-label { font-size: 0.78rem; color: var(--gold); min-width: 80px; text-align: right; }
.fsim-slider { flex: 1; max-width: 240px; accent-color: var(--gold); }
.fsim-compare { display: flex; gap: 12px; align-items: stretch; }
.fsim-col { flex: 1; padding: 12px; background: rgba(14,22,34,0.4); border-radius: 8px; text-align: center; font-size: 0.8rem; line-height: 1.7; color: var(--ink-light); }
.fsim-col-title { font-size: 0.68rem; color: var(--ink-faint); margin-bottom: 6px; letter-spacing: 0.1em; }
.fsim-vs { display: flex; align-items: center; font-size: 0.72rem; color: var(--ink-faint); font-weight: 700; }
@media (max-width: 480px) { .fsim-compare { flex-direction: column; } .fsim-vs { justify-content: center; padding: 4px 0; } }

/* ===== 每日命运签 ===== */
.daily-fortune-card {
  margin: 16px 0; padding: 20px; text-align: center;
  background: rgba(22,32,46,0.4); border: 1px solid rgba(199,169,107,0.1);
  border-radius: 10px; position: relative;
}
.dfc-header { display: flex; justify-content: space-between; margin-bottom: 12px; font-size: 0.7rem; color: var(--ink-faint); }
.dfc-level { font-weight: 600; }
.dfc-poem {
  font-family: var(--font-serif); font-size: 0.92rem; line-height: 2;
  color: var(--ink); padding: 12px 0; border-top: 1px solid rgba(180,200,220,0.06);
  border-bottom: 1px solid rgba(180,200,220,0.06);
}
.dfc-advice { font-size: 0.8rem; color: var(--gold); margin-top: 12px; }
.dfc-personal { font-size: 0.74rem; color: var(--jade-light); margin-top: 8px; }
.dfc-footer { font-size: 0.62rem; color: var(--ink-faint); margin-top: 12px; opacity: 0.5; }

/* ===== 名人匹配 ===== */
.celeb-match {
  margin: 20px 0; padding: 20px; text-align: center;
  background: rgba(22,32,46,0.35); border: 1px solid rgba(199,169,107,0.08);
  border-radius: 10px;
}
.cm-title { font-size: 0.7rem; color: var(--ink-faint); letter-spacing: 0.2em; margin-bottom: 10px; }
.cm-name { font-size: 1.4rem; font-family: var(--font-serif); color: var(--ink); letter-spacing: 0.2em; }
.cm-subtitle { font-size: 0.8rem; color: var(--gold); margin: 4px 0; }
.cm-gz { font-size: 0.76rem; color: var(--ink-faint); margin: 8px 0; letter-spacing: 0.15em; }
.cm-trait { font-size: 0.8rem; color: var(--ink-light); line-height: 1.6; }
.cm-footer { font-size: 0.62rem; color: var(--ink-faint); margin-top: 12px; opacity: 0.5; }

/* ===== 今日决策助手 ===== */
.decision-card {
  margin: 12px 0; padding: 16px 20px; text-align: center;
  background: rgba(22,32,46,0.3); border: 1px solid rgba(180,200,220,0.06);
  border-radius: 10px;
}
.dc-question { font-size: 0.78rem; color: var(--ink-faint); margin-bottom: 8px; }
.dc-verdict { font-size: 1.3rem; font-weight: 700; margin-bottom: 6px; }
.dc-reason { font-size: 0.8rem; color: var(--ink-light); line-height: 1.6; }
.dc-day { font-size: 0.68rem; color: var(--ink-faint); margin-top: 10px; }

/* ===== 首页改造：隐藏输入面板，展示内容首页 ===== */
/* 默认隐藏输入面板和placeholder */
#inputPanel { display: none; }
#placeholder { display: none !important; }
.cal-toggle { display: none; }
.quick-input-row { display: none; }

/* 展示一个"开始排盘"入口按钮 */
.start-paipan-entry {
  text-align: center; margin: 20px 0;
}
.start-paipan-btn {
  display: inline-block; padding: 14px 36px;
  background: var(--vermilion); color: #fff; border: none;
  border-radius: 8px; font-size: 0.9rem; letter-spacing: 0.2em;
  cursor: pointer; font-family: inherit;
  transition: background 0.15s, transform 0.1s, box-shadow 0.15s;
  box-shadow: 0 2px 8px rgba(199,91,84,0.2);
}
.start-paipan-btn:hover { background: var(--vermilion-light); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(199,91,84,0.3); }
.start-paipan-btn:active { transform: scale(0.98); }

/* 输入面板展开时显示 */
#inputPanel.visible { display: block; animation: fadeSlideDown 0.3s ease; }
.cal-toggle.visible { display: flex; }
.quick-input-row.visible { display: block; }
@keyframes fadeSlideDown { from { opacity:0; transform:translateY(-10px); } to { opacity:1; transform:none; } }

/* 功能入口卡片网格 */
.feature-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px;
  margin: 20px 0;
}
.feature-entry {
  padding: 16px; border-radius: 10px; cursor: pointer;
  background: rgba(22,32,46,0.4); border: 1px solid rgba(180,200,220,0.06);
  transition: border-color 0.15s, transform 0.15s;
  text-align: center;
}
.feature-entry:hover { border-color: rgba(199,169,107,0.2); transform: translateY(-2px); }
.feature-entry .fe-icon { font-size: 1.4rem; margin-bottom: 6px; }
.feature-entry .fe-name { font-size: 0.82rem; color: var(--ink-light); }
.feature-entry .fe-desc { font-size: 0.66rem; color: var(--ink-faint); margin-top: 3px; }
@media (max-width: 400px) { .feature-grid { grid-template-columns: 1fr; } }

/* ===========================================================
   层次感增强：通过深度、间距节奏、视觉分隔建立空间感
   =========================================================== */

/* --- 1. 页面分区带：用不同底色深度区分区域 --- */
.today-glance, #dailyFortuneSlot, .decision-card {
  background: rgba(18,28,42,0.5) !important;
}
.start-paipan-entry {
  padding: 28px 0 !important;
  margin: 24px 0 !important;
  background: rgba(14,22,34,0.3);
  border-radius: 12px;
  border: 1px solid rgba(199,169,107,0.06);
}
.feature-grid {
  padding: 8px !important;
  background: rgba(10,16,26,0.3);
  border-radius: 12px;
}

/* --- 2. 卡片浮层递进（3级高度） --- */
/* 第1层：页面底色 (body background) */
/* 第2层：区块容器 */
.today-glance, .daily-fortune-card, .decision-card, .feature-grid {
  box-shadow: 0 1px 2px rgba(0,0,0,0.08), 0 2px 6px rgba(0,0,0,0.06);
}
/* 第3层：输入面板/结果卡片（最高浮起） */
#inputPanel.visible {
  box-shadow: 0 2px 4px rgba(0,0,0,0.08), 0 8px 24px rgba(0,0,0,0.12), 0 16px 48px rgba(0,0,0,0.08) !important;
}

/* --- 3. 区域之间的呼吸分隔线 --- */
.today-glance::after,
#dailyFortuneSlot::after {
  content: '';
  display: block;
  width: 40px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  margin: 0 auto;
  position: relative; top: 16px;
  opacity: 0.3;
}

/* --- 4. 标题层级对比：大小差异拉开 --- */
header h1 { font-size: 2.4rem !important; margin-bottom: 4px !important; }
header .subtitle { font-size: 0.76rem !important; }
.tg-title { font-size: 0.62rem !important; letter-spacing: 0.4em !important; text-transform: uppercase; }
.dfc-header { font-size: 0.64rem !important; }

/* --- 5. 功能入口卡片层次感 --- */
.feature-entry {
  background: rgba(22,32,46,0.6) !important;
  border: 1px solid rgba(180,200,220,0.05) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1), inset 0 1px 0 rgba(255,255,255,0.02);
}
.feature-entry:hover {
  background: rgba(30,43,60,0.7) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15), inset 0 1px 0 rgba(255,255,255,0.03) !important;
}
.feature-entry .fe-icon { opacity: 0.8; }

/* --- 6. 结果区卡片递进深度 --- */
.summary-card {
  box-shadow: 0 2px 8px rgba(0,0,0,0.1), 0 8px 24px rgba(0,0,0,0.08) !important;
}
.title-card {
  box-shadow: 0 4px 12px rgba(0,0,0,0.12), 0 12px 32px rgba(0,0,0,0.1) !important;
}
.fate-id-card {
  box-shadow: 0 4px 16px rgba(0,0,0,0.15), 0 16px 40px rgba(0,0,0,0.1) !important;
}

/* --- 7. 内容密度节奏：松紧交替 --- */
/* 今日速看(紧凑) → 签文(宽松) → 决策(紧凑) → 按钮(宽松) → 入口(紧凑) */
.today-glance { padding: 12px 14px !important; }
.daily-fortune-card { padding: 24px 20px !important; }
.decision-card { padding: 14px 16px !important; }
.start-paipan-entry { padding: 32px 20px !important; }
.feature-entry { padding: 18px 12px !important; }

/* --- 8. 微妙的顶部渐变边缘 --- */
.container::before {
  content: '';
  position: fixed; top: 0; left: 0; right: 0; height: 80px;
  background: linear-gradient(to bottom, rgba(14,22,34,0.8), transparent);
  pointer-events: none; z-index: 40;
}

/* --- 9. 底部渐隐效果 --- */
.container::after {
  content: '';
  position: fixed; bottom: 0; left: 0; right: 0; height: 60px;
  background: linear-gradient(to top, rgba(14,22,34,0.9), transparent);
  pointer-events: none; z-index: 40;
}
body[data-theme="paper"] .container::before { background: linear-gradient(to bottom, rgba(243,236,217,0.9), transparent); }
body[data-theme="paper"] .container::after { background: linear-gradient(to top, rgba(243,236,217,0.9), transparent); }

/* --- 10. 导航条底部阴影分隔 --- */
.top-nav {
  padding-bottom: 12px !important;
  border-bottom: 1px solid rgba(180,200,220,0.04);
  margin-bottom: 16px !important;
}

/* ===========================================================
   色彩丰富度提升：在保持协调的前提下引入更多色相变化
   =========================================================== */

/* --- 1. 各区块顶部加彩色强调线 --- */
.today-glance { border-top: 2px solid var(--jade) !important; }
.daily-fortune-card { border-top: 2px solid var(--gold) !important; }
.decision-card { border-top: 2px solid var(--vermilion) !important; }
.start-paipan-entry { border-top: 2px solid rgba(199,169,107,0.3) !important; }

/* --- 2. 功能入口卡片各有主题色 --- */
.feature-entry:nth-child(1) { border-top: 2px solid #c77dff; } /* 紫微-紫 */
.feature-entry:nth-child(2) { border-top: 2px solid #7ad7f0; } /* 星座-青 */
.feature-entry:nth-child(3) { border-top: 2px solid #ffd56b; } /* 奇门-金 */
.feature-entry:nth-child(4) { border-top: 2px solid #ff8fb0; } /* 合婚-粉 */
.feature-entry:nth-child(1) .fe-icon { color: #c77dff; }
.feature-entry:nth-child(2) .fe-icon { color: #7ad7f0; }
.feature-entry:nth-child(3) .fe-icon { color: #ffd56b; }
.feature-entry:nth-child(4) .fe-icon { color: #ff8fb0; }

/* --- 3. 今日速看四格各有色彩标识 --- */
.tg-item:nth-child(1) .tg-value { color: var(--jade-light); }    /* 节气-青 */
.tg-item:nth-child(2) .tg-value { color: var(--vermilion-light); } /* 宜忌-红 */
.tg-item:nth-child(3) .tg-value { color: var(--gold-light); }    /* 财神-金 */
.tg-item:nth-child(4) .tg-value { color: #c77dff; }              /* 星宿-紫 */

/* --- 4. 导航激活态用不同色系 --- */
.nav-item[data-view="ziwei"].active { background: #7b42b8 !important; border-color: #9b62d6 !important; }
.nav-item[data-view="zodiac"].active { background: #2980b9 !important; border-color: #5ba8d9 !important; }
.nav-item[data-view="match"].active { background: #c0392b !important; border-color: #e07a6e !important; }
.nav-item[data-view="saved"].active { background: #27ae60 !important; border-color: #58c79a !important; }

/* --- 5. 命运签文等级色彩 --- */
.dfc-poem { color: var(--ink) !important; }
.dfc-advice { 
  background: linear-gradient(90deg, var(--gold-dim), transparent) !important;
  padding: 8px 12px !important; border-radius: 6px !important; margin-top: 14px !important;
  display: inline-block;
}

/* --- 6. 结果区五行色贯穿 --- */
.analysis-card h4::before {
  content: ''; display: inline-block; width: 8px; height: 8px;
  border-radius: 2px; margin-right: 8px; vertical-align: middle;
  background: var(--gold);
}
.strength-panel h4::before {
  content: ''; display: inline-block; width: 8px; height: 8px;
  border-radius: 2px; margin-right: 8px; vertical-align: middle;
  background: var(--jade);
}
.liuqin-panel h4::before {
  content: ''; display: inline-block; width: 8px; height: 8px;
  border-radius: 2px; margin-right: 8px; vertical-align: middle;
  background: var(--vermilion);
}

/* --- 7. 手风琴分区标题带色彩图标 --- */
.group-divider { 
  background: linear-gradient(90deg, rgba(199,169,107,0.04), transparent) !important;
  padding: 12px 16px !important; border-radius: 6px !important;
  margin-top: 16px !important;
}

/* --- 8. 揭盘按钮渐变色（不是纯色） --- */
.start-paipan-btn {
  background: linear-gradient(135deg, var(--vermilion), #d4553c) !important;
}
.start-paipan-btn:hover {
  background: linear-gradient(135deg, var(--vermilion-light), #e8796a) !important;
}

/* --- 9. 背景增加微妙的彩色辉光 --- */
body::before {
  background:
    radial-gradient(ellipse 60% 40% at 50% -5%, rgba(95,180,196,0.1) 0%, transparent 50%),
    radial-gradient(ellipse 40% 30% at 10% 40%, rgba(199,125,255,0.04) 0%, transparent 40%),
    radial-gradient(ellipse 40% 30% at 90% 60%, rgba(255,143,176,0.03) 0%, transparent 40%),
    radial-gradient(ellipse at 50% 80%, rgba(199,169,107,0.05) 0%, transparent 40%),
    radial-gradient(circle at 50% 50%, var(--bg-core1) 0%, var(--bg-core2) 70%) !important;
}

/* --- 10. 暖宣纸主题适配 --- */
body[data-theme="paper"] .feature-entry:nth-child(1) { border-top-color: #7b42b8; }
body[data-theme="paper"] .feature-entry:nth-child(2) { border-top-color: #2980b9; }
body[data-theme="paper"] .feature-entry:nth-child(3) { border-top-color: #c8923c; }
body[data-theme="paper"] .feature-entry:nth-child(4) { border-top-color: #c0392b; }
body[data-theme="paper"] .today-glance { border-top-color: #3a8a6a !important; }
body[data-theme="paper"] .daily-fortune-card { border-top-color: #9a7a30 !important; }
body[data-theme="paper"] .decision-card { border-top-color: #b5302a !important; }

/* ===========================================================
   白天/黑夜模式：根据系统偏好自动切换 + 手动切换
   黑夜 = 当前默认黛蓝主题
   白天 = 新增亮色模式（比暖宣纸更现代）
   =========================================================== */

/* --- 白天模式变量 --- */
body[data-theme="day"] {
  --paper: #f8f9fc;
  --paper-dark: #ffffff;
  --paper-darker: #f0f2f5;
  --ink: #1a1d26;
  --ink-light: #3d4352;
  --ink-faint: #8590a0;
  --vermilion: #d4473c;
  --vermilion-light: #e86558;
  --vermilion-dim: rgba(212,71,60,0.08);
  --gold: #b8860b;
  --gold-light: #d4a017;
  --gold-dim: rgba(184,134,11,0.08);
  --jade: #1a936f;
  --jade-light: #2ab090;
  --jade-dim: rgba(26,147,111,0.08);
  --line: rgba(0,0,0,0.08);
  --line-soft: rgba(0,0,0,0.04);
  --mu-color: #2d8a4e;
  --huo-color: #d4473c;
  --tu-color: #b8860b;
  --jin-color: #5a6578;
  --shui-color: #2b6cb0;
  --panel-bg: linear-gradient(160deg, #ffffff, #f8f9fc);
  --input-bg: #ffffff;
  --title-bg: linear-gradient(160deg, #ffffff, #f5f6f8);
  --bg-core1: #f0f2f5;
  --bg-core2: #f8f9fc;
  --bg-glow1: rgba(26,147,111,0.04);
  --bg-glow2: rgba(184,134,11,0.03);
  --bg-glow3: rgba(43,108,176,0.03);
}