:root{
  --bg:#ffffff;
  --ink:#111214;
  --ink-2:#3c3f45;
  --muted:#8e8e93;
  --line:#e8e8ed;
  --fill:#f5f5f7;
  --fill-2:#f2f2f7;
  --brand:#6d4fd3;
  --brand-soft:#f1ecfd;
  --radius-card:26px;
  --safe-t:env(safe-area-inset-top,0px);
  --safe-b:env(safe-area-inset-bottom,0px);
  /* 2026-10-22：頂欄固定後，錨點滾動要避開它（app.js 量到真實高度會覆蓋此值） */
  --topbar-h:64px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
/* 2026-10-17 John：部分手機把系統字體調大 → 原本用 px 固定寬高就爆版。
   三層防禦：① 阻止瀏覽器再自動放大文字 ② 任何長字串可斷行 ③ 表單／按鈕不再撐爆父層 */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overflow-wrap:break-word}
input,select,textarea,button{min-width:0;max-width:100%}
/* 2026-10-21 z647：唔可以再 height:100% 鎖死 body（會令鍵盤彈出時冇位可滾） */
html{height:100%;scroll-padding-top:var(--topbar-h,64px)}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang TC","PingFang SC","Noto Sans CJK TC","Noto Sans CJK SC","Microsoft JhengHei",system-ui,sans-serif;
  /* 2026-10-21 z647：唔再鎖死高度、唔再 overflow:hidden —— 改回正常文檔流。
     之前 height:100dvh + overflow:hidden，iOS 鍵盤彈出時無處可滾，
     只能平移可視區 → 輸入框下面露出大片空白／整頁白。 */
  /* z648：頁面高度 = 視口 + 鍵盤佔位。鍵盤一開，整頁就多出「可以再滾」嘅空間，
     iOS 用原生滾動把輸入框帶上鍵盤上方（唔會平移出空白）。 */
  display:flex;flex-direction:column;height:auto;min-height:100dvh;
  min-height:calc(var(--vh,100dvh) + var(--kb-pad,0px));
  overflow-x:hidden;
}
/* 鍵盤彈出時收起頁腳小字（John：「卡片尾巴太長」）→ 輸入框下面直接是鍵盤 */
html.kb-open .foot-line{display:none}

/* 2026-10-22：body 的 overflow-x:hidden 會令 body 自己變成滾動容器，
   而 iOS Safari 在這種情況下 position:sticky 的頂欄會失效（Chrome 正常、Safari 不跟）。
   改用 overflow-x:clip（clip 唔會建立滾動容器），舊瀏覽器仍用上面的 hidden 兜底。 */
@supports (overflow:clip){ body{overflow-x:clip} }

/* ---------- 頂部欄 ---------- */
/* 2026-10-22 John：「對話一長，想返其他頁面要刷到最頂」→ 頂欄（選單／轉發／新對話）固定喺頂部。
   z-index 15：要高過訊息內容，但一定要低過抽屜(30)同遮罩(20)，否則抽屜會被頂欄壓住。 */
