/* 戰鬥畫面的疊字：名字牌、對話泡泡、首領血條、6 星英雄的特寫（2026-10-01.5，js/expedition-scene.js）
   字的大小照畫面的寬（cqw；不支援的瀏覽器用 vw），手機上小小的、電腦上大一點；名字牌、泡泡跟著人走（JS 每一格更新 left、top） */
.exp-fx { container-type: inline-size; }
.bt-tags, .bt-bubbles, .bt-says, .bt-cut { position: absolute; inset: 0; pointer-events: none; }
.bt-cut { overflow: hidden; }

/* 名字牌（頭上）：一般綠色、6 星以上金色＋✦稱號、PVP 守方藍色、首領紅色、世界王四周的公會成員白色 */
.bt-tag { position: absolute; transform: translate(-50%, -100%); white-space: nowrap; color: #8dff6a; letter-spacing: 0.02em;
  font: 800 clamp(8px, 2vw, 12px)/1.15 var(--font); font-size: clamp(8px, 2.3cqw, 12.5px);
  text-shadow: -1px -1px 0 #0c1606, 1px -1px 0 #0c1606, -1px 1px 0 #0c1606, 1px 1px 0 #0c1606, 0 1px 2px rgba(0, 0, 0, 0.6); }
.bt-tag.under { transform: translate(-50%, 0); } /* 首領：名字牌在腳下 */
/* 6 星以上：稱號小字在上面、名字在下面（兩行比較窄，不會疊在一起）；10 星多一個彩虹底 */
.bt-tag.h6 { text-align: center; color: #ffe27a; text-shadow: -1px -1px 0 #2a1600, 1px -1px 0 #2a1600, -1px 1px 0 #2a1600, 1px 1px 0 #2a1600, 0 0 6px rgba(255, 200, 80, 0.75); }
.bt-tag.h6 i { display: block; margin: 0 0 -1px; font-style: normal; font-size: 0.74em; line-height: 1.15; letter-spacing: 0.04em; color: #fff6cf; }
.bt-tag.h6.t5 { animation: bt-prism 4s linear infinite; } /* 10 星以上（顏色照星等，見下面 2026-10-02.1） */
.bt-tag.foe { color: #8ec8ff; text-shadow: -1px -1px 0 #06101e, 1px -1px 0 #06101e, -1px 1px 0 #06101e, 1px 1px 0 #06101e, 0 1px 2px rgba(0, 0, 0, 0.6); }
.bt-tag.h6.foe { color: #bfe2ff; }
.bt-tag.boss { color: #fff; padding: 1px 7px 2px; border-radius: 6px; font-size: clamp(9px, 2.6cqw, 14px); background: linear-gradient(180deg, #d8301e, #8e140c);
  box-shadow: 0 0 0 1px #3a0604, 0 0 8px rgba(255, 50, 30, 0.55); text-shadow: 0 1px 0 #3a0604; }
.bt-tag.bt-crowd { color: #fff8e8; padding: 0 4px 1px; border-radius: 4px; background: rgba(24, 14, 40, 0.62); text-shadow: 0 1px 0 #000; font-weight: 700; }
.bt-tag.dead { opacity: 0.45; filter: grayscale(1); }

/* 對話泡泡（白色圓角＋小尾巴） */
.bt-bubble { position: absolute; transform: translate(-50%, -100%); max-width: 11em; padding: 2px 7px 3px; border-radius: 8px; background: #fffdf6; color: #2a1d12;
  font: 800 clamp(8px, 2vw, 12px)/1.25 var(--font); font-size: clamp(8.5px, 2.4cqw, 12.5px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  box-shadow: 0 0 0 1px #2a1d12, 0 2px 0 rgba(0, 0, 0, 0.3); animation: bt-bub 0.22s cubic-bezier(0.2, 1.6, 0.4, 1) both; }
.bt-bubble::after { content: ''; position: absolute; left: 50%; bottom: -4px; width: 7px; height: 7px; margin-left: -3.5px; background: #fffdf6;
  transform: rotate(45deg); box-shadow: 1px 1px 0 #2a1d12; z-index: -1; }
.bt-bubble.out { animation: bt-bub-out 0.2s ease-in forwards; }
@keyframes bt-bub { from { opacity: 0; transform: translate(-50%, -70%) scale(0.6); } to { opacity: 1; transform: translate(-50%, -100%) scale(1); } }
@keyframes bt-bub-out { to { opacity: 0; transform: translate(-50%, -120%) scale(0.9); } }

/* 首領血條（戰鬥中蓋在左上角的關卡牌子那裡；世界王的畫面在上面中間） */
.bt-boss { position: absolute; left: 1.6%; top: 2.4%; width: min(54%, 340px); padding: 3px 8px 5px; border-radius: 8px; line-height: 1.2;
  background: linear-gradient(180deg, rgba(40, 8, 8, 0.86), rgba(20, 4, 6, 0.82)); box-shadow: 0 0 0 1px rgba(255, 110, 90, 0.55), 0 2px 8px rgba(0, 0, 0, 0.45);
  animation: bt-boss-in 0.35s ease-out both; }
.bt-boss[hidden] { display: none; }
.bt-boss-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.bt-boss-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #ffe8e2; font: 900 clamp(9px, 2.2vw, 14px)/1.25 var(--font);
  font-size: clamp(9px, 2.7cqw, 14.5px); text-shadow: 0 0 6px rgba(255, 60, 40, 0.8), 0 1px 0 #000; }
.bt-boss-round { flex: none; margin-left: auto; padding: 0 6px; border-radius: 999px; background: rgba(255, 255, 255, 0.12); color: #fbeed3;
  font: 800 clamp(8px, 1.6vw, 11px)/1.5 var(--font); font-size: clamp(8px, 2cqw, 11px); }
.bt-boss-round:empty { display: none; }
.bt-boss-num { flex: none; color: #ffc8b8; font: 800 clamp(8px, 1.8vw, 12px)/1.25 var(--font); font-size: clamp(8px, 2.2cqw, 12px); font-variant-numeric: tabular-nums; }
.bt-boss-bar { position: relative; height: clamp(5px, 1.6cqw, 9px); margin-top: 2px; border-radius: 3px; overflow: hidden; background: #2a0c0c; box-shadow: inset 0 0 0 1px #000; }
.bt-boss-bar i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: inherit; }
.bt-boss-lag { background: #ffe6a0; transition: width 0.7s ease 0.35s; }
.bt-boss-fill { background: linear-gradient(180deg, #ff6a50, #d0201a 60%, #9a120c); transition: width 0.18s ease-out; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35); }
.bt-boss.world .bt-boss-fill { background: linear-gradient(180deg, #ff8a3a, #e0301e 55%, #9a0c20); }
.exp-scene.bt-bossfight .exp-sign { visibility: hidden; }
@keyframes bt-boss-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* 數字：世界王四周的公會成員打的（小小灰灰的）、PVP 開場的「VS」 */
.exp-say.bt-small { color: #ddd8ce; font-size: clamp(8px, 1.7vw, 11px); font-size: clamp(8px, 2.2cqw, 11px); font-weight: 800; opacity: 0.85; }
.exp-say.banner.bt-vs { font-size: clamp(30px, 9vw, 64px); color: #fff3c4; letter-spacing: 0.06em;
  text-shadow: -2px -2px 0 #1a1008, 2px -2px 0 #1a1008, -2px 2px 0 #1a1008, 2px 2px 0 #1a1008, -6px 0 14px rgba(255, 70, 50, 0.9), 6px 0 14px rgba(70, 140, 255, 0.9); }

/* 6 星以上的英雄放專屬技能：一條斜斜的光帶滑進來＋放大的英雄＋稱號、名字、技能名（顏色＝那位英雄自己的，js/hero6-fx.js） */
.bt-cutin { position: absolute; left: 0; right: 0; top: 50%; height: 44%; transform: translateY(-50%); display: flex; align-items: center; gap: 2%;
  padding: 0 5%; animation: bt-cut var(--dur, 1200ms) cubic-bezier(0.2, 0.9, 0.3, 1) both; }
.bt-cut-band { position: absolute; inset: 8% -10%; transform: skewY(-4deg); z-index: -1;
  background: linear-gradient(90deg, rgba(var(--rgb), 0) 0%, rgba(var(--rgb), 0.55) 7%, rgba(14, 10, 28, 0.86) 24%, rgba(14, 10, 28, 0.86) 76%, rgba(var(--rgb), 0.55) 93%, rgba(var(--rgb), 0) 100%);
  box-shadow: 0 -2px 0 var(--c3), 0 2px 0 var(--c3), 0 -4px 0 rgba(var(--rgb), 0.6), 0 4px 0 rgba(var(--rgb), 0.6), 0 0 14px rgba(var(--rgb), 0.85); }
/* 2026-10-01.6：光帶上的反光、速度線都改成只動 transform（手機不用每一格重畫，比較順） */
.bt-cut-band { overflow: hidden; }
.bt-cut-band::after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 40%; background: linear-gradient(100deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.55) 50%, rgba(255, 255, 255, 0));
  animation: bt-shine var(--dur, 1200ms) linear both; will-change: transform; }
.bt-cut-lines { position: absolute; top: 14%; bottom: 14%; left: -10%; right: calc(-10% - 140px); z-index: -1; opacity: 0.3;
  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, 0) 0 18px, rgba(255, 255, 255, 0.5) 18px 20px, rgba(255, 255, 255, 0) 20px 44px, var(--c3) 44px 45px, rgba(255, 255, 255, 0) 45px 70px);
  animation: bt-lines 0.45s linear infinite; will-change: transform; }
@keyframes bt-lines { from { transform: skewY(-4deg) translateX(0); } to { transform: skewY(-4deg) translateX(-140px); } }
.bt-cut-dim { position: absolute; inset: 0; background: radial-gradient(120% 90% at 50% 50%, rgba(10, 6, 20, 0.15), rgba(10, 6, 20, 0.55)); animation: bt-dim var(--dur, 1200ms) ease both; }
@keyframes bt-dim { 0% { opacity: 0; } 15%, 75% { opacity: 1; } 100% { opacity: 0; } }
.bt-cutin.t5 .bt-cut-band { box-shadow: 0 -2px 0 #ff9ab4, 0 2px 0 #8ae8ff, 0 0 26px rgba(var(--rgb), 0.9); }
.bt-cut-pic { height: 118%; width: auto; aspect-ratio: 50 / 42; image-rendering: pixelated; image-rendering: crisp-edges; flex: none;
  animation: bt-cut-pic var(--dur, 1200ms) ease-out both; }
.bt-cut-txt { display: grid; gap: 1px; min-width: 0; text-shadow: 0 2px 0 rgba(0, 0, 0, 0.6); }
.bt-cut-title { color: var(--c3); font: 800 clamp(9px, 2.6cqw, 15px)/1.2 var(--font); letter-spacing: 0.12em; }
.bt-cut-name { color: #fff; font: 900 clamp(16px, 6.4cqw, 38px)/1.05 var(--serif); letter-spacing: 0.08em;
  text-shadow: 0 0 8px rgba(var(--rgb), 0.95), 0 0 2px var(--c2), 0 3px 0 rgba(0, 0, 0, 0.55); }
.bt-cut-skill { color: #fff6cf; font: 900 clamp(11px, 3.4cqw, 20px)/1.2 var(--font); letter-spacing: 0.06em; text-shadow: 0 0 6px var(--c2), 0 2px 0 #000; }
.bt-cut-stars { color: #ffd84a; font-size: clamp(7px, 1.9cqw, 11px); letter-spacing: 1px; text-shadow: 0 0 4px rgba(255, 200, 60, 0.9), 0 1px 0 #000; }
.bt-cutin.t5 .bt-cut-stars { background: linear-gradient(90deg, #ff9ab4, #ffe27a, #8ae8ff, #d8a8ff); -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: none; }
.bt-cutin.foe { flex-direction: row-reverse; text-align: right; }
.bt-cutin.foe .bt-cut-pic { transform: scaleX(-1); }
@keyframes bt-cut { 0% { opacity: 0; transform: translate(-60%, -50%); } 14% { opacity: 1; transform: translate(0, -50%); } 82% { opacity: 1; transform: translate(3%, -50%); } 100% { opacity: 0; transform: translate(40%, -50%); } }
.bt-cutin.foe { animation-name: bt-cut-r; }
@keyframes bt-cut-r { 0% { opacity: 0; transform: translate(60%, -50%); } 14% { opacity: 1; transform: translate(0, -50%); } 82% { opacity: 1; transform: translate(-3%, -50%); } 100% { opacity: 0; transform: translate(-40%, -50%); } }
@keyframes bt-cut-pic { 0% { scale: 1.3; } 20% { scale: 1; } }
@keyframes bt-shine { 0% { transform: translateX(-110%); } 100% { transform: translateX(260%); } }
@keyframes bt-prism { from { background-position: 0 0; } to { background-position: 300% 0; } }
@media (prefers-reduced-motion: reduce) {
  .bt-bubble, .bt-boss, .bt-tag.h6.t5 { animation: none; }
  .bt-boss-lag, .bt-boss-fill { transition: none; }
}
/* 畫面裡的技能名、回合：小一點（人變小了，不要蓋住一大片） */
.bt-says .exp-say.skill { font-size: clamp(9px, 2vw, 13px); font-size: clamp(9px, 2.6cqw, 13px); padding: 2px 7px; }
.bt-says .exp-say.round { font-size: clamp(9px, 1.8vw, 12px); font-size: clamp(9px, 2.4cqw, 12px); }

/* 2026-10-01.6 技能特效的疊字（js/expedition-scene.js、js/skill-fx.js）：
   爆擊＝大大的金色（描邊、彈一下、上面一行「爆擊！」）、技能打到的數字照元素上色、連擊數（1 HIT → 2 HIT → 3 HIT!）、招式名（✦）照元素發光、
   一般冒險者的大招特寫（職業的顏色）、6 星英雄之後再放的短版特寫、技能預覽的小舞台 */
.bt-says .exp-say i { display: block; font-style: normal; font-size: 0.5em; line-height: 1.15; letter-spacing: 0.08em; color: #fff; text-align: center; }
.bt-says .exp-say.crit { font-size: clamp(14px, 3.6vw, 24px); font-size: clamp(14px, 4.6cqw, 26px); color: #ffe04a; line-height: 0.95; text-align: center;
  text-shadow: -2px -2px 0 #3a1a00, 2px -2px 0 #3a1a00, -2px 2px 0 #3a1a00, 2px 2px 0 #3a1a00, 0 3px 0 #3a1a00, 0 0 10px rgba(255, 170, 40, 0.9);
  animation-name: bt-crit; z-index: 2; }
.bt-says .exp-say.crit i { color: #fff3c0; }
.bt-says .exp-say.hurt.crit { color: #ff6a50; text-shadow: -2px -2px 0 #2a0000, 2px -2px 0 #2a0000, -2px 2px 0 #2a0000, 2px 2px 0 #2a0000, 0 3px 0 #2a0000, 0 0 10px rgba(255, 60, 40, 0.8); }
.bt-says .exp-say.miss { color: #e8eef8; letter-spacing: 0.06em; font-style: italic; }
.bt-says .exp-say.miss i { color: #b8c4d8; font-style: normal; }
.bt-says .exp-say.big { font-size: clamp(13px, 3vw, 20px); font-size: clamp(13px, 3.8cqw, 21px); z-index: 1; }
.bt-says .exp-say.shout { font-size: clamp(11px, 2.6vw, 17px); font-size: clamp(11px, 3.4cqw, 18px); color: #ffd8a0; letter-spacing: 0.1em; animation-name: bt-crit; }
@keyframes bt-crit {
  0% { opacity: 0; transform: translate(-50%, -40%) scale(2.2); }
  10% { opacity: 1; transform: translate(-50%, -100%) scale(0.86); }
  18% { transform: translate(-50%, -112%) scale(1.14); }
  28% { transform: translate(-50%, -104%) scale(1); }
  72% { opacity: 1; transform: translate(-50%, -128%) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -175%) scale(0.92); }
}
/* 技能打到的數字：元素的顏色 */
.exp-say.hit.el-fire { color: #ffb070; }
.exp-say.hit.el-ice { color: #a8e4ff; }
.exp-say.hit.el-holy { color: #fff0a0; }
.exp-say.hit.el-dark { color: #d8a0ff; }
.exp-say.hit.el-bolt { color: #fff45a; }
.exp-say.hit.el-nature { color: #b0f090; }
.exp-say.hit.el-poison { color: #c4f060; }
.exp-say.hit.el-blood { color: #ff8090; }
.exp-say.hit.el-wind { color: #a0f4dc; }
.exp-say.hit.el-earth { color: #e8c890; }
.exp-say.hit.el-moon { color: #dce4ff; }
.exp-say.hit.el-abyss { color: #ff7aa8; }
.exp-say.hit.el-hell { color: #8ad0ff; }
/* 招式名（✦）：外框照元素發光；大招、專屬技能大一點 */
.bt-says .exp-say.skill { --elc: #c9a646; --elg: rgba(201, 166, 70, 0.35); }
.bt-says .exp-say.skill.mine, .bt-says .exp-say.skill.foe { box-shadow: 0 0 0 1px var(--elc), 0 0 8px var(--elg); }
.bt-says .exp-say.skill.el-fire { --elc: #ff8a3a; --elg: rgba(255, 120, 40, 0.6); }
.bt-says .exp-say.skill.el-ice { --elc: #6ac8ff; --elg: rgba(90, 190, 255, 0.6); }
.bt-says .exp-say.skill.el-holy { --elc: #ffd84a; --elg: rgba(255, 216, 74, 0.6); }
.bt-says .exp-say.skill.el-dark { --elc: #b070ff; --elg: rgba(170, 100, 255, 0.6); }
.bt-says .exp-say.skill.el-bolt { --elc: #fff45a; --elg: rgba(120, 200, 255, 0.6); }
.bt-says .exp-say.skill.el-nature { --elc: #6ad07a; --elg: rgba(100, 220, 120, 0.6); }
.bt-says .exp-say.skill.el-poison { --elc: #9ae040; --elg: rgba(150, 224, 64, 0.6); }
.bt-says .exp-say.skill.el-blood { --elc: #ff4a5a; --elg: rgba(255, 60, 80, 0.6); }
.bt-says .exp-say.skill.el-wind { --elc: #5ad0b0; --elg: rgba(90, 208, 176, 0.6); }
.bt-says .exp-say.skill.el-earth { --elc: #c8a060; --elg: rgba(200, 160, 96, 0.6); }
.bt-says .exp-say.skill.el-moon { --elc: #b8c8ff; --elg: rgba(184, 200, 255, 0.6); }
.bt-says .exp-say.skill.el-abyss { --elc: #ff4a8a; --elg: rgba(255, 60, 130, 0.7); }
.bt-says .exp-say.skill.el-hell { --elc: #5aa8ff; --elg: rgba(80, 160, 255, 0.7); }
.bt-says .exp-say.skill.ult { font-size: clamp(10px, 2.4vw, 15px); font-size: clamp(10px, 3cqw, 15px); color: #fff2c0; letter-spacing: 0.05em;
  background: linear-gradient(180deg, rgba(64, 32, 12, 0.94), rgba(24, 12, 4, 0.94)); box-shadow: 0 0 0 1px var(--elc), 0 0 0 2px rgba(0, 0, 0, 0.5), 0 0 12px var(--elg); }
/* 連擊數 */
.bt-combo { position: absolute; transform: translate(-50%, -100%) rotate(-4deg); display: flex; align-items: baseline; gap: 2px; pointer-events: none; white-space: nowrap; z-index: 3;
  font: 900 italic clamp(13px, 3.6vw, 24px)/1 var(--font); font-size: clamp(13px, 4.4cqw, 26px); color: #fff; letter-spacing: 0.02em;
  text-shadow: -2px -2px 0 #2a0010, 2px -2px 0 #2a0010, -2px 2px 0 #2a0010, 2px 2px 0 #2a0010, 0 0 10px rgba(255, 70, 120, 0.85); }
.bt-combo b { color: #ffd84a; font-size: 1.3em; }
.bt-combo i { font-size: 0.68em; font-style: italic; color: #fff3f6; }
.bt-combo.last b { color: #ff7aa0; }
.bt-combo.last { text-shadow: -2px -2px 0 #2a0010, 2px -2px 0 #2a0010, -2px 2px 0 #2a0010, 2px 2px 0 #2a0010, 0 0 14px rgba(255, 60, 140, 1); }
.bt-combo.bump { animation: bt-combo 0.3s cubic-bezier(0.2, 1.8, 0.4, 1) both; }
.bt-combo.out { opacity: 0; transition: opacity 0.25s ease; }
@keyframes bt-combo { 0% { transform: translate(-50%, -100%) scale(1.8) rotate(-10deg); } 100% { transform: translate(-50%, -100%) scale(1) rotate(-4deg); } }
/* 特寫：一般冒險者的大招（職業的顏色）、6 星英雄之後再放的短版 */
.bt-cutin.mini { height: 30%; }
.bt-cutin.mini .bt-cut-lines { opacity: 0.22; }
.bt-cutin.mini .bt-cut-name { font-size: clamp(13px, 4.6cqw, 28px); }
.bt-cutin.mini .bt-cut-stars { display: none; }
.bt-cutin.ult .bt-cut-title { letter-spacing: 0.16em; }
.bt-cutin.ult .bt-cut-stars { color: var(--c3); letter-spacing: 0.08em; font-weight: 800; }
/* 技能預覽（酒館的技能樹）：小舞台＋左下角的招式名 */
bt-skill-preview { display: block; }
.bt-preview { position: relative; width: 100%; max-width: 480px; }
.bt-pv-cap { position: absolute; left: 6px; bottom: 5px; padding: 1px 8px 2px; border-radius: 999px; pointer-events: none; white-space: nowrap;
  background: rgba(20, 12, 4, 0.74); color: #ffe9a8; font: 800 11px/1.4 var(--font); box-shadow: 0 0 0 1px rgba(201, 166, 70, 0.7); }
.bt-pv-cap:empty { display: none; }
@media (prefers-reduced-motion: reduce) {
  .bt-combo, .bt-combo.bump, .bt-says .exp-say.crit, .bt-says .exp-say.shout { animation: none; }
}

/* 2026-10-01.7 前中後排（玩家：「有分前後排 但目前看起來腳色圍繞著怪物」）：開場地上的排名牌、打到中排後排時的原因、召喚獸的名字牌、神話裝備觸發、坐騎技能 */
.bt-says .exp-say.bt-row { font-size: clamp(9px, 2.2cqw, 12px); padding: 1px 7px 2px; border-radius: 6px; background: rgba(20, 14, 8, 0.72); color: #fff; text-shadow: none;
  letter-spacing: 0.08em; animation-name: exp-pop; transform: translate(-50%, 0); }
.bt-says .exp-say.bt-row.r0 { box-shadow: 0 0 0 1px #ff8a5a, 0 0 6px rgba(255, 138, 90, 0.5); color: #ffd8c8; }
.bt-says .exp-say.bt-row.r1 { box-shadow: 0 0 0 1px #ffd24a, 0 0 6px rgba(255, 210, 74, 0.5); color: #fff0c0; }
.bt-says .exp-say.bt-row.r2 { box-shadow: 0 0 0 1px #6ab8ff, 0 0 6px rgba(106, 184, 255, 0.5); color: #d8ecff; }
.bt-says .exp-say.bt-why { font-size: clamp(9px, 2.2cqw, 12px); padding: 1px 7px 2px; border-radius: 999px; background: #fffdf6; color: #8a2a12; text-shadow: none;
  box-shadow: 0 0 0 1px #8a2a12, 0 2px 0 rgba(0, 0, 0, 0.3); animation-name: exp-pop; }
.bt-tag.bt-sum { color: #e0d4ff; font-size: clamp(7px, 1.9cqw, 10.5px); text-shadow: -1px -1px 0 #1a0e3a, 1px -1px 0 #1a0e3a, -1px 1px 0 #1a0e3a, 1px 1px 0 #1a0e3a; }
.bt-tag.bt-sum.foe { color: #c8e0ff; }
.bt-says .exp-say.skill.myth { color: #f4dcff; box-shadow: 0 0 0 1px #b070ff, 0 0 10px rgba(176, 112, 255, 0.8); background: linear-gradient(90deg, rgba(60, 20, 90, 0.92), rgba(30, 10, 50, 0.92));
  animation-name: bt-crit; }
.bt-says .exp-say.skill.mount { color: #fff2d8; }
.exp-say.buff.myth { color: #ffe9a0; text-shadow: -1px -1px 0 #3a1a5a, 1px -1px 0 #3a1a5a, -1px 1px 0 #3a1a5a, 1px 1px 0 #3a1a5a, 0 0 8px rgba(200, 140, 255, 0.9); }
.exp-say.hit.el-arcane { color: #c8b8ff; }
.exp-say.hit.el-myth { color: #e0b0ff; }
.bt-says .exp-say.skill.el-arcane { --elc: #9a8aff; --elg: rgba(154, 138, 255, 0.6); }

/* 2026-10-02.1 戰鬥動畫大翻修（js/expedition-scene.js 的鏡頭、js/fx-hd.js、js/skill-fx-a.js）
   高解析特效層：疊在像素畫面上、名字牌下面（JS 照鏡頭換算座標）；像素畫面用 transform 放大（鏡頭），像素一樣清楚 */
.exp-scene .exp-canvas { will-change: transform; }
.bt-hd { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; display: block; }
/* 名字牌、泡泡、數字、連擊數：位置用 translate（JS 給 px），鏡頭在動的時候不用重新排版、不用重畫字 */
.bt-tags > .bt-tag, .bt-bubbles > .bt-bubble, .bt-says > .exp-say, .bt-says > .bt-combo { left: 0; top: 0; will-change: translate; }
.bt-tag.off, .bt-bubble.off { visibility: hidden; }
/* 戰鬥中：右上角的小地圖先讓開（鏡頭拉近，怪物站在右邊）；左上角的關卡牌子收起來、快轉跳過的按鈕往上（畫面留給戰鬥） */
.exp-scene .exp-mini { transition: opacity 0.35s ease; }
.exp-scene.battling .exp-mini { opacity: 0; pointer-events: none; }
.exp-scene.battling .exp-sign { visibility: hidden; }
.exp-scene.battling:not(.bt-bossfight) .exp-ctrl { top: 8px; }
/* 招式名的橫幅放在腳下（頭上太高會蓋到按鈕） */
.bt-says .exp-say.skill.below { animation-name: bt-banner-b; }
@keyframes bt-banner-b {
  0% { opacity: 0; transform: translate(-50%, 0) scale(1.7, 0.3); }
  10% { opacity: 1; transform: translate(-50%, 0) scale(0.92, 1.12); }
  20% { transform: translate(-50%, 0) scale(1.04, 0.98); }
  28% { transform: translate(-50%, 0) scale(1); }
  82% { opacity: 1; transform: translate(-50%, 4%) scale(1); }
  100% { opacity: 0; transform: translate(-50%, 18%) scale(0.96); }
}
/* 招式名：一條有氣勢的橫幅（元素顏色的上下邊、兩邊淡出、白金色的字發光；彈進來） */
.bt-says .exp-say.skill { font-size: clamp(11px, 3.1cqw, 21px); padding: 3px 16px 4px; border-radius: 2px; color: #fff4d0; letter-spacing: 0.08em;
  background: linear-gradient(90deg, rgba(20, 10, 4, 0), rgba(20, 10, 4, 0.9) 16%, rgba(20, 10, 4, 0.9) 84%, rgba(20, 10, 4, 0));
  text-shadow: 0 0 6px var(--elc), 0 0 2px var(--elc), 0 1px 0 #000; animation-name: bt-banner; z-index: 2; }
.bt-says .exp-say.skill.mine, .bt-says .exp-say.skill.foe { box-shadow: 0 -1px 0 var(--elc), 0 1px 0 var(--elc), 0 0 12px var(--elg); }
.bt-says .exp-say.skill.foe { color: #ffd8d0; }
.bt-says .exp-say.skill.ult { font-size: clamp(13px, 4cqw, 28px); padding: 4px 22px 5px; color: #fff8e0; letter-spacing: 0.12em;
  background: linear-gradient(90deg, rgba(40, 14, 4, 0), rgba(40, 14, 4, 0.94) 14%, rgba(70, 30, 8, 0.94) 50%, rgba(40, 14, 4, 0.94) 86%, rgba(40, 14, 4, 0));
  box-shadow: 0 -2px 0 var(--elc), 0 2px 0 var(--elc), 0 -4px 0 rgba(0, 0, 0, 0.35), 0 4px 0 rgba(0, 0, 0, 0.35), 0 0 18px var(--elg);
  text-shadow: 0 0 8px var(--elc), 0 0 3px #fff, 0 2px 0 #000; }
.bt-says .exp-say.skill.mount { color: #fff2d8; }
@keyframes bt-banner {
  0% { opacity: 0; transform: translate(-50%, -100%) scale(1.7, 0.3); }
  10% { opacity: 1; transform: translate(-50%, -100%) scale(0.92, 1.12); }
  20% { transform: translate(-50%, -100%) scale(1.04, 0.98); }
  28% { transform: translate(-50%, -100%) scale(1); }
  82% { opacity: 1; transform: translate(-50%, -104%) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -118%) scale(0.96); }
}
/* 星等的名字牌：6～10 星紫色、11～15 星紅黑魔焰、16～20 星彩虹（流動） */
.bt-tag.h6.t5 { padding: 0 4px 1px; border-radius: 4px; color: #f6e8ff;
  background: linear-gradient(90deg, rgba(120, 60, 220, 0.5), rgba(210, 160, 255, 0.5), rgba(120, 60, 220, 0.5), rgba(210, 160, 255, 0.5));
  background-size: 300% 100%; box-shadow: 0 0 0 1px rgba(220, 180, 255, 0.6), 0 0 8px rgba(170, 100, 255, 0.65); }
.bt-tag.h6.s1 { padding: 0 4px 1px; border-radius: 4px; color: #ffd8c0;
  background: linear-gradient(90deg, rgba(30, 0, 4, 0.8), rgba(150, 14, 28, 0.7), rgba(30, 0, 4, 0.8), rgba(150, 14, 28, 0.7));
  background-size: 300% 100%; box-shadow: 0 0 0 1px rgba(255, 90, 60, 0.75), 0 0 10px rgba(255, 40, 20, 0.75); }
.bt-tag.h6.s2 { color: #fff6c8;
  background: linear-gradient(90deg, rgba(255, 110, 170, 0.5), rgba(255, 220, 100, 0.5), rgba(110, 230, 140, 0.5), rgba(110, 220, 255, 0.5), rgba(190, 140, 255, 0.5), rgba(255, 110, 170, 0.5));
  background-size: 300% 100%; box-shadow: 0 0 0 1px rgba(255, 240, 180, 0.7), 0 0 10px rgba(255, 210, 140, 0.75); }
/* 特寫：星等的顏色（紫、紅黑、彩虹） */
.bt-cutin.s1 .bt-cut-band { box-shadow: 0 -2px 0 #ff4a2a, 0 2px 0 #ff4a2a, 0 -4px 0 #2a0004, 0 4px 0 #2a0004, 0 0 26px rgba(255, 40, 20, 0.9); }
.bt-cutin.s2 .bt-cut-band { box-shadow: 0 -2px 0 #ff9ab4, 0 2px 0 #8ae8ff, 0 -4px 0 #ffe27a, 0 4px 0 #b08aff, 0 0 30px rgba(255, 230, 180, 0.95); }
.bt-cut-stars.p { color: #d8a8ff; text-shadow: 0 0 5px rgba(170, 100, 255, 0.95), 0 1px 0 #000; }
.bt-cut-stars.c { color: #ff6a4a; text-shadow: 0 0 5px rgba(255, 30, 10, 0.95), 0 0 2px #000, 0 1px 0 #000; }
.bt-cut-stars.r { background: linear-gradient(90deg, #ff9ab4, #ffe27a, #8af0a0, #8ae8ff, #d8a8ff); -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: none; }
/* 特寫上的星星（js/stars.js 的 starsEl）：特寫只有一下子，星星不要動、只留一層光（手機比較順；js/stars.js 的星星會一直重畫模糊的光） */
.bt-cut-stars.sx { display: block; line-height: 0; }
.bt-cut-stars .stars-x, .bt-cut-stars .stars-x .st-i, .bt-cut-stars .stars-x .st-i::after { animation: none !important; }
.bt-cut-stars .stars-x { filter: drop-shadow(0 0 2px rgba(255, 220, 160, 0.9)) !important; }
.bt-cut-stars .stars-x.st-crimson { filter: drop-shadow(0 0 2px rgba(255, 50, 20, 1)) !important; }
@media (prefers-reduced-motion: reduce) {
  .bt-says .exp-say.skill { animation: none; }
  .exp-scene .exp-mini { transition: none; }
}