/* ==========================================================================
   八字页 · 墨金宣纸视觉层（bazi-premium.css）
   依赖 premium-base.css（共用字体/色票/题头/动效）。只负责外观与动效，
   不改任何排盘/分析逻辑。删除 bazi.html 里引用 premium-base.css、
   bazi-premium.css、premium-base.js、bazi-premium.js 的几行即可回到原样式。
   ========================================================================== */
:root{
  /* 覆盖原有主题变量 */
  --bg:var(--pm-paper);
  --card:var(--pm-card);
  --soft:var(--pm-card-2);
  --ink:var(--pm-text);
  --muted:var(--pm-muted);
  --line:var(--pm-line);
  --gold:var(--pm-gold-deep);
  --gold-soft:#f4ead7;
  --black:var(--pm-ink);
  --red:var(--pm-cinnabar);
  --green:#2f6b52;
  --wood:#3b7656;
  --fire:#b0392c;
  --earth:#93652a;
  --metal:#a07c2c;
  --water:#2c5b84;
  --motion-ease:var(--pm-ease);
}

/* ---------- 排盘 / 记录切换 ---------- */
.home-tabs{border-bottom:1px solid var(--pm-line)}
.home-tabs button{font-family:var(--pm-serif);font-size:16px;letter-spacing:.1em;color:var(--pm-muted);transition:color .3s var(--pm-ease)}
.home-tabs button:hover{color:var(--pm-ink)}
.home-tabs button::after{
  content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--pm-gold),var(--pm-cinnabar));
  transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--pm-ease);
}
.home-tabs button.active{color:var(--pm-ink)}
.home-tabs button.active::after{background:linear-gradient(90deg,var(--pm-gold),var(--pm-cinnabar));transform:scaleX(1)}

/* ---------- 通用卡片 ---------- */
.entry-card,.result-card{
  position:relative;
  background:linear-gradient(180deg,rgba(255,253,248,.97),rgba(252,248,240,.94));
  border:1px solid var(--pm-line);
  border-radius:var(--pm-radius);
  box-shadow:var(--pm-shadow);
}
.entry-card::before,.result-card::before{
  content:"";position:absolute;top:-1px;left:28px;right:28px;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(176,138,70,.55),transparent);
}
.entry-card summary{font-family:var(--pm-serif);font-size:20px;letter-spacing:.12em;color:var(--pm-ink)}
.entry-card summary::after,.structure-deep>summary::after{color:var(--pm-gold-deep);letter-spacing:.1em}
.section-title{
  display:flex;align-items:center;gap:10px;
  font-family:var(--pm-serif);
  color:var(--pm-ink);
  letter-spacing:.12em;
  font-size:17px;
}
.section-title::before{
  content:"";flex:0 0 auto;
  width:7px;height:7px;
  background:var(--pm-cinnabar);
  transform:rotate(45deg);
  box-shadow:0 0 0 3px rgba(168,53,42,.1);
}
.basic-dashboard>.section-title{display:none}

