/* ====== 全局基础 ====== */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif; }

/* ====== 滚动条 ====== */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* ====== 侧边栏 ====== */
.sidebar-item { transition: all .2s; cursor: pointer; border-radius: .5rem; padding: .625rem .75rem; display: flex; align-items: center; gap: .5rem; font-size: .875rem; color: #475569; }
.sidebar-item:hover { background: #f0f5ff; color: #4f64f8; }
.sidebar-item.active { background: #e0eaff; color: #3b43ec; font-weight: 600; }
.sidebar-item i { width: 1.25rem; text-align: center; font-size: .9rem; }

/* ====== 打字动画 ====== */
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0} }
.typing-cursor::after { content: '▋'; animation: blink .8s infinite; color: #4f64f8; margin-left: 2px; }

/* ====== 气泡 ====== */
.chat-bubble { animation: slideUp .35s ease-out; max-width: 85%; }
@keyframes slideUp { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }

.bubble-ai { background: linear-gradient(135deg, #f0f5ff 0%, #faf5ff 100%); border: 1px solid #e0eaff; border-radius: 1rem 1rem 1rem .25rem; }
.bubble-user { background: linear-gradient(135deg, #4f64f8 0%, #6b8afb 100%); color: white; border-radius: 1rem 1rem .25rem 1rem; }

/* ====== 数据卡片 ====== */
.metric-card { transition: all .25s; border: 1px solid #e2e8f0; border-radius: .75rem; background: white; }
.metric-card:hover { border-color: #c2d5ff; box-shadow: 0 4px 16px rgba(79,100,248,.1); transform: translateY(-2px); }

/* ====== 表格 ====== */
.data-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .8125rem; }
.data-table th { background: #f8fafc; font-weight: 600; color: #475569; padding: .625rem .75rem; border-bottom: 2px solid #e2e8f0; text-align: left; position: sticky; top: 0; }
.data-table td { padding: .5rem .75rem; border-bottom: 1px solid #f1f5f9; }
.data-table tbody tr:hover { background: #f0f5ff; }

/* ====== 标签 ====== */
.tag { display: inline-flex; align-items: center; gap: .25rem; padding: .125rem .5rem; border-radius: 999px; font-size: .75rem; font-weight: 500; }
.tag-green { background: #dcfce7; color: #16a34a; }
.tag-yellow { background: #fef9c3; color: #ca8a04; }
.tag-red { background: #fee2e2; color: #dc2626; }
.tag-blue { background: #dbeafe; color: #2563eb; }
.tag-purple { background: #f3e8ff; color: #9333ea; }

/* ====== 按钮 ====== */
.btn { display: inline-flex; align-items: center; gap: .375rem; padding: .5rem 1rem; border-radius: .5rem; font-size: .8125rem; font-weight: 500; transition: all .2s; cursor: pointer; border: none; }
.btn-primary { background: linear-gradient(135deg, #4f64f8, #6b8afb); color: white; }
.btn-primary:hover { box-shadow: 0 4px 12px rgba(79,100,248,.35); transform: translateY(-1px); }
.btn-secondary { background: white; color: #4f64f8; border: 1px solid #c2d5ff; }
.btn-secondary:hover { background: #f0f5ff; }
.btn-ghost { background: transparent; color: #64748b; }
.btn-ghost:hover { background: #f1f5f9; color: #334155; }
.btn-success { background: #16a34a; color: white; }
.btn-success:hover { background: #15803d; }

/* ====== 进度条 ====== */
.progress-bar { height: .375rem; border-radius: 999px; background: #e2e8f0; overflow: hidden; }
.progress-bar-fill { height: 100%; border-radius: 999px; transition: width .8s ease-out; }

/* ====== 对话输入 ====== */
.chat-input-wrap { display: flex; align-items: center; gap: .5rem; background: white; border: 2px solid #e2e8f0; border-radius: .75rem; padding: .5rem .75rem; transition: border-color .2s; }
.chat-input-wrap:focus-within { border-color: #4f64f8; box-shadow: 0 0 0 3px rgba(79,100,248,.1); }
.chat-input-wrap input { flex: 1; border: none; outline: none; font-size: .875rem; background: transparent; }

/* ====== 反馈按钮组 ====== */
.feedback-btn { padding: .25rem .625rem; border-radius: .375rem; border: 1px solid #e2e8f0; font-size: .75rem; cursor: pointer; transition: all .2s; background: white; }
.feedback-btn:hover { border-color: #4f64f8; color: #4f64f8; background: #f0f5ff; }
.feedback-btn.selected { border-color: #4f64f8; background: #e0eaff; color: #3b43ec; }

/* ====== 框架卡片 ====== */
.framework-card { border: 1px solid #e2e8f0; border-radius: .75rem; padding: 1.25rem; background: white; transition: all .25s; }
.framework-card:hover { border-color: #c2d5ff; box-shadow: 0 4px 16px rgba(79,100,248,.08); }

/* ====== 时间线 ====== */
.timeline-item { position: relative; padding-left: 2rem; padding-bottom: 1.5rem; }
.timeline-item::before { content: ''; position: absolute; left: .5rem; top: .375rem; width: .625rem; height: .625rem; border-radius: 999px; background: #4f64f8; border: 2px solid white; box-shadow: 0 0 0 2px #c2d5ff; z-index: 1; }
.timeline-item::after { content: ''; position: absolute; left: .75rem; top: 1.125rem; width: 2px; height: calc(100% - .75rem); background: #e2e8f0; }
.timeline-item:last-child::after { display: none; }

/* ====== 置信度指示器 ====== */
.confidence-dot { width: .625rem; height: .625rem; border-radius: 999px; display: inline-block; }
.confidence-high { background: #16a34a; }
.confidence-mid { background: #ca8a04; }
.confidence-low { background: #dc2626; }

/* ====== 动画 ====== */
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes scaleIn { from{opacity:0;transform:scale(.95)} to{opacity:1;transform:scale(1)} }
.animate-fade-in { animation: fadeIn .3s ease-out; }
.animate-scale-in { animation: scaleIn .3s ease-out; }

/* ====== Toast ====== */
.toast-item { animation: slideInRight .3s ease-out; padding: .75rem 1rem; border-radius: .5rem; font-size: .8125rem; display: flex; align-items: center; gap: .5rem; box-shadow: 0 4px 12px rgba(0,0,0,.1); }
@keyframes slideInRight { from{opacity:0;transform:translateX(100%)} to{opacity:1;transform:translateX(0)} }

/* ====== 演示高亮 ====== */
.demo-highlight { animation: pulse-highlight 2s infinite; }
@keyframes pulse-highlight { 0%,100%{box-shadow:0 0 0 0 rgba(79,100,248,.3)} 50%{box-shadow:0 0 0 8px rgba(79,100,248,0)} }

/* ====== Phase标签 ====== */
.phase-badge { display: inline-flex; align-items: center; gap: .25rem; padding: .25rem .75rem; border-radius: 999px; font-size: .75rem; font-weight: 600; }
.phase-1 { background: linear-gradient(135deg, #dbeafe, #e0eaff); color: #2563eb; }
.phase-2 { background: linear-gradient(135deg, #f3e8ff, #fae8ff); color: #9333ea; }
.phase-3 { background: linear-gradient(135deg, #dcfce7, #d1fae5); color: #16a34a; }

/* ====== 场景卡片 ====== */
.scenario-card { border: 1px solid #e2e8f0; border-radius: .75rem; overflow: hidden; background: white; transition: all .3s; cursor: pointer; }
.scenario-card:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,0,0,.08); border-color: #c2d5ff; }
.scenario-card .card-header { padding: 1rem; background: linear-gradient(135deg, #f0f5ff, #faf5ff); border-bottom: 1px solid #e2e8f0; }

/* ====== 智能日报模块 ====== */
.daily-report-module { position: relative; }
.dr-tab { display: inline-flex; align-items: center; gap: .375rem; padding: .75rem 1rem; font-size: .8125rem; font-weight: 500; color: #64748b; border-bottom: 2px solid transparent; cursor: pointer; transition: all .2s; background: none; border-top: none; border-left: none; border-right: none; }
.dr-tab:hover { color: #4f64f8; background: #f0f5ff; }
.dr-tab.active { color: #4f64f8; border-bottom-color: #4f64f8; font-weight: 600; }
.dr-tab i { font-size: .75rem; }
.dr-action-btn { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; border-radius: .375rem; border: 1px solid #e2e8f0; background: white; color: #64748b; cursor: pointer; transition: all .2s; }
.dr-action-btn:hover { border-color: #4f64f8; color: #4f64f8; background: #f0f5ff; }
.dr-report-card { position: relative; }
.dr-report-body p { margin-bottom: .5rem; }
.dr-report-body strong { color: #1e293b; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* ====== 分析步骤 ====== */
.step-indicator { display: flex; align-items: center; gap: .5rem; }
.step-dot { width: 2rem; height: 2rem; border-radius: 999px; display: flex; align-items: center; justify-content: center; font-size: .75rem; font-weight: 700; }
.step-dot.active { background: #4f64f8; color: white; }
.step-dot.completed { background: #16a34a; color: white; }
.step-dot.pending { background: #e2e8f0; color: #94a3b8; }
.step-line { flex: 1; height: 2px; background: #e2e8f0; }
.step-line.completed { background: #16a34a; }

/* ====== 演示导航底部栏 ====== */
.demo-nav-bar { position: sticky; bottom: 0; background: white/90; backdrop-filter: blur(8px); border-top: 1px solid #e2e8f0; padding: .75rem 1.5rem; display: flex; align-items: center; justify-content: space-between; }