/* ===== 单词卡片 ===== */
.word-card{background:rgba(255,255,255,0.85);backdrop-filter:blur(15px);border:3px solid #ffd700;border-radius:40px;padding:0.2rem 1.5rem;margin-bottom:1rem;box-shadow:0 15px 30px rgba(0,0,0,0.1);position:relative;overflow:hidden;text-align:center;}

/* ===== 音标（在英文单词上方）- 统一粗体 ===== */
.phonetic-display{text-align:center;font-size:2.8rem;font-weight:700;color:#4a90e2;font-family:'Courier New',monospace;margin:30px auto 0.5rem auto;display:block;width:100%;line-height:1.3;opacity:0;}

/* ===== 英文单词 ===== */
.english-word{text-align:center;font-size:3.6rem;font-weight:700;color:#FF6666;margin-bottom:0.8rem;letter-spacing:1px;line-height:1.3;}
.english-word .letter{display:inline-block;opacity:0;transition:opacity 1s ease-in-out;font-size:3.6rem;}
.english-word .letter.show{opacity:1 !important;}

/* ===== 单词图片图标 ===== */
.word-emoji{text-align:center;font-size:5rem;margin:-20px 0 10px 0;opacity:0;transition:opacity 1s ease-in-out;min-height:80px;}

/* ===== 中文释义 ===== */
.chinese-meaning{text-align:center;font-size:2.4rem;font-weight:500;color:#4a3b4a;margin-bottom:1.5rem;line-height:1.3;opacity:0;transition:opacity 1s ease-in-out;}

/* ===== 中文释义（拼字母游戏专用） ===== */
.chinese-meaning-puzzle{text-align:center;font-size:2rem;font-weight:500;color:#333333;margin-top:-70px;margin-bottom:1.5rem;line-height:1.3;}

/* ===== 喇叭按钮 ===== */
.喇叭方框{display:flex;align-items:center;justify-content:center;padding:12px 20px;border:3px solid #1E88E5;border-radius:50px;background-color:rgba(30,136,229,0.9);box-shadow:0 4px 0 #0D47A1;width:fit-content;min-width:80px;margin:40px auto 0px auto;opacity:0;transition:opacity 3s ease-in-out;pointer-events:none;}
.喇叭方框.show{opacity:1;pointer-events:auto;}
.喇叭图标{font-size:2.8rem;color:#FFFFFF;cursor:pointer;transition:transform 0.2s;}
.喇叭图标:hover{transform:scale(1.1);}
.喇叭图标:active{transform:scale(0.95);}

/* ===== 提示框容器 ===== */
.提示框容器{height:180px;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;}

/* ===== 提示文字方框 ===== */
.文字方框{display:flex;align-items:center;justify-content:center;padding:8px 25px;border:3px solid #FFB347;border-radius:50px;background-color:rgba(255,249,196,0.7);box-shadow:0 4px 0 #E69500;min-width:220px;opacity:0;transition:opacity 0.3s ease-in-out;pointer-events:none;position:absolute;top:30%;left:50%;transform:translate(-50%, -50%);}
.文字方框.show{opacity:1;}
.文字方框.hidden{opacity:0;visibility:hidden;}
.提示文字{font-size:2rem;font-weight:700;color:#B45F2E;white-space:nowrap;text-shadow:1px 1px 0 #FFE5B4;}

/* ===== 赞助商区域 ===== */
.sponsor-area{position:absolute;top:-60px;left:50%;transform:translate(-50%, -50%);width:100%;box-sizing:border-box;margin:0;padding:0;opacity:0;transition:opacity 6s ease-in-out;}
.sponsor-area.show{opacity:1;}

/* ===== 继续前进按钮 ===== */
.继续前进按钮{position:absolute;top:20%;left:50%;transform:translate(-50%, -50%);cursor:pointer;font-size:2rem;padding:10px 30px;background:#4CAF50;color:white;border-radius:50px;border:3px solid #2E7D32;box-shadow:0 5px 0 #1B5E20;width:auto;min-width:180px;font-weight:bold;opacity:0;transition:opacity 6s ease-in-out;pointer-events:none;white-space:nowrap;text-align:center;}
.继续前进按钮.show{opacity:1;pointer-events:auto;}
.继续前进按钮:hover{transform:translate(-50%, -52%);box-shadow:0 7px 0 #1B5E20;background:#5fdd64;}

/* ===== 拼字母游戏 - 备选按钮 ===== */
.letter-btn{width:70px;height:70px;font-size:3rem;font-weight:bold;background:linear-gradient(145deg,#e8f4f8,#d0e8f0);border:2px solid #ffd700;border-radius:20px;cursor:pointer;transition:all 0.2s;color:#336699;}
.letter-btn:hover{transform:scale(1.05);background:#ffd700;color:white;}
.letter-btn.used{opacity:0.3;transform:scale(0.95);cursor:not-allowed;background:#ccc;}

/* ===== 答案输入框 ===== */
.answer-input{width:100%;padding:30px;font-size:4em;text-align:center;border:2px solid #ffd700;border-radius:50px;background:white;margin:15px 0;font-weight:bold;color:#ff6b6b;}

/* ===== 字母网格 ===== */
.letters-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:20px 0 50px 0;}

/* ===== 消息区域（桌面版） ===== */
.message-area{text-align:center;padding:15px;margin:15px 0;border-radius:30px;font-size:1.2rem;}
.message-area.success{background:#e0f7fa;color:#006064;border:2px solid #00bcd4;}
/* 错误提示 - 桌面版（大字体、大方框） */
.message-area.error{background:#f8d7da;color:#721c24;border:2px solid #dc3545;font-size:2rem;padding:20px 30px;min-width:300px;text-align:center;margin-top:-40px;}
.correct-word{font-size:3rem;font-weight:bold;margin-bottom:10px;color:#ff0000;}
.success-title{font-size:1.8rem;}

/* ===== 麦克风按钮 ===== */
.麦克风方框{display:flex;align-items:center;justify-content:center;padding:12px 20px;border:3px solid #0066CC;border-radius:50px;background-color:#4da6ff;box-shadow:0 4px 0 #004C99;width:fit-content;min-width:80px;margin:15px auto;cursor:pointer;transition:all 0.2s;}
.麦克风方框:hover{transform:translateY(-2px);box-shadow:0 6px 0 #004C99;background-color:#66b3ff;}
.麦克风图标{font-size:2.8rem;color:white;cursor:pointer;transition:transform 0.2s;text-shadow:1px 1px 0 rgba(0,0,0,0.2);}
.麦克风图标:hover{transform:scale(1.1);}
.麦克风图标.recording{animation:pulse 1.5s infinite;color:#FFD700;}
@keyframes pulse{0%{transform:scale(1);}50%{transform:scale(1.1);}100%{transform:scale(1);}}

/* ===== 提示文字框（备用） ===== */
.提示文字方框{display:flex;align-items:center;justify-content:center;padding:12px 25px;border:3px solid #FFB347;border-radius:50px;background-color:rgba(255,249,196,0.7);box-shadow:0 4px 0 #E69500;width:fit-content;min-width:160px;margin:15px auto;box-sizing:border-box;}
.提示文字内容{font-size:2rem;font-weight:700;color:#B45F2E;white-space:nowrap;text-shadow:1px 1px 0 #FFE5B4;}

/* ===== 录音中状态 ===== */
.录音中方框{display:flex;align-items:center;justify-content:center;padding:12px 25px;border:3px solid #FF3333;border-radius:50px;background-color:rgba(255,200,200,0.7);box-shadow:0 4px 0 #CC0000;width:fit-content;min-width:160px;margin:15px auto;box-sizing:border-box;}
.录音中文字{font-size:2rem;font-weight:700;color:#FF3333;white-space:nowrap;text-shadow:1px 1px 0 #FFE5B4;animation:textPulse 1.5s infinite;}
@keyframes textPulse{0%{opacity:0.8;}50%{opacity:1;}100%{opacity:0.8;}}

/* ===== 状态容器 ===== */
.status-container{min-height:120px;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;}

/* ===== 拼字母游戏中文提示（旧版兼容） ===== */
.chinese-hint{font-size:2rem;font-weight:600;color:#333333;margin-bottom:1rem;text-align:center;}

/* ===== 金币落下动画 ===== */
.coin-rain{position:relative;width:100%;height:160px;overflow:hidden;margin:0px 0 5px 0;pointer-events:none;display:flex;justify-content:center;align-items:flex-start;}
.gold1,.gold2,.gold3{position:absolute;width:52px;height:52px;background:radial-gradient(circle at 30% 30%,#ffd700,#b8860b);border-radius:50%;box-shadow:0 0 35px gold;left:50%;transform:translateX(-50%);animation:fall 2.2s infinite;opacity:0;}
.gold1{width:46px;height:46px;animation-delay:0s;top:-5px;}
.gold2{width:52px;height:52px;animation-delay:0.4s;top:-8px;}
.gold3{width:42px;height:42px;animation-delay:0.8s;top:-2px;}
@keyframes fall{0%{transform:translateX(-50%) translateY(-20px) rotate(0deg);opacity:0;}20%{opacity:1;transform:translateX(-50%) translateY(0) rotate(180deg);}60%{opacity:1;transform:translateX(-50%) translateY(65px) rotate(360deg);}100%{transform:translateX(-50%) translateY(130px) rotate(540deg);opacity:0;}}

/* ===== 金币显示 ===== */
.coin-display{display:flex;align-items:center;gap:1rem;font-size:2rem;}
.coin-icon{font-size:3.5rem;animation:coinSpin 3s infinite linear;}
@keyframes coinSpin{0%{transform:rotateY(0deg);}50%{transform:rotateY(180deg);}100%{transform:rotateY(360deg);}}
.coin-amount{font-size:3rem;font-weight:700;color:#ffd700;}

/* ===== 成功消息 ===== */
.success-message{font-size:3rem;font-weight:700;color:#FF3333;}
.total-coins-message{font-size:2.8rem;font-weight:700;color:#ffd700;text-shadow:1px 1px 0 #B45F2E;background:rgba(255,249,196,0.7);padding:15px 35px;border-radius:60px;border:3px solid #FFB347;box-shadow:0 6px 0 #E69500;margin:8px 0;}

/* ===== 例句翻译 ===== */
.example-sentence{font-size:2.4rem;font-weight:600;color:#4a3b4a;margin-top:20px;margin-bottom:1.2rem;line-height:1.3;word-break:break-word;}
.translation-bracket{min-height:80px;margin:1.2rem 0 1.5rem 0;padding:1rem;border:3px solid #FFB347;border-radius:50px;background-color:rgba(255,249,196,0.7);box-shadow:0 4px 0 #E69500;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:5px;}
.translation-text{font-size:2.8rem;font-weight:700;animation:fadeIn 0.5s ease;color:#FF3333;}
@keyframes fadeIn{from{opacity:0;transform:translateY(-10px);}to{opacity:1;transform:translateY(0);}}

/* ===== 组词游戏 ===== */
.words-container{min-height:70px;margin:1.2rem 0 1.5rem 0;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;}
.word-option{display:inline-flex;align-items:center;justify-content:center;padding:8px 20px;border:3px solid #9B59B6;border-radius:50px;background-color:#9B59B6;box-shadow:0 4px 0 #6C3483;font-size:2rem;font-weight:700;color:white;cursor:pointer;transition:all 0.2s;}
.word-option:hover{transform:translateY(-2px);box-shadow:0 6px 0 #6C3483;background-color:#AE7AC7;}

/* ===== 按钮组 ===== */
.button-group{display:flex;justify-content:center;gap:2rem;margin:1rem 0 0.5rem 0;flex-wrap:wrap;}
.decode-btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 35px;border:3px solid #0066CC;border-radius:60px;background-color:#4da6ff;box-shadow:0 6px 0 #004C99;font-size:2.2rem;font-weight:700;color:white;cursor:pointer;transition:all 0.2s;text-decoration:none;min-width:140px;}
.decode-btn:hover{transform:translateY(-3px);box-shadow:0 9px 0 #004C99;background-color:#66b3ff;}

/* ===== 隐藏类 ===== */
.hidden{display:none !important;}

/* ===== 目标阵地选择页面专用样式 ===== */
.group-title{margin:1.5rem 0 0.8rem 0;display:flex;justify-content:flex-start;overflow:hidden;width:100%;}
.red-flag{font-size:3rem;display:inline-block;animation:flagMoveLeft 3s infinite linear;filter:drop-shadow(0 5px 10px rgba(255,0,0,0.3));white-space:nowrap;}
@keyframes flagMoveLeft{0%{transform:translateX(100%);opacity:0;}10%{opacity:1;}90%{opacity:1;}100%{transform:translateX(-100%);opacity:0;}}
.card-a .card-title{color:#FF6600 !important;}.card-a .card-icon{color:#FF6600 !important;filter:drop-shadow(0 10px 15px rgba(255,102,0,0.3));}
.card-b .card-title{color:#0066CC !important;}.card-b .card-icon{color:#00AA00 !important;filter:drop-shadow(0 10px 15px rgba(0,170,0,0.3));}
.group-divider{width:100%;height:2px;background:linear-gradient(90deg,transparent,#ffd700,#ff7b9c,#ffd700,transparent);margin:1rem 0 1.5rem;opacity:0.5;}
.提示框容器 {
    position: relative;
    min-height: 180px;
}

.sponsor-area {
    position: relative;
    clear: both;
}

/* ===== 手机版响应式样式 ===== */
@media(max-width:480px){
    /* 音标 - 统一粗体 + 等宽字体 */
.phonetic-display{font-size:2.5rem;font-weight:700;padding:0.5rem;width:100%;margin:30px auto 0 auto;display:block;white-space:normal;word-break:break-all;text-align:center;box-sizing:border-box;line-height:1.3;font-family:'Courier New',monospace;font-variant-ligatures:none;font-feature-settings:"liga" 0;text-rendering:optimizeSpeed;}
    /* 单词图片图标 */
    .word-emoji{font-size:4rem;}
    /* 中文释义 */
    .chinese-meaning{font-size:2rem;}
    /* 中文释义（拼字母游戏专用） */
    .chinese-meaning-puzzle{margin-top:20px;}
    /* 备选字母按钮 */
    .letter-btn{width:75px;height:75px;font-size:3.5rem;}
    /* 输入框 */
    .answer-input{font-size:4rem;padding:25px 15px;width:95%;margin:0 auto;display:block;}
    /* 字母网格 */
    .letters-grid{gap:12px;margin:20px 0 50px 0;}
    /* 单词卡片 - 减少内边距 */
    .word-card{padding:0.2rem 0.5rem;}
    /* 正确单词 */
    .correct-word{font-size:2.5rem;}
    /* 成功标题 */
    .success-title{font-size:1.5rem;}
    /* 金币图标 */
    .coin-icon{font-size:3rem;}
    /* 金币数量 */
    .coin-amount{font-size:2.5rem;}
    /* 成功消息 */
    .success-message{font-size:2.6rem;}
    /* 总金币消息 */
    .total-coins-message{font-size:2.4rem;padding:12px 28px;}
    /* 例句 */
    .example-sentence{font-size:2rem;margin-top:20px;}
    /* 翻译文本 */
    .translation-text{font-size:2.4rem;}
    /* 单词选项 */
    .word-option{font-size:1.6rem;padding:6px 15px;}
    /* 解码按钮 */
    .decode-btn{font-size:1.8rem;padding:10px 25px;min-width:120px;}
    /* 提示文字 */
    .提示文字{font-size:1.8rem;}
    /* 继续前进按钮 */
    .继续前进按钮{font-size:1.6rem;padding:8px 25px;min-width:150px;}
    /* 赞助商区域 */
    .sponsor-area{min-height:60px;}
    /* 错误提示消息框 */
    .message-area.error{font-size:2rem;padding:15px 25px;min-width:220px;text-align:center;margin-top:-30px;}
    .message-area .correct-word{font-size:2.8rem;}
    .message-area .success-title{font-size:2rem;}
    /* 成功提示消息框 */
    .message-area.success{font-size:2rem;padding:20px;width:90%;}
    /* 正确答案显示区域 - 向上移动 */
    #correctAnswerDisplay{position:relative;top:-40px;margin-bottom:-40px;}
    /* 正确答案显示区域 - 内部div */
    #correctAnswerDisplay div{white-space:nowrap;overflow-x:auto;text-align:center;max-width:90vw;padding:10px 10px !important;margin:0px !important;line-height:1.4 !important;height:auto !important;min-height:60px !important;background:#fff3cd;border-radius:15px;}
}