/* 2026-10-10.368 介面精緻化（使用者：「遊戲很多地方都做的很不精緻⋯沒有做寵物介面或公會的那種優化處理的都處理一下」）
   頁首橫幅 .pg-hero（js/ui.js pageHero）＋各頁的小修 */

/* ── 頁首橫幅：深色木紋＋斜紋＋金邊（跟公會、成就頁同一套） ── */
.pg-hero { --ph-a: #4f2c14; --ph-b: #24140a; --ph-line: rgba(240, 196, 120, 0.5); --ph-glow: rgba(255, 210, 120, 0.26); --ph-ink: #f6e6c4; --ph-title: #ffe7b0; --ph-k: #f0cf8a;
  position: relative; overflow: hidden; display: grid; gap: 10px; padding: 14px 16px 16px; margin: 0 0 12px; border-radius: 18px; color: var(--ph-ink);
  background: radial-gradient(120% 140% at 100% 0%, var(--ph-glow), transparent 55%), repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.04) 0 10px, transparent 10px 20px), linear-gradient(135deg, var(--ph-a), var(--ph-b) 75%);
  border: 1px solid var(--ph-line); box-shadow: inset 0 0 0 1px rgba(255, 220, 150, 0.12), 0 10px 24px -14px rgba(40, 20, 5, 0.9); }
