/* ============================================================
   玄学工具箱 · 站点级增强样式
   - 统一全站卡片、输入、按钮、入口与移动端排版
   - 轻量覆盖各模块内联样式，减少杂乱功能感
   ============================================================ */

:root{
  --xz-radius:18px;
  --xz-radius-sm:12px;
  --xz-line:rgba(212,168,76,.20);
  --xz-line-strong:rgba(212,168,76,.42);
  --xz-card:rgba(255,244,214,.055);
  --xz-card-2:rgba(255,255,255,.018);
  --xz-gold:#d4a84c;
  --xz-gold-soft:#e8cd8a;
  --xz-gold-bright:#f4e3b2;
  --xz-paper:#efe6d2;
  --xz-muted:#9a8f78;
  --xz-shadow:0 18px 46px rgba(0,0,0,.36);
  /* 排盘结果排版增强用 token */
  --xz-serif:"Songti SC","Noto Serif CJK SC","Source Han Serif SC","SimSun","STSong",serif;
  --xz-read:#ece1c9;                  /* 命理读文正文（比 paper 略暖亮，长文更省眼） */
  --xz-label:#8d8268;                 /* 数据条目标签色 */
  --xz-rule:rgba(212,168,76,.20);     /* 发丝分隔线 */
  --xz-rule-soft:rgba(212,168,76,.10);
  --xz-good:#74b982;
  --xz-bad:#d26b5d;
  --xz-blue:#7aa7d9;
}

::selection { background: rgba(212, 168, 76, .30); color: #fff5da; }
::-moz-selection { background: rgba(212, 168, 76, .30); color: #fff5da; }

html{scroll-behavior:smooth}
* { scrollbar-width: thin; scrollbar-color: rgba(212,168,76,.34) transparent; }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(212,168,76,.42), rgba(212,168,76,.20));
  border-radius: 9px; border: 2px solid transparent; background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover { background: rgba(212,168,76,.6); background-clip: padding-box; }

body{letter-spacing:.01em}
body > #app.app-shell, body > main#app, .shell{
  width:min(100%, 720px) !important;
  max-width:720px !important;
  padding-left:max(16px, env(safe-area-inset-left)) !important;
  padding-right:max(16px, env(safe-area-inset-right)) !important;
}

.card,.today,.ref,.entry,.result-tabs,.primary-gua,.gua-card,.qm-cell,.hf-main,.hf-del,.door-item,.dir-list div,.detail-lines div,.rel-row,.ty-card,.guide-card{
  border-color:var(--xz-line) !important;
  border-radius:var(--xz-radius) !important;
  background:linear-gradient(155deg,var(--xz-card),var(--xz-card-2) 72%) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.035) inset;
}
.card,.today,.result-card{box-shadow:var(--xz-shadow),0 1px 0 rgba(255,255,255,.04) inset}

.topbar{position:sticky;top:0;z-index:20;margin:0 -6px 4px;padding:10px 6px 8px !important;background:linear-gradient(180deg,rgba(16,13,10,.94),rgba(16,13,10,.72) 72%,transparent);backdrop-filter:blur(12px)}
.back,.ghost,.solid,.cast-btn,.seg-btn,.rt-btn,.tg-chip,.dong-chip,.hm-item,.hf-main,.hf-del,.extra-toggle,.link-btn{touch-action:manipulation}
.fld input,.num-grid input,input[type="text"],input[type="number"],input[type="date"],input[type="datetime-local"],input[type="time"],input[type="search"]{
  min-height:46px !important;border-radius:var(--xz-radius-sm) !important;border-color:var(--xz-line) !important;background:rgba(0,0,0,.24) !important;
}
input[type="date"],input[type="datetime-local"],input[type="time"]{
  color-scheme:dark; position:relative; padding-right:12px !important;
  border:1px solid var(--xz-line) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 8px 20px rgba(0,0,0,.12);
  transition:border-color .22s ease,box-shadow .22s ease,background .22s ease;
}
input[type="date"]:focus,input[type="datetime-local"]:focus,input[type="time"]:focus{
  border-color:var(--xz-line-strong) !important;
  box-shadow:0 0 0 3px rgba(212,168,76,.12),inset 0 1px 0 rgba(255,255,255,.06);
  outline:none;
}
input[type="date"]::-webkit-calendar-picker-indicator,input[type="datetime-local"]::-webkit-calendar-picker-indicator,input[type="time"]::-webkit-calendar-picker-indicator{
  opacity:.88; cursor:pointer; filter:sepia(1) saturate(1.8) hue-rotate(350deg) brightness(1.05);
}
.xz-time-tools{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px;justify-content:flex-end}
.xz-time-tools button{
  min-height:30px;padding:0 10px;border-radius:999px;border:1px solid rgba(212,168,76,.26);
  background:rgba(255,244,214,.045);color:var(--xz-gold-soft);font-size:12px;letter-spacing:.04em;
  touch-action:manipulation;
}
.xz-time-tools button:active{transform:scale(.97)}
.xz-time-tools .xz-time-primary{border-color:rgba(212,168,76,.46);background:rgba(212,168,76,.14)}
.xz-time-field{position:relative}
.cast-btn,.solid{border-radius:14px !important;box-shadow:0 10px 28px rgba(212,168,76,.24),inset 0 1px 0 rgba(255,255,255,.36) !important}
.ghost{border-radius:12px !important;background:rgba(255,244,214,.045) !important}

