/* 2026-10-04.19 狀態列（js/effects.js）＋支線任務、奇遇（js/quests.js） */
:root { --fx-buff: #2e7d3f; --fx-buff-bg: rgba(46, 125, 63, 0.12); --fx-debuff: #a8281c; --fx-debuff-bg: rgba(168, 40, 28, 0.12);
  --fx-warn: #b8560f; --fx-warn-bg: rgba(184, 86, 15, 0.13); --fx-info: #2f66b3; --fx-info-bg: rgba(47, 102, 179, 0.12); }
:root[data-theme="night"] { --fx-buff: #5ad08a; --fx-buff-bg: rgba(90, 208, 138, 0.14); --fx-debuff: #ff7a6a; --fx-debuff-bg: rgba(255, 122, 106, 0.15);
  --fx-warn: #ffb04a; --fx-warn-bg: rgba(255, 176, 74, 0.14); --fx-info: #7ab0ff; --fx-info-bg: rgba(122, 176, 255, 0.14); }

/* ── 狀態列：頁首下面一排小圖示 ── */
.fx-bar { margin: 0 auto; max-width: 1200px; padding: 6px 10px 0; }
.fx-bar[hidden] { display: none; }
.fx-bar-in { display: flex; align-items: center; gap: 6px; width: 100%; padding: 4px 6px; border: 1px solid var(--line-2); border-radius: 12px; background: var(--surface);
  color: var(--text); font: inherit; cursor: pointer; overflow-x: auto; scrollbar-width: none; text-align: left; }
.fx-bar-in::-webkit-scrollbar { display: none; }
.fx-bar-in:hover, .fx-bar-in:focus-visible { border-color: var(--line-3); outline: none; box-shadow: 0 0 0 2px var(--gold-soft); }
.fx-bar-t { flex: none; font-size: 11px; font-weight: 800; color: var(--muted); letter-spacing: 0.1em; padding: 0 2px 0 4px; }
.fx-chip { flex: none; display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 9px; border-radius: 999px; font-size: 12.5px; font-weight: 700; white-space: nowrap;
  border: 1px solid transparent; }
.fx-chip.buff { color: var(--fx-buff); background: var(--fx-buff-bg); border-color: color-mix(in srgb, var(--fx-buff) 35%, transparent); }
.fx-chip.debuff { color: var(--fx-debuff); background: var(--fx-debuff-bg); border-color: color-mix(in srgb, var(--fx-debuff) 40%, transparent); }
.fx-chip.warn { color: var(--fx-warn); background: var(--fx-warn-bg); border-color: color-mix(in srgb, var(--fx-warn) 40%, transparent); }
.fx-chip.info { color: var(--fx-info); background: var(--fx-info-bg); border-color: color-mix(in srgb, var(--fx-info) 35%, transparent); }
.fx-chip.me { border-style: dashed; }
.fx-chip .fx-ico { font-size: 14px; line-height: 1; }
.fx-chip .fx-t { font-weight: 600; opacity: 0.8; font-size: 11.5px; }
.fx-chip.debuff:first-of-type { animation: fx-pulse 1.8s ease-in-out infinite; }
@keyframes fx-pulse { 50% { box-shadow: 0 0 0 3px var(--fx-debuff-bg); } }
@media (prefers-reduced-motion: reduce) { .fx-chip.debuff:first-of-type { animation: none; } }
/* 面板 */
.fx-sec + .fx-sec { margin-top: 14px; }
.fx-sec h3 { margin: 0 0 8px; font-size: 14px; color: var(--muted); }
.fx-item { padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface-2); margin-bottom: 8px; border-left: 4px solid var(--fx-info); }
.fx-item.buff { border-left-color: var(--fx-buff); }
.fx-item.debuff { border-left-color: var(--fx-debuff); }
.fx-item.warn { border-left-color: var(--fx-warn); }
.fx-item-h { display: flex; align-items: center; gap: 8px; }
.fx-item-h b { flex: 1; min-width: 0; }
.fx-ico.big { font-size: 20px; }
.fx-tag { flex: none; font-size: 11px; font-weight: 800; padding: 1px 8px; border-radius: 999px; background: var(--fx-info-bg); color: var(--fx-info); }
.fx-item.buff .fx-tag { background: var(--fx-buff-bg); color: var(--fx-buff); }
.fx-item.debuff .fx-tag { background: var(--fx-debuff-bg); color: var(--fx-debuff); }
.fx-item.warn .fx-tag { background: var(--fx-warn-bg); color: var(--fx-warn); }
.fx-item ul { margin: 6px 0 8px; padding-left: 18px; line-height: 1.55; }
.fx-left { margin: 4px 0 0; font-weight: 700; }

/* ── 支線任務、奇遇 ── */
.qs-pop .sheet-body { padding-top: 6px; }
.qs-scroll { position: relative; display: grid; justify-items: center; gap: 10px; padding: 18px 16px 14px; border-radius: 14px; text-align: center;
  background: linear-gradient(180deg, #fbf3dc, #f1e2b8); color: #3a2a18; border: 2px solid #c8a35a; box-shadow: inset 0 0 0 4px rgba(255, 255, 255, 0.35), 0 8px 24px -14px rgba(0, 0, 0, 0.6); }
:root[data-theme="night"] .qs-scroll { background: linear-gradient(180deg, #2c2418, #1e1810); color: #f2e6c8; border-color: #8a6a2a; box-shadow: inset 0 0 0 4px rgba(255, 220, 140, 0.06); }
.qs-pop.luck .qs-scroll { border-color: #d8a830; }
.qs-pop.gotbook .qs-scroll, .qs-pop.luck .qs-scroll:has(.qs-book) { border-color: #d83a2a; box-shadow: 0 0 0 3px rgba(255, 200, 80, 0.4), 0 0 30px rgba(255, 180, 60, 0.35); }
.qs-ico { font-size: 46px; line-height: 1; filter: drop-shadow(0 3px 0 rgba(0, 0, 0, 0.18)); animation: qs-pop 0.55s cubic-bezier(0.2, 1.5, 0.4, 1) both; }
.qs-ico.sm { font-size: 22px; animation: none; }
@keyframes qs-pop { from { transform: scale(0.3) rotate(-12deg); opacity: 0; } to { transform: none; opacity: 1; } }
.qs-story { margin: 0; font-size: 15px; line-height: 1.7; }
.qs-got { margin: 4px 0 0; font-weight: 800; }
.qs-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.qs-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 999px; font-size: 13px; font-weight: 700;
  background: rgba(154, 106, 20, 0.12); border: 1px solid rgba(154, 106, 20, 0.35); }
.qs-chip.coin { background: rgba(240, 190, 40, 0.2); }
.qs-chip.bless { background: var(--fx-buff-bg); border-color: color-mix(in srgb, var(--fx-buff) 40%, transparent); color: var(--fx-buff); }
.qs-chip.book { background: linear-gradient(90deg, #b8202a, #e8902a); color: #fff8e0; border-color: #ffd84a; }
.qs-chip.book.maybe { background: rgba(184, 32, 42, 0.1); color: #a8281c; border-style: dashed; border-color: rgba(184, 32, 42, 0.5); }
:root[data-theme="night"] .qs-chip.book.maybe { color: #ff9a8a; }
.qs-book { display: flex; align-items: center; gap: 12px; text-align: left; padding: 10px 12px; border-radius: 12px; background: rgba(184, 32, 42, 0.08); border: 1px solid rgba(184, 32, 42, 0.35); }
.qs-book p { margin: 2px 0 0; }
.qs-goal { display: grid; gap: 4px; width: min(100%, 320px); }
.qs-bar { height: 8px; border-radius: 999px; background: rgba(0, 0, 0, 0.1); overflow: hidden; }
.qs-bar i { display: block; height: 100%; background: linear-gradient(90deg, #d8a830, #f2c250); border-radius: inherit; }
/* #/quests */
.qs-page { display: grid; gap: 10px; }
.qs-h { margin: 10px 0 0; font-size: 16px; }
.qs-list { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.qs-card { display: grid; gap: 8px; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--line-2); background: var(--surface); }
.qs-card.done { border-color: var(--fx-buff); box-shadow: 0 0 0 2px var(--fx-buff-bg); }
.qs-card.claimed, .qs-card.failed { opacity: 0.75; }
.qs-card-h { display: flex; align-items: center; gap: 8px; }
.qs-card-h b { flex: 1; min-width: 0; }
.qs-state { font-size: 12px; font-weight: 700; color: var(--muted); }
.qs-card .qs-story { font-size: 13.5px; line-height: 1.6; }
.qs-card .qs-chips { justify-content: flex-start; }
.qs-card .btn { justify-self: start; }
.qs-drop { color: var(--muted); }
.qs-bless { display: flex; flex-wrap: wrap; gap: 6px; }
.qs-today { margin: 0; color: var(--muted); }
.qs-help ul { margin: 6px 0 0; padding-left: 18px; line-height: 1.6; }
@media (prefers-reduced-motion: reduce) { .qs-ico { animation: none; } }

/* ── 2026-10-04.20 武術道館（js/dojo.js） ── */
.dj-page { display: grid; gap: 12px; }
.dj-scene { position: relative; }
.dj-stat { display: flex; flex-wrap: wrap; gap: 6px 18px; padding: 10px 14px; }
.dj-list { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); }
.dj-hero { display: flex; align-items: center; gap: 12px; padding: 10px 12px; text-align: left; font: inherit; color: inherit; cursor: pointer; border: 2px solid var(--line-2); }
.dj-hero.on { border-color: #c8302a; box-shadow: 0 0 0 3px rgba(200, 48, 42, 0.18); }
.dj-doll { flex: none; display: grid; place-items: center; width: 64px; }
.dj-hero-main { display: grid; gap: 3px; min-width: 0; flex: 1; }
.dj-skill { display: inline-flex; align-items: center; gap: 6px; }
.dj-lv { display: inline-block; padding: 0 8px; border-radius: 999px; font-size: 12px; font-weight: 800; color: #fff8e0; background: linear-gradient(90deg, #8a2a1a, #c8502a); }
.dj-lv.lv5, .dj-lv.lv6, .dj-lv.lv7, .dj-lv.lv8, .dj-lv.lv9 { background: linear-gradient(90deg, #a8281c, #e8902a); }
.dj-lv.lv10 { background: linear-gradient(90deg, #b8202a, #ffd84a, #b8202a); color: #2a1408; box-shadow: 0 0 10px rgba(255, 200, 80, 0.6); }
.dj-bar { display: block; height: 7px; border-radius: 999px; background: rgba(0, 0, 0, 0.12); overflow: hidden; }
.dj-bar i { display: block; height: 100%; background: linear-gradient(90deg, #c8302a, #ffb03a); }
.dj-go { grid-column: 1 / -1; justify-self: center; min-width: 240px; }
.dj-empty { display: grid; gap: 8px; padding: 14px; }
.dj-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.dj-res { display: grid; gap: 10px; justify-items: center; text-align: center; }
.dj-res-waves { display: flex; gap: 4px; }
.dj-res-waves i { width: 18px; height: 18px; border-radius: 4px; background: rgba(0, 0, 0, 0.12); }
.dj-res-waves i.on { background: linear-gradient(180deg, #e8502a, #a8281c); box-shadow: 0 0 6px rgba(232, 80, 42, 0.5); }
.dj-res-gain { margin: 0; font-size: 18px; }
.dj-res-up { display: grid; justify-items: center; gap: 6px; padding: 10px 14px; border-radius: 12px; background: rgba(184, 32, 42, 0.08); border: 1px solid rgba(184, 32, 42, 0.35); }
.dj-res-up p { margin: 0; }
.church-card { display: grid; gap: 10px; justify-items: start; }

/* ── 2026-10-04.20 轉世修仙（js/dojo.js 的轉世、弟子名片；js/sect.js 門派） ── */
.xn-card { display: flex; gap: 14px; align-items: center; padding: 12px 14px; border: 2px solid var(--xn-c, #b8302a); background: linear-gradient(135deg, color-mix(in srgb, var(--xn-c) 10%, var(--surface)), var(--surface) 60%); }
.xn-doll { flex: none; display: grid; place-items: center; width: 84px; }
.xn-main { display: grid; gap: 4px; min-width: 0; flex: 1; }
.xn-name { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.xn-name b { font: 900 20px/1.2 var(--serif); }
.xn-sect { font-size: 13px; font-weight: 800; color: var(--xn-c); }
.xn-realm { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.xn-rl { padding: 1px 10px; border-radius: 999px; font-weight: 900; color: #fff8e0; background: linear-gradient(90deg, var(--xn-c), color-mix(in srgb, var(--xn-c) 60%, #ffd84a)); }
.xn-bar { display: block; height: 8px; border-radius: 999px; background: rgba(0, 0, 0, 0.12); overflow: hidden; }
.xn-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--xn-c), #ffd84a); }
.xn-arts { display: flex; flex-wrap: wrap; gap: 4px; }
.xn-art { display: inline-block; padding: 1px 8px; margin: 1px 2px; border-radius: 999px; font-size: 12px; font-weight: 700; background: color-mix(in srgb, var(--xn-c, #9a6a14) 14%, transparent); border: 1px solid color-mix(in srgb, var(--xn-c, #9a6a14) 40%, transparent); }
.xn-card .btn { justify-self: start; }
.xn-h { margin: 14px 0 6px; font-size: 16px; }
.xn-cands { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
.xn-cand { display: grid; justify-items: center; gap: 2px; padding: 8px; font: inherit; color: inherit; cursor: pointer; border: 2px solid var(--line-2); }
.xn-cand.on { border-color: #c8302a; box-shadow: 0 0 0 3px rgba(200, 48, 42, 0.18); }
.xn-sects { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.xn-sectc { display: grid; gap: 4px; padding: 10px 12px; text-align: left; font: inherit; color: inherit; cursor: pointer; border: 2px solid color-mix(in srgb, var(--xn-c) 35%, transparent); }
.xn-sectc b { color: var(--xn-c); font-size: 16px; }
.xn-sectc.on { border-color: var(--xn-c); box-shadow: 0 0 0 3px color-mix(in srgb, var(--xn-c) 25%, transparent); background: color-mix(in srgb, var(--xn-c) 8%, var(--surface)); }
.xn-page { display: grid; gap: 12px; }
.xn-banner { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 14px; color: #fff8e8;
  background: linear-gradient(120deg, var(--xn-c), color-mix(in srgb, var(--xn-c) 55%, #1a120c)); box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.15); }
.xn-banner h1 { margin: 0; font: 900 28px/1.1 var(--serif); }
.xn-banner p { margin: 4px 0 0; opacity: 0.9; }
.xn-banner-ico { font-size: 42px; }
.xn-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.xn-tab { padding: 4px 12px; border-radius: 999px; border: 1px solid var(--line-2); background: var(--surface); color: var(--text); text-decoration: none; font-size: 13px; font-weight: 700; }
.xn-tab.on { background: var(--xn-c); color: #fff; border-color: var(--xn-c); }
.xn-arts-list, .xn-learn { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); }
.xn-art-row { display: grid; gap: 8px; padding: 10px 12px; }
.xn-art-h { display: flex; align-items: flex-start; gap: 10px; }
.xn-art-h > div { flex: 1; min-width: 0; }
.xn-art-h p { margin: 2px 0 0; }
.xn-art-ico { font-size: 26px; line-height: 1; }
.xn-art-up { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.xn-list { margin: 0; padding-left: 18px; line-height: 1.7; }
.xn-list li { margin: 2px 0; }
.xn-not { display: grid; gap: 8px; justify-items: start; padding: 14px; }
.xn-trial { display: grid; gap: 6px; justify-items: start; padding: 12px 14px; }
.xn-scene[hidden] { display: none; }
/* 2026-10-06 修仙弟子在冒險者資料的分頁：☯️ 修仙境界、🥋 武功（js/xian-tabs.js） */
.xt-tab { display: grid; gap: 10px; }
.xt-head { display: grid; gap: 6px; border-left: 4px solid var(--xn-c, #a07a2a); }
.xt-now { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0; }
.xt-realms { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 6px; }
.xt-realm { display: grid; gap: 2px; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--line-2); background: var(--surface); color: var(--text); opacity: 0.7; } /* 深色面板（冒險者資料）也看得清楚：用主題的顏色 */
.xt-realm b { font-size: 15px; }
.xt-realm.done { opacity: 1; }
.xt-realm.done b::after { content: ' ✓'; color: #3a9a5a; }
.xt-realm.on { opacity: 1; border-color: var(--xn-c, #a07a2a); box-shadow: 0 0 0 2px var(--xn-c, #a07a2a) inset; }
.xt-rank p { margin: 2px 0; }
.xt-links { display: flex; gap: 8px; flex-wrap: wrap; }
/* 2026-10-06 武功分類：帶著的武功（內功、輕功、套路×2）、換武功的清單、還沒學的 */
.xt-eq { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.xt-slot { display: flex; align-items: center; gap: 6px; padding: 8px 10px; border-radius: 12px; border: 2px solid var(--xn-c, #a07a2a); background: var(--surface); color: var(--text); font: inherit; text-align: left; min-width: 0; cursor: pointer; }
.xt-slot .muted { color: var(--muted); }
.xt-slot:disabled { cursor: default; opacity: 1; }
.xt-slot.empty { border-style: dashed; opacity: 0.8; }
.xt-slot b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.xt-slot-l { flex: none; padding: 1px 6px; border-radius: 999px; background: var(--xn-c, #a07a2a); color: #fff; font-weight: 700; }
.xt-slot-chg { margin-left: auto; flex: none; opacity: 0.7; }
.xt-pick { display: grid; gap: 8px; }
.xt-pick-row { display: flex; align-items: center; gap: 10px; text-align: left; color: inherit; font: inherit; cursor: pointer; }
.xt-pick-row p { margin: 2px 0 0; }
.xt-pick-row.on { box-shadow: 0 0 0 2px var(--xn-c, #a07a2a) inset; }
.xn-art-row.xt-locked { opacity: 0.85; }
.xn-art-row.xt-on { box-shadow: 0 0 0 2px var(--xn-c, #a07a2a) inset; }
.xt-tab h3.xn-h { margin: 8px 0 2px; }
@media (max-width: 420px) { .xt-eq { grid-template-columns: 1fr; } }
/* 2026-10-06.25 📚 道館書架、無派別的武學秘笈（js/xian-tabs.js 的 xianShelf、xianScrollRow；道館、門派頁、物品欄） */
.xt-shelf { display: grid; gap: 8px; padding: 12px 14px; border-left: 4px solid #3aa88a; }
.xt-shelf p { margin: 0; }
.xt-shelf-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.xt-shelf-h .xn-h { margin: 0; }
.xt-stone { display: inline-flex; align-items: center; gap: 4px; padding: 2px 10px; border-radius: 999px; background: rgba(58, 168, 138, 0.14); border: 1px solid rgba(58, 168, 138, 0.5); font-size: 13px; white-space: nowrap; }
.xt-stone b { font-variant-numeric: tabular-nums; }
.xt-scroll-act { flex: none; align-self: center; text-align: right; }
.xt-scroll-act .btn { white-space: nowrap; }
.xt-ok { color: #2a8a4a; font-weight: 700; white-space: nowrap; }
.xn-art-row.xt-has { box-shadow: 0 0 0 2px #3aa88a inset; }
@media (max-width: 520px) { /* 手機：按鈕換到下一行（字才不會擠成一條） */
  .xt-scroll .xn-art-h { flex-wrap: wrap; }
  .xt-scroll .xt-scroll-act { flex-basis: 100%; }
}
.bag-scrolls .xn-art-row { background: var(--surface, #241c19); color: var(--text); border: 1px solid var(--line-2); }
.hunt-loot .hunt-stone, .mn-gstone { color: #2a9a7a; font-weight: 700; }
/* 2026-10-06 修仙弟子：星星換成境界 */
.xn-realm-chip { display: inline-flex; align-items: center; padding: 1px 8px; border-radius: 999px; background: var(--xn-c, #6a4a8a); color: #fff; font-weight: 700; font-size: 12px; white-space: nowrap; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35) inset; }
.xn-realm-chip.xr-sm { font-size: 11px; padding: 0 6px; }
.xn-realm-chip.xr-lg { font-size: 15px; padding: 3px 12px; }
/* 2026-10-06.22 任務閣（門派頁，js/sect.js） */
.xm-board { display: grid; gap: 8px; }
.xm-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.xm-card { display: grid; gap: 6px; padding: 12px 14px; border-left: 4px solid var(--xn-c, #a07a2a); }
.xm-card p { margin: 0; }
.xm-h { display: flex; align-items: center; gap: 8px; }
.xm-ico { font-size: 22px; }
.xm-chip { margin-left: auto; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; color: #fff; background: #6a7a4a; }
.xm-chip.fight { background: #a8302a; }
.xm-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.xm-ok { color: #3a9a5a; font-weight: 700; }
.xm-claimed, .xm-failed { opacity: 0.7; }
.xm-done { box-shadow: 0 0 0 2px #e0b04a inset; }
/* 2026-10-06.23 靈根、專精、靈根天賦、拜師、師傅傳授（js/xian-tabs.js；用主題顏色：深色面板也看得清楚） */
.xr-root { display: inline-flex; align-items: center; gap: 3px; padding: 1px 8px 1px 3px; border-radius: 999px; background: var(--surface-2, rgba(0, 0, 0, 0.06)); border: 1px solid var(--line-2); color: var(--text); font-size: 12px; white-space: nowrap; }
.xr-root.big { font-size: 14px; padding: 2px 10px 2px 4px; }
.xr-root b { margin-left: 2px; }
.xr-root.g-tian { border-color: #e8c04a; box-shadow: 0 0 8px rgba(255, 210, 90, 0.55); }
.xr-root.g-yi { border-color: #a070ff; box-shadow: 0 0 8px rgba(160, 112, 255, 0.5); }
.xr-root.g-di { border-color: #6ab0e0; }
.xr-dot { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: var(--el); color: #fff; font-style: normal; font-size: 11px; font-weight: 900; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.45); box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.2); }
.xr-root.big .xr-dot { width: 22px; height: 22px; font-size: 13px; }
.xt-rootcard { display: grid; gap: 6px; }
.xt-root-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.xt-rootcard p, .xt-tal p { margin: 0; }
.xt-spec { display: grid; gap: 4px; }
.xt-spec-row { display: grid; grid-template-columns: 76px minmax(0, 1fr) 44px 40px; align-items: center; gap: 6px; font-size: 12px; color: var(--text); }
.xt-spec-row.fit .xt-spec-n { color: var(--gold, #c8902a); font-weight: 700; }
.xt-spec-bar { position: relative; height: 8px; border-radius: 999px; background: var(--surface-3, rgba(0, 0, 0, 0.1)); overflow: hidden; }
.xt-spec-bar i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 999px; background: linear-gradient(90deg, var(--xn-c, #a07a2a), #ffd84a); }
.xt-spec-bar u { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--muted); opacity: 0.7; text-decoration: none; }
.xt-spec-v { text-align: right; font-variant-numeric: tabular-nums; }
.xt-tal { display: grid; gap: 6px; border-left: 4px solid var(--el); }
.xt-tal-h { display: flex; align-items: center; gap: 6px; }
.xt-tal-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 6px; }
.xt-tal-n { display: grid; gap: 1px; padding: 6px 8px; border-radius: 8px; border: 1px dashed var(--line-2); background: var(--surface-2, transparent); color: var(--text); opacity: 0.6; }
.xt-tal-n.on { opacity: 1; border-style: solid; border-color: var(--el); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--el) 40%, transparent); }
.xt-masters, .xt-teach { display: grid; gap: 8px; }
.xt-master-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.xt-master { display: grid; gap: 6px; align-content: start; border-top: 3px solid var(--xn-c, #a07a2a); }
.xt-master.on { box-shadow: 0 0 0 2px var(--xn-c, #a07a2a) inset; }
.xt-master p { margin: 0; }
.xt-master-h { display: flex; align-items: center; gap: 8px; }
.xt-master-ico { font-size: 26px; }
.xt-master-arts { display: flex; flex-wrap: wrap; gap: 4px; }
.xt-mart { display: inline-flex; align-items: center; gap: 4px; padding: 2px 6px 2px 2px; border-radius: 8px; background: var(--surface-2, rgba(0, 0, 0, 0.05)); border: 1px solid var(--line-2); font-size: 12px; }
.xt-reqs { display: flex; flex-wrap: wrap; gap: 4px; }
.xt-req { padding: 1px 8px; border-radius: 999px; font-size: 12px; border: 1px solid #c86a5a; color: #c84a3a; background: rgba(200, 74, 58, 0.08); }
.xt-req.ok { border-color: #3a9a5a; color: #2a8a4a; background: rgba(58, 154, 90, 0.1); }
.xt-req.ok::before { content: '✓ '; }
.xt-g { margin: 6px 0 2px; font-weight: 700; color: var(--muted); }
/* 2026-10-06.24 師傅：有樣子（穿本門長袍的修仙者）、一句話的對話泡泡；點了開對話框（左邊師傅、右邊名字＋話＋選項） */
.xt-master { grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 10px; text-align: left; color: var(--text); font: inherit; cursor: pointer; border-top: 3px solid var(--xn-c, #a07a2a); }
.xt-master:hover { filter: brightness(1.04); }
.xt-master-pic { display: grid; place-items: end center; width: 84px; min-height: 104px; border-radius: 10px; padding: 4px 0;
  background: radial-gradient(ellipse 70% 30% at 50% 92%, rgba(0, 0, 0, 0.18), transparent 70%), radial-gradient(circle at 50% 40%, color-mix(in srgb, var(--xn-c, #a07a2a) 26%, transparent), transparent 70%); }
.xt-master-body { display: grid; gap: 5px; min-width: 0; }
.xt-master-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; }
.xt-master-h b { font-size: 16px; }
.xt-master-act { color: var(--xn-c, #a07a2a); font-weight: 700; }
.xt-bubble { position: relative; display: block; margin: 0 0 0 6px; padding: 6px 10px; border-radius: 10px; background: var(--surface-2, rgba(0, 0, 0, 0.05)); border: 1px solid var(--line-2); color: var(--text); }
.xt-bubble::before { content: ''; position: absolute; left: -7px; top: 10px; border: 6px solid transparent; border-right-color: var(--line-2); border-left: 0; }
.xt-intro-m { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: start; margin-top: 8px; }
.xt-intro-pic { display: grid; place-items: end center; width: 56px; }
/* 對話框 */
.xd-sheet .sheet-body { padding-top: 6px; }
.xd { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 12px; align-items: stretch; }
@media (max-width: 520px) { .xd { grid-template-columns: 1fr; } .xd-stage { min-height: 170px; } }
.xd-stage { position: relative; display: grid; place-items: end center; border-radius: 14px; padding: 8px 0 12px; overflow: hidden;
  background: linear-gradient(180deg, color-mix(in srgb, var(--xn-c, #6a7aa8) 30%, #f8f0dc) 0%, #efe3c6 70%, #d8c8a0 100%); box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--xn-c, #6a7aa8) 50%, transparent); }
.xd-stage::before { content: ''; position: absolute; left: -10%; right: -10%; bottom: 0; height: 26%; background: radial-gradient(ellipse at 50% 100%, rgba(255, 255, 255, 0.65), transparent 70%); }
.xd-pic { position: relative; z-index: 1; animation: xd-breathe 3.2s ease-in-out infinite; }
@keyframes xd-breathe { 50% { transform: translateY(-2px); } }
.xd-hall { position: absolute; left: 8px; top: 8px; z-index: 1; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; color: #fff; background: var(--xn-c, #6a7aa8); }
.xd-box { display: grid; gap: 8px; align-content: start; padding: 12px 14px; border-radius: 14px; background: var(--surface); border: 2px solid var(--xn-c, #a07a2a); color: var(--text); box-shadow: 0 2px 0 rgba(0, 0, 0, 0.15); }
.xd-name { margin: 0; }
.xd-name b { font-size: 17px; padding: 1px 10px; border-radius: 6px; background: var(--xn-c, #a07a2a); color: #fff; }
.xd-text { margin: 0; min-height: 3.2em; font-size: 15px; line-height: 1.6; }
.xd-opts { display: grid; gap: 6px; }
.xd-opt { justify-content: flex-start; text-align: left; display: flex; gap: 8px; align-items: baseline; }
.xd-opt::before { content: '▶'; font-size: 10px; opacity: 0.6; }
.xd-opt small { margin-left: auto; opacity: 0.75; }
.xd-list { display: grid; gap: 6px; max-height: 46vh; overflow: auto; }
.xd-art { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 6px 8px; border-radius: 10px; border: 1px solid var(--line-2); background: var(--surface-2, transparent); }
.xd-art p { margin: 2px 0; }
@media (prefers-reduced-motion: reduce) { .xd-pic { animation: none; } }
/* 2026-10-06.27 🎁 巔峰寶箱（js/cup-chest.js：物品欄的特殊頁、競技場） */
.cup-chest { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line-2); background: var(--surface); color: var(--text); }
.cup-chest .cc-main { flex: 1; min-width: 0; display: grid; gap: 2px; }
.cc-ico { font-size: 30px; line-height: 1; flex: none; }
.cup-chest.cc-supreme { border-color: #e8b04a; box-shadow: 0 0 0 1px #e8b04a inset, 0 0 14px rgba(232, 176, 74, 0.35); }
.cup-chest.cc-gold { border-color: #d8a838; }
.cup-chest.cc-silver { border-color: #a8b4c8; }
.cup-chest.cc-bronze { border-color: #b8783a; }
.cc-open { flex: none; }
.ar-chests, .bag-chests { display: grid; gap: 8px; }
.ar-chest-list { display: grid; gap: 6px; }
.ar-chest-t { display: flex; align-items: flex-start; gap: 10px; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--line-2); }
.ar-chest-t p { margin: 2px 0 0; }
.ar-chest-t.me { border-color: var(--accent, #c8902a); box-shadow: 0 0 0 1px var(--accent, #c8902a) inset; }
.cc-got-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: 15px; }
@media (max-width: 520px) { .cup-chest { flex-wrap: wrap; } .cup-chest .cc-open { margin-left: auto; } }

/* ── 2026-10-04.29 修煉（js/xian-tabs.js 的 xianCultivate：打坐、閉關、丹藥、渡劫）、小境界的修為條、鐵匠鋪重鑄 ── */
.xn-bar-sub { position: relative; overflow: visible; }
.xn-bar-sub i { border-radius: 999px; }
.xn-bar-sub u { position: absolute; top: -2px; bottom: -2px; width: 2px; margin-left: -1px; background: var(--surface); opacity: 0.9; }
.xn-bar-sub.full i { background: linear-gradient(90deg, #ffd84a, #fff3b0, #ffd84a); box-shadow: 0 0 8px rgba(255, 200, 60, 0.8); }
.xc { display: grid; gap: 10px; padding: 12px 14px; border-left: 4px solid var(--xn-c, #6a4ad8); min-width: 0; }
.xc .xt-shelf-h .xn-h { margin: 0; }
.xc-now { padding: 1px 10px; border-radius: 999px; font-weight: 900; font-size: 13px; color: #fff8e0; background: linear-gradient(90deg, var(--xn-c, #6a4ad8), color-mix(in srgb, var(--xn-c, #6a4ad8) 60%, #ffd84a)); }
.xc-tabs { justify-self: start; max-width: 100%; }
.xc-pane { display: grid; gap: 8px; min-width: 0; }
.xc-pane p { margin: 0; }
.xc-pane .xn-h { margin: 6px 0 0; }
.xc-pane > .btn { justify-self: start; max-width: 100%; white-space: normal; height: auto; min-height: 40px; padding-block: 6px; line-height: 1.35; }
.xc-big { font-size: 15px; }
.xc-big b { font-variant-numeric: tabular-nums; }
.xc-closes { display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr)); }
.xc-close-opt { display: grid; gap: 2px; justify-items: center; height: auto; min-height: 0; line-height: 1.3; padding: 8px 10px; white-space: normal; text-align: center; }
.xc-close-opt small { font-size: 12px; opacity: 0.85; }
.xc-close { padding: 10px 12px; border-radius: 10px; background: color-mix(in srgb, var(--xn-c, #6a4ad8) 10%, transparent); }
.xc-pills { display: grid; gap: 6px; }
.xc-pill { display: flex; align-items: center; gap: 10px; padding: 8px 10px; min-width: 0; }
.xc-pill.has { border-color: color-mix(in srgb, var(--xn-c, #6a4ad8) 50%, transparent); }
.xc-pill-ico { flex: none; font-size: 22px; width: 30px; text-align: center; }
.xc-pill-main { flex: 1; min-width: 0; }
.xc-pill-main p { margin: 2px 0 0; }
.xc-pill-act { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; flex: none; max-width: 50%; }
.xc-reqs { list-style: none; margin: 0; padding: 0; display: grid; gap: 3px; font-size: 13px; }
.xc-reqs li { color: var(--danger-text, #c8302a); }
.xc-reqs li.ok { color: var(--win, #2a8a4a); }
.xc-aids { display: grid; gap: 6px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.xc-aid { display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: 2px 8px; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--line, rgba(0, 0, 0, 0.15)); cursor: pointer; }
.xc-aid small { grid-column: 1 / -1; font-size: 12px; opacity: 0.8; }
.xc-aid.on { border-color: #e8b020; background: rgba(255, 200, 60, 0.14); }
.xc-aid.none { opacity: 0.55; cursor: default; }
.xc-jie-go { min-width: min(100%, 240px); }
.xc-divine { background: linear-gradient(135deg, rgba(120, 90, 255, 0.18), rgba(255, 216, 74, 0.25)); }
.xn-art.xc-gear.r3 { border-color: #d8a020; }
.xn-art.xc-gear.r4, .xn-art.xc-gear.divine { border-color: #b048e0; background: rgba(176, 72, 224, 0.14); }
.dj-scene.dj-jie { box-shadow: 0 0 0 2px rgba(150, 120, 255, 0.6), 0 0 24px rgba(150, 120, 255, 0.45); }
.forge-recast-opts { display: flex; flex-wrap: wrap; gap: 6px; }
.forge-recast-opts .btn { display: inline-flex; align-items: center; gap: 6px; height: auto; min-height: 32px; padding-block: 4px; }
@media (max-width: 480px) {
  .xc-pill { flex-wrap: wrap; }
  .xc-pill-act { max-width: 100%; flex: 1 1 100%; justify-content: flex-start; }
}
