/* Matching Page Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans CJK SC", "PingFang SC", "Microsoft YaHei", Helvetica, Arial, sans-serif;
    background: #f7f7f8;
    height: 100vh;
    overflow: hidden;
}

.app-container {
    display: flex;
    height: 100vh;
}

/* === 左侧边栏 (20%) === */
.sidebar {
    width: 0;
    background: #f9f9f9;
    border-right: none;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    overflow: hidden;
    transition: width 150ms ease-out;
}

.sidebar.open {
    width: 260px;
    border-right: 1px solid #e5e5e5;
}

/* v4-11 (2026-07-13): sidebar no longer collapses on welcome screen —
   want list is the primary /matching view. Resource panel still hides
   until matching starts (see rule below). */

/* Resource panel hidden on welcome screen — they are siblings under .main-content */
body.matching-welcome .resource-panel {
    display: none;
}

/* The activity log and status bar describe an active match, not the welcome
   form. Hiding them in welcome mode keeps their flex space and hit area from
   covering the CTA when the form content is taller than a short viewport. */
body.matching-welcome .advisor-activity-log,
body.matching-welcome .matching-status {
    display: none;
}

/* fix(#110) 2026-07-17: 兜底规则 — 不依赖 body.matching-welcome 类.
   之前的修复 #96 只在 body.matching-welcome 时隐藏 sibling, 但如果
   showResourcePanelView → showWelcomeView 中间态、或旧 CSS 缓存、
   initMatchingPage 之前 resourcePanel.style.display 已内联 display:none,
   body class 短暂缺失时, sibling 仍然占据 fixed 区域 (底部 73px =
   activity-log 29px + matching-status 44px), 把溢出到下方的 CTA 按钮
   覆盖掉. 使用 :has() 直接检测 .main-content 是否含可见 welcome-screen
   + 不可见 resource-panel (即当前展示的是 welcome 视图), 双条件成立时
   强制隐藏 sibling activity-log / matching-status. 这是 body class
   兜底, 二者任一命中即生效. */
.main-content:has(> .welcome-screen:not([style*="display: none"])):has(> .resource-panel[style*="display: none"]) > .advisor-activity-log,
.main-content:has(> .welcome-screen:not([style*="display: none"])):has(> .resource-panel[style*="display: none"]) > .matching-status {
    display: none !important;
}

