/* ==================================================================
* TeachAny · 标准 TTS 朗读悬浮控制器（v7.7.4）
* —— 基于浏览器原生 Web Speech API，零音频文件、零配置即可通读全文
* 使用：只需在 `` 相应段落上标注 `data-tts="section-key"`，
* 并可选提供 `./narration.json` 做高质量文稿覆盖。
* 用法（HTML）：
*
*
*
* ================================================================== */
.tts-narrator-host {
position: fixed;
/* 位置由 teachany-floating-dock.css 统一堆叠 */
right: 20px;
bottom: 20px;
z-index: 9996;
display: flex;
align-items: center;
gap: 6px;
padding: 8px 14px;
background: #ffffff;
border: 1px solid #e2e8f0;
border-radius: 999px;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
"Microsoft YaHei", sans-serif;
user-select: none;
transition: bottom 0.25s ease, opacity 0.2s;
}
/* 抬升规则见 teachany-floating-dock.css */
@media (max-width: 640px) {
.tts-narrator-host {
padding: 6px 10px;
gap: 4px;
}
}
.tts-narrator-host button {
background: transparent;
border: none;
cursor: pointer;
font-size: 18px;
padding: 4px 8px;
line-height: 1;
color: #1f2937;
border-radius: 6px;
transition: background 0.15s, color 0.15s;
}
.tts-narrator-host button:hover {
background: #f3f4f6;
color: #7c3aed;
}
.tts-narrator-host button:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.tts-narrator-host .ttsn-status {
font-size: 11px;
color: #64748b;
min-width: 90px;
max-width: 180px;
text-align: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
padding: 0 4px;
}
.tts-narrator-host .ttsn-rate {
font-size: 11px;
color: #7c3aed;
font-weight: 600;
padding: 0 4px;
}
.tts-narrator-host .ttsn-rate:hover {
color: #5b21b6;
}
/* 标签高亮（朗读中的段落） */
.tts-narrator-active {
background: linear-gradient(
180deg,
transparent 60%,
rgba(251, 191, 36, 0.28) 60%
);
transition: background 0.3s ease;
border-radius: 4px;
}
/* 折叠按钮 */
.tts-narrator-host .ttsn-collapse {
font-size: 14px;
color: #9ca3af;
margin-left: 2px;
}
.tts-narrator-host.collapsed {
padding: 6px 10px;
}
.tts-narrator-host.collapsed .ttsn-mid {
display: none;
}