/* liuyao/assets/liuyao.css —— 六爻排盘页样式（A 期）：宣纸墨色两套变量，结构同 meihua.css；铜钱为纯 CSS 3D */
/* 断点：≥1010px 左右两栏，窄屏上下排。颜色之外都另有文字：动爻写「动」，世应写「世」「应」，旺衰、旬空写字 */
:root {
  --ly-bg: #f3efe6; --ly-card: #fbf9f4; --ly-text: #2b2622; --ly-muted: #6f6458; --ly-faint: #74695c;
  --ly-line: #cfc5b2; --ly-center: #f6f2ea; --ly-sub: #4a4239; --ly-split: #e6dfd0;
  --ly-tag-bg: #efe9dc; --ly-input-bg: #ffffff; --ly-input-line: #d9d1c0; --ly-shadow: rgba(0,0,0,.06);
  --ly-primary: #b3361f; --ly-primary-hover: #9a2d19; --ly-on-primary: #ffffff; --ly-disabled: #b9af9f;
  --ly-accent: #b3361f; --ly-danger: #b91c1c; --ly-sel-bg: #f6e9e2; --ly-focus: #b45309;
  --ly-warn-fg: #7c3a06; --ly-warn-bg: #fbf1dc; --ly-warn-line: #e3c27a;
  --ly-locked: #efe9dc; --ly-ububble: #f6e2da; --ly-on-ububble: #2b2622;
  --ly-wx-jin: #7a5a00; --ly-wx-mu: #1a6b3a; --ly-wx-shui: #1a4f8a; --ly-wx-huo: #b3261e; --ly-wx-tu: #7a4a1a;
  --ly-st-wang: #a8231a; --ly-st-xiang: #8a4b00; --ly-st-xiu: #5c564e; --ly-st-qiu: #3f4b5c; --ly-st-si: #6f6458;
  --ly-yao: #2b2622; --ly-dong: #b3361f; --ly-dong-bg: #f6e2da; --ly-shi: #1a3e6e;
  --ly-coin-hi: #e3c070; --ly-coin-lo: #b8923a; --ly-coin-edge: #6b5016; --ly-coin-ink: #2a1d04;
}
[data-theme="dark"] {
  --ly-bg: #16130f; --ly-card: #211d18; --ly-text: #ece4d6; --ly-muted: #aa9e8f; --ly-faint: #998c7b;
  --ly-line: #4a4238; --ly-center: #1c1915; --ly-sub: #d6cbb9; --ly-split: #3a332a;
  --ly-tag-bg: #2a251f; --ly-input-bg: #16130f; --ly-input-line: #3a332a; --ly-shadow: rgba(0,0,0,.4);
  --ly-primary: #c2452c; --ly-primary-hover: #ab3a24; --ly-on-primary: #ffffff; --ly-disabled: #4a4238;
  --ly-accent: #e0a34a; --ly-danger: #f87171; --ly-sel-bg: #33291d; --ly-focus: #e0a34a;
  --ly-warn-fg: #f5d58a; --ly-warn-bg: #33291a; --ly-warn-line: #8a6a1f;
  --ly-locked: #2a251f; --ly-ububble: #43261c; --ly-on-ububble: #f1e6da;
  --ly-wx-jin: #e8c25a; --ly-wx-mu: #6fd39a; --ly-wx-shui: #7fb0ff; --ly-wx-huo: #f87878; --ly-wx-tu: #d9a066;
  --ly-st-wang: #f87878; --ly-st-xiang: #f0a46b; --ly-st-xiu: #c9bfb0; --ly-st-qiu: #a9b4c4; --ly-st-si: #aa9e8f;
  --ly-yao: #ece4d6; --ly-dong: #f0a46b; --ly-dong-bg: #43261c; --ly-shi: #7fb0ff;
  --ly-coin-hi: #d4ad55; --ly-coin-lo: #a67f2a; --ly-coin-edge: #d4ad55; --ly-coin-ink: #1c1403;
  color-scheme: dark;
}
body { margin: 0; font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; background: var(--ly-bg); color: var(--ly-text); }
.ly-vh { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.ly-wrap { max-width: 1100px; margin: 0 auto; padding: 16px; display: flex; flex-direction: column; gap: 0 16px; box-sizing: border-box; }
.ly-left, .ly-right { min-width: 0; }
@media (min-width: 1010px) {
  .ly-wrap { flex-direction: row; align-items: flex-start; }
  .ly-left { flex: 0 0 calc(41% - 8px); }
  .ly-right { flex: 1 1 0; }
}

.ly-card { background: var(--ly-card); border-radius: 8px; padding: 14px; margin-bottom: 14px; box-shadow: 0 1px 3px var(--ly-shadow); outline: 1px solid var(--ly-input-line); outline-offset: -1px; }
.ly-card-h { margin: 0 0 8px; font-size: 14px; font-weight: 700; color: var(--ly-sub); }
.ly-result-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ly-result-head .ly-card-h { margin: 0 0 8px; }
.ly-form-card { position: relative; padding-right: 52px; background-image: url(ly1.png); background-repeat: no-repeat; background-size: auto; background-position: right top;}
.ly-theme-btn { position: absolute; top: 5px; right: 5px; width: 31px; height: 31px; border-radius: 50%; border: 1px solid var(--ly-input-line); background: var(--ly-card); color: var(--ly-text); font-size: 14px; line-height: 1; cursor: pointer; }
.ly-theme-btn:hover { border-color: var(--ly-accent); }
.ly-form { display: flex; flex-direction: column; gap: 10px; }
.ly-modes { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 1px solid var(--ly-split); }
.ly-mode { background: none; border: 0; border-bottom: 2px solid transparent; padding: 6px 10px 8px; margin-bottom: -1px; font-size: 14px; font-weight: 600; color: var(--ly-muted); cursor: pointer; font-family: inherit; }
.ly-mode:hover { color: var(--ly-text); }
.ly-mode[aria-selected="true"] { color: var(--ly-accent); border-bottom-color: var(--ly-accent); }
.ly-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; font-size: 14px; }
.ly-fields { margin-top: 10px; }
.ly-fields[hidden] { display: none; }
.ly-form label { font-size: 14px; white-space: nowrap; }
.ly-form select, .ly-form input[type="text"], .ly-form input[type="datetime-local"] { padding: 6px 8px; font-size: 14px; font-family: inherit; background: var(--ly-input-bg); color: var(--ly-text); border: 1px solid var(--ly-input-line); border-radius: 4px; min-width: 0; }
.ly-form input[inputmode="numeric"] { width: 7.5em; }
.ly-form [aria-invalid="true"] { border-color: var(--ly-danger); box-shadow: 0 0 0 1px var(--ly-danger); }
.ly-note { margin: 4px 0 0; font-size: 12px; line-height: 1.5; color: var(--ly-muted); }
.ly-actions { display: flex; align-items: center; gap: 12px; }
.ly-status { font-size: 13px; color: var(--ly-muted); }
.ly-btn { padding: 7px 22px; border: 0; border-radius: 6px; background: var(--ly-primary); color: var(--ly-on-primary); font-size: 14px; font-family: inherit; cursor: pointer; }
.ly-btn:hover:not(:disabled) { background: var(--ly-primary-hover); }
.ly-btn:disabled { background: var(--ly-disabled); cursor: not-allowed; }
.ly-btn-sm { flex: none; padding: 3px 9px; border: 1px solid var(--ly-accent); border-radius: 5px; background: var(--ly-card); color: var(--ly-accent); font-size: 12px; font-family: inherit; cursor: pointer; }
.ly-btn-sm:hover:not(:disabled) { background: var(--ly-sel-bg); }
.ly-btn-sm:disabled { border-color: var(--ly-disabled); color: var(--ly-disabled); cursor: not-allowed; }
.ly-btn-sm[aria-pressed="true"] { background: var(--ly-accent); color: var(--ly-on-primary); }
.ly-error { color: var(--ly-danger); font-size: 14px; }
.ly-error:not(:empty) { margin-top: 8px; }
.ly-opt { display: inline-flex; align-items: center; gap: 4px; margin-top: 6px; font-size: 12px; color: var(--ly-muted); cursor: pointer; }
.ly-mode:focus-visible, .ly-btn:focus-visible, .ly-btn-sm:focus-visible, .ly-theme-btn:focus-visible, .ly-disc-btn:focus-visible,
.ly-form select:focus-visible, .ly-form input:focus-visible { outline: 2px solid var(--ly-focus); outline-offset: 1px; }
.ly-result-h:focus { outline: none; }
.ly-result-h:focus-visible { outline: 2px solid var(--ly-focus); outline-offset: 2px; }