.topbar{
  flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;
  padding:calc(var(--safe-t) + 10px) 16px 10px;
  position:sticky;top:0;z-index:15;background:var(--bg);
}
.topbar.is-stuck{box-shadow:0 1px 0 rgba(17,18,20,.07),0 8px 16px -12px rgba(17,18,20,.28)}
.topbar-right{display:flex;gap:8px}
.icon-btn{
  width:40px;height:40px;display:flex;align-items:center;justify-content:center;
  border:0;border-radius:50%;background:var(--fill-2);color:var(--ink-2);
  cursor:pointer;transition:background .15s;
}
.icon-btn:active{background:#e6e6eb}

/* ---------- 內容區 ---------- */
.stage{
  /* 2026-10-21 z647：唔再自己做滾動容器（內部滾動 = iOS 鍵盤一彈就露白），
     高度由內容決定，交返整頁原生滾動處理；app.js 內 stage.scrollTop 已映射到整頁。 */
  flex:1 0 auto;min-height:0;position:relative;display:flex;flex-direction:column;
}
.empty{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:flex-start;gap:10px;padding:16px;
  transform:translateY(-1%);
  /* 2026-10-19 z446 John：「不知道問什麼」移到六張卡下面之後，內容高過畫面 ⇒ 要可以捲，
     並用首／末子元素的 auto margin 做垂直居中（overflow 時 auto margin collapse 0，唔會切頂）。 */
  overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
}
.empty > :first-child{margin-top:auto}
.empty > :last-child{margin-bottom:auto}
.empty[hidden]{display:none}
.brand-logo{width:96px;height:96px;display:block;cursor:pointer;-webkit-user-select:none;user-select:none}
.brand-logo:active{opacity:.7}
.empty-title{margin:0;font-size:20px;font-weight:600;letter-spacing:.02em;color:var(--ink);cursor:pointer;-webkit-user-select:none;user-select:none}
.brand-title{display:block;width:156px;height:auto;margin:0 auto;-webkit-user-select:none;user-select:none}
.empty-title:active{opacity:.7}
/* ---------- 各功能頂部介紹卡（點 chip 即換） ---------- */
.mode-intro{display:flex;flex-direction:column;align-items:center;gap:9px;max-width:520px;width:100%}
.mode-intro[hidden]{display:none}
.mi-desc{margin:0;font-size:13px;line-height:1.65;color:var(--muted);text-align:center;white-space:pre-line}
/* 2026-10-19：兩欄格線 —— 3 條問題 + 換一換 剛好填滿 2×2，唔會留大空位 */
/* 2026-10-22 John：「木木首页很乱，重新写一下主要有什么功能，罗列一下」→ 木木專用 2×2 功能羅列卡 */
.mm-feat{display:grid;grid-template-columns:1fr 1fr;gap:7px;width:100%}
.mm-feat[hidden]{display:none}
.mm-f{display:flex;gap:7px;align-items:flex-start;text-align:left;
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 9px;min-width:0;
  appearance:none;-webkit-appearance:none;font-family:inherit;cursor:pointer;width:100%;
  -webkit-tap-highlight-color:transparent}
.mm-f:active{background:var(--brand-soft)}
.mm-f.is-on{border-color:var(--brand);background:var(--brand-soft);box-shadow:0 0 0 1px var(--brand) inset}
.mm-f-ic{font-size:15px;line-height:1.25;flex:0 0 auto}
.mm-f-b{min-width:0;display:block}
.mm-f-t{display:block;font-size:12.5px;font-weight:600;color:var(--ink);line-height:1.3}
.mm-f-d{display:block;font-size:10.5px;color:#8b7bb8;line-height:1.35;margin-top:2px;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.mi-eg{display:grid;grid-template-columns:1fr 1fr;gap:6px;align-items:stretch}
.mi-eg-btn{
  font:inherit;font-size:12px;padding:7px 9px;border-radius:999px;min-width:0;
  border:1px dashed var(--brand);background:#fff;color:var(--brand);cursor:pointer;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;
}
.mi-eg-btn:active{background:var(--brand-soft);transform:scale(.97)}
/* 2026-10-19 John：換一換（要細一點，放第 4 格靠右） */
.mi-eg-refresh{font:inherit;font-size:10px;line-height:1.2;padding:3px 8px;border-radius:999px;
  border:1px dashed rgba(124,58,237,.38);background:transparent;color:#8b7bb8;
  cursor:pointer;justify-self:end;align-self:center;white-space:nowrap;
  -webkit-tap-highlight-color:transparent}
.mi-eg-refresh:active{background:var(--brand-soft);transform:scale(.96)}
/* 2026-10-19 John：深度解析頁的命盤入口（同「換一換」一樣細，但整行居中） */
.mi-chart-btn{
  display:block;width:100%;margin:8px 0 0;
  font:inherit;font-size:12.5px;font-weight:600;padding:9px 12px;border-radius:999px;
  border:1px dashed var(--brand);background:var(--brand-soft);color:var(--brand);
  cursor:pointer;-webkit-tap-highlight-color:transparent;text-align:center;
}
.mi-chart-btn:active{transform:scale(.98);background:#f0e9ff}

/* ---------- 訊息 ---------- */
.messages{display:none;flex-direction:column;gap:18px;padding:8px 10px 16px;max-width:820px;margin:auto auto 0;width:100%}
.messages.has-msg{display:flex}
.msg{display:flex;gap:8px;align-items:flex-start}
.msg.user{justify-content:flex-end}
/* AI 回覆：小 logo 放上方、氣泡整條占滿（對齊 DeepSeek 的寬排版） */
.msg.ai{flex-direction:column;align-items:stretch;gap:7px}
.bubble{
  max-width:80%;padding:11px 14px;border-radius:18px;font-size:15.5px;line-height:1.65;
  white-space:pre-wrap;word-break:break-word;
}
.msg.user .bubble{background:var(--brand);color:#fff;border-bottom-right-radius:6px}
.msg.ai .bubble{background:#faf5ff;color:#444;border-left:3px solid #7c3aed;border-radius:12px;border-bottom-left-radius:6px;font-size:14.5px;line-height:1.75;white-space:normal;width:100%;max-width:100%;flex:0 0 auto}
.msg.ai .bubble .bubble-txt{display:block}
.msg.ai .bubble b,.msg.ai .bubble strong{font-weight:700}
/* 本次採用命盤卡（附在 AI 回覆氣泡頂部） */
.cc-wrap{margin:0 0 10px}
.cc{background:#fff;border:1px solid #ece4fb;border-radius:10px;padding:8px 10px}
.cc-h{font-size:11.5px;color:#7c3aed;font-weight:600;margin-bottom:5px;letter-spacing:.02em}
.cc-r{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;padding:4px 0;font-size:12.5px;line-height:1.5;border-top:1px dashed #f0eafc}
.cc-r:first-of-type{border-top:0}
.cc-n{font-weight:700;color:#5b21b6;flex:0 0 auto}
.cc-p{font-family:ui-monospace,Menlo,Consolas,monospace;color:#333;letter-spacing:.02em}
.cc-m{color:#8b8b96;font-size:11.5px;flex:1 1 100%}
.msg .mark{
  flex:0 0 auto;width:22px;height:22px;border-radius:7px;object-fit:cover;display:block;
}
.typing{display:flex;gap:5px;align-items:center;height:22px}
.typing i{width:6px;height:6px;border-radius:50%;background:#c3c3c9;animation:bl 1.2s infinite}
.typing i:nth-child(2){animation-delay:.18s}
.typing i:nth-child(3){animation-delay:.36s}
@keyframes bl{0%,60%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

/* ---------- 輸入區 ---------- */
.composer{
  /* 2026-10-21 z647：唔用 fixed、唔用 sticky、唔用 transform —— 就係普通文檔流嘅尾部。
     短內容時靠 body min-height + .stage flex:1 頂到畫面底；長對話時跟住內容行到尾。 */
  flex:0 0 auto;background:var(--bg);padding:0 14px calc(var(--safe-b) + 2px);
}
/* z648：鍵盤彈出時頁尾留出鍵盤高度嘅空位（配合上面 body min-height 一齊用）——
   咁整頁就有真嘅「可滾動空間」，iOS 原生滾動把輸入框帶到鍵盤上方。 */
body::after{content:'';display:block;flex:0 0 auto;height:var(--kb-pad,0px)}
/* 2026-10-21 John 截圖「微信打開下面留大片空白」→ 舊補丁硬留 54px，但現時 iOS 微信
   webview 已經內嵌，工具列唔會疊住網頁，54px 全部變成底部空白。
   改為只留安全區 + 10px 呼吸位；如真機仍被遮，再由 JS 動態補（見 index.html setVH）。 */
html.wx-ios .composer{padding-bottom:calc(var(--safe-b) + 10px)}
.composer-card{
  max-width:820px;margin:0 auto;background:var(--fill);border:1px solid var(--line);
  border-radius:23px;padding:6px 6px 6px 15px;
  display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px;
}
.composer-card:focus-within{border-color:#d9d2f2}
#input{
  flex:1 1 40px;min-width:0;width:auto;border:0;background:transparent;resize:none;outline:none;
  font:inherit;font-size:16.5px;line-height:1.35;color:var(--ink);
  max-height:132px;padding:4px 2px;
}
#input::placeholder{color:var(--muted)}
/* ---------- 附件縮圖 ---------- */
.attach-preview{display:flex;gap:8px;flex-wrap:wrap;padding:0 2px 8px;flex:1 1 100%;order:-1}
.attach-preview[hidden]{display:none}
.att{position:relative;width:68px;height:68px;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#fff}
.att img{width:100%;height:100%;object-fit:cover;display:block}
.att-x{
  position:absolute;top:3px;right:3px;width:21px;height:21px;padding:0;
  border:0;border-radius:50%;background:rgba(0,0,0,.58);color:#fff;
  font-size:15px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;
}
.bubble-img{display:block;max-width:100%;max-height:280px;border-radius:12px;margin-bottom:6px;object-fit:contain}
/* 文件附件（PDF／DOCX／TXT）—— 2026-10-18 */
.att-file{width:auto;max-width:190px;height:68px;padding:0 10px;display:flex;align-items:center;gap:6px;border-radius:12px;background:#f6f4fb;border:1px solid var(--line)}
.att-file .att-ic{font-size:22px;line-height:1}
.att-file .att-nm{font-size:12px;color:#4b3a78;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:120px}
.att-file .att-x{top:3px;right:3px;width:19px;height:19px;font-size:13px}
.bubble .bubble-txt{display:block}
.composer-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:0;flex:0 0 auto}
.chips{display:flex;gap:6px;min-width:0;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.chips::-webkit-scrollbar{display:none}
.chip{
  flex:0 0 auto;white-space:nowrap;
  display:inline-flex;align-items:center;justify-content:center;gap:5px;height:32px;padding:0 10px;
  border:0;border-radius:16px;background:#fff;color:var(--ink-2);
  font-size:12.5px;font-weight:500;cursor:pointer;transition:.15s;
  border:1px solid var(--line);white-space:nowrap;
}
.chip .dot{width:5px;height:5px;border-radius:50%;background:#c9c9d1;transition:.15s}
.chip.is-on{background:var(--brand-soft);color:var(--brand);border-color:transparent}
.chip.is-on .dot{background:var(--brand)}
/* 2026-10-12：木木回覆語言選擇（只在選中 🧡 木木 時顯示），選擇會記住 */
.mumu-lang{display:flex;align-items:center;gap:6px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;
  -webkit-overflow-scrolling:touch;max-width:820px;margin:0 auto 8px;padding:0 2px}
.mumu-lang::-webkit-scrollbar{display:none}
.mumu-lang[hidden]{display:none}
.mumu-lang .ml-label{font-size:11.5px;color:var(--muted);white-space:nowrap;font-weight:500}
.mumu-lang .ml-group{display:flex;gap:6px;min-width:0;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.mumu-lang .ml-group::-webkit-scrollbar{display:none}
.mumu-lang .ml-btn{
  flex:0 0 auto;white-space:nowrap;
  display:inline-flex;align-items:center;justify-content:center;gap:3px;height:27px;padding:0 9px;
  border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink-2);
  font-size:11.5px;font-weight:500;cursor:pointer;transition:.15s;
}
.mumu-lang .ml-btn.is-on{background:var(--brand-soft);color:var(--brand);border-color:transparent;font-weight:600}
.mumu-lang .ml-btn.bgm-toggle:not(.is-on){color:var(--muted);border-style:dashed;font-weight:500;background:#fff}
.actions-right{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.round-btn{
  width:32px;height:32px;display:flex;align-items:center;justify-content:center;
  border:1.5px solid #d4d4dc;border-radius:50%;background:transparent;color:var(--ink);
  cursor:pointer;transition:.15s;
}
.round-btn:active{background:#ececf1}
.round-btn[hidden]{display:none}
.send-btn{
  width:32px;height:32px;display:flex;align-items:center;justify-content:center;
  border:0;border-radius:50%;background:var(--brand);color:#fff;
  cursor:pointer;transition:transform .12s,opacity .15s;
}
.send-btn:active{transform:scale(.92)}
.send-btn:disabled{background:#dcdce2;cursor:default;transform:none}
.send-btn[hidden]{display:none}
.foot-line{margin:6px 0 0;display:flex;align-items:baseline;justify-content:center;gap:8px;flex-wrap:wrap;padding:0 6px}
.foot-note{font-size:11.5px;color:#b0b0b8;text-align:center}
.build-tag{font-size:10px;color:#d8d8de;letter-spacing:.03em;white-space:nowrap}

/* ---------- 抽屜 ---------- */
.drawer{
  position:fixed;top:0;left:0;bottom:0;width:316px;max-width:88vw;background:#fff;
  border-right:1px solid var(--line);transform:translateX(-102%);
  transition:transform .24s cubic-bezier(.22,.7,.3,1);z-index:30;
  display:flex;flex-direction:column;padding-top:var(--safe-t);
  /* 系統字體放大時，格內按鈕會超出格寬 → 一律唔准漏出抽屜外（否則關閉狀態都會喺左邊漏出半截 pill） */
  overflow:hidden;
}
.drawer.open{transform:none}
/* 2026-10-15 John：抽屜分頁 —— 💬 歷史對話 ／ 🧰 生活技能（互相切換） */
/* 2026-10-21 John：「这里做成大一些的卡片式 分成两行展示」→ 5 個分頁改成 3 欄卡片網格
   （第一行 3 張、第二行 2 張各佔一半），大圖示 + 文字上下排，比原本橫向小膠囊好撳。 */
.drawer-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 12px 10px;padding:0;background:transparent;border-radius:0;flex:0 0 auto}
.dt-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  padding:14px 4px 12px;border:1px solid #ece7f8;border-radius:16px;background:#fff;color:#6d6486;
  font-size:12.5px;font-weight:700;font-family:inherit;cursor:pointer;white-space:nowrap;transition:.15s;
  box-shadow:0 1px 3px rgba(94,53,177,.06);letter-spacing:0}
.dt-btn .dt-ic{font-size:22px;line-height:1;display:block}
.dt-btn .dt-lb{line-height:1.15;display:block}
.dt-btn.is-on{background:linear-gradient(180deg,#f8f4ff,#efe6ff);color:var(--brand);border-color:#d7c5f9;box-shadow:0 3px 10px rgba(94,53,177,.16)}
.dt-btn:active{transform:scale(.97)}

/* ---------- 2026-10-21 「👤 我的」登入／訂閱 ---------- */
.me-wrap{padding:2px 12px calc(16px + var(--safe-b));display:flex;flex-direction:column;gap:10px;overflow-y:auto;flex:1;min-height:0}
#meGuest,#meUser{display:flex;flex-direction:column;gap:10px}
#meGuest[hidden],#meUser[hidden]{display:none!important}
.me-title{font-size:16px;font-weight:800;color:#3d3358}
.me-lead{font-size:12px;color:#7d7392;line-height:1.65;margin-top:-4px}
.me-tabs{display:flex;gap:6px;background:#f3f0fa;padding:3px;border-radius:12px}
.me-tab{flex:1;border:0;background:transparent;padding:8px;border-radius:10px;font:inherit;font-size:13px;font-weight:700;color:#7d7392;cursor:pointer}
.me-tab.is-on{background:#fff;color:var(--brand);box-shadow:0 1px 3px rgba(0,0,0,.06)}
.me-lb{font-size:11.5px;color:#7d7392;margin-bottom:-4px}
.me-in{width:100%;box-sizing:border-box;border:1px solid #e6e0f5;border-radius:12px;padding:11px 12px;font:inherit;font-size:14px;background:#fff;color:#2b2340;outline:none}
.me-in:focus{border-color:#c3aef5}
.me-code{display:flex;gap:6px}
.me-code .me-in{flex:1;min-width:0}
.me-code button{flex:0 0 auto;border:1px solid #d7c9f5;background:#f7f2ff;color:var(--brand);border-radius:12px;padding:0 14px;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.me-code button:disabled{opacity:.55}
.me-main{width:100%;border:0;border-radius:14px;background:linear-gradient(135deg,#7c5cf0,#6d4fd3);color:#fff;font:inherit;font-size:15px;font-weight:800;padding:13px;cursor:pointer;margin-top:2px}
.me-main:disabled{opacity:.6}
.me-msg{font-size:12px;color:#c0392b;min-height:16px;text-align:center;line-height:1.5}
.me-msg.ok{color:#1c7c3e}
.me-card{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #ece7f8;border-radius:16px;padding:12px}
.me-av{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#a78bfa,#7c5cf0);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:17px;flex:0 0 auto}
.me-id b{display:block;font-size:14px;color:#3d3358}
.me-id span{font-size:11.5px;color:#8e8e93;word-break:break-all}
.me-sub-card{border-radius:16px;padding:13px;background:linear-gradient(135deg,#f8f4ff,#efe6ff);border:1px solid #ddd0fb}
.me-sub-plan{font-size:15px;font-weight:800;color:var(--brand)}
.me-sub-meta{font-size:12px;color:#6b6383;line-height:1.75;margin-top:4px}
/* 2026-10-22 分站權益：我的 → 今日額度 */
.me-quota{margin-top:10px;padding-top:9px;border-top:1px dashed #e6e1f0;display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center}
.me-quota-t{font-size:12px;color:#8b82a8;font-weight:600}
.me-quota-i{font-size:12px;color:#5b4b86;background:#f4f1fb;border-radius:6px;padding:2px 7px;white-space:nowrap}
.me-quota-n{font-size:11px;color:#a49cb8;width:100%}
/* 2026-10-22 已綁 profile：內嵌 pairing 儀表盤 */
.fs-pair-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}
.fs-pair-h b{font-size:14px;color:#3a2f57}
.fs-pair-open{font-size:12px;color:#6b4fc9;text-decoration:none;border:1px solid #ddd0fb;border-radius:8px;padding:3px 8px;white-space:nowrap}
.fs-pair-n{font-size:11.5px;color:#8b82a8;margin-bottom:8px;line-height:1.6}
.fs-frame{width:100%;height:calc(100vh - 210px);min-height:460px;border:0;border-radius:12px;background:#fff}
/* 全屏檔案櫃（已綁 profile：內嵌 pairing 儀表盤） */
.fs-ov{position:fixed;inset:0;z-index:99999;background:#fff;display:flex;flex-direction:column}
.fs-ov-h{flex:0 0 auto;height:50px;display:flex;align-items:center;justify-content:space-between;
  padding:0 14px;background:#fff;border-bottom:1px solid #ece7f8;font-size:15px;color:#3a2f57}
.fs-ov-r{display:flex;align-items:center;gap:10px}
.fs-ov-r a{font-size:12px;color:#6b4fc9;text-decoration:none}
.fs-ov-r button{font-size:13px;color:#6b4fc9;background:#f4f1fb;border:0;border-radius:8px;padding:5px 12px}
.fs-ov-f{flex:1 1 auto;width:100%;border:0;background:#fff}
.me-plans{display:flex;flex-direction:column;gap:8px}
.me-plans-t{font-size:11.5px;color:#8e8e93;margin-bottom:-2px}
.me-plan{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid #ece7f8;border-radius:14px;padding:11px 12px;background:#fff}
.me-plan b{font-size:13.5px;color:#3d3358}
.me-plan span{font-size:12px;color:#8e8e93}
.me-plan em{font-style:normal;color:#b8860b;font-weight:800;font-size:14px}
/* 2026-10-21 訂閱付款：方案改為可點按鈕 + 掃碼彈窗 */
button.me-plan{width:100%;font:inherit;text-align:left;cursor:pointer}
button.me-plan:active{background:#f7f3ff}
button.me-plan:disabled{opacity:.6}
.me-plan-n{display:block}
.me-plans-note{font-size:11px;color:#9b95a8;line-height:1.5;margin-top:2px}
.me-pay-mask{position:fixed;inset:0;z-index:9999;background:rgba(24,18,40,.55);display:flex;align-items:center;justify-content:center;padding:20px}
.me-pay-box{width:100%;max-width:300px;background:#fff;border-radius:18px;padding:18px;text-align:center;box-shadow:0 18px 50px rgba(0,0,0,.25)}
.me-pay-t{font-size:15px;font-weight:800;color:#3d3358;margin-bottom:12px}
.me-pay-qr{width:190px;height:190px;display:block;margin:0 auto 10px;border-radius:10px}
.me-pay-tip{font-size:11.5px;color:#8e8e93;line-height:1.6;margin-bottom:10px}
.me-pay-link{display:inline-block;font-size:12.5px;color:#6d4fd3;text-decoration:none;padding:8px 14px;border:1px solid #ddd0fb;border-radius:999px;margin-bottom:8px}
.me-pay-close{display:block;width:100%;margin-top:10px;border:0;border-radius:12px;background:#f2effa;color:#5b4a8c;font:inherit;font-size:13.5px;font-weight:700;padding:10px;cursor:pointer}
/* 2026-10-21 個人主頁設定列表（參考 ChatGPT 帳戶頁） */
.me-list{border-radius:16px;background:#fff;border:1px solid #efeaf9;overflow:hidden}
.me-row{display:flex;align-items:center;gap:8px;width:100%;border:0;border-top:1px solid #f3effb;background:#fff;font:inherit;
  font-size:14px;color:#332e42;padding:13px 14px;cursor:pointer;text-align:left}
.me-row:first-child{border-top:0}
.me-row:active{background:#faf7ff}
.me-row-l{display:flex;align-items:center;gap:9px;flex:1;min-width:0}
.me-row-ic{font-size:15px;line-height:1}
.me-row-v{font-size:12.5px;color:#948da6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46%}
.me-row-chev{color:#c6bfd6;font-size:17px;line-height:1}
/* 帳戶管理／協議／幫助 彈層 */
.me-sheet-mask{position:fixed;inset:0;z-index:9998;background:rgba(24,18,40,.45);display:flex;align-items:flex-end;justify-content:center}
.me-sheet-mask[hidden]{display:none !important}
.me-sheet{width:100%;max-width:520px;max-height:82vh;background:#f7f5fb;border-radius:20px 20px 0 0;display:flex;flex-direction:column;overflow:hidden}
.me-sheet-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:#fff;border-bottom:1px solid #f0ecf8}
.me-sheet-head strong{font-size:15.5px;color:#2f2a3d}
.me-sheet-x{border:0;background:#f2eff9;color:#6b627f;width:30px;height:30px;border-radius:50%;font-size:14px;cursor:pointer}
.me-sheet-body{padding:14px 14px calc(20px + var(--safe-b));overflow-y:auto;-webkit-overflow-scrolling:touch}
.sheet-card{background:#fff;border-radius:14px;border:1px solid #efeaf9;overflow:hidden;margin-bottom:12px}
.sheet-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 14px;border-top:1px solid #f3effb;font-size:14px;color:#332e42}
.sheet-row:first-child{border-top:0}
.sheet-row .v{font-size:12.5px;color:#948da6;max-width:55%;text-align:right;word-break:break-word;overflow-wrap:anywhere}
.sheet-btn{width:100%;border:0;background:#fff;font:inherit;font-size:14px;color:#3b3550;padding:14px;text-align:center;border-top:1px solid #f3effb;cursor:pointer}
.sheet-btn.danger{color:#c0392b}
.sheet-btn:active{background:#faf7ff}
.sheet-note{font-size:11.5px;color:#9b95a8;line-height:1.65;padding:4px 6px 10px}
.sheet-p{font-size:13px;color:#4a4458;line-height:1.75;margin:0 0 10px}
.sheet-h{font-size:13px;font-weight:800;color:#5b4a8c;margin:14px 0 6px}
.me-out{width:100%;border:1px solid #e6e0f5;background:#fff;color:#7d7392;border-radius:14px;padding:11px;font:inherit;font-size:13.5px;font-weight:700;cursor:pointer}
.drawer-pane{display:flex;flex-direction:column;flex:1;min-height:0}
.drawer-pane.hide{display:none}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:12px 10px 12px 18px;border-bottom:1px solid var(--line);min-height:56px}
.dh-normal{display:flex;align-items:center;justify-content:space-between;width:100%}
.dh-sel{display:flex;align-items:center;justify-content:space-between;width:100%;gap:8px}
.dh-normal[hidden],.dh-sel[hidden]{display:none}
.dh-sel strong{font-size:13.5px;font-weight:600;white-space:nowrap;flex:1;text-align:center;overflow:hidden;text-overflow:ellipsis}
.dh-normal strong{font-size:15px}
.dh-acts{display:flex;gap:6px}
.link-btn{white-space:nowrap;flex:0 0 auto}
.icon-btn.sm{width:34px;height:34px;font-size:20px;line-height:1}
.link-btn{border:0;background:transparent;color:var(--brand);font-size:13.5px;padding:6px 4px;cursor:pointer;font-family:inherit}
.drawer-search{display:flex;align-items:center;gap:7px;margin:10px 12px 4px;padding:0 11px;height:38px;background:var(--fill-2);border-radius:19px;color:var(--muted);flex:0 0 auto}
.drawer-search input{flex:1;min-width:0;border:0;background:transparent;outline:none;font:inherit;font-size:13.5px;color:var(--ink)}
.drawer-search input::placeholder{color:#b0b0b8}
.drawer-search input::-webkit-search-cancel-button{-webkit-appearance:none}
.drawer-list{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:8px 8px 4px;-webkit-overflow-scrolling:touch}
.di-group{margin:12px 10px 6px;font-size:12px;font-weight:600;color:#a3a3ac;letter-spacing:.02em}
.di-group:first-child{margin-top:4px}
.di{
  display:flex;align-items:center;gap:10px;width:100%;box-sizing:border-box;
  padding:10px 10px;border-radius:12px;cursor:pointer;transition:background .12s;
  -webkit-user-select:none;user-select:none;position:relative;
}
.di:active{background:var(--fill)}
.di.on{background:var(--brand-soft)}
.di-check{
  flex:0 0 auto;width:20px;height:20px;border-radius:50%;
  border:1.5px solid #d2d2da;background:#fff;display:none;
  align-items:center;justify-content:center;transition:.12s;
}
.di.on .di-check{background:var(--brand);border-color:var(--brand)}
.di.on .di-check::after{content:"";width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}
.sel-mode .di-check{display:flex}
.di-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.di-title{font-size:14px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.di.on .di-title{color:var(--brand)}
.di-time{font-size:11.5px;color:#b0b0b8}
.di-pinflag{flex:0 0 auto;font-size:10.5px;color:var(--brand);background:var(--brand-soft);border-radius:6px;padding:2px 6px}
.di-badge{flex:0 0 auto;font-size:10.5px;color:#fff;background:var(--brand);border-radius:6px;padding:2px 6px;align-self:center}
/* 非木木模組標籤：柔和灰紫，同「木木」紫色區分開（2026-10-15） */
.di-badge.mod{background:#efeafd;color:#6b4bb5;border:1px solid #e0d6fa}
.drawer-empty{padding:18px;color:var(--muted);font-size:13.5px;text-align:center}
.drawer-selectbar{
  display:flex;gap:8px;padding:8px 12px;border-top:1px solid var(--line);
  background:#fff;flex:0 0 auto;
}
.drawer-selectbar[hidden]{display:none}
.sb-btn{
  flex:1;display:flex;align-items:center;justify-content:center;gap:6px;
  height:42px;border:0;border-radius:12px;background:var(--fill);
  color:var(--ink);font-family:inherit;font-size:14px;font-weight:500;cursor:pointer;
}
.sb-btn:active{background:#e6e6eb}
.sb-btn.danger{color:#c0392b}
.sb-btn:disabled{opacity:.4;cursor:default}
.drawer-clear{margin:8px 12px calc(var(--safe-b) + 12px);padding:11px;border:0;border-radius:12px;background:var(--fill);color:#c0392b;font-size:14px;cursor:pointer;transition:.15s}
.drawer-clear[hidden]{display:none}
.drawer-clear.confirm{background:#fdeceb;color:#c0392b;font-weight:600}
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.28);opacity:0;pointer-events:none;transition:opacity .24s;z-index:20}
.scrim.show{opacity:1;pointer-events:auto}

/* ---------- 命盤資料面板（可多人合盤） ---------- */
.bd-panel{
  max-width:820px;margin:0 auto 8px;background:#fff;border:1px solid var(--line);
  border-radius:16px;padding:9px 12px;
}
.bd-head{display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-size:13px;font-weight:600;color:var(--brand);
  min-width:0;text-wrap:balance}
.bd-head svg,.bd-head em{flex:0 0 auto}
.bd-head em{font-style:normal;font-weight:400;color:#9ca3af;font-size:11px;margin-left:6px}
.bd-rows{display:none;margin-top:10px;max-height:36vh;overflow-y:auto;-webkit-overflow-scrolling:touch}
.bd-row{padding:9px 0;border-top:1px solid #f1f1f4}
.bd-row:first-child{border-top:0;padding-top:0}
.bdTop{display:flex;gap:6px;align-items:center;margin-bottom:6px}
.bdTop select,.bdTop input{height:32px;border:1px solid var(--line);border-radius:9px;background:#fff;font:inherit;font-size:13px;padding:0 8px;color:var(--ink);outline:none;box-sizing:border-box}
.bdRel{flex:1;min-width:0}
/* 2026-10-19：自訂名稱改為獨立一行、永遠可填（白底實線，一眼睇到可以打字） */
.bdRelC{display:block;width:100%;height:32px;margin-bottom:6px;border:1px solid #ddd6fe;border-radius:9px;background:#fff;font:inherit;font-size:13px;padding:0 9px;color:var(--ink);outline:none;box-sizing:border-box}
.bdRelC::placeholder{color:#a9a2bb}
.bdRelC:focus{border-color:#b9a3f5;box-shadow:0 0 0 3px rgba(124,58,237,.08)}
.bdRelC.on{border-color:#b9a3f5}
.bdSex{width:62px;flex:0 0 auto}
.bdDel{width:28px;height:28px;flex:0 0 auto;border:0;border-radius:8px;background:var(--fill);color:#b3b3bb;font-size:16px;line-height:1;cursor:pointer}
.bdDate,.bdTime{display:flex;gap:4px;align-items:center;font-size:11.5px;color:#9ca3af;flex-wrap:wrap}
.bdTime{margin-top:6px}
.bdDate input,.bdTime input{width:44px;height:30px;border:1px solid var(--line);border-radius:8px;text-align:center;font:inherit;font-size:13px;outline:none;background:#fff;color:var(--ink);box-sizing:border-box}
.bdDate input.bdY{width:56px}
.bdDate select,.bdTime select{height:30px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:12px;background:#fff;color:var(--ink);outline:none;padding:0 4px}
.bd-actions{display:none;gap:6px;margin-top:8px}
.bd-add,.bd-save,.bd-matrix{flex:1;min-width:0;text-align:center;font-size:11.5px;border-radius:10px;padding:8px 4px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bd-add{color:var(--brand);border:1px dashed #d9d2f2}
.bd-save{color:#fff;background:var(--brand);border:1px solid var(--brand)}
.bd-matrix{color:#7c3aed;border:1px solid #e2d9fb;background:#faf7ff}
.bd-matrix em{font-style:normal;color:#9ca3af;font-size:11px;margin-left:3px}
.bd-tip{display:none;margin-top:8px;font-size:11px;color:#9ca3af;line-height:1.7}
.bd-tip b{color:var(--brand)}
/* 2026-10-19 John：命盤對不上已存八字 → 面板頂「已存」一撳即填 */
.bd-saved{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:2px 0 8px}
.bd-saved[hidden]{display:none}
.bd-saved-lb{font-size:11px;color:#9ca3af;font-weight:700}
.bd-saved-btn{
  border:1px solid #e2d9fb;background:#faf7ff;color:#7c3aed;border-radius:999px;
  padding:5px 11px;font-size:11.5px;font-weight:700;font-family:inherit;cursor:pointer;
  max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.bd-saved-btn:active{background:var(--brand-soft);transform:scale(.97)}
/* 2026-10-19 John：出生日期係「今日／未來」→ 即時紅字提示，免得拿錯盤去分析 */
.bd-row.is-warn .bdY,.bd-row.is-warn .bdM,.bd-row.is-warn .bdD{
  border-color:#e11d48;background:#fff1f2;color:#be123c;font-weight:700
}

/* ---------- 關係矩陣 ---------- */
/* 2026-10-22 John：「命盤資料彈層擋住關係矩陣」——彈層 z-index 9998，矩陣原本只有 75
   → 由「命盤資料」開矩陣時會被彈層蓋住。矩陣一律提到 9999，開喺彈層之上，
   關閉矩陣就返去原本嘅命盤資料彈層（唔會丟失填寫狀態）。 */
.mx{position:fixed;inset:0;z-index:9999;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.32)}
.mx[hidden]{display:none}
.mx-card{
  width:100%;max-width:520px;max-height:78vh;background:#fff;
  border-radius:20px 20px 0 0;padding:6px 0 calc(var(--safe-b) + 10px);
  display:flex;flex-direction:column;animation:mxup .22s cubic-bezier(.22,.7,.3,1);
}
@keyframes mxup{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
.mx-head{display:flex;align-items:center;justify-content:space-between;padding:12px 10px 10px 18px;border-bottom:1px solid var(--line);flex:0 0 auto}
.mx-head strong{font-size:15px}
.mx-sub{margin:10px 18px 6px;font-size:11.5px;color:#9ca3af;line-height:1.65;flex:0 0 auto}
.mx-list{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:6px 12px 8px;-webkit-overflow-scrolling:touch}
.mx-item{display:flex;align-items:center;gap:10px;padding:11px 10px;border-radius:12px;border:1px solid var(--line);margin-top:8px;background:#fff}
.mx-item:first-child{margin-top:2px}
.mx-idx{flex:0 0 auto;width:22px;height:22px;border-radius:50%;background:var(--brand-soft);color:var(--brand);font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}
.mx-main{flex:1;min-width:0}
.mx-name{font-size:14px;font-weight:600;color:var(--ink);margin-bottom:3px}
.mx-meta{font-size:11.5px;color:#9ca3af;line-height:1.55;word-break:break-word}
.mx-meta div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mx-del{flex:0 0 auto;height:30px;padding:0 12px;border:0;border-radius:9px;background:#fdeceb;color:#c0392b;font-family:inherit;font-size:12.5px;cursor:pointer}
.mx-del:active{background:#f9dcdb}
.mx-empty{padding:26px 12px;text-align:center;color:var(--muted);font-size:13px;line-height:1.8}
.mx-clear{margin:6px 12px 2px;padding:11px;border:0;border-radius:12px;background:var(--fill);color:#c0392b;font-size:13.5px;font-family:inherit;cursor:pointer;flex:0 0 auto}
.mx-clear.confirm{background:#fdeceb;font-weight:600}

/* ---------- 分享給朋友（轉發） ---------- */
.sh-body{padding:14px 18px calc(var(--safe-b) + 14px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;text-align:center}
.sh-poster{width:100%;max-width:300px;height:auto;border-radius:14px;box-shadow:0 6px 20px rgba(23,16,43,.14);background:#fff;display:block;margin:0 auto;-webkit-touch-callout:default}
.sh-wx{margin:0 0 14px;width:100%;height:46px;border:0;border-radius:12px;background:#07c160;color:#fff;font-family:inherit;font-size:15px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}
.sh-wx:active{opacity:.86}
.sh-native{background:var(--brand)}   /* 非微信環境：直接分享連結（品牌紫，唔用微信綠） */
.sh-native:active{opacity:.86}
.sh-warn{margin:0 0 12px;padding:11px 13px;border-radius:11px;background:#fff8e6;border:1px solid #ffe1a6;color:#8a5a00;font-size:12.5px;line-height:1.75;text-align:left}
.sh-warn[hidden]{display:none}
.sh-tip{margin:14px 0 6px;text-align:left;font-size:11.5px;color:#9ca3af;line-height:1.8}
.sh-tip b{color:var(--ink)}

/* ---------- 微信轉發指引（覆蓋層） ---------- */
.wx-guide{position:fixed;inset:0;z-index:60;background:rgba(12,8,22,.82);display:flex;flex-direction:column;align-items:flex-end;padding:calc(var(--safe-t) + 12px) 20px 0}
.wx-guide[hidden]{display:none}
.wx-arw{font-size:40px;line-height:1;color:#07c160;font-weight:700;animation:wxarw 1.15s ease-in-out infinite}
@keyframes wxarw{0%,100%{transform:translate(0,0)}50%{transform:translate(4px,-7px)}}
.wx-txt{margin-top:10px;text-align:right;color:#fff;font-size:16px;font-weight:700;line-height:1.7}
.wx-sub{margin-top:8px;text-align:right;color:#cfc9e0;font-size:12.5px;line-height:1.7;max-width:78%}
.wx-close{margin-top:30px;margin-bottom:0;align-self:center;padding:13px 40px;border:0;border-radius:13px;background:#07c160;color:#fff;font-family:inherit;font-size:15px;font-weight:700;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.3)}
.wx-close:active{background:#06a852}

@media(min-width:820px){
  .empty-title{font-size:26px}
  .bubble{max-width:70%}
}

/* ---------- 示範問題集入口（AI 首頁） ---------- */
/* 2026-10-21 John：「把不知道問什麼？點我！這個按鈕縮小，統一放左上角」→
   再由 John 指定：「放在左上頂部，抽屜掣隔壁，別挨太近」→ 搬入頂欄左組，與 ☰ 相距 10px。 */
.topbar-left{display:flex;align-items:center;gap:10px;min-width:0;flex:1 1 auto;overflow:hidden}
.ask-guide-btn{
  margin:0;padding:5px 10px;border:1px dashed #c9b8f5;border-radius:999px;
  background:#fff;color:var(--brand);font-size:11.5px;font-weight:600;
  font-family:inherit;cursor:pointer;transition:background .15s,transform .1s;
  -webkit-user-select:none;user-select:none;white-space:nowrap;line-height:1.5;
  box-shadow:0 1px 2px rgba(109,79,211,.10);flex:0 0 auto;max-width:58vw;
  overflow:hidden;text-overflow:ellipsis;
}
.ask-guide-btn[hidden]{display:none}
.ask-guide-btn:active{background:#e6dcfb;transform:scale(.97)}

/* 2026-10-20 John：訪客數＋IP＋祝福語（同主站九宮格同款） */
.xd-visit{font-size:9px;color:#a9a3b5;letter-spacing:1px;text-align:center;line-height:1.6;margin-top:-2px}
.xd-visit #visitorCount{color:#8f87a3;font-weight:700}
.xd-visit #visitorLoc{color:#b3acc1}
.xd-bless{display:flex;align-items:center;justify-content:center;gap:5px;font-size:11px;color:#8b5cf6;
  letter-spacing:1.5px;line-height:1.4;margin-top:1px;white-space:nowrap}
.xd-taiji{width:15px;height:15px;border-radius:50%;object-fit:cover;flex:0 0 15px;animation:xdTaiji 7s linear infinite}
@keyframes xdTaiji{to{transform:rotate(360deg)}}

/* 2026-10-20 John：logo／生活有道整體上移少少 */
.empty{padding-bottom:6px}
.empty .brand-logo{margin-top:2px}
/* 2026-10-20 John：「隔太遠」⇒ 品牌區四行收緊 */
/* 2026-10-21 John：「最上面 logo 跟生活有道 文字的上下間隔寬一些」→ logo 同標題之間放寬 */
.empty .brand-logo{margin-bottom:8px}
/* 2026-10-21 John：「生活有道」同下面訪客數字行再隔開一些 */
.empty-title{margin-bottom:2px}
.xd-visit{margin-top:2px}
.xd-bless{margin-top:-4px}
.life-grid{margin-top:8px}

/* ---------- 2026-10-15 John 通過（1+2+3）：首頁「生活入口」＋「我的偏好」＋「我的清單」 ---------- */
/* 2026-10-20 John：六格改成兩排三欄（每排三個） */
.life-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px 7px;width:100%;max-width:400px;margin:12px auto 0}
.life-grid[hidden]{display:none}
.life-btn{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  padding:11px 6px 10px;border:1px solid #e7e1f4;
  border-radius:16px;background:linear-gradient(180deg,#fff 0%,#faf7ff 100%);color:var(--ink);
  font-size:13.5px;font-weight:700;
  font-family:inherit;cursor:pointer;text-align:center;
  transition:background .15s,transform .1s,border-color .15s,box-shadow .15s;
  -webkit-user-select:none;user-select:none;min-height:74px;
  /* 2026-10-20 John：「六張卡加返少少立體感」→ 頂部高光＋兩層投影＋底邊稍深，似微微浮起 */
  background:linear-gradient(180deg,#ffffff 0%,#fbf9ff 62%,#f6f2ff 100%);
  border-color:#e7e1f4;
  border-bottom-color:#ddd3f0;
  box-shadow:inset 0 1px 0 #ffffff, 0 1px 1px rgba(94,53,177,.06), 0 4px 10px -6px rgba(94,53,177,.28);
}
.life-btn .lb-ic{font-size:20px;line-height:1}
/* 2026-10-22 John：首頁六格立體圖標 */
.life-btn .lb-img{display:block;width:32px;height:32px;border-radius:9px;margin:0 auto;object-fit:cover;
  box-shadow:0 2px 5px rgba(60,40,20,.14)}
/* 三欄後每格窄咗 → 收細內距同字級，保持「圖示＋短名＋一句說明」不換行 */
.life-grid .life-btn{min-height:68px;padding:9px 4px 8px;gap:3px;border-radius:14px;font-size:12.5px}
.life-grid .life-btn .lb-sub{font-size:9.5px;letter-spacing:-.01em}
/* 2026-10-16 John：「卡片字太多太難看」「副標題不用加」→ 卡片只有圖示 + 一行短名 */
.life-btn .lb-tx{display:block;min-width:0;width:100%;text-align:center;letter-spacing:.03em}
.life-btn .lb-nm{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}
/* 2026-10-19 John：六個首頁卡加一句副標題（功能說明），字細、單行、超長省略 */
.life-btn .lb-sub{display:block;width:100%;font-size:10.5px;font-weight:500;color:#8b8399;
  line-height:1.2;letter-spacing:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.life-btn:active{background:var(--brand-soft);transform:scale(.97);
  box-shadow:inset 0 1px 3px rgba(94,53,177,.16), 0 1px 1px rgba(94,53,177,.04)}
.life-row{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:4px}
/* ---------- 2026-10-16 John：首頁快捷格「預設空白」＋ 用戶自訂 ----------
   2026-10-16 再改：首頁唔再擺「＋」入口（John：唔好看）→ 入口移去抽屜「生活技能」下面。
   呢度只保留格仔本身嘅排版。 ---------- */
@media (max-height:640px){.empty{gap:6px;transform:none}.life-btn{min-height:60px;padding:7px 6px;font-size:12.5px}.life-btn .lb-ic{font-size:18px}}
.life-grid.is-empty{grid-template-columns:1fr}
.hp-count{font-size:12px;color:var(--muted);font-weight:700;margin:2px 0 8px}
/* 2026-10-16 John：自訂面板左上角「← 返回」（唔改動就退出） */
.hp-head{display:flex;align-items:center;gap:9px;margin:0 0 9px}
.hp-back{border:1px solid var(--line);background:#fff;color:var(--brand);border-radius:11px;
  padding:6px 12px;font-size:12.5px;font-weight:700;font-family:inherit;cursor:pointer;
  -webkit-user-select:none;user-select:none}
.hp-back:active{background:var(--brand-soft);transform:scale(.97)}
.hp-ttl{font-size:13.5px;font-weight:800;color:var(--brand)}
.hp-g{font-size:12.5px;font-weight:800;color:var(--brand);margin:11px 0 6px}
.hp-wrap{display:flex;flex-wrap:wrap;gap:6px}
.hp-chip{
  padding:6px 11px;border:1px solid var(--line);border-radius:999px;background:#fff;color:#4b4b55;
  font-size:12px;font-weight:600;font-family:inherit;cursor:pointer;max-width:100%;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.hp-chip.on{background:var(--brand);border-color:var(--brand);color:#fff}
.life-mini{
  padding:7px 15px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--brand);
  font-size:12.5px;font-weight:600;font-family:inherit;cursor:pointer;transition:background .15s,transform .1s;
}
.life-mini:active{background:var(--brand-soft);transform:scale(.97)}
.life-mini .lm-n{display:inline-block;min-width:15px;padding:0 4px;margin-left:4px;border-radius:8px;
  background:var(--brand);color:#fff;font-size:10.5px;line-height:15px;text-align:center;font-weight:700}
/* 偏好面板（沿用計劃卡外觀） */
.pf-tip{font-size:11.5px;color:var(--muted);line-height:1.6;margin:2px 0 4px}
.pf-chk{display:flex;flex-wrap:wrap;gap:6px;margin:3px 0 2px}
.pf-cbtn{padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink-2);
  font-size:12px;font-weight:600;font-family:inherit;cursor:pointer}
.pf-cbtn.is-on{background:var(--brand);border-color:var(--brand);color:#fff}
/* 2026-10-18 John：我的偏好改成「生活全貌」——分類摺疊 ＋ 快選標籤 ＋ 自由填寫 */
.pf-cat{border:1px solid var(--line);border-radius:11px;margin:7px 0;overflow:hidden;background:#fff}
.pf-cat-h{display:flex;align-items:center;gap:8px;width:100%;padding:10px 11px;border:0;background:#fff;
  font-family:inherit;cursor:pointer;text-align:left}
.pf-cat-h:active{background:var(--brand-soft)}
.pf-cat-n{flex:1;font-size:13px;font-weight:700;color:var(--ink);min-width:0}
.pf-cat-s{font-style:normal;font-size:11px;color:var(--muted);flex:0 0 auto}
.pf-cat-a{font-style:normal;font-size:11px;color:#b3a9c6;flex:0 0 auto}
.pf-cat-b{padding:2px 11px 11px;border-top:1px dashed var(--line)}
.pf-cityrow{display:flex;align-items:center;gap:7px;margin:9px 0 6px}
.pf-cityrow label{flex:0 0 76px;font-size:12px;color:#6b6b76}
.pf-city{flex:1;min-width:0;padding:7px 9px;border:1px solid #e6e2f2;border-radius:8px;font:inherit;font-size:13px}
.pf-note{width:100%;margin-top:7px;padding:8px 10px;border:1px solid #e6e2f2;border-radius:9px;
  font:inherit;font-size:12.5px;line-height:1.6;resize:vertical;min-height:46px;box-sizing:border-box}
.pf-note:focus,.pf-city:focus{outline:none;border-color:var(--brand)}
/* 2026-10-18 John：命盤資料搬入「我的偏好」卡內 */
.pf-sec{margin:12px -2px 2px;padding-top:11px;border-top:1px dashed var(--line)}
.pf-sec-t{font-size:13px;font-weight:700;color:var(--brand-deep,#5e35b1);line-height:1.4}
.pf-sec-d{font-size:11.5px;color:var(--muted);line-height:1.6;margin:3px 0 6px}
.pf-bdslot .bd-panel{margin:0;padding:0;border:0;background:transparent;border-radius:0;max-width:none}
.pf-bdslot .bd-rows{max-height:none}
/* 卡內唔再重複顯示面板自帶標題（上面已有「📇 命盤資料（可多人合盤）」） */
.pf-bdslot .bd-head{display:none}
.pf-bdslot .bdDate,.pf-bdslot .bdTime{gap:3px}
.pf-bdslot .bdDate input,.pf-bdslot .bdTime input{width:42px}
.pf-bdslot .bdDate input.bdY{width:58px}
/* 2026-10-18 John：命盤資料面板放喺「命理咨詢」分頁頂 */
.fate-bd{margin:0 0 10px}
.fate-bd .bd-panel{max-width:none;margin:0;padding:11px 12px;border:1px solid var(--line);border-radius:13px;background:#fff}
.fate-bd .bd-rows{max-height:none}
.fate-bd .bdDate,.fate-bd .bdTime{gap:3px}
.fate-bd .bdDate input,.fate-bd .bdTime input{width:42px}
.fate-bd .bdDate input.bdY{width:56px}
/* 2026-10-18 John：抽屜新增「🔮 命理咨詢」分頁 —— 首頁命理功能全部變卡片 */
.chip-off{display:none!important}
.fate-wrap{flex:1;min-height:0;overflow-y:auto;padding:10px 12px calc(16px + var(--safe-b));-webkit-overflow-scrolling:touch}
.fate-head{font-size:13px;font-weight:700;color:#5e35b1;margin:2px 2px 9px}
.fate-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.fate-card{display:flex;flex-direction:column;gap:2px;text-align:left;padding:10px 11px;border:1px solid var(--line);
  border-radius:12px;background:#fff;font-family:inherit;cursor:pointer;min-width:0;transition:background .15s,transform .1s}
.fate-card:active{background:var(--brand-soft);transform:scale(.985)}
.fate-card .fc-i{font-size:17px;line-height:1.2}
.fate-card .fc-n{font-size:13px;font-weight:700;color:var(--ink);line-height:1.3;white-space:normal;overflow-wrap:break-word}
.fate-card .fc-d{font-size:11px;color:var(--muted);line-height:1.45}
.fate-tip{font-size:11.5px;color:var(--muted);line-height:1.7;margin-top:11px;padding-top:9px;border-top:1px dashed var(--line)}
/* 2026-10-18 John：抽屜第 4 個分頁「📝 備忘錄」
   2026-10-21 改卡片式後，唔再需要縮字／縮 padding（舊規則會壓扁新卡片，已移除） */
.memo-list{display:flex;flex-direction:column;flex:1;min-height:0}/* [hidden] 要贏過 display:flex，否則清單同編輯頁會同時出現 */
.memo-list[hidden],.memo-edit[hidden]{display:none!important}
.memo-bar{display:flex;gap:7px;margin:8px 12px 6px;flex:0 0 auto}
.memo-bar input{flex:1;min-width:0;height:36px;padding:0 13px;border:0;border-radius:18px;background:var(--fill-2);
  font:inherit;font-size:13.5px;color:var(--ink);outline:none}
.memo-bar #memoNew{width:36px;height:36px;flex:0 0 auto;border:0;border-radius:50%;background:var(--brand);
  color:#fff;font-size:20px;line-height:1;cursor:pointer;font-family:inherit}
.memo-items{flex:1;overflow-y:auto;padding:2px 8px 16px;-webkit-overflow-scrolling:touch}
.memo-day{margin:12px 8px 6px;font-size:12px;font-weight:700;color:#a3a3ac}
.memo-item{display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;padding:11px 12px;margin-bottom:7px;
  border:1px solid var(--line);border-radius:12px;background:#fff;font-family:inherit;cursor:pointer;min-width:0}
.memo-item:active{background:var(--brand-soft)}
.memo-item .mi-t{font-size:13.5px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.memo-item .mi-s{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.memo-empty{margin:36px 16px;text-align:center;font-size:12.5px;color:var(--muted);line-height:1.9}
.memo-edit{display:flex;flex-direction:column;flex:1;min-height:0;padding:0 12px calc(12px + var(--safe-b))}
.memo-edit-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 0 8px;flex:0 0 auto}
.memo-edit-bar button{border:0;background:transparent;color:var(--brand);font:inherit;font-size:13px;font-weight:700;
  cursor:pointer;padding:4px 2px;font-family:inherit}
.memo-edit-bar #memoWhen{font-size:11px;color:var(--muted);flex:1;text-align:center;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.memo-edit-bar #memoDel{color:#c0392b}
.memo-edit-bar #memoDel.armed{background:#fdeceb;border-radius:8px;padding:4px 10px}
#memoTitle{width:100%;border:0;background:transparent;font:inherit;font-size:17px;font-weight:700;color:var(--ink);
  padding:4px 2px 8px;outline:none}
#memoBody{flex:1;min-height:160px;width:100%;border:0;background:transparent;font:inherit;font-size:13.5px;
  line-height:1.8;color:var(--ink);resize:none;outline:none;padding:2px 2px 10px}
/* 左邊抽屜：我的偏好 / 我的清單 / 我的提醒（發過訊息後首頁會收起，呢度要入得返） */
.drawer-life{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:10px 12px 4px;flex:0 0 auto}
/* 系統字體放大：格內按鈕唔可以撐爆格 → min-width:0 ＋ 容許兩行 */
.drawer-life>*{min-width:0}
.dl-btn{
  padding:9px 4px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--brand);
  font-size:11.5px;font-weight:700;font-family:inherit;cursor:pointer;transition:background .15s;
  white-space:normal;line-height:1.22;overflow-wrap:break-word;
}
.dl-btn:active{background:var(--brand-soft)}
/* 2026-10-16 John：生活技能頁左下空白 → 「個人命理報告」廣告卡（用圖一 banner，整張圖可點、帶連結） */
.drawer-ad{
  display:block;flex:0 0 auto;overflow:hidden;text-decoration:none;
  margin:12px 12px calc(var(--safe-b) + 4px);margin-top:auto;
  border-radius:14px;border:1px solid #e2d5f8;background:#f6f0ff;
  box-shadow:0 3px 12px rgba(94,53,177,.12);transition:transform .15s;
}
.drawer-ad:active{transform:scale(.985)}
.drawer-ad .da-img{display:block;width:100%;height:auto}
/* 2026-10-16：廣告卡移入 .drawer-skills 之後，側邊 margin 由容器 padding 提供（免雙重內縮） */
.drawer-skills .drawer-ad{margin:12px 0 calc(var(--safe-b) + 4px)}
/* 站內提醒橫幅（方案 4） */
.rem-banner{
  /* 2026-10-19 修：.empty{position:absolute;inset:0} 會蓋住橫幅 → 按鈕點不到（John 報「提醒點擊沒反應」）。
     加 z-index 疊上去，並禁止 flex 壓縮。 */
  position:relative;z-index:6;flex:0 0 auto;
  margin:9px 12px 0;padding:10px 12px;border:1px solid #f0d79a;background:#fff8e6;border-radius:12px;
  font-size:12.5px;color:#6b5416;line-height:1.65;
}
.rem-banner .rb-t{font-weight:700;color:#8a6d24}
.rem-banner .rb-act{display:flex;gap:7px;margin-top:7px;flex-wrap:wrap}
.rem-banner .rb-act button{
  padding:6px 12px;border:1px solid #e8d7a8;border-radius:999px;background:#fff;color:#8a6d24;
  font-size:12px;font-weight:700;font-family:inherit;cursor:pointer;
}
.rem-banner .rb-act button.rb-ok{background:#8a6d24;border-color:#8a6d24;color:#fff}
/* 「買乜好」分流卡（送禮 / 自己・家庭）—— 兩條路分開 */
.buy-2{display:grid;grid-template-columns:1fr;gap:8px;margin:8px 0 2px}
@media(min-width:520px){.buy-2{grid-template-columns:1fr 1fr}}
.buy-opt{
  display:flex;align-items:center;gap:10px;padding:12px 13px;border:1px solid #ece7fb;border-radius:12px;
  background:#faf8ff;color:var(--ink, #111214);font-size:14px;font-weight:700;font-family:inherit;
  cursor:pointer;text-align:left;transition:background .15s,transform .1s;
}
.buy-opt .bo-ic{font-size:22px;line-height:1}
.buy-opt .bo-tx{display:flex;flex-direction:column;gap:2px;min-width:0;font-weight:700}
.buy-opt .bo-tx em{font-style:normal;font-size:11px;color:#8a8a95;font-weight:400}
.buy-opt:active{background:#f1ecfd;transform:scale(.98)}
/* 收藏清單頁 */
.fav-wrap{max-width:880px;margin:0 auto;padding:20px 15px 56px}
.fav-card{background:#fff;border:1px solid var(--line);border-radius:13px;padding:12px 13px;margin-bottom:9px}
.fav-n{font-size:14.5px;font-weight:700;color:var(--brand)}
.fav-m{font-size:12.5px;color:#4b4b55;margin-top:3px;line-height:1.6}
.fav-act{display:flex;gap:7px;margin-top:9px;flex-wrap:wrap}
.fav-act a,.fav-act button{padding:7px 13px;border-radius:9px;border:1px solid var(--line);background:#fff;
  color:var(--brand);font-size:12.5px;font-weight:700;text-decoration:none;font-family:inherit;cursor:pointer}
.fav-act .del{color:#c0392b}

/* ---------- 功能模組列（2026-10-10：移至「命盤資料」上方） ---------- */
.composer-actions{justify-content:flex-end}
/* 豆包式可滑動：一列橫向捲動、右緣漸層提示還有更多、滑到底提示自動消失 */
.mode-row{position:relative;max-width:820px;margin:2px auto 4px}
.mode-row .chips{
  padding:1px 12px 3px;gap:7px;
  overscroll-behavior-x:contain;touch-action:pan-x;
  scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;
}
.mode-row .chips .chip{scroll-snap-align:start}
.mode-row::after{
  content:'';position:absolute;top:0;right:0;bottom:0;width:30px;pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,0) 0%,#fff 78%);
  opacity:1;transition:opacity .2s;border-radius:0 10px 10px 0;
}
.mode-row.at-end::after{opacity:0}
.mode-row.at-start .chips{mask-image:none}
/* 2026-10-20 John：語音掣釘喺功能列右邊，唔跟 chips 一齊捲走，永遠見到 */
.mode-row{display:flex;align-items:center;gap:8px;padding:0 12px}
.mode-row .chips{flex:1 1 auto;padding:1px 0 3px}
.mode-row .voice-pill{flex:0 0 auto;position:relative;z-index:2;background:#fff;padding:0 11px;gap:4px}
.mode-row .voice-pill .v-lbl{font-weight:600}
.mode-row .voice-pill.is-on{background:var(--brand-soft);color:var(--brand);border-color:transparent}
.mode-row .voice-pill.is-on .dot{background:var(--brand)}
/* 手機：四個掣拉成同一行、同一大細（快速問答／深度解析／情感木木／語音） */
@media (max-width:480px){
  .mode-row{display:flex;gap:6px;padding:0 10px}
  .mode-row .chips{display:contents}
  .mode-row .chip{flex:1 1 0;min-width:0;justify-content:center;overflow:hidden;font-size:11px;padding:0 4px;gap:2px}
  .mode-row .voice-pill{flex:1 1 0;min-width:0;width:auto;justify-content:center;gap:2px;font-size:11px;padding:0 4px;background:var(--brand-soft);border-color:transparent;color:var(--brand)}
  .mode-row .voice-pill .v-lbl{display:inline}
  .mode-row .voice-pill .dot{display:none}
  .mode-row .voice-pill.is-on{background:var(--brand);color:#fff}
}
/* 語音按需展開：語言 ＋ 說話 ＋ 只限瀏覽器使用（預設收埋，唔佔位） */
.voice-row{display:flex;align-items:center;gap:6px;max-width:820px;margin:0 auto 6px;padding:0 12px}
.voice-row[hidden]{display:none}
.voice-row button{
  flex:0 0 auto;min-width:84px;height:32px;padding:0 14px;border-radius:16px;border:1px solid var(--line);
  background:#fff;color:var(--ink-2);font-size:12.5px;font-weight:600;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:4px;
}
.voice-row button:active{background:var(--fill)}
.voice-row #vTalkBtn{border-color:transparent;background:var(--brand-soft);color:var(--brand)}
.voice-row #vTalkBtn.rec{background:#feebee;color:#c2185b}
@media (max-width:400px){ .voice-row button{min-width:72px;padding:0 8px} .voice-row{gap:5px;padding:0 10px} .voice-row #wxTip{font-size:9.5px} }
.voice-row #wxTip{flex:1 1 auto;font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;line-height:1.2}
.voice-row #wxTip[hidden]{display:none}

/* 單行輸入（2026-10-10）：輸入與確認鍵同一行 */
.composer-card .actions-right{gap:8px}

/* ---------- 奇門遁甲：專屬輸入 + 九宮局盤（2026-10-10） ---------- */
.qm-panel{max-width:820px;margin:0 auto 8px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:9px 12px}
.qm-panel[hidden]{display:none}
.qm-head{display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-size:13px;font-weight:600;color:var(--brand)}
.qm-head em{font-style:normal;font-weight:400;color:#9ca3af;font-size:11px;margin-left:6px}
/* 2026-10-21 John：「生活有道的風水跟九宮飛星呢？」→ 同九宮格同一套：主標 + 一句 · 分隔副標 */
.qm-head .qm-ttl{display:flex;flex-direction:column;gap:1px;min-width:0;text-align:left}
.qm-head .qm-ttl .qm-hsub{font-size:10.5px;font-weight:500;color:#9ca3af;letter-spacing:0;
  line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qm-body{margin-top:10px}
/* 2026-10-21 John 截圖「都卡住了」→ 面板變長後撐爆 composer（body overflow:hidden，無法滾動）
   修正：面板內容自己滾，卡頭同輸入框永遠留在畫面內 */
.qm-body{max-height:min(58vh,430px);overflow-y:auto;overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;padding-right:2px}
.qm-body::-webkit-scrollbar{width:4px}
.qm-body::-webkit-scrollbar-thumb{background:#ddd3f0;border-radius:4px}
.qm-body[hidden]{display:none}
.qm-row{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.qm-row label{flex:0 0 58px;font-size:12px;color:#8a8a95}
.qm-row select,.qm-row input{flex:1;min-width:0;height:34px;border:1px solid var(--line);border-radius:12px;background:#fff;font:inherit;font-size:13px;padding:0 8px;color:var(--ink);outline:none;box-sizing:border-box}
.qm-now{flex:0 0 auto;height:32px;padding:0 12px;border:1px solid #e2d9fb;background:#faf7ff;color:#7c3aed;border-radius:9px;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.qm-tip{margin-top:8px;font-size:11px;color:#9ca3af;line-height:1.7}
.qm-card{font-size:13px;line-height:1.7;color:#3c3f45}
.qm-title{font-size:14px;font-weight:700;color:var(--brand);margin-bottom:3px}
.qm-meta{font-size:11.5px;color:#8a8a95;margin-bottom:8px}
.qm-keys{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.qm-k{font-size:11.5px;background:#f6f2ff;border-radius:8px;padding:4px 8px;color:#5e35b1}
.qm-k i{font-style:normal;color:#9ca3af;margin-right:4px}
.qm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;background:#f7f7fa;border-radius:12px;padding:4px}
.qm-cell{background:#fff;border-radius:9px;padding:5px 3px;text-align:center;border:1px solid #eef0f4;min-height:76px}
.qm-cell.good{background:#f2fbf5;border-color:#cdeed9}
.qm-cell.bad{background:#fef4f4;border-color:#f7d5d5}
.qm-cell.mid{background:#fbfbfd}
.qm-c1{font-size:11px;color:#5e35b1;font-weight:700;display:flex;flex-wrap:wrap;gap:3px;justify-content:center;align-items:center}
.qm-c1 span{font-weight:400;color:#9ca3af;font-size:10px}
.qm-tag{font-style:normal;font-size:9px;border-radius:4px;padding:0 3px;color:#fff}
.qm-tag.zf{background:#7c3aed}
.qm-tag.zs{background:#ef4444}
.qm-men{font-size:12.5px;font-weight:700;color:#111214;margin-top:2px}
.qm-star{font-size:10.5px;color:#6b7280}
.qm-shen{font-size:10.5px;color:#8a6a1c}
.qm-gan{font-size:10.5px;color:#8a8a95;margin-top:2px}
.qm-geju{font-size:9.5px;color:#b0b0b8}
.qm-legend{font-size:10px;color:#b0b0b8;margin:6px 0 10px;line-height:1.6}
.qm-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin:0 2px}
.qm-dot.good{background:#34c77b}.qm-dot.mid{background:#c9c9d1}.qm-dot.bad{background:#ef4444}
.qm-sec{margin-bottom:8px}
.qm-sec b{display:block;color:var(--brand);font-size:12.5px;margin-bottom:2px}
.qm-sub{font-size:12.5px;font-weight:700;color:#5e35b1;margin:10px 0 6px;border-top:1px solid #f0f0f4;padding-top:8px}
.qm-ap{font-size:12.5px;line-height:1.75}
.qm-ap-line{color:#5e35b1;font-weight:600}
.qm-yi{color:#15803d}
.qm-ji{color:#b91c1c}
.qm-lim{margin-top:8px;font-size:11px;color:#9ca3af;line-height:1.7}
.qm-foot{margin-top:8px;font-size:10.5px;color:#b0b0b8;border-top:1px solid #f0f0f4;padding-top:6px}

/* ---------- 流年九宮飛星卡（2026-10-11） ---------- */
.fs-card{margin-bottom:10px}
.fs-title{font-size:13px;font-weight:700;color:var(--brand,#7c3aed);margin-bottom:6px}
.fs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;background:#f7f7fa;border-radius:12px;padding:4px}
.fs-cell{background:#fff;border-radius:9px;padding:5px 3px;text-align:center;border:1px solid #eef0f4;min-height:74px}
.fs-cell.fs-good{background:#f2fbf5;border-color:#cdeed9}
.fs-cell.fs-bad{background:#fef4f4;border-color:#f7d5d5}
.fs-cell.fs-mid{background:#fbfbfd}
.fs-c1{font-size:10.5px;color:#5e35b1;font-weight:700}
.fs-star{font-size:13.5px;font-weight:800;color:#111214;margin-top:2px}
.fs-luck{font-size:10px;color:#8a8a95}
.fs-cell.fs-good .fs-luck{color:#15803d;font-weight:700}
.fs-cell.fs-bad .fs-luck{color:#b91c1c;font-weight:700}
.fs-zhu{font-size:9px;color:#b0b0b8;line-height:1.35;margin-top:2px}
.fs-foot{font-size:10px;color:#b0b0b8;margin-top:5px}

/* 木木專屬語音鍵（2026-10-12，tencent custom-clone） */
.mumu-speak{margin:0 0 10px;display:inline-flex;align-items:center;gap:6px;padding:0 16px;min-height:44px;border-radius:999px;border:1px solid #c9b8f0;background:#f6f2ff;color:#6b4bb5;font-size:14px;font-weight:600;line-height:1.2;cursor:pointer;}
.mumu-speak:active{background:#ece3ff;}

/* 深度解析答案底部：申請專屬命理報告 CTA（2026-10-13 用戶選 B 方案） */
.report-cta{display:block;margin:13px 0 2px;padding:11px 12px;border-radius:12px;border:1px solid #d9c9f5;background:linear-gradient(180deg,#faf7ff,#f3ecff);text-decoration:none;color:inherit;line-height:1.45;}
.report-cta:active{background:#ece3ff;}
.report-cta .rc-t{display:block;font-size:13.5px;font-weight:700;color:#5b21b6;}
.report-cta .rc-d{display:block;font-size:11.5px;color:#8b8b96;margin-top:3px;}
.report-cta .rc-b{display:inline-block;margin-top:8px;padding:6px 15px;border-radius:999px;background:#6b4bb5;color:#fff;font-size:12.5px;font-weight:700;letter-spacing:.02em;}

/* 自我學習：答案下嘅「✏️ 答錯？糾正」＋提交面板（2026-10-15） */
.fix-wrap{margin-top:8px}
/* 2026-10-19（報告 P1-04）：答案操作鍵原本 11.5px／約 20px 高，手指難撳。
   改為 ≥44px 觸控目標、13px 字、白底細紫邊，主次清楚。 */
.fix-btn{background:#fff;border:1px solid #e3dbf5;border-radius:999px;padding:0 14px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:4px;font-size:13px;color:#6b5b8a;cursor:pointer;letter-spacing:.02em;text-decoration:none;line-height:1.2}
.fix-btn:active{color:#6b4bb5}
/* 2026-10-19 John：「底下標籤細一點，最好一排過」——答案下操作列固定一列（可橫向滑），
   字細、掣矮；只作用於 .act-row，唔影響糾正表單同其他 .fix-btn 嘅 44px 觸控區。 */
.fix-act.act-row{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:3px;margin-top:7px}
.fix-act.act-row::-webkit-scrollbar{display:none}
.fix-act.act-row .fix-btn{flex:0 0 auto;min-height:30px;padding:0 5px;font-size:11px;gap:2px;border-radius:999px;line-height:1}
.fix-act.act-row .fix-wrap{flex:0 0 auto;margin:0}
.fix-panel{margin-top:7px;padding:9px 10px;border:1px dashed #d8ccff;border-radius:11px;background:#fbfaff}
.fix-t{font-size:11px;color:#8a8a96;line-height:1.6;margin-bottom:6px}
.fix-ta{width:100%;box-sizing:border-box;border:1px solid #ddd4f5;border-radius:9px;padding:8px 9px;font-size:15px;font-family:inherit;line-height:1.5;outline:none;resize:vertical;background:#fff;color:#2b2b33}
.fix-ta:focus{border-color:#b79ef0}
.fix-act{display:flex;align-items:center;gap:8px;margin-top:7px;flex-wrap:wrap}
.fix-send{border:0;border-radius:999px;background:#6b4bb5;color:#fff;font-size:12.5px;font-weight:600;padding:7px 16px;cursor:pointer}
.fix-send:disabled{opacity:.55}
.fix-cancel{border:1px solid #ddd4f5;border-radius:999px;background:#fff;color:#7a7a88;font-size:12.5px;padding:6px 14px;cursor:pointer}
.fix-msg{font-size:11.5px;color:#8a8a96}
.fix-msg.ok{color:#15803d}
.fix-msg.bad{color:#b91c1c}

/* 日常資訊：用過高德即時數據嘅答案底部標示（2026-10-15） */
.src-note{margin-top:8px;padding-top:6px;border-top:1px dashed #e2daf6;font-size:11px;color:#8b8b96;letter-spacing:.02em}
.loc-link{color:#6b4bb5;cursor:pointer;text-decoration:underline;text-underline-offset:2px}

/* 位置卡片：問「附近…」時先請用戶提供位置（2026-10-15 用戶要求） */
.loc-card{margin-top:2px}
.lc-t{font-size:13.5px;color:#4b2d94;font-weight:600;line-height:1.65}
.lc-act{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.lc-act button{border:0;border-radius:999px;padding:9px 15px;font-size:13px;font-weight:600;cursor:pointer;flex:1 1 auto}
.lc-here{background:#6b4bb5;color:#fff}
.lc-type{background:#f0eaff;color:#5b3fa8;border:1px solid #ddd0f7}
.lc-box{display:flex;gap:8px;margin-top:10px}
.lc-in{flex:1;min-width:0;box-sizing:border-box;border:1px solid #ddd4f5;border-radius:10px;padding:9px 11px;font-size:15px;font-family:inherit;outline:none;background:#fff;color:#2b2b33}
.lc-in:focus{border-color:#b79ef0}
.lc-ok{border:0;border-radius:10px;background:#6b4bb5;color:#fff;font-size:13.5px;font-weight:600;padding:0 16px;cursor:pointer}
.lc-ok:disabled{opacity:.55}
.lc-msg{margin-top:9px;font-size:12px;color:#8a8a96;line-height:1.6}
.lc-msg.ok{color:#15803d}
.lc-msg.bad{color:#b91c1c}
/* 2026-10-16 John：快速問答打關鍵詞 → 「一撳即開」生活技能入口（建議行） */
.fnbar{display:flex;gap:6px;overflow-x:auto;align-items:center;padding:2px 2px 8px;
 -webkit-overflow-scrolling:touch;scrollbar-width:none}
.fnbar::-webkit-scrollbar{display:none}
.fnbar[hidden]{display:none}
.fnbar .fn-lab{flex:0 0 auto;font-size:11px;color:#8a8a95;font-weight:700;padding-right:1px}
.fnbar button{flex:0 0 auto;border:1px solid #e6e0f8;background:#fff;color:#6d4fd3;border-radius:999px;
 padding:6px 11px;font-size:12px;font-weight:700;font-family:inherit;cursor:pointer;white-space:nowrap}
.fnbar button:active{background:#f1ecfd}

/* 2026-10-17 John：精簡生活技能 → 10 格，最後一格跨滿行；首頁快捷改細字連結 */
.dl-btn.dl-wide{grid-column:1/-1}
.dl-link{
  display:block;width:calc(100% - 24px);margin:2px 12px 6px;padding:7px 4px;
  border:0;background:transparent;color:var(--muted);font:inherit;font-size:11.5px;font-weight:600;
  text-align:center;cursor:pointer;text-decoration:underline;text-underline-offset:3px;
}
.dl-link:active{color:var(--brand)}
/* 2026-10-18 John：情感木木語言列必須一行（窄機收起標籤，免換行） */
 @media (max-width:560px){
  .mumu-lang .ml-label{display:none}
  .mumu-lang .ml-btn{padding:0 8px;font-size:11px}
  .mumu-lang{gap:5px}
 }

/* 2026-10-18 John：「⏰ 我的提醒」搬入備忘錄（分段切換） */
/* 2026-10-19 John（截圖）：備忘錄分頁加到 5 個（備忘錄／提醒／聯絡人／我的偏好／AI 記憶）
   → 一排逼爆、右邊被切。改成自動換行：一行 3 個，剩 2 個自動平分第二行。 */
.memo-seg{display:flex;flex-wrap:wrap;gap:4px;margin:8px 12px 2px;padding:3px;background:var(--fill);border-radius:11px;flex:0 0 auto}
.memo-seg-btn{flex:1 1 calc(33.333% - 4px);min-width:0;padding:8px 4px;border:0;border-radius:9px;background:transparent;color:var(--muted);
  font:inherit;font-size:12px;font-weight:700;line-height:1.25;cursor:pointer;font-family:inherit;
  white-space:nowrap;overflow:hidden;text-overflow:clip}
.memo-seg-btn.is-on{background:#fff;color:var(--brand);box-shadow:0 1px 3px rgba(0,0,0,.07)}
.memo-rem{display:flex;flex-direction:column;flex:1;min-height:0}
.memo-rem[hidden]{display:none!important}
.rem-add{margin:8px 12px 6px;display:flex;flex-wrap:wrap;gap:6px;flex:0 0 auto}
.rem-add #remT{flex:1 1 100%;height:36px;padding:0 12px;border:1px solid var(--line);border-radius:10px;
  font:inherit;font-size:13px;color:var(--ink);outline:none}
.rem-add #remAt{flex:1 1 auto;min-width:0;height:34px;padding:0 8px;border:1px solid var(--line);border-radius:10px;
  font:inherit;font-size:12.5px;color:var(--ink);outline:none}
.rem-add #remAddBtn{flex:0 0 auto;height:34px;padding:0 15px;border:0;border-radius:10px;background:var(--brand);
  color:#fff;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer;font-family:inherit}
.rem-top{margin:8px 12px 6px;display:flex;gap:6px;flex:0 0 auto}
.rem-top button{flex:1;height:38px;border:0;border-radius:11px;background:var(--brand);color:#fff;
  font:inherit;font-size:13.5px;font-weight:700;cursor:pointer;font-family:inherit}
.rem-top button:active{opacity:.88}
/* 新增提醒彈窗（2026-10-18 John：一撳「＋ 新增提醒」才彈出完整表單） */
.rem-card{max-height:86vh}
.rem-form{padding:12px 18px calc(var(--safe-b) + 14px);overflow-y:auto;overscroll-behavior:contain}
.rem-hint{font-size:14px;font-weight:700;color:var(--brand);line-height:1.5}
.rem-note{font-size:11.5px;color:var(--muted);line-height:1.7;margin:6px 0 12px}
.rem-note b{color:var(--brand)}
.rm-row{display:flex;align-items:center;gap:8px;margin:9px 0}
.rm-row label{flex:0 0 80px;font-size:12.5px;color:var(--muted)}
.rm-in{flex:1;min-width:0;box-sizing:border-box;height:38px;padding:0 11px;border:1px solid var(--line);
  border-radius:10px;background:#fff;color:var(--ink);font:inherit;font-size:13.5px;font-family:inherit;outline:none;-webkit-appearance:none;appearance:none}
.rm-in:focus{border-color:#b79ef0}
select.rm-in{background-image:linear-gradient(45deg,transparent 50%,#9a9aa5 50%),linear-gradient(135deg,#9a9aa5 50%,transparent 50%);
  background-position:calc(100% - 16px) 17px,calc(100% - 11px) 17px;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:28px}
.rm-msg{margin-top:8px;font-size:12px;color:var(--muted);line-height:1.6;min-height:0}
.rm-msg.ok{color:#15803d}.rm-msg.bad{color:#b91c1c}
.rm-act{display:flex;gap:8px;margin-top:12px}
.rm-act button{flex:1;height:42px;border:0;border-radius:11px;font:inherit;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit}
.rm-save{background:var(--brand);color:#fff}
.rm-cancel{background:var(--fill);color:#4b4b55}
.rm-tip{font-size:11px;color:var(--muted);line-height:1.6;margin-top:10px;text-align:center}
/* 📇 重要聯絡人（2026-10-18 John） */
.memo-con{display:flex;flex-direction:column;flex:1;min-height:0}
.memo-con[hidden]{display:none!important}
.con-items{flex:1;overflow-y:auto;padding:2px 12px 16px;-webkit-overflow-scrolling:touch}
.con-item{border:1px solid var(--line);border-radius:12px;background:#fff;padding:10px 11px;margin-bottom:7px}
.ci-main{display:flex;flex-direction:column;gap:2px}
.ci-n{font-size:14px;font-weight:700;color:var(--ink);line-height:1.35}
.ci-t{font-size:15px;color:var(--brand);text-decoration:none;font-variant-numeric:tabular-nums;font-weight:600;
  letter-spacing:.2px;line-height:1.35}
.ci-t:active{opacity:.6}
.ci-a{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}
.ci-a button,.ci-a a{padding:5px 8px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--brand);
  font:inherit;font-size:11px;font-weight:700;cursor:pointer;font-family:inherit;text-decoration:none;line-height:1.6;
  white-space:nowrap}
.ci-a .ci-call{background:var(--brand);border-color:var(--brand);color:#fff}
.ci-a .ci-del{color:#c0392b}
.ci-a .ok{background:#eefaf1;border-color:#c8ecd4;color:#15803d}
.ci-a .bad{background:#fdeeee;border-color:#f3c9c9;color:#b91c1c}
.con-toast{margin:0 12px 6px;padding:8px 11px;border-radius:10px;background:#eefaf1;border:1px solid #c8ecd4;color:#15803d;font-size:12px;font-weight:700;line-height:1.5;flex:0 0 auto}
.con-toast.bad{background:#fdeeee;border-color:#f3c9c9;color:#b91c1c}
.con-empty{margin:30px 16px;text-align:center;font-size:12.5px;color:var(--muted);line-height:1.9}
/* ── 2026-10-19：🧠 AI 記憶 ───────────────────────────── */
.memo-mem{flex:1;display:flex;flex-direction:column;overflow:hidden}
/* [hidden] 要贏過 display:flex，否則「AI 記憶」會一齊擠在「備忘錄」分頁下面 */
.memo-mem[hidden]{display:none!important}
.mem-top{padding:10px 12px 6px;flex:0 0 auto}
.mem-hd-row{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.mem-hd-row .mem-head{margin:0;flex:1 1 auto}
.mem-count{flex:0 0 auto;font-size:10.5px;font-weight:700;color:#7a7a8c;
  background:#f3f2f8;border-radius:999px;padding:2px 8px;white-space:nowrap}
.mem-chips{display:flex;gap:5px;flex-wrap:wrap;margin:7px 0 0}
.mem-chip{border:1px solid var(--line);background:#fff;color:#5b5b6b;font-family:inherit;
  font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;cursor:pointer;line-height:1.5;
  -webkit-tap-highlight-color:transparent}
.mem-chip.is-on{background:var(--brand-soft);border-color:transparent;color:var(--brand)}
.mem-act{display:flex;gap:6px;margin-top:8px}
.mem-mini{flex:0 0 auto;padding:8px 11px;border:1px solid var(--line);border-radius:10px;background:#fff;
  color:var(--brand);font-family:inherit;font-size:11.5px;font-weight:700;cursor:pointer}
.mem-mini:active{background:var(--brand-soft)}
.mem-head{font-size:13.5px;font-weight:800;color:var(--ink);margin-bottom:4px}
.mem-note{font-size:11.5px;line-height:1.65;color:var(--muted)}
.mem-clear{flex:1 1 auto;margin:0;padding:8px 10px;border:1px solid #f3c9c9;border-radius:10px;
  background:#fdf6f6;color:#b91c1c;font-family:inherit;font-size:12px;font-weight:700;cursor:pointer}
.mem-clear:active{background:#fdeeee}
.mem-clear[disabled]{opacity:.5}
.mem-items{flex:1;overflow-y:auto;padding:2px 12px 16px;-webkit-overflow-scrolling:touch}
.mem-row{display:flex;align-items:flex-start;gap:7px;border:1px solid var(--line);border-radius:11px;
  background:#fff;padding:9px 10px;margin-bottom:7px}
.mem-tag{flex:0 0 auto;font-size:10px;line-height:1.5;padding:1px 6px;border-radius:999px;
  background:var(--brand-soft);color:var(--brand);font-weight:700;white-space:nowrap}
.mem-t-event{background:#fff6e8;color:#b45309}
.mem-t-pref{background:#eef7ff;color:#1d6ab8}
.mem-t-conclusion{background:#f2f0ff;color:#5b3fc4}
.mem-t-emotion{background:#fdeef5;color:#b3246a}
.mem-tx{flex:1;min-width:0;font-size:12.5px;line-height:1.6;color:var(--ink);word-break:break-word}
.mem-tx b{display:block;font-weight:800;margin-bottom:1px}
.mem-tx span{color:#4a4a5a}
.mem-del{flex:0 0 auto;width:26px;height:26px;border:0;border-radius:8px;background:transparent;
  color:#c3c3cd;font-size:13px;cursor:pointer;line-height:1}
.mem-del:active{background:#fdeeee;color:#b91c1c}
.mem-loading{padding:18px 4px;text-align:center;font-size:12px;color:var(--muted)}
.mem-empty{margin:26px 16px;text-align:center;font-size:12.5px;color:var(--muted);line-height:1.9}
.mem-confirm{margin:0 12px 10px;padding:11px 12px;border:1px solid #f3c9c9;border-radius:11px;background:#fdf6f6;flex:0 0 auto}
.mem-confirm-t{font-size:12px;line-height:1.65;color:#b91c1c;margin-bottom:9px}
.mem-confirm-a{display:flex;gap:8px}
.mem-cancel,.mem-ok{flex:1;padding:9px 8px;border-radius:10px;font-family:inherit;font-size:12.5px;font-weight:700;cursor:pointer}
.mem-cancel{border:1px solid var(--line);background:#fff;color:var(--ink)}
.mem-ok{border:1px solid #e8a7a7;background:#b91c1c;color:#fff}
.mem-ok[disabled]{background:#e7c9c9;border-color:#e7c9c9;color:#fff;cursor:not-allowed;opacity:.85}
.mem-ts{display:block;font-size:10px;color:#ababb9;margin-top:3px;letter-spacing:.2px}
.mem-ed{flex:0 0 auto;width:26px;height:26px;border:0;border-radius:8px;background:transparent;
  color:#c3c3cd;font-size:12px;cursor:pointer;line-height:1}
.mem-ed:active{background:var(--brand-soft);color:var(--brand)}
/* 2026-10-19：「🧠 記住」勾選卡（答案下面） */
.mem-pick{margin-top:8px;border:1px solid #e6e0f7;border-radius:12px;background:#fbfaff;padding:10px 10px 9px}
.mem-pick .mp-head{font-size:12.5px;font-weight:800;color:#3a2f57}
.mem-pick .mp-sub{font-size:10.5px;line-height:1.55;color:#8a8798;margin:3px 0 8px}
.mem-pick .mp-list{display:flex;flex-direction:column;gap:6px}
.mem-pick .mp-load{font-size:11.5px;color:#8a8798;padding:6px 2px;line-height:1.7}
.mem-pick .mp-row{display:flex;align-items:flex-start;gap:6px;background:#fff;border:1px solid #ece7fb;
  border-radius:10px;padding:7px 8px}
.mem-pick .mp-row.is-saved{background:#f7fbf7;border-color:#dcecdc}
.mem-pick .mp-row input[type=checkbox]{flex:0 0 auto;width:15px;height:15px;margin:2px 0 0;accent-color:#7c3aed}
.mem-pick .mp-tag{flex:0 0 auto;font-size:9.5px;line-height:1.6;padding:1px 6px;border-radius:999px;
  background:#eef2ff;color:#4338ca;white-space:nowrap}
.mem-pick .mp-tx{flex:1;min-width:0;font-size:11.5px;line-height:1.55;color:#2f2f36;word-break:break-word}
.mem-pick .mp-tx b{display:block;font-weight:800}
.mem-pick .mp-tx span{color:#5b5b6b}
.mem-pick .mp-saved{flex:0 0 auto;font-size:9.5px;color:#0f7b3f;background:#e9f7ee;
  border-radius:999px;padding:1px 6px;white-space:nowrap}
.mem-pick .mp-act{display:flex;gap:8px;margin-top:9px}
.mem-pick .mp-act button{flex:1;padding:8px 6px;border-radius:10px;font-family:inherit;
  font-size:12px;font-weight:700;cursor:pointer}
.mem-pick .mp-cancel{border:1px solid var(--line);background:#fff;color:var(--ink)}
.mem-pick .mp-ok{border:1px solid #c9b8f5;background:var(--brand);color:#fff}
.mem-pick .mp-ok[disabled]{background:#ddd6ee;border-color:#ddd6ee;color:#fff;cursor:not-allowed}
.mem-pick .mp-msg{font-size:11px;line-height:1.6;margin-top:6px;color:#0f7b3f}
.mem-pick .mp-msg.bad{color:#b91c1c}
.mem-pick .mp-manual{display:flex;flex-wrap:wrap;gap:6px;border-top:1px dashed #e6e0f7;margin-top:8px;padding-top:9px}
.mem-pick .mp-sel,.mem-pick .mp-in{border:1px solid var(--line);border-radius:9px;background:#fff;
  font-family:inherit;font-size:11.5px;padding:7px 8px;color:var(--ink)}
.mem-pick .mp-sel{flex:0 0 auto}
.mem-pick .mp-in{flex:1 1 40%;min-width:0}
.mem-pick .mp-ok2{flex:0 0 auto;border:1px solid #c9b8f5;background:var(--brand);color:#fff;
  border-radius:9px;font-family:inherit;font-size:11.5px;font-weight:700;padding:7px 12px}
.mem-pick .mp-ok2[disabled]{opacity:.6}
.mem-in{width:100%;box-sizing:border-box;margin-bottom:6px;padding:8px 10px;border:1px solid var(--line);
  border-radius:9px;font-family:inherit;font-size:12.5px;color:var(--ink);background:#fff}
.mem-in:focus{outline:none;border-color:var(--brand)}
.mem-add{margin:0 12px 10px;padding:11px 12px;border:1px solid var(--line);border-radius:11px;
  background:#faf9fe;flex:0 0 auto}
.mem-add-h{font-size:12px;font-weight:800;color:var(--ink);margin-bottom:8px}
.mem-add-a{display:flex;gap:8px;margin-top:2px}
.mem-confirm-h{font-size:12.5px;font-weight:800;color:#b91c1c;margin-bottom:6px}
.mem-ack{display:flex;align-items:flex-start;gap:7px;margin:9px 0;font-size:12px;color:#7a3030;
  line-height:1.5;cursor:pointer;-webkit-tap-highlight-color:transparent}
.mem-ack input{flex:0 0 auto;width:16px;height:16px;margin:2px 0 0;accent-color:#b91c1c}
.mem-type-row{display:flex;align-items:center;gap:7px;margin:0 0 10px;font-size:11.5px;color:#7a3030;flex-wrap:wrap}
.mem-type-row span{flex:0 0 auto}
.mem-type-row input{flex:1 1 80px;min-width:80px;padding:7px 9px;border:1px solid #e8bfbf;border-radius:9px;
  font-family:inherit;font-size:12.5px;color:var(--ink);background:#fff}
.mem-type-row input:focus{outline:none;border-color:#b91c1c}
.rem-items{flex:1;overflow-y:auto;padding:2px 12px 16px;-webkit-overflow-scrolling:touch}
.rem-item{position:relative;border:1px solid var(--line);border-radius:12px;background:#fff;padding:10px 11px;margin-bottom:7px}
.ri-t{padding-right:28px}
.ri-x{position:absolute;top:5px;right:5px;min-width:22px;height:22px;padding:0 5px;border:0;border-radius:7px;
  background:transparent;color:#bcbcc6;font:inherit;font-size:12px;font-weight:700;line-height:22px;cursor:pointer}
.ri-x.armed{background:#fdeeee;color:#b91c1c;font-size:11px}
.ri-t{font-size:13px;font-weight:700;color:var(--ink)}
.ri-s{font-size:11.5px;color:var(--muted);margin-top:2px;line-height:1.5}
.ri-a{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.ri-a button{padding:5px 10px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--brand);
  font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;font-family:inherit}
.ri-a .ri-del{color:#c0392b}
.ri-a a{display:inline-block;text-decoration:none;line-height:1.6}
.ri-a .ri-alarm{background:var(--brand);border-color:var(--brand);color:#fff}
.lc-alarm{background:#15803d;color:#fff!important}
.rem-tip{margin:0 12px 10px;font-size:11px;color:var(--muted);line-height:1.65;flex:0 0 auto}
.rem-tip span{display:block;margin-top:3px;color:#b0b0bb}
.rem-empty{margin:30px 16px;text-align:center;font-size:12.5px;color:var(--muted);line-height:1.9}

/* ── 影片參考（食譜／教程，2026-10-19）────────────────────────── */
.vid-box{margin-top:11px;border-top:1px dashed rgba(124,58,237,.28);padding-top:9px}
.vid-hd{font-size:11.5px;color:#7c4dff;font-weight:600;margin-bottom:7px;letter-spacing:.2px}
.vid-card{display:flex;gap:9px;align-items:center;padding:7px;border-radius:11px;
  background:rgba(124,58,237,.055);text-decoration:none;margin-bottom:7px;
  border:1px solid rgba(124,58,237,.13);-webkit-tap-highlight-color:transparent}
.vid-card:active{background:rgba(124,58,237,.15)}
.vid-th{position:relative;flex:0 0 105px;width:105px;height:63px;border-radius:8px;
  overflow:hidden;background:#eceaf3}
.vid-th img{width:100%;height:100%;object-fit:cover;display:block;border:0}
.vid-dur{position:absolute;right:4px;bottom:4px;background:rgba(0,0,0,.72);color:#fff;
  font-size:10px;padding:1px 4px;border-radius:3px;line-height:1.35}
.vid-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:27px;height:27px;border-radius:50%;background:rgba(0,0,0,.46);color:#fff;
  font-size:11px;display:flex;align-items:center;justify-content:center;padding-left:2px}
.vid-tx{min-width:0;flex:1 1 auto}
.vid-title{font-size:13px;line-height:1.38;color:#2b2b3a;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vid-meta{font-size:10.5px;color:#8b8b9c;margin-top:3px;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}

/* ── 引用一段回答（2026-10-19）──────────────────────────────── */
.quote-bar[hidden]{display:none}
.quote-bar{display:flex;align-items:flex-start;gap:8px;margin:0 0 8px;padding:8px 10px;
  border-radius:11px;background:rgba(124,58,237,.07);
  border-left:3px solid #7c4dff}
.qb-ico{font-size:14px;line-height:1.5;flex:0 0 auto}
.qb-body{min-width:0;flex:1 1 auto}
.qb-lb{font-size:10.5px;color:#7c4dff;font-weight:600;margin-bottom:2px}
.qb-tx{font-size:11.5px;color:#6d6d7e;line-height:1.45;max-height:2.9em;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  word-break:break-all}
.qb-x{flex:0 0 auto;width:22px;height:22px;line-height:1;border:0;border-radius:50%;
  background:rgba(0,0,0,.06);color:#6d6d7e;font-size:15px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;padding:0}
.qb-x:active{background:rgba(0,0,0,.13)}
/* 用戶氣泡下面的「引用了上文」小標記 */
.q-chip{display:inline-block;margin-top:5px;font-size:10px;color:#7c4dff;
  background:rgba(124,58,237,.09);border-radius:6px;padding:2px 6px;
  max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── 最近問過（2026-10-19 下拉式：平時一行，撳開才見 5 條）──────── */
.qhist[hidden]{display:none}
.qhist{margin:0 0 8px;border:1px solid rgba(124,58,237,.16);border-radius:12px;
  background:rgba(124,58,237,.045);overflow:hidden}
.qh-head{display:flex;align-items:center;gap:7px;width:100%;border:0;background:transparent;
  padding:7px 11px;font-family:inherit;font-size:11.5px;color:#5b4b8a;cursor:pointer;
  -webkit-tap-highlight-color:transparent}
.qh-h-l{flex:1;text-align:left;letter-spacing:.2px}
.qh-h-n{font-size:10px;color:#7c5cc4;background:rgba(124,58,237,.13);
  border-radius:999px;padding:1px 6px;line-height:1.4}
.qh-h-a{font-size:9.5px;color:#8b7bb8}
.qh-list{display:flex;flex-direction:column;border-top:1px solid rgba(124,58,237,.10);
  padding:4px;max-height:184px;overflow-y:auto}
.qh-item{width:100%;text-align:left;border:0;background:transparent;color:#4a4a5a;
  font-size:12px;line-height:1.45;padding:8px 9px;border-radius:8px;font-family:inherit;
  cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  -webkit-tap-highlight-color:transparent}
.qh-item:active{background:rgba(124,58,237,.13)}
/* 2026-10-19 John：單條刪除 + 清空全部（二次確認） */
.qh-row{display:flex;align-items:center;gap:0}
.qh-del{flex:0 0 auto;border:0;background:transparent;color:#b6acd0;font-size:15px;line-height:1;
  padding:6px 9px;border-radius:8px;font-family:inherit;cursor:pointer;
  -webkit-tap-highlight-color:transparent}
.qh-del:active{background:rgba(192,57,43,.12);color:#c0392b}
.qh-foot{display:flex;align-items:center;gap:8px;border-top:1px solid rgba(124,58,237,.10);
  padding:5px 7px}
.qh-clr{border:0;background:transparent;color:#9a8cbe;font-size:11px;font-family:inherit;
  padding:4px 6px;border-radius:8px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.qh-clr:active{background:rgba(192,57,43,.10);color:#c0392b}
.qh-tip{flex:1;font-size:11px;color:#8a5a5a;text-align:left}
.qh-yes,.qh-no{border:0;border-radius:8px;font-size:11px;font-family:inherit;padding:4px 10px;
  cursor:pointer;-webkit-tap-highlight-color:transparent}
.qh-yes{background:#c0392b;color:#fff}
.qh-no{background:rgba(124,58,237,.12);color:#6b5a9e}

/* ── 2026-10-19 John：新對話提示（同 DeepSeek 一樣，刷新後彈一句就走）────── */
.xd-toast{position:fixed;left:50%;top:44%;transform:translate(-50%,-50%) scale(.96);
  background:rgba(32,32,36,.9);color:#fff;font-size:13px;line-height:1.5;
  padding:10px 18px;border-radius:12px;z-index:99999;pointer-events:none;
  opacity:0;transition:opacity .22s ease,transform .22s ease;white-space:nowrap;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  box-shadow:0 6px 22px rgba(0,0,0,.22)}
.xd-toast.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
/* 2026-10-22 轉發連結提示（可能含網址，要換行不留白）
   位置放輸入欄上方空隙，唔壓六格卡片、唔壓輸入欄 */
.xd-toast.multi{white-space:normal;max-width:calc(100vw - 44px);text-align:center;
  word-break:break-all;line-height:1.65;font-size:12.5px;
  top:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 110px);
  transform:translate(-50%,0) scale(.96)}
.xd-toast.multi.on{transform:translate(-50%,0) scale(1)}

/* 2026-10-19 擇日面板（對標主站九宮格）：日期範圍＋用事人＋胎兒擇時 */
.zr-dates{display:flex;align-items:center;gap:6px;flex:1;min-width:0}
.zr-dates input[type=date]{flex:1;min-width:0;padding:7px 6px;border:1px solid #ddd4f5;border-radius:8px;font-size:12.5px;background:#fafafa;color:#2b2b33}
.zr-dates span{color:#b9aee0;font-size:12px}
.zr-persons{display:flex;flex-wrap:wrap;gap:6px}
.zr-chip{border:1px solid #ddd0f7;background:#fff;color:#5b3fa8;border-radius:999px;padding:6px 12px;font-size:12.5px;cursor:pointer}
.zr-chip.on{background:#6b4bb5;border-color:#6b4bb5;color:#fff;font-weight:600}
.zr-empty{font-size:12px;color:#9a93ad}
.zr-fetal{display:flex;align-items:center;gap:6px;font-size:12.5px;color:#5e35b1;margin:6px 0 2px}

/* ===== 木木 · 關係命理（八字）：命盤卡 + 出生資料表單（2026-10-19） ===== */
.mm-chart{margin-top:10px;border:1px solid #E6D8FF;background:#FBF7FF;border-radius:12px;padding:10px}
.mm-chart-h{display:flex;justify-content:space-between;align-items:center;font-size:11.5px;color:#7A5AA8;margin-bottom:8px}
.mm-chart-src{color:#9A8CB0;font-size:10.5px}
.mm-pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.mm-p{background:#fff;border:1px solid #EEE4FA;border-radius:8px;padding:6px 4px;text-align:center}
.mm-p b{display:block;font-size:10.5px;color:#9A8CB0;font-weight:400}
.mm-p span{display:block;font-size:15px;color:#4B3A63;font-weight:700;letter-spacing:1px}
.mm-chart-m{font-size:11.5px;color:#7A6A8E;margin-top:7px;line-height:1.6}
.mm-chart-lb{font-size:11.5px;color:#7A5AA8;margin:2px 0 5px}
.mm-chart-block + .mm-chart-block{margin-top:10px;border-top:1px dashed #EADFF7;padding-top:8px}
.mm-form{margin-top:10px;border:1px solid #E6D8FF;border-radius:12px;padding:11px;background:#fff}
.mm-form-t{font-size:13px;font-weight:700;color:#5B3F86;margin-bottom:3px}
.mm-form-q{font-size:11px;color:#9A8CB0;margin-bottom:9px}
.mm-row{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:12.5px;color:#5B4A73}
.mm-row>span{flex:0 0 62px;color:#8A7C9E}
.mm-row input[type=date],.mm-row input[type=time],.mm-row input[type=text],.mm-row select{flex:1;min-width:0;border:1px solid #E6D8FF;border-radius:8px;padding:7px 8px;font-size:13px;font-family:inherit;background:#FBF7FF;color:#3A2C4E}
.mm-unk{display:flex;align-items:center;gap:4px;font-size:11px;color:#9A8CB0;font-style:normal;white-space:nowrap}
.mm-note{font-size:11px;color:#9A8CB0;line-height:1.6;margin:2px 0 9px}
.mm-submit{width:100%;background:#7650A2;color:#fff;border:0;border-radius:10px;padding:10px;font-size:13.5px;font-weight:700;font-family:inherit}
.mm-submit:disabled{opacity:.6}
.mm-err{font-size:11.5px;color:#C0392B;margin-top:6px}

/* 2026-10-19 z444：生活有道首頁「太極時鐘 ＋ 四柱干支」卡（由主站九宮格頂部搬過來） */
.gz-card{display:flex;align-items:center;gap:10px;width:100%;max-width:560px;background:#fff;border:1px solid var(--line);
 border-radius:14px;padding:8px 10px;box-shadow:0 1px 3px rgba(0,0,0,.04);margin:2px 0 4px;text-align:left}
/* 2026-10-20 John：「時鐘卡放六個卡下面，中間別挨太近」→ 上下留足 16／14px */
.empty .gz-card{margin:16px 0 14px;width:calc(100% - 28px);max-width:330px}
.gz-face{position:relative;width:62px;height:62px;flex:0 0 62px}
.gz-face img{width:62px;height:62px;border-radius:50%;display:block;object-fit:cover}
.gz-face canvas{position:absolute;top:0;left:0;width:62px;height:62px;border-radius:50%}
.gz-main{flex:1 1 auto;min-width:0}
.gz-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.gz-pillars{display:flex;align-items:flex-end;gap:7px;margin-bottom:2px}
/* 2026-10-20 John：卡片右上比較空 → 加節氣（兩行：☀️ 節氣／寒露後 · 距霜降） */
.gz-jq{flex:0 0 auto;text-align:right;font-size:9.5px;line-height:1.4;color:#8d8698;padding-top:1px;white-space:nowrap}
.gz-jq[hidden]{display:none}
.gz-jq .jq-t{display:block;color:#a99fc0;letter-spacing:.04em}
.gz-jq .jq-v{display:block;color:#6f6879;font-weight:600}
.gz-p{display:inline-block;text-align:center;line-height:1.15}
/* 2026-10-20 John：四柱字細一檔，唔好喧賓奪主（原 16／13.5） */
.gz-t{display:block;font-size:14px;font-weight:700;letter-spacing:.5px;color:#6f6879}
.gz-d{display:block;font-size:11.5px;font-weight:600;letter-spacing:.5px;color:#8d8698}
/* 2026-10-20 John：統一色系（灰紫），日柱先做重點 → 睇落似「數據」唔似「裝飾」 */
.gz-p.gz-p-day{background:#f4f0fd;border-radius:9px;padding:2px 5px 1px;box-shadow:inset 0 0 0 1px #eee6fb}
.gz-p.gz-p-day .gz-t{color:#2f2a3d;font-weight:800}
.gz-p.gz-p-day .gz-d{color:#4a4356;font-weight:700}
.gz-lunar{font-size:11px;color:#6b6b73;line-height:1.45;word-break:break-all}
/* 2026-10-22 John：「日出 日落不要另外起一行 把换日时间这个去掉」→ 公曆同日出日落同一行 */
.gz-solrow{display:flex;align-items:baseline;justify-content:space-between;gap:4px;line-height:1.45}
.gz-solar{font-size:9.5px;color:#a0a0a8;white-space:nowrap}
.gz-sun{font-size:9px;color:#a0a0a8;white-space:nowrap;text-align:right}
.gz-sun[hidden]{display:none}
.gz-sun .sn-i{display:inline-block}
.gz-sun .sn-i + .sn-i{margin-left:5px}
@media (max-width:360px){.gz-t{font-size:13px}.gz-d{font-size:10.5px}.gz-lunar{font-size:10px}}

/* 2026-10-22 John：世界時鐘（最終版）—— 「钟表不要放首页 放备忘录空白处 分两排」
   → 六個城市 3×2 排在「📝 備忘錄」分頁空白處；鐘面 54px、SVG 12 格刻度 */
.wc6{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px 6px;
 margin:4px 2px 6px;width:100%}
/* 2026-10-22 John：「时钟移到历史对话框底下」→ 貼住對話清單下面，左右留白跟清單一致 */
.drawer-pane .wc6{padding:2px 12px 0;margin:0 0 2px}
/* 2026-10-22 John：「加多一个时钟的收起和展开按钮 默认展开」 */
.wc-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 14px 0}
.wc-bar-t{font-size:11px;font-weight:600;color:#a3a3ac;letter-spacing:.02em}
.wc-tg{border:0;background:transparent;color:#7650a2;font-size:11.5px;font-weight:700;
 font-family:inherit;padding:2px 2px;cursor:pointer;line-height:1.2}
.wc-tg:active{opacity:.6}
.wc6[hidden]{display:none}
.wc-i{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0}
.wc-d{display:block;width:54px;height:54px;border-radius:50%;
 box-shadow:0 1px 3px rgba(0,0,0,.06);transition:box-shadow .2s}
.wc-n{font-size:10.5px;line-height:1.15;font-weight:600;color:#5b4a73;letter-spacing:.02em;white-space:nowrap}
.wc-n .wc-dn{font-style:normal;font-size:9px;margin-right:2px;color:#e0a33a;vertical-align:1px}
/* 2026-10-22 John：「时钟需要区分白天和黑夜」—— ☀ 日間：白面紫灰針；☾ 夜間：深藍面淺針 */
.wc-d .wc-face{fill:#fff;stroke:#E6E1F2}
.wc-d .tk-b{stroke:#8a7c9e}
.wc-d .tk-s{stroke:#d9d2e6}
.wc-d .wc-h{stroke:#4a4356}
.wc-d .wc-m{stroke:#9A8CB0}
.wc-d .wc-c{fill:#7650A2}
.wc-i.dn-night .wc-d{box-shadow:0 1px 4px rgba(43,40,70,.28)}
.wc-i.dn-night .wc-face{fill:#2b2846;stroke:#4a4569}
.wc-i.dn-night .tk-b{stroke:#cfc7ef}
.wc-i.dn-night .tk-s{stroke:#6b6493}
.wc-i.dn-night .wc-h{stroke:#f4f0ff}
.wc-i.dn-night .wc-m{stroke:#bcb3e6}
.wc-i.dn-night .wc-c{fill:#f3c96b}
.wc-i.dn-night .wc-dn{color:#8f87c4}
.wc-t{font-size:11.5px;font-weight:700;line-height:1.15;color:#4a4356;font-variant-numeric:tabular-nums}
.wc-t[data-d]::after{content:' ' attr(data-d);font-size:8.5px;font-weight:600;color:#b3a9c9;letter-spacing:0}

/* 2026-10-19 z456 John：「最好頁面是一整個頁面，不要滑動」→ 命盤／起卦改成整屏面板：
   fixed 全屏（覆蓋輸入區）＋ flex 縱向分配，內容壓縮到一屏內，不產生滾動。 */
.mp-view{position:fixed;inset:0;z-index:70;height:100dvh;height:var(--vh,100dvh);background:var(--bg);
 display:flex;flex-direction:column;overflow:hidden;
 padding:calc(6px + var(--safe-t)) 12px calc(6px + var(--safe-b))}
.mp-view[hidden]{display:none}
.mp-head{display:flex;align-items:center;gap:8px;margin:0 0 5px;flex:0 0 auto}
.mp-back{border:0;background:#f1ecfd;color:#6d4fd3;font-size:12.5px;font-weight:700;font-family:inherit;
 padding:6px 12px;border-radius:999px;cursor:pointer}
.mp-title{font-size:16.5px;font-weight:800;color:var(--p2)}
.mp-sub{font-size:11.5px;color:var(--muted);line-height:1.5;margin:0 0 7px;flex:0 0 auto}
.mp-opts{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:7px;flex:0 0 auto}
.mp-opts button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;
 background:#fff;border:1px solid var(--line);border-radius:11px;padding:8px 11px;font-family:inherit;cursor:pointer;
 box-shadow:0 1px 3px rgba(94,53,177,.05)}
.mp-opts button:active{background:#fbf9ff}
.mp-opts button span{font-size:14px;font-weight:800;color:var(--p2)}
.mp-opts button em{font-style:normal;font-size:11px;line-height:1.5;color:var(--muted)}
.mp-slot{background:#fff;border:1px solid var(--line);border-radius:14px;padding:2px 10px 6px;
 margin-bottom:9px;flex:0 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.mp-slot[hidden]{display:none}
.mp-slot .bd-panel{border:0;box-shadow:none;margin:0;padding:4px 0 0;max-width:none}
/* 2026-10-19 z458：表單搬入面板後唔再自己滾（要一版睇完） */
#mpFormSlot .bd-rows{max-height:none;overflow:visible}
.mp-slot .bd-row{padding:7px 0}
.mp-mh[hidden]{display:none}
.mp-slot .bd-tip{font-size:11px;line-height:1.5;margin-top:4px}
.mp-slot .bd-actions{margin-top:6px;gap:6px}
.mp-slot .bd-add,.mp-slot .bd-save,.mp-slot .bd-matrix{padding:8px 6px;font-size:12px}
.mp-slot .bd-head{padding:6px 0;font-size:13px}
.mp-go{width:100%;padding:12px;border:0;border-radius:13px;background:linear-gradient(135deg,#7c3aed,#a855f7);
 color:#fff;font-size:15px;font-weight:800;font-family:inherit;cursor:pointer;flex:0 0 auto;
 box-shadow:0 4px 14px rgba(124,58,237,.28)}
.mp-go[hidden]{display:none}
.mp-msg{font-size:12px;color:#c0392b;margin-top:5px;text-align:center;flex:0 0 auto}
.mp-msg:empty{display:none}
/* 2026-10-19 z452：面板提示內的「📇 命盤資料」可直接撳開 */
.qm-bd{border:0;background:#f1ecfd;color:#6d4fd3;font-family:inherit;font-size:12px;font-weight:700;
 border-radius:999px;padding:2px 9px;margin:0 2px;cursor:pointer}
/* 2026-10-19 z453：起卦／命盤選項卡選中狀態 */
.mp-opts button.on{border-color:#b9a3f5;background:#faf7ff;box-shadow:0 0 0 3px rgba(124,58,237,.08)}
/* 2026-10-19 z459 John：「撳八字／紫微卡片冇反應，要變色證明撳過」→ 選中卡實心紫＋上面縮細，表單留喺下面 */
.mp-view.form-on .mp-sub{display:none}
.mp-view.form-on .mp-head{margin-bottom:4px}
.mp-view.form-on .mp-opts{gap:7px;margin-bottom:7px}
.mp-view.form-on .mp-opts button{flex-direction:row;align-items:center;gap:6px;padding:6px 10px;border-radius:11px}
.mp-view.form-on .mp-opts button em{display:none}
.mp-view.form-on .mp-opts button span{font-size:13px}
.mp-view.form-on .mp-opts button.on{background:#f3ecff;border-color:#b9a3f5;
 box-shadow:0 0 0 3px rgba(124,58,237,.10)}
.mp-view.form-on .mp-opts button.on span{color:#5e35b1}
.mp-view.form-on .mp-opts button.on span::after{content:' ✓';font-weight:700}
/* 2026-10-19 z464：填完後揀「快速問答／深度解析」，揀完再按開始 */
.mp-mode{display:none;gap:7px;margin-bottom:7px;flex:0 0 auto}
.mp-view.form-on .mp-mode{display:grid;grid-template-columns:1fr 1fr}
.mp-mode button{display:flex;flex-direction:column;align-items:flex-start;gap:1px;text-align:left;
 background:#fff;border:1px solid var(--line);border-radius:11px;padding:7px 10px;font-family:inherit;cursor:pointer}
.mp-mode button b{font-size:12.5px;font-weight:800;color:#5b4a78}
.mp-mode button em{font-style:normal;font-size:10.5px;color:var(--muted)}
.mp-mode button.on{background:#f3ecff;border-color:#b9a3f5;box-shadow:0 0 0 2px rgba(124,58,237,.10)}
.mp-mode button.on b{color:#5e35b1}
/* 2026-10-19 z454：說明區（填滿剩餘空間，不留大片空白，亦不撐出滾動） */
.mp-help{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;justify-content:flex-start;gap:6px;overflow:hidden}
/* z474：起卦三張卡改成三欄並排，唔留一格空白 */
#qgOpts{grid-template-columns:repeat(3,minmax(0,1fr))}
#qgOpts button em{display:none}
#qgOpts button{align-items:center;text-align:center;padding:9px 4px}
#qgOpts button span{font-size:12.5px}
.mp-help[hidden]{display:none}
.mh-i{background:#fff;border:1px solid var(--line);border-radius:10px;padding:6px 10px;
 font-size:11.5px;color:#4b4b55;line-height:1.55;flex:0 0 auto}
.mh-i b{color:var(--p2);font-size:12px;margin-right:4px}
.mh-eg{display:block;font-style:normal;font-size:11px;color:#8b7fa8;margin-top:3px;line-height:1.5}
/* z471：排完會拿到（填實版面） */
.mp-rep{background:#f7f4ff;border:1px solid #e6dcf7;border-radius:10px;padding:7px 10px;
 font-size:11px;color:#5b4a78;line-height:1.55;flex:0 0 auto}
.mp-rep b{display:block;color:#5b3a86;margin-bottom:2px}
.mp-rep span{display:block;font-size:11px;line-height:1.6}
/* z482：可撳嘅引導問題 */
.mp-rep-q button{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;text-align:left;
 border:1px solid #e6dcf7;background:#fff;border-radius:8px;padding:5px 8px;margin-top:4px;
 font-family:inherit;font-size:11.5px;line-height:1.5;color:#5b4a78;cursor:pointer}
.mp-rep-q button::after{content:'›';color:#b9a3f5;font-weight:800;font-size:13px;flex:0 0 auto}
.mp-rep-q button:active{background:#f3ecff;color:#5e35b1}
/* z484：排盤表單展開時收起引導，保一屏 */
.mp-view.form-on .mp-rep-q{display:none}
.mp-foot{margin-top:auto;text-align:center;font-size:10px;color:#a0a0a8;padding:5px 0 1px;flex:0 0 auto}
.mh-got{background:#f7f4ff;border:1px solid #e6dcf7;border-radius:11px;padding:9px 11px;
 font-size:11.5px;color:#5b4a78;line-height:1.65;flex:0 0 auto}
.mh-got b{display:block;color:#5b3a86;font-size:12px;margin-bottom:2px}
.mh-n{font-size:10.5px;color:var(--muted);line-height:1.45;padding:0 2px;flex:0 0 auto}
/* 2026-10-19 z466：起卦三張說明卡平均撐開，唔留底部空白 */
/* z480：起卦說明卡唔再拉高（卡內大片空白）→ 貼內容高度，內距略放鬆 */
#qgHelp .mh-i{flex:0 0 auto;display:block;padding:9px 11px}
#qgHelp .mh-i .mh-eg{margin-top:4px}
#qgHelp{gap:8px}
/* z481：起卦流程提示 */
.qg-step{margin-top:7px;background:#f7f4ff;border:1px solid #e6dcf7;border-radius:10px;
 padding:8px 10px;font-size:11px;line-height:1.6;color:#5b4a78;flex:0 0 auto}
.qg-step b{color:#5b3a86}
/* 2026-10-19 z455：命理報告卡搬到命盤咨詢面板底部；z456 可壓縮高度，唔撐出滾動 */
.mp-ad{display:block;overflow:hidden;text-decoration:none;margin:0;border-radius:13px;
 border:1px solid #e2d5f8;background:#f6f0ff;box-shadow:0 3px 12px rgba(94,53,177,.12);
 flex:0 0 auto}
.mp-ad:active{transform:scale(.99)}
.mp-ad .da-img{display:block;width:100%;height:auto}
/* z468：聚會計劃等卡頂返回鍵 */
.lc-back{border:0;background:#f1ecfd;color:#6d4fd3;font-family:inherit;font-size:12px;font-weight:800;
 border-radius:999px;padding:6px 12px;margin:0 0 8px;cursor:pointer;align-self:flex-start}
@media (max-height:600px){
 .mp-sub{display:none}
 .mh-i{padding:6px 10px;font-size:11px;line-height:1.5}
 .mh-n{display:none}
}

/* 2026-10-19 z456 John：「出門辦事嘅卡片頁最好都唔好上下滑動」
   → 同命盤面板一致：整屏 fixed 面板、標題＋返回、表單區自適應（鍵盤彈出時才在區內滾動） */
.msg.ai .bubble.fs-card{position:fixed;inset:0;z-index:70;width:auto;max-width:none;
 height:100dvh;margin:0;border:0;border-radius:0;background:var(--bg);box-shadow:none;
 display:flex;flex-direction:column;overflow:hidden;white-space:normal;
 padding:calc(8px + var(--safe-t)) 14px calc(8px + var(--safe-b))}
.fs-card .fs-head{display:flex;align-items:center;gap:9px;margin:0 0 8px;flex:0 0 auto}
.fs-card .fs-back{border:0;background:#f1ecfd;color:#6d4fd3;font-size:12.5px;font-weight:700;
 font-family:inherit;padding:6px 12px;border-radius:999px;cursor:pointer}
.fs-card .fs-title{font-size:15.5px;font-weight:800;color:var(--p2)}
.fs-card .fs-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;
 overscroll-behavior:contain;padding-bottom:2px}
.fs-card .fs-tools{flex:0 0 auto}
.fs-card .fs-tools .er-more{padding:7px 3px;font-size:12px}
.fs-card .pc-row{margin:3px 0}
.fs-card .pc-row label{flex:0 0 88px;font-size:12px}
.fs-card .pc-in{padding:6px 9px;min-height:34px}
.fs-card .lc-act{margin-top:8px;flex:0 0 auto}
.fs-card .lc-act button{padding:12px 15px;font-size:14.5px}
.fs-card .lc-msg{margin-top:5px;flex:0 0 auto}
.fs-card .lc-msg:empty{display:none}
/* 2026-10-19 z459 John：填完會得到咩（補住下方空白） */
.fs-note{margin-top:8px;padding:8px 10px;border:1px solid #e6dcf7;border-radius:11px;
 background:#faf7ff;font-size:11.5px;line-height:1.7;color:#5b4a78}
.fs-note b{display:block;color:#5b3a86;font-size:12px;margin-bottom:2px}
.fs-card .fs-note{flex:0 0 auto}
/* 2026-10-19 z458 John（紅圈）：高身手機表單下方有大片空白 → 各欄平均分佈撐開，唔留空白 */
@media (min-height:680px){
 .fs-card .fs-scroll{display:flex;flex-direction:column;justify-content:space-between}
 .fs-card .fs-scroll>*{flex:0 0 auto}
 .fs-card .pc-row{margin:0}
 .fs-card .fs-tools{margin-bottom:12px!important}
}
/* 2026-10-19 z460：矮身手機（≤640）→ 收起生活工具格、欄位再收窄，令整張表單一屏放得落 */
@media (max-height:640px){
 .fs-card .fs-tools{display:none}
 .fs-card .fs-head{margin-bottom:6px}
 .fs-card .pc-in{min-height:31px;padding:4px 8px}
 .fs-card .pc-row{margin:2px 0}
 .fs-card .er-m{min-height:32px!important;font-size:12.5px!important}
 .fs-note{font-size:11px;line-height:1.55;padding:6px 9px;margin-top:6px}
 .fs-card .lc-act button{padding:11px}
}
/* 2026-10-19 z485 John：「只顯示一張卡」、「排盤前要確認排邊個」 */
#mpFormSlot .bd-row{display:none}
#mpFormSlot .bd-row.mp-cur{display:block}
.mp-who{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:2px 0 6px}
.mp-who .mw-lb{font-size:11.5px;font-weight:800;color:#5b3a86;flex:0 0 auto}
.mp-who .mw-lb em{font-style:normal;font-weight:400;color:#b91c1c;font-size:10.5px;margin-left:4px}
.mp-who button{border:1px solid #e0d6f5;background:#fff;color:#5b4a78;border-radius:999px;
 padding:5px 11px;font-size:12px;font-family:inherit;cursor:pointer;white-space:nowrap}
.mp-who button.on{background:#7c3aed;border-color:#7c3aed;color:#fff;font-weight:800}

/* z488：報告包含 → 十個部分逐項列出（緊湊兩行式，不撐高版面） */
.mp-rep.mp-rep-all{gap:2px}
.mp-rep.mp-rep-all b{display:block;margin-bottom:3px}
.mp-rep.mp-rep-all span{display:block;font-size:11px;line-height:1.45;color:#6b5b86}

/* z488：四條引導問題預設收埋（紅圈：太長）→ 只留一行，撳標題展開 */
.mp-rep-q .rp-q-list{display:none}
.mp-rep-q.open .rp-q-list{display:block}
.mp-rep-q>b{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px}
.mp-rep-q>b em{font-style:normal;font-weight:500;color:#8b7ab0;font-size:10.5px}
.mp-rep-q.open>b em{color:#7c3aed}
.rp-q-hint{display:block;font-size:10.5px;line-height:1.5;color:#6b5b86;background:#fff;border:1px dashed #ddd0f5;border-radius:7px;padding:5px 8px;margin:4px 0 2px}

/* ===== z488：完整八字排盤卡（與主站九宮格同一模板） ===== */
.xd-chart{background:transparent!important;border:none!important;padding:0!important;box-shadow:none!important;width:100%}
.xd-chart .xc-h{background:linear-gradient(135deg,#7c3aed,#9f67ff);color:#fff;border-radius:12px 12px 0 0;
 padding:9px 12px;font-size:13px;font-weight:800;display:flex;align-items:center;gap:6px}
.xd-chart .xc-h em{font-style:normal;font-weight:500;font-size:11.5px;opacity:.9;margin-left:auto}
.xd-chart .xc-body{background:#f7f4ff;border:1px solid #e6dcf7;border-top:none;border-radius:0 0 12px 12px;padding:9px}
.xd-chart .card{background:#fff;border-radius:10px;padding:10px;box-shadow:0 1px 3px rgba(0,0,0,.05);margin-bottom:8px}
.xd-chart .card:last-child{margin-bottom:0}
.xd-chart .p-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-bottom:8px}
.xd-chart .p-box{background:linear-gradient(135deg,#faf5ff,#f0e6ff);border-radius:8px;padding:7px 3px;text-align:center;border:1px solid #e0d4f0}
.xd-chart .p-box .pl{font-size:9px;color:#999}
.xd-chart .p-box .pg{font-size:17px;font-weight:700;color:#1a1a2e}
.xd-chart .p-box .pz{font-size:15px;font-weight:600;color:#5e35b1}
.xd-chart .p-box .pw{font-size:10px;color:#888;margin-top:1px}

.mp-who-say{font-size:11px;font-weight:700;color:#2e7d32;padding:0 0 6px}
.mp-who-say.warn{color:#b91c1c}

/* z488：命盤卡下面嘅快速／深度選擇（排完盤才揀） */
.xd-chart .xc-ask{display:flex;align-items:center;gap:6px;flex-wrap:wrap;background:#fff;border:1px solid #e6dcf7;border-top:none;padding:8px 9px;font-size:11.5px;color:#5b3a86;font-weight:700}
.xd-chart .xc-ask span{margin-right:auto}
.xd-chart .xc-ask button{border:1px solid #d9c9f7;background:#faf7ff;color:#5b3a86;border-radius:999px;padding:5px 10px;font-size:11.5px;font-family:inherit;font-weight:700}
.xd-chart .xc-ask button:active{background:#7c3aed;color:#fff}
/* 紫微完整盤：全屏覆蓋 */
.zz-ov{position:fixed;inset:0;z-index:9999;background:#fff;display:flex;flex-direction:column}
.zz-bar{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;background:linear-gradient(135deg,#7c3aed,#9f67ff);color:#fff;font-size:13px;font-weight:700}
.zz-x{border:none;background:rgba(255,255,255,.2);color:#fff;border-radius:999px;padding:5px 11px;font-size:12px;font-family:inherit}
.zz-frame{flex:1;width:100%;border:none}
/* z496：紫微盤底三個大掣 + AI 解讀可展開全屏 */
.zz-ft{display:flex;gap:8px;padding:10px 10px calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #efeaf7;flex:0 0 auto}
.zz-ft button{flex:1;min-height:46px;border-radius:14px;border:1px solid #d9c9f7;background:#faf7ff;color:#5b3a86;font-size:13.5px;font-family:inherit;font-weight:800}
.zz-ft .zz-back{flex:0 0 34%;background:#f6f6f8;border-color:#e7e7ec;color:#555}
.zz-ft .zz-ask.on{background:linear-gradient(135deg,#7c3aed,#9f67ff);border-color:transparent;color:#fff;box-shadow:0 3px 10px rgba(124,58,237,.28)}
.zz-ft button:active{transform:scale(.98)}
.zz-ai{max-height:34vh;overflow-y:auto;-webkit-overflow-scrolling:touch;background:#fff;border-top:1px solid #eee;padding:0 11px 12px;font-size:12.5px;line-height:1.72;color:#332b45;flex:0 0 auto}
.zz-ai-h{position:sticky;top:0;z-index:2;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 0 7px;font-size:12.5px;font-weight:800;color:#5b3a86}
.zz-ai b,.zz-ai strong{color:#5b3a86}
.zz-exp{border:1px solid #d9c9f7;background:#faf7ff;color:#6b46c1;border-radius:999px;padding:5px 11px;font-size:11.5px;font-family:inherit;font-weight:700}
.zz-ld{color:#8b7ab0;font-size:12px}
.zz-err{color:#b91c1c;font-size:12px}
.zz-retry{margin-left:8px;border:1px solid #f0c9c9;background:#fff5f5;color:#b91c1c;border-radius:999px;padding:4px 10px;font-size:11.5px;font-family:inherit}
.zz-ov.ai-full .zz-frame{min-height:0;flex:0 0 30vh}
.zz-ov.ai-full .zz-ai{max-height:none;flex:1 1 auto}
.zz-ov.ai-full .zz-exp{background:#7c3aed;border-color:#7c3aed;color:#fff}
/* z501：抽屜分開入場 → 只顯示該命盤模組 */
.mp-view.only-bazi #mpOpts [data-mp=ziwei]{display:none}
.mp-view.only-ziwei #mpOpts [data-mp=bazi]{display:none}
.mp-view.only-bazi #mpOpts [data-mp=bazi],
.mp-view.only-ziwei #mpOpts [data-mp=ziwei]{width:100%}
.mp-view.only-bazi #mpOpts,.mp-view.only-ziwei #mpOpts{grid-template-columns:1fr}
.mp-view.only-bazi .mp-sub::after{content:' · 八字命盤'}
.mp-view.only-ziwei .mp-sub::after{content:' · 紫微斗數'}
/* z504：AI 解讀文字排版（加大行距、分段標題、載入動畫） */
.zz-ai{font-size:13px;line-height:1.85;color:#2f2740;padding:0 13px 14px}
.zz-ai p{margin:0 0 9px}
.zz-ai b,.zz-ai strong{color:#5b3a86;font-weight:800}
.zz-ld{display:flex;align-items:center;gap:8px;color:#7b6b96;font-size:12.5px;padding:4px 0 8px}
.zz-ld::before{content:'';width:13px;height:13px;border-radius:50%;border:2px solid #d9c9f7;border-top-color:#7c3aed;animation:zzspin .8s linear infinite;flex:0 0 auto}
@keyframes zzspin{to{transform:rotate(360deg)}}
.zz-err{line-height:1.7;padding:4px 0 8px}

/* ===== z511 John：「卡片可以收起來，但展開以後唔使滑動」=====
   命盤資料展開時：下面報告橫幅／十項目錄／引導問題一律收起，
   一屏睇完表單，開始排盤掣貼底，唔會再要往上滑。 */
.mp-view.form-on .mp-help{margin-top:12px;flex:0 0 auto;overflow:visible}
.mp-view.form-on .mp-slot{overflow:visible;flex:0 0 auto;min-height:0;display:block}
.mp-view.form-on .mp-slot .bd-panel{flex:0 0 auto}
.mp-view.form-on .mp-slot .bd-rows{max-height:none;overflow:visible}
.mp-view.form-on .mp-go{margin-top:8px}
.mp-view.form-on .mp-msg{margin-bottom:2px}
/* z511b：展開表單時，卡片按內容自然高度（唔再喺卡內滾動）；真係超高時只有整頁滾，唔會卡住半截 */
.mp-view.form-on{overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.mp-view.form-on .mp-slot .bd-row{padding:6px 0}
.mp-view.form-on .mp-slot .bd-tip{font-size:10.5px;line-height:1.45;margin-top:3px}
.mp-view.form-on .mp-slot .bd-actions{margin-top:4px}

/* ===== z517 排盤／深度解讀等待卡（主區唔再空白，輪播進度） ===== */
.ai-wait{min-width:min(72vw,300px);padding:2px 0 2px}
.ai-wait .aw-h{font-size:13px;font-weight:800;color:#5b3a86;margin-bottom:5px}
.ai-wait .aw-s{font-size:12.5px;line-height:1.7;color:#4a4358;min-height:2.9em}
.ai-wait .aw-bar{position:relative;height:4px;border-radius:99px;background:#efe8fb;overflow:hidden;margin:8px 0 6px}
.ai-wait .aw-bar i{position:absolute;left:-40%;width:40%;height:100%;border-radius:99px;background:linear-gradient(90deg,#a78bfa,#7c3aed);animation:awmove 1.25s ease-in-out infinite}
@keyframes awmove{0%{left:-40%}100%{left:100%}}
.ai-wait .aw-t{font-size:11px;color:#948aa8}

/* ===== z522 AI 解讀可收起：預設只留最底一行，撳一下展開全文 ===== */
.zz-ai.collapsed .zz-ai-b{display:none}
.zz-ai.collapsed{padding-bottom:6px}
.zz-ai-h{cursor:pointer;-webkit-tap-highlight-color:transparent}
.zz-ai-h em{font-style:normal;font-weight:800;font-size:12px;color:#7c3aed;background:#f3ecff;
 border-radius:999px;padding:3px 10px}

/* z523 John：「要有個收起按鈕」→ 展開時 AI 區底加一顆明顯的「收起 ▲」 */
.zz-ai-f{display:flex;justify-content:center;padding:8px 0 4px}
.zz-ai.collapsed .zz-ai-f{display:none}
.zz-ai-fold{border:1px solid #d9c9f7;background:#faf7ff;color:#5b3a86;font-family:inherit;
 font-size:12.5px;font-weight:800;border-radius:999px;padding:7px 22px;cursor:pointer}
.zz-ai-fold:active{transform:scale(.98)}

/* z524：展開後「收起」要固定可見 —— AI 區改成三段式：標題 / 可滾內容 / 收起鍵 */
.zz-ai{display:flex;flex-direction:column;max-height:40vh;overflow:hidden}
.zz-ai.collapsed{max-height:none}
.zz-ai-b{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.zz-ai-h{flex:0 0 auto}
.zz-ai-f{flex:0 0 auto}

/* ===== z526 命盤確認卡：只用於「要用邊位命盤」 ==== */
.pickwho b{display:block;font-size:13px;color:#4b3b6b;margin-bottom:8px}
.pw-list{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:7px}
.pw{border:1px solid #d9c9f7;background:#faf7ff;color:#5b3a86;font-family:inherit;font-size:13px;
 font-weight:800;border-radius:999px;padding:8px 16px;cursor:pointer}
.pw:active{transform:scale(.98);background:#f1e9ff}
/* 2026-10-21 John：「也要能选择不带」→ 不用命盤（次要樣式，唔搶人名片） */
.pw.pw-none{border:1px dashed #cbbde6;background:#fff;color:#7b6d97;font-weight:600}
.pw.pw-none:active{background:#f6f2ff}
.pw-t{font-size:11.5px;color:#8b7ab0;line-height:1.6}

/* ── 2026-10-19 z527 John：即刻起卦面板重做 ─────────────────────────
   「功能标签那么小 下面也是空的」→ 每個卦一張大卡（34px 圖示／15.5px 標題／
   一屏內可撳），選中卡自動展開 6 條常問例子，其餘收起（避免整頁拉長）。 */
.qg-list{display:flex;flex-direction:column;gap:7px;flex:1 1 auto;overflow-y:auto;
 -webkit-overflow-scrolling:touch;padding-bottom:2px}
.qg-card{flex:0 0 auto;border:1px solid var(--line);border-radius:15px;background:#fff;overflow:hidden;
 transition:border-color .15s,box-shadow .15s}
.qg-card.on{border-color:#b9a3f5;box-shadow:0 0 0 3px rgba(124,58,237,.08)}
.qg-top{display:flex;align-items:center;gap:10px;width:100%;padding:11px 12px;border:0;
 background:transparent;font-family:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.qg-top:active{background:#faf8ff}
.qg-ico{flex:0 0 auto;width:34px;height:34px;border-radius:11px;background:#f3ecff;
 display:flex;align-items:center;justify-content:center;font-size:18px;line-height:1}
.qg-card.on .qg-ico{background:#7c3aed}
.qg-tx{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.qg-tx b{font-size:15.5px;color:#5e35b1;line-height:1.3}
.qg-tx em{font-style:normal;font-size:11.5px;color:#8a8798;line-height:1.45}
.qg-ck{flex:0 0 auto;width:21px;height:21px;border-radius:50%;border:1.5px solid #ddd6ee;
 color:transparent;font-size:12px;display:flex;align-items:center;justify-content:center}
.qg-card.on .qg-ck{background:#7c3aed;border-color:#7c3aed;color:#fff}
.qg-egs{display:none;grid-template-columns:1fr 1fr;gap:6px;padding:0 10px 11px}
.qg-card.on .qg-egs{display:grid}
.qg-ex{text-align:left;padding:7px 9px;border:1px solid #ece7fb;border-radius:11px;
 background:#faf8ff;color:#3f3a4d;font-size:11.5px;line-height:1.4;font-family:inherit;cursor:pointer;
 -webkit-tap-highlight-color:transparent;min-height:40px;display:flex;align-items:center}
.qg-ex:active{background:#f1ecfd;border-color:#c9b8f5}
.qg-ex::before{content:'›';color:#9b7fe8;font-weight:800;margin-right:6px}
.qg-bar{display:flex;gap:8px;flex:0 0 auto;margin-top:8px}
.qg-bar .mp-go{flex:1 1 auto}
.qg-copy{flex:0 0 auto;padding:12px 11px;border-radius:13px;border:1px solid #c9b8f5;background:#fff;
 color:#6d4fd3;font-size:13px;font-weight:800;font-family:inherit;cursor:pointer;white-space:nowrap}
.qg-copy:active{background:#f1ecfd}
.qg-step{font-size:11px;line-height:1.55;color:#8a8798;margin-top:7px;flex:0 0 auto}
.qg-note{font-size:11px;line-height:1.5;color:#a08fbe;margin-top:5px;flex:0 0 auto}
@media (max-height:640px){
 .qg-top{padding:9px 11px}.qg-ico{width:30px;height:30px;font-size:16px}
 .qg-tx b{font-size:14.5px}.qg-tx em{font-size:11px}
 .qg-ex{padding:7px 10px;font-size:12px}
}

/* ── 2026-10-19 z528 John：「每一类名字隔壁增加一个解释按钮，点了弹出解释窗口」 ── */
.qg-top{padding-right:6px}
.qg-info{flex:0 0 auto;border:1px solid #ddd6ee;background:#faf8ff;color:#6d4fd3;
 font-family:inherit;font-size:11px;font-weight:700;line-height:1;padding:7px 8px;border-radius:9px;
 cursor:pointer;-webkit-tap-highlight-color:transparent;margin-right:6px;white-space:nowrap}
.qg-info:active{background:#f1ecfd;border-color:#b9a3f5}
.qg-modal{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:18px}
.qg-modal[hidden]{display:none}
.qg-modal-mask{position:absolute;inset:0;background:rgba(24,16,44,.42)}
.qg-modal-box{position:relative;width:100%;max-width:380px;max-height:78vh;display:flex;flex-direction:column;
 background:#fff;border-radius:18px;box-shadow:0 18px 48px rgba(40,20,90,.28);overflow:hidden}
.qg-modal-h{display:flex;align-items:center;justify-content:space-between;gap:8px;
 padding:13px 14px 10px;border-bottom:1px solid #f2eefc}
.qg-modal-h b{font-size:14px;color:#5e35b1}
.qg-modal-x{border:0;background:#f4f0fd;color:#6d4fd3;width:28px;height:28px;border-radius:50%;
 font-size:13px;font-family:inherit;cursor:pointer;line-height:1}
.qg-modal-b{padding:12px 15px;font-size:12.3px;line-height:1.8;color:#3a3a44;overflow-y:auto;
 -webkit-overflow-scrolling:touch;white-space:pre-line}
.qg-modal-ok{margin:4px 14px 14px;padding:11px;border:0;border-radius:12px;
 background:linear-gradient(135deg,#7c3aed,#a855f7);color:#fff;font-size:13px;font-weight:800;
 font-family:inherit;cursor:pointer}
/* z533 John：「複製这个按钮存在没意义」→ 移除，開始起卦獨佔一行 */
.qg-bar{display:block}
.qg-bar .mp-go{width:100%}
/* z534：每類底部一句提示＋「換一批」 */
.qg-foot{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:8px;
 margin-top:1px;padding:2px 1px 0}
.qg-foot span{flex:1 1 auto;font-size:10.5px;line-height:1.45;color:#8a8798}
.qg-more{flex:0 0 auto;border:1px solid #ddd6ee;background:#fff;color:#6d4fd3;font-family:inherit;
 font-size:11px;font-weight:700;padding:6px 10px;border-radius:9px;cursor:pointer;white-space:nowrap}
.qg-more:active{background:#f1ecfd;border-color:#b9a3f5}
/* z536：未選中的卦卡收起描述，只留卦名（避免四張卡佔滿一屏） */
.qg-card:not(.on) .qg-tx em{display:none}
.qg-card:not(.on) .qg-top{padding:10px 12px}
/* z538 John：「例子的字可小一些 尽量别超出边框」 */
.qg-ex{font-size:10.8px;line-height:1.35;min-height:36px;padding:6px 8px;word-break:break-word}
.qg-ex::before{margin-right:4px;font-size:11px}
.qg-foot span{font-size:10px}
.qg-tx em{font-size:11px}

/* ===== 2026-10-21 John：生活有道的風水／九宮飛星，對標兩個獨立頁同一套模版與文案 ===== */
.qm-f{margin-top:10px}
.qm-f:first-child{margin-top:0}
.qm-lb{display:block;font-size:12px;color:#8a8a95;margin-bottom:6px}
.qm-ti{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:12px;background:#fff;
  font:inherit;font-size:13px;padding:9px 10px;color:var(--ink);outline:none;resize:vertical}
.qm-ti:focus{border-color:#b9a7e0}
.qm-note{margin:6px 0 0;font-size:10.5px;color:#9ca3af;line-height:1.6}
.qm-chips{display:flex;flex-wrap:wrap;gap:6px}
.qm-chip{border:1px solid var(--line);background:#fcfbff;color:#5e5578;border-radius:999px;
  padding:6px 12px;font:inherit;font-size:12.5px;cursor:pointer;transition:.12s}
.qm-chip.on{background:#f1ecfd;border-color:var(--brand);color:var(--brand);font-weight:600}
.qm-chip:active{transform:scale(.97)}
.qm-yrbar{display:flex;gap:8px;margin:10px 0 8px}
.qm-yrbar button{flex:1;position:relative;border:1px solid var(--line);background:#faf7fe;color:#4e36a6;
  border-radius:12px;padding:9px 8px;font:inherit;font-size:13.5px;font-weight:700;cursor:pointer}
.qm-yrbar button.on{background:var(--brand);border-color:var(--brand);color:#fff}
.qm-yrbar .tag{position:absolute;top:-6px;right:8px;background:#bea377;color:#fff;font-size:9.5px;
  font-weight:700;border-radius:8px;padding:1px 5px}
.qm-yhint{font-size:11px;color:#9ca3af;text-align:center;margin:0 0 8px}
.fxg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:6px 0}
.fxc{aspect-ratio:1/1;border:1px solid #e7e1f4;background:linear-gradient(180deg,#fff 0%,#fbf9ff 62%,#f6f2ff 100%);
  border-bottom-color:#ddd3f0;border-radius:12px;padding:5px 3px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:0;font:inherit;color:var(--ink);cursor:pointer;overflow:hidden}
.fxc .d{font-size:10px;color:#8b8399;line-height:1.2}
.fxc .n{font-size:19px;font-weight:800;color:var(--brand);line-height:1.05}
.fxc .nm{font-size:10.5px;color:#4e36a6;font-weight:600;line-height:1.2}
.fxc .t{font-size:8.5px;color:#8b8399;line-height:1.2;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;max-width:100%}
.fxc.on{border-color:var(--brand);background:#f1ecfd;box-shadow:inset 0 0 0 2px rgba(109,79,211,.16)}

.qm-inline{display:flex;align-items:center;gap:8px}
.qm-inline .qm-ti{flex:1;min-width:0}
.qm-up{width:100%;min-height:40px;border:1px dashed #b9a7e0;background:#faf7ff;color:#5e35b1;
  border-radius:12px;font:inherit;font-size:13.5px;font-weight:700;cursor:pointer}
.qm-up:active{background:#f3ecff}
.qm-go{width:100%;margin-top:10px;min-height:42px;border:0;border-radius:12px;
  background:linear-gradient(135deg,#6D4FD3,#9A7BFF);color:#fff;font:inherit;font-size:15px;font-weight:800;cursor:pointer}

/* 2026-10-21 John：「風水的也要同步」→ 方位 3×3 盤（同九宮飛星頁一致，上南下北） */
.qm-chips.dgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.qm-chips.dgrid .qm-chip{border-radius:12px;min-height:46px;display:flex;align-items:center;
  justify-content:center;font-size:13px;padding:0 4px}

/* ===== 2026-10-21 九宮飛星：教學摺疊 + 宮位詳情（同獨立頁同一套文案） ===== */
.fxd-dev{margin:0 0 10px;border:1px solid var(--line);border-radius:12px;background:#faf7fe}
.fxd-dev>summary{list-style:none;cursor:pointer;padding:9px 11px;font-size:12.5px;font-weight:700;color:var(--brand)}
.fxd-dev>summary::-webkit-details-marker{display:none}
.fxd-teach{padding:0 11px 10px;max-height:300px;overflow-y:auto}
.fxd-teach .lede{font-size:12px;line-height:1.7;color:#4c3a66;background:#f6f0fc;border-radius:10px;padding:8px 10px;margin:0 0 6px}
.fxd-teach .acc{border-top:1px solid var(--line);padding:0}
.fxd-teach .acc summary{list-style:none;cursor:pointer;padding:9px 20px 9px 0;position:relative;
  font-size:12.5px;font-weight:700;color:var(--brand)}
.fxd-teach .acc summary::-webkit-details-marker{display:none}
.fxd-teach .acc summary::after{content:"+";position:absolute;right:4px;top:7px;color:#bea377;font-size:15px}
.fxd-teach .acc[open] summary::after{content:"–"}
.fxd-teach .accbody{font-size:11.5px;line-height:1.7;color:#3e3052;padding:0 0 8px}
.fxd-teach .accbody p{margin:0 0 6px}
.fxd-teach .accbody ol,.fxd-teach .accbody ul{margin:4px 0 6px 16px;padding:0}
.fxd-teach .accbody li{margin-bottom:3px}
.fxd-teach .mh{font-size:12px;color:var(--brand);margin:8px 0 4px}
.fxd-teach .tblwrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px;margin:6px 0}
.fxd-teach .tbl{border-collapse:collapse;width:100%;min-width:420px;font-size:10.5px}
.fxd-teach .tbl th,.fxd-teach .tbl td{padding:5px 6px;border-bottom:1px solid #f0e7f8;text-align:left;vertical-align:top}
.fxd-teach .tbl th{background:#f6f0fc;color:#4e36a6;white-space:nowrap}
.fxd-teach .quote{border-left:3px solid #bea377;background:#fcf8f0;border-radius:0 8px 8px 0;padding:7px 9px;
  font-size:11px;color:#6a5638;margin:6px 0}
.fxd-teach .warnline,.fxd-teach .msmall{font-size:10.5px;line-height:1.6;color:#8a6a3c;margin:5px 0}
.fxd-link{display:inline-block;margin-left:4px;font-size:11px;color:var(--brand);text-decoration:underline}
.fxd{margin-top:4px}
.fxd h4{font-size:12.5px;color:var(--brand);font-weight:700;margin:12px 0 5px;display:flex;gap:5px;align-items:center}
.fxd h4 .n{width:18px;height:18px;border-radius:50%;background:#f1ecfd;color:var(--brand);
  font-size:10.5px;font-weight:800;display:inline-flex;align-items:center;justify-content:center}
.fxd p{font-size:12.5px;line-height:1.7;color:#3c3f45;margin:0 0 5px}
.fxd .dim{font-size:11px;color:#8b8399}
.fxd ol{margin:3px 0 6px 16px;padding:0}
.fxd li{font-size:12.5px;line-height:1.65;color:#3c3f45;margin-bottom:4px}
.fxd .warn{background:#fcf8f0;border:1px dashed #e2cfae;color:#7a6440;border-radius:10px;
  padding:8px 10px;font-size:12px;line-height:1.65}
.fxd .tip{background:#f6f0fc;border-radius:10px;padding:8px 10px;font-size:12px;line-height:1.65;color:#4c3a66}

/* 2026-10-21 四級訂閱方案（免費遊客／標準／進階／高級） */
.me-period{display:flex;gap:4px;background:#f4f1fa;border-radius:10px;padding:3px;width:-moz-fit-content;width:fit-content;margin:0 0 2px}
.me-period-b{border:0;background:transparent;border-radius:8px;padding:5px 15px;font:inherit;font-size:12px;color:#6b6383;cursor:pointer}
.me-period-b.is-on{background:#fff;color:var(--brand);font-weight:700;box-shadow:0 1px 3px rgba(80,60,140,.14)}
.me-period-b i{font-style:normal;font-size:10px;color:#c0392b;margin-left:3px}
.me-tier-list{display:flex;flex-direction:column;gap:9px;margin-top:6px}
.me-tier{border:1px solid #ece7f8;border-radius:14px;padding:12px;background:#fff}
.me-tier.is-cur{border-color:#b79cf0;box-shadow:0 0 0 2px rgba(140,100,240,.12)}
/* 2026-10-22 未登入遊客單獨一檔（虛線＋灰調，同會員方案清楚分開） */
.me-tier.is-guest{background:#fbfaff;border-style:dashed;border-color:#d9d1ec}
.me-tier.is-guest .me-tier-h b{color:#5b5372}
.me-tier.is-guest .me-tier-p em{color:#9a93ad}
.me-tier-note{font-size:11px;line-height:1.5;color:#8b7bb8;margin-top:7px}
.me-tier-h{display:flex;align-items:center;justify-content:space-between;gap:8px}
.me-tier-h b{font-size:14.5px;color:#3d3358}
.me-tier-tag{font-size:10.5px;color:#8e8e93;background:#f5f3fa;border-radius:6px;padding:2px 6px;white-space:nowrap}
.me-tier-cur{font-size:10.5px;color:#fff;background:var(--brand);border-radius:6px;padding:2px 7px;white-space:nowrap}
.me-tier-p{display:flex;align-items:baseline;gap:3px;margin:6px 0 2px}
.me-tier-p em{font-style:normal;font-size:22px;font-weight:800;color:#b8860b;letter-spacing:-.5px}
.me-tier-p span{font-size:11.5px;color:#8e8e93}
.me-tier-k{margin:6px 0 10px;padding:0;list-style:none}
.me-tier-k li{position:relative;padding-left:13px;font-size:11.5px;color:#6b6383;line-height:1.85}
.me-tier-k li:before{content:"";position:absolute;left:2px;top:8px;width:4px;height:4px;border-radius:50%;background:#b79cf0}
.me-tier-buy{width:100%;border:0;border-radius:11px;padding:9px;font:inherit;font-size:13px;font-weight:700;color:#fff;background:linear-gradient(135deg,#8e6cf0,#6f4bd8);cursor:pointer}
.me-tier-buy:disabled{background:#efeaf8;color:#9b95a8;cursor:default;font-weight:600}
.me-tier-buy:active{opacity:.85}

/* 2026-10-21 帳號流程：忘記密碼／驗證碼登入／返回 */
.me-links{display:flex;justify-content:space-between;gap:8px;margin:-2px 0 2px}
.me-links[hidden]{display:none!important}
.me-link{border:0;background:none;padding:0;font:inherit;font-size:12px;color:var(--brand);cursor:pointer}
.me-link:active{opacity:.6}
.me-back{border:0;background:none;padding:4px 0;font:inherit;font-size:12.5px;color:#8e8e93;cursor:pointer;text-align:left}
.me-back[hidden]{display:none!important}
#mePassWrap[hidden],#mePass2Wrap[hidden],#meCodeWrap[hidden],#meTabs[hidden]{display:none!important}

/* ===== 2026-10-22 我的檔案櫃 ===== */
.fs-loading,.fs-empty{padding:18px 6px;text-align:center;color:#8a8fa3;font-size:13px;line-height:1.7}
.fs-bar{height:6px;border-radius:4px;background:#eee9fb;overflow:hidden;margin-bottom:6px}
.fs-bar-in{height:100%;background:linear-gradient(90deg,#8b5cf6,#a78bfa);border-radius:4px}
.fs-bar-t{font-size:11px;color:#8a8fa3}
.fs-row{display:flex;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid #f0eefb;flex-wrap:wrap}
.fs-row:last-child{border-bottom:0}
.fs-ic{font-size:18px;flex:0 0 auto}
.fs-nm{flex:1 1 auto;min-width:0;display:flex;flex-direction:column}
.fs-nm b{font-size:13px;font-weight:600;color:#2b2b3a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fs-nm em{font-style:normal;font-size:10.5px;color:#9aa0b4}
.fs-dl,.fs-del{border:1px solid #e2ddf6;background:#fff;color:#6d4fd3;border-radius:8px;font-size:11.5px;padding:5px 9px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.fs-del{color:#d9534f;border-color:#f3d9d8}
.fs-conf{flex:1 1 100%;display:flex;gap:8px;align-items:center;justify-content:flex-end;font-size:11.5px;color:#d9534f;padding-top:4px}
.fs-conf button{border-radius:8px;font-size:11.5px;padding:5px 10px;cursor:pointer;border:1px solid #e2ddf6;background:#fff;color:#666}
.fs-conf .fs-yes{background:#d9534f;border-color:#d9534f;color:#fff}
.fs-tip{font-size:10.5px;color:#9aa0b4;margin-top:8px;line-height:1.6}

/* ===== 2026-10-21 John：寬屏自適應（對標主站九宮格：600px 容器＋正方形卡片 ~194px）=====
   手機（<768px）版面一字不改；主站 /root/index.html（九宮格）完全不動。 */
@media(min-width:768px){
  .empty{gap:14px;padding:22px}
  .brand-logo{width:72px;height:72px}
  .empty-title{font-size:27px}
  .xd-visit{font-size:11px}
  .xd-bless{font-size:13px}
  .life-grid{max-width:min(92vw,600px);gap:10px;margin-top:16px}
  /* 正方形卡片，但受視窗高度限制（短視窗自動變矮，唔會被底部輸入欄遮住） */
  .life-grid .life-btn{aspect-ratio:1;min-height:0;max-height:clamp(64px,calc((100dvh - 600px)/2),196px);padding:12px 8px;gap:6px;border-radius:18px;font-size:16px}
  .life-grid .life-btn .lb-ic{font-size:30px}
  .life-grid .life-btn .lb-sub{font-size:12px}
  .empty .gz-card{max-width:min(78vw,460px)}
  .gz-t{font-size:15px}
  .gz-d{font-size:12px}
  .gz-lunar{font-size:11px}
}
@media(min-width:1024px){
  .life-grid{max-width:min(88vw,640px);gap:12px}
  .life-grid .life-btn{border-radius:20px}
}

/* 矮視窗（例如 1366x768 筆電）品牌區收緊，讓六格仍保持足夠大小 */
@media(min-width:768px) and (max-height:860px){
  .empty{gap:9px;padding:14px}
  .brand-logo{width:52px;height:52px;margin-bottom:4px}
  .empty-title{font-size:23px}
  .xd-visit{font-size:10px}
  .xd-bless{font-size:11.5px}
  .life-grid{margin-top:10px}
  .empty .gz-card{max-width:min(66vw,380px)}
  .life-grid .life-btn{max-height:clamp(64px,calc((100dvh - 540px)/2),196px)}
}

/* ===== 2026-10-21 John：命盤咨詢排版優化（只動字級／文案／目錄對齊，不動結構）=====
   ① 說明卡正文 10.5–11px → 11.5–12px（手機舉手看唔再吃力）
   ② 「4 個方向」→「4 個常見問法」（文案在 index.html）
   ③ 十項目錄改懸掛縮進：換行唔再頂返最左，標題深色、說明淺色 */
.rp-q-hint{font-size:11.5px;line-height:1.6}
.mp-rep{font-size:11.5px}
.mp-rep span{font-size:11.5px;line-height:1.6}
.mh-n{font-size:11.5px;line-height:1.5}
#mpHelp .mh-i{font-size:12px;line-height:1.6}
/* 抽屜分開入場時，只講返對應命盤嘅「能問什麼」 */
.mp-view.only-bazi .mh-i-ziwei{display:none}
.mp-view.only-ziwei .mh-i-bazi{display:none}
/* 十項目錄 */
.mp-rep.mp-rep-all b{letter-spacing:.02em}
.mp-rep.mp-rep-all span{display:block;font-size:11.5px;line-height:1.6;color:#8b7fab;
  padding-left:22px;text-indent:-22px;margin:0}
.mp-rep.mp-rep-all span b{display:inline;font-size:11.5px;font-weight:800;color:#5b3a86;margin:0}
.mp-rep.mp-rep-all span em{font-style:normal;color:#8b7fab}
.mp-rep.mp-rep-all span em::before{content:' · ';color:#c9bce0}

/* 短屏（例如 iPhone SE／Android 瀏覽器剩 667–720px）保險：目錄可內滾，唔會被切走最後幾項 */
@media (max-height:740px){
  #mpHelp{overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
}


/* ===== 2026-10-21 文件生成（PDF / Excel / A4 單頁）===== */
.xdgen-res{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:7px;
  padding:7px 9px;background:#f7f4ff;border:1px solid #e3dbf5;border-radius:10px}
.xdgen-ok{font-size:11.5px;color:#5b3a86;font-weight:600}
.xdgen-a{font-size:11.5px;color:#fff;background:#7c3aed;border-radius:999px;
  padding:4px 11px;text-decoration:none;line-height:1.2;display:inline-block}
.xdgen-a:active{background:#6b28d6}
.xdgen-b{font-size:11.5px;color:#5b3a86;background:#fff;border:1px solid #d9ccf3;
  border-radius:999px;padding:4px 10px;cursor:pointer;line-height:1.2}
.xdgen-b:active{color:#6b4bb5}
@media (max-width:400px){.xdgen-ok{font-size:11px}.xdgen-a,.xdgen-b{font-size:11px;padding:3px 9px}}

.msg{scroll-margin-top:calc(var(--topbar-h) + 8px)}
/* 2026-10-22 John：命盤資料唔再擺喺對話窗 → 收進抽屜「我的 › 命盤資料」，需要時彈層調出 */
#bdHolder{display:none}
#meSheetBody .bd-panel{margin:0;max-width:none;border:0;padding:0;background:transparent;border-radius:0}
#meSheetBody .bd-rows{max-height:none;overflow:visible}
#meSheetBody .bd-tip{margin-top:8px}

/* 2026-10-22 John：對話窗唔再出「🕘 最近問過」浮層（歷史統一看抽屜「歷史對話」） */
.qhist{display:none !important}

/* ===== 2026-10-22 John：出圖後逐字校對 ===== */
.xdchk{margin-top:8px;border-radius:10px;padding:7px 9px;font-size:11.5px;line-height:1.55;display:block;white-space:normal}
.xdchk-i{margin-right:4px}
.xdchk.ok{background:#f2fbf5;border:1px solid #cfe9d8;color:#2f6b45}
.xdchk.skipped{background:#f7f6fa;border:1px solid #e6e2f0;color:#6f6884}
.xdchk.bad{background:#fff8ee;border:1px solid #f0d9b5;color:#7a4a12}
.xdchk-h{font-weight:700;margin-bottom:4px}
.xdchk-ul{margin:0 0 2px;padding-left:17px}
.xdchk-ul li{margin:2px 0}
.xdchk-btns{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.xdchk-btn{font-size:11.5px;line-height:1.2;border-radius:999px;padding:5px 11px;cursor:pointer;
  border:1px solid #d9ccf3;background:#fff;color:#5b3a86}
.xdchk-btn2{background:#7c3aed;border-color:#7c3aed;color:#fff}
.xdchk-btn:active{opacity:.82}
.xdchk-btn[disabled]{opacity:.55}
@media (max-width:400px){.xdchk{font-size:11px}.xdchk-btn{font-size:11px;padding:4px 9px}}

/* ===== 2026-10-22 合盤評分卡（HTML 由主站同一套引擎產生，呢度只係令佢喺對話框內唔爆版） ===== */
.hp-scope{white-space:normal}
.hp-scope .card{background:transparent;border:0;box-shadow:none;padding:0;margin:0;border-radius:0;max-width:none;width:auto}
.hp-scope table{max-width:100%;border-collapse:collapse}
.hp-scope img{max-width:100%}
.hp-scope div{max-width:100%}

/* ===== 2026-10-22 PWA「加到桌面」引導（只在「我的」彈層內出現，不佔首頁版面） ===== */
.pwa-guide{padding:16px 15px 14px}
.pwa-h{font-size:15px;font-weight:600;color:#2f2a3d;margin-bottom:12px}
.pwa-steps{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:10px}
.pwa-steps li{display:flex;align-items:flex-start;gap:10px;background:#faf8ff;border:1px solid #efeaf9;border-radius:12px;padding:10px 12px}
.pwa-steps li>b{flex:0 0 20px;height:20px;border-radius:50%;background:var(--brand);color:#fff;font-size:12.5px;font-weight:600;display:flex;align-items:center;justify-content:center;margin-top:1px}
.pwa-steps li>div{flex:1 1 auto;min-width:0;font-size:13px;line-height:1.55;color:#3a3448}
.pwa-ic{margin-left:6px;font-size:13px;opacity:.85}
.pwa-note{font-size:11.5px;line-height:1.6;color:#8d86a0;background:#f7f5fb;border-radius:10px;padding:9px 11px}
.pwa-big{display:block;width:100%;padding:12px;border:0;border-radius:12px;background:var(--brand);color:#fff;font-size:15px;font-weight:600;font-family:inherit;cursor:pointer}
.pwa-big:disabled{opacity:.6}
.pwa-big2{background:#fff;color:var(--brand);border:1px solid #d7c5f9}
/* 2026-10-22 推送深鏈卡：點通知進來先見「推的那條」
   注意：`#empty` 係 position:absolute;inset:0 蓋住成個 stage，
   所以張卡一定要有自己嘅 stacking（z-index），否則會被首頁內容壓住、睇落好似冇彈過。 */
.pk-card{position:relative;z-index:30;margin:10px 12px 8px;padding:12px 13px;border:1px solid #e6dff5;border-radius:14px;background:#fff;
  box-shadow:0 6px 20px rgba(124,58,237,.16)}
.pk-card[hidden]{display:none}
.pk-h{display:flex;align-items:center;justify-content:space-between;gap:8px;
  font-size:11.5px;color:#8b7bb8;margin-bottom:6px}
.pk-x{border:0;background:transparent;color:#b0a8c4;font-size:14px;line-height:1;padding:2px 4px;cursor:pointer}
.pk-t{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:4px}
.pk-b{font-size:13px;line-height:1.7;color:#4a4460;white-space:pre-line}
.pk-a{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.pk-btn{font-family:inherit;font-size:12.5px;padding:7px 13px;border-radius:999px;
  border:1px solid var(--brand);background:#fff;color:var(--brand);cursor:pointer}
.pk-btn:active{background:var(--brand-soft)}
.pk-btn:last-child{border-color:#e0d8f0;color:#7d7590}
/* 2026-10-22 每日推送：可推什麼（模板 chips）＋ 自己定一條 ＋ 已設定列表 */
.xd-pk-wrap{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.xd-pk{display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-width:0;
  background:#fff;border:1px solid #e6dff5;border-radius:11px;padding:7px 9px;cursor:pointer;
  font-family:inherit;text-align:left;-webkit-tap-highlight-color:transparent}
.xd-pk:active{background:var(--brand-soft);transform:scale(.98)}
.xd-pk em{font-style:normal;font-size:13px;line-height:1.2}
.xd-pk b{font-size:12px;font-weight:600;color:var(--ink);line-height:1.3}
.xd-pk i{font-style:normal;font-size:10px;color:#8b7bb8;line-height:1.3;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.xd-job-form{display:flex;flex-direction:column;gap:7px}
.xd-jf-row{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#6b6380}
.xd-jf-row input[type=time]{font-family:inherit;font-size:14px;padding:6px 9px;border:1px solid #e0d8f0;
  border-radius:9px;background:#fff;color:var(--ink)}
.xd-job-form input[type=text],.xd-job-form textarea{width:100%;box-sizing:border-box;font-family:inherit;
  font-size:13px;padding:9px 11px;border:1px solid #e0d8f0;border-radius:10px;background:#fff;color:var(--ink);
  resize:vertical;line-height:1.55}
.xd-job-form input[type=text]:focus,.xd-job-form textarea:focus{outline:none;border-color:var(--brand)}
.xd-job-list{margin-top:12px}
.xd-job-h{font-size:11.5px;color:#8d86a0;margin:0 0 6px}
.xd-job-empty{font-size:11.5px;color:#a79fbb;padding:6px 0}
.xd-job{display:flex;align-items:center;gap:8px;background:#f7f5fb;border-radius:10px;
  padding:7px 10px;margin-bottom:5px;font-size:12px;color:#4a4460;min-width:0}
.xd-job b{flex:0 0 auto;font-size:12.5px;color:var(--brand);font-variant-numeric:tabular-nums}
.xd-job span{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.xd-job-del{flex:0 0 auto;font-family:inherit;font-size:11px;padding:3px 9px;border-radius:999px;
  border:1px solid #e6dff5;background:#fff;color:#b06a7a;cursor:pointer}
.xd-job-del:active{background:#fdeef1}
/* 2026-10-22 每日運勢：選誰的八字 */
.xd-job-chart{margin-top:12px}
.xd-job-chart[hidden]{display:none}
.xd-ch-wrap{display:flex;flex-wrap:wrap;gap:6px}
.xd-ch{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;
  font-family:inherit;padding:7px 11px;border-radius:11px;border:1px solid #e6dff5;background:#fff;
  cursor:pointer;-webkit-tap-highlight-color:transparent;text-align:left}
.xd-ch b{font-size:12.5px;color:var(--ink);font-weight:600}
.xd-ch i{font-style:normal;font-size:10px;color:#8b7bb8;letter-spacing:.02em}
.xd-ch.is-on{border-color:var(--brand);background:var(--brand-soft)}
.xd-ch-empty{font-size:11.5px;color:#a79fbb;line-height:1.6}
/* 2026-10-22 John：「推送最好填完之後有一個範本給用戶參考」
   → 可點即填範本 chips ＋ 通知外觀預覽（白底紫邊，同實際通知一致閱讀感） */
.xd-tpl-h{font-size:11.5px;color:#8d86a0;margin:2px 0 6px}
.xd-tpl-wrap{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:9px}
.xd-tpl{font-family:inherit;font-size:11.5px;padding:6px 11px;border-radius:999px;
  border:1px dashed #d9cff0;background:#faf8ff;color:#6b5c9c;cursor:pointer;-webkit-tap-highlight-color:transparent}
.xd-tpl:active{background:var(--brand-soft);transform:scale(.97)}
.xd-prev-h{font-size:11.5px;color:#8d86a0;margin:4px 0 6px}
.xd-prev{background:#f4f1fa;border:1px solid #e8e2f6;border-radius:12px;padding:10px 12px;scroll-margin:16px 0 48px}
.xd-prev-top{display:flex;align-items:center;gap:6px;font-size:11px;color:#8b7bb8;margin-bottom:5px}
.xd-prev-top b{font-size:11px;font-weight:600;color:#6b5c9c}
.xd-prev-top i{font-style:normal;margin-left:auto;color:#a79fbb}
.xd-prev-ic{font-size:12px}
.xd-prev-t{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:3px;line-height:1.45}
.xd-prev-b{font-size:12px;line-height:1.6;color:#5b5473;white-space:pre-line;word-break:break-word}

/* 2026-10-22 John：「推送歷史記錄可以用戶自己刪除」→ 行內中文二次確認，唔用原生 prompt */
.di-pk-del{margin-left:2px;flex:0 0 auto;font-family:inherit;font-size:11px;line-height:1;
  color:#b0384a;background:#fff;border:1px solid #f0d3da;border-radius:999px;padding:5px 9px;cursor:pointer;
  -webkit-tap-highlight-color:transparent}
.di-pk-del:active{background:#fdf2f4}
.di-pk-yes,.di-pk-no{font-family:inherit;font-size:11.5px;line-height:1;border-radius:999px;padding:6px 12px;
  cursor:pointer;border:1px solid #e0d8f0;background:#fff;color:#6b6380;flex:0 0 auto}
.di-pk-yes{background:#c0392b;border-color:#c0392b;color:#fff;margin-left:auto}
.di-pk-no{margin-left:6px}
.di-pk-clear{margin:7px 0 3px;font-size:11.5px;color:#b0384a;text-align:center;padding:8px 0;
  border:1px dashed #f0d3da;border-radius:10px;cursor:pointer;line-height:1.5}
.di-pk-clear.on{display:flex;align-items:center;gap:6px;justify-content:center;flex-wrap:wrap;
  color:#8d86a0;border-style:solid;background:#fdf7f8;padding:8px 10px}

/* 2026-10-22 John：「用戶輸入提示詞 → AI 生成文案模版 → 確認時間 → 每天不一樣」 */
.xd-gen{display:flex;gap:6px;align-items:center;margin-bottom:8px}
.xd-gen input{flex:1;min-width:0;width:100%;box-sizing:border-box;font-family:inherit;font-size:13px;
  padding:9px 11px;border:1px solid #e0d8f0;border-radius:10px;background:#fff;color:var(--ink)}
.xd-gen input:focus{outline:none;border-color:var(--brand)}
.xd-gen-btn{flex:0 0 auto;font-family:inherit;font-size:12.5px;white-space:nowrap;
  padding:9px 12px;border-radius:10px;border:1px solid var(--brand);background:var(--brand);color:#fff;cursor:pointer}
.xd-gen-btn:disabled{opacity:.6}
.xd-cnt{font-size:11px;color:#a79fbb;text-align:right;margin-top:-2px}
.xd-cnt.short{color:#d97706}
.xd-cnt.good{color:#16a34a}

/* 2026-10-22 John：「模版參考需要彩色有重點」＋每日運勢要彩色排版 */
.xd-tpl:nth-child(6n+1){border-color:#bfe6cd;background:#f1fbf5;color:#1f7a4c}
.xd-tpl:nth-child(6n+2){border-color:#d8c8f7;background:#f6f1fe;color:#6d3fc0}
.xd-tpl:nth-child(6n+3){border-color:#f6d9ab;background:#fdf6ea;color:#a2661a}
.xd-tpl:nth-child(6n+4){border-color:#b9dff0;background:#eff8fc;color:#0f6f8c}
.xd-tpl:nth-child(6n+5){border-color:#f3c3cd;background:#fdf1f3;color:#a83a4d}
.xd-tpl:nth-child(6n+6){border-color:#c9d5f5;background:#f2f5fe;color:#3a56b0}
.rb-date{font-size:12.5px;font-weight:700;color:#3b3355;margin-bottom:2px}
.rb-gz{font-size:11.5px;color:#8b7bb8;margin-bottom:4px}
.rb-gap{height:7px}
.rb-row{display:flex;gap:7px;align-items:flex-start;margin:3px 0}
.rb-row i{flex:0 0 auto;width:20px;height:20px;border-radius:6px;color:#fff;font-style:normal;
  font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1}
.rb-yi i{background:#22a06b}
.rb-ji i{background:#d94a5a}
.rb-chips{display:flex;flex-wrap:wrap;gap:4px;padding-top:1px}
.rb-chips span{font-size:11.5px;line-height:1;padding:4px 8px;border-radius:999px}
.rb-yi .rb-chips span{background:#e8f8ef;color:#1c7a4d}
.rb-ji .rb-chips span{background:#fdeef0;color:#a83445}
.rb-dir{font-size:12px;color:#6b5c9c;margin:5px 0 2px}
.rb-h{font-size:12.5px;font-weight:700;color:#7c3aed;margin:8px 0 4px}
.rb-tag{display:inline-block;font-size:11px;line-height:1;padding:3px 7px;border-radius:6px;
  margin-right:6px;font-weight:700}
.rb-line{font-size:12.5px;line-height:1.65;color:#4a4460;margin:2px 0}
.rb-dim b{color:#7c3aed;margin-right:2px}
.rb-me{font-size:12.5px;font-weight:700;color:#7c3aed;margin:6px 0 2px}
.rb-sub{font-size:11.5px;color:#8b7bb8;margin-bottom:2px}

/* 2026-10-22 John：推送頻率（每天／每週幾／一次性）＋多條管理＋AI 生成 */
.xd-tip{font-size:11px;color:#8d86a0;line-height:1.6;margin:0 0 7px}
.xd-edit{display:flex;align-items:center;gap:8px;background:#fff7e8;border:1px solid #f6dfae;
  border-radius:10px;padding:7px 10px;font-size:11.5px;color:#a2661a;margin-bottom:7px}
.xd-edit[hidden]{display:none}
.xd-edit span{flex:1;min-width:0}
.xd-edit button{font-family:inherit;font-size:11px;border:1px solid #e6c98a;background:#fff;
  color:#a2661a;border-radius:999px;padding:4px 10px;cursor:pointer}
.xd-freq{display:flex;gap:6px;margin:2px 0 8px}
.xd-freq-b{flex:1;font-family:inherit;font-size:12.5px;padding:8px 0;border-radius:10px;
  border:1px solid #e0d8f0;background:#fff;color:#6b6380;cursor:pointer}
.xd-freq-b.on{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:600}
.xd-days{display:flex;gap:6px;margin-bottom:8px}
.xd-days[hidden]{display:none}
.xd-day{flex:1;font-family:inherit;font-size:12px;padding:7px 0;border-radius:9px;
  border:1px solid #e0d8f0;background:#fff;color:#6b6380;cursor:pointer}
.xd-day.on{background:var(--brand-soft);border-color:var(--brand);color:var(--brand);font-weight:600}
.xd-job-hint{font-size:10.5px;color:#b0a8c4;font-weight:400}
.xd-job-when{flex:0 0 auto;min-width:84px;font-size:11.5px;color:var(--brand);font-weight:600;line-height:1.4}
.xd-job-q{flex:1;min-width:0;font-size:12px;color:#8d86a0}

/* 2026-10-22 John：AI 生成模版要彩色／粗細／分段（同每日運勢一致閱讀感） */
.rb-key{margin:7px 0;padding:8px 11px;border-radius:9px;background:#f3ecfd;border-left:3px solid #7c3aed;
  font-size:12.5px;font-weight:700;color:#5b3fa8;line-height:1.6}
.rb-li{display:flex;gap:7px;align-items:flex-start;margin:3px 0;font-size:12.5px;line-height:1.65;color:#4a4460}
.rb-li i{flex:0 0 auto;width:18px;height:18px;border-radius:50%;background:#efe9fb;color:#7c3aed;
  font-style:normal;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;
  line-height:1;margin-top:2px}
.rb-li i.num{background:#e9f2ff;color:#2563b8;border-radius:6px}
.rb-num{color:#b45309;font-weight:700}

.rb-key::before{content:"★";color:#7c3aed;margin-right:5px;font-size:11px;vertical-align:1px}