.review-overlay { display: flex; align-items: center; justify-content: center; } .review-preview-modal { width: min(980px, calc(100vw - 40px)); max-height: min(92vh, calc(100vh - 32px)); margin: auto; flex: none; display: grid; grid-template-rows: auto minmax(0, 1fr); overflow: hidden; border-radius: 24px; background: radial-gradient(circle at top right, rgba(var(--theme-primary-rgb, 58, 124, 165), 0.08), transparent 28%), linear-gradient(180deg, #fbfdff 0%, #f6f9fc 100%); box-shadow: 0 24px 80px rgba(15, 23, 42, 0.22), 0 2px 12px rgba(15, 23, 42, 0.08); border: 1px solid #e7eef6; } .review-preview-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 22px 24px 18px; border-bottom: 1px solid #eef2f7; } .review-preview-head h3 { margin-top: 12px; color: #0f172a; font-size: 22px; font-weight: 900; line-height: 1.35; } .review-preview-body { min-height: 0; display: grid; place-items: center; padding: 18px; background: rgba(248, 250, 252, 0.88); } .review-preview-body.image img { max-width: 100%; max-height: calc(92vh - 170px); display: block; border-radius: 20px; object-fit: contain; box-shadow: 0 16px 34px rgba(148, 163, 184, 0.26); } .review-preview-body.pdf iframe { width: 100%; height: min(78vh, 820px); border: 0; border-radius: 18px; background: #fff; } .welcome-quick-actions { margin-top: 14px; padding-top: 12px; border-top: 1px dashed rgba(203, 213, 225, 0.82); } .welcome-quick-actions-title { margin: 0 0 16px !important; color: #64748b; font-size: 13px; font-weight: 700; letter-spacing: 0.5px; } .welcome-quick-action-grid { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; } .welcome-quick-action-btn { min-height: 32px; display: inline-flex; align-items: center; gap: 6px; padding: 0 14px; border: 1px solid #cbd5e1; border-radius: 12px; background: #ffffff; color: #334155; font-size: var(--wb-fs-chip); font-weight: 600; line-height: 1.2; transition: all 0.2s ease; } .welcome-quick-action-btn i { font-size: 14px; color: #64748b; transition: color 0.2s ease; } .welcome-quick-action-btn:hover:not(:disabled) { transform: translateY(-1px); border-color: var(--theme-primary); background: var(--theme-primary-soft); color: var(--theme-primary-active); box-shadow: 0 4px 12px rgba(var(--theme-primary-rgb, 58, 124, 165), 0.1); } .welcome-quick-action-btn:hover:not(:disabled) i { color: var(--theme-primary-active); } .welcome-quick-action-btn:disabled { opacity: 0.5; cursor: not-allowed; } .welcome-grid { display: grid; gap: 12px; } .welcome-card { padding: 14px; border-radius: 18px; background: #f8fafc; } .welcome-card i { color: var(--theme-primary); font-size: var(--wb-fs-welcome); } .welcome-card strong { display: block; margin-top: 10px; } .assistant-modal-enter-active, .assistant-modal-leave-active { transition: opacity 220ms ease; } .assistant-modal-enter-active .assistant-modal, .assistant-modal-leave-active .assistant-modal { transition: transform 260ms ease, opacity 220ms ease; } .assistant-modal-enter-from, .assistant-modal-leave-to { opacity: 0; } .assistant-modal-enter-from .assistant-modal, .assistant-modal-leave-to .assistant-modal { transform: translateY(10px) scale(0.985); opacity: 0; } .insight-switch-enter-active, .insight-switch-leave-active { transition: opacity 180ms ease, transform 180ms ease; } .insight-switch-enter-from, .insight-switch-leave-to { opacity: 0; transform: translateY(8px); } /* 笔记本和中等屏:工作台正文字号整体下调一档 */ @media (max-width: 1680px) { .assistant-modal-stage { --wb-fs-title: 19px; --wb-fs-desc: 12px; --wb-fs-badge: 11px; --wb-fs-bubble: 12px; --wb-fs-bubble-meta: 11px; --wb-fs-bubble-time: 11px; --wb-fs-chip: 11px; --wb-fs-composer: 13px; --wb-fs-tool-icon: 16px; --wb-fs-md-h1: 12px; --wb-fs-md-h2: 12px; --wb-fs-md-h3: 12px; --wb-fs-insight-title: 17px; --wb-fs-insight-num: 17px; --wb-fs-insight-body: 11px; --wb-fs-insight-h4: 14px; --wb-fs-metric: 12px; --wb-fs-metric-strong: 12px; --wb-fs-welcome: 16px; } .assistant-modal-stage .message-answer-markdown :deep(table) { font-size: 12px; } .assistant-modal-stage .intent-pill { font-size: var(--wb-fs-chip); } } @media (max-width: 1440px) { .assistant-modal-stage { --wb-fs-title: 18px; --wb-fs-bubble: 12px; --wb-fs-bubble-meta: 11px; --wb-fs-composer: 12px; --wb-fs-insight-title: 16px; --wb-fs-insight-num: 16px; --wb-fs-md-h1: 12px; --wb-fs-md-h2: 12px; --wb-fs-md-h3: 12px; --wb-fs-insight-h4: 13px; --wb-fs-welcome: 16px; } } /* 大屏:左右分栏,右侧详情区宽度随视口收缩 */ @media (min-width: 1441px) and (max-width: 1680px) { .insight-panel-shell { width: clamp(280px, 26vw, 360px); } } /* 笔记本常见宽度:改为上下布局,对话区占满宽度,避免侧栏挤占 */ @media (max-width: 1440px) { .assistant-layout { flex-direction: column; } .dialog-panel { flex: 1 1 auto; min-height: 0; } .insight-panel-shell { width: 100%; flex: 0 0 auto; max-height: min(38dvh, 400px); transition: max-height 320ms cubic-bezier(0.22, 1, 0.36, 1), opacity 240ms cubic-bezier(0.22, 1, 0.36, 1), transform 280ms cubic-bezier(0.22, 1, 0.36, 1); } .insight-panel-shell.collapsed { max-height: 0; } .insight-panel { width: 100%; min-height: min(280px, 32dvh); } .insight-panel-shell.collapsed .insight-panel { transform: translateY(-12px); } .review-side-grid.compact { grid-template-columns: 1fr; } } /* 矮屏笔记本:压缩顶部栏与间距,把高度留给对话列表 */ @media (max-height: 820px) { .assistant-modal-stage { --wb-fs-title: 17px; --wb-fs-bubble: 12px; --wb-fs-composer: 12px; --wb-fs-insight-title: 15px; --wb-fs-insight-num: 15px; } .assistant-header { padding-top: 12px; padding-bottom: 10px; } .assistant-header-actions { top: 12px; right: 12px; } .assistant-layout { padding: 10px; gap: 10px; } .dialog-toolbar { padding: 12px 14px 10px; } .message-list { padding: 12px; gap: 10px; } .composer-shell-body { padding: 4px 10px; } } @media (max-width: 1280px) { .insight-panel-shell:not(.collapsed) { max-height: min(34dvh, 360px); } } @media (max-width: 760px) { .assistant-overlay { --assistant-viewport-inset: 10px; } .assistant-modal, .assistant-modal-stage { border-radius: 18px; } .assistant-header { padding: 18px 18px 16px; align-items: flex-start; flex-direction: column; } .assistant-header-actions { top: 18px; right: 18px; gap: 10px; width: auto; justify-content: space-between; } .assistant-toggle-btn, .session-trash-btn, .assistant-close-btn, .close-btn { width: 40px; height: 40px; border-radius: 14px; font-size: 16px; } .flow-step-card header { align-items: flex-start; } .assistant-layout { padding: 14px; } .composer-row { gap: 8px; --composer-control-size: 40px; } .composer-shell textarea { min-height: 32px; } .travel-calculator-form { grid-template-columns: 1fr; } .dialog-toolbar { padding: 16px 16px 12px; } .shortcut-chip { width: 100%; justify-content: center; } .message-list { padding: 16px; } .composer { padding: 0 16px 16px; } .composer-files-head, .review-insight-title-row, .review-document-stage-head, .review-document-switch-head { align-items: flex-start; flex-direction: column; } .composer-files-actions, .review-document-nav { width: 100%; justify-content: space-between; } .metric-grid { grid-template-columns: 1fr; } .review-side-grid, .review-side-category-grid, .review-document-edit-grid { grid-template-columns: 1fr; } .review-pending-item { grid-template-columns: 42px minmax(0, 1fr); } .review-pending-status { grid-column: 2; justify-self: start; } .review-footer-btn-row { flex-direction: column; } .review-footer-btn { width: 100%; } .review-slot-grid, .review-doc-field-grid, .review-mini-grid { grid-template-columns: 1fr; } .review-document-plain, .review-document-bubble { grid-template-columns: 1fr; } .review-preview-modal { width: calc(100vw - 24px); } .review-confirm-actions { padding: 0 18px 18px; justify-content: stretch; } .primary-dialog-btn, .secondary-dialog-btn, .danger-dialog-btn { width: 100%; } }