/* ===== 铜钱：三枚纯 CSS 3D 铜钱。.ly-coin 的 --rx 决定落定面（0 = 字面朝上，180deg = 花面朝上），翻转动画由 liuyao.js 用 Web Animations 驱动 ===== */
.ly-coins { display: flex; justify-content: center; gap: clamp(12px, 4vw, 28px); padding: 18px 0 8px; }
.ly-coin-wrap { width: 68px; height: 68px; perspective: 520px; } /* 透视放在每枚铜钱外层：外层再做抛起位移，铜钱自身的 3D 翻转才带透视 */
.ly-coin { --rx: 0deg; position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transform: rotateX(var(--rx)); }
.ly-face { position: absolute; inset: 0; border-radius: 50%; backface-visibility: hidden; -webkit-backface-visibility: hidden; forced-color-adjust: none;
  background: radial-gradient(circle at 34% 30%, var(--ly-coin-hi), var(--ly-coin-lo) 78%); box-shadow: inset 0 0 0 3px var(--ly-coin-lo), inset 0 0 0 5px rgba(255,255,255,.18), 0 2px 5px var(--ly-shadow); outline: 1.5px solid var(--ly-coin-edge); outline-offset: -1px; }
.ly-face-back { transform: rotateX(180deg); }
.ly-hole { position: absolute; left: 50%; top: 50%; width: 15px; height: 15px; margin: -7.5px 0 0 -7.5px; background: var(--ly-card); box-shadow: 0 0 0 2px var(--ly-coin-lo); }
.ly-face-text span { position: absolute; font-size: 15px; font-weight: 700; line-height: 1; color: var(--ly-coin-ink); font-family: "Songti SC", "SimSun", serif; }
.ly-c-t { left: 50%; top: 9px; transform: translateX(-50%); } .ly-c-b { left: 50%; bottom: 9px; transform: translateX(-50%); }
.ly-c-l { left: 11px; top: 50%; transform: translateY(-50%); } .ly-c-r { right: 11px; top: 50%; transform: translateY(-50%); }
.ly-moon { position: absolute; width: 14px; height: 7px; border: 2px solid var(--ly-coin-ink); border-bottom: 0; border-radius: 14px 14px 0 0; left: 50%; margin-left: -7px; }
.ly-moon-a { top: 11px; } .ly-moon-b { bottom: 11px; transform: rotate(180deg); }
.ly-coin-faces { margin: 0; text-align: center; font-size: 12px; color: var(--ly-muted); }
.ly-coin-ops { justify-content: center; margin-top: 8px; }
.ly-slots { list-style: none; margin: 12px 0 0; padding: 8px 10px; display: flex; flex-direction: column; gap: 6px; border-radius: 6px; background: var(--ly-center); outline: 1px solid var(--ly-split); outline-offset: -1px; }
.ly-slot { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--ly-faint); }
.ly-slot-pos { width: 3em; color: var(--ly-muted); }
.ly-slot-line { display: inline-block; width: 64px; height: 9px; border-radius: 1px; background: var(--ly-split); }
.ly-slot-txt { color: var(--ly-faint); }
.ly-slot-on { color: var(--ly-text); }
.ly-slot-on .ly-slot-line { background: var(--ly-yao); }
.ly-slot-on.ly-slot-yin .ly-slot-line { background: linear-gradient(to right, var(--ly-yao) 0 42%, transparent 42% 58%, var(--ly-yao) 58% 100%); }
.ly-slot-on.ly-slot-dong .ly-slot-line { background: var(--ly-dong); }
.ly-slot-on.ly-slot-dong.ly-slot-yin .ly-slot-line { background: linear-gradient(to right, var(--ly-dong) 0 42%, transparent 42% 58%, var(--ly-dong) 58% 100%); }
.ly-slot-on.ly-slot-dong .ly-slot-txt { color: var(--ly-dong); font-weight: 700; }
.ly-slot-new { animation: ly-grow .45s ease-out; }
@keyframes ly-grow { from { opacity: 0; transform: translateX(-8px); } to { opacity: 1; transform: none; } }