/* ---------- 出生信息表单 ---------- */
.field>label{color:var(--pm-muted);letter-spacing:.08em}
.field input[type=text],.display-field,.editor-panel input,.editor-panel select,.ai-controls textarea,.ai-controls select,.ai-followup textarea,.history-toolbar input,.history-toolbar select,.custom-row input{
  background:#fffefb;
  border:1px solid var(--pm-line-strong);
  border-radius:10px;
  color:var(--pm-ink);
  transition:border-color .25s var(--pm-ease),box-shadow .25s var(--pm-ease),background-color .25s var(--pm-ease);
}
.field input:focus,.display-field:focus,.editor-panel input:focus,.editor-panel select:focus,.ai-controls textarea:focus,.ai-controls select:focus,.ai-followup textarea:focus,.history-toolbar input:focus,.custom-row input:focus{
  border-color:var(--pm-gold);
  box-shadow:0 0 0 4px rgba(176,138,70,.14);
}
.display-field:hover{border-color:var(--pm-gold);background:#fffaf0}
.display-field::after{color:var(--pm-gold-deep);letter-spacing:.1em}
.segmented label{border-color:var(--pm-line-strong);border-radius:10px;background:#fffefb;transition:border-color .25s var(--pm-ease),background-color .25s var(--pm-ease),transform .2s var(--pm-ease)}
.segmented label:hover{border-color:var(--pm-gold)}
.segmented label:has(input:checked){border-color:var(--pm-gold);background:linear-gradient(180deg,#fbf2df,#f6e9cf);color:var(--pm-ink)}
.segmented input,.options input{accent-color:var(--pm-gold-deep)}
.editor-panel{background:rgba(176,138,70,.05);border:1px solid var(--pm-line);border-radius:12px}
.location-option{background:#fffefb;border-color:var(--pm-line);border-radius:10px;transition:border-color .25s var(--pm-ease),background-color .25s var(--pm-ease),transform .25s var(--pm-ease)}
.location-option:hover{background:#fff8ea;border-color:var(--pm-gold)}
.location-option span{color:var(--pm-muted)}
.custom-location{border-top-color:var(--pm-line-strong)}
.custom-title{color:var(--pm-gold-deep)}
.solar-preview{
  background:linear-gradient(90deg,rgba(176,138,70,.09),rgba(176,138,70,.02));
  border-left:2px solid var(--pm-gold);
  border-radius:0 10px 10px 0;
  color:var(--pm-muted);
}
.solar-preview b{color:var(--pm-ink)}
.build-btn,.primary-small{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:linear-gradient(135deg,#2a241c 0%,#16130f 100%);
  border:1px solid rgba(220,192,138,.32);
  color:#f3e2b8;
  box-shadow:0 16px 30px -18px rgba(20,14,6,.7),inset 0 1px 0 rgba(255,236,196,.1);
  transition:transform .25s var(--pm-ease),box-shadow .35s var(--pm-ease),background-color .25s;
}
.build-btn{border-radius:12px;font-family:var(--pm-serif);font-size:17px;letter-spacing:.42em;min-height:54px}
.build-btn::after,.primary-small::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(105deg,transparent 35%,rgba(255,233,186,.22) 50%,transparent 65%);
  transform:translateX(-120%);
  transition:transform .9s var(--pm-ease);
}
.build-btn:hover,.primary-small:hover{background:linear-gradient(135deg,#322a20 0%,#1a1611 100%);box-shadow:0 20px 34px -18px rgba(20,14,6,.75),inset 0 1px 0 rgba(255,236,196,.14);transform:translateY(-1px)}
.build-btn:hover::after,.primary-small:hover::after{transform:translateX(120%)}
.build-btn:active,.primary-small:active{transform:translateY(0) scale(.985)}
.entry-guide{border-left-color:var(--pm-line)}
.entry-guide h2{font-family:var(--pm-serif);letter-spacing:.14em;color:var(--pm-ink)}
.entry-guide li::before{
  width:22px;height:22px;line-height:20px;
  border:1px solid rgba(176,138,70,.5);border-radius:50%;
  color:var(--pm-gold-deep);font-family:var(--pm-serif);font-size:12px;
  background:rgba(255,253,248,.8);
}
.entry-guide b{font-family:var(--pm-serif);letter-spacing:.06em}
.entry-guide .guide-footnote{border-top-color:var(--pm-line)}

/* ---------- 命盘结果 ---------- */
.result-heading h2{font-family:var(--pm-serif);font-size:30px;letter-spacing:.08em;color:var(--pm-ink)}
.result-heading p{letter-spacing:.04em}
.result-actions button,.small-action,.secondary,.quick-ai button,.history-actions button,.history-toolbar button,.ai-history-tools button,.turn-delete,.turn-toggle,.custom-row button{
  background:#fffdf8;
  border:1px solid var(--pm-line-strong);
  color:var(--pm-ink);
  transition:border-color .25s var(--pm-ease),background-color .25s var(--pm-ease),color .25s,transform .25s var(--pm-ease),box-shadow .3s var(--pm-ease);
}
.result-actions button{border-radius:999px;padding:0 20px;letter-spacing:.06em}
.result-actions button:hover,.small-action:hover,.secondary:hover,.quick-ai button:hover,.history-actions button:hover,.history-toolbar button:hover,.ai-history-tools button:hover,.turn-delete:hover,.custom-row button:hover{
  border-color:var(--pm-gold);background:#fff7e8;transform:translateY(-1px);box-shadow:0 8px 18px -12px rgba(110,84,44,.45);
}
.quick-ai button,.small-action{border-radius:999px}

/* 标签栏：毛玻璃 + 滑动墨块 */
.bazi-tabs{
  background:rgba(246,240,229,.78);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);
  backdrop-filter:blur(14px) saturate(1.3);
  border:1px solid var(--pm-line);
  border-radius:14px;
  box-shadow:0 10px 30px -22px rgba(64,44,14,.45);
}
.bazi-tabs button{position:relative;z-index:1;border-radius:10px;color:var(--pm-muted);letter-spacing:.08em;transition:color .35s var(--pm-ease),background-color .35s var(--pm-ease)}
.bazi-tabs button:hover{color:var(--pm-ink)}
.bazi-tabs button.active{background:linear-gradient(135deg,#29231b,#17140f);color:#f3e2b8;box-shadow:0 8px 18px -12px rgba(20,14,6,.7)}
.bazi-tabs.pm-has-ink button.active{background:transparent;box-shadow:none}
.pm-tab-ink{
  position:absolute;top:0;left:0;z-index:0;
  border-radius:10px;
  background:linear-gradient(135deg,#29231b,#17140f);
  box-shadow:0 8px 18px -12px rgba(20,14,6,.7),inset 0 0 0 1px rgba(220,192,138,.22);
  pointer-events:none;
  opacity:0;
}
.pm-tab-ink.pm-ready{transition:transform .5s var(--pm-ease),width .5s var(--pm-ease),opacity .3s}

/* 命盘摘要：墨底金字 */
.core-cards{
  position:relative;
  overflow:hidden;
  padding:24px 0;
  border:1px solid rgba(220,192,138,.18);
  border-radius:18px;
  background:
    radial-gradient(420px 220px at 92% 0%,rgba(201,163,95,.18),transparent 70%),
    radial-gradient(360px 200px at 0% 100%,rgba(168,53,42,.14),transparent 70%),
    linear-gradient(160deg,#211c16 0%,#15120e 100%);
  box-shadow:0 26px 50px -30px rgba(20,14,6,.65);
}
.core-card{border-right:1px solid rgba(220,192,138,.13);padding:4px 24px}
.core-card:first-child{padding-left:24px}
.core-card:last-child{padding-right:24px}
.core-card span{color:rgba(220,192,138,.78);letter-spacing:.24em;font-size:11px}
.core-card strong{font-family:var(--pm-serif);color:var(--pm-on-ink);font-size:30px;letter-spacing:.06em}
.core-card em{color:var(--pm-on-ink-muted)}
.core-context summary{color:var(--pm-gold-light)}
.core-context em{color:rgba(242,232,212,.72)}
.pillar-stack b{font-family:var(--pm-serif);font-size:26px;font-weight:600}
.pillar-stack small{color:rgba(220,192,138,.7);letter-spacing:.1em}
.core-cards .wx-木{color:#8fc7a2}.core-cards .wx-火{color:#ee8c74}.core-cards .wx-土{color:#ddb47c}.core-cards .wx-金{color:#efd38d}.core-cards .wx-水{color:#93b9de}

/* 四柱表 */
.pillar-table th{background:transparent;color:var(--pm-muted);font-weight:500;letter-spacing:.08em}
.pillar-table tr:first-child th{border-bottom:1px solid rgba(176,138,70,.35);color:var(--pm-ink);font-family:var(--pm-serif);font-size:14px}
.pillar-table th,.pillar-table td{border-color:rgba(110,84,44,.1)}
.pillar-table .row-label{color:var(--pm-faint);font-size:12px}
.pillar-table tr:nth-child(3) td,.pillar-table tr:nth-child(4) td{background:rgba(176,138,70,.045)}
.pillar-table td.pm-day-col,.pillar-table th.pm-day-col{background:rgba(168,53,42,.04)}
.pillar-table tr:nth-child(3) td.pm-day-col,.pillar-table tr:nth-child(4) td.pm-day-col{background:rgba(168,53,42,.07)}
.pillar-table tr:first-child th.pm-day-col{color:var(--pm-cinnabar)}
.pillar-table small{color:var(--pm-gold-deep)}
.stem,.branch{font-family:var(--pm-serif);font-weight:600;font-size:42px;line-height:1.15}
.pillar-table td{transition:background-color .3s var(--pm-ease)}

/* 五行力量条 */
.wx-row>span{font-family:var(--pm-serif);font-weight:600;font-size:15px}
.wx-row div{height:6px;background:rgba(110,84,44,.09)}
.wx-row i{background:linear-gradient(90deg,var(--pm-gold-light),var(--pm-gold));transform-origin:left center}
.wx-row:has(.wx-木) i{background:linear-gradient(90deg,#9cc8aa,var(--wood))}
.wx-row:has(.wx-火) i{background:linear-gradient(90deg,#eba08e,var(--fire))}
.wx-row:has(.wx-土) i{background:linear-gradient(90deg,#e0c08f,var(--earth))}
.wx-row:has(.wx-金) i{background:linear-gradient(90deg,#ecd8a2,var(--metal))}
.wx-row:has(.wx-水) i{background:linear-gradient(90deg,#9fbedc,var(--water))}
.wx-row em{font-variant-numeric:tabular-nums}

.note-line{border-bottom:1px dashed var(--pm-line-strong)}
.detail-box{border-top:1px solid var(--pm-line)}
.detail-box strong,.detail-box-heading strong,.analysis-box strong,.summary-panel h3{font-family:var(--pm-serif);letter-spacing:.06em;color:var(--pm-ink)}
.structure-deep{border-top-color:var(--pm-line)}
.structure-deep>summary{color:var(--pm-gold-deep);font-family:var(--pm-serif);letter-spacing:.08em}
.display-mode{background:rgba(110,84,44,.06);border:1px solid var(--pm-line);border-radius:999px}
.display-mode button{border-radius:999px;transition:color .3s,background-color .3s}
.display-mode button.active{background:linear-gradient(135deg,#29231b,#17140f);color:#f3e2b8}
.info-grid div,.analysis-box,.luck-outlook-item{background:#fffdf8;border:1px solid var(--pm-line);border-radius:12px}
.info-grid b{color:var(--pm-gold-deep);letter-spacing:.1em}
.info-grid span{color:var(--pm-text)}
.tag,.reasoning-chain span{background:rgba(176,138,70,.08);border:1px solid rgba(176,138,70,.26);border-radius:999px;color:#5e4a28}
.guide-item,.reading-guide{background:#fffaf0;border-color:var(--pm-line)}
.reading-guide h3,.guide-item b,.reading-guide strong{color:var(--pm-cinnabar)}
.summary-panel{background:transparent}
.explain-help-button{border-color:rgba(176,138,70,.55);background:#fffdf8;color:var(--pm-gold-deep);transition:background-color .2s,color .2s}
.explain-help-button:hover{background:var(--pm-gold-deep);color:#fff}
.explain-help-popover{background:#fffdf8;border:1px solid var(--pm-line-strong);border-radius:12px;box-shadow:0 26px 50px -24px rgba(40,28,10,.38);color:var(--pm-text)}
.explain-help-popover b{color:var(--pm-cinnabar);font-family:var(--pm-serif)}
.classical-pattern-note{border-top-color:var(--pm-line);color:var(--pm-muted)}

/* ---------- 大运流年 ---------- */
.luck-origin,.luck-selector,.luck-detail-panel{background:rgba(255,253,248,.7);border:1px solid var(--pm-line);border-radius:14px}
.luck-block-title{
  background:linear-gradient(90deg,rgba(176,138,70,.12),rgba(176,138,70,0) 70%);
  border-bottom:1px solid var(--pm-line);
  color:var(--pm-ink);
  font-family:var(--pm-serif);
  letter-spacing:.12em;
}
.luck-block-title span{font-family:var(--pm-sans);letter-spacing:.04em;color:var(--pm-muted)}
.origin-strip,.fortune-row{border-top-color:var(--pm-line)}
.origin-col{border-right-color:var(--pm-line)}
.origin-col small{color:var(--pm-muted);letter-spacing:.06em}
.origin-col .origin-gz b,.fortune-pillar b{font-family:var(--pm-serif);font-weight:600}
.fortune-row h4{display:flex;align-items:center;gap:8px;color:var(--pm-cinnabar);font-family:var(--pm-serif);letter-spacing:.2em}
.fortune-row h4::before{content:"";width:14px;height:1px;background:currentColor;opacity:.6}
.fortune-scroll{scrollbar-width:thin;scrollbar-color:rgba(138,106,47,.35) transparent}
.fortune-item{
  background:#fffdf8;
  border:1px solid var(--pm-line);
  border-radius:12px;
  transition:transform .3s var(--pm-ease),border-color .3s var(--pm-ease),box-shadow .35s var(--pm-ease),background-color .3s;
}
.fortune-item:hover{border-color:rgba(176,138,70,.6);transform:translateY(-2px);box-shadow:0 12px 22px -16px rgba(64,44,14,.45)}
.fortune-item:active{transform:translateY(0) scale(.97)}
.fortune-item.active{
  background:linear-gradient(165deg,#28221a,#15120e);
  border-color:#15120e;
  color:var(--pm-on-ink);
  box-shadow:0 14px 26px -16px rgba(20,14,6,.7),inset 0 0 0 1px rgba(220,192,138,.28);
}
.fortune-item.active .fortune-label{color:#f1dcab}
.fortune-item.active .fortune-meta,.fortune-item.active .fortune-pillar small{color:rgba(242,232,212,.62)}
.fortune-item.active .wx-木{color:#8fc7a2}.fortune-item.active .wx-火{color:#ee8c74}.fortune-item.active .wx-土{color:#ddb47c}.fortune-item.active .wx-金{color:#efd38d}.fortune-item.active .wx-水{color:#93b9de}
.outlook-tag,.fortune-outcome{border-radius:999px}
.outlook-tag{padding:1px 9px;letter-spacing:.04em}
.outlook-positive{color:#2f6b4f;background:rgba(47,107,79,.08)}
.outlook-negative{color:#a8352a;background:rgba(168,53,42,.07)}
.outlook-mixed{color:#8a6a2f;background:rgba(176,138,70,.1)}
.outlook-neutral,.outlook-pending,.outlook-unavailable{color:#6f655a;background:rgba(110,84,44,.06)}
.outlook-details>summary,.outlook-note>summary,.phenomenon-detail>summary{color:var(--pm-gold-deep);transition:color .2s}
.outlook-details>summary:hover{color:var(--pm-cinnabar)}

/* ---------- AI 与记录 ---------- */
.ai-result,.ai-turn-answer{color:var(--pm-text)}
.ai-result{border-top:1px dashed var(--pm-line-strong)}
.ai-turn{background:#fffdf8;border:1px solid var(--pm-line);border-radius:14px}
.ai-turn-question{background:linear-gradient(90deg,rgba(176,138,70,.11),rgba(176,138,70,0) 80%);border-bottom:1px solid var(--pm-line);color:var(--pm-ink)}
.ai-turn-question b{background:var(--pm-cinnabar)}
.turn-toggle{color:var(--pm-gold-deep)}
.fact-check{background:rgba(176,138,70,.06);border-bottom-color:var(--pm-line)}
.ai-pending{border:1px dashed rgba(176,138,70,.55);background:rgba(176,138,70,.06);color:var(--pm-gold-deep)}
.ai-pending:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--pm-gold);box-shadow:0 0 0 0 rgba(176,138,70,.5);animation:pm-pulse 1.4s var(--pm-ease-soft) infinite}
.history-item{background:#fffdf8;border:1px solid var(--pm-line);border-radius:12px;transition:border-color .25s var(--pm-ease),transform .25s var(--pm-ease),box-shadow .3s var(--pm-ease)}
.history-item:hover{border-color:rgba(176,138,70,.55);transform:translateY(-1px);box-shadow:0 12px 22px -18px rgba(64,44,14,.45)}
.history-main{font-family:var(--pm-serif);letter-spacing:.04em}
.page-footer{border-top-color:var(--pm-line);color:var(--pm-faint);letter-spacing:.06em}
.page-footer span:first-child{font-family:var(--pm-serif)}

@media (prefers-reduced-motion:no-preference){
  .life-note{animation:pm-rise .9s var(--pm-ease) .22s both}
  .home-tabs{animation:pm-rise .8s var(--pm-ease) .28s both}
  .home-panel.active{animation:pm-rise .8s var(--pm-ease) .34s both}
  .bazi-view.active{animation:pm-rise .5s var(--pm-ease) both}
  .wx-row i{animation:pm-bar 1.2s var(--pm-ease) both}
  .wx-row:nth-child(2) i{animation-delay:.08s}.wx-row:nth-child(3) i{animation-delay:.16s}.wx-row:nth-child(4) i{animation-delay:.24s}.wx-row:nth-child(5) i{animation-delay:.32s}
  details[open]>:not(summary){animation:pm-fade .45s var(--pm-ease) both}
  details.ai-turn[open]>:not(summary){animation:none}
}

/* ---------- 响应式（与原有断点对齐） ---------- */
@media (max-width:800px){
  .core-card{padding:4px 18px}
  .core-card:nth-child(2){padding-right:18px}
  .core-card:nth-child(3){padding-left:18px}
  .core-card:nth-child(odd){padding-left:18px}
  .stem,.branch{font-size:34px}
  .bazi-tabs{border-radius:12px}
}
@media (max-width:520px){
  .pillar-table tr:first-child th{font-family:var(--pm-sans);font-size:12px;letter-spacing:0}
  .pillar-table .row-label{font-size:11px;letter-spacing:0}
  .home-tabs button{font-size:15px}
  .core-cards{padding:18px 0;border-radius:16px}
  .core-card{padding:2px 14px}
  .core-card:nth-child(odd){padding-left:14px}
  .core-card:nth-child(2),.core-card:nth-child(4){padding-right:14px}
  .core-card strong{font-size:22px}
  .core-card span{letter-spacing:.16em}
  .pillar-stack b{font-size:22px}
  .stem,.branch{font-size:24px}
  .result-heading h2{font-size:22px}
  .entry-card::before,.result-card::before{left:16px;right:16px}
  .build-btn{letter-spacing:.3em}
  .bazi-tabs button{letter-spacing:.02em}
  .fortune-item:hover{transform:none;box-shadow:none}
}
@media (hover:none){
  .fortune-item:hover,.history-item:hover,.result-actions button:hover,.build-btn:hover,.primary-small:hover{transform:none}
}