/* words.css — 背单词页（移植自小程序 words.wxss，统一深色紫蓝） */
.wd-head{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.wd-h2{ font-size:20px; font-weight:800; margin:0; color:var(--text); }
.wd-new{ margin-left:auto; }
.wd-section-label{ font-size:13px; color:var(--sub-text); margin:18px 0 10px; font-weight:700; letter-spacing:.3px; }
/* 课内词表：管理员上传 Excel 重建词库按钮（跟随 section label 同行右侧） */
.wd-course-upload{ float:right; margin-top:-5px; padding:4px 12px; font-size:12px; border:1px solid var(--accent); color:var(--accent); background:transparent; border-radius:8px; cursor:pointer; }
.wd-course-upload:hover:not([disabled]){ background:var(--accent); color:#fff; }
.wd-course-upload[disabled]{ opacity:.55; cursor:wait; }
.wd-course-msg{ margin:-4px 0 10px; padding:8px 12px; font-size:13px; color:#52c41a; background:rgba(82,196,26,.08); border:1px solid rgba(82,196,26,.35); border-radius:8px; }
.wd-list-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:12px; }
.wd-list-card{ position:relative; background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius-sm); padding:16px 14px; cursor:pointer; transition:transform .15s,border-color .15s,box-shadow .15s; }
.wd-list-card:hover{ transform:translateY(-2px); border-color:var(--accent); box-shadow:0 6px 20px rgba(0,0,0,.25); }
.wd-list-title{ font-size:15px; font-weight:700; color:var(--text); }
.wd-list-badge{ margin-top:6px; font-size:12px; color:var(--sub-text); }
.wd-list-count{ font-size:12px; color:var(--accent); font-weight:700; margin-left:4px; }
.wd-list-del,.wd-list-edit{ position:absolute; top:8px; width:26px; height:26px; border:none; border-radius:8px; background:rgba(255,255,255,.06); color:var(--sub-text); cursor:pointer; font-size:13px; line-height:1; }
.wd-list-del{ right:8px; }
.wd-list-edit{ right:42px; }
.wd-list-del:hover{ background:var(--error,#e05050); color:#fff; }
.wd-list-edit:hover{ background:var(--accent); color:#fff; }
.wd-empty,.vb-empty{ color:var(--sub-text); font-size:13px; padding:10px 2px; }
.wd-error,.vb-error,.me-login-err{ background:rgba(224,80,80,.14); border:1px solid rgba(224,80,80,.4); color:#ff9a9a; padding:10px 12px; border-radius:10px; font-size:13px; margin:10px 0; }

/* 模态：新建/编辑词表 */
.wd-modal-mask,.me-modal-mask{ position:fixed; inset:0; background:rgba(0,0,0,.55); display:flex; align-items:center; justify-content:center; z-index:9998; padding:20px; }
.wd-modal,.me-modal{ background:var(--card-bg); border:1px solid var(--border-strong,#333); border-radius:var(--radius); padding:20px; width:min(520px,100%); box-shadow:0 20px 60px rgba(0,0,0,.5); }
.wd-modal-title,.me-modal-title{ font-size:17px; font-weight:800; color:var(--text); margin-bottom:14px; }
.wd-field-label,.me-field-label{ display:block; font-size:13px; color:var(--sub-text); margin:10px 0 6px; }
.wd-input,.me-input,.wd-textarea,.me-textarea{ width:100%; box-sizing:border-box; background:rgba(255,255,255,.04); border:1px solid var(--border-strong,#333); border-radius:10px; color:var(--text); padding:10px 12px; font-size:14px; font-family:inherit; }
.wd-textarea,.me-textarea{ min-height:140px; resize:vertical; line-height:1.6; }
.wd-textarea code,.me-textarea code{ background:var(--chip-bg); color:var(--accent); padding:1px 5px; border-radius:5px; font-size:12px; }
.wd-modal-actions,.me-modal-actions{ display:flex; gap:10px; justify-content:flex-end; margin-top:16px; }

/* 学习区顶栏 */
.wd-study-bar{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.wd-back{ }
.wd-study-title{ font-weight:700; color:var(--text); font-size:16px; }
.wd-tabs{ display:flex; gap:8px; margin-left:auto; }
.wd-tab{ padding:8px 14px; border:1px solid var(--border); background:transparent; color:var(--sub-text); border-radius:999px; cursor:pointer; font-size:13px; font-weight:600; transition:all .15s; }
.wd-tab.on{ background:var(--chip-bg); color:var(--accent); border-color:var(--accent); }
.wd-loading{ color:var(--sub-text); padding:30px; text-align:center; }

/* 闪卡 */
.wd-card-wrap{ max-width:640px; margin:10px auto 0; }
.wd-card{ position:relative; height:280px; perspective:1000px; cursor:pointer; }
.wd-card-front,.wd-card-back{ position:absolute; inset:0; backface-visibility:hidden; -webkit-backface-visibility:hidden; background:var(--card-bg); border:1px solid var(--border-strong,#333); border-radius:var(--radius); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:20px; transition:transform .4s; box-shadow:var(--shadow); }
.wd-card-front{ transform:rotateY(0deg); }
.wd-card-back{ transform:rotateY(180deg); align-items:flex-start; text-align:left; }
.wd-card.flipped .wd-card-front{ transform:rotateY(180deg); }
.wd-card.flipped .wd-card-back{ transform:rotateY(360deg); }
.wd-word{ font-size:40px; font-weight:800; color:var(--text); letter-spacing:.5px; text-align:center; }
.wd-speak{ position:absolute; top:14px; right:14px; width:38px; height:38px; border:none; border-radius:50%; background:var(--chip-bg); color:var(--accent); font-size:18px; cursor:pointer; }
.wd-phonetic{ font-size:18px; color:var(--accent); font-family:"Cambria Math",Consolas,monospace; margin-bottom:6px; }
.wd-pos{ font-size:13px; color:#7c3aed; font-style:italic; margin-bottom:8px; }
.wd-meaning{ font-size:18px; color:var(--text); line-height:1.6; }
.wd-card-meta{ text-align:center; color:var(--sub-text); font-size:13px; margin-top:14px; }
.wd-card-meta b{ color:var(--accent); }
.wd-progress{ text-align:center; color:var(--sub-text); font-size:13px; margin:6px 0 14px; }
.wd-card-actions{ display:flex; gap:10px; justify-content:center; max-width:560px; margin:0 auto; }
.wd-card-actions .btn{ flex:1; max-width:160px; }

/* 音节：红色元音分段 */
.wd-piece{ display:inline-block; margin-right:1px; }
.wd-piece-space{ width:.35em; }
.wd-syl{ display:inline; }
.wd-syl-red{ color:#ff6b8a; font-weight:800; }

/* 拼写 */
.wd-spell-wrap{ max-width:600px; margin:10px auto 0; text-align:center; }
.wd-spell-voice{ display:flex; gap:12px; justify-content:center; margin-bottom:8px; }
.wd-voice-btn{ padding:10px 18px; border:1px solid var(--border-strong,#333); background:var(--card-bg); color:var(--text); border-radius:999px; font-size:15px; font-weight:700; cursor:pointer; transition:all .15s; display:inline-flex; align-items:center; gap:6px; }
.wd-voice-btn:hover{ border-color:var(--accent); background:var(--chip-bg); color:var(--accent); }
.wd-voice-btn:active{ transform:scale(.96); }
.wd-spell-word{ font-size:30px; font-weight:800; color:var(--text); margin-bottom:8px; }
.wd-spell-answer{ min-height:46px; display:flex; flex-wrap:wrap; gap:8px; justify-content:center; align-items:center; padding:10px; background:rgba(255,255,255,.04); border:1px dashed var(--border-strong,#333); border-radius:12px; margin:12px 0; }
.wd-spell-ans{ background:var(--chip-bg); color:var(--accent); padding:6px 12px; border-radius:8px; font-weight:700; font-size:16px; }
.wd-spell-ph{ color:var(--sub-text); font-size:13px; }
.wd-spell-ok{ color:var(--success,#4caf72); font-weight:700; margin:6px 0; }
.wd-spell-bad{ color:var(--error,#e05050); font-weight:700; margin:6px 0; }
.wd-spell-reveal{ background:var(--card-bg); border:1px solid var(--border-strong,#333); border-radius:var(--radius); padding:22px 18px; margin:12px 0 18px; text-align:center; box-shadow:var(--shadow); }
.wd-spell-reveal-word{ font-size:34px; font-weight:800; color:var(--text); margin-bottom:10px; }
.wd-spell-reveal-phonetic{ font-size:17px; color:var(--accent); font-family:"Cambria Math",Consolas,monospace; margin-bottom:4px; }
.wd-spell-reveal-pos{ font-size:13px; color:#7c3aed; font-style:italic; margin-bottom:8px; }
.wd-spell-reveal-meaning{ font-size:17px; color:var(--text); line-height:1.6; }
.wd-spell-blocks{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:14px 0; }
.wd-spell-block{ padding:10px 16px; background:var(--card-bg); border:1px solid var(--border-strong,#333); border-radius:10px; color:var(--text); font-size:17px; font-weight:700; cursor:pointer; transition:all .12s; }
.wd-spell-block:hover{ border-color:var(--accent); }
.wd-spell-block.used{ opacity:.28; pointer-events:none; }
.wd-spell-actions{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }

/* 拼写（新版：线索 + 字母槽 + 逐格校验） */
.wd-spell-clue{ margin:4px 0 10px; display:flex; gap:10px; justify-content:center; align-items:baseline; flex-wrap:wrap; }
.wd-spell-pos{ background:var(--chip-bg); color:#7c3aed; border:1px solid rgba(124,58,237,.45); padding:3px 10px; border-radius:999px; font-size:13px; font-style:italic; font-weight:700; }
.wd-spell-mean{ color:var(--text); font-size:19px; font-weight:700; }
.wd-spell-phon-hint{ color:var(--accent); font-size:15px; font-family:"Cambria Math",Consolas,monospace; margin-bottom:8px; }
.wd-spell-slots{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin:14px 0; }
.wd-spell-slot{ min-width:34px; height:44px; display:inline-flex; align-items:center; justify-content:center; border-bottom:3px solid var(--border-strong,#444); color:var(--text); font-size:22px; font-weight:800; font-family:Consolas,monospace; transition:border-color .15s,background .15s; }
.wd-spell-slot.filled{ border-bottom-color:var(--success,#4caf72); color:var(--accent); }
.wd-spell-slot.cur{ border-bottom-color:var(--accent); box-shadow:inset 0 -2px 0 -3px var(--accent); animation:wd-slot-blink 1s ease-in-out infinite; }
.wd-spell-slot.wrong{ border-bottom-color:var(--error,#e05050); color:var(--error,#e05050); background:rgba(224,80,80,.14); animation:wd-slot-shake .35s; }
@keyframes wd-slot-blink{ 0%,100%{ background:transparent } 50%{ background:var(--chip-bg) } }
@keyframes wd-slot-shake{ 0%,100%{transform:translateX(0)} 25%{transform:translateX(-4px)} 75%{transform:translateX(4px)} }
.wd-spell-kbd{ margin-top:12px; color:var(--sub-text); font-size:12px; }
.wd-spell-block{ text-transform:none; }

/* 消消乐 */
.wd-game-wrap{ max-width:680px; margin:10px auto 0; }
.wd-game-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:12px; }
.wd-game-card{ min-height:62px; padding:10px; background:var(--card-bg); border:1px solid var(--border-strong,#333); border-radius:12px; color:var(--text); font-size:14px; font-weight:600; cursor:pointer; display:flex; align-items:center; justify-content:center; text-align:center; transition:all .15s; }
.wd-game-word{ }
.wd-game-mean{ font-size:13px; color:var(--sub-text); }
.wd-game-card.selected{ border-color:var(--accent); background:var(--chip-bg); color:var(--accent); transform:scale(1.04); box-shadow:0 0 0 2px var(--accent); }
.wd-game-card.wrong{ border-color:var(--error,#e05050); background:rgba(224,80,80,.16); animation:wd-shake .4s; }
.wd-game-card.matched{ opacity:.25; pointer-events:none; }
@keyframes wd-shake{ 0%,100%{transform:translateX(0)} 25%{transform:translateX(-5px)} 75%{transform:translateX(5px)} }

/* 已配对列表：单词+词义+朗读按钮 */
.wd-game-matched-wrap{ max-width:680px; margin:22px auto 0; }
.wd-game-matched-title{ font-size:14px; font-weight:700; color:var(--sub-text); margin-bottom:10px; }
.wd-game-matched-scroll{ position:relative; max-height:280px; overflow-y:auto; }
.wd-game-matched-scroll::-webkit-scrollbar{ width:8px; }
.wd-game-matched-scroll::-webkit-scrollbar-thumb{ background:var(--border-strong,#333); border-radius:8px; }
.wd-game-matched-list{ display:flex; flex-direction:column; gap:8px; }
.wd-game-matched-row.wd-game-match-speaking{ background:rgba(255,215,0,.22); border-color:rgba(255,215,0,.55); box-shadow:0 0 0 2px rgba(255,215,0,.35) inset; }
.wd-game-matched-row{ display:flex; align-items:center; gap:10px; background:var(--card-bg); border:1px solid var(--border-strong,#333); border-radius:12px; padding:10px 12px; }
.wd-game-match-idx{ min-width:24px; text-align:center; font-size:12px; font-weight:700; color:var(--accent); background:var(--chip-bg); border-radius:999px; padding:2px 0; }
.wd-game-match-word{ font-size:16px; font-weight:700; color:var(--text); min-width:90px; }
.wd-game-match-mean{ flex:1; font-size:14px; color:var(--sub-text); }
.wd-game-match-actions{ display:flex; gap:8px; flex-wrap:wrap; }
.wd-game-match-bette{ flex-basis:100%; margin-top:6px; text-align:center; }
.wd-game-match-bette .bt-table-syl{ padding:3px 6px; }
.wd-game-match-btn{ padding:6px 12px; border:1px solid var(--border-strong,#333); background:rgba(255,255,255,.06); color:var(--text); border-radius:999px; font-size:13px; font-weight:600; cursor:pointer; transition:all .15s; }
.wd-game-match-btn:hover{ border-color:var(--accent); background:var(--chip-bg); color:var(--accent); }
.wd-game-match-btn:active{ transform:scale(.96); }
.wd-game-match-bar{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; background:var(--card-bg); border:1px solid var(--border-strong,#333); border-radius:12px; padding:10px 14px; margin-bottom:12px; }
.wd-game-match-title{ font-size:14px; font-weight:700; color:var(--text); }
.wd-game-match-actions-bar{ display:flex; gap:8px; align-items:center; margin-left:auto; flex-wrap:wrap; }
.wd-game-match-rep{ width:56px; padding:5px 8px; background:rgba(255,255,255,.04); border:1px solid var(--border-strong,#333); border-radius:8px; color:var(--text); font-size:13px; text-align:center; }
.wd-game-match-rep-label{ font-size:13px; color:var(--sub-text); }

/* ===== 星空大战（词义射击） ===== */
.wd-battle-wrap{ max-width:680px; margin:10px auto 0; }
.wd-battle-hud{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; background:var(--card-bg); border:1px solid var(--border-strong,#333); border-radius:12px; padding:10px 14px; margin-bottom:10px; font-size:14px; font-weight:700; color:var(--text); }
.wd-bt-item{ display:inline-flex; align-items:center; gap:6px; }
.wd-bt-score{ color:#ffd24a; font-size:18px; }
.wd-bt-level{ color:var(--accent); }
.wd-bt-hi{ margin-left:auto; color:var(--sub-text); font-weight:600; }
.wd-bt-lives{ gap:2px; }
.wd-bt-life{ color:#ff5a7a; font-size:16px; filter:drop-shadow(0 0 3px rgba(255,90,122,.6)); }
.wd-bt-life.off{ color:#444; filter:none; opacity:.5; }
/* 战场：星空背景 */
.wd-battle-field{ position:relative; height:380px; overflow:hidden; border-radius:14px; border:1px solid var(--border-strong,#333);
  background:
    radial-gradient(1px 1px at 20% 30%, #fff, transparent),
    radial-gradient(1px 1px at 70% 20%, #cfe, transparent),
    radial-gradient(2px 2px at 40% 70%, #fff, transparent),
    radial-gradient(1px 1px at 85% 55%, #fff, transparent),
    radial-gradient(1.5px 1.5px at 55% 40%, #bdf, transparent),
    linear-gradient(180deg,#1a1140 0%,#241a5c 45%,#3a1f5e 100%);
  box-shadow:inset 0 0 60px rgba(0,0,0,.45);
}
.wd-battle-field::before{ content:""; position:absolute; inset:0;
  background-image:radial-gradient(1px 1px at 10% 10%, #fff 50%, transparent),
    radial-gradient(1px 1px at 30% 50%, #fff 50%, transparent),
    radial-gradient(1px 1px at 60% 30%, #fff 50%, transparent),
    radial-gradient(1px 1px at 80% 70%, #fff 50%, transparent),
    radial-gradient(1px 1px at 90% 20%, #fff 50%, transparent),
    radial-gradient(1px 1px at 50% 80%, #fff 50%, transparent);
  background-size:220px 220px;
  opacity:.5; animation:wd-stars 6s linear infinite;
}
@keyframes wd-stars{ from{ background-position:0 0; } to{ background-position:0 220px; } }
.wd-battle-field.wd-battle-hurt{ animation:wd-hurt .32s; }
@keyframes wd-hurt{ 0%,100%{ box-shadow:inset 0 0 60px rgba(0,0,0,.45); } 30%{ box-shadow:inset 0 0 90px rgba(255,60,90,.7); } }
/* 危险线 */
.wd-battle-danger{ position:absolute; left:0; right:0; bottom:0; height:54px; border-top:2px dashed rgba(255,90,122,.55); background:linear-gradient(180deg,transparent,rgba(255,90,122,.12)); pointer-events:none; }
/* 敌机 */
.wd-battle-enemy{ position:absolute; top:0; will-change:transform; z-index:2; }
.wd-battle-ship{ display:inline-block; padding:8px 14px; font-size:16px; font-weight:800; color:#fff; white-space:nowrap;
  background:linear-gradient(135deg,#7c5cff 0%,#b14cff 100%); border:1px solid rgba(255,255,255,.25); border-radius:12px;
  box-shadow:0 4px 14px rgba(124,92,255,.55), 0 0 0 2px rgba(124,92,255,.18); animation:wd-ship-float 1.8s ease-in-out infinite; }
@keyframes wd-ship-float{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-3px); } }
.wd-battle-enemy.wd-battle-boom{ animation:wd-boom .42s ease-out forwards; }
@keyframes wd-boom{ 0%{ transform:scale(1); opacity:1; } 40%{ transform:scale(1.5); opacity:1; filter:drop-shadow(0 0 12px #ffd24a); } 100%{ transform:scale(2.1); opacity:0; } }
/* 激光 */
.wd-battle-laser{ position:absolute; bottom:54px; width:3px; margin-left:-1.5px; z-index:3;
  background:linear-gradient(180deg,#fff, #4cf0ff 40%, rgba(76,240,255,0)); box-shadow:0 0 8px #4cf0ff; animation:wd-laser .24s ease-out; }
@keyframes wd-laser{ 0%{ opacity:.2; } 50%{ opacity:1; } 100%{ opacity:0; } }
/* 加分飘字 */
.wd-battle-pop{ position:absolute; z-index:4; transform:translateX(-50%); color:#ffd24a; font-weight:800; font-size:16px; text-shadow:0 1px 4px #000; pointer-events:none; animation:wd-pop .65s ease-out forwards; }
@keyframes wd-pop{ 0%{ opacity:0; transform:translate(-50%,4px); } 20%{ opacity:1; } 100%{ opacity:0; transform:translate(-50%,-26px); } }
/* 升级提示 */
.wd-battle-toast{ position:absolute; left:50%; top:42%; transform:translate(-50%,-50%); z-index:5; padding:10px 18px; border-radius:999px;
  background:rgba(124,92,255,.92); color:#fff; font-weight:800; font-size:14px; white-space:nowrap; box-shadow:0 6px 22px rgba(0,0,0,.4); animation:wd-toast 1.4s ease-in-out forwards; }
@keyframes wd-toast{ 0%{ opacity:0; transform:translate(-50%,-30%); } 15%,75%{ opacity:1; transform:translate(-50%,-50%); } 100%{ opacity:0; transform:translate(-50%,-65%); } }
/* 提示语 */
.wd-battle-tip{ text-align:center; color:var(--sub-text); font-size:13px; margin:10px 0 8px; }
/* 选项栏：单行均分，中文释义自动换行，便于看到前几个意思 */
.wd-battle-opts{ display:flex; flex-wrap:nowrap; gap:10px; }
.wd-battle-opt{ flex:1 1 0; min-width:0; background:var(--card,#fff); border:2px solid var(--border,#e3e6ef); border-radius:12px; padding:14px 8px; font-size:15px; font-weight:700; color:var(--text); text-align:center; cursor:pointer; transition:all .15s; white-space:normal; line-height:1.35; }
.wd-battle-opt:hover:not(:disabled){ border-color:var(--accent); background:rgba(102,126,234,.08); transform:translateY(-1px); }
.wd-battle-opt-wrong{ border-color:#e74c3c !important; background:rgba(231,76,60,.14) !important; animation:wd-shake .4s; }
/* 双模式选择卡片 */
.wd-battle-modes{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin:4px 0 16px; }
.wd-battle-mode-card{ background:var(--card-bg); border:1px solid var(--border); border-radius:14px; padding:16px 12px;
  display:flex; flex-direction:column; align-items:center; gap:6px; box-shadow:var(--shadow); }
.wd-battle-mode-emoji{ font-size:34px; line-height:1; }
.wd-battle-mode-name{ font-size:15px; font-weight:800; color:var(--text); }
.wd-battle-mode-desc{ font-size:12.5px; color:var(--sub-text); line-height:1.6; }
.wd-battle-mode-hi{ font-size:13px; color:var(--accent); font-weight:700; }
.wd-battle-mode-card .btn{ margin-top:4px; }
/* 反向模式：英文选项强制单行截断（英文词短，一行更整齐） */
.wd-battle-opts.rev .wd-battle-opt{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* 反向模式：中文敌机卡片适配较长词义 */
.wd-battle-wrap.rev .wd-battle-ship{ font-size:14px; padding:8px 12px; max-width:250px;
  white-space:normal; line-height:1.45; text-align:center; }
/* 介绍页 / 结算页 */
.wd-battle-intro,.wd-battle-result{ max-width:560px; margin:18px auto; background:var(--card-bg); border:1px solid var(--border-strong,#333); border-radius:16px; padding:26px 22px; text-align:center; box-shadow:var(--shadow); }
.wd-battle-intro-emoji,.wd-finish-emoji{ font-size:52px; }
.wd-battle-intro-title{ font-size:20px; font-weight:800; color:var(--text); margin:8px 0 12px; }
.wd-battle-intro-desc{ color:var(--sub-text); font-size:14px; line-height:1.7; margin-bottom:14px; }
.wd-battle-rules{ text-align:left; list-style:none; padding:0; margin:0 0 16px; display:flex; flex-direction:column; gap:9px; }
.wd-battle-rules li{ background:rgba(102,126,234,.08); border:1px solid rgba(102,126,234,.2); border-radius:10px; padding:10px 12px; font-size:14px; color:var(--text); }
.wd-battle-intro-hi{ color:var(--accent); font-size:14px; margin-bottom:16px; }
.wd-battle-rec-title{ font-size:14px; font-weight:700; color:var(--sub-text); margin:18px 0 10px; text-align:left; }
.wd-battle-rec-list{ display:flex; flex-direction:column; gap:7px; max-height:240px; overflow-y:auto; }
.wd-battle-rec{ display:flex; align-items:center; gap:10px; background:var(--card-bg); border:1px solid var(--border-strong,#333); border-radius:10px; padding:9px 12px; text-align:left; transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease; }
.wd-battle-rec-w{ font-size:15px; font-weight:700; color:var(--text); min-width:96px; }
.wd-battle-rec-m{ flex:1; font-size:14px; color:var(--sub-text); }
.wd-battle-rec.ok{ border-left:4px solid #27ae60; }
.wd-battle-rec.bad{ border-left:4px solid #e74c3c; }
/* 朗读中：明显的金色高亮 + 放大 + 投影，避免被左侧绿/红色条遮挡 */
.wd-battle-rec.wd-battle-rec-speaking{ background:#fff3a8 !important; border-color:#f1c40f !important; box-shadow:0 6px 18px rgba(241,196,15,.45), 0 0 0 3px rgba(241,196,15,.35) !important; transform:translateX(2px) scale(1.02); }
.wd-battle-rec.wd-battle-rec-speaking .wd-battle-rec-w{ color:#8a6d00 !important; }
.wd-battle-result .btn{ margin:6px; }
/* 结算页朗读工具条 */
.wd-battle-rec-bar{ display:flex; align-items:center; gap:8px; margin:-6px 0 12px; padding:8px 10px; background:var(--card-bg); border:1px solid var(--border); border-radius:10px; flex-wrap:wrap; }
.wd-battle-rec-btn{ background:var(--card); border:1px solid var(--border); border-radius:8px; padding:6px 10px; font-size:13px; font-weight:700; color:var(--text); cursor:pointer; transition:all .15s; }
.wd-battle-rec-btn:hover{ border-color:var(--accent); background:rgba(102,126,234,.08); }
.wd-battle-rec-rep{ width:48px; padding:5px 6px; font-size:14px; text-align:center; border:1px solid var(--border); border-radius:8px; background:var(--card); color:var(--text); }
.wd-battle-rec-rep-label{ font-size:13px; color:var(--sub-text); }
/* 星空大战窄屏规则已统一收口至 static/css/mobile.css（第 8 节），此处不重复写 @media。 */

/* 完成总结 */
.wd-finish{ text-align:center; padding:40px 20px; }
.wd-finish-emoji{ font-size:54px; }
.wd-finish-title{ font-size:22px; font-weight:800; color:var(--text); margin:10px 0; }
.wd-finish-stat{ color:var(--sub-text); font-size:14px; margin:8px 0; }
.wd-finish-msg{ color:var(--accent); font-size:15px; margin:8px 0 18px; }
.wd-finish .btn{ margin:0 6px; }

/* 顺序表 / 乱序表 */
.wd-table-wrap{ max-width:760px; margin:10px auto 0; }
.wd-table-bar{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; background:var(--card-bg); border:1px solid var(--border-strong,#333); border-radius:12px; padding:10px 14px; margin-bottom:12px; }
.wd-table-gtitle{ font-size:14px; font-weight:700; color:var(--text); }
.wd-table-actions{ display:flex; gap:8px; align-items:center; margin-left:auto; flex-wrap:wrap; }
.wd-table-btn{ padding:7px 14px; border:1px solid var(--border-strong,#333); background:rgba(255,255,255,.06); color:var(--text); border-radius:999px; font-size:13px; font-weight:600; cursor:pointer; transition:all .15s; }
.wd-table-btn:hover{ border-color:var(--accent); background:var(--chip-bg); color:var(--accent); }
.wd-table-btn:active{ transform:scale(.96); }
.wd-table-btn:disabled{ opacity:.4; cursor:not-allowed; }
.wd-table-rep{ width:64px; padding:6px 8px; background:rgba(255,255,255,.04); border:1px solid var(--border-strong,#333); border-radius:8px; color:var(--text); font-size:13px; text-align:center; }
.wd-table-rep-label{ font-size:13px; color:var(--sub-text); }
.wd-table-head{ display:grid; grid-template-columns:1.1fr 1.4fr 2.4fr 3fr; gap:10px; padding:8px 12px; font-size:12px; font-weight:700; color:var(--sub-text); border-bottom:1px solid var(--border); }
.wd-table-scroll{ position:relative; max-height:360px; overflow-y:auto; }
.wd-table-scroll::-webkit-scrollbar{ width:8px; }
.wd-table-scroll::-webkit-scrollbar-thumb{ background:var(--border-strong,#333); border-radius:8px; }
.wd-table-row{ display:grid; grid-template-columns:1.1fr 1.4fr 2.4fr 3fr; gap:10px; align-items:center; padding:11px 12px; border-bottom:1px solid var(--border); transition:background .15s; }
.wd-table-row:hover{ background:rgba(255,255,255,.03); }
.wd-table-row.wd-table-speaking{ background:rgba(255,215,0,.22); border-radius:8px; box-shadow:0 0 0 2px rgba(255,215,0,.45) inset; }
.wd-table-word{ font-size:16px; font-weight:700; color:var(--text); }
.wd-table-phon{ font-size:14px; color:var(--accent); font-family:"Cambria Math",Consolas,monospace; }
.wd-table-bette{ font-size:13px; color:var(--text); line-height:1.55; font-family:Georgia,'Times New Roman',serif; display:flex; flex-wrap:wrap; align-items:center; gap:2px; }
.bt-table-syl{ display:inline-flex; flex-direction:column; align-items:center; padding:2px 5px; border-radius:6px; background:rgba(102,126,234,.08); border:1px solid rgba(102,126,234,.18); }
.bt-table-stress{ background:rgba(240,147,43,.18); border-color:rgba(240,147,43,.5); box-shadow:inset 0 0 0 1px rgba(240,147,43,.35); }
.bt-table-v{ font-size:11px; color:#e74c3c; font-weight:700; margin-top:1px; }
.bt-table-t{ font-size:10px; color:var(--sub-text); margin-top:1px; white-space:nowrap; }
.bt-table-dot{ color:var(--accent); font-weight:700; padding:0 1px; }
.wd-table-mean{ font-size:14px; color:var(--sub-text); line-height:1.5; }
.wd-table-nav{ display:flex; gap:10px; justify-content:center; margin-top:14px; }

/* 登录提示 */
.wd-login-tip,.vb-login-tip{ text-align:center; padding:48px 20px; }
.wd-login-emoji,.vb-login-emoji{ font-size:52px; }
.wd-login-title,.vb-login-title{ font-size:19px; font-weight:800; color:var(--text); margin:12px 0 6px; }
.wd-login-desc,.vb-login-desc{ color:var(--sub-text); font-size:14px; margin-bottom:18px; }
.wd-login-tip .btn,.vb-login-tip .btn{ margin:0 6px; }

/* AI 查词按钮 */
.wd-ai-lookup{ margin-top:10px; background:linear-gradient(135deg,#667eea 0%,#764ba2 100%) !important; color:#fff !important; border:none !important; }
.wd-ai-lookup:hover{ opacity:.9; }
.wd-ai-loading{ margin-top:10px; font-size:13px; color:var(--accent); }
.wd-table-ai{ margin-left:8px; background:rgba(102,126,234,.18); border:1px solid rgba(102,126,234,.45); color:var(--accent); border-radius:6px; padding:2px 8px; font-size:12px; cursor:pointer; }
.wd-table-ai:hover{ background:rgba(102,126,234,.3); }

/* 新建词表弹窗：导入文件按钮 */
.wd-import-row{ position:relative; margin:10px 0 2px; }
.wd-import-btn{ width:100%; box-sizing:border-box; background:rgba(102,126,234,.14); color:var(--accent); border:1px dashed var(--accent); border-radius:10px; padding:10px 12px; font-size:14px; font-weight:600; cursor:pointer; }
.wd-import-btn:hover{ background:rgba(102,126,234,.24); }

/* ===== 倍特拼读（背单词卡片 & 拼写揭示，通用于 Ela.bette.html 输出） ===== */
.bt-wrap{ margin:10px auto 4px; padding:8px 12px; max-width:560px; background:rgba(102,126,234,.08); border:1px solid rgba(102,126,234,.22); border-radius:10px; text-align:center; }
.bt-label{ font-size:11px; font-weight:700; color:var(--accent); letter-spacing:2px; margin-bottom:6px; }
.bt-syls{ display:flex; flex-wrap:wrap; justify-content:center; align-items:flex-start; gap:2px; }
.bt-syl{ display:inline-flex; flex-direction:column; align-items:center; padding:2px 5px; border-radius:8px; }
.bt-syl.bt-stress{ background:rgba(240,147,43,.16); box-shadow:inset 0 0 0 1px rgba(240,147,43,.45); }
.bt-txt{ font-size:17px; font-weight:700; color:var(--text); font-family:Georgia,'Times New Roman',serif; }
.bt-snd{ font-size:12px; color:#e74c3c; font-weight:600; margin-top:1px; }
.bt-type{ font-size:10px; color:var(--text-soft,#888); margin-top:1px; white-space:nowrap; }
.bt-dot{ align-self:center; color:var(--accent); font-weight:700; padding:0 1px; }
.bt-rules{ margin-top:6px; display:flex; flex-wrap:wrap; justify-content:center; gap:4px; }
.bt-rule{ font-size:11px; color:var(--text-soft,#777); background:rgba(0,0,0,.05); border-radius:6px; padding:2px 7px; }

/* ===== 课内词表：课本 / 单元分级导航 ===== */
.wd-course-bar{ display:flex; align-items:center; gap:10px; margin:0 0 12px; flex-wrap:wrap; }
.wd-course-all{ margin-left:auto; }
.wd-list-course{ cursor:pointer; border-left:4px solid var(--accent); }
.wd-list-course:hover{ background:rgba(102,126,234,.12); }
.wd-list-unit{ display:flex; flex-direction:column; gap:8px; }
.wd-list-study{ align-self:flex-start; background:var(--accent); color:#fff; border:none; border-radius:8px; padding:7px 14px; font-size:13px; font-weight:600; cursor:pointer; }
.wd-list-study:hover{ filter:brightness(1.06); }

/* ===== 选择题测验（英选义 / 义选英） ===== */
.wd-quiz-wrap{ max-width:560px; margin:0 auto; padding:18px 14px; }
.wd-quiz-progress{ font-size:13px; color:var(--text-soft,#888); text-align:center; margin-bottom:14px; }
.wd-quiz-prompt{ text-align:center; margin-bottom:18px; }
.wd-quiz-en .wd-word{ font-size:34px; font-weight:700; color:var(--text); font-family:Georgia,'Times New Roman',serif; }
.wd-quiz-en .wd-quiz-phon{ font-size:16px; color:var(--text-soft,#888); margin-top:4px; }
.wd-quiz-cn .wd-quiz-mean{ font-size:26px; font-weight:700; color:var(--text); line-height:1.4; }
.wd-quiz-tip{ font-size:13px; color:var(--accent); margin-top:10px; display:inline-flex; align-items:center; gap:6px; }
.wd-quiz-speak{ background:rgba(102,126,234,.14); color:var(--accent); border:1px solid rgba(102,126,234,.3); border-radius:50%; width:28px; height:28px; cursor:pointer; font-size:14px; }
.wd-quiz-speak:hover{ background:rgba(102,126,234,.26); }
.wd-quiz-opts{ display:flex; flex-direction:column; gap:12px; }
.wd-quiz-opt{ background:var(--card,#fff); border:2px solid var(--border,#e3e6ef); border-radius:12px; padding:14px 16px; font-size:16px; color:var(--text); text-align:left; cursor:pointer; transition:all .15s; }
.wd-quiz-opt:hover:not(:disabled){ border-color:var(--accent); background:rgba(102,126,234,.08); }
.wd-quiz-opt:disabled{ cursor:default; }
.wd-quiz-opt.wd-quiz-correct{ border-color:#27ae60; background:rgba(39,174,96,.14); color:#1e7e44; font-weight:700; }
.wd-quiz-opt.wd-quiz-wrong{ border-color:#e74c3c; background:rgba(231,76,60,.12); color:#b83227; }
.wd-quiz-feedback{ text-align:center; margin-top:16px; font-size:15px; font-weight:600; padding:10px; border-radius:10px; }
.wd-quiz-feedback.ok{ color:#1e7e44; background:rgba(39,174,96,.1); }
.wd-quiz-feedback.bad{ color:#b83227; background:rgba(231,76,60,.08); }
.wd-quiz-finish{ text-align:center; padding:30px 16px; }

/* ===== 植物大战僵尸（单词版） ===== */
.wd-zombie-wrap{ max-width:680px; margin:10px auto 0; }
.wd-zombie-hud{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; background:var(--card-bg); border:1px solid var(--border-strong,#333); border-radius:12px; padding:9px 14px; margin-bottom:10px; font-size:14px; font-weight:700; color:var(--text); }
.wd-zl-item{ display:inline-flex; align-items:center; gap:6px; }
.wd-zl-item b{ color:#ffd24a; font-size:18px; }
.wd-zl-level{ color:var(--accent); }
.wd-zl-lanes{ color:var(--sub-text); }
.wd-zl-lives{ gap:2px; display:inline-flex; }
.wd-zl-life{ color:#ff5a7a; font-size:16px; filter:drop-shadow(0 0 3px rgba(255,90,122,.6)); }
.wd-zl-life.off{ color:#444; filter:none; opacity:.5; }
.wd-zl-flip{ margin-left:auto; background:rgba(102,126,234,.12); border:1px solid var(--border); color:var(--text); border-radius:999px; padding:6px 12px; font-size:13px; font-weight:600; cursor:pointer; transition:all .15s; }
.wd-zl-flip:hover{ border-color:var(--accent); color:var(--accent); }
.wd-zl-mute{ background:rgba(102,126,234,.12); border:1px solid var(--border); color:var(--text); border-radius:999px; width:32px; height:30px; font-size:14px; line-height:1; cursor:pointer; transition:all .15s; }
.wd-zl-mute:hover{ border-color:var(--accent); }
/* 失命时生命槽整体红闪抖动 */
.wd-zl-lives.lost{ animation:wd-zlives .5s ease-out; }
@keyframes wd-zlives{ 0%,100%{ transform:none; } 20%{ transform:translateX(-4px) scale(1.12); } 45%{ transform:translateX(4px) scale(1.12); } 70%{ transform:translateX(-2px); } }
/* 升级时等级数字弹一下 */
.wd-zl-level.up{ animation:wd-zlvup .68s ease-out; }
@keyframes wd-zlvup{ 0%{ transform:scale(1); } 35%{ transform:scale(1.55); text-shadow:0 0 14px currentColor; } 100%{ transform:scale(1); } }

/* 战场：草坪 */
.wd-zombie-stage{ display:flex; align-items:stretch; gap:0; }
.wd-zombie-stage.flip{ flex-direction:row-reverse; }
.wd-zombie-base,.wd-zombie-spawn{ flex:0 0 56px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; font-size:12px; font-weight:700; color:var(--sub-text); border:1px solid var(--border-strong,#333); border-radius:12px; padding:8px 4px; writing-mode:vertical-rl; text-align:center; }
.wd-zombie-base{ background:linear-gradient(180deg,rgba(39,174,96,.18),rgba(39,174,96,.05)); transition:box-shadow .15s,transform .15s; }
.wd-zombie-base.fire{ box-shadow:0 0 20px rgba(255,214,74,.75) inset, 0 0 12px rgba(255,214,74,.5); }
.wd-zombie-base.hurt{ animation:wd-zbasehurt .5s ease-out; }
@keyframes wd-zbasehurt{ 0%,100%{ transform:none; box-shadow:none; } 25%{ transform:translateX(-5px) scale(.96); box-shadow:0 0 26px rgba(255,60,90,.8) inset; } 60%{ transform:translateX(4px); box-shadow:0 0 18px rgba(255,60,90,.55) inset; } }
.wd-zombie-spawn{ background:linear-gradient(180deg,rgba(124,92,255,.18),rgba(124,92,255,.05)); }
/* 整个舞台被撞得一震（僵尸破防时） */
.wd-zombie-stage.wd-zombie-shake{ animation:wd-zshake .44s cubic-bezier(.36,.07,.19,.97); }
@keyframes wd-zshake{ 0%,100%{ transform:translate(0,0); } 12%{ transform:translate(-6px,2px); } 28%{ transform:translate(5px,-3px); } 44%{ transform:translate(-4px,3px); } 62%{ transform:translate(4px,-2px); } 80%{ transform:translate(-2px,1px); } }
.wd-zombie-field{ position:relative; flex:1 1 auto; height:380px; overflow:hidden; border-radius:14px; border:1px solid var(--border-strong,#333);
  background:
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.30) 100%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.035) 0 1px, transparent 1px 66px),
    linear-gradient(160deg,#13351f 0%,#1c4a2c 50%,#143a22 100%);
  box-shadow:inset 0 0 50px rgba(0,0,0,.42); }
.wd-zombie-field.wd-zombie-hurt{ animation:wd-zhurt .42s; }
@keyframes wd-zhurt{ 0%,100%{ box-shadow:inset 0 0 50px rgba(0,0,0,.42); } 30%{ box-shadow:inset 0 0 92px rgba(255,60,90,.8); } }
/* 升级：草坪整片过一道白绿光 */
.wd-zombie-field.wd-zombie-flash{ animation:wd-zflash .72s ease-out; }
@keyframes wd-zflash{ 0%,100%{ box-shadow:inset 0 0 50px rgba(0,0,0,.42); filter:none; } 25%{ box-shadow:inset 0 0 100px rgba(120,255,170,.85); filter:brightness(1.35) saturate(1.2); } }
/* 通道（可点击投放区域） */
.wd-zombie-lane{ position:absolute; left:0; right:0; z-index:1; cursor:crosshair; border-bottom:1px dashed rgba(255,255,255,.12); }
.wd-zombie-lane:hover{ background:rgba(255,255,255,.06); }
/* 僵尸 */
.wd-zombie-z{ position:absolute; top:0; z-index:3; transform:translateX(-50%); will-change:left,top; display:flex; flex-direction:column; align-items:center; gap:2px; cursor:pointer; }
/* 走路：脑袋左右歪 + 上下颠，每只僵尸 --zstep 步频不同（JS 注入），一群人走起来不整齐 */
.wd-zombie-face{ font-size:26px; line-height:1; filter:drop-shadow(0 2px 4px rgba(0,0,0,.5));
  animation:wd-zwalk var(--zstep,.62s) ease-in-out infinite; transform-origin:50% 90%; }
@keyframes wd-zwalk{ 0%,100%{ transform:rotate(-7deg) translateY(0); } 50%{ transform:rotate(7deg) translateY(-3px); } }
.wd-zombie-label{ display:inline-block; max-width:132px; box-sizing:border-box; padding:4px 9px; font-size:13px; font-weight:800; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-align:center; background:linear-gradient(135deg,#7c5cff 0%,#b14cff 100%); border:1px solid rgba(255,255,255,.25); border-radius:10px; box-shadow:0 3px 10px rgba(124,92,255,.5); }
/* 逼近己方底线：红色告警脉冲 + 步频加快 */
.wd-zombie-z.danger .wd-zombie-face{ animation-duration:.3s; filter:drop-shadow(0 0 8px rgba(255,60,90,.95)); }
.wd-zombie-z.danger .wd-zombie-label{ background:linear-gradient(135deg,#ff3b5c 0%,#ff7a3d 100%); box-shadow:0 3px 14px rgba(255,60,90,.75); animation:wd-zalert .5s ease-in-out infinite; }
@keyframes wd-zalert{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.07); } }
/* 被锁定（豌豆在飞过来的路上）：定住抽动并泛白 */
.wd-zombie-z.wd-zombie-shock{ animation:wd-zshock .18s linear infinite; }
.wd-zombie-z.wd-zombie-shock .wd-zombie-face{ filter:brightness(2.2) drop-shadow(0 0 10px #fff); }
@keyframes wd-zshock{ 0%,100%{ transform:translateX(-50%); } 50%{ transform:translateX(-50%) translateX(2px); } }
.wd-zombie-z.wd-zombie-die{ animation:wd-zdie .46s ease-out forwards; }
@keyframes wd-zdie{ 0%{ transform:translateX(-50%) scale(1) rotate(0); opacity:1; } 35%{ transform:translateX(-50%) scale(1.5) rotate(-14deg); opacity:1; filter:drop-shadow(0 0 14px #ffd24a) brightness(1.5); } 100%{ transform:translateX(-50%) scale(2.15) rotate(-38deg) translateY(14px); opacity:0; } }
/* 啃穿防线：连啃两口再沉下去 */
.wd-zombie-z.wd-zombie-eat{ animation:wd-zeat .44s ease-in forwards; }
@keyframes wd-zeat{ 0%{ transform:translateX(-50%) scale(1); } 22%{ transform:translateX(-50%) scale(1.22) rotate(-8deg); } 46%{ transform:translateX(-50%) scale(1.05) rotate(6deg); } 70%{ transform:translateX(-50%) scale(1.2) rotate(-6deg); } 100%{ transform:translateX(-50%) scale(.6) translateY(20px); opacity:0; } }
/* 豌豆子弹 */
.wd-zombie-pea{ position:absolute; z-index:4; width:14px; height:14px; margin-left:-7px; border-radius:50%;
  background:radial-gradient(circle at 32% 30%,#d6ff92 0%,#7ed321 55%,#4e9e10 100%);
  box-shadow:0 0 10px rgba(160,255,90,.9),0 2px 4px rgba(0,0,0,.45); pointer-events:none; }
/* 基地枪口火光 */
.wd-zombie-muzzle{ position:absolute; z-index:4; width:24px; height:24px; margin-left:-12px; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle,rgba(255,240,150,.95) 0%,rgba(255,190,60,.55) 45%,transparent 72%);
  animation:wd-zmuzzle .26s ease-out forwards; }
@keyframes wd-zmuzzle{ 0%{ transform:scale(.4); opacity:1; } 100%{ transform:scale(1.7); opacity:0; } }
/* 爆炸粒子（径向飞散） */
.wd-zombie-spark{ position:absolute; z-index:5; width:7px; height:7px; margin-left:-3.5px; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle,#fff 0%,#ffd24a 45%,#ff7a3d 100%);
  box-shadow:0 0 8px rgba(255,190,80,.9); animation:wd-zspark .6s ease-out forwards; }
@keyframes wd-zspark{ 0%{ transform:translate(0,0) scale(1); opacity:1; } 100%{ transform:translate(var(--dx,0),var(--dy,0)) scale(.2); opacity:0; } }
/* 冲击波光环 */
.wd-zombie-ring{ position:absolute; z-index:4; width:18px; height:18px; margin-left:-9px; margin-top:-9px; border-radius:50%; pointer-events:none;
  border:2px solid rgba(255,220,120,.95); animation:wd-zring .48s ease-out forwards; }
@keyframes wd-zring{ 0%{ transform:scale(.35); opacity:1; } 100%{ transform:scale(3.6); opacity:0; border-width:1px; } }
/* 连击提示 */
.wd-zombie-combo{ position:absolute; z-index:6; transform:translateX(-50%); color:#ff7a3d; font-weight:800; font-size:14px; white-space:nowrap; text-shadow:0 1px 5px #000; pointer-events:none; animation:wd-zcombo .8s ease-out forwards; }
@keyframes wd-zcombo{ 0%{ opacity:0; transform:translate(-50%,6px) scale(.7); } 25%{ opacity:1; transform:translate(-50%,-4px) scale(1.15); } 100%{ opacity:0; transform:translate(-50%,-34px) scale(1); } }
/* 飘分 */
.wd-zombie-pop{ position:absolute; z-index:5; transform:translateX(-50%); color:#ffd24a; font-weight:800; font-size:16px; text-shadow:0 1px 4px #000; pointer-events:none; animation:wd-zpop .65s ease-out forwards; }
@keyframes wd-zpop{ 0%{ opacity:0; transform:translate(-50%,4px); } 20%{ opacity:1; } 100%{ opacity:0; transform:translate(-50%,-26px); } }
/* toast */
.wd-zombie-toast{ position:absolute; left:50%; top:42%; transform:translate(-50%,-50%); z-index:6; padding:10px 18px; border-radius:999px; background:rgba(39,174,96,.92); color:#fff; font-weight:800; font-size:14px; white-space:nowrap; box-shadow:0 6px 22px rgba(0,0,0,.4); animation:wd-ztoast 1.4s ease-in-out forwards; }
@keyframes wd-ztoast{ 0%{ opacity:0; transform:translate(-50%,-30%); } 15%,75%{ opacity:1; transform:translate(-50%,-50%); } 100%{ opacity:0; transform:translate(-50%,-65%); } }
/* 提示语 */
.wd-zombie-tip{ text-align:center; color:var(--sub-text); font-size:13px; margin:10px 0 8px; line-height:1.6; }
/* 植物托盘 */
.wd-zombie-tray{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:4px; perspective:600px; }
.wd-zombie-plant{ flex:1 1 auto; min-width:92px; background:var(--card,#fff); border:2px solid var(--border,#e3e6ef); border-radius:12px; padding:10px 8px 12px; font-size:15px; font-weight:700; color:var(--text); text-align:center; cursor:pointer; transition:border-color .15s,background .15s,box-shadow .15s,transform .15s; white-space:normal; line-height:1.35; display:flex; flex-direction:column; align-items:center; gap:3px; }
.wd-zombie-plant-ico{ font-size:19px; line-height:1; animation:wd-zsway 2.4s ease-in-out infinite; transform-origin:50% 100%; }
@keyframes wd-zsway{ 0%,100%{ transform:rotate(-5deg); } 50%{ transform:rotate(5deg); } }
.wd-zombie-plant-tx{ display:block; }
.wd-zombie-plant:hover{ border-color:var(--accent); background:rgba(102,126,234,.08); transform:translateY(-2px); }
.wd-zombie-plant.sel{ border-color:var(--accent); background:var(--chip-bg); color:var(--accent); box-shadow:0 0 0 3px rgba(102,126,234,.3); }
.wd-zombie-plant.sel .wd-zombie-plant-ico{ animation-duration:.7s; }
/* 选中瞬间“拔起”反馈 */
.wd-zombie-plant.pick{ animation:wd-zpick .32s ease-out; }
@keyframes wd-zpick{ 0%{ transform:translateY(0) scale(1); } 45%{ transform:translateY(-7px) scale(1.06); } 100%{ transform:translateY(0) scale(1); } }
/* ★ 自动换位：整排植物翻牌式落位，位置每几秒变一次，答案不会长在最左 */
.wd-zombie-plant.swap{ animation:wd-zswap .5s cubic-bezier(.34,1.36,.64,1) both; }
@keyframes wd-zswap{
  0%{ opacity:0; transform:translateY(16px) rotateX(-70deg) scale(.9); }
  55%{ opacity:1; transform:translateY(-4px) rotateX(8deg) scale(1.03); }
  100%{ opacity:1; transform:translateY(0) rotateX(0) scale(1); } }

/* 介绍页 / 结算页（复用 battle 视觉） */
.wd-zombie-intro{ max-width:560px; margin:18px auto; background:var(--card-bg); border:1px solid var(--border-strong,#333); border-radius:16px; padding:26px 22px; text-align:center; box-shadow:var(--shadow); }
.wd-zombie-intro-emoji{ font-size:52px; }
.wd-zombie-intro-title{ font-size:20px; font-weight:800; color:var(--text); margin:8px 0 12px; }
.wd-zombie-intro-desc{ color:var(--sub-text); font-size:14px; line-height:1.7; margin-bottom:14px; }
.wd-zombie-modes{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin:4px 0 16px; }
.wd-zombie-mode-card{ background:var(--card-bg); border:1px solid var(--border); border-radius:14px; padding:16px 12px; display:flex; flex-direction:column; align-items:center; gap:6px; box-shadow:var(--shadow); }
.wd-zombie-mode-emoji{ font-size:34px; line-height:1; }
.wd-zombie-mode-name{ font-size:15px; font-weight:800; color:var(--text); }
.wd-zombie-mode-desc{ font-size:12.5px; color:var(--sub-text); line-height:1.6; }
.wd-zombie-mode-hi{ font-size:13px; color:var(--accent); font-weight:700; }
.wd-zombie-mode-card .btn{ margin-top:4px; }
.wd-zombie-rules{ text-align:left; list-style:none; padding:0; margin:0 0 16px; display:flex; flex-direction:column; gap:9px; }
.wd-zombie-rules li{ background:rgba(39,174,96,.08); border:1px solid rgba(39,174,96,.2); border-radius:10px; padding:10px 12px; font-size:14px; color:var(--text); }
.wd-zombie-result{ max-width:560px; margin:18px auto; }
.wd-zombie-result .btn{ margin:6px; }
.wd-zombie-rec-spk{ background:rgba(102,126,234,.14); color:var(--accent); border:1px solid rgba(102,126,234,.3); border-radius:50%; width:30px; height:30px; cursor:pointer; font-size:14px; flex:0 0 auto; }
.wd-zombie-rec-spk:hover{ background:rgba(102,126,234,.26); }

/* 移动端适配已统一收口到 static/css/mobile.css（8b 节），此处不重复写 @media。
   系统开启“减少动态效果”时，只保留必要反馈，避免晃眼 */
@media (prefers-reduced-motion:reduce){
  .wd-zombie-face,.wd-zombie-plant-ico{ animation:none !important; }
  .wd-zombie-stage.wd-zombie-shake,.wd-zombie-plant.swap,.wd-zombie-plant.pick{ animation:none !important; }
}
