body { 
    background-color: #374151; 
    background-image: url('../assets/background/background.png'); /* 👈 在這裡填入你的圖片檔名 */
    background-size: cover; 
    background-position: center; 
    background-repeat: no-repeat;
    color: #f8fafc; 
    font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; 
    overflow: hidden; 
    user-select: none; 
}
        body.game-bg-dim { background-image: linear-gradient(rgba(55,65,81,0.8), rgba(55,65,81,0.8)), url('../assets/background/background.png'); }  /* 正式開始遊戲後：背景淡化 */
        .log-bg { border: 3px solid transparent; border-bottom-width: 1px; background: linear-gradient(180deg, #23282e 0%, #3e4651 50%, #1d2025 100%) padding-box, linear-gradient(135deg, #4a3613 0%, #b89243 20%, #6e5220 42%, #e6c474 60%, #5c4318 80%, #c9a14a 100%) border-box; }  /* 日誌訊息區：較深灰底 + 黃褐不規則漸層邊框 */
        .panel { background: #1e293b padding-box, linear-gradient(135deg, #4a3613 0%, #b89243 20%, #6e5220 42%, #e6c474 60%, #5c4318 80%, #c9a14a 100%) border-box; border: 2px solid transparent; border-bottom-width: 1px; border-radius: 0.75rem; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5); display: flex; flex-direction: column; }
        .panel-header { background: linear-gradient(135deg, #7e6630 0%, #a07f3c 18%, #6e5828 40%, #927535 58%, #5f4d22 78%, #876d31 100%); border-bottom: 1px solid #334155; padding: 0.75rem 1.25rem; font-size: 1.125rem; font-weight: bold; color: #e2e8f0; text-shadow: 1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000; border-top-left-radius: 0.75rem; border-top-right-radius: 0.75rem; }
        #status-panel > .panel-header { background: transparent; color: #fbbf24; text-shadow: none; }  /* 人物左上資訊框標題：還原原本顏色 */
        .tab-bar .btn { background: linear-gradient(135deg, #594720 0%, #786030 26%, #4a3c1a 48%, #6b5628 72%, #413518 100%); border-color: #6e5824; color: #f1f5f9; text-shadow: 0.5px 0.5px 0 #000, -0.5px -0.5px 0 #000, 0.5px -0.5px 0 #000, -0.5px 0.5px 0 #000; }  /* 分頁鈕：最暗金褐不規則漸層 */
        .tab-bar .btn:hover:not(:disabled) { background: linear-gradient(135deg, #6e5828 0%, #927535 26%, #5f4d22 48%, #836a30 72%, #564621 100%); }
        .tab-bar .btn.active { background: linear-gradient(135deg, #9a7c38 0%, #c19a4a 50%, #856a30 100%); border-color: #d4b35e; }
        #btn-start { background: linear-gradient(135deg, #594720 0%, #786030 26%, #4a3c1a 48%, #6b5628 72%, #413518 100%); border-color: #6e5824; }  /* 開始冒險：金褐(同分頁鈕) */
        #btn-start:hover:not(:disabled) { background: linear-gradient(135deg, #6e5828 0%, #927535 26%, #5f4d22 48%, #836a30 72%, #564621 100%); }
        #tab-stats .text-slate-400:not(.text-red-400):not(.text-blue-300):not(.text-blue-300) { color: #e2e8f0; }  /* 能力分頁：非顏色屬性的灰字改亮便於閱讀(屬抗/HP/MP恢復量等有色者不受影響) */
        ::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: #0f172a; border-radius: 4px; }
        ::-webkit-scrollbar-thumb { background: #475569; border-radius: 4px; }
        ::-webkit-scrollbar-thumb:hover { background: #64748b; }
        /* 🔧 觸發爆擊：顯眼鮮紅＋微光，與敵方紅字區隔 */
        .crit-hit { color: #ff2e2e !important; font-weight: bold; text-shadow: 0 0 6px rgba(255,46,46,0.6), 0 0 2px rgba(255,120,120,0.8); }
        .btn { background: #334155; border: 1px solid #475569; color: #f8fafc; padding: 0.5rem 1rem; border-radius: 0.5rem; cursor: pointer; transition: all 0.2s; font-weight: 500; }
        .btn:hover:not(:disabled) { background: #475569; }
        .btn.active { background: #2563eb; border-color: #3b82f6; color: #ffffff; }
        .btn:disabled { opacity: 0.5; cursor: not-allowed; }
        .list-item { padding: 0.75rem; border-bottom: 1px solid #334155; cursor: pointer; display: flex; justify-content: space-between; align-items: center; font-size: 1rem; width: 100%;}
        .list-item:hover { background: #334155; }
        .set-active { background: #451a03 !important; border: 1px solid #b45309 !important; }   /* 🔧 舊套裝改琥珀金（綠色讓給席琳套裝） */
        .mob-target { padding: 0.75rem; border: 2px solid #334155; border-radius: 0.5rem; background: #0f172a; cursor: pointer; flex: 1; text-align: center; display: flex; flex-direction: column; justify-content: center; transition: all 0.2s; height: 224px; overflow: hidden;}
        .mob-target.active { border-color: #ef4444; background: #450a0a; }
        .mob-target:hover:not(.active) { background: #1e293b; }
        /* 🔮 席琳的世界：深黑底色＋黑紅怪物框（透明度結構與原樣式一致） */
        body.sherine-world, body.game-bg-dim.sherine-world { background-image: linear-gradient(rgba(8,8,10,0.88), rgba(0,0,0,0.94)), url('../assets/background/background.png'); }
        body.sherine-world .mob-target { background: #1a0508; border-color: #7f1d1d; }
        body.sherine-world .mob-target.active { background: #450a0a; border-color: #ef4444; }
        body.sherine-world .mob-target:hover:not(.active) { background: #2c0a10; }
        body.sherine-world #battle-view.has-bg .mob-target { background: transparent !important; border-color: transparent !important; box-shadow: none; }
        body.sherine-world #battle-view.has-bg .mob-target.active { background: transparent !important; border-color: transparent !important; }   /* 🔴 紅色鎖定光暈改只套怪物圖(見上方 .mob-img-inner 規則)，不再套整卡→不影響名字 */
        body.sherine-world #battle-view.has-bg .mob-target:hover:not(.active) { background: transparent !important; }
        /* 🏅 傳說武器：琥珀金（比祝福金更深更橘、帶金屬光澤）名稱與圖示光芒 */
        .c-legend { color: #d98a04 !important; font-weight: bold; text-shadow: 0 0 4px rgba(217,138,4,0.65), 0 0 10px rgba(180,83,9,0.5); }
        .legend-glow { animation: legendGlow 2s ease-in-out infinite; }
        @keyframes legendGlow {
            0%, 100% { filter: drop-shadow(0 0 4px rgba(217,138,4,0.7)); }
            50%      { filter: drop-shadow(0 0 9px rgba(217,138,4,1)) drop-shadow(0 0 16px rgba(180,83,9,0.65)); }
        }
        /* 🔧 魔力短劍：傳說武器但圖示為專屬藍色光芒（名稱仍為琥珀金 c-legend） */
        .mana-glow { animation: manaGlow 2s ease-in-out infinite; }
        @keyframes manaGlow {
            0%, 100% { filter: drop-shadow(0 0 4px rgba(56,189,248,0.75)); }
            50%      { filter: drop-shadow(0 0 9px rgba(56,189,248,1)) drop-shadow(0 0 16px rgba(37,99,235,0.7)); }
        }
        /* 🔮 席琳套裝效果：鮮綠名稱＋呼吸式綠光（凌駕其他詞綴顏色；動態光暈為非詞綴類專屬特效） */
        .c-sherine { color: #4ade80 !important; animation: sherineName 2.2s ease-in-out infinite; }
        @keyframes sherineName {
            0%, 100% { text-shadow: 0 0 4px rgba(74,222,128,0.45), 0 0 10px rgba(74,222,128,0.25); }
            50%      { text-shadow: 0 0 7px rgba(74,222,128,0.95), 0 0 16px rgba(74,222,128,0.7), 0 0 28px rgba(34,197,94,0.45); }
        }
        /* 🔮 席琳的恩賜：紅綠交替光特效＋頭上標註 */
        .grace-glow { animation: graceGlow 1.6s ease-in-out infinite; }
        @keyframes graceGlow {
            0%, 100% { filter: drop-shadow(0 0 6px rgba(239,68,68,0.95)) drop-shadow(0 0 14px rgba(239,68,68,0.5)); }
            50%      { filter: drop-shadow(0 0 6px rgba(74,222,128,0.95)) drop-shadow(0 0 14px rgba(74,222,128,0.5)); }
        }
        .grace-badge { color: #4ade80; text-shadow: 0 0 4px #ef4444, 0 0 8px rgba(74,222,128,0.8); }
        /* 🔮 席琳結晶圖示：與套裝文字同步的呼吸式綠色光芒 */
        .sherine-glow-icon { animation: sherineIcon 2.2s ease-in-out infinite; }
        @keyframes sherineIcon {
            0%, 100% { filter: drop-shadow(0 0 4px rgba(74,222,128,0.5)); }
            50%      { filter: drop-shadow(0 0 8px rgba(74,222,128,0.95)) drop-shadow(0 0 16px rgba(34,197,94,0.5)); }
        }
        /* 區域背景：背景圖由 JS 依地圖/分類設為 inline 樣式（特殊地圖逐張不同）；卡片較不透明，使背景不過於顯眼 */
        #battle-view.has-bg { background-size: cover; background-position: center; background-repeat: no-repeat; background-color: #0b1220; border-radius: 0.5rem; }   /* no-repeat：條狀背景(沙漠)用 contain 時留白處不平鋪；background-color：留白填深色(像電影黑邊)。16:9 圖維持 cover 滿版、看不到底色 */
        #battle-view.has-bg .mob-target { background: transparent !important; border-color: transparent !important; box-shadow: none; text-shadow: 0 1px 3px rgba(0,0,0,0.95), 0 0 6px rgba(0,0,0,0.85); }   /* 🔧 狩獵區去框：怪物原圖直接呈現於背景，只保留名稱/血量/狀態(加字陰影保可讀) */
        #battle-view.has-bg .mob-target.active { background: transparent !important; border-color: transparent !important; }   /* 選取中：去框 */
        #battle-view.has-bg .mob-target.active .mob-img-inner { filter: drop-shadow(0 0 4px #ef4444) drop-shadow(0 0 7px #ef4444); }   /* 🔴 紅色鎖定光暈只套在「怪物圖」上(沿輪廓)，不影響名字/徽章/狀態 */
        #battle-view.has-bg .mob-target:hover:not(.active) { background: transparent !important; }
        /* 🏜️ 條狀比例背景(沙漠等·套 area-fit)：戰鬥框高度鎖定＝圖片比例(1920/580)，背景滿版貼齊「上緣」、任何視窗寬度都無上下黑邊；省下的高度由下方戰鬥日誌(flex-1)自動吸收長高。怪物卡填滿框高、怪物圖改彈性填中段隨高度縮放(名稱/血量/異常徽章固定不裁) */
        #battle-view.area-fit { aspect-ratio: 1920 / 580; background-position: top center; overflow: hidden; }
        #battle-view.area-fit #mob-list { height: 100%; }
        #battle-view.area-fit .mob-target { height: 100%; min-height: 0; }
        #battle-view.area-fit .mob-target > div:not(.mob-img-wrap) { flex-shrink: 0; }   /* 🔧 固定列(名稱/徽章/狀態/血條)不可壓縮：大型怪圖的 intrinsic 高度會撐大 band 的 flex-basis→整欄溢出→所有列等比縮小致徽章/狀態字被切半；改由 mob-img-wrap 獨自吸收伸縮 */
        #battle-view.area-fit .mob-img-wrap { flex: 1 1 auto; min-height: 0; align-items: flex-end; }   /* 🦶 怪物圖貼齊框底(腳齊底)，供腳下接觸陰影對齊 */
        #battle-view.area-fit .mob-img-inner { position: relative; height: 100%; display: inline-flex; align-items: flex-end; justify-content: center; }   /* 內層 inline-flex 縮到圖寬→影子寬度跟著每隻怪縮放 */
        #battle-view.area-fit .mob-img-wrap img { height: 100%; width: auto; max-width: 100%; max-height: 100%; position: relative; z-index: 1; }
        /* 🙈 怪物名字預設隱藏，滑鼠游標移到「怪物圖片」上才顯示（:has 偵測圖片區 hover；img 為 pointer-events:none→hover 落在 .mob-img-wrap；保留名稱列空間避免版面跳動）。.name-show＝JS 依 _hoverMobUid 套用→跨重繪持續顯示(每 tick 換 innerHTML 時 :hover 會瞬失效，靠它穩住不閃) */
        #battle-view .mob-name { opacity: 0; transition: opacity 0.12s ease; }
        #battle-view .mob-target:has(.mob-img-wrap:hover) .mob-name,
        #battle-view .mob-target.name-show .mob-name { opacity: 1; }
        /* 🏷️ 怪物名字固定白色＋黑邊、永不因受擊/狀態變色或閃動（受擊特效只套在怪物圖片 img 上·名字是獨立元素不受影響）。!important 覆蓋任何等差色/脈動 */
        #battle-view .mob-name, #battle-view .mob-name span { color: #fff !important; text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, -1px -1px 0 #000, 0 0 3px #000 !important; animation: none !important; }
        #battle-view .mob-name span.mob-name-boss { color: #ff2222 !important; }   /* 👑 頭目名稱固定鮮紅(非頭目維持白)；黑邊 text-shadow 與 animation:none 沿用上行白鎖規則→紅字黑邊、受擊不變色。優先序(1,0,2,1)>白鎖(1,0,1,1) */
        #battle-view.area-fit .mob-img-inner::after { content: ''; position: absolute; left: 50%; bottom: 4px; transform: translateX(-50%); width: 70%; height: 16px; border-radius: 50%; background: radial-gradient(ellipse at center, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.28) 45%, rgba(0,0,0,0) 80%); filter: blur(2px); z-index: 0; pointer-events: none; }   /* 🌑 腳下橢圓接觸陰影：墊在圖後(z-index 0<1)、掛內層非img→固定在地上不隨受擊晃動。加高(16px)+上移(bottom4)+羽化(blur2)→往上擴散覆蓋腳離底5~10px的怪、更圓潤柔和 */
        /* 👑 方案B：純BOSS房專屬版面——boss 圖放大佔滿整格高度(約1.8×·寬型受框寬限制亦較大)，名字/徽章/狀態/血條改絕對定位疊在圖上(字陰影保可讀)、圖完全不被切(無transform·靠回收上下列空間放大) */
        #battle-view.area-fit:has(.boss-slot) { padding: 0; }   /* 🐉 龍窟：去除框內距(p-4)，怪卡填滿整個戰鬥框高度→約2× */
        #battle-view.area-fit .mob-target.boss-slot { position: relative; overflow: visible; }
        #battle-view.area-fit .boss-slot > .mob-img-wrap { position: absolute; top: 2px; bottom: 2px; left: 50%; transform: translateX(-50%); width: 300%; margin: 0; overflow: visible; z-index: 1; }   /* 圖填滿框高；寬型龍(法利昂/巴拉卡斯)橫向溢出至左右空格、不被單格寬度卡住 */
        #battle-view.area-fit .boss-slot > :nth-child(1) { position: absolute; top: 1px; left: 0; right: 0; margin: 0; z-index: 5; text-shadow: 0 1px 4px #000, 0 0 6px #000; }
        #battle-view.area-fit .boss-slot > :nth-child(2) { position: absolute; top: 23px; left: 0; right: 0; margin: 0; z-index: 5; }
        #battle-view.area-fit .boss-slot > :nth-child(4) { position: absolute; bottom: 13px; left: 0; right: 0; margin: 0; z-index: 5; text-shadow: 0 1px 3px #000; }
        #battle-view.area-fit .boss-slot > :nth-child(5) { position: absolute; bottom: 2px; left: 6px; right: 6px; margin: 0; z-index: 5; box-shadow: 0 0 5px #000; }
        #battle-view.area-fit .boss-slot > .mob-hp-bar { box-shadow: none; }   /* 🩸 龍窟血量條沿用 nth-child(5) 絕對定位於底部，但移除舊全寬血條的陰影(短條置中) */
        /* 👹 一般頭目輕度放大(非龍窟)：純 transform 視覺放大1.2×(不reflow·框架/卡片/其餘列完全不動)，腳錨定往上長；名字/徽章提到圖上層(relative+z-index·無offset故不影響版面)避免被放大的圖蓋住 */
        #battle-view.area-fit .boss-zoom { overflow: visible; }                                  /* 👑 頭目放大需溢出卡邊(由戰鬥框 overflow:hidden 收邊)，避免被單格裁切 */
        #battle-view.area-fit .boss-zoom .mob-img-wrap { overflow: visible; }
        #battle-view.area-fit .boss-zoom .mob-img-inner { transform: scale(1.78); transform-origin: bottom center; }   /* 👑 頭目圖放大 1.78×(由 1.2× 調大)；底部對齊原點→只往上/兩側脹大、腳不動 */
        #battle-view.area-fit .boss-zoom > :nth-child(1), #battle-view.area-fit .boss-zoom > :nth-child(2) { position: relative; z-index: 5; }
        /* 🆕 五怪前後排：一般狩獵地圖於原三格(前排·略低·z2)之間插入兩格(後排·略高·z1)，營造前後景深；頭目可出現於任一格(後排頭目套下方專屬放大規則)。位移/縮放只套在圖層(mob-img-inner)→名稱/徽章/狀態列不被裁、徽章可讀 */
        #battle-view .mob-front, #battle-view .mob-back { position: relative; overflow: visible; }   /* 前排放大(1.1×)/頭目(1.78×)需溢出卡片(由戰鬥框 overflow:hidden 收邊) */
        #battle-view .mob-front { z-index: 2; flex: 1.2 1 0%; }
        #battle-view .mob-back  { z-index: 1; flex: 0.8 1 0%; }
        #battle-view.area-fit .mob-front .mob-img-wrap, #battle-view.area-fit .mob-back .mob-img-wrap { overflow: visible; }
        /* 🔒 防忽大忽小：怪圖(height:100%)以「框高」為準＝原3格大小(框高鎖 1920/580 比例·與格數無關)；切勿用 max-width:none(會讓已載入怪圖的自然尺寸回灌 flex intrinsic→怪數變動時整框/背景重算抖動)。min-width/min-height:0＝flex 項不被內容撐大 */
        #battle-view.area-fit .mob-target { min-width: 0; }
        #battle-view.area-fit { min-height: 0; }
        #battle-view .mob-back .mob-img-inner { transform: translateY(-24px) scale(1.1); transform-origin: bottom center; }                      /* 後排：放大 1.1×＋上提→看起來在後方(影子＝::after 內層偽元素隨 scale 一起放大) */
        #battle-view.area-fit .mob-back .mob-img-inner::after { bottom: 18px; }   /* 🦶 後排怪上提後，影子再往上移對齊後排腳底(原4px→18px·後排專屬·避免影子留在圖下方浮空·數值可調) */
        #battle-view .mob-front:not(.boss-zoom) .mob-img-inner { transform: translateY(6px) scale(1.3); transform-origin: bottom center; }   /* 前排：放大 1.3×、略下→看起來在前方(頭目除外·保留 1.78×；影子＝::after 內層偽元素隨 scale 一起放大) */
        #battle-view.area-fit .mob-back.boss-zoom .mob-img-inner { transform: translateY(-24px) scale(1.78); transform-origin: bottom center; }   /* 👑 後排頭目：保留後排上提(-24)＋頭目放大1.78× */
        #battle-view .mob-back.boss-zoom { z-index: 4; }                                                                                          /* 後排頭目提到前排(z2)之上，避免大圖被前排小怪遮住 */
        #town-view.has-bg { background-size: cover; background-position: center; border-radius: 0.5rem; }
        #town-view.has-bg #town-npc-container > div { background: rgba(30,41,59,0.72); }
        #town-view.has-bg #town-npc-container > div:hover { background: rgba(51,65,85,0.78); }
        .tip-host { cursor: help; }
        .stat-row { display: contents; }
        .stat-row.row-hidden { display: none; }
        .game-tooltip { position: fixed; z-index: 80; max-width: 320px; pointer-events: none; display: none; background: rgba(15,23,42,0.97); border: 1px solid #64748b; border-radius: 8px; padding: 10px 12px; font-size: 13px; line-height: 1.5; box-shadow: 0 8px 30px rgba(0,0,0,0.7); }
        .bar-bg { background: #334155; height: 20px; position: relative; border-radius: 999px; overflow: hidden; }
        .bar-fill { height: 100%; transition: width 0.2s ease-out; }
        .bar-text { position: absolute; top: 0; left: 0; width: 100%; text-align: center; font-size: 12px; line-height: 20px; font-weight: 700; text-shadow: 1px 1px 2px rgba(0,0,0,0.9); }
        /* 🛡️ 裝備可用職業 logo：細金邊、無發光特效 */
        .class-eq-icon { display: inline-block; width: 20px; height: 20px; object-fit: contain; vertical-align: middle; margin-right: 4px; border: 1px solid #c9a227; border-radius: 4px; background: #11161f; box-shadow: none; }
        .c-blessed { color: #facc15; } .c-ancient { color: #c084fc; } .c-rare { color: #fb923c; } .c-attr { color: #22d3ee; } .c-anc-bless { color: #e3a625; }
        .c-eternal    { color: #f43f5e; text-shadow: 0 0 5px rgba(244,63,94,.65); }   /* 永恆：玫瑰紅（與火屬性三紅區隔） */
        .c-immortal   { color: #10b981; text-shadow: 0 0 5px rgba(16,185,129,.65); }  /* 不朽：翡翠綠（與風屬性三綠區隔） */
        .c-primordial { color: #0ea5e9; text-shadow: 0 0 5px rgba(14,165,233,.65); }  /* 太初：天藍（與水屬性三藍區隔） */
        /* 屬性詞綴 12 色：元素分色（火紅/水藍/風綠/地琥珀），階級越高越鮮明，靈系發光 */
        .c-attr-fire1  { color: #fca5a5; } .c-attr-fire3  { color: #ef4444; } .c-attr-fire5  { color: #dc2626; }
        .c-attr-water1 { color: #93c5fd; } .c-attr-water3 { color: #3b82f6; } .c-attr-water5 { color: #2563eb; }
        .c-attr-wind1  { color: #86efac; } .c-attr-wind3  { color: #22c55e; } .c-attr-wind5  { color: #16a34a; }
        .c-attr-earth1 { color: #fcd34d; } .c-attr-earth3 { color: #f59e0b; } .c-attr-earth5 { color: #d97706; }
        .c-attr-glow { text-shadow: 0 0 6px currentColor, 0 0 10px currentColor; }
        .log-entry { margin-bottom: 6px; line-height: 1.5; font-size: 1.05rem; }
        /* 🎯 三大戰鬥訊息分類：左色條＋淡底，一眼分辨「玩家一般攻擊(藍)／玩家技能(紫)／敵人傷害(紅)」；文字色仍保留爆擊/重擊等資訊 */
        .log-cat-attack { border-left: 3px solid #3b82f6; padding-left: 8px; background: rgba(59,130,246,0.07);  border-radius: 0 4px 4px 0; }   /* 玩家一般攻擊 */
        .log-cat-skill  { border-left: 3px solid #a855f7; padding-left: 8px; background: rgba(168,85,247,0.11);  border-radius: 0 4px 4px 0; }   /* 玩家技能 */
        .log-cat-enemy  { border-left: 3px solid #ef4444; padding-left: 8px; background: rgba(239,68,68,0.10);   border-radius: 0 4px 4px 0; }   /* 敵人傷害 */
        .log-cat-dot    { border-left: 3px solid #22c55e; padding-left: 8px; background: rgba(34,197,94,0.10);   border-radius: 0 4px 4px 0; }   /* 🟢 持續傷害/DoT */
        /* ⚔️ 戰鬥日誌來源過濾：點亮(顯示)/點暗(隱藏) 敵人/玩家/傭兵/召喚/夥伴 */
        .cf-pill { font-size: 0.7rem; font-weight: 700; line-height: 1; padding: 3px 6px; border-radius: 9999px; border: 1px solid; cursor: pointer; user-select: none; transition: opacity .15s, filter .15s; white-space: nowrap; }
        .cf-pill.cf-off { opacity: 0.4; filter: grayscale(0.85); }
        #combat-log.cf-hide-enemy [data-src="enemy"], #combat-log.cf-hide-player [data-src="player"], #combat-log.cf-hide-mercenary [data-src="mercenary"], #combat-log.cf-hide-summon [data-src="summon"], #combat-log.cf-hide-pet [data-src="pet"] { display: none; }
        @keyframes flash { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } }
        .anim-flash { animation: flash 1s infinite; }
        
        /* --- 屬性受擊動畫系統 (高速打擊版) --- */
        /* 1. 一般物理 */
        /* 🔧 命中特效：恢復晃動，但只做左右(水平)位移、不做上下(垂直)，並保留依屬性的亮起＋光暈 */
        @keyframes hitNormal {
            0%, 100% { transform: translateX(0); filter: brightness(1); }
            25%, 75% { transform: translateX(-4px); filter: brightness(1.5); }
            50% { transform: translateX(4px); filter: brightness(1.5); }
        }
        .anim-hit-normal { animation: hitNormal 0.12s ease-out; }

        /* 2. 無屬性魔法 */
        @keyframes hitMagic {
            0%, 100% { transform: translateX(0); filter: brightness(1); }
            25%, 75% { transform: translateX(-5px); filter: brightness(1.7); }
            50% { transform: translateX(5px); filter: brightness(1.7); }
        }
        .anim-hit-magic { animation: hitMagic 0.15s ease-out; }

        /* 3. 火屬性 */
        @keyframes hitFire {
            0%, 100% { transform: translateX(0); filter: brightness(1); }
            25%, 75% { transform: translateX(-5px); filter: brightness(1.7); }
            50% { transform: translateX(5px); filter: brightness(1.7); }
        }
        .anim-hit-fire { animation: hitFire 0.15s ease-out; }

        /* 4. 水屬性 */
        @keyframes hitWater {
            0%, 100% { transform: translateX(0); filter: brightness(1); }
            25%, 75% { transform: translateX(-5px); filter: brightness(1.5); }
            50% { transform: translateX(5px); filter: brightness(1.5); }
        }
        .anim-hit-water { animation: hitWater 0.15s ease-out; }

        /* 5. 風屬性 */
        @keyframes hitWind {
            0%, 100% { transform: skewX(0deg) translateX(0); filter: brightness(1); }
            25%, 75% { transform: skewX(-12deg) translateX(-5px); filter: brightness(1.7); }
            50% { transform: skewX(12deg) translateX(5px); filter: brightness(1.7); }
        }
        .anim-hit-wind { animation: hitWind 0.15s ease-out; }

        /* 6. 地屬性 */
        @keyframes hitEarth {
            0%, 100% { transform: translateX(0); filter: brightness(1); }
            25%, 75% { transform: translateX(-5px); filter: brightness(1.4); }
            50% { transform: translateX(5px); filter: brightness(1.4); }
        }
        .anim-hit-earth { animation: hitEarth 0.15s ease-out; }
		
		/* 祝福物品的螢光邊緣呼吸特效 */
        @keyframes blessGlow {
            0%, 100% { filter: drop-shadow(0 0 4px rgba(250, 204, 21, 0.5)); }
            50% { filter: drop-shadow(0 0 10px rgba(250, 204, 21, 1)); }
        }
        .bless-glow { animation: blessGlow 2s infinite ease-in-out; }

        /* 詛咒的：鮮紅螢光（亮度比照祝福，色相改紅） */
        @keyframes curseGlow {
            0%, 100% { filter: drop-shadow(0 0 4px rgba(255, 32, 32, 0.55)); }
            50% { filter: drop-shadow(0 0 10px rgba(255, 32, 32, 1)); }
        }
        .curse-glow { animation: curseGlow 2s infinite ease-in-out; }
        .c-cursed { color: #ff2d2d; text-shadow: 0 0 5px rgba(255,45,45,.55); }

        /* 遠古物品的紅色螢光呼吸特效（亮度比照祝福） */
        @keyframes ancientGlow {
            0%, 100% { filter: drop-shadow(0 0 4px rgba(192, 132, 252, 0.5)); }
            50% { filter: drop-shadow(0 0 10px rgba(168, 85, 247, 1)); }
        }
        .ancient-glow { animation: ancientGlow 2s infinite ease-in-out; }

        /* 遠古+祝福：紫↔金 交替螢光（維持顯眼度，雙層光暈 + 亮度/飽和提升 + 較快脈動） */
        @keyframes ancBlessGlow {
            0%, 100% {
                filter: drop-shadow(0 0 8px rgba(192, 132, 252, 1))
                        drop-shadow(0 0 20px rgba(168, 85, 247, 0.98))
                        drop-shadow(0 0 36px rgba(147, 51, 234, 0.72))
                        brightness(1.45) saturate(1.9);
            }
            50% {
                filter: drop-shadow(0 0 14px rgba(255, 226, 150, 1))
                        drop-shadow(0 0 30px rgba(243, 188, 72, 1))
                        drop-shadow(0 0 50px rgba(214, 150, 30, 0.9))
                        brightness(1.6) saturate(2.0);
            }
        }
        .anc-bless-glow { animation: ancBlessGlow 1.3s infinite ease-in-out; }

        /* 屬性+遠古：紫光（顏色同單遠古，顯眼度＝雙詞綴） */
        @keyframes ancientGlowStrong {
            0%, 100% {
                filter: drop-shadow(0 0 7px rgba(192, 132, 252, 1))
                        drop-shadow(0 0 18px rgba(168, 85, 247, 0.95))
                        drop-shadow(0 0 32px rgba(147, 51, 234, 0.65))
                        brightness(1.35) saturate(1.8);
            }
            50% {
                filter: drop-shadow(0 0 16px rgba(214, 170, 255, 1))
                        drop-shadow(0 0 34px rgba(184, 104, 250, 1))
                        drop-shadow(0 0 54px rgba(150, 60, 235, 0.9))
                        brightness(1.65) saturate(2.05);
            }
        }
        .ancient-glow-strong { animation: ancientGlowStrong 1.3s infinite ease-in-out; }

        /* 屬性+祝福：金光（顏色同單祝福，顯眼度＝雙詞綴） */
        @keyframes blessGlowStrong {
            0%, 100% {
                filter: drop-shadow(0 0 7px rgba(255, 224, 130, 1))
                        drop-shadow(0 0 18px rgba(250, 204, 21, 0.95))
                        drop-shadow(0 0 32px rgba(217, 160, 10, 0.65))
                        brightness(1.35) saturate(1.8);
            }
            50% {
                filter: drop-shadow(0 0 16px rgba(255, 240, 165, 1))
                        drop-shadow(0 0 34px rgba(253, 224, 71, 1))
                        drop-shadow(0 0 54px rgba(234, 180, 20, 0.9))
                        brightness(1.65) saturate(2.05);
            }
        }
        .bless-glow-strong { animation: blessGlowStrong 1.3s infinite ease-in-out; }

        /* 血盟敵人名稱：固定鮮紅 + 紅色脈動醒目特效 */
        @keyframes pledgeNameGlow {
            0%, 100% { text-shadow: 0 0 4px #ff0000, 0 0 8px #ff3b3b; }
            50%      { text-shadow: 0 0 10px #ff0000, 0 0 20px #ff2d2d, 0 0 32px #ff5555; }
        }
        .mob-name-pledge { color: #ff2d2d !important; animation: pledgeNameGlow 1s infinite ease-in-out; }

        /* 頭目名稱：保留等差顏色，疊加金色脈動專屬特效（與血盟不同） */
        @keyframes bossNameGlow {
            0%, 100% { text-shadow: 0 0 4px rgba(251,191,36,0.7), 0 0 8px rgba(245,158,11,0.5); letter-spacing: 0; }
            50%      { text-shadow: 0 0 12px rgba(251,191,36,1), 0 0 22px rgba(217,119,6,0.85); letter-spacing: 0.5px; }
        }
        .mob-name-boss { animation: none; }   /* 👑 頭目名稱：固定鮮紅(實際紅色由上方 #battle-view .mob-name span.mob-name-boss 高優先規則設定)、無脈動動畫(受擊不變色) */
        /* 🎨 怪物名稱等差顏色（依 mob.lv − player.lv）：自訂 hex class，因本專案 Tailwind JIT 未生成 text-red-500/pink/blue 等→改用自訂 class 保證生效 */
        .mc-red    { color: #ef4444 !important; }   /* 高11等以上：鮮紅 */
        .mc-lred   { color: #fca5a5 !important; }   /* 高7~10：淺紅（淡） */
        .mc-yellow { color: #facc15 !important; }   /* 高4~6：黃色 */
        .mc-white  { color: #ffffff !important; }   /* 高3~低3：白色 */
        .mc-lgreen { color: #86efac !important; }   /* 低4~6：淺綠 */
        .mc-lblue  { color: #bae6fd !important; }   /* 低7~10：淺藍（更淺） */
        .mc-dblue  { color: #2158e1 !important; }   /* 低11等以上：深藍（稍微淺一點點·仍深藍） */
        .mc-mobname { color: #fcd34d !important; }   /* 🔧 戰鬥日誌怪名專用（淡金色）：怪卡名已統一白色、日誌怪名改金色以與其他白色訊息區隔 */

        /* 三詞綴(屬性+遠古+祝福)：紅→藍→綠→琥珀 循環變換光（顏色不變，顯眼度最高，恆定強光+大光暈） */
        @keyframes triGlow {
            0%, 100% { filter: drop-shadow(0 0 11px rgba(239, 68, 68, 1))  drop-shadow(0 0 28px rgba(239, 68, 68, 0.85))  drop-shadow(0 0 52px rgba(239, 68, 68, 0.55))  brightness(1.75) saturate(2.2); }
            25%      { filter: drop-shadow(0 0 11px rgba(59, 130, 246, 1)) drop-shadow(0 0 28px rgba(59, 130, 246, 0.85)) drop-shadow(0 0 52px rgba(59, 130, 246, 0.55)) brightness(1.75) saturate(2.2); }
            50%      { filter: drop-shadow(0 0 11px rgba(34, 197, 94, 1))  drop-shadow(0 0 28px rgba(34, 197, 94, 0.85))  drop-shadow(0 0 52px rgba(34, 197, 94, 0.55))  brightness(1.75) saturate(2.2); }
            75%      { filter: drop-shadow(0 0 11px rgba(245, 158, 11, 1)) drop-shadow(0 0 28px rgba(245, 158, 11, 0.85)) drop-shadow(0 0 52px rgba(245, 158, 11, 0.55)) brightness(1.75) saturate(2.2); }
        }
        .tri-glow { animation: triGlow 2.4s infinite linear; }

        /* ===== ✨ 戰鬥特效層 VFX（純視覺，不影響任何遊戲數值/邏輯） ===== */
        #vfx-layer { position: fixed; inset: 0; pointer-events: none; z-index: 45; overflow: hidden; }
        .vfx-dmg { position: absolute; transform: translate(-50%,-50%); font-weight: 900; font-family: 'Arial Black','Segoe UI',system-ui,sans-serif; white-space: nowrap; letter-spacing: .5px; will-change: transform,opacity; text-shadow: 0 1px 2px rgba(0,0,0,.95), 0 0 7px rgba(0,0,0,.55); animation: vfxFloat .85s ease-out forwards; }
        .vfx-dmg.vfx-crit { animation: vfxCrit 1.05s cubic-bezier(.18,.85,.25,1) forwards; -webkit-text-stroke: 1px rgba(0,0,0,.45); }
        @keyframes vfxFloat {
            0%   { opacity: 0; transform: translate(-50%,-40%) scale(.55); }
            18%  { opacity: 1; transform: translate(-50%,-95%) scale(1.06); }
            72%  { opacity: 1; transform: translate(-50%,-150%) scale(1); }
            100% { opacity: 0; transform: translate(-50%,-200%) scale(.9); }
        }
        @keyframes vfxCrit {
            0%   { opacity: 0; transform: translate(-50%,-40%) scale(.5) rotate(-8deg); }
            14%  { opacity: 1; transform: translate(-50%,-90%) scale(1.55) rotate(4deg); }
            32%  { transform: translate(-50%,-118%) scale(1.12) rotate(-2deg); }
            72%  { opacity: 1; transform: translate(-50%,-170%) scale(1.18); }
            100% { opacity: 0; transform: translate(-50%,-235%) scale(1); }
        }
        .vfx-particle { position: absolute; border-radius: 50%; transform: translate(-50%,-50%); will-change: transform,opacity; }
        @keyframes vfxShake {
            0%,100% { transform: translate(0,0); }
            15% { transform: translate(-5px,3px); }   30% { transform: translate(5px,-3px); }
            45% { transform: translate(-4px,-2px); }  60% { transform: translate(4px,2px); }
            80% { transform: translate(-2px,1px); }
        }
        .vfx-shake { animation: vfxShake .45s ease-in-out; }
        @keyframes vfxHurt { 0%,100% { box-shadow: inset 0 0 0 0 rgba(220,38,38,0); } 42% { box-shadow: inset 0 0 32px 6px rgba(220,38,38,.55); } }
        .vfx-hurt { animation: vfxHurt .5s ease-out; }
        /* 命中衝擊環 */
        .vfx-ring { position: absolute; border-radius: 50%; transform: translate(-50%,-50%); border: 2px solid #fff; will-change: transform,opacity; }
        @keyframes vfxRing { 0% { opacity: .9; transform: translate(-50%,-50%) scale(.2); } 100% { opacity: 0; transform: translate(-50%,-50%) scale(1); } }
        /* 升級慶祝 */
        .vfx-lvring { position: absolute; border-radius: 50%; transform: translate(-50%,-50%); border: 3px solid #ffd54f; box-shadow: 0 0 18px #ffca28, inset 0 0 18px #ffca28; will-change: transform,opacity; }
        @keyframes vfxLvRing { 0% { opacity: 1; transform: translate(-50%,-50%) scale(.15); } 100% { opacity: 0; transform: translate(-50%,-50%) scale(1); } }
        .vfx-lvtext { position: absolute; transform: translate(-50%,-50%); font-weight: 900; font-family: 'Arial Black','Segoe UI',system-ui,sans-serif; color: #ffe082; text-shadow: 0 0 9px #ff9800, 0 2px 3px rgba(0,0,0,.9); white-space: nowrap; will-change: transform,opacity; }
        @keyframes vfxLvText { 0% { opacity: 0; transform: translate(-50%,-30%) scale(.6); } 20% { opacity: 1; transform: translate(-50%,-72%) scale(1.18); } 75% { opacity: 1; transform: translate(-50%,-120%) scale(1); } 100% { opacity: 0; transform: translate(-50%,-160%) scale(.95); } }
        .vfx-areaflash { position: absolute; border-radius: 10px; will-change: opacity; }
        @keyframes vfxLvFlash { 0% { opacity: 0; } 30% { opacity: 1; } 100% { opacity: 0; } }
        @keyframes vfxBossFlash { 0% { opacity: 0; } 18% { opacity: 1; } 100% { opacity: 0; } }

        #mobile-vitals { display: none !important; }   /* 🖥️ 桌機專用：手機版排版已移除，此置頂血條元件永久隱藏 */

        /* 🖥️ 桌面高解析度清晰度：略增文字與圖示銳利度（1920/2560/3840 通用，效果輕微、不改版面） */
        html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
        img { image-rendering: -webkit-optimize-contrast; }
        #game-screen img, #creation-screen img, #battle-view img { filter: contrast(1.06) saturate(1.05); }

        /* 📱 手機 / 小螢幕響應式排版已移除：本遊戲專注桌上型電腦顯示（1920×1080 / 2560×1440 / 3840×2160）。 */