* { box-sizing: border-box; }
body { font-family: 'Microsoft YaHei', Arial, sans-serif; background: #e8f5f0; margin: 0; }

/* ===== 白云飘动动画 ===== */
@keyframes cloudFloat1 {
  0%   { transform: translateX(0); }
  50%  { transform: translateX(18px); }
  100% { transform: translateX(0); }
}
@keyframes cloudFloat2 {
  0%   { transform: translateX(0); }
  50%  { transform: translateX(-12px); }
  100% { transform: translateX(0); }
}
@keyframes cloudFloat3 {
  0%   { transform: translateX(0) translateY(0); }
  33%  { transform: translateX(10px) translateY(-3px); }
  66%  { transform: translateX(-6px) translateY(2px); }
  100% { transform: translateX(0) translateY(0); }
}

/* ===== 顶部导航 — 青龙绿渐变 ===== */
.topbar {
  background: linear-gradient(90deg, #0a5c3a 0%, #1a9e5c 60%, #22c97a 100%);
  color: #fff;
  height: 56px;
  display: flex;
  align-items: center;
  padding: 0 20px;
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: 0 2px 12px rgba(10,92,58,0.35);
  overflow: hidden;
}

/* 顶栏白云装饰 */
.topbar::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 56'%3E%3Cellipse cx='30' cy='18' rx='22' ry='10' fill='rgba(255,255,255,0.07)'/%3E%3Cellipse cx='22' cy='22' rx='16' ry='8' fill='rgba(255,255,255,0.05)'/%3E%3Cellipse cx='42' cy='22' rx='14' ry='7' fill='rgba(255,255,255,0.05)'/%3E%3Cellipse cx='140' cy='14' rx='18' ry='8' fill='rgba(255,255,255,0.06)'/%3E%3Cellipse cx='133' cy='18' rx='13' ry='6' fill='rgba(255,255,255,0.04)'/%3E%3Cellipse cx='150' cy='18' rx='12' ry='6' fill='rgba(255,255,255,0.04)'/%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-size: 400px 56px;
  pointer-events: none;
  animation: cloudFloat1 8s ease-in-out infinite;
}

.topbar .logo { display: flex; align-items: center; gap: 10px; font-size: 18px; font-weight: 700; text-decoration: none; color: #fff; position: relative; z-index: 1; }
.topbar .logo span { font-size: 24px; }
.topbar .tagline { font-size: 11px; color: #a8e8c8; margin-left: 4px; position: relative; z-index: 1; }
.topbar .nav-links { display: flex; gap: 6px; margin-left: auto; position: relative; z-index: 1; }
.topbar .nav-links a { color: #c8f0de; text-decoration: none; font-size: 13px; padding: 6px 14px; border-radius: 20px; transition: all 0.2s; }
.topbar .nav-links a:hover, .topbar .nav-links a.active { background: rgba(255,255,255,0.2); color: #fff; }
.topbar .user-info { margin-left: 16px; font-size: 12px; color: #a8e8c8; position: relative; z-index: 1; }

/* ===== 主体布局 ===== */
.layout { display: flex; height: calc(100vh - 56px); overflow: hidden; }

/* ===== 左侧边栏 — 深墨绿 + 青山装饰 ===== */
.sidebar {
  width: 220px;
  background: #062a1a;
  color: #fff;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  overflow: hidden;
  position: relative;
}

/* 侧边栏底部青山剪影 */
.sidebar::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 90px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 90' preserveAspectRatio='none'%3E%3Cpath d='M0,90 L0,55 Q15,30 30,50 Q45,65 60,35 Q75,10 90,40 Q105,65 120,30 Q135,5 150,38 Q165,65 180,28 Q195,5 220,42 L220,90 Z' fill='rgba(26,158,92,0.12)'/%3E%3Cpath d='M0,90 L0,68 Q20,50 40,62 Q55,72 70,52 Q85,38 100,58 Q115,72 130,55 Q148,40 165,60 Q182,72 220,55 L220,90 Z' fill='rgba(26,158,92,0.09)'/%3E%3Cpath d='M0,90 L0,76 Q30,65 55,72 Q80,78 105,68 Q130,60 155,70 Q175,78 220,65 L220,90 Z' fill='rgba(26,158,92,0.07)'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
  z-index: 0;
}

.sidebar-header { padding: 14px 16px 10px; border-bottom: 1px solid #1a5c3a; position: relative; z-index: 1; }
.sidebar-header h3 { font-size: 13px; color: #ffd666; font-weight: 700; margin-bottom: 4px; }
.sidebar-header p { font-size: 11px; color: #5ab88a; }
.live-dot { display: inline-block; width: 7px; height: 7px; background: #52c41a; border-radius: 50%; margin-right: 5px; animation: blink 1.2s infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.3} }

/* ===== 日历组件 ===== */
.cal-widget {
  padding: 14px 12px 10px;
  border-bottom: 1px solid #1a5c3a;
  background: #031a0e;
  border: 1.5px solid #1a5c3a;
  border-radius: 12px;
  margin: 8px 8px 0;
  box-shadow: 0 0 0 1px rgba(26,158,92,0.18), inset 0 1px 0 rgba(255,255,255,0.05), 0 4px 16px rgba(0,0,0,0.5);
  position: relative;
  overflow: hidden;
  z-index: 1;
}

/* 日历桃花背景插图容器（保留原有结构，仅调整色调） */
.cal-peach-bg {
  position: absolute;
  top: 0; right: 0;
  width: 100%; height: 100%;
  pointer-events: none;
  z-index: 0;
  opacity: 0.55;
}
.peach-svg {
  position: absolute;
  top: -10px; right: -10px;
  width: 108%; height: 108%;
}

/* 枝干摇曳动画 */
@keyframes branchSway {
  0%   { transform-origin: bottom center; transform: rotate(0deg); }
  30%  { transform-origin: bottom center; transform: rotate(1.8deg); }
  70%  { transform-origin: bottom center; transform: rotate(-1.2deg); }
  100% { transform-origin: bottom center; transform: rotate(0deg); }
}
/* 花朵微颤 */
@keyframes flowerSway {
  0%,100% { transform: rotate(0deg) scale(1); }
  40%     { transform: rotate(3deg) scale(1.04); }
  70%     { transform: rotate(-2deg) scale(0.97); }
}
/* 落花飘动 */
@keyframes petalFloat {
  0%   { transform: translateY(0) rotate(-30deg) ; opacity: 0.5; }
  50%  { transform: translateY(-6px) rotate(-20deg); opacity: 0.65; }
  100% { transform: translateY(0) rotate(-30deg); opacity: 0.5; }
}

.branch-main  { animation: branchSway 5s ease-in-out infinite; }
.branch-r1    { animation: branchSway 5.5s ease-in-out infinite 0.3s; }
.branch-l1    { animation: branchSway 6s ease-in-out infinite 0.6s; }
.branch-r2    { animation: branchSway 5.2s ease-in-out infinite 0.1s; }
.branch-l2    { animation: branchSway 5.8s ease-in-out infinite 0.4s; }
.flower-g1    { animation: flowerSway 4.5s ease-in-out infinite; transform-origin: 100px 160px; }
.flower-g2    { animation: flowerSway 5s ease-in-out infinite 0.8s; transform-origin: 145px 160px; }
.flower-g3    { animation: flowerSway 5.3s ease-in-out infinite 1.2s; transform-origin: 28px 190px; }
.petal-fall1  { animation: petalFloat 4s ease-in-out infinite; }
.petal-fall2  { animation: petalFloat 5s ease-in-out infinite 1s; }
.petal-fall3  { animation: petalFloat 4.5s ease-in-out infinite 2s; }

/* 日历内容层 */
.cal-clock, .cal-date, .cal-lunar, .cal-nav, .cal-table { position: relative; z-index: 1; }

.cal-clock { font-size: 26px; font-weight: 700; color: #fff; letter-spacing: 2px; line-height: 1; margin-bottom: 4px; text-shadow: 0 2px 8px rgba(0,0,0,0.9), 0 0 16px rgba(26,220,120,0.5); }
.cal-date { font-size: 12px; color: #fff; margin-bottom: 2px; text-shadow: 0 1px 6px rgba(0,0,0,0.95); font-weight: 600; }
.cal-lunar { font-size: 11px; color: #ffe066; margin-bottom: 8px; text-shadow: 0 1px 5px rgba(0,0,0,0.9); font-weight: 600; }
.cal-nav { display: flex; align-items: center; margin-bottom: 6px; }
.cal-month-label { font-size: 12px; color: #fff; flex: 1; text-shadow: 0 1px 5px rgba(0,0,0,0.9); font-weight: 600; }
.cal-btn { background: none; border: none; color: #7ee8b0; cursor: pointer; font-size: 13px; padding: 0 4px; line-height: 1; }
.cal-btn:hover { color: #fff; }

/* 日历表格 */
.cal-table { width: 100%; border-collapse: collapse; font-size: 10px; }
.cal-table th { color: #fff; text-align: center; padding: 3px 0; font-weight: 600; font-size: 11px; text-shadow: 0 1px 5px rgba(0,0,0,0.9); }
.cal-table td { text-align: center; padding: 2px 0; cursor: pointer; border-radius: 4px; transition: background 0.15s; background: transparent; }
.cal-table td:hover:not(.cal-today) { background: rgba(26,158,92,0.3); }
.cal-table td .cal-day {
  font-size: 12px;
  color: #ffffff;
  line-height: 1.4;
  font-weight: 700;
  text-shadow: 0 1px 3px rgba(0,0,0,1), 0 0 6px rgba(0,0,0,0.9);
}
.cal-table td .cal-lunarday {
  font-size: 9px;
  color: #ffe8a0;
  line-height: 1;
  text-shadow: 0 1px 3px rgba(0,0,0,0.95);
}
.cal-table td.cal-today { background: rgba(26,158,92,0.85); border-radius: 5px; box-shadow: 0 2px 8px rgba(26,158,92,0.6); }
.cal-table td.cal-today .cal-day { color: #fff; font-weight: 700; font-size: 13px; text-shadow: none; }
.cal-table td.cal-today .cal-lunarday { color: #ccf5e0; text-shadow: none; }
.cal-table td.cal-other { opacity: 0.35; }
.cal-table td.cal-weekend .cal-day { color: #ffd06e; }

/* ===== 采购商滚动 ===== */
.scroll-container { flex: 1; overflow: hidden; position: relative; z-index: 1; }
.scroll-track { animation: scrollUp 30s linear infinite; }
.scroll-track:hover { animation-play-state: paused; }
@keyframes scrollUp { 0%{transform:translateY(0)} 100%{transform:translateY(-50%)} }
.buyer-card { padding: 10px 14px; border-bottom: 1px solid #0d3a22; cursor: pointer; transition: background 0.2s; }
.buyer-card:hover { background: #0d3a22; }
.buyer-card .name { font-size: 12px; font-weight: 600; color: #c8f0de; }
.buyer-card .detail { font-size: 11px; color: #5ab88a; margin-top: 3px; line-height: 1.5; }
.buyer-card .amount { font-size: 12px; color: #ffd666; font-weight: 700; margin-top: 3px; }
.buyer-card .time { font-size: 10px; color: #3a7a56; }

/* ===== 主内容区 ===== */
.main { flex: 1; overflow-y: auto; display: flex; flex-direction: column; }

/* ===== 模块导航 ===== */
.module-nav { background: #fff; border-bottom: 1px solid #d4ede2; padding: 0 20px; display: flex; gap: 0; overflow-x: auto; flex-shrink: 0; }
.module-nav button { padding: 14px 18px; font-size: 13px; font-weight: 500; color: #666; border: none; background: none; cursor: pointer; border-bottom: 3px solid transparent; transition: all 0.2s; white-space: nowrap; }
.module-nav button:hover { color: #1a9e5c; }
.module-nav button.active { color: #0a5c3a; border-bottom-color: #1a9e5c; font-weight: 700; }

/* ===== 内容面板 ===== */
.content { flex: 1; padding: 20px; }
.panel { display: none; }
.panel.active { display: block; }

/* ===== 通用卡片 ===== */
.card { background: #fff; border-radius: 10px; padding: 20px; box-shadow: 0 1px 6px rgba(10,92,58,0.08); margin-bottom: 16px; border: 1px solid #d4ede2; }
.card h3 { font-size: 16px; color: #0a5c3a; font-weight: 700; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.section-badge { background: #e6f7ee; color: #1a9e5c; font-size: 11px; padding: 2px 8px; border-radius: 10px; font-weight: 400; }

/* ===== 统计数字 ===== */
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.stat-box { background: #f0faf5; border-radius: 8px; padding: 16px; text-align: center; border: 1px solid #b7e8ce; }
.stat-box .num { font-size: 28px; font-weight: 900; color: #1a9e5c; }
.stat-box .label { font-size: 12px; color: #666; margin-top: 4px; }

/* ===== 市场数据 ===== */
.market-tabs { display: flex; gap: 8px; margin-bottom: 16px; }
.market-tab { padding: 7px 18px; border-radius: 20px; font-size: 13px; border: 1px solid #d4ede2; background: #fff; cursor: pointer; transition: all 0.2s; }
.market-tab.active { background: #1a9e5c; color: #fff; border-color: #1a9e5c; }
.chart-wrap { height: 260px; position: relative; }
.market-list { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.market-item { background: #f5fdf8; border-radius: 8px; padding: 14px; border-left: 3px solid #1a9e5c; }
.market-item .title { font-size: 13px; font-weight: 600; color: #0a5c3a; }
.market-item .price { font-size: 18px; font-weight: 900; color: #f5222d; margin: 6px 0; }
.market-item .trend { font-size: 11px; color: #52c41a; }
.market-item .source { font-size: 10px; color: #999; margin-top: 4px; }

/* ===== 工具箱 ===== */
.tool-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.tool-card { border: 2px solid #d4ede2; border-radius: 10px; padding: 20px; text-align: center; cursor: pointer; transition: all 0.25s; background: #fff; }
.tool-card:hover { border-color: #1a9e5c; box-shadow: 0 4px 16px rgba(26,158,92,0.15); transform: translateY(-2px); }
.tool-card .icon { font-size: 40px; margin-bottom: 10px; }
.tool-card h4 { font-size: 15px; color: #0a5c3a; font-weight: 700; margin-bottom: 6px; }
.tool-card p { font-size: 12px; color: #888; line-height: 1.6; }
.tool-card .tag { display: inline-block; background: #e6f7ee; color: #1a9e5c; font-size: 11px; padding: 2px 10px; border-radius: 10px; margin-top: 10px; }

/* ===== 表单区域 ===== */
.form-area { background: #f5fdf8; border-radius: 8px; padding: 16px; margin-top: 16px; }
.form-area label { font-size: 12px; color: #666; display: block; margin-bottom: 4px; margin-top: 10px; }
.form-area input, .form-area textarea, .form-area select { width: 100%; border: 1px solid #b7e8ce; border-radius: 6px; padding: 8px 12px; font-size: 13px; outline: none; transition: border 0.2s; }
.form-area input:focus, .form-area textarea:focus { border-color: #1a9e5c; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.btn-gen { background: #1a9e5c; color: #fff; border: none; padding: 10px 28px; border-radius: 6px; font-size: 14px; font-weight: 600; cursor: pointer; margin-top: 14px; transition: all 0.2s; }
.btn-gen:hover { background: #0a5c3a; }

/* ===== 文档处理 ===== */
.upload-zone { border: 2px dashed #7ed4a8; border-radius: 10px; padding: 40px; text-align: center; cursor: pointer; transition: all 0.2s; background: #f0faf5; }
.upload-zone:hover { border-color: #1a9e5c; background: #e6f7ee; }
.upload-zone .icon { font-size: 48px; margin-bottom: 12px; }
.upload-zone p { color: #666; font-size: 14px; }
.convert-btns { display: flex; gap: 12px; margin-top: 16px; flex-wrap: wrap; }
.btn-convert { padding: 10px 24px; border-radius: 6px; font-size: 13px; font-weight: 600; cursor: pointer; border: none; transition: all 0.2s; }
.btn-word { background: #2b5eb3; color: #fff; }
.btn-pdf { background: #e53935; color: #fff; }
.btn-upload { background: #1a9e5c; color: #fff; }

/* ===== 付费套餐 ===== */
.pricing-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.pricing-card { border: 2px solid #d4ede2; border-radius: 12px; padding: 24px 18px; text-align: center; transition: all 0.25s; background: #fff; position: relative; }
.pricing-card.hot { border-color: #1a9e5c; box-shadow: 0 4px 20px rgba(26,158,92,0.18); }
.pricing-card .hot-badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: #1a9e5c; color: #fff; font-size: 11px; padding: 3px 14px; border-radius: 10px; white-space: nowrap; }
.pricing-card h4 { font-size: 16px; font-weight: 700; color: #0a5c3a; margin-bottom: 10px; }
.pricing-card .price { font-size: 36px; font-weight: 900; color: #f5222d; }
.pricing-card .price span { font-size: 14px; color: #999; font-weight: 400; }
.pricing-card ul { text-align: left; margin: 14px 0; padding: 0; list-style: none; }
.pricing-card ul li { font-size: 12px; color: #555; padding: 4px 0; border-bottom: 1px solid #f5f5f5; }
.pricing-card ul li::before { content: "✅ "; }
.btn-buy { width: 100%; padding: 10px; border-radius: 6px; font-size: 14px; font-weight: 700; cursor: pointer; border: none; margin-top: 10px; transition: all 0.2s; }
.btn-buy-primary { background: #1a9e5c; color: #fff; }
.btn-buy-outline { background: #fff; color: #1a9e5c; border: 2px solid #1a9e5c !important; }

/* ===== 支付弹窗 ===== */
.qr-modal { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.5); z-index: 999; align-items: center; justify-content: center; }
.qr-modal.show { display: flex; }
.qr-box { background: #fff; border-radius: 16px; padding: 32px 40px; text-align: center; }
.qr-box h3 { color: #0a5c3a; font-size: 18px; font-weight: 700; margin-bottom: 6px; }
.qr-box p { color: #666; font-size: 13px; margin-bottom: 16px; }
.qr-placeholder { width: 180px; height: 180px; background: #f0faf5; border: 2px dashed #1a9e5c; border-radius: 10px; display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; font-size: 13px; color: #1a9e5c; }
.btn-close { background: #f5f5f5; color: #666; border: none; padding: 8px 24px; border-radius: 6px; cursor: pointer; font-size: 14px; }

/* ===== 微龙对话 ===== */
.chat-wrap { display: flex; flex-direction: column; height: 520px; }
.chat-header { background: linear-gradient(90deg, #0a5c3a, #1a9e5c); color: #fff; padding: 14px 18px; border-radius: 10px 10px 0 0; display: flex; align-items: center; gap: 10px; }
.chat-header .avatar { width: 36px; height: 36px; background: rgba(255,255,255,0.2); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 20px; }
.chat-header .info h4 { font-size: 14px; font-weight: 700; }
.chat-header .info p { font-size: 11px; color: #a8e8c8; }
.chat-header .status { margin-left: auto; display: flex; align-items: center; gap: 6px; font-size: 12px; color: #52c41a; }
.chat-messages { flex: 1; overflow-y: auto; padding: 16px; background: #f5fdf8; border: 1px solid #d4ede2; display: flex; flex-direction: column; gap: 12px; }
.msg { display: flex; gap: 10px; max-width: 85%; }
.msg.user { align-self: flex-end; flex-direction: row-reverse; }
.msg .avatar { width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 16px; }
.msg.bot .avatar { background: linear-gradient(135deg, #0a5c3a, #1a9e5c); color: #fff; }
.msg.user .avatar { background: #52c41a; color: #fff; }
.msg .bubble { padding: 10px 14px; border-radius: 12px; font-size: 13px; line-height: 1.7; }
.msg.bot .bubble { background: #fff; color: #333; border: 1px solid #d4ede2; border-radius: 2px 12px 12px 12px; }
.msg.user .bubble { background: #1a9e5c; color: #fff; border-radius: 12px 2px 12px 12px; }
.chat-input-area { display: flex; gap: 10px; padding: 12px; background: #fff; border: 1px solid #d4ede2; border-top: none; border-radius: 0 0 10px 10px; }
.chat-input { flex: 1; border: 1px solid #b7e8ce; border-radius: 20px; padding: 10px 16px; font-size: 13px; outline: none; resize: none; height: 42px; }
.chat-input:focus { border-color: #1a9e5c; }
.btn-send { background: #1a9e5c; color: #fff; border: none; border-radius: 20px; padding: 0 20px; font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.2s; white-space: nowrap; }
.btn-send:hover { background: #0a5c3a; }
.btn-send:disabled { background: #d9d9d9; cursor: not-allowed; }
.typing { display: flex; gap: 4px; padding: 10px 14px; }
.typing span { width: 8px; height: 8px; background: #1a9e5c; border-radius: 50%; animation: typing 1s infinite; }
.typing span:nth-child(2) { animation-delay: 0.2s; }
.typing span:nth-child(3) { animation-delay: 0.4s; }
@keyframes typing { 0%,60%,100%{transform:translateY(0)} 30%{transform:translateY(-6px)} }
.agent-tool-bar { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 8px; }
.agent-tool-tag { display: inline-flex; align-items: center; gap: 3px; background: #e6f7ee; color: #1a9e5c; border: 1px solid #7ed4a8; border-radius: 12px; padding: 2px 10px; font-size: 11px; font-weight: 500; animation: toolPop 0.2s ease; }
@keyframes toolPop { from{transform:scale(0.8);opacity:0} to{transform:scale(1);opacity:1} }
.agent-reply-text { line-height: 1.7; }
.chat-header .version-tag { font-size: 10px; background: rgba(255,255,255,0.2); border-radius: 8px; padding: 2px 7px; margin-left: 6px; color: #c8f0de; }

/* ===== 任务模块 ===== */
.task-list { display: flex; flex-direction: column; gap: 8px; }
.task-item { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: #f5fdf8; border-radius: 8px; border: 1px solid #d4ede2; }
.task-item input[type=checkbox] { width: 18px; height: 18px; accent-color: #1a9e5c; flex-shrink: 0; }
.task-item .task-name { flex: 1; font-size: 14px; }
.task-item .task-name.done { text-decoration: line-through; color: #bbb; }
.task-item .priority { font-size: 11px; padding: 2px 8px; border-radius: 10px; }
.p-high { background: #fff1f0; color: #f5222d; }
.p-mid { background: #fffbe6; color: #d48806; }
.p-low { background: #f6ffed; color: #52c41a; }
.btn-add-task { background: #f0faf5; color: #1a9e5c; border: 1px dashed #7ed4a8; border-radius: 8px; padding: 10px; width: 100%; font-size: 13px; cursor: pointer; margin-top: 8px; transition: all 0.2s; }
.btn-add-task:hover { background: #e6f7ee; }

/* ===== Agent广场 ===== */
.agent-cat-btn { padding:6px 16px;border-radius:20px;font-size:12px;border:1px solid #d4ede2;background:#fff;cursor:pointer;transition:all 0.2s;white-space:nowrap; }
.agent-cat-btn:hover { border-color:#1a9e5c;color:#1a9e5c; }
.agent-cat-btn.active { background:#1a9e5c;color:#fff;border-color:#1a9e5c; }
.agent-card { background:#fff;border:2px solid #d4ede2;border-radius:14px;padding:20px;cursor:pointer;transition:all 0.25s;position:relative;overflow:hidden; }
.agent-card:hover { border-color:#1a9e5c;box-shadow:0 6px 24px rgba(26,158,92,0.16);transform:translateY(-3px); }
.agent-card::before { content:'';position:absolute;top:0;left:0;right:0;height:3px; }
.agent-card.cat-write::before { background:linear-gradient(90deg,#722ed1,#9254de); }
.agent-card.cat-data::before  { background:linear-gradient(90deg,#1a9e5c,#52d68a); }
.agent-card.cat-biz::before   { background:linear-gradient(90deg,#fa8c16,#ffc53d); }
.agent-card.cat-code::before  { background:linear-gradient(90deg,#389e0d,#73d13d); }
.agent-card.cat-ops::before   { background:linear-gradient(90deg,#d4380d,#ff7a45); }
.agent-card .a-icon { font-size:36px;margin-bottom:10px; }
.agent-card .a-name { font-size:15px;font-weight:700;color:#0a5c3a;margin-bottom:6px; }
.agent-card .a-desc { font-size:12px;color:#888;line-height:1.6;margin-bottom:12px; }
.agent-card .a-tags { display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px; }
.agent-card .a-tag  { font-size:11px;background:#f0faf5;color:#1a9e5c;padding:2px 9px;border-radius:10px; }
.agent-card .a-btn  { width:100%;padding:9px;background:#1a9e5c;color:#fff;border:none;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;transition:all 0.2s; }
.agent-card .a-btn:hover { background:#0a5c3a; }
.agent-card .a-badge { position:absolute;top:14px;right:14px;font-size:10px;padding:2px 8px;border-radius:10px; }
.badge-free { background:#f6ffed;color:#52c41a;border:1px solid #b7eb8f; }
.badge-hot  { background:#fff2e8;color:#fa8c16;border:1px solid #ffd591; }
.badge-new  { background:#f9f0ff;color:#722ed1;border:1px solid #d3adf7; }
.agent-msg { display:flex;gap:10px;max-width:86%; }
.agent-msg.user { align-self:flex-end;flex-direction:row-reverse; }
.agent-msg .av { width:32px;height:32px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:16px; }
.agent-msg.bot .av  { background:linear-gradient(135deg,#0a5c3a,#1a9e5c);color:#fff; }
.agent-msg.user .av { background:#52c41a;color:#fff; }
.agent-msg .bbl { padding:10px 14px;border-radius:12px;font-size:13px;line-height:1.75;white-space:pre-wrap; }
.agent-msg.bot .bbl  { background:#fff;color:#333;border:1px solid #d4ede2;border-radius:2px 12px 12px 12px; }
.agent-msg.user .bbl { background:#1a9e5c;color:#fff;border-radius:12px 2px 12px 12px; }
.agent-typing-bbl { padding:10px 14px;background:#fff;border:1px solid #d4ede2;border-radius:2px 12px 12px 12px;display:flex;gap:5px;align-items:center; }
.agent-typing-bbl span { width:7px;height:7px;background:#1a9e5c;border-radius:50%;animation:typing 1s infinite; }
.agent-typing-bbl span:nth-child(2){animation-delay:.2s} .agent-typing-bbl span:nth-child(3){animation-delay:.4s}
.quick-hint { padding:5px 12px;background:#f0faf5;color:#1a9e5c;border:1px solid #b7e8ce;border-radius:14px;font-size:12px;cursor:pointer;white-space:nowrap;transition:all 0.2s; }
.quick-hint:hover { background:#e6f7ee; }

/* ===== 响应式 ===== */
@media(max-width:900px) {
  .sidebar { display: none; }
  .stat-grid { grid-template-columns: repeat(2,1fr); }
  .tool-grid { grid-template-columns: 1fr 1fr; }
  .pricing-grid { grid-template-columns: 1fr 1fr; }
  .market-list { grid-template-columns: 1fr; }
}