/* 页脚删除后自适应：阻止 body 滚动 + 缩减 main 底部空间 */
/* html,body overflow moved to main.da-page */
main.da-page {
    height: 100dvh;
    padding: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
@media (max-width: 768px) {
    main.da-page { height: 100dvh; padding: 0; display: flex; flex-direction: column; overflow: hidden; }
}

/* 隐藏页脚，最大化对话区域高度 */
footer { display: none !important; }

/* ============================================================
   da-chat.css — 消息气泡 + 思考过程 + 执行面板
   ============================================================ */

@keyframes msgIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.message-row {
    display: flex;
    margin-bottom: 12px;
    animation: msgIn 0.3s ease;
}

.message-row.user { justify-content: flex-end; }
.message-row.ai { justify-content: flex-start; }

.message-bubble {
    display: flex;
    gap: 8px;
    max-width: 82%;
    align-items: flex-start;
}

.message-row.user .message-bubble { flex-direction: row-reverse; }

.msg-avatar {
    width: 30px; height: 30px;
    border-radius: 50%;
    flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    overflow: hidden;
    margin-top: 1px;
}

.user-avatar { background: linear-gradient(135deg, #6366f1, #8b5cf6); }
[data-theme=light] .user-avatar { background: linear-gradient(135deg, #818cf8, #a78bfa); }
.ai-avatar { background: var(--da-bg-tertiary); border: 1px solid var(--da-border); }

.msg-avatar img { width: 100%; height: 100%; object-fit: cover; }
.msg-avatar svg { width: 16px; height: 16px; }

.msg-card {
    padding: 10px 14px;
    font-size: 14px;
    line-height: 1.6;
    border-radius: 14px;
    word-wrap: break-word;
    overflow-wrap: break-word;
    min-width: 0;
}

.message-row.user .msg-card {
    background: linear-gradient(135deg, #6366f1, #7c3aed);
    color: #ffffff;
    border-bottom-right-radius: 4px;
    box-shadow: 0 2px 8px rgba(99,102,241,0.3);
}
[data-theme=light] .message-row.user .msg-card {
    background: linear-gradient(135deg, #EEF2FF, #F3EEFF);
    color: #4f46e5;
    box-shadow: 0 1px 4px rgba(99, 102, 241, 0.12);
}

.message-row.ai .msg-card {
    background: var(--da-ai-bubble-bg);
    color: var(--da-text-primary);
    border: 1px solid var(--da-ai-bubble-border);
    border-bottom-left-radius: 4px;
    box-shadow: var(--da-shadow-sm);
}

.msg-card pre {
    background: var(--da-ai-bubble-bg);
    border: 1px solid var(--da-border);
    border-radius: 6px;
    padding: 10px;
    overflow-x: auto;
    margin: 6px 0;
    font-size: 12px;
    line-height: 1.5;
}

.msg-card code {
    font-family: 'SF Mono', 'Fira Code', 'Cascadia Code', monospace;
    font-size: 0.9em;
    background: rgba(255, 255, 255, 0.06);
    padding: 1px 4px;
    border-radius: 4px;
}

.msg-card pre code { background: none; padding: 0; }
.msg-card strong { font-weight: 600; }

/* === P25 媒体元素尺寸约束（治"图片占满屏幕"） === */
.msg-card img {
    max-width: 280px;
    max-height: 240px;
    width: auto;
    height: auto;
    border-radius: 8px;
    display: block;
    margin: 4px 0;
    object-fit: cover;
    cursor: zoom-in;
}
.msg-card video {
    max-width: 320px;
    max-height: 240px;
    width: auto;
    height: auto;
    border-radius: 8px;
    display: block;
    margin: 4px 0;
}
.msg-card .attachment,
.msg-card .msg-attachment {
    max-width: 360px;
    border-radius: 8px;
    padding: 8px 10px;
    margin: 4px 0;
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 6px;
    background: rgba(99, 102, 241, 0.06);
    border: 1px solid rgba(99, 102, 241, 0.18);
}
.msg-card img + img,
.msg-card video + video,
.msg-card img + video,
.msg-card video + img {
    margin-top: 6px;
}

/* --- 思考过程折叠块 --- */
.thinking-block {
    margin-top: 4px;
    border: 1px solid rgba(148,163,184,0.18);
    border-radius: 8px;
    overflow: hidden;
    background: rgba(148,163,184,0.03);
}

.thinking-block .thinking-header {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    cursor: pointer;
    font-size: 11px;
    color: var(--da-text-secondary);
    user-select: none;
    transition: background 0.15s;
}

.thinking-block .thinking-header:hover { background: rgba(148,163,184,0.06); }

.thinking-block .thinking-arrow {
    transition: transform 0.15s;
    font-size: 9px;
    flex-shrink: 0;
}

.thinking-block.open .thinking-arrow { transform: rotate(90deg); }

.thinking-block .thinking-body {
    display: none;
    padding: 6px 10px 10px;
    font-size: 11px;
    color: var(--da-text-secondary);
    line-height: 1.5;
    border-top: 1px solid rgba(148,163,184,0.08);
}

.thinking-block.open .thinking-body { display: block; }

.thinking-block .thinking-body ul { list-style: none; padding: 0; }

.thinking-block .thinking-body li {
    padding: 2px 0 2px 14px;
    position: relative;
}

.thinking-block .thinking-body li::before {
    content: '\2022';
    position: absolute;
    left: 3px;
    color: var(--da-accent-indigo);
}

/* --- 思考步骤面板 (消息区) --- */
#thinkingIndicator .msg-body { padding: 6px 12px; }
#thinkingIndicator .thinking-block { border: 1px solid rgba(99,102,241,0.15); background: rgba(99,102,241,0.02); margin: 0; }
#thinkingIndicator .thinking-header { font-size: 12px; font-weight: 500; color: #6366F1; }
#thinkingIndicator .thinking-step-icon { font-size: 13px; }
#thinkingIndicator .thinking-dots { display: inline-flex; gap: 3px; margin-left: 6px; vertical-align: middle; }
#thinkingIndicator .thinking-dots span {
    width: 4px; height: 4px; background: #6366F1; border-radius: 50%;
    animation: thinkingBounce 1.2s infinite ease-in-out;
}
#thinkingIndicator .thinking-dots span:nth-child(2) { animation-delay: 0.2s; }
#thinkingIndicator .thinking-dots span:nth-child(3) { animation-delay: 0.4s; }
#thinkingIndicator .thinking-body li { padding: 3px 0 3px 16px; font-size: 11px; color: #64748B; }
#thinkingIndicator .thinking-body li::before { content: none; }
#thinkingIndicator .step-icon { margin-right: 4px; font-size: 12px; }

/* --- 思考指示器 --- */
.thinking-indicator {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 14px;
    font-size: 13px;
    color: var(--da-text-secondary);
    background: var(--da-ai-bubble-bg);
    border: 1px solid var(--da-ai-bubble-border);
    border-radius: 10px;
    max-width: fit-content;
}

@keyframes dotBounce {
    0%, 80%, 100% { transform: scale(0.5); opacity: 0.3; }
    40% { transform: scale(1); opacity: 1; }
}

.thinking-dots { display: flex; gap: 3px; }
.thinking-dots span {
    width: 5px; height: 5px;
    background: var(--da-accent-indigo);
    border-radius: 50%;
    animation: dotBounce 1.2s infinite ease-in-out;
}
.thinking-dots span:nth-child(2) { animation-delay: 0.2s; }
.thinking-dots span:nth-child(3) { animation-delay: 0.4s; }

/* --- 执行步骤面板 --- */
.execution-panel {
    display: none;
    padding: 8px 12px;
    margin: 0 0 4px;
    background: var(--da-bg-secondary);
    border: 1px solid var(--da-border);
    border-radius: 8px;
    flex-shrink: 0;
    max-height: 160px;
    overflow-y: auto;
}

.execution-panel.show { display: block; }

.execution-panel .exec-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    color: var(--da-text-secondary);
    margin-bottom: 4px;
}

.execution-panel .exec-step {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 0;
    font-size: 12px;
    color: var(--da-text-primary);
}

.exec-step .step-icon { font-size: 12px; flex-shrink: 0; }
.exec-step .step-icon.done { color: var(--da-accent-green); }

@keyframes stepSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.exec-step .step-icon.running { color: var(--da-accent-blue); animation: stepSpin 1s linear infinite; }
.exec-step .step-icon.pending { color: var(--da-text-secondary); opacity: 0.35; }
.exec-step .step-icon.failed { color: var(--da-accent-red); }
/* P2-11: Markdown 表格样式 */
.md-table {
    width: 100%; border-collapse: collapse; margin: 6px 0;
    font-size: 12px; border: 1px solid var(--da-border); border-radius: 6px; overflow: hidden;
}
.md-table th {
    background: var(--da-bg-tertiary); color: var(--da-text-primary);
    padding: 5px 8px; text-align: left; font-weight: 600; font-size: 11px; border-bottom: 1px solid var(--da-border);
}
.md-table td { padding: 4px 8px; border-bottom: 1px solid rgba(148,163,184,0.08); color: var(--da-text-primary); }
.md-table tr:last-child td { border-bottom: none; }

/* P2-11: 有序列表样式 */
.msg-card ol { padding-left: 20px; margin: 4px 0; }
.msg-card ol li { padding: 1px 0; }

/* P2-11: 引用块样式 */
.msg-card blockquote {
    margin: 4px 0; padding: 6px 10px;
    border-left: 3px solid var(--da-accent-indigo);
    background: rgba(99,102,241,0.04); border-radius: 0 4px 4px 0;
    color: var(--da-text-secondary); font-size: 0.95em;
}

/* Light theme: inline code — use dark tint instead of white */
[data-theme=light] .msg-card code {
    background: rgba(0, 0, 0, 0.05);
}
/* Light theme: blockquote — subtler indigo tint */
[data-theme=light] .msg-card blockquote {
    background: rgba(99, 102, 241, 0.03);
}

/* ============================================
   TTS 语音朗读按钮（豆包风格）
   ============================================ */
.tts-speaker {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--da-text-tertiary);
    padding: 3px 6px;
    margin-top: 3px;
    border-radius: 6px;
    opacity: 0;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
}
.tts-speaker svg { width: 15px; height: 15px; }
.message-row.ai:hover .tts-speaker { opacity: 0.5; }
.tts-speaker:hover { opacity: 1 !important; color: var(--da-accent); background: rgba(99,102,241,0.1); }
.tts-speaker.tts-active {
    opacity: 1 !important;
    color: #6366f1;
    animation: ttsPulse 0.8s ease-in-out infinite;
}

/* P37: Paused state — solid play icon, no pulse, slightly muted */
.tts-speaker.tts-paused {
    opacity: 1 !important;
    color: var(--da-accent);
    animation: none;
}
@keyframes ttsPulse {
    0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(99,102,241,0.4); }
    50% { transform: scale(1.1); box-shadow: 0 0 0 4px rgba(99,102,241,0); }
}
/* 播放中整个消息行的微动 */
.message-row.tts-playing .msg-card {
    box-shadow: 0 0 12px rgba(99,102,241,0.15);
    transition: box-shadow 0.3s;
}

/* ============================================
   豆包风格 4 按钮组（朗读/复制/分享/收藏）
   ============================================ */
.msg-actions {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-top: 4px;
    opacity: 1;  /* P34: 外显，无需hover */
    transition: opacity 0.2s ease;
}
.message-row.ai:hover .msg-actions { opacity: 1; }
.msg-action-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--da-text-tertiary);
    padding: 4px 6px;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    transition: all 0.15s ease;
}
.msg-action-btn:hover {
    color: var(--da-accent);
    background: rgba(99,102,241,0.1);
}
.msg-action-btn svg { width: 15px; height: 15px; }
/* P34: TTS button in msg-actions must NOT inherit the standalone .tts-speaker opacity:0 */
.msg-actions .tts-speaker { opacity: 1 !important; }
.msg-action-btn.faved {
    color: #f59e0b;
    background: rgba(245,158,11,0.1);
}
.msg-action-btn.faved:hover { color: #f59e0b; }
/* 移动端：常显（不依赖 hover） */
@media (max-width: 768px) {
    .msg-actions { opacity: 1; } /* P19: 移动端强制清晰 */
}

/* ============================================
   Header 右上角朗读开关（豆包风格）
   视觉差异：开 = 白字 + 紫蓝渐变 + 黄点脉冲；关 = 灰描边 + 静音图标
   ============================================ */
.da-header-btn.tts-autoplay {
    position: relative;
    transition: all 0.2s ease;
}
.da-header-btn.tts-autoplay .tts-icon-on { display: none; }
.da-header-btn.tts-autoplay .tts-icon-off { display: inline-block; }
.da-header-btn.tts-autoplay.tts-autoplay-on .tts-icon-on { display: inline-block; }
.da-header-btn.tts-autoplay.tts-autoplay-on .tts-icon-off { display: none; }
.da-header-btn.tts-autoplay.tts-autoplay-on {
    color: #ffffff !important;
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%) !important;
    box-shadow: 0 0 0 1px rgba(99,102,241,0.4), 0 2px 8px rgba(99,102,241,0.35);
}
.da-header-btn.tts-autoplay.tts-autoplay-on::after {
    content: '';
    position: absolute;
    top: 4px;
    right: 4px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #fbbf24;
    box-shadow: 0 0 6px rgba(251,191,36,0.9);
    animation: ttsDotPulse 1.2s ease-in-out infinite;
}
@keyframes ttsDotPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(0.85); }
}
[data-theme=light] .da-header-btn.tts-autoplay.tts-autoplay-on {
    color: #ffffff !important;
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
    box-shadow: 0 0 0 1px rgba(79,70,229,0.5), 0 2px 8px rgba(79,70,229,0.25);
}
/* ============================================
   "+" 按钮圆形 + 号样式 — P41 cleanup
   ============================================ */

