/* Product state feedback, sharing the existing WVEN typography and colors. */
.wven-dialog { width:min(440px,calc(100vw - 32px));padding:28px;color:var(--ink,#283c3b);background:var(--paper,#faf9f5);border:1px solid var(--line,rgba(40,60,59,.18));border-radius:16px; }
.wven-dialog::backdrop { background:rgba(15,25,30,.42); }
.wven-dialog h2 { font-size:1.3rem;margin:0 0 16px; }
.wven-dialog p { line-height:1.8;white-space:pre-line;margin:0 0 24px; }
.wven-dialog label { display:grid;gap:8px; }
.wven-dialog input { width:100%;box-sizing:border-box;min-height:44px;padding:10px;font:inherit;color:inherit;background:transparent;border:1px solid var(--line,#aaa); }
.wven-dialog-actions { display:flex;justify-content:flex-end;gap:12px;margin-top:24px; }
.wven-dialog button { min-height:44px; }
.paid-action[data-paid-state="running"] { cursor:wait;opacity:.75; }
.paid-action[data-paid-state="running"]::before { content:"";display:inline-block;width:12px;height:12px;margin-right:8px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:product-spin .9s linear infinite; }
.report-filters { display:flex;gap:8px;flex-wrap:wrap;margin:24px 0; }
.report-filters button { min-height:44px; }
.report-filters [aria-pressed="true"] { text-decoration:underline;text-underline-offset:6px; }
.report-asset-list { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px; }
.report-asset { display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left;min-width:0;white-space:normal;overflow-wrap:anywhere; }
.report-asset strong { font-size:1.1rem; }
.wven-dialog :focus-visible,.report-filters :focus-visible,.report-asset:focus-visible { outline:2px solid var(--accent,#47766c);outline-offset:4px; }
#trend-stages > h3 { margin-top:32px; }
@keyframes product-spin { to { transform:rotate(360deg); } }
@media(max-width:600px) { .report-asset-list{grid-template-columns:minmax(0,1fr)} .wven-dialog{padding:24px} }
@media(prefers-reduced-motion:reduce) { .paid-action[data-paid-state="running"]::before{animation:none} }

#zm-result.chart-stale > .pane { grid-column:1 / -1; }
.sys-actions { flex-wrap:wrap; }
.sys-actions [data-cast-note] { flex-basis:100%;margin:12px 0 0;line-height:1.8; }

/* Five fixed positions, responsive SVG geometry; states also use line patterns and text. */
.flow-ring { width:min(100%,430px);margin:8px auto; }
.flow-ring svg { display:block;width:100%;height:auto;overflow:visible; }
.flow-ring-link { fill:none;stroke:var(--ink-3);stroke-width:2; }
.flow-ring-link.ok { stroke:var(--primary);stroke-width:3; }
.flow-ring-link.weak { stroke-dasharray:2 4;stroke-width:1.5; }
.flow-ring-link.blocked { stroke-dasharray:8 6; }
.flow-ring-link.missing { stroke-dasharray:1 7;opacity:.55; }
.flow-tip { fill:none;stroke:var(--ink-3);stroke-width:1.2; }
.flow-tip.ok { stroke:var(--primary); }
.flow-ring-control { fill:none;stroke:var(--ink-4);stroke-width:1;stroke-dasharray:3 5;opacity:.7; }
.flow-ring-node circle { fill:var(--surface);stroke:var(--element-color,var(--line));stroke-width:1.5; }
.flow-ring-node text { text-anchor:middle;fill:var(--ink); }
.flow-ring-node .flow-ring-element { font-family:var(--font-serif);font-size:23px;fill:var(--element-color); }
.flow-ring-share { font-size:14px; }
.flow-ring-node .flow-ring-level { font-size:11px;fill:var(--ink-3); }
.flow-ring-state { text-anchor:middle;dominant-baseline:middle;font-size:13px;fill:var(--ink-2); }
.flow-ring-center { text-anchor:middle;font-size:16px;font-family:var(--font-serif);fill:var(--ink-2); }
.flow-ring-center.small { font-size:11px;fill:var(--ink-3); }
.flow-ring-node.element-0 { --element-color:var(--wx-mu); }
.flow-ring-node.element-1 { --element-color:var(--wx-huo); }
.flow-ring-node.element-2 { --element-color:var(--wx-tu); }
.flow-ring-node.element-3 { --element-color:var(--wx-jin); }
.flow-ring-node.element-4 { --element-color:var(--wx-shui); }
.flow-ring-summary { line-height:1.8;color:var(--ink); }
.flow-ring-restraints,.flow-ring-basis { font-size:var(--fs-xs);line-height:1.8;color:var(--ink-3); }
.chart-record-slots { display:flex;flex-wrap:wrap;gap:12px;margin-top:16px; }
.chart-record-slot { display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-height:44px;text-align:left;white-space:normal; }
.chart-record-slot span,.chart-record-slot small { font-size:var(--fs-xs);color:var(--ink-3); }
.trend-periods { display:flex;gap:10px;overflow-x:auto;max-width:100%;padding:12px 0 18px; }
.trend-periods button { flex:0 0 auto;display:grid;gap:5px;min-height:44px;text-align:left; }
.trend-periods [aria-pressed="true"] { border-color:var(--primary);color:var(--primary);background:var(--primary-soft); }
.tl2-period-band { fill:var(--primary);opacity:.09;pointer-events:none; }
#time-selection-reader { margin-top:20px;min-width:0; }
.trend-selection-title { font-family:var(--font-serif);font-size:var(--fs-lg);margin:0 0 12px; }
@media(max-width:600px) {
  .lt-card { padding:12px; }
  .flow-ring-node .flow-ring-element { font-size:30px;transform:translateY(5px); }
  .flow-ring-share { font-size:21px;transform:translateY(7px); }
  .flow-ring-node .flow-ring-level { display:none; }
  .flow-ring-state { font-size:18px; }
  .lt-legend { font-size:12px;gap:10px; }
  .chart-record-slots { flex-direction:column; }
  .chart-record-slot { width:100%; }
}

/* ===== 知命 · 统一的「生成解读」按钮（四柱 / 大运 / 流年 / 紫微 / 七政）===== */
.report-entry.ai-gen,
#pane-ai .report-entry.ai-gen {
  display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"kicker badge" "title badge" "desc badge";
  align-items:center; column-gap:16px; row-gap:4px; width:100%; min-width:0; margin:0;
  padding:18px 20px; text-align:left; cursor:pointer; color:var(--ink);
  background:var(--surface); border:1px solid var(--line); border-radius:14px; box-shadow:none;
  transition:border-color .2s, transform .2s, box-shadow .2s, opacity .2s, filter .2s;
}
.report-entry.ai-gen + .report-entry.ai-gen { border-left:1px solid var(--line); }
.report-entry.ai-gen .report-kicker { grid-area:kicker; font-size:12px; letter-spacing:.2em; color:var(--ink-3); opacity:1; }
.report-entry.ai-gen strong { grid-area:title; font-size:18px; font-weight:500; letter-spacing:.08em; }
.report-entry.ai-gen .report-description { grid-area:desc; font-size:13px; line-height:1.7; color:var(--ink-2); opacity:1; }
.report-entry.ai-gen .vip-badge {
  grid-area:badge; align-self:center; justify-self:end; margin:0; white-space:nowrap;
  padding:9px 16px; border-radius:999px; border:1px solid var(--primary);
  background:var(--primary); color:var(--on-primary, #fff); font-size:13px; letter-spacing:.06em; line-height:1.2;
}
.report-entry.ai-gen:hover:not(:disabled) { border-color:var(--primary); transform:translateY(-1px); box-shadow:0 10px 24px -18px rgba(20,30,40,.45); }
.report-entry.ai-gen.active { border-color:var(--primary); box-shadow:inset 0 0 0 1px var(--primary); }
.report-entry.ai-gen[data-paid-state="existing"] .vip-badge { background:transparent; color:var(--primary); }
.report-entry.ai-gen:disabled, .report-entry.ai-gen.is-running { cursor:not-allowed; opacity:.55; filter:grayscale(.6); transform:none; box-shadow:none; }
.report-entry.ai-gen:disabled .vip-badge, .report-entry.ai-gen.is-running .vip-badge { background:var(--line-2); border-color:var(--line-2); color:var(--ink-2); }
#pane-ai .report-entries { display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:12px; border:0; background:none; }
/* 仅放 AI 生成卡片的栏竖排；其他按钮栏（如专业分析 / 五行结构）保持左右排列 */
.sys-ai-bar:has(> .report-entry) { flex-direction:column; align-items:stretch; gap:8px; }
@media (max-width:600px) {
  .report-entry.ai-gen, #pane-ai .report-entry.ai-gen { grid-template-columns:minmax(0,1fr); grid-template-areas:"kicker" "title" "desc" "badge"; padding:16px; }
  .report-entry.ai-gen .vip-badge { justify-self:start; margin-top:8px; }
}

/* 生成中：按钮下方的进度条 + 旋转加载；未登录/积分不足的就地提示 */
.ai-gen-progress { margin:12px 0 4px; padding:14px 16px; border:1px dashed var(--line-2); border-radius:12px; background:var(--surface); }
.ai-gen-progress-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:14px; color:var(--ink); }
.ai-gen-spinner { flex:none; width:18px; height:18px; border-radius:50%; border:2px solid var(--line-2); border-top-color:var(--primary); animation:ai-gen-spin .9s linear infinite; }
.ai-gen-time { margin-left:auto; font-size:12px; color:var(--ink-3); font-variant-numeric:tabular-nums; }
.ai-gen-bar { position:relative; height:4px; margin:12px 0 8px; border-radius:99px; background:var(--sunken, var(--line)); overflow:hidden; }
.ai-gen-bar i { position:absolute; inset:0 auto 0 0; width:38%; border-radius:99px; background:var(--primary); animation:ai-gen-slide 1.6s ease-in-out infinite; }
.ai-gen-tip { margin:0; font-size:12px; line-height:1.7; color:var(--ink-3); }
.ai-gen-notice { margin:0 0 10px; font-size:14px; color:var(--err, #a8473a); }
.ai-gen-actions { display:flex; gap:8px; flex-wrap:wrap; }
@keyframes ai-gen-spin { to { transform:rotate(360deg); } }
@keyframes ai-gen-slide { 0% { transform:translateX(-100%); } 100% { transform:translateX(270%); } }
@media (prefers-reduced-motion:reduce) { .ai-gen-spinner { animation-duration:2.4s; } .ai-gen-bar i { animation-duration:4s; } }

/* 全站 * { margin:0 } 会清掉 <dialog> 的默认居中：显式居中，手机上也在画面正中 */
dialog.wven-dialog { position:fixed; inset:0; margin:auto; height:fit-content; max-height:calc(100dvh - 32px); overflow:auto; }
/* 统一按钮已有下方进度区，不再在按钮内部叠加旧的小转圈 */
.report-entry.ai-gen.paid-action::before { content:none; display:none; }

/* 人生趋势未解锁：固定示意图 + 统一的解锁卡片 */
.trend-locked { display:grid; gap:16px; }
.trend-placeholder { position:relative; height:140px; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.trend-placeholder svg { width:100%; height:100%; display:block; }
.trend-placeholder line { stroke:var(--line); stroke-width:1; stroke-dasharray:4 6; vector-effect:non-scaling-stroke; }
.trend-placeholder .trend-placeholder-line { stroke:var(--ink-3); stroke-dasharray:none; opacity:.55; }
.trend-placeholder-dot { position:absolute; left:50%; top:50%; width:10px; height:10px; margin:-5px 0 0 -5px; border-radius:50%; background:var(--primary); opacity:.7; }
.trend-locked .sys-ai-bar .report-entry.ai-gen { width:100%; }

/* 报告追问：独立对话框，消息只在框内滚动，页面不随之变长 */
.fu-chat { margin-top:20px; border:1px solid var(--line); border-radius:14px; background:var(--surface); overflow:hidden; }
.fu-log { margin:0; padding:16px; max-height:min(60vh,520px); overflow-y:auto; overscroll-behavior:contain; gap:16px; }
.fu-chat:not(.has-messages) .fu-log { display:none; }
.fu-form { display:flex; gap:8px; align-items:flex-end; padding:10px; margin:0; }
.fu-chat.has-messages .fu-form { border-top:1px solid var(--line); }
.fu-form textarea { flex:1; min-width:0; resize:none; min-height:42px; max-height:120px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--paper, transparent); color:var(--ink); font:inherit; font-size:15px; line-height:1.5; }
.fu-form textarea:focus { outline:none; border-color:var(--primary); }
.fu-chat .fu-form textarea { flex:1 1 auto; width:auto; }
.fu-chat .fu-form button { flex:0 0 auto; width:auto; min-width:0; min-height:42px; padding:0 16px; white-space:nowrap; font-size:14px; }
.sys-ai-chat.chat-log { margin:12px 0 0; padding:16px; max-height:min(60vh,520px); overflow-y:auto; overscroll-behavior:contain; gap:16px; border:1px solid var(--line); border-bottom:0; border-radius:14px 14px 0 0; background:var(--surface); }
.sys-ai-chat.chat-log:empty { display:none; }
.sys-ai-chat.chat-log:not(:empty) + .sys-ai-ask { margin-top:0; padding:10px; border:1px solid var(--line); border-radius:0 0 14px 14px; background:var(--surface); }
.sys-ai-chat .wd-bubble.ai { font-size:15px; line-height:1.85; color:var(--ink); }
.sys-ai-chat .wd-bubble.ai[data-pending] { color:var(--ink-4); }