/* ===== 起卦信息 ===== */
.ly-info-list { display: grid; grid-template-columns: auto 1fr; gap: 3px 12px; margin: 0; font-size: 13px; line-height: 1.6; }
.ly-info-list dt { color: var(--ly-muted); white-space: nowrap; }
.ly-info-list dd { margin: 0; color: var(--ly-text); word-break: break-word; }
.ly-empty { margin: 0; font-size: 13px; color: var(--ly-muted); }

/* ===== 盘面：一行一爻，自上而下（上爻在顶） ===== */
.ly-gua-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin: 0 0 8px; }
.ly-gua-name { font-size: 18px; font-weight: 700; }
.ly-gua-sub { font-size: 13px; color: var(--ly-muted); }
.ly-tag { display: inline-block; padding: 0 5px; border: 1px solid currentColor; border-radius: 4px; font-size: 12px; line-height: 1.5; font-weight: 700; }
.ly-tag-dong { color: var(--ly-dong); }
.ly-tag-shi { color: var(--ly-shi); }
.ly-scroll { overflow-x: auto; }
.ly-table { width: 100%; border-collapse: collapse; font-size: 13px; line-height: 1.55; }
.ly-table caption { text-align: left; font-size: 12px; color: var(--ly-muted); padding: 6px 0 2px; }
.ly-table th, .ly-table td { padding: 5px 6px; text-align: left; border-bottom: 1px solid var(--ly-split); vertical-align: middle; }
.ly-table thead th { font-weight: normal; font-size: 12px; color: var(--ly-muted); white-space: nowrap; }
.ly-table tbody th { font-weight: 600; color: var(--ly-sub); white-space: nowrap; }
.ly-table tr.ly-r-dong td, .ly-table tr.ly-r-dong th { background: var(--ly-dong-bg); }
.ly-yao { display: inline-flex; align-items: center; gap: 4px; }
.ly-yao::before { content: ''; flex: none; width: 54px; height: 9px; border-radius: 1px; background: var(--ly-yao); forced-color-adjust: none; }
.ly-yao.ly-yin::before { background: linear-gradient(to right, var(--ly-yao) 0 42%, transparent 42% 58%, var(--ly-yao) 58% 100%); }
.ly-yao.ly-dong::before { background: var(--ly-dong); }
.ly-yao.ly-dong.ly-yin::before { background: linear-gradient(to right, var(--ly-dong) 0 42%, transparent 42% 58%, var(--ly-dong) 58% 100%); }
.ly-mark { width: 1.2em; font-size: 12px; font-weight: 700; color: var(--ly-dong); }
.ly-wx { font-weight: 600; }
.ly-wx-jin { color: var(--ly-wx-jin); } .ly-wx-mu { color: var(--ly-wx-mu); } .ly-wx-shui { color: var(--ly-wx-shui); } .ly-wx-huo { color: var(--ly-wx-huo); } .ly-wx-tu { color: var(--ly-wx-tu); }
.ly-st { font-weight: 700; }
.ly-st-wang { color: var(--ly-st-wang); } .ly-st-xiang { color: var(--ly-st-xiang); } .ly-st-xiu { color: var(--ly-st-xiu); } .ly-st-qiu { color: var(--ly-st-qiu); } .ly-st-si { color: var(--ly-st-si); }
.ly-fuhint { color: var(--ly-muted); font-size: 12px; }
.ly-ws-col[hidden], .ly-ws-col.ly-off { display: none; }
.ly-sub-line { display: block; font-size: 12px; color: var(--ly-muted); }
.ly-kv { margin: 8px 0 0; font-size: 13px; line-height: 1.7; color: var(--ly-sub); }
.ly-kv b { color: var(--ly-text); }
.ly-ci { margin: 2px 0 6px; font-size: 14px; line-height: 1.7; }
.ly-ci-dong { padding: 2px 8px; border-left: 3px solid var(--ly-dong); background: var(--ly-dong-bg); }
.ly-steps, .ly-notes { margin: 4px 0; padding-left: 22px; font-size: 13px; line-height: 1.7; }
.ly-formula { margin: 0 0 6px; font-size: 13px; line-height: 1.6; color: var(--ly-muted); }

