* { box-sizing: border-box; }
html, body { height: 100%; margin:0; font-family: 'Inter', system-ui, sans-serif; }
:root {
    --bg-main: radial-gradient(circle at 20% 20%, #1e3a8a, #0f172a 60%), linear-gradient(120deg,#1e293b,#0f172a);
    --text-color: #fff;
    --panel-bg: rgba(255,255,255,0.05);
    --border-color: rgba(255,255,255,0.1);
    --bubble-bg: rgba(255,255,255,0.12);
    --bubble-user-bg: linear-gradient(135deg,rgba(99,102,241,0.4),rgba(139,92,246,0.3));
    /* 适配新增：基础尺寸变量 (clamp 根据视口缩放) */
    --font-size-base: clamp(13px, 0.9vw + 0.45rem, 16px);
    --font-size-sm: calc(var(--font-size-base) - 1px);
    --font-size-lg: calc(var(--font-size-base) + 2px);
    --radius-base: 16px;
    --gap-base: 14px;
}
[data-theme='light'] {
    --bg-main: linear-gradient(135deg,#f1f5f9,#e2e8f0);
    --text-color:#1e293b;
    --panel-bg: rgba(255,255,255,0.65);
    --border-color: rgba(0,0,0,0.08);
    --bubble-bg: rgba(255,255,255,0.85);
    --bubble-user-bg: linear-gradient(135deg,#6366f1,#8b5cf6);
}
body { background: var(--bg-main); color:var(--text-color); overflow:hidden; font-size:var(--font-size-base); }
body::before { content:""; position:fixed; inset:0; background:radial-gradient(circle at 80% 70%,rgba(236,72,153,0.25),transparent 60%),radial-gradient(circle at 10% 30%,rgba(99,102,241,0.25),transparent 55%); mix-blend-mode:screen; pointer-events:none; animation: glowMove 12s linear infinite alternate; }
@keyframes glowMove { 0%{filter:blur(40px) hue-rotate(0deg);}100%{filter:blur(40px) hue-rotate(360deg);} }

#bg-canvas { position:fixed; inset:0; z-index:-1; }

.app-wrapper { display:flex; flex-direction:column; height:100%; backdrop-filter: blur(20px); background: var(--panel-bg); border:1px solid var(--border-color); box-shadow:0 20px 40px -10px rgba(0,0,0,0.6); border-radius:24px; margin:12px; overflow:hidden; position:relative; }

.app-header { display:flex; flex-wrap:wrap; align-items:center; gap:16px; padding:16px 24px; background:linear-gradient(135deg,rgba(255,255,255,0.1),rgba(255,255,255,0)); border-bottom:1px solid rgba(255,255,255,0.1); }
.top-clock { width:100%; font-size:14px; font-weight:600; letter-spacing:.5px; opacity:.9; display:flex; gap:6px; justify-content:flex-end; margin-top:-4px; }
.app-brand-block { display:flex; align-items:center; gap:14px; }
.brand-hamburger { position:relative; width:46px; height:46px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; background:linear-gradient(145deg,rgba(255,255,255,0.18),rgba(255,255,255,0.05)); border:1px solid rgba(255,255,255,0.28); border-radius:14px; cursor:pointer; backdrop-filter:blur(8px); transition:.35s; overflow:hidden; }
.brand-hamburger .bar { display:block; width:22px; height:3px; border-radius:2px; background:linear-gradient(90deg,#6366f1,#8b5cf6,#ec4899); background-size:200% 100%; animation: gradientMove 6s linear infinite; box-shadow:0 0 6px -1px rgba(255,255,255,0.6); }
.brand-hamburger:hover { transform:translateY(-3px) scale(1.05); box-shadow:0 12px 30px -8px rgba(0,0,0,0.65); }
.brand-hamburger:active { transform:translateY(0) scale(1); }
.logo-icon { font-size:22px; filter:drop-shadow(0 2px 4px rgba(0,0,0,.4)); }
.logo-text { font-weight:600; letter-spacing:.6px; font-size:18px; background:linear-gradient(90deg,#6366f1,#8b5cf6,#ec4899); -webkit-background-clip:text; background-clip:text; color:transparent; animation: gradientShift 8s linear infinite; }
@media (min-width:1440px){ .logo-text { font-size:20px; } }
.hamburger { background:rgba(255,255,255,0.15); border:1px solid rgba(255,255,255,0.25); color:var(--text-color); width:42px; height:42px; border-radius:12px; cursor:pointer; font-size:20px; display:flex; align-items:center; justify-content:center; backdrop-filter:blur(6px); transition:.25s; }
.hamburger:hover { background:rgba(255,255,255,0.3); }
.logo { font-size:20px; font-weight:600; letter-spacing:.5px; display:flex; align-items:center; gap:8px; }
.logo .badge { background:linear-gradient(90deg,#6366f1,#8b5cf6,#ec4899); padding:4px 10px; border-radius:999px; font-size:12px; font-weight:500; animation: gradientShift 6s linear infinite; }
@keyframes gradientShift { 0%{filter:hue-rotate(0deg);}100%{filter:hue-rotate(360deg);} }

/* Provider 操作区改为网格布局，避免拥挤 */
/* 横向工具栏布局 */
.provider-select { display:flex; flex-wrap:nowrap; align-items:center; gap:8px; overflow-x:auto; padding:4px 6px; scrollbar-width:thin; }
.provider-select::-webkit-scrollbar { height:8px; }
.provider-select::-webkit-scrollbar-track { background:rgba(255,255,255,0.08); }
.provider-select::-webkit-scrollbar-thumb { background:linear-gradient(90deg,#6366f1,#8b5cf6,#ec4899); border-radius:20px; }
.provider-select select, .stream-toggle input { background:rgba(255,255,255,0.15); border:1px solid rgba(255,255,255,0.2); color:#fff; padding:6px 10px; border-radius:10px; backdrop-filter:blur(4px); font-size:13px; flex:0 0 auto; }
.provider-select select:focus { outline:2px solid #6366f1; }
.stream-toggle { font-size:13px; display:flex; align-items:center; gap:4px; flex:0 0 auto; }
.provider-select .mini-btn, .provider-select .settings-btn { flex:0 0 auto; }
#modelChips { flex:1 1 auto; display:flex; gap:6px; }
/* 紧凑模式：当宽度不足或检测到溢出时应用 */
.provider-select.compact { gap:6px; }
.provider-select.compact select, .provider-select.compact .mini-btn, .provider-select.compact .settings-btn { font-size:11px; padding:4px 8px; }
#modelChips .chip-btn { flex:0 0 auto; }
.provider-select.compact #stopStreamBtn { order:99; }
.provider-select.compact label.stream-toggle { order:1; }
.provider-select.compact button { white-space:nowrap; }

.chat-container { flex:1; overflow-y:auto; padding:24px; display:flex; flex-direction:column; gap:18px; scroll-behavior:smooth; }
.message { display:flex; gap:14px; align-items:flex-start; animation: fadeIn .5s ease; }
.message .bubble { animation: popIn .45s cubic-bezier(.4,1.4,.6,1); }
@keyframes popIn { 0%{transform:scale(.85) translateY(8px); opacity:0;} 100%{transform:scale(1) translateY(0); opacity:1;} }
.message.user { flex-direction:row-reverse; }
.message .avatar { width:42px; height:42px; border-radius:14px; background:linear-gradient(135deg,#6366f1,#3b82f6); display:flex; align-items:center; justify-content:center; font-weight:600; font-size:14px; box-shadow:0 4px 12px -2px rgba(0,0,0,.4); }
.message.user .avatar { background:linear-gradient(135deg,#ec4899,#ef4444); }
.message .bubble { position:relative; max-width:70%; padding:14px 18px; background:var(--bubble-bg); border:1px solid rgba(255,255,255,0.15); border-radius:20px; line-height:1.55; font-size:14px; backdrop-filter:blur(8px); box-shadow:0 8px 24px -4px rgba(0,0,0,0.5); color:var(--text-color); }
.bubble .msg-meta { position:absolute; right:10px; bottom:6px; font-size:10px; opacity:.55; pointer-events:none; white-space:nowrap; }
.message.user .bubble { background:var(--bubble-user-bg); }
.message .bubble .typing-cursor { display:inline-block; width:10px; }
.message .bubble::after { content:""; position:absolute; width:14px; height:14px; background:inherit; top:18px; left:-6px; transform:rotate(45deg); border-left:1px solid rgba(255,255,255,0.15); border-bottom:1px solid rgba(255,255,255,0.15); }
.message.user .bubble::after { left:auto; right:-6px; }

@keyframes fadeIn { from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:translateY(0);} }
.fade-in { animation: fadeIn .5s ease; }

.input-area { display:flex; gap:12px; padding:16px 20px; background:linear-gradient(180deg,rgba(255,255,255,0.05),rgba(255,255,255,0)); border-top:1px solid rgba(255,255,255,0.08); }
#charCount { position:absolute; right:16px; bottom:6px; font-size:11px; opacity:.65; pointer-events:none; }
#input { position:relative; }
#input, .send-btn, .emoji-btn { -webkit-touch-callout:none; -webkit-user-select:text; user-select:text; }
.input-area { padding-bottom: calc(16px + env(safe-area-inset-bottom)); }
#input { flex:1; resize:none; padding:14px 18px; font-size:14px; border-radius:16px; border:1px solid rgba(255,255,255,.15); background:var(--bubble-bg); color:var(--text-color); line-height:1.5; backdrop-filter:blur(6px); max-height:160px; overflow-y:auto; }
@media (min-width:1440px){ #input { font-size:15px; } }
.mini-btn { background:rgba(255,255,255,0.15); color:var(--text-color); border:1px solid rgba(255,255,255,0.25); padding:6px 12px; border-radius:10px; cursor:pointer; font-size:12px; backdrop-filter:blur(4px); transition:.25s; }
.mini-btn:hover { background:rgba(255,255,255,0.3); }
.mini-btn.loading { position:relative; }
.mini-btn.loading:after { content:""; position:absolute; inset:2px; border-radius:8px; background:linear-gradient(90deg,#6366f1,#8b5cf6,#ec4899); animation: gradientMove 1.2s linear infinite; opacity:.35; }
.session-meta { font-size:11px; text-align:center; padding:4px 0 4px; opacity:.85; }
.bubble pre { position:relative; }
.code-copy-btn { position:absolute; top:6px; right:6px; background:rgba(0,0,0,0.5); color:#fff; border:none; padding:4px 8px; font-size:11px; border-radius:6px; cursor:pointer; opacity:.6; transition:.25s; }
.code-copy-btn:hover { opacity:1; }
#input:focus { outline:2px solid #6366f1; }
.send-btn { background:linear-gradient(90deg,#6366f1,#8b5cf6,#ec4899); background-size:200% 100%; animation: gradientMove 5s linear infinite; border:none; color:#fff; padding:14px 24px; border-radius:16px; font-size:14px; font-weight:600; cursor:pointer; box-shadow:0 6px 18px -4px rgba(0,0,0,.6); transition: transform .25s ease, box-shadow .25s ease; }
.send-btn:before { content:""; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(120deg,rgba(255,255,255,.3),transparent 60%); opacity:0; transition:.5s; }
.send-btn:hover:before { opacity:1; }
.send-btn { position:relative; overflow:hidden; }
.send-btn:hover { transform:translateY(-3px); box-shadow:0 12px 28px -6px rgba(0,0,0,.65); }
.send-btn:active { transform:translateY(0); }
@keyframes gradientMove { 0%{background-position:0 0;}100%{background-position:100% 0;} }

.app-footer { font-size:12px; color:#94a3b8; display:flex; flex-direction:column; }
.credit { text-align:center; padding:4px 0 12px; }
.quote-box { display:flex; align-items:center; justify-content:center; gap:10px; font-size:12px; padding:6px 10px; color:#cbd5e1; opacity:.85; }
.quote-box .quote-text { font-style:italic; letter-spacing:.3px; }
.quote-box .quote-refresh { background:rgba(255,255,255,0.15); border:1px solid rgba(255,255,255,0.25); color:var(--text-color); padding:4px 8px; font-size:11px; border-radius:8px; cursor:pointer; backdrop-filter:blur(4px); }
.quote-box .quote-refresh:hover { background:rgba(255,255,255,0.3); }
/* 信息栏 */
.info-bar { display:flex; flex-direction:column; gap:4px; padding:6px 12px 4px; font-size:11px; color:#94a3b8; }
.info-bar .build-meta { display:flex; flex-wrap:wrap; gap:12px; font-size:11px; opacity:.8; }
.info-bar #currentTime { opacity:.9; }
.session-list li .select-box { position:absolute; top:8px; left:8px; }
.session-list.multiselect li { padding-left:32px; }
.session-list li .rename-btn { position:absolute; top:8px; right:8px; background:rgba(255,255,255,0.2); border:0; font-size:11px; padding:2px 6px; border-radius:6px; cursor:pointer; opacity:.7; }
.session-list li .rename-btn:hover { opacity:1; background:rgba(255,255,255,0.35); }
.bottom-quotes { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:10px; font-size:11px; padding:8px 12px; color:#cbd5e1; opacity:.85; }
.bottom-quotes .quote-text { font-style:italic; max-width:70ch; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; letter-spacing:.3px; }
.bottom-quotes .auto-rotate { display:flex; align-items:center; gap:4px; }
.bottom-quotes button { padding:4px 8px; font-size:11px; }

/* 图片预览托盘，避免撑高输入区 */
#imageTray { display:none; gap:8px; padding:8px 12px; border-top:1px solid var(--border-color); background:rgba(0,0,0,0.1); overflow-x:auto; overflow-y:hidden; max-height:92px; }
#imageTray .img-chip { position:relative; flex:0 0 auto; width:72px; height:72px; }
#imageTray .img-chip img { width:100%; height:100%; object-fit:cover; border-radius:10px; border:1px solid rgba(255,255,255,0.25); box-shadow:0 4px 10px -4px rgba(0,0,0,.5); }
#imageTray .img-chip .remove { position:absolute; top:-6px; right:-6px; width:20px; height:20px; border-radius:50%; border:0; cursor:pointer; font-size:12px; line-height:20px; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,0.6); color:#fff; box-shadow:0 2px 6px rgba(0,0,0,.5); }
@media (max-width:640px){ #imageTray { padding:6px 8px; max-height:86px; } #imageTray .img-chip{ width:64px; height:64px; } }

/* 抽屉搜索 */
.drawer-search { margin-bottom:8px; }
.drawer-search input { width:100%; padding:8px 10px; font-size:12px; border-radius:8px; border:1px solid rgba(255,255,255,0.25); background:rgba(255,255,255,0.12); color:#fff; backdrop-filter:blur(6px); }
.drawer-search input:focus { outline:2px solid #6366f1; }

/* Scrollbar */
.chat-container::-webkit-scrollbar { width:10px; }
    .stream-progress { width:100%; display:none; flex-direction:column; gap:4px; padding:6px 26px 4px; box-sizing:border-box; }
.chat-container::-webkit-scrollbar-thumb { background:linear-gradient(180deg,#6366f1,#8b5cf6,#ec4899); border-radius:10px; }

/* 粒子背景（Canvas绘制） */

/* 响应式 */
@media (max-width: 640px){
    .logo { font-size:16px; }
    .message .bubble { max-width:85%; }
    #input { font-size:13px; }
    .input-area { padding:12px 14px; gap:8px; }
    .provider-select { padding:4px 4px; }
    .emoji-panel { bottom:70px; left:8px; right:8px; }
    .stream-progress { top:auto; bottom:110px; right:12px; width:150px; }
    .provider-select { flex-wrap:wrap; gap:6px; }
    .provider-select select { font-size:12px; padding:4px 8px; }
    #clearHistoryBtn { display:none; } /* 移动端节省空间，改用 /clear 指令 */
}
/* 新增更细断点: 超小屏 (≤480px) */
@media (max-width:480px){
    .app-header { padding:12px 16px; gap:10px; }
    .message .bubble { font-size:13px; }
    #input { font-size:12px; padding:12px 14px; }
    .send-btn { padding:12px 18px; font-size:13px; }
    .top-clock { font-size:11px; }
    .provider-select { gap:6px; }
}
/* 平板竖屏 (481px~768px) */
@media (min-width:481px) and (max-width:768px){
    .message .bubble { max-width:78%; }
    .app-header { padding:14px 20px; }
}
/* 平板横屏 / 小桌面 (769px~1024px) */
@media (min-width:769px) and (max-width:1024px){
    .message .bubble { max-width:72%; }
    .app-wrapper { margin:10px; }
}
/* 超宽屏 ≥1600px: 缩小最大宽度避免一行太长 */
@media (min-width:1600px){
    .message .bubble { max-width:58%; font-size:15px; }
}
/* 高 DPI 优化: 减弱阴影, 延长光晕动画周期 */
@media (min-resolution:2dppx), (min-device-pixel-ratio:2){
    body::before { animation: glowMove 16s linear infinite alternate; }
    .message .bubble, #input, .emoji-panel { box-shadow:0 10px 28px -8px rgba(0,0,0,0.5); }
}
@media (min-resolution:3dppx), (min-device-pixel-ratio:3){
    .message .bubble { box-shadow:0 8px 22px -10px rgba(0,0,0,0.55); }
}

/* Emoji 按钮与面板 */
.emoji-btn { background:rgba(255,255,255,0.15); border:1px solid rgba(255,255,255,0.25); width:44px; height:44px; border-radius:14px; font-size:20px; cursor:pointer; backdrop-filter:blur(6px); display:flex; align-items:center; justify-content:center; transition:.25s; }
.emoji-btn:hover { background:rgba(255,255,255,0.25); }
.emoji-panel { position:fixed; bottom:100px; left:20px; width:320px; max-width:calc(100% - 40px); background:rgba(15,23,42,0.75); border:1px solid rgba(255,255,255,0.15); backdrop-filter:blur(16px); padding:10px 12px; display:grid; grid-template-columns:repeat(auto-fill,minmax(32px,1fr)); gap:6px; border-radius:18px; box-shadow:0 8px 32px -4px rgba(0,0,0,.6); animation: panelFade .25s ease; z-index:400; }
/* 动态反向对齐时附加类：向上或向右展开 */
.emoji-panel.upward { bottom:auto; }
.emoji-panel.right-align { left:auto; }
@keyframes panelFade { from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:translateY(0);} }
.emoji-panel button { background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.2); width:38px; height:38px; font-size:20px; border-radius:12px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.25s; }
.emoji-panel button:hover { background:rgba(255,255,255,0.25); transform:translateY(-2px); }

/* 打字光标动画 */
.typing-cursor { animation: blink 1s steps(2,start) infinite; }
@keyframes blink { 0%,49%{opacity:1;}50%,100%{opacity:0;} }

/* Markdown 占位样式 */
.bubble pre { background:rgba(0,0,0,0.35); padding:12px 14px; border-radius:12px; overflow:auto; font-family:ui-monospace,monospace; font-size:12px; }
.bubble code { background:rgba(255,255,255,0.12); padding:2px 6px; border-radius:6px; font-size:13px; }

/* 模型 chips */
.model-chips { margin-top:6px; display:flex; gap:6px; flex-wrap:wrap; }
.model-chips .chip-btn { 
    background:rgba(255,255,255,0.15); 
    border:1px solid rgba(255,255,255,0.25); 
    color:var(--text-color); 
    padding:4px 10px; 
    font-size:11px; 
    border-radius:999px; 
    cursor:pointer; 
    line-height:1; 
    transition:.25s; 
    backdrop-filter:blur(4px);
}
.model-chips .chip-btn:hover { background:rgba(255,255,255,0.28); transform:translateY(-2px); }
.model-chips .chip-btn.active { background:linear-gradient(90deg,#6366f1,#8b5cf6,#ec4899); border-color:transparent; box-shadow:0 4px 14px -4px rgba(0,0,0,.5); }

/* 会话侧边抽屉 */
.session-drawer { position:absolute; top:0; left:0; width:260px; height:100%; background:rgba(15,23,42,0.85); backdrop-filter:blur(18px); border-right:1px solid rgba(255,255,255,0.15); box-shadow:0 0 40px -10px rgba(0,0,0,0.8); padding:16px 14px 70px; display:flex; flex-direction:column; gap:12px; animation: drawerSlide .45s cubic-bezier(.4,1.4,.6,1); z-index:20; }
@keyframes drawerSlide { 0%{transform:translateX(-40px); opacity:0;} 100%{transform:translateX(0); opacity:1;} }
.drawer-header { display:flex; align-items:center; justify-content:space-between; font-weight:600; letter-spacing:.5px; }
.session-list { list-style:none; margin:0; padding:0; flex:1; overflow-y:auto; display:flex; flex-direction:column; gap:8px; }
.session-list li { background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.18); padding:10px 12px; border-radius:10px; cursor:pointer; font-size:13px; line-height:1.4; position:relative; display:flex; flex-direction:column; gap:4px; }
.session-list li.active { background:linear-gradient(90deg,#6366f1,#8b5cf6,#ec4899); color:#fff; border-color:transparent; box-shadow:0 4px 14px -4px rgba(0,0,0,.6); }
.session-list li .meta { font-size:11px; opacity:.75; }
.session-list li:hover { background:rgba(255,255,255,0.16); }
.drawer-footer { font-size:10px; opacity:.7; text-align:center; }

#sessionDrawer {
    position: fixed;
    top: 0;
    left: 0;
    width: 260px;
    background: rgba(30,30,40,0.72);
    backdrop-filter: blur(16px) saturate(180%);
    box-shadow: 0 4px 18px rgba(0,0,0,0.35);
    padding: 14px 16px 80px;
    height: 100vh;
    overflow-y: auto; /* 允许滚动 */
    overflow-x: hidden;
    z-index: 70;
    display: none;
    -webkit-overflow-scrolling: touch; /* 移动端平滑滚动 */
    scrollbar-width: thin;
}
/* 抽屉内容滚动区域优化：列表过长时保持底部提示可见 */
#sessionDrawer .drawer-footer {
    position: sticky;
    bottom: 0;
    background: linear-gradient(to top, rgba(30,30,40,0.85), rgba(30,30,40,0.4));
    backdrop-filter: blur(12px);
    padding-top: 10px;
}
@media (max-width: 640px){
    .session-drawer { width:80%; }
}

/* 流式进度条（聊天框下方） */
.stream-progress { width:100%; display:none; flex-direction:column; gap:4px; padding:6px 26px 4px; box-sizing:border-box; }
.stream-progress { background:rgba(255,255,255,0.05); border-top:1px solid rgba(255,255,255,0.08); }
body.no-blur .stream-progress { background:rgba(255,255,255,0.92)!important; }
.stream-progress .bar { position:relative; height:14px; background:rgba(255,255,255,0.18); border:1px solid rgba(255,255,255,0.25); border-radius:999px; overflow:hidden; backdrop-filter:blur(6px); }
.stream-progress .bar .fill { position:absolute; inset:0; width:0%; background:linear-gradient(90deg,#6366f1,#8b5cf6,#ec4899); background-size:200% 100%; animation: gradientMove 4s linear infinite; }
.stream-progress .bar .label { position:absolute; left:12px; top:50%; transform:translateY(-50%); font-size:12px; letter-spacing:.5px; font-weight:600; text-shadow:0 1px 2px rgba(0,0,0,.35); }
.stream-progress .stats { display:flex; gap:14px; font-size:11px; opacity:.75; padding:0 4px; }
.stream-progress .stats span { white-space:nowrap; }
.stream-progress.done .bar .fill { background:linear-gradient(90deg,#10b981,#22c55e); animation:none; }
@media (max-width:640px){ .stream-progress { padding:6px 14px 4px; } }
/* 完成动画：爆裂粒子容器 */
.completion-burst { position:fixed; inset:0; pointer-events:none; overflow:hidden; }
.burst-dot { position:absolute; width:8px; height:8px; border-radius:50%; background:var(--dot-color); animation: dotFly 1.4s cubic-bezier(.16,.72,.3,1) forwards; box-shadow:0 0 8px -2px rgba(255,255,255,0.6); }
@keyframes dotFly { 0%{ transform:translate(0,0) scale(.9); opacity:1;} 65%{ opacity:1;} 100%{ transform:translate(var(--dx), var(--dy)) scale(0); opacity:0;} }

/* 设置面板 */
.settings-btn { background:rgba(255,255,255,0.15); border:1px solid rgba(255,255,255,0.25); color:var(--text-color); padding:6px 12px; font-size:12px; border-radius:10px; cursor:pointer; backdrop-filter:blur(4px); }
.settings-btn:hover { background:rgba(255,255,255,0.3); }
.settings-panel { position:fixed; bottom:90px; right:24px; width:280px; background:rgba(15,23,42,0.85); border:1px solid rgba(255,255,255,0.15); backdrop-filter:blur(18px); padding:16px 18px; border-radius:18px; box-shadow:0 10px 32px -6px rgba(0,0,0,0.7); display:none; flex-direction:column; gap:12px; animation: panelFade .35s ease; z-index:30; }
/* 提升层级防止被其他元素覆盖 */
.settings-panel { z-index:300; }
.app-header { position:relative; z-index:200; }
.settings-panel h3 { margin:0; font-size:14px; letter-spacing:.5px; display:flex; align-items:center; gap:6px; }
.settings-panel label { display:flex; align-items:center; gap:6px; font-size:12px; }
.settings-panel input[type='number'] { width:80px; padding:6px 8px; font-size:12px; border-radius:8px; border:1px solid rgba(255,255,255,0.25); background:rgba(255,255,255,0.12); color:#fff; }
.settings-panel select { padding:6px 8px; font-size:12px; border-radius:8px; border:1px solid rgba(255,255,255,0.25); background:rgba(255,255,255,0.12); color:#fff; }
.settings-panel .row { display:flex; justify-content:space-between; align-items:center; }
.settings-panel .actions { display:flex; gap:10px; }
.settings-panel button.save-btn { flex:1; background:linear-gradient(90deg,#6366f1,#8b5cf6,#ec4899); border:none; color:#fff; padding:8px 12px; font-size:12px; font-weight:600; border-radius:10px; cursor:pointer; box-shadow:0 6px 16px -4px rgba(0,0,0,.6); }
.settings-panel button.close-btn { background:rgba(255,255,255,0.15); border:1px solid rgba(255,255,255,0.25); color:var(--text-color); padding:8px 12px; font-size:12px; border-radius:10px; cursor:pointer; }
.settings-panel button.save-btn:hover { transform:translateY(-2px); }
.settings-panel button.close-btn:hover { background:rgba(255,255,255,0.3); }

/* 清空按钮强化 */
#clearHistoryBtn { position:relative; }
#clearHistoryBtn:hover { box-shadow:0 4px 12px -4px rgba(0,0,0,0.5); }
/* 已移除折叠菜单相关样式（actions-menu / menu-backdrop） */
/* 移动端模式标记 body.mobile 下隐藏次级按钮（保持主操作精简） */
body.mobile .provider-select .mini-btn:not(#themeToggle):not(#exportBtn):not(#clearHistoryBtn):not(#settingsBtn):not(#langToggle):not(#stopStreamBtn):not(#aboutAuthorBtn) { display:none; }
body.mobile #mobileMoreBtn { display:inline-block !important; }
body.mobile .provider-select { padding-right:38px; }
/* Sticky 输入区：长对话时输入栏不滚出视口 */
body.mobile .input-area { position:sticky; bottom:0; z-index:250; backdrop-filter:blur(18px); }
/* 减少移动端视觉噪音：降低消息气泡阴影与圆角 */
body.mobile .message .bubble { box-shadow:0 4px 12px -4px rgba(0,0,0,0.45); border-radius:18px; }
body.mobile .message .avatar { width:38px; height:38px; }
body.mobile #input { font-size:13px; }
@media (max-width:640px){ body.mobile .send-btn { padding:12px 18px; } }
/* 调试面板 */
.debug-panel { position:fixed; bottom:120px; left:24px; width:300px; max-height:60vh; overflow:auto; background:rgba(15,23,42,0.9); border:1px solid rgba(255,255,255,0.2); backdrop-filter:blur(18px); padding:12px 14px; border-radius:16px; box-shadow:0 10px 28px -6px rgba(0,0,0,.7); display:flex; flex-direction:column; gap:10px; z-index:500; animation: panelFade .35s ease; font-size:12px; }
.debug-panel .dbg-header { font-weight:600; letter-spacing:.5px; font-size:13px; }
.debug-panel .dbg-body { white-space:pre-wrap; font-family:ui-monospace,monospace; line-height:1.4; }
.debug-panel .dbg-body .ok { color:#10b981; }
.debug-panel .dbg-body .warn { color:#f59e0b; }
.debug-panel .dbg-body .err { color:#ef4444; }
.debug-panel .dbg-footer { display:flex; gap:8px; justify-content:flex-end; }

/* =========== Blur 可选关闭：当 body.no-blur 存在时移除毛玻璃并提高对比度 =========== */
body.no-blur .app-wrapper,
body.no-blur .brand-hamburger,
body.no-blur .provider-select select,
body.no-blur .provider-select .mini-btn,
body.no-blur .provider-select .settings-btn,
body.no-blur #input,
body.no-blur .mini-btn,
body.no-blur .emoji-panel,
body.no-blur .emoji-panel button,
body.no-blur .model-chips .chip-btn,
body.no-blur .session-drawer,
body.no-blur .session-list li,
body.no-blur .stream-progress,
body.no-blur .settings-panel,
body.no-blur .debug-panel,
body.no-blur .message .bubble,
body.no-blur .quote-box .quote-refresh,
body.no-blur .quote-box,
body.no-blur body.mobile .input-area {
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
}
body.no-blur .app-wrapper,
body.no-blur .settings-panel,
body.no-blur .debug-panel,
body.no-blur .session-drawer,
body.no-blur .emoji-panel,
body.no-blur .stream-progress,
body.no-blur .message .bubble,
body.no-blur .session-list li,
body.no-blur #input,
body.no-blur .mini-btn,
body.no-blur .provider-select select,
body.no-blur .provider-select .settings-btn,
body.no-blur .quote-box,
body.no-blur .quote-box .quote-refresh {
    background:rgba(255,255,255,0.92) !important;
    color:#0f172a !important;
    border-color:rgba(0,0,0,0.08) !important;
    box-shadow:0 4px 14px -4px rgba(0,0,0,0.25) !important;
}
body.no-blur .send-btn { box-shadow:0 6px 16px -4px rgba(0,0,0,0.5); }
body.no-blur .model-chips .chip-btn.active { color:#fff !important; }
/* 移除旧 actions-menu 关联的 no-blur 覆盖 */
/* 维持深色渐变主题时的可读性：如果使用 light 主题则覆盖颜色仍然适配 */
body.no-blur [data-theme='light'] .app-wrapper { background:rgba(255,255,255,0.98) !important; }