.sidebar-toggle {
    position: fixed;
    top: 12px;
    left: 12px;
    z-index: 100;
    width: 36px;
    height: 36px;
    background: white;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: #555;
    transition: left 0.3s ease, background 0.2s, box-shadow 0.2s;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.sidebar-toggle:hover {
    background: #f0f0f0;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

/* Sidebar 打开时把 toggle 按钮推到 sidebar 右边缘内侧 (260 - 36 - 8 = 216) */
body.sidebar-open .sidebar-toggle {
    left: 216px;
}

/* Sidebar 收起时给主区域顶部内容留出 toggle 按钮的位置 (12+36+8 = 56px) */
body:not(.sidebar-open) .resource-panel-header {
    padding-left: 56px;
}

body:not(.sidebar-open) .welcome-screen.matching-mode {
    padding-left: 56px;
}

.sidebar-header {
    padding: 12px 16px;
    border-bottom: 1px solid #e5e5e5;
}

.new-chat-btn {
    width: 100%;
    padding: 10px 16px;
    background: white;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    color: #2d333a;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 8px;
}

.new-chat-btn:hover {
    background: #f0f0f0;
}

.sidebar-sections {
    flex: 1;
    overflow-y: auto;
    padding: 12px 0 8px 0;
}

.section-header {
    padding: 8px 16px;
    font-size: 12px;
    font-weight: 600;
    color: #8e8ea0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.conversation-item {
    padding: 8px 12px;
    cursor: pointer;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    transition: background 0.2s;
    position: relative;
}

.conversation-item:hover {
    background: #e8e8e8;
}

.conversation-item.active {
    background: #dbeafe;
    border-left: 3px solid #2563eb;
    padding-left: 9px;  /* Adjust for border */
}

.conversation-item:hover .delete-conversation-btn {
    opacity: 1;
}

.delete-conversation-btn {
    opacity: 0;
    width: 20px;
    height: 20px;
    padding: 0;
    background: transparent;
    border: none;
    color: #ef4444;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.2s;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.delete-conversation-btn:hover {
    background: #fee2e2;
    border-radius: 4px;
}

/* === Conversation List (simple, debuggable) === */
.conv-item {
    padding: 10px 16px;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f0;
    /* Scope absolutely-positioned .conv-actions (delete btn overlay) to this item.
       Without position:relative the action button anchors to the viewport's
       containing block and renders at screen top-right. Lost during the
       advisor-shared.css → matching.css split (commit e2cd7ae). */
    position: relative;
}
/* Reserve room on the right of the meta line + title row so the
   absolutely-positioned .conv-actions (delete btn at right:8px, w=22)
   doesn't visually collide with either on narrow screens
   (260px sidebar). .conv-item-header is already flex with .conv-item-title
   {flex:1; min-width:0; overflow:hidden}, but the absolutely-positioned
   actions sibling wouldn't be subtracted by flexbox. Explicit padding
   constrains the title's natural width so its ellipsis kicks in BEFORE
   the action overlay's footprint. */
.conv-item-meta {
    padding-right: 30px;
}
.conv-item-header {
    padding-right: 30px;
}
.conv-item:hover { background: #e8e8e8; }
.conv-item.active { background: #dbeafe; border-left: 3px solid #2563eb; padding-left: 13px; }

/* fix(#100) 2026-07-16: 「现实性」信号 chips + 过期资源视觉降权.
   设计原则:
     - chip 高度小 (11px font-size), 横向 flex 排列, 行内换行
     - 区分色: 时钟=灰 / 认证=绿 / 响应=蓝 / 浏览=浅蓝 / 信任=紫 / 过期=橙
     - .conv-item-stale → opacity 0.55, 边框淡化 (不影响布局, 仅视觉降权)
     - chip line 单行最多 2 个换行 (260px sidebar 可显示 4-5 个) */
.conv-item-signals {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 4px;
    padding-right: 30px;
    line-height: 1;
}
.signal-chip {
    display: inline-flex;
    align-items: center;
    font-size: 11px;
    padding: 2px 6px;
    border-radius: 10px;
    background: #f3f4f6;
    color: #4b5563;
    white-space: nowrap;
    flex-shrink: 0;
    line-height: 1.2;
}
.signal-chip-time { background: #f3f4f6; color: #4b5563; }
.signal-chip-auth { background: #ecfdf5; color: #047857; }
.signal-chip-active { background: #eff6ff; color: #1d4ed8; }
.signal-chip-idle { background: #fef3c7; color: #b45309; }
.signal-chip-views { background: #f0f9ff; color: #0369a1; }
.signal-chip-trust { background: #f5f3ff; color: #6d28d9; }
.signal-chip-stale { background: #fff7ed; color: #c2410c; }

.conv-item-stale {
    opacity: 0.55;
    filter: grayscale(0.5);
    border-left: 3px solid transparent;
}
.conv-item-stale:hover {
    opacity: 0.85;
}

/* Private (未发布) 资源：灰显 + "未发布" 徽标。仅用于左侧需求列表。 */
.conv-item-private .conv-item-title { color: #9ca3af; }
.conv-item-private .conv-item-meta { color: #cbd5e1; }
.conv-item-private .conv-item-private-badge {
    display: inline-block;
    font-size: 10px;
    padding: 1px 6px;
    border-radius: 8px;
    background: #f1f5f9;
    color: #64748b;
    font-weight: 500;
    flex-shrink: 0;
}
.conv-item-header { display: flex; align-items: center; gap: 6px; }
.conv-item-title {
    font-size: 14px;
    font-weight: 500;
    color: #2d333a;
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.conv-item-id {
    font-size: 12px;
    color: #6b7280;
    font-weight: 600;
    flex-shrink: 0;
}
.conv-item-meta {
    font-size: 12px;
    color: #8e8ea0;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.conv-item-time {
    font-size: 11px;
    color: #8e8ea0;
}
.conv-item-badges {
    float: right;
    display: flex;
    gap: 4px;
    align-items: center;
}
.conv-child {
    padding: 8px 16px 8px 40px;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f0;
    border-left: 2px solid #e5e5e5;
    margin-left: 16px;
    /* Scope absolutely-positioned .conv-actions to this child row
       (same fix as .conv-item; see commit e2cd7ae regression note). */
    position: relative;
}
.conv-child:hover { background: #e8e8e8; }
.conv-child.active { background: #dbeafe; border-left-color: #2563eb; }
.conv-children { display: none; }
.conv-children.expanded { display: block; }
.conv-toggle {
    display: inline-block;
    width: 14px;
    font-size: 10px;
    color: #8e8ea0;
    cursor: pointer;
    transition: transform 0.2s;
    user-select: none;
}
.conv-toggle.expanded { transform: rotate(90deg); }
.conv-toggle.no-children { visibility: hidden; }
.conv-actions {
    float: right;
    display: none;
}
.conv-item:hover .conv-actions,
.conv-child:hover .conv-actions { display: inline-block; }
.conv-action-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 13px;
    padding: 2px 4px;
}
.conv-action-btn:hover { background: #fee2e2; border-radius: 4px; }

.child-count-badge {
    font-size: 10px;
    background: #e5e5e5;
    color: #666;
    padding: 2px 6px;
    border-radius: 10px;
    margin-left: 6px;
    flex-shrink: 0;
}

/* 未读消息徽章 */
.unread-badge {
    font-size: 10px;
    background: #ef4444;
    color: white;
    padding: 2px 6px;
    border-radius: 10px;
    margin-left: 6px;
    flex-shrink: 0;
    font-weight: 600;
}

/* 2026-06-21: 未读商机数 chip — 显示在 sidebar 每个 demand 旁。
   与 getNext() 列表口径完全一致 (见 _query_partner_counts 的 JOIN + 4 filters),
   0 时不渲染,首次出现时短暂 pulse 提示。 */
.demand-pending-badge {
    font-size: 11px;
    background: #ef4444;
    color: #ffffff;
    padding: 2px 8px;
    border-radius: 10px;
    margin-left: 8px;
    flex-shrink: 0;
    font-weight: 700;
    min-width: 18px;
    text-align: center;
    display: inline-block;
    box-shadow: 0 1px 3px rgba(239, 68, 68, 0.4);
}
.demand-pending-badge.pulse {
    animation: demand-pending-pulse 0.7s ease-out 1;
}
@keyframes demand-pending-pulse {
    0%   { transform: scale(1); box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7); }
    50%  { transform: scale(1.35); box-shadow: 0 0 0 6px rgba(239, 68, 68, 0); }
    100% { transform: scale(1); box-shadow: 0 1px 3px rgba(239, 68, 68, 0.4); }
}

/* 对话项悬停操作按钮.
   之前: opacity:0 + pointer-events:none (默认) → hover 触发 → opacity:1 + pointer-events:auto.
   问题: hover-only 在触屏设备上根本无法触发 (触屏 UA 大都不发 :hover),
         pointer-events:none 又把点击直接穿透到父 conv-item 的 onclick (selectDemand),
         移动端用户根本没有删除入口 — 复现在 test_delete_interaction.py T2.
   现改为: 默认轻度可见 (opacity:.4) + pointer-events:auto, 任何设备都能点到;
           仅在 @media (hover: hover) 的设备 (鼠标/笔) 上才隐藏到 opacity:0,
           hover 触发后恢复 opacity:1. */
.conv-actions {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    /* Default state — touch-friendly: always clickable, visibly subtle. */
    opacity: 0.4;
    pointer-events: auto;
    transition: opacity 0.15s;
    display: flex;
    gap: 4px;
    z-index: 10;
}
/* Hover-capable devices (mouse / stylus): hide until the user shows intent,
   matching the pre-fix desktop appearance so we don't visually clutter
   the sidebar list when the user is just scanning. */
@media (hover: hover) {
    .conv-actions {
        opacity: 0;
        pointer-events: none;
    }
    .conv-item:hover .conv-actions,
    .conv-child:hover .conv-actions {
        opacity: 1;
        pointer-events: auto;
    }
}
.conv-action-btn {
    width: 22px;
    height: 22px;
    border-radius: 4px;
    border: none;
    background: rgba(0,0,0,0.06);
    color: #666;
    cursor: pointer;
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
}
.conv-action-btn:hover {
    background: rgba(239, 68, 68, 0.15);
    color: #ef4444;
}

/* 底部用户信息 */
.sidebar-footer {
    padding: 12px 16px;
    border-top: 1px solid #e5e5e5;
    display: flex;
    align-items: center;
    gap: 10px;
}

.user-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 14px;
    font-weight: 600;
    flex-shrink: 0;
}

.user-info {
    flex: 1;
    min-width: 0;
}

.user-name {
    font-size: 14px;
    font-weight: 500;
    color: #2d333a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user-status {
    font-size: 12px;
    color: #8e8ea0;
}

.login-button {
    flex: 1;
    padding: 8px 16px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: opacity 0.2s;
}

.login-button:hover {
    opacity: 0.9;
}

/* === 右侧主区域 (80%) === */
.main-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: white;
    position: relative;
    min-height: 0; /* 防止flex子项溢出 */
    overflow: hidden; /* 确保容器不溢出 */
}

/* fix(#110) 2026-07-17: 给 welcome-screen 自己的 stacking context.
   之前只有 .start-btn 自己 z-index:10 — 但 .welcome-screen 本身 z-index:auto,
   在 .main-content 父堆叠上下文里, 后续 sibling (activity-log + matching-status)
   即使没有 z-index, 也会按 DOM 顺序后渲染, 把欢迎界面尾部 CTA (按钮 / 上传
   chip 等) 盖住. 提早定义 .welcome-screen z-index:2 + 给 sibling
   z-index:0 让 welcome 内容整个盖过它们. 同时也配合 #96 .start-btn 自己的
   z-index:10 兜底 — 双层保险. */
.welcome-screen {
    /* 2026-07-17 访客反馈 (chip 去除后): 保留原 align-items: center 兜底,
       但 .welcome-screen.matching-mode 单独 override 成 stretch.
       这里不动. */
    position: relative;
    z-index: 2;
}

/* fix(#110) 显式让 activity log 和 status bar 处于更低的 stacking level,
   避免 welcome-screen 内部内容 overflow 时被 sibling 后渲染覆盖.
   fix(#118) 2026-07-17: 加 `pointer-events: none` 让 decoration-only 的
   sibling 容器即使在 DOM 里 display:flex, 它们的盒子也不会拦截 CTA 的
   点击区 (elementFromPoint 直接穿透). 内联 #startMatchBtn 上的
   `pointer-events: auto` 是 button-wins 兜底, 任意一个生效即可. */
.advisor-activity-log,
.matching-status {
    position: relative;
    z-index: 0;
    pointer-events: none;
}

/* 欢迎界面 */
.welcome-screen {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
}

.welcome-content {
    max-width: 600px;
    width: 100%;
    text-align: center;
}

.welcome-icon {
    font-size: 64px;
    margin-bottom: 20px;
}

.welcome-title {
    font-size: 32px;
    font-weight: 700;
    color: #2d333a;
    margin-bottom: 12px;
}

.welcome-subtitle {
    font-size: 16px;
    color: #8e8ea0;
    margin-bottom: 40px;
    line-height: 1.6;
}

.input-area {
    margin-bottom: 40px;
}

.welcome-input {
    width: 100%;
    min-height: 120px;
    padding: 16px;
    border: 2px solid #e5e5e5;
    border-radius: 12px;
    font-size: 16px;
    font-family: inherit;
    resize: vertical;
    transition: border-color 0.2s;
}

.welcome-input:focus {
    outline: none;
    border-color: #667eea;
}

.start-btn {
    margin-top: 16px;
    padding: 14px 32px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.2s;
}

.start-btn:hover {
    transform: scale(1.02);
}

.features {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 40px;
}

.feature {
    padding: 20px;
    background: #f7f7f8;
    border-radius: 12px;
    text-align: center;
}

.feature-icon {
    font-size: 32px;
    margin-bottom: 12px;
}

.feature-title {
    font-size: 14px;
    font-weight: 600;
    color: #2d333a;
}

/* 资源类型标签 */
.resource-tags {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-bottom: 32px;
}

.resource-tag {
    padding: 10px 20px;
    background: white;
    border: 2px solid #e5e5e5;
    border-radius: 24px;
    font-size: 15px;
    font-weight: 500;
    color: #2d333a;
    cursor: pointer;
    transition: all 0.2s;
}

.resource-tag:hover {
    border-color: #667eea;
    color: #667eea;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
}

/* #102: additive daily external market feed. It is deliberately separate from
   .resource-panel so external discoveries do not enter the partner/quota queue. */
.market-latest {
    margin: 0 0 28px;
    padding: 16px;
    border: 1px solid #dbe4ff;
    border-radius: 12px;
    background: linear-gradient(135deg, #f7f9ff 0%, #ffffff 100%);
}

.market-latest-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
    color: #1a2332;
}

.market-latest-header strong {
    font-size: 15px;
}

.market-latest-subtitle {
    display: block;
    margin-top: 3px;
    color: #718096;
    font-size: 12px;
}

.market-latest-refresh {
    padding: 5px 10px;
    border: 1px solid #c7d2fe;
    border-radius: 6px;
    background: #fff;
    color: #3b5bdb;
    font-size: 12px;
    cursor: pointer;
}

.market-latest-refresh:hover {
    background: #eef2ff;
}

.market-latest-list {
    display: grid;
    gap: 8px;
}

.market-latest-item {
    padding: 11px 12px;
    border: 1px solid #edf0f7;
    border-radius: 8px;
    background: #fff;
}

.market-latest-item-top {
    display: flex;
    align-items: center;
    gap: 8px;
}

.market-latest-item-title {
    min-width: 0;
    overflow: hidden;
    color: #1f3b8f;
    font-size: 14px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.market-latest-type {
    flex: 0 0 auto;
    padding: 2px 6px;
    border-radius: 999px;
    background: #eef2ff;
    color: #4c51bf;
    font-size: 11px;
}

.market-latest-summary {
    margin: 7px 0 5px;
    overflow: hidden;
    color: #4b5563;
    font-size: 13px;
    line-height: 1.5;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.market-latest-meta,
.market-latest-why {
    color: #7c8799;
    font-size: 11px;
}

.market-latest-meta {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

.market-latest-why {
    margin-top: 5px;
    color: #596b9b;
}

/* === Matching-mode welcome screen === */
.welcome-screen.matching-mode {
    background: #f7f7f8;
    padding: 60px 40px 32px;
    overflow-y: auto;
    /* 2026-07-17 访客反馈: chip 去除后, 让 .welcome-content 撑满高度
       (stretch), button 才能用 margin-top:auto 真的沉到屏幕底部,
       而不是停留在内容中段. 之前 align-items: center + chip 占位时
       button 被挤在 viewport 中部, 桌面端必须 scroll 才能看到 CTA. */
    align-items: stretch;
}

.welcome-screen.matching-mode .welcome-content {
    max-width: 720px;
    /* 2026-07-17: flex column 让 .matching-actions 内的 button (margin-top:auto)
       沉底, textareas 自然保持在顶部. 配合 .welcome-screen 的 stretch align. */
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

/* fix(#135) 2026-07-17: pending_cap 警告横幅 — 全宽 banner,
   顶部一条明显的「amber-50 + amber-200 border + amber-800 text」组合,
   让 over_cap 用户在 welcome 顶部第一眼就看见, 而不用 scroll 找.
   flex 布局: 图标 + 文字 + 跳转按钮, 窄屏 (<= 600px) 切到 column. */
.pending-cap-banner {
    display: flex;
    align-items: center;
    gap: 14px;
    max-width: 720px;
    margin: 0 auto 16px;
    padding: 14px 18px;
    background: #fef3c7;
    border: 1px solid #fcd34d;
    border-radius: 10px;
    color: #92400e;
    box-shadow: 0 2px 6px rgba(146, 64, 14, 0.08);
}
.pending-cap-banner-icon {
    font-size: 24px;
    flex-shrink: 0;
    line-height: 1;
}
.pending-cap-banner-text {
    flex: 1;
    min-width: 0;
}
.pending-cap-banner-title {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 4px;
    line-height: 1.4;
}
.pending-cap-banner-desc {
    font-size: 12px;
    line-height: 1.5;
    opacity: 0.85;
}
.pending-cap-banner-btn {
    flex-shrink: 0;
    display: inline-block;
    padding: 8px 14px;
    background: #92400e;
    color: #ffffff !important;
    border-radius: 6px;
    text-decoration: none !important;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    transition: background 0.2s ease, transform 0.1s ease;
}
.pending-cap-banner-btn:hover {
    background: #78350f;
    transform: translateY(-1px);
}
@media (max-width: 600px) {
    .pending-cap-banner {
        flex-direction: column;
        align-items: flex-start;
    }
    .pending-cap-banner-btn {
        align-self: stretch;
        text-align: center;
    }
}

.welcome-screen.matching-mode .matching-mark {
    font-size: 32px;
    margin-bottom: 16px;
}

.welcome-screen.matching-mode .matching-title {
    font-size: 28px;
    font-weight: 600;
    color: #1a2332;
    margin-bottom: 16px;
    letter-spacing: -0.01em;
}

.welcome-screen.matching-mode .matching-subtitle {
    font-size: 16px;
    color: #5a6478;
    line-height: 1.7;
    margin-bottom: 32px;
}

.welcome-screen.matching-mode .matching-input-row {
    margin-bottom: 16px;
}

.welcome-screen.matching-mode .matching-field-label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #1a2332;
    margin-bottom: 8px;
    letter-spacing: -0.01em;
}

.welcome-screen.matching-mode .matching-input {
    width: 100%;
    min-height: 140px;
    padding: 16px;
    border: 1.5px solid #e5e8ec;
    border-radius: 10px;
    font-size: 15px;
    font-family: inherit;
    line-height: 1.6;
    color: #1a2332;
    background: #ffffff;
    resize: vertical;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.welcome-screen.matching-mode .matching-input:focus {
    outline: none;
    border-color: #3b5bdb;
    box-shadow: 0 0 0 3px rgba(59, 91, 219, 0.08);
}

.welcome-screen.matching-mode .matching-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    /* 2026-07-17 访客反馈: chip 去除后 button 改为沉底,
       margin-top:auto (button 内联) 把 CTA 推到 .welcome-content 底部;
       这里 margin-bottom 留 0, 不再叠加 56px 死区. */
    margin-bottom: 0;
    /* fix(#118) 2026-07-17: 自己的 stacking context, 让内部 CTA (button-wins
       的 z-index 兜底) 永远处于比 sibling (.market-latest / .matching-uploads)
       更高的层序. 配合 .advisor-activity-log / .matching-status 的
       pointer-events: none 形成 button-wins 双层保险. */
    position: relative;
    z-index: 1;
}

.welcome-screen.matching-mode .matching-uploads {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 20px 0 24px;
}

.welcome-screen.matching-mode .upload-chip {
    padding: 8px 14px;
    background: #ffffff;
    border: 1.5px solid #e5e8ec;
    border-radius: 18px;
    color: #1a2332;
    font-size: 13px;
    font-family: inherit;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, transform 0.1s;
}

.welcome-screen.matching-mode .upload-chip:hover {
    border-color: #3b5bdb;
    background: #fafbfd;
}

.welcome-screen.matching-mode .upload-chip:active {
    transform: translateY(1px);
}

/* fix(#57) 2026-07-15: chip 选中态 — 蓝底+对勾, 与 unselected 强对比,
   让多选语义视觉上无歧义, 避免重复点击才发现"原来这是单选覆盖" */
.welcome-screen.matching-mode .upload-chip.selected {
    background: #3b5bdb;
    border-color: #3b5bdb;
    color: #ffffff;
    box-shadow: 0 2px 6px rgba(59, 91, 219, 0.25);
}
.welcome-screen.matching-mode .upload-chip.selected::before {
    content: "✓ ";
    font-weight: 700;
}

/* fix(#57): 已选标签区域 — 紧贴 chip 池下方, 让用户清楚看到分类已就位 */
.welcome-selected-labels {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: -12px 0 20px;
    font-size: 13px;
    color: #4b5563;
}
.welcome-selected-labels-hint {
    color: #6b7280;
    font-size: 12px;
}
.welcome-selected-labels .selected-label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    background: #eef2ff;
    border: 1px solid #c7d2fe;
    border-radius: 14px;
    color: #1e3a8a;
    font-size: 12px;
}
.welcome-selected-labels .selected-label-remove {
    cursor: pointer;
    color: #6b7280;
    font-weight: 700;
    padding: 0 2px;
}
.welcome-selected-labels .selected-label-remove:hover {
    color: #1e3a8a;
}
.welcome-selected-clear {
    padding: 2px 10px;
    background: transparent;
    border: 1px solid #d1d5db;
    border-radius: 12px;
    color: #6b7280;
    font-size: 11px;
    cursor: pointer;
}
.welcome-selected-clear:hover {
    border-color: #9ca3af;
    color: #374151;
}

.welcome-screen.matching-mode .voice-btn {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1.5px solid #e5e8ec;
    background: #ffffff;
    color: #5a6478;
    font-size: 18px;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.welcome-screen.matching-mode .voice-btn:hover {
    border-color: #3b5bdb;
    background: #fafbfd;
}

.welcome-screen.matching-mode .voice-btn:focus-visible {
    outline: none;
    border-color: #3b5bdb;
    box-shadow: 0 0 0 3px rgba(59, 91, 219, 0.12);
}

.welcome-screen.matching-mode .start-btn {
    flex: 1;
    /* Keep the CTA above transient siblings during view transitions. */
    position: relative;
    z-index: 10;
    padding: 12px 24px;
    background: #1a2332;
    color: #ffffff;
    border: none;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, transform 0.1s;
}

.welcome-screen.matching-mode .start-btn:hover:not(:disabled) {
    background: #2d3a4f;
}

.welcome-screen.matching-mode .start-btn:active:not(:disabled) {
    transform: translateY(1px);
}

.welcome-screen.matching-mode .start-btn:disabled {
    /* disabled 状态也保持高亮样式 — 按钮始终传达"可点击"语义 */
    background: #1a2332;
    color: #ffffff;
    cursor: pointer;
    opacity: 1;
}

.welcome-screen.matching-mode .start-btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 91, 219, 0.25);
}

.welcome-screen.matching-mode .asset-discovery {
    margin-top: 8px;
}

.welcome-screen.matching-mode .asset-divider {
    display: flex;
    align-items: center;
    text-align: center;
    color: #8a93a3;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin-bottom: 24px;
}

.welcome-screen.matching-mode .asset-divider::before,
.welcome-screen.matching-mode .asset-divider::after {
    content: '';
    flex: 1;
    border-top: 1px solid #e5e8ec;
}

.welcome-screen.matching-mode .asset-divider span {
    padding: 0 16px;
}

.welcome-screen.matching-mode .asset-group {
    margin-bottom: 20px;
}

.welcome-screen.matching-mode .asset-group-label {
    font-size: 13px;
    font-weight: 600;
    color: #5a6478;
    margin-bottom: 10px;
}

.welcome-screen.matching-mode .asset-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.welcome-screen.matching-mode .asset-chip {
    display: inline-block;
    padding: 8px 16px;
    background: #ffffff;
    border: 1.5px solid #e5e8ec;
    border-radius: 20px;
    font-size: 14px;
    color: #1a2332;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, color 0.15s;
    user-select: none;
}

.welcome-screen.matching-mode .asset-chip:hover {
    border-color: #3b5bdb;
    background: #fafbfd;
    color: #3b5bdb;
}

.welcome-screen.matching-mode .asset-chip:focus-visible {
    outline: none;
    border-color: #3b5bdb;
    box-shadow: 0 0 0 3px rgba(59, 91, 219, 0.12);
}

/* 三段式核心逻辑 */
.welcome-screen.matching-mode .matching-flow {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 4px;
    margin: 32px 0 24px;
    padding: 20px 12px;
    background: #ffffff;
    border: 1px solid #e5e8ec;
    border-radius: 12px;
}

.welcome-screen.matching-mode .flow-step {
    flex: 1;
    text-align: center;
    padding: 4px;
}

.welcome-screen.matching-mode .flow-icon {
    font-size: 28px;
    line-height: 1;
    margin-bottom: 8px;
}

.welcome-screen.matching-mode .flow-label {
    font-size: 14px;
    font-weight: 600;
    color: #1a2332;
    margin-bottom: 4px;
}

.welcome-screen.matching-mode .flow-sub {
    font-size: 12px;
    color: #8a93a3;
    line-height: 1.5;
}

.welcome-screen.matching-mode .flow-arrow {
    align-self: center;
    color: #c5cad3;
    font-size: 18px;
    padding: 0 4px;
    flex: 0 0 auto;
}

/* 欢迎页辅助说明 */
.welcome-screen.matching-mode .matching-hint {
    font-size: 14px;
    line-height: 1.8;
    color: #5a6478;
    text-align: center;
    margin: 0 0 28px;
    padding: 0 8px;
}

@media (max-width: 600px) {
    .welcome-screen.matching-mode .matching-flow {
        flex-direction: column;
        gap: 12px;
    }
    .welcome-screen.matching-mode .flow-arrow {
        transform: rotate(90deg);
    }
}

/* 分析结果界面 */
.analysis-screen {
    flex: 1;
    display: none;
    flex-direction: column;
    padding: 40px;
    overflow-y: auto;
}

.analysis-screen.active {
    display: flex;
}

.analysis-header {
    text-align: center;
    margin-bottom: 40px;
}

.analysis-title {
    font-size: 28px;
    font-weight: 700;
    color: #2d333a;
    margin-bottom: 12px;
}

.analysis-subtitle {
    font-size: 14px;
    color: #8e8ea0;
}

.analysis-content {
    flex: 1;
    background: #f7f7f8;
    border-radius: 12px;
    padding: 32px;
    margin-bottom: 24px;
}

.analysis-section {
    margin-bottom: 24px;
}

.analysis-section-title {
    font-size: 16px;
    font-weight: 600;
    color: #2d333a;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.analysis-section-content {
    font-size: 14px;
    color: #57606a;
    line-height: 1.6;
}

.analysis-actions {
    display: flex;
    gap: 16px;
    justify-content: center;
}

.btn {
    padding: 14px 32px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-secondary {
    background: #f0f0f0;
    color: #2d333a;
}

.btn-secondary:hover {
    background: #e5e5e5;
}

.btn-primary {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
}

.btn-primary:hover {
    transform: scale(1.02);
}

/* Destructive action button (delete confirm). Distinct from .btn-primary
   so it doesn't visually compete with the dialog's primary action. */
.btn-danger {
    background: #dc2626;
    color: white;
}
.btn-danger:hover {
    background: #b91c1c;
}

/* 手机号验证弹窗 */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.modal-overlay.active {
    display: flex;
}

.modal {
    background: white;
    border-radius: 16px;
    padding: 32px;
    width: 90%;
    max-width: 400px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.modal-header {
    text-align: center;
    margin-bottom: 24px;
}

.modal-icon {
    font-size: 48px;
    margin-bottom: 16px;
}

.modal-title {
    font-size: 20px;
    font-weight: 700;
    color: #2d333a;
    margin-bottom: 8px;
}

.modal-description {
    font-size: 14px;
    color: #8e8ea0;
}

.form-group {
    margin-bottom: 20px;
}

.form-label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #2d333a;
    margin-bottom: 8px;
}

.form-input {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e5e5e5;
    border-radius: 8px;
    font-size: 16px;
    font-family: inherit;
    transition: border-color 0.2s;
}

.form-input:focus {
    outline: none;
    border-color: #667eea;
}

.code-input-group {
    display: flex;
    gap: 12px;
}

.code-input-group .form-input {
    flex: 1;
}

.get-code-btn {
    padding: 12px 20px;
    background: #f0f0f0;
    border: 2px solid #e5e5e5;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #2d333a;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s;
}

.get-code-btn:hover:not(:disabled) {
    background: #e5e5e5;
}

.get-code-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.modal-actions {
    display: flex;
    gap: 12px;
    margin-top: 24px;
}

.modal-actions .btn {
    flex: 1;
    padding: 12px;
    font-size: 14px;
}

/* 聊天区域（登录后） */
.chat-screen {
    flex: 1;
    display: none;
    flex-direction: column;
    min-height: 0; /* 防止flex子项溢出 */
    overflow: hidden; /* 确保容器不溢出 */
}

/* === Split-panel chat layout === */
.chat-main-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    position: relative;
    transition: all 0.3s ease;
}

/* Center panel: resource cards */
.resource-panel {
    flex: 1;
    min-width: unset;
    overflow: hidden;
    border-right: none;
    border-bottom: 1px solid #e5e5e5;
    background: #fafbfc;
    display: flex;
    flex-direction: column;
    position: relative;
}

.resource-panel.has-iframe {
    min-width: 400px;
}

/* Chat drawer overlays resource panel when expanded */
.chat-main-content .chat-area {
    width: 100%;
    min-width: unset;
    flex-shrink: 0;
    border-left: none;
    border-top: 1px solid #e5e8ec;
    background: #ffffff;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
    max-height: 48px;
    overflow: hidden;
    transition: max-height 0.25s ease;
    position: relative;
    z-index: 5;
}

.chat-main-content .chat-area:not(.collapsed) {
    position: absolute;
    bottom: 60px;
    left: 0;
    right: 0;
    max-height: 280px;
    overflow-y: auto;
    transition: max-height 0.25s ease, opacity 0.25s ease;
    opacity: 1;
}

.chat-main-content .chat-area.collapsed {
    max-height: 48px;
    overflow: hidden;
}

.chat-collapse-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 16px;
    cursor: pointer;
    background: #fafbfc;
    border-bottom: 1px solid #e5e5e5;
    font-size: 13px;
    color: #666;
    user-select: none;
}

.chat-collapse-toggle:hover {
    background: #f0f0f0;
}

.chat-collapse-toggle .toggle-icon {
    transition: transform 0.3s ease;
}

.chat-collapse-toggle .chat-drawer-count {
    color: #8a93a3;
    font-size: 12px;
    margin-left: 4px;
}

.chat-area.collapsed .chat-collapse-toggle .toggle-icon {
    transform: rotate(180deg);
}

/* Demand editor */
.demand-editor {
    border-bottom: 1px solid #e5e5e5;
    background: #fafbfc;
}

.demand-editor.collapsed .demand-form {
    display: none;
}

.demand-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    cursor: pointer;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    font-size: 14px;
    font-weight: 500;
    user-select: none;
    transition: opacity 0.2s;
}

.demand-toggle:hover {
    opacity: 0.9;
}

.demand-toggle-arrow {
    margin-left: auto;
    transition: transform 0.3s ease;
    font-size: 12px;
}

.demand-editor:not(.collapsed) .demand-toggle-arrow {
    transform: rotate(180deg);
}

.demand-form {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.demand-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.demand-field label {
    font-size: 13px;
    font-weight: 600;
    color: #333;
}

.demand-field textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 14px;
    font-family: inherit;
    resize: vertical;
    min-height: 60px;
    transition: border-color 0.2s;
}

.demand-field textarea:focus {
    outline: none;
    border-color: #667eea;
    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.15);
}

.demand-actions {
    display: flex;
    justify-content: center;
    padding-top: 4px;
}

.match-btn {
    padding: 10px 32px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
}

.match-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

.match-btn:active {
    transform: translateY(0);
}

.match-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* Inline status line (lives inside resource panel, not as a separate bar) */
.inline-status {
    position: absolute;
    bottom: 12px;
    left: 16px;
    right: 16px;
    padding: 10px 16px;
    text-align: center;
    font-size: 13px;
    color: #3b5bdb;
    background: #f0f4ff;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(59, 91, 219, 0.15);
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.2s ease, transform 0.2s ease;
    pointer-events: none;
    z-index: 4;
}

.inline-status.visible {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

/* Old status bar — hidden, kept in DOM for back-compat with other templates */
.status-bar {
    display: none !important;
}

/* 顾问状态栏：合并 activity-log + status-line。
   紧贴输入框上方，固定高度，单行文本。
   单一函数 updateAdvisorStatus() 控制文本、图标、计数。 */
.matching-status {
    flex-shrink: 0;
    height: 44px;
    padding: 0 16px;
    background: #ffffff;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: #475569;
}

.matching-status-icon {
    font-size: 16px;
    flex-shrink: 0;
}

.matching-status-text {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.matching-status-count {
    flex-shrink: 0;
    padding: 2px 10px;
    background: #eef2ff;
    color: #4338ca;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
}

/* 状态变化 - 搜索中 */
.matching-status.is-searching .matching-status-icon {
    animation: spin 1s linear infinite;
    display: inline-block;
}

/* 状态变化 - 完成 */
.matching-status.is-done {
    background: #f0fdf4;
    color: #166534;
}

.matching-status.is-done .matching-status-count {
    background: #dcfce7;
    color: #166534;
}

/* 状态变化 - 错误 */
.matching-status.is-error {
    background: #fef2f2;
    color: #991b1b;
}

.matching-status.is-error .matching-status-count {
    background: #fee2e2;
    color: #991b1b;
}

/* AI 活动日志：每条 SSE 事件一行，由 updateMatchingStatus() 写入。
   紧贴 status bar 上方，max-height 滚动，新事件从底部追加。
   与 status bar 同一函数驱动，但视觉上是独立区域，给用户完整动作历史。 */
.advisor-activity-log {
    flex-shrink: 0;
    background: #f8fafc;
    border-top: 1px solid #e5e7eb;
    max-height: 160px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.advisor-activity-log-body {
    flex: 1;
    overflow-y: auto;
    padding: 6px 12px;
    font-family: ui-monospace, "SF Mono", Consolas, monospace;
    font-size: 11px;
    line-height: 1.5;
}
.advisor-activity-log-body:empty::before {
    content: "等待 AI 行动...";
    color: #94a3b8;
    font-style: italic;
    padding: 6px 12px;
}
.activity-row {
    display: flex;
    gap: 8px;
    padding: 2px 0;
    color: #475569;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.activity-row-time { color: #94a3b8; flex-shrink: 0; }
.activity-row-icon { flex-shrink: 0; width: 16px; text-align: center; }
.activity-row-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.activity-row--tool_call .activity-row-icon { color: #6366f1; }
.activity-row--tool_result .activity-row-icon { color: #10b981; }
.activity-row--tool_action .activity-row-icon { color: #8b5cf6; }
.activity-row--resources .activity-row-icon { color: #0ea5e9; }
.activity-row--resource_updated .activity-row-icon { color: #f59e0b; }
.activity-row--error { color: #dc2626; }
.activity-row--done { color: #166534; font-weight: 600; }
.activity-row--thinking { color: #6366f1; font-style: italic; }
/* 2026-07-12 (P2 #5a): reasoning 行 — 缩进, 等宽字体, 灰色.
   视觉上「是工具调用行的注释」, 不喧宾夺主. */
.activity-row--reasoning {
    padding-left: 24px;
    color: #64748b;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 11px;
    font-style: italic;
    opacity: 0.85;
    white-space: normal;
}

/* 2026-06-20: activity-row debug 详情 — 点击展开
   .activity-row--has-detail: 行有详情, hover 高亮 + chevron
   .activity-row--expanded: 行被展开, 浅蓝背景
   .activity-row-detail: 嵌套详情面板 (pre 格式 JSON)
   2026-06-21: chevron 字号从 10px → 13px, 颜色加深 (#94a3b8 → #475569),
   加左侧蓝条和 "▸ 详情" 文字提示, 解决用户反馈 "看不到可展开"。*/
.activity-row-chevron {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    flex-shrink: 0;
    padding: 0 6px;
    margin-left: auto;
    font-size: 13px;
    color: #475569;
    border-left: 2px solid #6366f1;
    border-radius: 2px;
    cursor: pointer;
}
.activity-row-chevron::before { content: "▸"; transition: transform 0.15s; }
.activity-row--expanded .activity-row-chevron::before { content: "▾"; }
.activity-row--expanded .activity-row-chevron { color: #4338ca; font-weight: 600; }
.activity-row--has-detail {
    background: #fafbff;
    border-left: 3px solid transparent;
    padding-left: 4px;
    border-radius: 3px;
    cursor: pointer;
}
.activity-row--has-detail:hover { background: #eef2ff; border-left-color: #6366f1; }
.activity-row--expanded { background: #eef2ff; font-weight: 500; }
.activity-row-detail {
    margin: 2px 0 6px 28px;
    padding: 8px 10px;
    background: #f8fafc;
    border-left: 3px solid #6366f1;
    border-radius: 4px;
    font-size: 11px;
    line-height: 1.4;
}
.activity-detail-block { margin-bottom: 6px; }
.activity-detail-block:last-child { margin-bottom: 0; }
.activity-detail-title {
    color: #6366f1;
    font-weight: 600;
    margin-bottom: 2px;
}
.activity-detail-json {
    margin: 0;
    padding: 6px 8px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 3px;
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
    font-size: 10px;
    color: #334155;
    overflow-x: auto;
    max-height: 280px;
    overflow-y: auto;
    white-space: pre-wrap;
    word-break: break-word;
}

.resource-panel-header {
    padding: 12px 16px;
    border-bottom: 1px solid #e5e5e5;
    background: #ffffff;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.resource-panel-header h4 {
    font-size: 14px;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

.edit-demand-btn {
    padding: 4px 12px;
    font-size: 12px;
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.2s;
}

.edit-demand-btn:hover {
    background: #667eea;
    color: white;
    border-color: #667eea;
}

.resource-panel-body {
    flex: 1;
    min-height: 0;
    overflow: hidden;
    padding: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    position: relative;
}

.resource-panel-meta {
    width: 100%;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-shrink: 0;
}

.resource-panel-meta-badges {
    min-height: 24px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
}

.linked-match-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 9px;
    border-radius: 999px;
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    color: #047857;
    font-size: 12px;
    font-weight: 600;
}

.find-more-panel-btn {
    padding: 5px 10px;
    border: 1px solid #d1d5db;
    border-radius: 999px;
    background: #ffffff;
    color: #4b5563;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s ease;
}

.find-more-panel-btn:hover,
.find-more-card-btn:hover {
    background: #f9fafb;
    border-color: #9ca3af;
    color: #374151;
}

/* Issue #104: one compact viewport card; the three decision rows are always
   visible and never require scrolling or disclosure clicks. */
.resource-panel-body:has(.tinder-card) {
    justify-content: flex-start;
}

.resource-panel-body .tinder-card {
    max-width: 100%;
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: min(480px, calc(100dvh - 112px));
    flex-shrink: 0;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.chance-three-pieces {
    display: grid;
    grid-template-rows: repeat(3, minmax(0, auto));
    width: 100%;
    margin: 0 0 10px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #ffffff;
    flex-shrink: 0;
}

.chance-card-decision {
    display: grid;
    grid-template-columns: minmax(88px, 28%) minmax(0, 1fr);
    align-items: start;
    gap: 8px;
    padding: 7px 10px;
    border-bottom: 1px solid #e5e7eb;
    font-size: 14px;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.chance-card-decision:last-child {
    border-bottom: 0;
}

.chance-card-decision-label {
    font-weight: 700;
    white-space: nowrap;
}

.chance-card-decision-body {
    min-width: 0;
    color: #374151;
}

.chance-card-decision.chance-card-section--value {
    background: #f0fdf4;
    color: #047857;
}

.chance-card-decision.chance-card-section--action {
    background: #eff6ff;
    color: #1d4ed8;
}

.chance-card-decision.chance-card-section--risk {
    background: #fff7ed;
    color: #c2410c;
}

.resource-panel-body .tinder-card .chance-card-section--resource {
    max-height: 64px;
    margin-bottom: 10px;
    overflow: hidden;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.resource-panel-body .tinder-card .chance-card-section--resource .chance-card-section-label {
    margin-bottom: 4px;
    color: #6b7280;
    font-size: 11px;
    font-weight: 600;
}

.resource-panel-body .tinder-card .chance-card-section--resource .chance-card-section-body {
    display: -webkit-box;
    overflow: hidden;
    color: #4b5563;
    font-size: 12px;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.chance-card-fallback-summary {
    margin-bottom: 8px;
    padding: 7px 10px;
    border-left: 3px solid #10b981;
    border-radius: 4px;
    background: #f0fdf4;
    color: #047857;
    font-size: 12px;
    line-height: 1.4;
}

.resource-panel-body .tinder-card .chance-card-actions {
    margin-bottom: 10px;
    flex-shrink: 0;
}

/* 2026-07-17 fix(#106): raise the empty-state 找更多 CTA above the static
   .sidebar-header sibling. Without its own stacking context, elementFromPoint
   on narrow viewports lands on the left-column sibling and never fires
   findMoreMatchesDebounced(). */
.find-more-center-btn {
    position: relative;
    z-index: 10;
}

.chance-card-apply {
    width: 100%;
    min-height: 44px;
    padding: 12px 16px;
    border: none;
    border-radius: 8px;
    background: linear-gradient(135deg, #ff6b35 0%, #f97316 100%);
    box-shadow: 0 4px 12px rgba(255, 107, 53, 0.35);
    color: #ffffff;
    cursor: pointer;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.5px;
    transition: transform 0.1s ease, box-shadow 0.15s ease;
}

.chance-card-apply:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(255, 107, 53, 0.45);
}

.chance-card-apply:active {
    transform: scale(0.98);
}

.chance-card-skip {
    display: block;
    margin: 6px auto 0;
    padding: 3px 12px;
    border: none;
    background: none;
    color: #9ca3af;
    cursor: pointer;
    font-size: 12px;
    text-decoration: underline;
}

.chance-card-skip:hover {
    color: #6b7280;
}

/* Mobile: reserve the first viewport for title + all three decisions + CTA. */
@media (max-width: 768px), (max-height: 620px) {
    .resource-panel-body {
        padding: 8px;
    }
    .resource-panel-body .tinder-card {
        height: auto;
        min-height: 0;
        max-height: min(480px, calc(100dvh - 96px));
        padding: 12px !important;
    }
    .chance-card-decision {
        grid-template-columns: 82px minmax(0, 1fr);
        gap: 6px;
        padding: 6px 8px;
    }
    .resource-panel-body .tinder-card .chance-card-title {
        min-height: 36px;
        margin-bottom: 8px !important;
        font-size: 15px !important;
    }
    .resource-panel-body .tinder-card .chance-card-section--resource {
        display: none;
    }
    .resource-panel-body .resource-owner {
        padding: 6px;
        margin-bottom: 8px;
    }
}

.resource-panel-body .tinder-card.card-just-linked {
    animation: cardLinkedFlash 0.6s ease;
    border-color: #10b981 !important;
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.18), 0 8px 24px rgba(16, 185, 129, 0.18) !important;
}

.resource-panel-body .tinder-card.card-just-linked::after {
    content: "✓ 已链接";
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 3;
    padding: 6px 10px;
    border-radius: 999px;
    background: #10a37f;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 8px 20px rgba(16, 163, 127, 0.28);
    animation: cardLinkedBadgePop 0.6s ease;
}

@keyframes cardLinkedFlash {
    0% { background-color: #ffffff; transform: scale(1); }
    35% { background-color: #ecfdf5; transform: scale(1.01); }
    100% { background-color: #ffffff; transform: scale(1); }
}

@keyframes cardLinkedBadgePop {
    0% { opacity: 0; transform: translateY(-6px) scale(0.92); }
    25% { opacity: 1; transform: translateY(0) scale(1); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

.resource-panel-progress {
    padding: 12px 16px;
    border-top: 1px solid #e5e5e5;
    background: #ffffff;
    flex-shrink: 0;
}

.progress-bar {
    height: 4px;
    background: #e5e7eb;
    border-radius: 2px;
    overflow: hidden;
    margin-bottom: 8px;
}

.progress-bar-fill {
    height: 100%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 2px;
    transition: width 0.3s ease;
}

.progress-text {
    font-size: 11px;
    color: #9ca3af;
    text-align: center;
}

/* === iframe resource viewer === */
.resource-iframe-container {
    flex: 1;
    overflow: hidden;
    position: relative;
}
.resource-iframe-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/* Empty state */
.resource-panel-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    color: #9ca3af;
    font-size: 14px;
    text-align: center;
    padding: 40px 20px;
}

.resource-panel-empty .empty-icon {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.5;
}

/* Matching animation */
.matching-animation {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    padding: 40px 20px;
}

.matching-spinner {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top: 3px solid #667eea;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin-bottom: 16px;
}

.matching-text {
    font-size: 14px;
    color: #6b7280;
    animation: pulse 1.5s ease-in-out infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 1; }
}

/* Navigation buttons */
.resource-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 12px;
}

.resource-nav-btn {
    width: 36px;
    height: 36px;
    border: 1px solid #e5e7eb;
    border-radius: 50%;
    background: #ffffff;
    color: #6b7280;
    font-size: 16px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

.resource-nav-btn:hover:not(:disabled) {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border-color: transparent;
}

.resource-nav-btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

/* Responsive: stack vertically on mobile */
@media (max-width: 768px) {
    /* Keep the opportunity card full-width on first open; the sidebar remains
       available through its toggle instead of squeezing the card to 130px. */
    .sidebar.open {
        width: 0;
        border-right: none;
    }
    body.sidebar-open .sidebar-toggle {
        left: 12px;
    }

    .chat-main-content {
        flex-direction: column;
    }

    .chat-main-content .chat-area {
        width: 100%;
        min-width: unset;
        border-left: none;
        border-top: 1px solid #e5e5e5;
    }

    .resource-panel.has-resources {
        width: 100%;
        min-width: unset;
        height: auto;
        min-height: 0;
        flex: 1 1 auto;
        border-right: none;
        border-bottom: 1px solid #e5e5e5;
    }

    .resource-panel.has-iframe {
        width: 100%;
        min-width: unset;
        height: 50vh;
        border-right: none;
        border-bottom: 1px solid #e5e5e5;
    }

    .demand-editor {
        width: 100%;
    }
}

/* 聊天头部 */
.chat-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #ffffff;
    border-bottom: 1px solid #e5e7eb;
    flex-shrink: 0;
}

.chat-header-left {
    display: flex;
    align-items: center;
    gap: 12px;
}

.sidebar-toggle-chat {
    background: transparent;
    border: 1px solid #e5e8ec;
    border-radius: 6px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #5a6478;
    cursor: pointer;
    padding: 0;
    transition: border-color 0.15s, color 0.15s;
}

.sidebar-toggle-chat:hover {
    border-color: #3b5bdb;
    color: #3b5bdb;
}

.sidebar-toggle-chat:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 91, 219, 0.15);
}

.back-button {
    background: none;
    border: none;
    color: #6b7280;
    cursor: pointer;
    font-size: 14px;
    padding: 4px 8px;
}

.back-button:hover {
    color: #374151;
}

.chat-title {
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

.chat-header-right {
    display: flex;
    gap: 8px;
}

.icon-button {
    background: #f3f4f6;
    border: none;
    border-radius: 6px;
    padding: 6px 12px;
    font-size: 14px;
    cursor: pointer;
    transition: background 0.2s;
}

.icon-button:hover {
    background: #e5e7eb;
}

/* AI代理开关样式 */
.ai-agent-toggle {
    position: relative;
}

.ai-agent-toggle.active {
    background: #e8f5e9;
    border: 1px solid #4caf50;
}

.ai-agent-toggle.active::after {
    content: '●';
    position: absolute;
    top: 4px;
    right: 4px;
    font-size: 8px;
    color: #4caf50;
}

.ai-agent-toggle:hover {
    background: #f0f0f0;
}

.ai-agent-toggle.active:hover {
    background: #d4e8d8;
}

/* AI正在回复加载状态 */
.typing-indicator .message-content {
    padding: 8px 12px;
    background: #f3f4f6;
    border-radius: 8px;
}

.typing-dots {
    display: flex;
    gap: 4px;
    margin-bottom: 8px;
}

.typing-dots span {
    width: 8px;
    height: 8px;
    background: #999;
    border-radius: 50%;
    animation: typing 1.4s infinite;
}

.typing-dots span:nth-child(2) {
    animation-delay: 0.2s;
}

.typing-dots span:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes typing {
    0%, 60%, 100% {
        transform: translateY(0);
    }
    30% {
        transform: translateY(-10px);
    }
}

.typing-text {
    font-size: 12px;
    color: #666;
    font-style: italic;
}

/* 分享对话框 */
.share-dialog-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.share-dialog {
    background: white;
    border-radius: 12px;
    width: 90%;
    max-width: 500px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.share-dialog-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #e5e7eb;
}

.share-dialog-header h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: #111827;
}

.close-button {
    background: none;
    border: none;
    font-size: 24px;
    color: #6b7280;
    cursor: pointer;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.close-button:hover {
    color: #111827;
}

.share-dialog-body {
    padding: 20px;
}

.share-dialog-text {
    margin: 0 0 16px 0;
    font-size: 14px;
    color: #4b5563;
    line-height: 1.5;
}

.share-url-container {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
}

.share-url-input {
    flex: 1;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
    color: #374151;
    background: #f9fafb;
}

.copy-button {
    background: #10a37f;
    color: white;
    border: none;
    border-radius: 6px;
    padding: 10px 16px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s;
}

.copy-button:hover {
    background: #0e8c6c;
}

.share-dialog-hint {
    margin: 0;
    font-size: 12px;
    color: #9ca3af;
}

.share-dialog-footer {
    padding: 12px 20px;
    border-top: 1px solid #e5e7eb;
    text-align: right;
}

/* 登录模态框 */
.login-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2000;
    animation: fadeIn 0.3s ease-out;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.login-modal {
    background: white;
    border-radius: 16px;
    width: 90%;
    max-width: 420px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    animation: slideUp 0.3s ease-out;
}

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

.login-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
}

.login-modal-header h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    color: #111827;
}

.login-modal-body {
    padding: 24px;
}

.login-hint {
    margin: 0 0 20px 0;
    font-size: 14px;
    color: #6b7280;
    text-align: center;
}

.phone-input-group,
.code-input-group {
    margin-bottom: 16px;
}

.phone-input,
.code-input {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 15px;
    color: #111827;
    transition: border-color 0.2s;
    box-sizing: border-box;
}

.phone-input:focus,
.code-input:focus {
    outline: none;
    border-color: #10a37f;
    box-shadow: 0 0 0 3px rgba(16, 163, 127, 0.1);
}

.code-input-group {
    display: flex;
    gap: 8px;
}

.code-input {
    flex: 1;
}

.send-code-button {
    background: #10a37f;
    color: white;
    border: none;
    border-radius: 8px;
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s;
    white-space: nowrap;
}

.send-code-button:hover:not(:disabled) {
    background: #0e8c6c;
}

.send-code-button:disabled {
    background: #9ca3af;
    cursor: not-allowed;
}

.login-submit-button {
    width: 100%;
    background: #10a37f;
    color: white;
    border: none;
    border-radius: 8px;
    padding: 14px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
    margin-top: 8px;
}

.login-submit-button:hover:not(:disabled) {
    background: #0e8c6c;
}

.login-submit-button:disabled {
    background: #9ca3af;
    cursor: not-allowed;
}

.login-error {
    margin: 12px 0 0 0;
    font-size: 13px;
    color: #dc2626;
    text-align: center;
    display: none;
}

.login-error.show {
    display: block;
}

.chat-screen.active {
    display: flex;
}

.chat-area {
    flex: 1;
    padding: 20px;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0; /* 防止flex子项溢出 */
}

.message {
    margin-bottom: 20px;
    display: flex;
    gap: 12px;
}

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

.message-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 14px;
    flex-shrink: 0;
    font-weight: 600;
}

.sender-name {
    font-size: 12px;
    color: #8e8ea0;
    margin-bottom: 4px;
    font-weight: 500;
}

.message-content {
    max-width: 70%;
    padding: 12px 16px;
    border-radius: 12px;
    font-size: 15px;
    line-height: 1.6;
    overflow: hidden;
}

.message.assistant .message-content {
    background: #f7f7f8;
    color: #2d333a;
    max-width: calc(70% + 40px);
}

.message.user .message-content {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
}

/* Resource cards container */
.resources-cards {
    max-width: 100%;
    overflow: hidden;
}

.message-title {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 12px;
    color: #2d333a;
}

.message-text {
    margin-bottom: 8px;
}

/* 确认按钮样式 */
.confirmation-prompt {
    margin-bottom: 16px;
}

.confirmation-prompt p {
    margin: 8px 0;
    line-height: 1.6;
}

.confirmation-buttons {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.confirmation-buttons .btn {
    flex: 1;
    min-width: 150px;
    padding: 10px 16px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s;
}

.confirmation-buttons .btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.confirmation-buttons .btn-primary {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
}

.confirmation-buttons .btn-secondary {
    background: #f7f7f8;
    color: #2d333a;
    border: 1px solid #e1e4e8;
}

.confirmation-buttons .btn-secondary:hover {
    background: #e1e4e8;
}

.input-container {
    padding: 16px 20px;
    border-top: 1px solid #e5e5e5;
    flex-shrink: 0; /* 防止输入框被压缩 */
}

.input-wrapper {
    display: flex;
    gap: 12px;
    align-items: flex-end;
}

.message-input {
    flex: 1;
    padding: 12px 16px;
    border: 2px solid #e5e5e5;
    border-radius: 12px;
    font-size: 15px;
    font-family: inherit;
    resize: none;
    max-height: 120px;
}

.message-input:focus {
    outline: none;
    border-color: #667eea;
}

.send-button {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border: none;
    color: white;
    font-size: 20px;
    cursor: pointer;
    transition: transform 0.2s;
    flex-shrink: 0;
}

.send-button:hover {
    transform: scale(1.05);
}

/* 加载指示器样式 */
.loading-indicator {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.loading-spinner {
    width: 50px;
    height: 50px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #10a37f;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes typing {
    0%, 100% { transform: translateY(0); opacity: 0.6; }
    50% { transform: translateY(-4px); opacity: 1; }
}

.loading-text {
    margin-top: 20px;
    color: white;
    font-size: 16px;
    font-weight: 500;
}

.hidden {
    display: none !important;
}

/* 分析卡片样式 */
.analysis-card {
    margin-top: 12px;
    padding: 16px;
    background: #f9f9f9;
    border-radius: 8px;
    border-left: 3px solid #10a37f;
}

.analysis-item {
    margin-bottom: 16px;
}

.analysis-item:last-child {
    margin-bottom: 0;
}

.analysis-label {
    font-size: 13px;
    font-weight: 600;
    color: #6b7280;
    margin-bottom: 6px;
}

.analysis-value {
    font-size: 14px;
    color: #374151;
    line-height: 1.6;
}

.message-actions {
    margin-top: 16px;
    display: flex;
    gap: 8px;
}

.action-btn {
    padding: 8px 16px;
    background: #10a37f;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s;
}

.action-btn:hover {
    background: #0d8a6d;
}

.opportunity-directions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.opportunity-btn {
    padding: 6px 12px;
    background: #e3f2fd;
    color: #1976d2;
    border: 1px solid #bbdefb;
    border-radius: 16px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.opportunity-btn:hover {
    background: #1976d2;
    color: white;
    border-color: #1976d2;
    transform: translateY(-1px);
}

.action-btn.secondary {
    background: #6c757d;
}

.action-btn.secondary:hover {
    background: #5a6268;
}

/* 增强版资源整合分析卡片样式 */
.enhanced-card {
    max-width: 100%;
}

.section-title {
    font-size: 14px;
    font-weight: 600;
    color: #10a37f;
    margin: 16px 0 12px 0;
    padding-bottom: 8px;
    border-bottom: 2px solid #e8f5e9;
}

.opportunity-section {
    margin: 16px 0;
    padding: 12px;
    background: #f8f9fa;
    border-radius: 8px;
    border-left: 3px solid #10a37f;
}

.opportunity-title {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}

.opportunity-content {
    padding-left: 0;
}

.opportunity-detail {
    margin: 8px 0;
    font-size: 13px;
    line-height: 1.6;
}

.detail-label {
    color: #666;
    font-weight: 500;
}

.detail-value {
    color: #333;
}

.detail-value.resonance {
    color: #10a37f;
    font-weight: 500;
}

/* Project cards */
.project-card {
    background: white;
    border: 1px solid #e5e5e5;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.project-card:hover {
    border-color: #667eea;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
    transform: translateY(-2px);
}

/* 跟进问题样式 */
.followup-questions {
    margin-top: 10px;
}

.followup-question {
    background: #f0f4f8;
    border: 1px solid #d1d9e6;
    border-radius: 8px;
    padding: 10px 15px;
    margin: 8px 0;
    cursor: pointer;
    transition: all 0.2s;
    font-size: 14px;
    color: #334155;
}

.followup-question:hover {
    background: #e1e8f0;
    border-color: #cbd5e1;
    transform: translateX(5px);
}

.followup-question:active {
    transform: translateX(2px);
}

/* LangChain 多 Agent 卡片样式 */
.business-profile-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    margin: 12px 0;
}

.business-profile-card h4 {
    color: #1e293b;
    margin-bottom: 16px;
    font-size: 18px;
}

.profile-item {
    margin-bottom: 16px;
}

.profile-item strong {
    color: #475569;
    display: block;
    margin-bottom: 6px;
}

.profile-item p {
    color: #64748b;
    line-height: 1.6;
    margin: 0;
}

.opportunities-card, .resources-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    margin: 12px 0;
}

.opportunities-card h4, .resources-card h4 {
    color: #1e293b;
    margin-bottom: 16px;
    font-size: 18px;
}

.opportunity-item, .resource-item {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 12px;
}

.opportunity-header, .resource-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.opportunity-number {
    background: #3b82f6;
    color: white;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 14px;
}

.opportunity-header h4, .resource-header h4 {
    margin: 0;
    color: #1e293b;
    flex: 1;
    margin-left: 12px;
}

.match-score {
    background: #dcfce7;
    color: #166534;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
}

.resource-actions {
    display: flex;
    gap: 8px;
    margin-top: 12px;
}

.confirmation-buttons {
    background: #fef3c7;
    border: 1px solid #f59e0b;
    border-radius: 8px;
    padding: 16px;
    margin: 12px 0;
}

.confirmation-buttons p {
    margin: 0 0 12px 0;
    color: #92400e;
}

/* Markdown 内容样式 */
.markdown-content {
    line-height: 1.6;
}

.markdown-content h2 {
    font-size: 18px;
    font-weight: 700;
    margin: 20px 0 12px 0;
    color: #2d333a;
    border-bottom: 2px solid #667eea;
    padding-bottom: 8px;
}

.markdown-content h3 {
    font-size: 16px;
    font-weight: 600;
    margin: 16px 0 8px 0;
    color: #3a4a5a;
}

.markdown-content p {
    margin: 8px 0;
}

.markdown-content strong {
    color: #2d333a;
    font-weight: 600;
}

.markdown-content ul, .markdown-content ol {
    margin: 8px 0;
    padding-left: 24px;
}

.markdown-content li {
    margin: 4px 0;
}

.markdown-content hr {
    border: none;
    border-top: 1px solid #e5e7eb;
    margin: 16px 0;
}

/* Agent step inline display */
.agent-step {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    color: #666;
    font-size: 13px;
    animation: agentStepFadeIn 0.3s ease;
}

.agent-step .step-icon {
    color: #667eea;
    font-size: 10px;
}

.agent-step .step-text {
    color: #888;
}

@keyframes agentStepFadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* 工具调用卡片 */
.tool-call-card {
    /* margin: 8px 16px;  ← removed, body gap handles spacing */
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #f8fafc;
    overflow: hidden;
    animation: agentStepFadeIn 0.3s ease;
}
.tool-call-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    cursor: pointer;
    user-select: none;
}
.tool-call-header:hover {
    background: #f1f5f9;
}
.tool-call-icon {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    flex-shrink: 0;
}
.tool-call-icon.search { background: #ede9fe; color: #7c3aed; }
.tool-call-icon.match { background: #dbeafe; color: #2563eb; }
.tool-call-icon.result { background: #d1fae5; color: #059669; }
.tool-call-icon.running { background: #fef3c7; color: #d97706; }
.tool-call-title {
    flex: 1;
    font-size: 13px;
    font-weight: 500;
    color: #334155;
}
.tool-call-title .query-highlight {
    color: #7c3aed;
    font-weight: 600;
}
.tool-call-toggle {
    font-size: 11px;
    color: #94a3b8;
    transition: transform 0.2s;
}
.tool-call-toggle.expanded {
    transform: rotate(180deg);
}
.tool-call-body {
    display: none;
    padding: 0 14px 12px;
    border-top: 1px solid #e2e8f0;
}
.tool-call-body.show {
    display: block;
}
.tool-call-section {
    margin-top: 10px;
}
.tool-call-section-label {
    font-size: 11px;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}
.tool-call-reasoning {
    font-size: 13px;
    color: #475569;
    line-height: 1.6;
    padding: 8px 10px;
    background: white;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
}
.tool-call-params {
    font-size: 12px;
    color: #64748b;
    font-family: 'SF Mono', 'Fira Code', monospace;
    padding: 8px 10px;
    background: white;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
    word-break: break-all;
    white-space: pre-wrap;
}
.tool-call-status {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 500;
}
.tool-call-status.success { background: #d1fae5; color: #059669; }
.tool-call-status.running { background: #fef3c7; color: #d97706; }
.tool-call-status.error { background: #fee2e2; color: #dc2626; }

/* Visually hidden but accessible to screen readers */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.resource-panel-loading {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  /* 2026-07-13 P2 #32: 0.92 → 0.65, 让用户能看到后面的卡片内容, 不再像失焦.
     仍然挡住点击 (loading 中), 但视觉更轻. */
  background: rgba(255, 255, 255, 0.65);
  z-index: 5;
  /* Click-through except for the cancel button. Lets users still click
     找更多 / 切换 demand while AI matching is in progress. */
  pointer-events: none;
}
.resource-panel-loading .cancel-search-btn {
  pointer-events: auto;
}
.resource-panel-loading .loading-spinner {
  width: 40px; height: 40px;
  border: 3px solid #e5e7eb;
  border-top-color: #6366f1;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
.resource-panel-loading .loading-text {
  margin-top: 14px;
  color: #4b5563;
  font-size: 14px;
}
@keyframes spin { to { transform: rotate(360deg); } }
.matching-status.state-working { color: #6366f1; }
.matching-status.state-done    { color: #10b981; }
.matching-status.state-error   { color: #ef4444; }

/* === Resource owner summary (in /matching cards) === */
.resource-owner {
    background: #f9fafb;
    border: 1px solid #f3f4f6;
    border-radius: 6px;
    padding: 10px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.resource-owner .owner-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 13px;
    flex-shrink: 0;
}

.resource-owner .owner-info {
    flex: 1;
    min-width: 0;
}

.resource-owner .owner-name {
    font-size: 12px;
    font-weight: 600;
    color: #111827;
    line-height: 1.3;
}

.resource-owner .owner-title {
    font-size: 11px;
    color: #6b7280;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* fix(#101) 2026-07-16: 资料待完善的发布者 — 视觉降级 (灰色块 + 警示角标).
   之前缺资料的资源看上去像「匿名/虚假账号」, 现在明确标注. */
.resource-owner--incomplete {
    background: #fef3c7 !important;
    border-color: #fcd34d !important;
}

.resource-owner .owner-avatar--anon {
    background: linear-gradient(135deg, #9ca3af 0%, #6b7280 100%) !important;
    color: #ffffff;
}

.resource-owner .owner-badge {
    display: inline-block;
    margin-left: 4px;
    padding: 1px 6px;
    border-radius: 8px;
    font-size: 10px;
    font-weight: 600;
    vertical-align: middle;
    line-height: 1.4;
}

.resource-owner .owner-badge-verified {
    background: #d1fae5;
    color: #065f46;
    border: 1px solid #6ee7b7;
}

.resource-owner .owner-badge-warn {
    background: #fed7aa;
    color: #9a3412;
    border: 1px solid #fdba74;
}

/* Type chip (2026-06-18, own/need type display) */
.type-chip {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 500;
    margin-right: 4px;
    line-height: 1.5;
}
.type-chip-own {
    background: #f0fdf4;
    color: #047857;
    border: 1px solid #bbf7d0;
}
.type-chip-need {
    background: #eff6ff;
    color: #1e40af;
    border: 1px solid #bfdbfe;
}

/* ============================================================
   2026-06-18 场景 tab 样式
   资源盘点 / 合作匹配 入口
   ============================================================ */
.scenario-tabs {
  display: flex;
  gap: 0;
  border-bottom: 2px solid #e5e7eb;
  margin: 0 0 20px 0;
}
.scenario-tab {
  flex: 1;
  padding: 14px 20px;
  background: transparent;
  border: 0;
  border-bottom: 3px solid transparent;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: #6b7280;
  font-size: 16px;
  font-weight: 600;
  transition: all 0.2s;
  font-family: inherit;
}
.scenario-tab:hover {
  color: #374151;
  background: #f9fafb;
}
.scenario-tab.active {
  color: #4f46e5;
  border-bottom-color: #4f46e5;
}
.scenario-tab-hint {
  font-size: 12px;
  font-weight: 400;
  color: #9ca3af;
}
.scenario-tab.active .scenario-tab-hint {
  color: #6366f1;
}

/* 资源面板标题 span（不依赖外层重建） */
#resourcePanelTitleText {
  display: inline;
}

/* 侧栏需求卡片 scenario 图标 */
.scenario-icon {
  display: inline-block;
  margin-right: 6px;
  font-size: 14px;
  vertical-align: middle;
}
.scenario-icon.have { color: #10b981; }
.scenario-icon.want { color: #f59e0b; }

/* 输入框下方场景提示 — 引导用户理解双向匹配语义 */
.scenario-hint {
  margin: 8px 0 0 0;
  font-size: 12px;
  color: #6b7280;
  line-height: 1.5;
}

/* === Account Center Sidebar Footer (2026-06-22) === */
.sidebar-footer .footer-links {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 0 4px 0;
  border-top: 1px solid #f0f0f0;
  margin-top: 8px;
}

.sidebar-footer .footer-link {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 6px;
  color: #333;
  text-decoration: none;
  font-size: 13px;
  transition: background 0.15s;
}

.sidebar-footer .footer-link:hover {
  background: #f5f5f5;
  color: #667eea;
}

.sidebar-footer .footer-link-highlight {
  background: linear-gradient(135deg, rgba(102, 126, 234, 0.08) 0%, rgba(118, 75, 162, 0.08) 100%);
  color: #667eea;
  font-weight: 500;
}

.sidebar-footer .quit-btn {
  margin-top: 8px;
  padding: 8px;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: white;
  color: #d33;
  font-size: 13px;
  cursor: pointer;
  width: 100%;
}

.sidebar-footer .quit-btn:hover {
  background: #fff5f5;
  border-color: #d33;
}

/* === Account Center Sidebar Footer (2026-06-22 简化版) — icon-only 按钮 === */
#loggedInState .footer-links {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 6px;
  padding: 4px 0;
}

#loggedInState .footer-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 1;
  border-radius: 8px;
  color: #6c757d;
  text-decoration: none;
  font-size: 18px;
  background: #f8f9fa;
  transition: all 0.15s;
  position: relative;
}

/* 2026-07-13 P2 #31: 自定义 CSS tooltip (浏览器 default 1s 延迟 + 移动端不显示) */
#loggedInState .footer-link::after {
  content: attr(title);
  position: absolute;
  bottom: calc(100% + 4px);
  left: 50%;
  transform: translateX(-50%);
  background: #1f2937;
  color: white;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 11px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease;
  z-index: 100;
}
#loggedInState .footer-link:hover::after {
  opacity: 1;
}

#loggedInState .footer-link:hover {
  background: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%);
  color: #667eea;
  transform: translateY(-1px);
}

#loggedInState .footer-link-highlight {
  background: linear-gradient(135deg, rgba(102, 126, 234, 0.15) 0%, rgba(118, 75, 162, 0.15) 100%);
  color: #667eea;
}

#loggedInState .quit-btn {
  margin-top: 8px;
  width: 100%;
  padding: 8px;
  border: 1px solid #e9ecef;
  border-radius: 6px;
  background: white;
  color: #6c757d;
  font-size: 13px;
  cursor: pointer;
}

#loggedInState .quit-btn:hover {
  background: #fff5f5;
  color: #d33;
  border-color: #d33;
}

/* 2026-07-09: Market-aware matching — per-card reason UI */
.match-rating-badge {
    display: inline-block;
    padding: 2px 8px;
    background: #ffd700;
    color: #333;
    border-radius: 12px;
    font-size: 12px;
    font-weight: bold;
    margin-left: 6px;
}
.match-rating-badge[style*="display: none"],
.match-rating-badge[hidden] {
    display: none;
}
.match-value-summary {
    color: #333;
    font-size: 14px;
    line-height: 1.4;
    margin: 8px 0;
    overflow: hidden;
    text-overflow: ellipsis;
}
.match-execution-advice {
    background: #f0f8ff;
    padding: 8px 12px;
    border-left: 3px solid #4a90e2;
    margin: 8px 0;
    font-size: 13px;
    color: #2c5d8a;
    border-radius: 0 4px 4px 0;
}
.match-execution-advice ol {
    margin: 0;
    padding-left: 20px;
}
.match-risk {
    background: #fff3cd;
    padding: 6px 10px;
    border-left: 3px solid #ff9800;
    color: #856404;
    font-size: 13px;
    margin: 8px 0;
    border-radius: 0 4px 4px 0;
}
.match-detail-toggle {
    color: #4a90e2;
    cursor: pointer;
    font-size: 12px;
    margin-top: 4px;
    display: inline-block;
}
.match-detail-toggle:hover {
    text-decoration: underline;
}
.match-detail-expanded {
    margin-top: 8px;
    border-top: 1px dashed #e9ecef;
    padding-top: 8px;
}

/* v4-12 (2026-07-13): 极简单一列表 — ⭐ 推荐 (want_id=0) + 用户 wants. */
/* 2026-07-15: post want-removal — sidebar reverts to pre-v4-13 #demandList
   rendering using .conv-item styling. The fd46d41 .resource-sidebar-* and
   .want-item* rules are removed; sidebar style comes from .conv-item defined
   earlier in this file. */