.ly-disc + .ly-disc { margin-top: 6px; }
.ly-disc-btn { display: flex; align-items: center; gap: 6px; width: 100%; padding: 6px 8px; border: 0; border-radius: 6px; background: var(--ly-tag-bg); color: var(--ly-text); font-size: 13px; font-weight: 600; font-family: inherit; text-align: left; cursor: pointer; }
.ly-disc-btn:hover { background: var(--ly-sel-bg); }
.ly-disc-arrow::before { content: '▸'; display: inline-block; width: 1em; color: var(--ly-accent); }
.ly-disc-btn[aria-expanded="true"] .ly-disc-arrow::before { content: '▾'; }
.ly-disc-region { padding: 4px 8px 2px; }
.ly-disc-region[hidden] { display: none; }

.ly-h-count { font-weight: normal; color: var(--ly-faint); }
.ly-h-note { margin: 0 0 6px; font-size: 12px; color: var(--ly-faint); }
.ly-h-list { list-style: none; margin: 0; padding: 0; }
.ly-h-item { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 6px 0; border-top: 1px solid var(--ly-split); font-size: 13px; }
.ly-h-item:first-child { border-top: 0; }
.ly-h-main { display: flex; align-items: center; gap: 8px; min-width: 0; }
.ly-h-no { flex: none; min-width: 20px; height: 20px; padding: 0 4px; box-sizing: border-box; border-radius: 10px; background: var(--ly-tag-bg); color: var(--ly-sub); font-size: 11px; line-height: 20px; text-align: center; font-weight: 600; }
.ly-h-text { color: var(--ly-sub); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ly-h-ops { flex: none; display: flex; gap: 6px; }
.ly-h-del { border-color: var(--ly-danger); color: var(--ly-danger); }
.ly-h-empty { font-size: 13px; color: var(--ly-faint); padding: 4px 0; }

/* ===== B 期：AI 解盘折叠卡片（右栏顶部，默认折叠、不分屏宽、不记本机；行为在 daliuren-ai.js） =====
   新变量：--ly-ai-bar 左竖条、--ly-ai-head-hover 标题栏悬停底、--ly-ai-st-<态>-bg / -fg 状态胶囊（文字 + 颜色双提示；idle、login、down 共用灰）。
   胶囊对比度（WCAG 估算，Task 5 正式检查）：白天 灰 7.86、绿 6.52、朱砂 6.06、琥珀 7.08；暗黑 灰 7.77、绿 7.78、朱砂 6.37、琥珀 8.31 */
:root {
  --ly-ai-bar: #b3361f; --ly-ai-head-hover: #f4ede1;
  --ly-ai-st-gray-bg: #ebe5d9; --ly-ai-st-gray-fg: #4a4239;
  --ly-ai-st-ready-bg: #dff0e5; --ly-ai-st-ready-fg: #1a5e40;
  --ly-ai-st-chat-bg: #b3361f; --ly-ai-st-chat-fg: #ffffff;
  --ly-ai-st-stale-bg: #fbe8c4; --ly-ai-st-stale-fg: #7c3a06;
}
[data-theme="dark"] {
  --ly-ai-bar: #e0a34a; --ly-ai-head-hover: #2a251f;
  --ly-ai-st-gray-bg: #3a332a; --ly-ai-st-gray-fg: #d6cbb9;
  --ly-ai-st-ready-bg: #1d3a2c; --ly-ai-st-ready-fg: #7ee0b0;
  --ly-ai-st-chat-bg: #a83a24; --ly-ai-st-chat-fg: #ffffff;
  --ly-ai-st-stale-bg: #45351a; --ly-ai-st-stale-fg: #f5d58a;
}
.ly-ai { border-left: 4px solid var(--ly-ai-bar); padding: 0; overflow: hidden; }
.ly-ai-head { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 48px; padding: 8px 14px; border: 0; background: none; color: var(--ly-text);
              font-family: inherit; text-align: left; cursor: pointer; box-shadow: 0 2px 0 var(--ly-split); } /* 折叠时下沿一道浅阴影，像一张可以掀开的笺 */
.ly-ai-head[aria-expanded="true"] { box-shadow: none; border-bottom: 1px solid var(--ly-split); }
.ly-ai-head:hover { background: var(--ly-ai-head-hover); }
.ly-ai-head:focus-visible { outline: 2px solid var(--ly-focus); outline-offset: -2px; }
.ly-ai-mark { flex: none; color: var(--ly-ai-bar); font-size: 16px; }
.ly-ai-titles { flex: 1 1 auto; min-width: 0; display: flex; align-items: baseline; gap: 8px; }
.ly-ai-title { flex: none; font-size: 16px; font-weight: 700; }
.ly-ai-sub { min-width: 0; font-size: 12px; color: var(--ly-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ly-ai-status { flex: none; font-size: 12px; line-height: 1.6; padding: 1px 8px; border-radius: 10px; white-space: nowrap; background: var(--ly-ai-st-gray-bg); color: var(--ly-ai-st-gray-fg); }
#ly-ai[data-state="ready"] .ly-ai-status { background: var(--ly-ai-st-ready-bg); color: var(--ly-ai-st-ready-fg); }
#ly-ai[data-state="chat"] .ly-ai-status { background: var(--ly-ai-st-chat-bg); color: var(--ly-ai-st-chat-fg); }
#ly-ai[data-state="stale"] .ly-ai-status { background: var(--ly-ai-st-stale-bg); color: var(--ly-ai-st-stale-fg); }
.ly-ai-arrow { flex: none; font-size: 11px; color: var(--ly-faint); transition: transform .22s; }
.ly-ai-head[aria-expanded="true"] .ly-ai-arrow { transform: rotate(180deg); }
/* 折叠动画：JS 展开时先去掉 hidden、下一帧加 .ly-ai-shown；收起时先去掉 .ly-ai-shown、过渡结束再设 hidden */
.ly-ai-body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .22s ease; }
.ly-ai-body.ly-ai-shown { grid-template-rows: 1fr; }
.ly-ai-body[hidden] { display: none; }
.ly-ai-inner { overflow: hidden; min-height: 0; padding: 0 14px 14px; }
.ly-ai-note { margin: 12px 0 0; font-size: 14px; line-height: 1.7; color: var(--ly-sub); }
.ly-ai-note .ly-btn { display: inline-block; margin-left: 6px; padding: 5px 16px; text-decoration: none; }
/* tab：同 .ly-mode（选中朱砂下划线） */
.ly-ai-tabs { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 1px solid var(--ly-split); margin-top: 6px; }
.ly-ai-tab { background: none; border: 0; border-bottom: 2px solid transparent; padding: 6px 10px 8px; margin-bottom: -1px; font-size: 14px; font-weight: 600; color: var(--ly-muted); cursor: pointer; font-family: inherit; }
.ly-ai-tab:hover:not(:disabled) { color: var(--ly-text); }
.ly-ai-tab[aria-selected="true"] { color: var(--ly-accent); border-bottom-color: var(--ly-accent); }
.ly-ai-tab:disabled { cursor: not-allowed; opacity: .6; }
.ly-ai-tab:focus-visible { outline: 2px solid var(--ly-focus); outline-offset: 1px; }
.ly-ai-dot { display: inline-block; width: 8px; height: 8px; margin-left: 4px; border-radius: 50%; background: var(--ly-primary); vertical-align: 2px; }
.ly-ai-dot[hidden] { display: none; }
.ly-ai-panel { padding-top: 10px; font-size: 14px; }
.ly-ai-panel[hidden] { display: none; }
/* 设置表单 */
.ly-ai-label { display: block; margin: 8px 0 4px; font-size: 13px; color: var(--ly-sub); }
.ly-ai-label:first-child { margin-top: 0; }
.ly-ai-question { display: block; width: 100%; min-height: 72px; box-sizing: border-box; padding: 8px 10px; font-size: 14px; line-height: 1.6; font-family: inherit; resize: vertical;
                  background: var(--ly-input-bg); color: var(--ly-text); border: 1px solid var(--ly-input-line); border-radius: 6px; }
.ly-ai-panel select { padding: 6px 8px; font-size: 14px; font-family: inherit; background: var(--ly-input-bg); color: var(--ly-text); border: 1px solid var(--ly-input-line); border-radius: 4px; max-width: 100%; }
.ly-ai-panel select:disabled { opacity: .55; cursor: not-allowed; border-style: dashed; } /* 风格下拉在对话、教学模式或选了大师时禁用：两套主题都靠透明度 + 虚线边看出（同 .ly-ai-tab:disabled） */
.ly-ai-question:focus-visible, .ly-ai-panel select:focus-visible { outline: 2px solid var(--ly-focus); outline-offset: 1px; }
#ly-ai-teach-wrap[hidden] { display: none; }
.ly-ai-modes { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 2px; }
.ly-ai-pill { position: relative; display: inline-flex; cursor: pointer; }
.ly-ai-pill input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.ly-ai-pill span { padding: 4px 14px; border-radius: 14px; font-size: 13px; background: var(--ly-tag-bg); color: var(--ly-text); outline: 1px solid var(--ly-input-line); outline-offset: -1px; }
.ly-ai-pill:hover span { outline-color: var(--ly-accent); }
.ly-ai-pill input:checked + span { background: var(--ly-primary); color: var(--ly-on-primary); outline-color: var(--ly-primary); }
.ly-ai-pill input:focus-visible + span { box-shadow: 0 0 0 2px var(--ly-card), 0 0 0 4px var(--ly-focus); }
.ly-ai-mbox { margin-top: 12px; padding: 10px 12px; border-radius: 8px; background: var(--ly-tag-bg); outline: 1px solid var(--ly-split); outline-offset: -1px; }
/* 大师触发行（2026-10-11 照奇门 .qm-ai-master-trigger）：头像 + 文字的按钮占满，「一键推荐」在右（同八字页 .bz-ai-master-head） */
.ly-ai-master-head { display: flex; align-items: center; gap: 10px; }
.ly-ai-master-toggle { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 10px; padding: 2px; border: 0; background: none; color: var(--ly-text); font-size: 14px; font-weight: 600; font-family: inherit; text-align: left; cursor: pointer; }
.ly-ai-master-toggle:focus-visible, .ly-ai-recommend:focus-visible { outline: 2px solid var(--ly-focus); outline-offset: 1px; }
.ly-ai-avatar { flex: none; width: 38px; height: 38px; border-radius: 50%; overflow: hidden; border: 2px solid var(--ly-split); box-sizing: border-box; opacity: .5; filter: grayscale(70%); transition: opacity .3s, filter .3s, border-color .3s; }
.ly-ai-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ly-ai-avatar.ly-ai-avatar-half { opacity: .9; filter: grayscale(20%); }
.ly-ai-avatar.ly-ai-avatar-on { opacity: 1; filter: none; border-color: var(--ly-accent); box-shadow: 0 0 0 3px var(--ly-sel-bg); }
.ly-ai-master-text { min-width: 0; }
.ly-ai-hint { font-size: 12px; font-weight: normal; color: var(--ly-muted); }
.ly-ai-hint.ly-ai-cancel { color: var(--ly-danger); }
.ly-ai-recommend { flex: none; padding: 3px 10px; font-size: 12px; line-height: 1.6; border-radius: 12px; border: 1px solid var(--ly-accent); background: var(--ly-card); color: var(--ly-accent); font-family: inherit; cursor: pointer; }
.ly-ai-recommend:hover { background: var(--ly-sel-bg); }
.ly-ai-recommend[hidden] { display: none; }
.ly-ai-master-panel { padding: 6px 0 2px; }
.ly-ai-master-panel[hidden], #ly-ai-category[hidden] { display: none; }
/* 回复风格、语言、应期（2026-10-16 移到大师卡片外下方）：一行三列；内容宽 <480px 上下排（容器查询，按实际宽度） */
.ly-ai-opts { container-type: inline-size; margin-top: 10px; }
.ly-ai-opts-in { display: grid; grid-template-columns: 1.2fr 1fr 1.3fr; gap: 0 12px; }
@container (max-width: 479px) { /* .ly-ai-opts-in { grid-template-columns: 1fr; } */ }
.ly-ai-opt { min-width: 0; }
.ly-ai-opt select { width: 100%; }
.ly-ai-master-panel select { display: block; width: 100%; margin-bottom: 6px; }
.ly-ai-methods { display: flex; flex-wrap: wrap; gap: 6px; }
.ly-ai-methods:empty { display: none; }
.ly-ai-error { margin: 8px 0 0; color: var(--ly-danger); font-size: 14px; }
.ly-ai-error:empty { display: none; }
.ly-ai-start { display: block; width: 100%; margin-top: 12px; padding: 9px 16px; }
/* 聊天面板：改动提示条与空状态 */
.ly-ai-stale { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-bottom: 8px; padding: 6px 10px; font-size: 13px; line-height: 1.5;
               color: var(--ly-warn-fg); background: var(--ly-warn-bg); border: 1px solid var(--ly-warn-line); border-radius: 6px; }
.ly-ai-stale[hidden], .ly-ai-note[hidden], #chatPanel[hidden] { display: none; }
#ly-ai-chat-empty { margin-top: 2px; }
/* 电脑端：右栏 sticky 竖排 flex（A 期已有）；AI 卡片展开时撑满剩余高度，消息区最小 360px */
@media (min-width: 1010px) {
  .ly-right .ly-ai:not(.ly-ai-open) { flex: none; }
  .ly-right .ly-ai.ly-ai-open { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
  .ly-ai.ly-ai-open .ly-ai-body { flex: 1 1 auto; min-height: 0; }
  .ly-ai.ly-ai-open .ly-ai-inner { display: flex; flex-direction: column; }
  .ly-ai.ly-ai-open #ly-ai-p-set { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
  .ly-ai.ly-ai-open #ly-ai-p-chat:not([hidden]) { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
  .ly-ai.ly-ai-open #chatPanel:not([hidden]) { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
  .ly-ai.ly-ai-open #chatPanel .ai-chat-panel-wrapper { flex: 1 1 auto; min-height: 0; }
  /* 消息区最小 360px；矮屏按视口高度降低下限（不低于 160px），免得底部输入栏被卡片 overflow:hidden 裁掉。
     460px ≈ 消息区以外的固定高度（AI 标题栏、tab、改动提示条、组件标题与输入栏、课体毕法 tab 条、间距），Task 4 用真组件 HTML 在 1280×720 / 600 实测 */
  #chatPanel .chat-messages-container { flex: 1 1 auto; min-height: clamp(160px, calc(100vh - 460px), 360px); height: 0; max-height: none; }
}

/* 平台聊天组件本身写死蓝灰浅色：白天、暗黑两套都按 #chatPanel 作用域 !important 覆盖成宣纸墨色（照 qimen/assets/qimen.css，--qm- 换 --ly-）；
   index.php 传给组件的 theme_color 只作组件内联样式的兜底，实际颜色以这里的变量为准 */
#chatPanel { --zhuti_clor: var(--ly-primary); --zhuti_clor_hover: var(--ly-primary-hover); }
#chatPanel .ai-chat-panel-wrapper { background: var(--ly-card) !important; outline: 1px solid var(--ly-input-line); outline-offset: -1px; }
#chatPanel .ai-chat-header { background: var(--ly-primary) !important; }
#chatPanel .chat-messages-container { background: var(--ly-bg) !important; }
#chatPanel .message-bubble.ai .message-content { background: var(--ly-card) !important; color: var(--ly-text) !important; box-shadow: inset 0 0 0 1px var(--ly-input-line) !important; }
#chatPanel .message-bubble.ai .message-content h1, #chatPanel .message-bubble.ai .message-content h2,
#chatPanel .message-bubble.ai .message-content h3, #chatPanel .message-bubble.ai .message-content strong { color: var(--ly-accent) !important; }
#chatPanel .message-bubble.ai .message-content a { color: var(--ly-accent) !important; }
#chatPanel .message-bubble.user .message-content { background: var(--ly-ububble) !important; color: var(--ly-on-ububble) !important; box-shadow: inset 0 0 0 1px var(--ly-input-line) !important; }
#chatPanel .ai-msg-actions { border-top-color: var(--ly-split) !important; }
#chatPanel .ai-action-btn { color: var(--ly-sub) !important; border-color: var(--ly-input-line) !important; background: transparent !important; }
#chatPanel .ai-action-btn:hover { background: var(--ly-sel-bg) !important; }
#chatPanel .rating-popup { background: var(--ly-card) !important; border-color: var(--ly-input-line) !important; }
#chatPanel .rate-opt-btn { color: var(--ly-text) !important; border-color: var(--ly-input-line) !important; }
#chatPanel .chat-footer { background: var(--ly-card) !important; border-top-color: var(--ly-split) !important; }
#chatPanel .chat-input, #chatPanel #chat-input { background: var(--ly-input-bg) !important; color: var(--ly-text) !important; border-color: var(--ly-input-line) !important; }
#chatPanel #chat-input.ly-ai-locked { background: var(--ly-locked) !important; color: var(--ly-muted) !important; }
#chatPanel #chat-send-btn:disabled { background: var(--ly-disabled) !important; }
#chatPanel .ai-chat-disclaimer { background: var(--ly-card) !important; color: var(--ly-muted) !important; }
#chatPanel .loading-timer-text, #chatPanel .message-content div[style*="color:#888"] { color: var(--ly-muted) !important; }
#chatPanel .user-points-badge { background: var(--ly-card) !important; color: var(--ly-text) !important; }
#chatPanel .message-content > button:not([class]) { background: var(--ly-card) !important; color: var(--ly-danger) !important; border-color: var(--ly-danger) !important; }
/* 提问模板按钮（组件挪进问题框，在 #chatPanel 外）与模板弹窗（挂在 body 上） */
.preset-q-trigger-btn { background: var(--ly-primary) !important; color: var(--ly-on-primary) !important; opacity: 1 !important; }
.preset-q-trigger-btn:hover { background: var(--ly-primary-hover) !important; }
.preset-q-modal { background: var(--ly-card) !important; color: var(--ly-text); }
.preset-q-cats, .preset-q-modal-footer { background: var(--ly-card) !important; border-color: var(--ly-split) !important; color: var(--ly-muted); }
.preset-q-cat-chip { background: var(--ly-tag-bg) !important; color: var(--ly-text) !important; border-color: var(--ly-input-line) !important; }
.preset-q-cat-chip.active { background: var(--ly-primary) !important; border-color: var(--ly-primary) !important; color: var(--ly-on-primary) !important; }
.preset-q-item { background: var(--ly-center) !important; border-color: var(--ly-split) !important; }
.preset-q-item:hover { background: var(--ly-sel-bg) !important; }
.preset-q-item-title { color: var(--ly-text) !important; }
.preset-q-item-preview { color: var(--ly-accent) !important; }
.preset-q-modal-close { color: var(--ly-accent) !important; }
@media (prefers-reduced-motion: reduce) {
  .ly-ai-body, .ly-ai-arrow { transition: none; }
}
/* Task 4：聊天区系统提示（照 bazi.css .bz-sys-msg）、视觉隐藏文字（给读屏读，如改动红点里的「（设置有改动）」） */
.ly-sys-msg { text-align: center; color: var(--ly-muted); font-size: 12px; margin: 8px 0; }

/* 减少动态效果：去掉所有过渡与动画（铜钱翻转另在 liuyao.js 里判断，改为直接落定） */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