/* ============================================
   弹层：遮罩 + 主面板（豆包风格，从底部弹起）
   ============================================ */
.attach-panel-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 89;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
}
.attach-panel-overlay.show {
    opacity: 1;
    pointer-events: auto;
}
.attach-panel {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: 100px;
    z-index: 90;
    background: var(--da-bg-primary, #1e293b);
    border: 1px solid var(--da-border, rgba(148,163,184,0.2));
    border-radius: 16px;
    padding: 14px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.35);
    transform: translateY(20px);
    opacity: 0;
    pointer-events: none;
    transition: all 0.2s ease;
    max-height: 70vh;
    overflow-y: auto;
}
.attach-panel.show {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}
[data-theme=light] .attach-panel {
    background: #ffffff;
    box-shadow: 0 8px 32px rgba(0,0,0,0.12);
}
.attach-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}
.attach-panel-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--da-text-primary, #e2e8f0);
}
[data-theme=light] .attach-panel-title { color: #0f172a; }
.panel-close-btn {
    background: none;
    border: none;
    color: var(--da-text-tertiary, #94a3b8);
    font-size: 16px;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 6px;
    transition: background 0.15s;
}
.panel-close-btn:hover {
    background: rgba(148,163,184,0.12);
    color: var(--da-text-primary, #e2e8f0);
}

/* 3 按钮横排 */
.attach-panel-actions {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-bottom: 12px;
}
.attach-action-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 12px 8px;
    background: rgba(99,102,241,0.06);
    border: 1px solid rgba(99,102,241,0.18);
    border-radius: 10px;
    color: var(--da-text-primary, #e2e8f0);
    cursor: pointer;
    font-size: 12px;
    transition: all 0.15s;
}
.attach-action-btn:hover {
    background: rgba(99,102,241,0.15);
    border-color: rgba(99,102,241,0.4);
    color: var(--da-accent, #6366f1);
}
[data-theme=light] .attach-action-btn {
    background: #f8fafc;
    border-color: #e2e8f0;
    color: #0f172a;
}
[data-theme=light] .attach-action-btn:hover {
    background: #eef2ff;
    border-color: #6366f1;
}

/* 2×4 照片墙 */
.attach-panel-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    margin-bottom: 8px;
}
.attach-slot {
    aspect-ratio: 1 / 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    background: rgba(148,163,184,0.05);
    border: 1px dashed rgba(148,163,184,0.25);
    border-radius: 10px;
    color: var(--da-text-tertiary, #94a3b8);
    font-size: 10px;
    cursor: pointer;
    transition: all 0.15s;
    overflow: hidden;
    position: relative;
}
.attach-slot:hover {
    border-color: var(--da-accent, #6366f1);
    background: rgba(99,102,241,0.06);
    color: var(--da-accent, #6366f1);
}
.attach-slot.filled {
    border-style: solid;
    border-color: var(--da-accent, #6366f1);
    background: transparent;
}
.attach-slot-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.attach-slot.filled .attach-slot-label {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.6), transparent);
    color: #fff;
    padding: 2px 4px;
    font-size: 9px;
    text-align: center;
}
.attach-slot-label {
    pointer-events: none;
}
[data-theme=light] .attach-slot {
    background: #f8fafc;
    border-color: #cbd5e1;
}
.attach-panel-hint {
    font-size: 11px;
    color: var(--da-text-tertiary, #94a3b8);
    text-align: center;
    margin-top: 6px;
    line-height: 1.4;
}

/* ============================================
   录音 + 附件发送成功 toast
   ============================================ */
.voice-attach-toast {
    position: fixed;
    left: 50%;
    bottom: 130px;
    transform: translateX(-50%);
    background: rgba(15,23,42,0.95);
    color: #fff;
    padding: 8px 16px;
    border-radius: 22px;
    font-size: 13px;
    font-weight: 500;
    box-shadow: 0 6px 20px rgba(0,0,0,0.3);
    z-index: 100;
    opacity: 1;
    transition: opacity 0.3s ease;
    pointer-events: none;
}
[data-theme=light] .voice-attach-toast {
    background: #0f172a;
    color: #fff;
}

/* ============================================
   "+" 圆形按钮（默认 + 号，.open 时切到 x 号）
   ============================================ */
.file-attach-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--da-text-tertiary, #94a3b8);
    padding: 0;
    border-radius: 50%;
    transition: all 0.2s ease;
}
.file-attach-btn:hover {
    color: var(--da-accent, #6366f1);
    background: rgba(99,102,241,0.1);
}
.file-attach-plus {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(99,102,241,0.12);
    color: var(--da-accent, #6366f1);
    transition: all 0.2s ease;
    position: relative;
}
.file-attach-btn:hover .file-attach-plus {
    background: rgba(99,102,241,0.22);
}
[data-theme=light] .file-attach-plus {
    background: rgba(99,102,241,0.10);
}
/* 切换显隐：默认 + 显示，x 隐藏 */
.file-attach-btn .icon-plus { display: inline-flex; }
.file-attach-btn .icon-close { display: none; }
/* 弹层打开时：+ 隐藏，x 显示 + 变红 */
.file-attach-btn.open .icon-plus { display: none; }
.file-attach-btn.open .icon-close {
    display: inline-flex;
    background: rgba(239, 68, 68, 0.18);
    color: #ef4444;
}
.file-attach-btn.open .file-attach-plus {
    background: rgba(239, 68, 68, 0.18);
    color: #ef4444;
}
[data-theme=light] .file-attach-btn.open .file-attach-plus {
    background: rgba(239, 68, 68, 0.12);
    color: #dc2626;
}

/* ============================================
   弹层：遮罩 + 主面板（豆包风格，从底部弹起）
   ============================================ */
.attach-panel-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 89;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
}
.attach-panel-overlay.show {
    opacity: 1;
    pointer-events: auto;
}
.attach-panel {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: 100px;
    z-index: 90;
    background: var(--da-bg-primary, #1e293b);
    border: 1px solid var(--da-border, rgba(148,163,184,0.2));
    border-radius: 16px;
    padding: 14px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.35);
    transform: translateY(20px);
    opacity: 0;
    pointer-events: none;
    transition: all 0.2s ease;
    max-height: 70vh;
    overflow-y: auto;
}
.attach-panel.show {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}
[data-theme=light] .attach-panel {
    background: #ffffff;
    box-shadow: 0 8px 32px rgba(0,0,0,0.12);
}

/* ============================================
   移动端：弹层顶到屏幕顶部（不再遮挡输入栏）
   ============================================ */
@media (max-width: 768px) {
    .attach-panel {
        left: 0;
        right: 0;
        bottom: 0;
        max-height: calc(100dvh - 70px);
        border-radius: 16px 16px 0 0;
        padding: 12px 16px calc(16px + env(safe-area-inset-bottom, 0px));
    }
    .attach-panel-grid {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 8px !important;
    }
    .attach-slot {
        aspect-ratio: 1 / 1 !important;
        width: auto !important;
        height: auto !important;
    }
    .attach-panel-actions {
        gap: 8px !important;
    }
    .attach-action-btn {
        padding: 10px 6px !important;
        font-size: 12px !important;
    }
    .attach-action-btn svg {
        width: 22px !important;
        height: 22px !important;
    }
}

/* ============================================
   粘贴上传 toast
   ============================================ */
.paste-toast {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(99, 102, 241, 0.95);
    color: #fff;
    padding: 10px 18px;
    border-radius: 999px;
    font-size: 13px;
    z-index: 9999;
    box-shadow: 0 4px 16px rgba(99, 102, 241, 0.4);
    animation: pasteToastIn 0.25s ease;
    transition: opacity 0.25s ease;
}
@keyframes pasteToastIn {
    from { opacity: 0; transform: translate(-50%, -10px); }
    to { opacity: 1; transform: translate(-50%, 0); }
}
/* ============================================
   附件缩略图（image-preview-chips）：删除按钮醒目
   ============================================ */
.image-preview-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 12px 8px 12px;
}
.image-preview-chip {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 10px;
    overflow: visible;       /* 让删除按钮溢出可见 */
    background: rgba(99, 102, 241, 0.06);
    border: 1px solid rgba(99, 102, 241, 0.18);
}
.image-preview-chip img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 9px;
    display: block;
}
.image-preview-chip .remove-chip {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #ef4444;
    color: #ffffff;
    border: 2px solid #ffffff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    box-shadow: 0 2px 6px rgba(239, 68, 68, 0.5);
    transition: transform 0.18s ease, background 0.18s ease;
    z-index: 5;
}
.image-preview-chip .remove-chip:hover {
    background: #dc2626;
    transform: scale(1.15) rotate(90deg);
}
.image-preview-chip .remove-chip:active {
    transform: scale(0.92);
}
.image-preview-chip .remove-chip svg {
    width: 12px;
    height: 12px;
    pointer-events: none;
}
[data-theme=light] .image-preview-chip .remove-chip {
    border-color: #ffffff;
    box-shadow: 0 2px 6px rgba(220, 38, 38, 0.4);
}

/* 文件型附件（非图片）缩略图样式 */
.image-preview-chip.file-chip {
    background: linear-gradient(135deg, rgba(99,102,241,0.12) 0%, rgba(139,92,246,0.12) 100%);
    color: var(--da-text-primary, #f1f5f9);
    font-size: 11px;
    flex-direction: column;
    padding: 6px 4px;
    text-align: center;
    word-break: break-all;
    line-height: 1.2;
}
.image-preview-chip.file-chip .file-chip-icon {
    width: 22px;
    height: 22px;
    color: var(--da-accent, #6366f1);
    margin-bottom: 2px;
}
[data-theme=light] .image-preview-chip.file-chip {
    color: #1e293b;
    background: linear-gradient(135deg, rgba(99,102,241,0.08) 0%, rgba(139,92,246,0.08) 100%);
}

/* ============================================
   弹层照片槽彻底移除（用户要求）
   ============================================ */
.attach-panel-grid { display: none !important; }
.attach-panel-hint { display: none !important; }
.attach-panel-actions { padding-bottom: 4px; }
/* ============================================
   深度助手 头部 4 按钮浅色主题覆盖
   ============================================ */
[data-theme=light] .da-header-btn {
    color: #475569;
    background: rgba(99,102,241,0.04);
    border: 1px solid rgba(99,102,241,0.12);
}
[data-theme=light] .da-header-btn:hover {
    color: #4f46e5;
    background: rgba(99,102,241,0.10);
    border-color: rgba(99,102,241,0.25);
}
/* 关闭态 tts-autoplay（灰描边 + 静音图标）：浅色下更明显 */
[data-theme=light] .da-header-btn.tts-autoplay {
    color: #475569;
    background: rgba(148,163,184,0.06);
    border: 1px solid rgba(148,163,184,0.20);
}
[data-theme=light] .da-header-btn.tts-autoplay:hover {
    color: #4f46e5;
    background: rgba(99,102,241,0.10);
    border-color: rgba(99,102,241,0.30);
}

/* ============================================
   发送按钮 浅色主题（紫色仍可读，但稍微淡一点）
   ============================================ */
[data-theme=light] .send-btn {
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
    color: #ffffff;
}

/* ============================================
   + / x 切换按钮：浅色主题下默认 + 紫蓝底
   ============================================ */
[data-theme=light] .file-attach-plus {
    background: rgba(99,102,241,0.10);
    color: #4f46e5;
}
[data-theme=light] .file-attach-btn:hover .file-attach-plus {
    background: rgba(99,102,241,0.18);
}
[data-theme=light] .file-attach-btn.open .file-attach-plus {
    background: rgba(239,68,68,0.14);
    color: #dc2626;
}

/* ============================================
   弹层在移动端强制保持隐藏（双保险）
   ============================================ */
@media (max-width: 768px) {
    .attach-panel,
    .attach-panel-overlay {
        opacity: 0 !important;
        pointer-events: none !important;
        transform: translateY(20px) !important;
    }
    .attach-panel.show,
    .attach-panel-overlay.show {
        opacity: 1 !important;
        pointer-events: auto !important;
        transform: translateY(0) !important;
    }
    /* + / x 切换在移动端的尺寸调整 */
    .file-attach-btn { width: 36px !important; height: 36px !important; }
    .file-attach-plus { width: 32px !important; height: 32px !important; }
    .file-attach-btn svg { width: 20px !important; height: 20px !important; }
}
/* ============================================
   修复 P7：删除按钮双模式清晰可见
   ============================================ */
.image-preview-chip .remove-chip {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #ef4444;       /* 红底 */
    color: #ffffff;            /* 白 X 图标 */
    border: 2px solid #1e293b;  /* 改：深灰描边，浅色背景下不被吞 */
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    /* 改：双层阴影 — 深色模式不丢、浅色模式不吞 */
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.4),
                0 2px 8px rgba(0, 0, 0, 0.35);
    transition: transform 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
    z-index: 5;
}
.image-preview-chip .remove-chip:hover {
    background: #dc2626;
    transform: scale(1.15) rotate(90deg);
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.6),
                0 3px 10px rgba(0, 0, 0, 0.45);
}
.image-preview-chip .remove-chip:active {
    transform: scale(0.92);
}
.image-preview-chip .remove-chip svg {
    width: 12px;
    height: 12px;
    pointer-events: none;
}
/* 浅色主题：深灰描边换成更柔和的中灰 */
[data-theme=light] .image-preview-chip .remove-chip {
    border-color: #475569;
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.3),
                0 2px 8px rgba(220, 38, 38, 0.4);
}

/* ============================================
   修复 P7：+ 按钮在移动端可见可点
   ============================================ */
.file-attach-btn {
    position: relative;
    z-index: 95;  /* 提升 z-index 高于 attach-panel-overlay (z=89) */
    touch-action: manipulation;  /* 防 iOS 300ms 延迟 */
    -webkit-tap-highlight-color: rgba(99, 102, 241, 0.15);
}
@media (max-width: 768px) {
    .file-attach-btn {
        width: 44px !important;     /* 加大到 44px（iOS HIG 推荐最小点击区） */
        height: 44px !important;
        flex-shrink: 0;             /* 移动端不缩 */
    }
    .file-attach-plus {
        width: 36px !important;
        height: 36px !important;
    }
    .file-attach-btn svg {
        width: 22px !important;
        height: 22px !important;
    }
    /* P25 移动端：图片/视频再小一档 */
    .msg-card img { max-width: 200px; max-height: 200px; }
    .msg-card video { max-width: 240px; max-height: 200px; }
    .msg-card .attachment,
    .msg-card .msg-attachment { max-width: 100%; }
}

/* ============================================
   修复 P7：attach-panel 移动端默认偏移量减少（防 panel 完全在屏幕外）
   ============================================ */
@media (max-width: 768px) {
    .attach-panel {
        transform: translateY(8px) !important;  /* 从 20px 减到 8px */
    }
    .attach-panel.show {
        transform: translateY(0) !important;
    }
}