.meta-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
/* 操作按钮：随盘面内容排布的行内按钮（与六爻排盘一致），不再悬浮遮挡结果 */
.result-actions{position:static !important;bottom:auto !important;z-index:auto;margin:16px 0 2px !important;padding:0 !important;background:none !important;backdrop-filter:none !important}
.result-actions .ghost,.result-actions .solid{min-height:46px;display:flex;align-items:center;justify-content:center}
.hint,.note,.foot-note{color:var(--xz-muted) !important}
.sec-h{margin-top:14px !important}
.narrative p{line-height:1.85 !important}
.xz-query-show{
  margin:12px 0 4px;padding:12px 14px;border-radius:16px;border:1px solid rgba(212,168,76,.42);
  background:linear-gradient(135deg,rgba(212,168,76,.18),rgba(255,244,214,.055));
  color:var(--xz-gold-soft);font-family:"Songti SC","Noto Serif CJK SC",serif;font-size:18px;font-weight:800;line-height:1.7;
  letter-spacing:.06em;box-shadow:0 10px 26px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.06);
}
.xz-query-show span{display:inline-block;margin-right:16px;color:#fff2c7;text-shadow:0 0 14px rgba(212,168,76,.22)}
.xz-query-show b{color:var(--xz-gold-soft);font-weight:900}
@media (max-width:520px){.xz-query-show{font-size:17px;padding:11px 12px}.xz-query-show span{display:block;margin-right:0;margin-bottom:2px}}

/* 大胆瘦身：移除低频辅助区，只保留核心录入、排盘、解析、复制 */
.hist-mini,details.ref,.foot-note,.extra-toggle,.gua-pair,[data-act="sample"]{display:none !important}
.card > .hint,.panel > .hint,.random-panel > .hint{display:none !important}
.row-btns:empty{display:none !important}
.row-btns{margin-bottom:4px !important}
.result-tabs{margin-top:2px !important}

@media (min-width:680px){.entries{grid-template-columns:repeat(3,1fr) !important}.entry.feature{grid-column:1 / -1}.qm-grid{min-width:0 !important}}
@media (max-width:520px){
  body > #app.app-shell, body > main#app, .shell{padding-left:14px !important;padding-right:14px !important}
  .entries{grid-template-columns:1fr 1fr !important;gap:10px !important}
  .entry{padding:16px 10px 14px !important;gap:8px !important}
  .entry.feature{min-height:auto !important;padding:18px 14px !important}
  .entry-mark{width:46px !important;height:46px !important;font-size:21px !important}
  .entry-title{font-size:17px !important;letter-spacing:2px !important;text-indent:2px !important}
  .entry-desc{font-size:10.5px !important;line-height:1.55 !important}
  .meta-grid{grid-template-columns:1fr !important}
  .result-actions{grid-template-columns:1fr 1fr !important}
  .gua-trio,.guidance-grid{grid-template-columns:1fr !important}
}
@media (max-width:390px){.entries{grid-template-columns:1fr !important}.result-actions{grid-template-columns:1fr !important}.hero-title{font-size:36px !important}}

/* 轻量提示气泡（复制摘要等） */
.xz-toast{
  position:fixed;left:50%;bottom:max(26px,env(safe-area-inset-bottom));z-index:10000;transform:translate(-50%,12px);
  padding:9px 14px;border-radius:999px;border:1px solid rgba(212,168,76,.34);background:rgba(18,15,11,.88);
  color:var(--xz-gold-soft);box-shadow:0 12px 32px rgba(0,0,0,.42);opacity:0;pointer-events:none;transition:opacity .22s ease,transform .22s ease;
  backdrop-filter:blur(10px);font-size:13px;
}
.xz-toast.show{opacity:1;transform:translate(-50%,0)}
@media print{.xz-fab,.xz-time-tools,.topbar,.xp-top{display:none !important}body{background:#fff !important;color:#111 !important}}

/* 悬浮操作区：固定左下，附加到 <body>，#app 重渲染不受影响 */
.xz-fab {
  position: fixed;
  left: max(14px, env(safe-area-inset-left));
  bottom: max(18px, env(safe-area-inset-bottom));
  z-index: 9998;
  display: flex; flex-direction: column; gap: 10px;
  pointer-events: none;
}
.xz-fab button {
  pointer-events: auto;
  -webkit-appearance: none; appearance: none;
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; cursor: pointer; color: #f1e2bb;
  font-family: "Songti SC", "Noto Serif CJK SC", "Source Han Serif SC", serif;
  font-size: 18px; line-height: 1;
  border: 1px solid rgba(212,168,76,.42);
  background:
    radial-gradient(circle at 34% 28%, rgba(212,168,76,.22), rgba(20,16,12,0) 70%),
    rgba(18,15,11,.74);
  backdrop-filter: blur(10px) saturate(120%);
  -webkit-backdrop-filter: blur(10px) saturate(120%);
  box-shadow: 0 10px 26px rgba(0,0,0,.46), inset 0 0 0 1px rgba(212,168,76,.10);
  transition: transform .26s cubic-bezier(.2,.7,.2,1), border-color .26s ease, opacity .3s ease, box-shadow .26s ease;
}
.xz-fab button:hover {
  transform: translateY(-3px); border-color: rgba(212,168,76,.7);
  box-shadow: 0 16px 34px rgba(0,0,0,.55), inset 0 0 0 1px rgba(212,168,76,.18);
}
.xz-fab button:active { transform: translateY(-1px) scale(.96); }
.xz-fab .xz-home { font-size: 20px; }

/* 返回顶部：默认隐藏，滚动后淡入 */
.xz-fab .xz-top { opacity: 0; transform: translateY(10px) scale(.85); pointer-events: none; }
.xz-fab.show-top .xz-top { opacity: 1; transform: none; pointer-events: auto; }

/* 进入页面时的轻微淡入（仅作用于带 #app 的模块外壳） */
@media (prefers-reduced-motion: no-preference) {
  body > #app.app-shell, body > main#app { animation: xzFade .5s ease both; }
  @keyframes xzFade { from { opacity: .35; } to { opacity: 1; } }
}

@media (max-width: 380px) {
  .xz-fab button { width: 41px; height: 41px; font-size: 17px; }
}

/* ============================================================
   排盘结果排版增强 v2.5（站点级 · 全部工具统一加载，最后生效）
   ------------------------------------------------------------
   目标：在「不改动任何模块盘面几何结构」的前提下，统一提升排盘
   结果的标题层级、数据条目、命理读文与结果头区的排版质感。
   · 仅作用于结果相关类，录入表单不受影响。
   · 沿用全站「金墨古典命理」识别（墨底 / 鎏金 / 宋体 / 暖纸文字）。
   · 同覆盖两套类名体系：System A(.sec-h/.meta-grid/.narrative…) 与
     System B(.xp-section-title/.xp-meta/.zw-…)，并兼顾梅花/塔罗/占星。
   签名元素：账册式「数据条目」——标签 · 一道鎏金发丝线 · 放大数值，
   呼应命理排盘罗列天地之数的本意；其余一律克制。
   ============================================================ */

/* —— 1. 结果区段标题：统一「古籍小标题」体例 —— */
.sec-h,
.xp-section-title,
.eb-title{
  font-family:var(--xz-serif) !important;
  letter-spacing:.16em;
  color:var(--xz-gold-soft) !important;
  display:flex;align-items:center;gap:9px;
  margin:18px 0 11px !important;
  font-weight:700;
}
/* 标题前的鎏金刻度（统一替换/补齐各体系原有标记） */
.sec-h::before,
.xp-section-title::before,
.eb-title::before{
  content:"";flex:0 0 auto;
  width:3px;height:1em;border-radius:2px;
  background:linear-gradient(180deg,var(--xz-gold-bright),var(--xz-gold) 62%,#9a7330);
  box-shadow:0 0 8px rgba(212,168,76,.35);
}
/* 标题后极淡延伸细线，收束横向留白（克制，不喧宾夺主） */
.sec-h::after,
.xp-section-title::after{
  content:"";flex:1 1 auto;height:1px;margin-left:2px;
  background:linear-gradient(90deg,var(--xz-rule),transparent);opacity:.7;
}

/* —— 2. 数据条目「账册行」：标签 → 发丝线 → 数值（签名）—— */
/* 各体系「上标签下数值」统计格（仅施加于已确认 span→b 顺序者） */
.meta-grid>div:not(.pillars),
.xp-meta>div,
.xp-mini,
.jd-yong>div{
  position:relative;
  padding:11px 12px !important;
  border-radius:14px !important;
  transition:border-color .2s ease,background .2s ease;
}
.meta-grid>div:not(.pillars):hover,
.xp-meta>div:hover,
.xp-mini:hover,
.jd-yong>div:hover{ border-color:var(--xz-line-strong) !important; }
/* 标签：小号 · 描边字距 · 下压一道鎏金发丝线 */
.meta-grid>div:not(.pillars)>span,
.xp-meta>div>span,
.xp-mini>span,
.jd-yong>div>span{
  display:block;
  font-size:10.5px !important;
  letter-spacing:.12em;
  color:var(--xz-label) !important;
  padding-bottom:6px;
  margin-bottom:7px !important;
  border-bottom:1px solid var(--xz-rule);
}
/* 数值：放大 · 宋体 · 等宽数字，盘面读数更挺括 */
.meta-grid>div:not(.pillars)>b,
.xp-meta>div>b,
.xp-mini>b,
.jd-yong>div>b{
  display:block;
  font-family:var(--xz-serif);
  font-size:15px !important;
  font-weight:700 !important;
  color:var(--xz-paper) !important;
  line-height:1.4;
  font-variant-numeric:tabular-nums;
}
.jd-yong>div small{ margin-top:5px !important; }
/* 行式数据（占星行星/相位/四化行等）：发丝分隔 + 等宽对齐，不做列分隔 */
.pl-row,.ft-row,.eb-row,.dc-head{ border-color:var(--xz-rule) !important; }
.pl-row b,.ft-row b,.eb-row b{ font-variant-numeric:tabular-nums; }

/* —— 3. 命理读文：命诗/卦辞/提纲（仅 .narrative，避免误伤小字注释）—— */
.narrative{ margin:2px 0 4px; }
.narrative p{
  font-family:var(--xz-serif) !important;
  font-size:14.5px !important;
  line-height:1.98 !important;
  color:var(--xz-read) !important;
  letter-spacing:.015em;
  margin:0 0 11px !important;
  text-align:justify;text-justify:inter-character;
  hanging-punctuation:allow-end;
}
.narrative p:last-child{ margin-bottom:2px !important; }
/* 首段（多为命诗/卦辞主文）：略大 · 暖金 · 起一道引文金线 */
.narrative p:first-child{
  font-size:15.5px !important;
  color:var(--xz-gold-soft) !important;
  padding-left:13px;
  border-left:2px solid var(--xz-line-strong);
  line-height:2.04 !important;
}

/* —— 4. 结果头区：印章 / 大字号 / 分隔（增一分仪式感，仍克制）—— */
.result-hero{ position:relative;overflow:hidden; }
.result-hero::before{                 /* 大字号后极淡鎏金光晕 */
  content:"";position:absolute;left:50%;top:6px;transform:translateX(-50%);
  width:210px;height:118px;pointer-events:none;
  background:radial-gradient(60% 60% at 50% 42%,rgba(212,168,76,.16),transparent 70%);
}
.rh-name{ position:relative;text-shadow:0 0 22px rgba(212,168,76,.18); }
.rh-sub{ position:relative; }
/* 圆形印记（紫微/八字等）补一圈外光 */
.xp-seal{ box-shadow:0 0 0 1px rgba(212,168,76,.42),0 0 22px rgba(212,168,76,.20),0 14px 32px rgba(0,0,0,.4) !important; }
.xp-hero h1,.xp-result-head h2{ font-family:var(--xz-serif) !important;letter-spacing:.12em; }
.xp-hero h1{
  background:linear-gradient(176deg,var(--xz-gold-bright),var(--xz-gold) 60%,#9a7330);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.hero-rule{ opacity:.85; }

/* —— 5. 结果 Tabs：分段控件细化（两套体系）—— */
.result-tabs{ padding:5px !important; }
.rt-btn,.xp-tabs button{ transition:color .2s ease,background .2s ease,box-shadow .2s ease; }
.rt-btn:not(.on):active,.xp-tabs button:not(.on):active{ transform:scale(.98); }
.rt-btn.on{ box-shadow:0 5px 14px rgba(212,168,76,.26),inset 0 1px 0 rgba(255,255,255,.3) !important; }
.xp-tabs button.on{ box-shadow:0 4px 12px rgba(212,168,76,.18); }

/* —— 6. 盘面单元：仅排版/留白/分隔微调，绝不改几何结构 —— */
.zw-foot,.stem-row{ border-top-color:var(--xz-rule) !important; }
.zw-foot b,.god,.door{ font-family:var(--xz-serif); }
.zw-cell.ming,.lr-cell.gui,.qm-cell.leader{ box-shadow:inset 0 0 0 1px var(--xz-line-strong); }
.gua-card b,.primary-gua b{ font-family:var(--xz-serif); }
.door-item{ border-left-width:3px !important; }
.door-item b{ font-family:var(--xz-serif); }

/* —— 7. 标签/徽标统一字距（跨工具一致）—— */
.xp-tag,.chip,.el-tag,.daily-tag,.lunar-tag,.badge,.sy,.role{ letter-spacing:.04em; }

/* —— 8. 结果区入场（尊重 reduced-motion；仅头区与结果卡，避免盘面位移）—— */
@media (prefers-reduced-motion: no-preference){
  .result-card,.xp-result-head{ animation:xzResIn .5s cubic-bezier(.2,.7,.2,1) both; }
  @keyframes xzResIn{ from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:none} }
}

/* —— 9. 响应式：小屏读文与数据条目 —— */
@media (max-width:520px){
  .narrative p{ font-size:14px !important;line-height:1.92 !important; }
  .narrative p:first-child{ font-size:14.8px !important; }
  .meta-grid>div:not(.pillars)>b,.xp-meta>div>b,.xp-mini>b{ font-size:14.5px !important; }
  .sec-h,.xp-section-title{ margin-top:15px !important; }
}

/* —— 10. 打印：结果以浅底深字清晰输出 —— */
@media print{
  .result-card,.xp-card,.card{ box-shadow:none !important;border-color:#bbb !important;background:#fff !important; }
  .narrative p,.meta-grid>div:not(.pillars)>b,.xp-meta>div>b{ color:#1a1a1a !important; }
  .meta-grid>div:not(.pillars)>span,.xp-meta>div>span{ color:#555 !important;border-bottom-color:#ccc !important; }
  .sec-h,.xp-section-title,.rh-name,.xp-hero h1{ color:#7a5a18 !important;-webkit-text-fill-color:#7a5a18 !important; }
}

/* ═════ 所有排盘工具统一结果操作栏 ═════
   位置：排盘信息下方、详细排盘结果上方。
   固定顺序：重新排盘 → 保存图片 → AI 解读；不显示复制、存档、备注等辅助操作。 */
.xp-actions,
.result-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  align-items: stretch;
  gap: 9px !important;
  width: 100%;
  margin: 12px 0 14px !important;
  padding: 10px !important;
  position: static !important;
  bottom: auto !important;
  z-index: auto !important;
  border: 1px solid var(--ln, var(--line, rgba(212, 168, 76, .20))) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(120% 180% at 50% -80%, rgba(212, 168, 76, .14), transparent 62%),
    linear-gradient(155deg, rgba(255, 244, 214, .055), rgba(255, 244, 214, .018)) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .18), inset 0 1px 0 rgba(255, 255, 255, .035) !important;
  backdrop-filter: blur(10px);
}
.xp-actions.xz-info-actions,
.result-actions.xz-info-actions {
  grid-column: 1 / -1;
  align-self: stretch;
}
/* 初始模板中的旧位置先隐藏，完成一次稳定定位后再显示，避免页面加载时跳动。 */
.xp-actions:not(.xz-actions-ready),
.result-actions:not(.xz-actions-ready) { visibility: hidden !important; }
.xp-actions.xz-actions-ready,
.result-actions.xz-actions-ready { visibility: visible !important; }
.result-card > .result-actions.xz-info-actions {
  margin: 14px 0 16px !important;
}
.xp-actions.xz-actions-1,
.result-actions.xz-actions-1 { grid-template-columns: minmax(0, 1fr) !important; }
.xp-actions.xz-actions-2,
.result-actions.xz-actions-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
.xp-actions.xz-actions-3,
.result-actions.xz-actions-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
.xp-actions.xz-actions-4,
.result-actions.xz-actions-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.xp-actions.xz-actions-5,
.result-actions.xz-actions-5 { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }

.xp-actions > button,
.xp-actions > a,
.result-actions > button,
.result-actions > a {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px;
  margin: 0 !important;
  padding: 0 10px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 1px solid var(--ln, var(--line, rgba(212, 168, 76, .28))) !important;
  border-radius: 13px !important;
  background: linear-gradient(150deg, rgba(255, 244, 214, .075), rgba(255, 244, 214, .025)) !important;
  color: var(--g2, var(--gold2, #e8cd8a)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important;
  font-size: 13.5px;
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: .035em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  touch-action: manipulation;
  transition: transform .15s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
}
.xp-actions > button:hover,
.xp-actions > a:hover,
.result-actions > button:hover,
.result-actions > a:hover {
  border-color: var(--ln2, var(--line2, rgba(212, 168, 76, .5))) !important;
  background: linear-gradient(150deg, rgba(212, 168, 76, .18), rgba(212, 168, 76, .065)) !important;
}
.xp-actions > button:focus-visible,
.xp-actions > a:focus-visible,
.result-actions > button:focus-visible,
.result-actions > a:focus-visible {
  outline: 2px solid rgba(232, 205, 138, .9);
  outline-offset: 2px;
}
.xp-actions > button:active,
.xp-actions > a:active,
.result-actions > button:active,
.result-actions > a:active { transform: translateY(1px) scale(.99); }

/* save-image.js 会自动识别原按钮含义，仅保留下面三个核心操作。 */
.xp-actions > .xz-action-reset,
.result-actions > .xz-action-reset {
  order: 10;
}
.xp-actions > .xz-action-save,
.result-actions > .xz-action-save,
.xp-actions > .save-img-btn,
.result-actions > .save-img-btn {
  order: 20;
  border-color: rgba(212, 168, 76, .42) !important;
  background: linear-gradient(150deg, rgba(212, 168, 76, .15), rgba(255, 244, 214, .04)) !important;
  color: #f0d99f !important;
}
.xp-actions > .xz-action-ai,
.result-actions > .xz-action-ai,
.xp-actions > .xz-action-primary,
.result-actions > .xz-action-primary {
  order: 30;
  border: 0 !important;
  color: #251708 !important;
  background: linear-gradient(135deg, #f0d99f, #d1a34b 58%, #b7832f) !important;
  box-shadow: 0 7px 20px rgba(184, 139, 53, .30), inset 0 1px 0 rgba(255, 255, 255, .38) !important;
  font-weight: 850;
}
.xp-actions > .xz-action-ai:hover,
.result-actions > .xz-action-ai:hover,
.xp-actions > .xz-action-primary:hover,
.result-actions > .xz-action-primary:hover {
  background: linear-gradient(135deg, #f5e5b7, #d8aa50 58%, #bf8d36) !important;
  box-shadow: 0 10px 26px rgba(184, 139, 53, .38), inset 0 1px 0 rgba(255, 255, 255, .42) !important;
}
.xp-actions > .xz-action-secondary,
.result-actions > .xz-action-secondary {
  order: 40;
}

/* 旧版按钮栏从结果头卡中移出后，清除原本用于卡内分栏的边线和留白。 */
.ly-head > .ly-acts,
.xp-result-head > .xp-actions {
  grid-column: 1 / -1;
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}

@media (max-width: 720px) {
  .xp-actions.xz-actions-many,
  .result-actions.xz-actions-many {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .xp-actions.xz-actions-5 > .xz-action-ai,
  .result-actions.xz-actions-5 > .xz-action-ai {
    grid-column: auto;
  }
}
@media (max-width: 600px) {
  .xp-actions,
  .result-actions {
    gap: 7px !important;
    margin: 10px 0 12px !important;
    padding: 8px !important;
    border-radius: 15px !important;
  }
  .xp-actions > button,
  .xp-actions > a,
  .result-actions > button,
  .result-actions > a {
    min-height: 43px;
    padding: 0 6px !important;
    border-radius: 11px !important;
    font-size: 12.5px;
    letter-spacing: 0;
  }
}
@media (max-width: 390px) {
  .xp-actions,
  .result-actions { gap: 6px !important; padding: 7px !important; }
  .xp-actions > button,
  .xp-actions > a,
  .result-actions > button,
  .result-actions > a {
    min-height: 42px;
    padding: 0 4px !important;
    font-size: 11.5px;
  }
}
@media print {
  .xp-actions,
  .result-actions { display: none !important; }
}

/* 结果操作栏最终约束：三个核心按钮在所有屏幕宽度下始终保持同一横排。 */
.xp-actions,
.result-actions,
.xp-actions.xz-actions-1,
.result-actions.xz-actions-1,
.xp-actions.xz-actions-2,
.result-actions.xz-actions-2,
.xp-actions.xz-actions-3,
.result-actions.xz-actions-3,
.xp-actions.xz-actions-4,
.result-actions.xz-actions-4,
.xp-actions.xz-actions-5,
.result-actions.xz-actions-5,
.xp-actions.xz-actions-many,
.result-actions.xz-actions-many {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  flex-wrap: nowrap !important;
}

@media (max-width: 390px) {
  .xp-actions,
  .result-actions,
  .xp-actions.xz-actions-1,
  .result-actions.xz-actions-1,
  .xp-actions.xz-actions-2,
  .result-actions.xz-actions-2,
  .xp-actions.xz-actions-3,
  .result-actions.xz-actions-3,
  .xp-actions.xz-actions-4,
  .result-actions.xz-actions-4,
  .xp-actions.xz-actions-5,
  .result-actions.xz-actions-5,
  .xp-actions.xz-actions-many,
  .result-actions.xz-actions-many {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media print {
  .xp-actions,
  .result-actions { display: none !important; }
}

/* ============================================================
   手机端排盘结果首屏优化
   - 结果生成后由 save-image.js 自动定位到操作栏与盘面起始处
   - 压缩标题、摘要与操作区，让核心盘面更快进入首屏
   ============================================================ */
@media (max-width: 600px) {
  body.xz-result-mode > #app.app-shell,
  body.xz-result-mode > main#app,
  body.xz-result-mode .shell {
    padding-left: 10px !important;
    padding-right: 10px !important;
    padding-bottom: 18px !important;
  }

  body.xz-result-mode .xp-page { padding-bottom: 18px !important; }

  /* 结果页顶栏保留品牌识别，但显著降低占高。 */
  body.xz-result-mode .topbar,
  body.xz-result-mode .xp-top {
    min-height: 42px !important;
    margin: 0 -2px 2px !important;
    padding: 5px 3px 4px !important;
  }
  body.xz-result-mode .back,
  body.xz-result-mode .xp-back,
  body.xz-result-mode .xp-next {
    min-width: 36px !important;
    width: 36px;
    height: 36px;
    line-height: 34px;
  }
  body.xz-result-mode .tb-zh { font-size: 18px !important; letter-spacing: 3px !important; }
  body.xz-result-mode .tb-en,
  body.xz-result-mode .xp-title span,
  body.xz-result-mode .tb-sub { display: none !important; }
  body.xz-result-mode .xp-title b { font-size: 17px !important; letter-spacing: 2px !important; }
  body.xz-result-mode .tb-flower { font-size: 18px !important; }

  /* 结果页签不再叠加第二层吸顶，避免遮住盘面。 */
  body.xz-result-mode .xp-tabs,
  body.xz-result-mode .result-tabs {
    position: static !important;
    top: auto !important;
    min-height: 0 !important;
    gap: 4px !important;
    margin: 2px 0 6px !important;
    padding: 4px !important;
    border-radius: 11px !important;
    background: rgba(0,0,0,.20) !important;
    backdrop-filter: none !important;
  }
  body.xz-result-mode .xp-tabs button,
  body.xz-result-mode .result-tabs button,
  body.xz-result-mode .rt-btn {
    min-height: 32px !important;
    padding: 0 7px !important;
    font-size: 11.5px !important;
    letter-spacing: .04em !important;
  }

  /* 卡片与头部信息紧凑化。 */
  body.xz-result-mode .card,
  body.xz-result-mode .xp-card,
  body.xz-result-mode .result-card {
    margin: 6px 0 !important;
    padding: 10px !important;
    border-radius: 15px !important;
  }
  body.xz-result-mode .xp-result-head,
  body.xz-result-mode .ly-head {
    grid-template-columns: 44px minmax(0,1fr) !important;
    gap: 9px !important;
    align-items: center !important;
  }
  body.xz-result-mode .xp-result-head .xp-seal,
  body.xz-result-mode .ly-head .xp-seal {
    width: 44px !important;
    height: 44px !important;
    font-size: 20px !important;
  }
  body.xz-result-mode .xp-result-head h2,
  body.xz-result-mode .ly-head h2 {
    margin: 0 0 2px !important;
    font-size: 18px !important;
    line-height: 1.25 !important;
    letter-spacing: 1px !important;
  }
  body.xz-result-mode .xp-result-head p,
  body.xz-result-mode .ly-head p {
    margin: 0 !important;
    font-size: 11px !important;
    line-height: 1.38 !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  body.xz-result-mode .result-hero {
    padding: 2px 0 8px !important;
    margin-bottom: 8px !important;
  }
  body.xz-result-mode .rh-name { font-size: 25px !important; letter-spacing: 3px !important; text-indent: 3px !important; }
  body.xz-result-mode .rh-sub {
    margin-top: 2px !important;
    font-size: 10.5px !important;
    line-height: 1.4 !important;
  }
  body.xz-result-mode .result-head { margin-bottom: 6px !important; padding-bottom: 6px !important; }
  body.xz-result-mode .summary,
  body.xz-result-mode .stat-row { margin: 5px 0 !important; gap: 5px !important; }

  /* 信息摘要由单列改为双列，减少竖向滚动。 */
  body.xz-result-mode .meta-grid,
  body.xz-result-mode .xp-meta,
  body.xz-result-mode .bs-main {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 6px !important;
    margin-bottom: 7px !important;
  }
  body.xz-result-mode .meta-grid > div,
  body.xz-result-mode .xp-meta > div,
  body.xz-result-mode .xp-mini,
  body.xz-result-mode .bs-main > div {
    min-width: 0 !important;
    padding: 6px 7px !important;
    border-radius: 10px !important;
  }
  body.xz-result-mode .meta-grid span,
  body.xz-result-mode .xp-meta span,
  body.xz-result-mode .xp-mini span,
  body.xz-result-mode .bs-main span {
    margin-bottom: 2px !important;
    font-size: 9.5px !important;
  }
  body.xz-result-mode .meta-grid b,
  body.xz-result-mode .xp-meta b,
  body.xz-result-mode .xp-mini b,
  body.xz-result-mode .bs-main b {
    font-size: 11.5px !important;
    line-height: 1.3 !important;
    overflow-wrap: anywhere;
  }

  body.xz-result-mode .xz-query-show {
    margin: 5px 0 0 !important;
    padding: 6px 8px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    letter-spacing: .02em !important;
  }
  body.xz-result-mode .xz-query-show span {
    display: inline !important;
    margin: 0 !important;
  }

  /* 三个操作继续固定同一排，并进一步降低首屏占高。 */
  body.xz-result-mode .xp-actions,
  body.xz-result-mode .result-actions {
    scroll-margin-top: 50px;
    gap: 5px !important;
    margin: 6px 0 8px !important;
    padding: 5px !important;
    border-radius: 12px !important;
    box-shadow: 0 6px 18px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.03) !important;
  }
  body.xz-result-mode .xp-actions > button,
  body.xz-result-mode .xp-actions > a,
  body.xz-result-mode .result-actions > button,
  body.xz-result-mode .result-actions > a {
    min-height: 36px !important;
    padding: 0 4px !important;
    border-radius: 9px !important;
    font-size: 11px !important;
    line-height: 1.1 !important;
  }

  body.xz-result-mode .sec-h,
  body.xz-result-mode .xp-section-title {
    margin: 7px 0 6px !important;
    font-size: 15px !important;
    letter-spacing: 1px !important;
  }
  body.xz-result-mode .narrative p {
    margin: 6px 0 !important;
    font-size: 13px !important;
    line-height: 1.68 !important;
  }
  body.xz-result-mode .xp-note,
  body.xz-result-mode .foot-note { margin-top: 8px !important; }

  /* 移动端不做结果卡位移动画，避免自动定位后画面仍继续下沉。 */
  body.xz-result-mode .result-card,
  body.xz-result-mode .xp-result-head { animation: none !important; }
}

@media (max-width: 380px) {
  body.xz-result-mode > #app.app-shell,
  body.xz-result-mode > main#app,
  body.xz-result-mode .shell { padding-left: 8px !important; padding-right: 8px !important; }
  body.xz-result-mode .xp-actions > button,
  body.xz-result-mode .xp-actions > a,
  body.xz-result-mode .result-actions > button,
  body.xz-result-mode .result-actions > a { font-size: 10.5px !important; }
}

/* ============================================================
   手机端排盘结果布局增强 v3.0
   - 核心盘面真正自适应屏幕宽度，不再依赖横向滑动
   - 压缩排盘摘要占高，生成结果后首屏直接露出盘面
   - 修复长日期、地点、事项及命盘字段造成的横向溢出
   ============================================================ */
@media (max-width: 600px) {
  html,
  body.xz-result-mode {
    max-width: 100vw !important;
    overflow-x: clip !important;
  }

  body.xz-result-mode #app,
  body.xz-result-mode .app-shell,
  body.xz-result-mode .shell,
  body.xz-result-mode .xp-page,
  body.xz-result-mode .fade-in,
  body.xz-result-mode .result-card,
  body.xz-result-mode .xp-card,
  body.xz-result-mode .card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow-x: clip !important;
  }

  body.xz-result-mode .xp-page > *,
  body.xz-result-mode .fade-in > *,
  body.xz-result-mode .result-card > *,
  body.xz-result-mode .xp-card > *,
  body.xz-result-mode .card > *,
  body.xz-result-mode .meta-grid > *,
  body.xz-result-mode .xp-meta > *,
  body.xz-result-mode .bs-main > * {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body.xz-result-mode p,
  body.xz-result-mode b,
  body.xz-result-mode span,
  body.xz-result-mode small,
  body.xz-result-mode div,
  body.xz-result-mode h1,
  body.xz-result-mode h2,
  body.xz-result-mode h3 {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  body.xz-result-mode img,
  body.xz-result-mode svg,
  body.xz-result-mode canvas {
    max-width: 100% !important;
  }

  /* 信息摘要改为紧凑的“标签 + 内容”横向卡片，长值最多两行。 */
  body.xz-result-mode .meta-grid,
  body.xz-result-mode .xp-meta,
  body.xz-result-mode .bs-main {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 4px !important;
    margin: 4px 0 5px !important;
  }
  body.xz-result-mode .meta-grid > div,
  body.xz-result-mode .xp-meta > div,
  body.xz-result-mode .xp-mini,
  body.xz-result-mode .bs-main > div {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 5px !important;
    min-height: 30px !important;
    padding: 5px 6px !important;
  }
  body.xz-result-mode .meta-grid span,
  body.xz-result-mode .xp-meta span,
  body.xz-result-mode .xp-mini span,
  body.xz-result-mode .bs-main span {
    flex: 0 0 auto !important;
    margin: 0 !important;
    font-size: 9px !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
  }
  body.xz-result-mode .meta-grid b,
  body.xz-result-mode .xp-meta b,
  body.xz-result-mode .xp-mini b,
  body.xz-result-mode .bs-main b {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    text-align: right !important;
    font-size: 10.5px !important;
    line-height: 1.3 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
  }
  body.xz-result-mode .meta-grid .pillars,
  body.xz-result-mode .xp-meta .pillars {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    gap: 2px 4px !important;
  }
  body.xz-result-mode .meta-grid .pillars span,
  body.xz-result-mode .xp-meta .pillars span {
    white-space: normal !important;
  }

  /* 标题、提问和摘要进一步瘦身，减少盘面前的垂直占用。 */
  body.xz-result-mode .result-hero {
    padding: 0 0 5px !important;
    margin: 0 0 5px !important;
  }
  body.xz-result-mode .rh-name,
  body.xz-result-mode .result-spread-name {
    font-size: 21px !important;
    line-height: 1.15 !important;
    letter-spacing: 2px !important;
    text-indent: 0 !important;
  }
  body.xz-result-mode .rh-sub,
  body.xz-result-mode .result-q,
  body.xz-result-mode .result-time {
    margin-top: 2px !important;
    font-size: 9.5px !important;
    line-height: 1.3 !important;
  }
  body.xz-result-mode .xz-query-show {
    max-height: 38px !important;
    overflow: hidden !important;
  }

  /* 操作栏固定三等分，压缩到一行但不裁切中文。 */
  body.xz-result-mode .xp-actions,
  body.xz-result-mode .result-actions {
    min-width: 0 !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 4px !important;
    margin: 4px 0 5px !important;
    padding: 4px !important;
  }
  body.xz-result-mode .xp-actions > button,
  body.xz-result-mode .xp-actions > a,
  body.xz-result-mode .result-actions > button,
  body.xz-result-mode .result-actions > a {
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 0 2px !important;
    font-size: 10.5px !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  /* 八字四柱表：取消 560px 桌面最小宽度，五列完整压进手机屏。 */
  body.xz-result-mode .xp-table {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    border-radius: 11px !important;
  }
  body.xz-result-mode .xp-row {
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: 30px repeat(4, minmax(0, 1fr)) !important;
  }
  body.xz-result-mode .xp-cell {
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 4px 1px !important;
    font-size: 9.5px !important;
    line-height: 1.2 !important;
    overflow: hidden !important;
  }
  body.xz-result-mode .xp-label { font-size: 9px !important; }
  body.xz-result-mode .xp-big { font-size: 18px !important; line-height: 1.05 !important; }
  body.xz-result-mode .xp-stack { gap: 1px !important; min-width: 0 !important; }
  body.xz-result-mode .xp-stack small { font-size: 8px !important; line-height: 1.15 !important; }

  /* 六爻爻表：五列响应式压缩，完整显示本卦、动爻与变卦信息。 */
  body.xz-result-mode .ly-board {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    border-radius: 11px !important;
  }
  body.xz-result-mode .ly-row {
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: 27px 52px minmax(0, 1fr) 54px 66px !important;
    gap: 1px !important;
    padding: 4px 2px !important;
  }
  body.xz-result-mode .ly-row > div {
    min-width: 0 !important;
    font-size: 9px !important;
    line-height: 1.18 !important;
    overflow: hidden !important;
  }
  body.xz-result-mode .yao-bar { width: 48px !important; gap: 4px !important; }
  body.xz-result-mode .yao-bar i { height: 7px !important; }
  body.xz-result-mode .qin,
  body.xz-result-mode .najia,
  body.xz-result-mode .sy,
  body.xz-result-mode .role { font-size: 8px !important; }

  /* 奇门、太乙九宫：取消 382/400px 最小宽度，九宫完整适配当前屏幕。 */
  body.xz-result-mode .qm-board {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    padding-bottom: 0 !important;
  }
  body.xz-result-mode .qm-grid {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(3, minmax(96px, auto)) !important;
    gap: 4px !important;
  }
  body.xz-result-mode .qm-cell {
    min-width: 0 !important;
    min-height: 96px !important;
    padding: 5px 4px !important;
    border-radius: 10px !important;
  }
  body.xz-result-mode .cell-top,
  body.xz-result-mode .stem-row { gap: 2px !important; }
  body.xz-result-mode .god { font-size: 10px !important; }
  body.xz-result-mode .pal,
  body.xz-result-mode .pos { font-size: 8px !important; }
  body.xz-result-mode .main-row {
    gap: 3px !important;
    margin: 7px 0 6px !important;
  }
  body.xz-result-mode .star,
  body.xz-result-mode .door { font-size: 12.5px !important; }
  body.xz-result-mode .stem-row {
    padding-top: 4px !important;
    font-size: 9px !important;
  }
  body.xz-result-mode .mark {
    right: 3px !important;
    padding: 1px 3px !important;
    font-size: 7.5px !important;
  }

  /* 紫微与六壬盘：收紧宫位间距和字号，避免宫格越出卡片。 */
  body.xz-result-mode .zw-grid,
  body.xz-result-mode .lr-grid {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 2px !important;
  }
  body.xz-result-mode .zw-cell,
  body.xz-result-mode .zw-center,
  body.xz-result-mode .lr-cell,
  body.xz-result-mode .lr-center {
    min-width: 0 !important;
    padding: 3px !important;
    border-radius: 8px !important;
  }
  body.xz-result-mode .zw-cell { min-height: 90px !important; }
  body.xz-result-mode .zw-stars { min-height: 62px !important; gap: 1px !important; }
  body.xz-result-mode .zw-star { font-size: 8px !important; letter-spacing: 0 !important; }
  body.xz-result-mode .zw-star.main { font-size: 9px !important; }
  body.xz-result-mode .zw-foot { gap: 0 !important; font-size: 7px !important; }
  body.xz-result-mode .lr-cell .sky { font-size: 17px !important; }
  body.xz-result-mode .lr-cell .grd,
  body.xz-result-mode .lr-cell .gen,
  body.xz-result-mode .lr-center { font-size: 8.5px !important; }

  /* 梅花卦象在手机端仍保持本卦、互卦、变卦同屏。 */
  body.xz-result-mode .gua-trio {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 4px !important;
    margin-bottom: 6px !important;
  }
  body.xz-result-mode .gua-card {
    min-width: 0 !important;
    padding: 7px 3px !important;
    border-radius: 9px !important;
  }
  body.xz-result-mode .gua-card * { max-width: 100% !important; }

  /* 塔罗摘要与牌阵按屏幕宽度缩放，不出现横向滚动。 */
  body.xz-result-mode .summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 5px !important;
    margin-bottom: 5px !important;
  }
  body.xz-result-mode .gauge-card,
  body.xz-result-mode .radar-card {
    min-width: 0 !important;
    padding: 6px 4px !important;
  }
  body.xz-result-mode .gauge svg { width: 92px !important; height: 56px !important; }
  body.xz-result-mode .radar svg { width: 88px !important; height: 88px !important; }
  body.xz-result-mode .gauge-val { font-size: 20px !important; }
  body.xz-result-mode .stat-row { gap: 4px !important; margin-bottom: 5px !important; }
  body.xz-result-mode .stat-pill { min-width: 0 !important; padding: 5px 2px !important; }
  body.xz-result-mode .board-wrap {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
  body.xz-result-mode .board {
    max-width: 100% !important;
    gap: 5px !important;
    transform-origin: top center;
  }
  body.xz-result-mode .board:not(.big):not(.huge) { --bc-w: 56px !important; --bc-h: 91px !important; }
  body.xz-result-mode .board.big { --bc-w: 46px !important; --bc-h: 75px !important; }
  body.xz-result-mode .board.huge { --bc-w: 42px !important; --bc-h: 68px !important; }
  body.xz-result-mode .board-cell .bc-pos { font-size: 8px !important; }

  /* 其余图表、列表和横向容器统一收口。 */
  body.xz-result-mode .xp-scroll,
  body.xz-result-mode .bt-wrap,
  body.xz-result-mode .eb-grid,
  body.xz-result-mode .enc-grid,
  body.xz-result-mode .dc-luck,
  body.xz-result-mode .guidance-grid,
  body.xz-result-mode .gua-pair,
  body.xz-result-mode .lr-course,
  body.xz-result-mode .lr-chuan {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  body.xz-result-mode .eb-grid,
  body.xz-result-mode .dc-luck,
  body.xz-result-mode .guidance-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 5px !important;
  }
  body.xz-result-mode .enc-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 4px !important;
  }

  /* 核心结果块是自动定位锚点，确保浏览器滚动后按钮和盘面同时出现。 */
  body.xz-result-mode .xz-primary-result {
    scroll-margin-top: 88px;
  }
}

@media (max-width: 380px) {
  body.xz-result-mode .ly-row {
    grid-template-columns: 24px 47px minmax(0, 1fr) 49px 58px !important;
  }
  body.xz-result-mode .yao-bar { width: 43px !important; }
  body.xz-result-mode .qm-grid { grid-template-rows: repeat(3, minmax(90px, auto)) !important; }
  body.xz-result-mode .qm-cell { min-height: 90px !important; padding: 4px 3px !important; }
  body.xz-result-mode .xp-actions > button,
  body.xz-result-mode .result-actions > button { font-size: 10px !important; }
}

/* 手机端结果布局 v3.1：实机边界修正 */
@media (max-width: 600px) {
  /* 所有结果页签在一行等分，不再产生横向滚动。 */
  body.xz-result-mode .xp-tabs {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(0, 1fr) !important;
    grid-template-columns: none !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }
  body.xz-result-mode .xp-tabs button {
    min-width: 0 !important;
    padding-left: 2px !important;
    padding-right: 2px !important;
    font-size: 10.5px !important;
    white-space: nowrap !important;
  }

  /* 下一工具在窄屏只显示箭头，避免顶栏被文字撑宽。 */
  body.xz-result-mode .xp-next {
    min-width: 36px !important;
    max-width: 36px !important;
    padding: 0 !important;
    overflow: hidden !important;
    font-size: 0 !important;
    white-space: nowrap !important;
    text-align: center !important;
  }
  body.xz-result-mode .xp-next::after {
    content: "›";
    display: block;
    font-size: 24px;
    line-height: 34px;
  }

  /* 六爻表格留出边框与内边距余量，消除最后 4px 的滚动宽度。 */
  body.xz-result-mode .ly-row {
    box-sizing: border-box !important;
    grid-template-columns: 24px 48px minmax(0, 1fr) 48px 58px !important;
  }
  body.xz-result-mode .yao-bar { width: 44px !important; }

  /* 梅花大卦线条跟随卡片宽度，不再沿用桌面固定 108px。 */
  body.xz-result-mode .gua-card .hexgram,
  body.xz-result-mode .gua-card .hexgram.lg,
  body.xz-result-mode .primary-gua .hexgram,
  body.xz-result-mode .primary-gua .hexgram.lg {
    width: 100% !important;
    max-width: 92px !important;
    min-width: 0 !important;
  }
  body.xz-result-mode .gua-card .hx-row,
  body.xz-result-mode .primary-gua .hx-row {
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media (max-width: 380px) {
  body.xz-result-mode .ly-row {
    grid-template-columns: 22px 44px minmax(0, 1fr) 44px 52px !important;
  }
  body.xz-result-mode .yao-bar { width: 40px !important; }
}

@media (max-width: 600px) {
  /* 动爻圆点收进卦线容器，避免绝对定位向右撑出 16px。 */
  body.xz-result-mode .hexgram.lg .hx-dot {
    right: 1px !important;
    top: -2px !important;
    font-size: 8px !important;
    line-height: 1 !important;
  }
}

/* ============================================================
   手机端排盘输入首屏优化 v4.0
   目标：常见 360–430px 手机无需滚动即可看见主要输入项与排盘按钮。
   仅作用于未生成结果时，不改变桌面端及结果盘面布局。
   ============================================================ */
@media (max-width: 600px) {
  body:not(.xz-result-mode) > #app.app-shell,
  body:not(.xz-result-mode) > main#app,
  body:not(.xz-result-mode) .shell {
    padding: 6px 10px 14px !important;
  }

  /* 顶栏与页面说明缩短，保留识别信息但减少首屏占高。 */
  body:not(.xz-result-mode) .topbar,
  body:not(.xz-result-mode) .xp-top {
    min-height: 38px !important;
    margin: 0 -2px 2px !important;
    padding: 3px 2px !important;
  }
  body:not(.xz-result-mode) .back,
  body:not(.xz-result-mode) .xp-back,
  body:not(.xz-result-mode) .xp-next {
    min-width: 34px !important;
    width: 34px;
    height: 34px;
    line-height: 32px;
  }
  body:not(.xz-result-mode) .tb-zh,
  body:not(.xz-result-mode) .xp-title b {
    font-size: 17px !important;
    letter-spacing: 2px !important;
  }
  body:not(.xz-result-mode) .tb-en,
  body:not(.xz-result-mode) .xp-title span,
  body:not(.xz-result-mode) .tb-sub {
    display: none !important;
  }
  body:not(.xz-result-mode) .tb-flower { font-size: 17px !important; }

  /* 专业排盘的大幅介绍卡在手机端改为一行标题。 */
  body:not(.xz-result-mode) .xp-card.xp-hero {
    grid-template-columns: 38px minmax(0, 1fr) !important;
    gap: 9px !important;
    align-items: center !important;
    margin: 4px 0 6px !important;
    padding: 7px 9px !important;
    border-radius: 13px !important;
  }
  body:not(.xz-result-mode) .xp-hero .xp-seal {
    width: 38px !important;
    height: 38px !important;
    font-size: 18px !important;
  }
  body:not(.xz-result-mode) .xp-hero h1 {
    margin: 0 !important;
    font-size: 17px !important;
    line-height: 1.25 !important;
    letter-spacing: 1px !important;
  }
  body:not(.xz-result-mode) .xp-hero p { display: none !important; }

  /* 通用输入卡：字段自动双列，说明和主按钮保持整行。 */
  body:not(.xz-result-mode) section.card:has(> .cast-btn) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px 8px !important;
    margin: 5px 0 !important;
    padding: 9px !important;
    border-radius: 14px !important;
  }
  body:not(.xz-result-mode) section.card:has(> .cast-btn) > .fld,
  body:not(.xz-result-mode) section.card:has(> .cast-btn) > label.fld {
    min-width: 0 !important;
    margin: 0 !important;
  }
  body:not(.xz-result-mode) section.card:has(> .cast-btn) > .hint,
  body:not(.xz-result-mode) section.card:has(> .cast-btn) > .row-btns,
  body:not(.xz-result-mode) section.card:has(> .cast-btn) > .cast-btn,
  body:not(.xz-result-mode) section.card:has(> .cast-btn) > .manual-grid,
  body:not(.xz-result-mode) section.card:has(> .cast-btn) > .num-grid,
  body:not(.xz-result-mode) section.card:has(> .cast-btn) > .seg,
  body:not(.xz-result-mode) section.card:has(> .cast-btn) > .random-panel {
    grid-column: 1 / -1 !important;
  }

  body:not(.xz-result-mode) .fld-l,
  body:not(.xz-result-mode) .xp-field label,
  body:not(.xz-result-mode) .field-label {
    margin-bottom: 3px !important;
    font-size: 10.5px !important;
    line-height: 1.25 !important;
    letter-spacing: .04em !important;
  }
  body:not(.xz-result-mode) .fld input,
  body:not(.xz-result-mode) .fld select,
  body:not(.xz-result-mode) .xp-field input,
  body:not(.xz-result-mode) .xp-field select,
  body:not(.xz-result-mode) .q-input,
  body:not(.xz-result-mode) input[type="text"],
  body:not(.xz-result-mode) input[type="number"],
  body:not(.xz-result-mode) input[type="date"],
  body:not(.xz-result-mode) input[type="datetime-local"],
  body:not(.xz-result-mode) input[type="time"] {
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 9px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
  }

  /* 专业输入卡紧凑双列；嵌套 grid 维持两列。 */
  body:not(.xz-result-mode) .xp-card.xp-form {
    gap: 7px !important;
    margin: 5px 0 !important;
    padding: 9px !important;
    border-radius: 14px !important;
  }
  body:not(.xz-result-mode) .xp-form .xp-grid2,
  body:not(.xz-result-mode) .xp-form .xp-grid3,
  body:not(.xz-result-mode) .manual-grid,
  body:not(.xz-result-mode) .num-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }
  body:not(.xz-result-mode) .xp-field { gap: 3px !important; min-width: 0 !important; }
  body:not(.xz-result-mode) .xp-seg { gap: 4px !important; flex-wrap: nowrap !important; }
  body:not(.xz-result-mode) .xp-seg button,
  body:not(.xz-result-mode) .xp-chip,
  body:not(.xz-result-mode) .seg-btn {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 0 7px !important;
    font-size: 11px !important;
  }

  body:not(.xz-result-mode) .hint,
  body:not(.xz-result-mode) .xp-note,
  body:not(.xz-result-mode) .foot-note {
    margin: 0 !important;
    font-size: 10px !important;
    line-height: 1.35 !important;
  }
  body:not(.xz-result-mode) section.card:has(> .cast-btn) > .hint,
  body:not(.xz-result-mode) .xp-form > .xp-note {
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden !important;
  }

  body:not(.xz-result-mode) .cast-btn,
  body:not(.xz-result-mode) .xp-submit,
  body:not(.xz-result-mode) .main-btn {
    min-height: 42px !important;
    height: 42px !important;
    margin-top: 1px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
    letter-spacing: 3px !important;
  }
  body:not(.xz-result-mode) .row-btns { gap: 6px !important; margin: 0 !important; }
  body:not(.xz-result-mode) .row-btns button { min-height: 34px !important; padding: 0 8px !important; font-size: 11px !important; }

  /* 历史记录、辅助说明不与核心输入争抢首屏。 */
  body:not(.xz-result-mode) .hist-mini,
  body:not(.xz-result-mode) .history,
  body:not(.xz-result-mode) .recent-list { margin-top: 7px !important; }
}

@media (max-width: 380px) {
  body:not(.xz-result-mode) > #app.app-shell,
  body:not(.xz-result-mode) > main#app,
  body:not(.xz-result-mode) .shell { padding-left: 7px !important; padding-right: 7px !important; }
  body:not(.xz-result-mode) section.card:has(> .cast-btn),
  body:not(.xz-result-mode) .xp-card.xp-form { padding: 7px !important; gap: 6px !important; }
  body:not(.xz-result-mode) .fld input,
  body:not(.xz-result-mode) .fld select,
  body:not(.xz-result-mode) .xp-field input,
  body:not(.xz-result-mode) .xp-field select { font-size: 11px !important; }
}