.pg-hero::after { content: ""; position: absolute; right: -50px; bottom: -80px; width: 230px; height: 230px; border-radius: 50%; background: radial-gradient(circle, var(--ph-glow), transparent 70%); pointer-events: none; }
.pg-hero > * { position: relative; z-index: 1; min-width: 0; }
.pg-hero-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pg-hero .pg-hero-back, .pg-hero .pg-hero-acts .btn:not(.btn-primary) { background: rgba(255, 240, 210, 0.12); border-color: rgba(255, 220, 150, 0.45); color: var(--ph-title); box-shadow: none; }
.pg-hero .pg-hero-back:hover, .pg-hero .pg-hero-acts .btn:not(.btn-primary):hover { background: rgba(255, 240, 210, 0.22); color: #fff4d8; }
.pg-hero-t { display: flex; align-items: center; gap: 12px; }
.pg-hero-ico { flex: none; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 16px; font-size: 32px; line-height: 1;
  background: linear-gradient(160deg, rgba(255, 230, 170, 0.28), rgba(255, 230, 170, 0.06)); border: 1px solid rgba(255, 220, 150, 0.45); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 6px 14px -8px rgba(0, 0, 0, 0.6); }
.pg-hero-tt { display: grid; gap: 2px; min-width: 0; }
.pg-hero-k { margin: 0; font-size: 12px; letter-spacing: 0.12em; color: var(--ph-k); }
.pg-hero h1 { margin: 0; font-family: var(--serif); font-size: 28px; line-height: 1.2; letter-spacing: 0.08em; color: var(--ph-title); text-shadow: 0 2px 0 rgba(0, 0, 0, 0.35); overflow-wrap: anywhere; }
.pg-hero-p { margin: 0; font-size: 14px; line-height: 1.65; color: var(--ph-ink); opacity: 0.95; }
.pg-hero-p b { color: #ffd98a; }
.pg-hero-stats { display: flex; flex-wrap: wrap; gap: 6px; }
.pg-hero-stats[hidden] { display: none; }
.pg-hero-stats > span { display: grid; justify-items: center; align-content: center; min-width: 72px; padding: 5px 10px; border-radius: 10px; background: rgba(0, 0, 0, 0.25); border: 1px solid rgba(255, 220, 150, 0.2); text-align: center; }
.pg-hero-stats b { font-family: var(--serif); font-size: 17px; line-height: 1.3; color: #fff3da; }
.pg-hero-stats small { font-size: 11px; color: #d8c4a0; }
.pg-hero-stats .hot { border-color: #ff8a5a; box-shadow: 0 0 12px rgba(255, 120, 60, 0.45); }
.pg-hero-stats .hot b { color: #ffb08a; }
.pg-hero-acts { display: flex; flex-wrap: wrap; gap: 6px; }
/* 色調：村子綠、霜月藍、鳴沙沙、教堂紫、信箱紅 */
.pg-hero.t-cun { --ph-a: #1f4436; --ph-b: #10241c; --ph-line: #5a9a7a; --ph-glow: rgba(150, 220, 180, 0.24); --ph-k: #bfe6c8; }
.pg-hero.t-ling { --ph-a: #1d3550; --ph-b: #0f1c2c; --ph-line: #5a86b0; --ph-glow: rgba(180, 220, 255, 0.26); --ph-k: #bcdcf6; }
.pg-hero.t-sha { --ph-a: #5a3414; --ph-b: #2c1a0a; --ph-line: #b07a3a; --ph-glow: rgba(255, 200, 130, 0.3); }
.pg-hero.t-holy { --ph-a: #2e2552; --ph-b: #141029; --ph-line: #8a7ac0; --ph-glow: rgba(210, 190, 255, 0.28); --ph-k: #d6cbff; --ph-title: #f3eaff; }
.pg-hero.t-red { --ph-a: #5c1d16; --ph-b: #2a0d09; --ph-line: #c0704a; --ph-glow: rgba(255, 170, 120, 0.28); }
@media (max-width: 520px) {
  .pg-hero { padding: 12px 14px 14px; }
  .pg-hero h1 { font-size: 24px; }
  .pg-hero-ico { width: 48px; height: 48px; font-size: 28px; border-radius: 14px; }
  .pg-hero-p { font-size: 13.5px; }
}

/* ── 返回鈕：上一頁的名字太長（「競技場史詩大亂鬥」）最多七八個字，多的變…，不擠到標題 ── */
a[data-navb] > span { display: inline-block; max-width: 7.5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }
/* 德州撲克大廳的標題：擠的時候縮成…，不疊到錢 */
.pk-head-lobby .pk-title { flex: 0 1 auto; overflow: hidden; text-overflow: ellipsis; }
.pk-head > .btn { flex: none; }

/* ── 📜 支線任務 ── */
.qs-wrap { display: grid; gap: 12px; max-width: 960px; margin: 0 auto; min-width: 0; }
.qs-wrap .pg-hero { margin: 0; }
.qs-sec { display: grid; gap: 10px; padding: 14px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line-2); box-shadow: 0 6px 16px -14px rgba(40, 20, 5, 0.6); }
.qs-sec-h { display: flex; align-items: center; gap: 8px; margin: 0; font-family: var(--serif); font-size: 18px; }
.qs-sec-h small { margin-left: auto; font-family: var(--font); font-size: 12px; font-weight: 700; color: var(--muted); }
.qs-card { position: relative; overflow: hidden; }
.qs-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--line-2); }
.qs-card.open::before { background: linear-gradient(180deg, #e0a830, #c07a20); }
.qs-card.done::before { background: linear-gradient(180deg, #4ab070, #2e8a52); }
.qs-card.claimed::before, .qs-card.failed::before { background: var(--line-2); }
.qs-card-h .qs-ico.sm { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--surface-2); border: 1px solid var(--line-2); font-size: 20px; }
.qs-state { padding: 2px 8px; border-radius: 999px; background: var(--surface-2); white-space: nowrap; }
.qs-card.done .qs-state { background: var(--fx-buff-bg); color: var(--fx-buff); }
.qs-card.open .qs-state { background: rgba(224, 168, 48, 0.16); color: #9a6a10; }
[data-theme="night"] .qs-card.open .qs-state { color: #f0c060; }
/* 沒有任務：去哪裡會遇到 */
.qs-empty { display: grid; justify-items: center; gap: 8px; padding: 14px 10px 6px; text-align: center; }
.qs-empty-i { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 18px; font-size: 36px; background: var(--surface-2); border: 1px dashed var(--line-2); }
.qs-empty p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.qs-srcs { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.qs-src { display: inline-flex; align-items: center; gap: 4px; padding: 5px 10px; border-radius: 999px; border: 1px solid var(--line-2); background: var(--surface-2); color: var(--text); font-size: 13px; font-weight: 700; text-decoration: none; }
a.qs-src:hover { border-color: var(--gold); background: var(--surface); }
.qs-src.g { border-style: dashed; }
.qs-rules { margin: 0; padding-left: 18px; line-height: 1.65; font-size: 13.5px; }

/* ── ⛪ 誦經教堂：彩繪玻璃窗、兩根蠟燭、旁邊的去處 ── */
.ch-wrap { display: grid; gap: 12px; max-width: 760px; margin: 0 auto; min-width: 0; }
.ch-wrap .pg-hero { margin: 0; }
.ch-body { display: grid; gap: 12px; min-width: 0; }
.ch-card { justify-items: stretch; }
.ch-card > .btn { justify-self: start; }
.ch-stage { position: relative; overflow: hidden; min-height: 190px; align-content: end; padding: 16px 12px 14px;
  background: radial-gradient(90% 70% at 50% 18%, rgba(255, 214, 140, 0.35), transparent 70%), linear-gradient(180deg, #2b2244 0%, #3a2c4e 55%, #5a4030 56%, #6a4c36 100%); border-color: #6a5a8a; color: #f6ead6; }
.ch-stage .church-say { position: relative; z-index: 1; padding: 6px 14px; border-radius: 12px; background: rgba(255, 248, 230, 0.92); color: #3a2a18; box-shadow: 0 6px 14px -8px rgba(0, 0, 0, 0.7); }
.ch-stage .church-ico { position: relative; z-index: 1; filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.5)); }
/* 尖拱窗：三格彩色玻璃＋窗櫺 */
.ch-window { position: absolute; left: 50%; top: 12px; transform: translateX(-50%); display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; width: 132px; height: 112px; padding: 6px;
  border-radius: 66px 66px 6px 6px; background: #1c1630; border: 3px solid #8a7a50; box-shadow: 0 0 30px rgba(255, 200, 120, 0.35), inset 0 0 0 2px rgba(0, 0, 0, 0.4); opacity: 0.9; }
.ch-window i { display: block; border-radius: 40px 40px 2px 2px; background: linear-gradient(160deg, #e85a5a 0 22%, #f2c14a 22% 44%, #5ab0e8 44% 66%, #7ac06a 66% 82%, #b07ae0 82%); opacity: 0.85; }
.ch-window i:nth-child(2) { border-radius: 60px 60px 2px 2px; background: linear-gradient(200deg, #5ab0e8 0 25%, #f2c14a 25% 48%, #e85a5a 48% 70%, #b07ae0 70%); }
.ch-window i:nth-child(3) { background: linear-gradient(200deg, #7ac06a 0 20%, #b07ae0 20% 45%, #f2c14a 45% 70%, #5ab0e8 70%); }
.ch-candle { position: absolute; bottom: 40px; width: 10px; height: 34px; border-radius: 3px; background: linear-gradient(90deg, #f4ead2, #d8c8a0); box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); }
.ch-candle::before { content: ""; position: absolute; left: 50%; top: -14px; width: 8px; height: 13px; margin-left: -4px; border-radius: 50% 50% 50% 50% / 65% 65% 35% 35%;
  background: radial-gradient(circle at 50% 70%, #fff6c0, #ffb030 60%, rgba(255, 120, 20, 0)); box-shadow: 0 0 14px 4px rgba(255, 180, 60, 0.55); animation: ch-flame 1.6s ease-in-out infinite alternate; }
.ch-candle.l { left: 18%; }
.ch-candle.r { right: 18%; }
.ch-candle.r::before { animation-delay: -0.7s; }
@keyframes ch-flame { from { transform: scale(1) rotate(-3deg); opacity: 0.9; } to { transform: scale(1.12, 0.92) rotate(3deg); opacity: 1; } }
.ch-links { display: grid; gap: 10px; }
.ch-links-h { margin: 0; font-family: var(--serif); font-size: 17px; }
.ch-link-grid { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); }
.ch-link { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line-2); background: var(--surface-2); color: var(--text); text-decoration: none; }
.ch-link:hover { border-color: var(--gold); background: var(--surface); }
.ch-link-i { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; font-size: 22px; background: var(--surface); border: 1px solid var(--line-2); }
.ch-link > span:last-child { display: grid; min-width: 0; }
.ch-link b { font-size: 14px; }
.ch-link small { font-size: 12px; color: var(--muted); }
@media (prefers-reduced-motion: reduce) { .ch-candle::before { animation: none; } }

/* ── 橫幅裡的錢（acts 放 money()） ── */
.pg-hero-acts .shrine-bal, .pg-hero-acts .coin-amt { color: #fff3da; }
.pg-hero-acts .coin-amt { padding: 4px 10px; border-radius: 999px; background: rgba(0, 0, 0, 0.25); border: 1px solid rgba(255, 220, 150, 0.25); font-size: 15px; }
.pg-hero-acts .coin-amt .ico { color: #f0c060; fill: rgba(240, 192, 96, 0.2); }
.pg-hero-acts .shrine-bal:empty { display: none; }

/* ── 📮 捐款與信箱 ── */
.donation-page { max-width: 1100px; margin: 0 auto; min-width: 0; }
.donation-page > .pg-hero { margin: 0; }

/* ── 🌲 村外打怪：空的地區有地區的顏色、大圖示、一句介紹；城還沒開放的標鎖 ── */
.hunt-page > .pg-hero { margin: 0 0 12px; }
.hunt-slot.empty { position: relative; overflow: hidden; border-style: solid; border-color: color-mix(in srgb, var(--hz, #9a7a3a) 45%, var(--line-2));
  background: linear-gradient(135deg, color-mix(in srgb, var(--hz, #9a7a3a) 16%, var(--surface)), var(--surface) 70%); }
.hunt-slot.empty > * { position: relative; z-index: 1; }
.hunt-slot.empty > .hunt-slot-bg { position: absolute; right: -8px; bottom: -16px; z-index: 0; font-size: 72px; line-height: 1; opacity: 0.14; pointer-events: none; transform: rotate(-8deg); }
.hunt-slot-d { margin: 0; color: var(--text-2, var(--muted)); }
.hunt-slot.empty.locked { filter: saturate(0.5); }
.hunt-slot.empty.locked .hunt-lock { margin: 0; font-weight: 700; color: var(--muted); }
.hunt-slot.hz-west { --hz: #c8a030; }
.hunt-slot.hz-east { --hz: #3f8a48; }
.hunt-slot.hz-deep { --hz: #8a3aa8; }
.hunt-slot.hz-west2 { --hz: #5a8ac8; }
.hunt-slot.hz-east2 { --hz: #2a8aa8; }
.hunt-slot.hz-east3 { --hz: #c88a3a; }
.hunt-slot.hz-west3 { --hz: #a8643a; }

/* ── 🌾🌲 村外沒有事情進不去的那一張：上面一張小風景 ── */
.xw-gate { overflow: hidden; padding-top: 0; }
.xw-gate-art { position: relative; justify-self: stretch; align-self: stretch; height: 118px; margin: 0 -16px 2px; overflow: hidden;
  background: linear-gradient(180deg, #f6c27a 0%, #f2a65a 42%, #e98c4e 60%, #b8743e 61%); }
.xw-gate-art i { position: absolute; left: -10%; right: -10%; bottom: 0; border-radius: 50% 50% 0 0 / 100% 100% 0 0; }
.xw-gate.w .xw-gate-art i.a { height: 62px; background: #9a8a3e; left: -30%; right: 30%; }
.xw-gate.w .xw-gate-art i.b { height: 48px; background: #7a6e30; left: 25%; right: -35%; }
.xw-gate.w .xw-gate-art i.c { height: 26px; border-radius: 0; background: repeating-linear-gradient(90deg, #5e5424 0 3px, #6e6428 3px 7px); }
.xw-gate.e .xw-gate-art { background: linear-gradient(180deg, #24324a 0%, #2c3e46 45%, #1a2a24 100%); }
.xw-gate.e .xw-gate-art i { border-radius: 0; height: 100%; background-repeat: repeat-x; background-position: bottom; }
.xw-gate.e .xw-gate-art i.a { background-image: radial-gradient(18px 46px at 50% 100%, #2e4a34 98%, transparent 100%); background-size: 34px 70px; opacity: 0.85; }
.xw-gate.e .xw-gate-art i.b { background-image: radial-gradient(22px 60px at 50% 100%, #1e3424 98%, transparent 100%); background-size: 44px 92px; left: -6%; }
.xw-gate.e .xw-gate-art i.c { background-image: radial-gradient(26px 74px at 50% 100%, #0f1e14 98%, transparent 100%); background-size: 56px 110px; left: -14%; }
.xw-gate-sign { position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; font-size: 30px;
  background: rgba(255, 244, 220, 0.9); border: 2px solid #8a6a3a; box-shadow: 0 6px 14px -6px rgba(0, 0, 0, 0.6); }

/* ── 📘 說明頁的目錄：一格一格、有圖示 ── */
.help-toc { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); gap: 6px; }
.help-toc a { display: flex; align-items: center; gap: 7px; padding: 6px 8px; border-radius: 12px; font-size: 13px; font-weight: 700; line-height: 1.35; }
.help-toc-i { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; font-size: 17px; background: var(--surface); border: 1px solid var(--line-2); }
.help-toc-t { min-width: 0; }

/* ── 🔞 2026-10-10.369 分級標示（js/rating.js）：文字的分級標識（45×45 以上）、情節、警語；賭場類的頁尾、年齡確認 ── */
.rt-badge { flex: none; display: block; width: 52px; height: 52px; object-fit: contain; } /* 2026-11-04 法定的分級標識圖（img/rating/fu15.png）：不改色、不加框，45×45 像素以上 */
.rt-badge.big { width: 72px; height: 72px; }
.rt-note-t small .rt-pay { font-size: inherit; font-weight: 700; }
.rt-note { display: flex; align-items: flex-start; gap: 10px; text-align: left; }
.rt-note-t { display: grid; gap: 2px; min-width: 0; }
.rt-note-t b { font-size: 13px; }
.rt-note-t small { font-size: 11.5px; line-height: 1.5; opacity: 0.9; }
.rt-links a { color: inherit; text-decoration: underline; }
.rt-foot { max-width: 960px; margin: 18px auto 8px; padding: 12px 14px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--line-2); color: var(--text-2); }
/* 年齡確認 */
.age-gate { display: grid; place-items: center; min-height: 60vh; padding: 16px 0; }
.age-gate-card { display: grid; gap: 12px; justify-items: center; width: min(520px, 100%); padding: 22px 20px 18px; border-radius: 18px; text-align: center; color: #f6e6c4;
  background: radial-gradient(120% 120% at 50% 0%, rgba(255, 190, 90, 0.25), transparent 60%), repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.035) 0 10px, transparent 10px 20px), linear-gradient(160deg, #4a1c1c, #1f0d0d 80%);
  border: 1px solid rgba(240, 196, 120, 0.5); box-shadow: 0 16px 34px -16px rgba(0, 0, 0, 0.8); }
.age-gate-card h1 { margin: 0; font-family: var(--serif); font-size: 26px; color: #ffe2a8; letter-spacing: 0.06em; }
.age-gate-card p { margin: 0; line-height: 1.65; }
.age-gate-list { margin: 0; padding: 10px 14px 10px 30px; border-radius: 12px; background: rgba(0, 0, 0, 0.28); border: 1px solid rgba(255, 220, 150, 0.2); text-align: left; line-height: 1.6; font-size: 14px; }
.age-gate-acts { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.age-gate-acts .btn:not(.btn-primary) { background: rgba(255, 240, 210, 0.12); border-color: rgba(255, 220, 150, 0.45); color: #ffe7b0; box-shadow: none; }
.age-gate-note { color: #d8c4a0; }
.age-gate-note a { color: #ffd98a; }
/* 主選單、說明頁 */
.ttl-rate { padding: 8px 10px; border-radius: 12px; background: rgba(0, 0, 0, 0.28); border: 1px solid rgba(240, 196, 120, 0.22); color: #f0e0c0; }
.ttl-rate .rt-badge { width: 48px; height: 48px; }
.ttl-rate .rt-badge b { font-size: 16px; }
.ttl-rate .rt-note-t small { font-size: 11px; line-height: 1.4; } /* 2026-11-04 多了付費那一句：行距收一點，矮的電腦螢幕不用捲 */
.ttl-rate a { color: #ffd98a; }
.help-rate { margin-top: 10px; padding: 10px 12px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--line-2); }

/* ── 2026-10-10.389 全站頁首統一（使用者：「請你審視全站遊戲各介面 該優化到目前最精緻的都要做」）：
   還在用 .page-head 的頁面（酒館、遠征、惡魔塔、異次元、競技場、神社、寵物、礦山、鐵匠鋪、商會、排行榜、賽馬⋯二十幾頁）
   不改各頁的程式，橫幅直接跟 pg-hero 同一套：返回鈕、標題同一列，標題下面不再重複印誦經幣（頁首右上角已經有） ── */
.page-head { --ph-a: #4f2c14; --ph-b: #24140a; --ph-line: rgba(240, 196, 120, 0.5); --ph-glow: rgba(255, 210, 120, 0.26); --ph-ink: #f6e6c4; --ph-title: #ffe7b0;
  position: relative; overflow: hidden; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 12px 14px; margin: 0 0 12px; border-radius: 16px; color: var(--ph-ink);
  background: radial-gradient(120% 140% at 100% 0%, var(--ph-glow), transparent 55%), repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.04) 0 10px, transparent 10px 20px), linear-gradient(135deg, var(--ph-a), var(--ph-b));
  border: 1px solid var(--ph-line); box-shadow: inset 0 0 0 1px rgba(255, 220, 150, 0.12), 0 10px 24px -14px rgba(40, 20, 5, 0.9); }
.page-head::after { content: ""; position: absolute; right: -50px; bottom: -80px; width: 200px; height: 200px; border-radius: 50%; background: radial-gradient(circle, var(--ph-glow), transparent 70%); pointer-events: none; }
.page-head > * { position: relative; z-index: 1; min-width: 0; }
.page-head > h1, .page-head .page-title { flex: 1 1 auto; margin: 0; font-family: var(--serif); font-size: 24px; line-height: 1.25; letter-spacing: 0.06em; color: var(--ph-title); text-shadow: 0 2px 0 rgba(0, 0, 0, 0.35); overflow-wrap: anywhere; }
.page-head > .spacer { flex: 1 0 0; }
.page-head > p { flex-basis: 100%; margin: 0; font-size: 13.5px; line-height: 1.6; color: var(--ph-ink); opacity: 0.95; }
.page-head > a.btn:not(.btn-primary), .page-head > .btn:not(.btn-primary), .page-head > button.btn:not(.btn-primary) { flex: none; background: rgba(255, 240, 210, 0.12); border-color: rgba(255, 220, 150, 0.45); color: var(--ph-title); box-shadow: none; }
.page-head > a.btn:not(.btn-primary):hover, .page-head > .btn:not(.btn-primary):hover { background: rgba(255, 240, 210, 0.22); color: #fff4d8; }
.page-head > a.link { color: #ffd98a; }
.page-head .shrine-bal, .page-head .coin-amt { color: #fff3da; }
.page-head .shrine-bal:empty { display: none; }
.page-head .muted { color: #d8c4a0; }
.page-head .title-chip { align-self: center; }
@media (max-width: 520px) {
  .page-head { padding: 10px 12px; gap: 6px 10px; border-radius: 14px; }
  .page-head > h1, .page-head .page-title { font-size: 21px; }
}

/* ── 2026-10-10.389 💝 遊戲裡的贊助入口（村子「我的」抽屜、頭像的「我的帳號」）：淡粉金，看得到但不吵 ── */
.vh-sponsor, .acct-sponsor { border-color: #e4a0b4; color: #a8344f; background: linear-gradient(180deg, #fff3f6, #ffe4ec); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7); }
.vh-sponsor:hover, .acct-sponsor:hover { background: linear-gradient(180deg, #fff8fa, #ffd6e2); color: #8c2440; }
[data-theme="night"] .vh-sponsor, [data-theme="night"] .acct-sponsor { border-color: #8a4a5e; color: #ffb8c8; background: linear-gradient(180deg, #4a2230, #341520); box-shadow: none; }
[data-theme="night"] .vh-sponsor:hover, [data-theme="night"] .acct-sponsor:hover { background: linear-gradient(180deg, #5a2a3a, #40192a); color: #ffd0da; }
/* 我的誦經幣卡（抽屜、遊戲廳）：大字拿掉，標題旁邊一個小的完整數字 */
.hub-wallet-bal { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; font-weight: 800; font-size: 14px; white-space: nowrap; }
.hub-wallet-bal + .link-btn { margin-left: 8px; }
.hub-wallet-note { margin: -4px 0 10px; }
/* 2026-10-10.389 ⚠️ 技術關卡收起來：標題列寫有哪些機制，點開才有細節 */
details.mech-hint > summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; cursor: pointer; list-style: none; }
details.mech-hint > summary::-webkit-details-marker { display: none; }
details.mech-hint .mech-sum-n { flex: 1 1 auto; min-width: 0; }
details.mech-hint .mech-sum-more { white-space: nowrap; }
details.mech-hint[open] .mech-sum-more { visibility: hidden; }
details.mech-hint[open] > summary { margin-bottom: 4px; }
/* 2026-10-10.389 📖 規則收成可展開（神社、遠征、酒館⋯共用）：一列小字，點開才攤 */
.rule-fold { margin: 4px 0 0; padding: 0; border-radius: 10px; border: 1px dashed var(--line-3); background: var(--surface-2); }
.rule-fold > summary { padding: 8px 12px; cursor: pointer; list-style: none; font-size: 13px; font-weight: 700; color: var(--muted); display: flex; align-items: center; gap: 6px; }
.rule-fold > summary::-webkit-details-marker { display: none; }
.rule-fold > summary::after { content: "▾"; margin-left: auto; }
.rule-fold[open] > summary::after { content: "▴"; }
.rule-fold[open] > summary { color: var(--text); }
.rule-fold > p, .rule-fold > ul, .rule-fold > div { margin: 0 12px 10px; }
.rule-fold > p + p { margin-top: 6px; }
/* 2026-10-10.389 🗼 惡魔塔的樓層段落：「⋯還有 N 段」 */
button.tw-hund-more { cursor: pointer; font: inherit; font-size: inherit; border-style: dashed; }
button.tw-hund-more:hover { color: var(--text); border-color: var(--gold); }

/* 2026-11-04 💝 贊助（綠界）的後台（設定頁，擁有者；js/sponsor-admin.js） */
.sp-state { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sp-orders { margin: 6px 0; padding: 0; list-style: none; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.sp-orders li { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 6px 10px; border-top: 1px solid var(--line); font-size: 0.9rem; }
.sp-orders li:first-child { border-top: 0; }
.sp-orders li .grow { flex: 1 1 200px; min-width: 0; overflow-wrap: anywhere; }
.sp-orders .sp-st { font-size: 0.8rem; padding: 1px 8px; border-radius: 999px; border: 1px solid var(--line-2); white-space: nowrap; }
.sp-orders .st-paid .sp-st { color: var(--win); border-color: var(--win); }
.sp-grant { margin-top: 8px; }
.sp-grant summary { cursor: pointer; font-weight: 700; }

/* 2026-11-04 💝 贊助標記（js/sponsor-mark.js）：月度贊助的金色名字、徽章（名字後面的小圓章）、稱號「點燈人」、滿月頭像框、祥雲聊天框 */
:root {
  --sp-star: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l2.9 6.1 6.6.8-4.9 4.6 1.3 6.6L12 17.3l-5.9 3.3 1.3-6.6L2.5 9.4l6.6-.8z' fill='%23fff' fill-opacity='.95'/%3E%3C/svg%3E");
  --sp-cloud: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 20'%3E%3Cpath d='M5 17c-3.5 0-3.5-5.5 0-5.5 0-4.5 6.5-5.5 7.5-1 1.2-5.5 10-5.5 10 0 3.2-2.2 7.6 0 6.6 3.3 3.4 0 3.4 3.2 0 3.2z' fill='%23f6d985' stroke='%23b07a22' stroke-width='1.4' stroke-linejoin='round'/%3E%3Cpath d='M15.5 11.5c0-2.6 3.6-2.6 3.6 0M24 13c.4-1.8 3-1.8 3 0' fill='none' stroke='%23b07a22' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E");
}
.sp-gold, .cmsg .cmsg-head b.sp-gold, .cmsg.mine .cmsg-head b.sp-gold {
  background: linear-gradient(180deg, #e9b53c 0%, #c0821a 55%, #8d5a08 100%); -webkit-background-clip: text; background-clip: text; color: transparent; font-weight: 800;
}
[data-theme="night"] .sp-gold, [data-theme="night"] .cmsg .cmsg-head b.sp-gold, .spx .sp-gold, .sheet.tvx-sheet .sp-gold, .ax .sp-gold {
  background-image: linear-gradient(180deg, #fff3c0 0%, #f4c85a 50%, #d0922a 100%);
}
.sp-badge, .sp-hl[data-t]::after {
  display: inline-block; width: 14px; height: 14px; border-radius: 50%; flex: none; vertical-align: -2px;
  background: var(--sp-star) center / 72% no-repeat, radial-gradient(circle at 35% 30%, #ffd9e8, #e8558a 60%, #98204e);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35), inset 0 1px 1px rgba(255, 255, 255, 0.6);
}
.sp-hl[data-t]::after { content: ''; margin-left: 3px; }
.sp-badge { align-self: center; }
.sp-badge.t-silver, .sp-hl[data-t="silver"]::after { background: var(--sp-star) center / 72% no-repeat, radial-gradient(circle at 35% 30%, #ffffff, #b9c2ce 55%, #5c6573); }
.sp-badge.t-gold, .sp-hl[data-t="gold"]::after { background: var(--sp-star) center / 72% no-repeat, radial-gradient(circle at 35% 30%, #fff3c0, #f0b53a 55%, #8d5a08); }
.sp-badge.t-rainbow, .sp-hl[data-t="rainbow"]::after { background: var(--sp-star) center / 72% no-repeat, conic-gradient(#ff6f7f, #ffc95a, #7ae8a4, #5cc4ff, #b57aff, #ff6f7f); }
.sp-title { align-self: center; font-size: 11px; line-height: 16px; padding: 0 7px; border-radius: 999px; white-space: nowrap; font-weight: 700;
  color: #ffe9b0; background: linear-gradient(180deg, #d0402f, #8e1f18); border: 1px solid #e3ad45; box-shadow: 0 0 6px -1px rgba(255, 140, 60, 0.7); }
.sp-moon { border-radius: 50%; box-shadow: 0 0 0 2px #fffbe8, 0 0 0 3.5px #e2bb55, 0 0 10px 3px rgba(255, 232, 150, 0.75) !important; }
.cmsg.sp-cloud .cmsg-text {
  position: relative; display: inline-block; max-width: 100%; margin: 3px 0 2px; padding: 7px 14px 7px; border-radius: 14px;
  border: 1.5px solid #d3a043; background: linear-gradient(180deg, rgba(255, 249, 228, 0.96), rgba(250, 233, 192, 0.92));
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.55), 0 3px 8px -4px rgba(120, 70, 10, 0.55); color: #3a2410;
}
.cmsg.sp-cloud .cmsg-text::before, .cmsg.sp-cloud .cmsg-text::after { content: ''; position: absolute; width: 26px; height: 13px; background: var(--sp-cloud) center / contain no-repeat; pointer-events: none; }
.cmsg.sp-cloud .cmsg-text::before { left: -8px; top: -8px; }
.cmsg.sp-cloud .cmsg-text::after { right: -8px; bottom: -7px; transform: scaleX(-1); }
[data-theme="night"] .cmsg.sp-cloud .cmsg-text { color: #fbeed2; border-color: #c99a45; background: linear-gradient(180deg, rgba(58, 40, 78, 0.92), rgba(34, 24, 50, 0.92)); box-shadow: inset 0 0 0 2px rgba(255, 220, 150, 0.12), 0 3px 8px -4px rgba(0, 0, 0, 0.7); }
/* 🎆 村子煙火（js/fireworks.js）：整個畫面上面一層（點得穿）＋上方一行字；聊天室裡「放了煙火」那一則 */
.fw-canvas { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: 9000; pointer-events: none; }
.fw-cap { position: fixed; left: 50%; top: calc(70px + env(safe-area-inset-top, 0px)); transform: translateX(-50%); z-index: 9001; pointer-events: none;
  max-width: calc(100vw - 32px); padding: 8px 16px; border-radius: 999px; font-weight: 800; text-align: center; color: #fff6d8;
  background: linear-gradient(180deg, rgba(120, 30, 40, 0.92), rgba(60, 12, 20, 0.92)); border: 1px solid #f0c060; box-shadow: 0 8px 24px -8px rgba(0, 0, 0, 0.7);
  transition: opacity 0.8s, transform 0.8s; }
.fw-cap.out { opacity: 0; transform: translate(-50%, -10px); }
.cmsg.cmsg-fw .cmsg-text { font-weight: 700; color: #b5461a; }
[data-theme="night"] .cmsg.cmsg-fw .cmsg-text { color: #ffc070; }