/* ============================================================
   专利生成系统 — 主样式表（优化版）
   设计风格：知识产权 × 科技感 × 精炼沉稳
   配色：深靛蓝主色 + 金色点缀 + 冷灰背景
   ============================================================ */

   @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;600;700&family=Noto+Sans+SC:wght@300;400;500;600&display=swap');

   /* ===== CSS 变量 ===== */
   :root {
     --primary:        #1a3a5c;      /* 深靛蓝 */
     --primary-light:  #2563a8;
     --primary-glow:   rgba(37,99,168,0.15);
     --accent:         #c9a84c;      /* 金色点缀 */
     --accent-light:   #f0d080;
     --bg-app:         #eef1f6;
     --bg-white:       #ffffff;
     --bg-panel:       #f7f8fa;
     --bg-output:      #f4f6f9;
     --border:         #d8dde6;
     --border-light:   #eaecf0;
     --text-primary:   #1a2437;
     --text-secondary: #4a5568;
     --text-muted:     #8899aa;
     --success:        #1a7a4a;
     --success-bg:     #edf7f1;
     --warning:        #a06800;
     --warning-bg:     #fff8e6;
     --error:          #c0392b;
     --error-bg:       #fdf0ee;
     --radius-sm:      6px;
     --radius-md:      10px;
     --radius-lg:      16px;
     --radius-xl:      24px;
     --shadow-sm:      0 1px 4px rgba(10,30,60,0.07);
     --shadow-md:      0 4px 16px rgba(10,30,60,0.10);
     --shadow-lg:      0 12px 40px rgba(10,30,60,0.13);
     --transition:     0.22s cubic-bezier(0.4,0,0.2,1);
     --font-serif:     'Noto Serif SC', 'Songti SC', STSong, serif;
     --font-sans:      'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
   }
   
   /* ===== 基础复位 ===== */
   *, *::before, *::after {
     margin: 0; padding: 0;
     box-sizing: border-box;
   }
   
   body {
     font-family: var(--font-sans);
     font-size: 14px;
     color: var(--text-primary);
     background-color: var(--bg-app);
     background-image:
       radial-gradient(ellipse 80% 60% at 20% -10%, rgba(37,99,168,0.10) 0%, transparent 60%),
       radial-gradient(ellipse 60% 50% at 90% 110%, rgba(201,168,76,0.07) 0%, transparent 55%);
     min-height: 100vh;
     padding: 20px;
     line-height: 1.6;
   }
   
   /* ===== 顶部导航 ===== */
   .top-nav {
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 0 32px;
     min-height: 88px;
     background: var(--primary);
     background-image: linear-gradient(135deg, #1a3a5c 0%, #0f2540 100%);
     border-bottom: 2px solid var(--accent);
     border-radius: var(--radius-lg) var(--radius-lg) 0 0;
     position: relative;
     overflow: hidden;
   }
   
   /* 顶栏背景纹理 */
   .top-nav::before {
     content: '';
     position: absolute;
     inset: 0;
     background-image: repeating-linear-gradient(
       90deg,
       transparent 0px,
       transparent 39px,
       rgba(255,255,255,0.02) 39px,
       rgba(255,255,255,0.02) 40px
     );
     pointer-events: none;
   }
   
   .top-nav-left {
     display: flex;
     align-items: center;
     gap: 16px;
     height: 100%;
     position: relative;
   }
   
   /* Logo 参与导航栏正常布局，尺寸不受覆盖层和页面缩放规则影响 */
   .top-nav-left .brand-logo {
     display: block;
     width: 150px !important;
     max-width: 150px !important;
     height: auto !important;
     object-fit: contain;
     flex: 0 0 150px;
     filter: drop-shadow(0 2px 4px rgba(0,0,0,0.22));
   }
   
   .site-title {
     font-family: var(--font-serif);
     font-size: 17px;
     font-weight: 600;
     color: var(--accent-light);
     letter-spacing: 0.04em;
     white-space: nowrap;
     margin-left: 4px;
   }
   
   .top-nav-right {
     display: flex;
     align-items: center;
     gap: 6px;
     position: relative;
   }
   
   .top-nav-right a {
     color: rgba(255,255,255,0.80);
     text-decoration: none;
     font-size: 13px;
     font-weight: 400;
     padding: 6px 14px;
     border-radius: var(--radius-sm);
     border: 1px solid transparent;
     transition: var(--transition);
     white-space: nowrap;
   }
   
   .top-nav-right a:hover {
     color: #fff;
     background: rgba(255,255,255,0.10);
     border-color: rgba(255,255,255,0.18);
   }
   
   #welcomeUser {
     color: var(--accent-light) !important;
     font-weight: 500;
     font-size: 13px;
     margin-right: 8px;
     padding: 5px 12px;
     background: rgba(201,168,76,0.15);
     border-radius: var(--radius-sm);
     border: 1px solid rgba(201,168,76,0.30);
   }
   
   /* ===== 主容器 ===== */
   .container {
     max-width: 1440px;
     margin: 0 auto;
     background: var(--bg-white);
     border-radius: var(--radius-xl);
     overflow: hidden;
     box-shadow: var(--shadow-lg);
   }
   
   /* ===== 页头 ===== */
   .header {
     background: var(--primary);
     background-image: linear-gradient(150deg, #1a3a5c 0%, #0f2540 60%, #162b48 100%);
     color: #fff;
     padding: 36px 48px 28px;
     position: relative;
     overflow: hidden;
   }
   
   /* 页头装饰线 */
   .header::after {
     content: '';
     position: absolute;
     bottom: 0; left: 0; right: 0;
     height: 3px;
     background: linear-gradient(90deg, transparent 0%, var(--accent) 30%, var(--accent-light) 50%, var(--accent) 70%, transparent 100%);
   }
   
   /* 页头背景图案 */
   .header::before {
     content: '';
     position: absolute;
     top: -40px; right: -40px;
     width: 320px; height: 320px;
     border-radius: 50%;
     background: radial-gradient(circle, rgba(201,168,76,0.06) 0%, transparent 70%);
     pointer-events: none;
   }
   
   .header h1 {
     font-family: var(--font-serif);
     font-size: 26px;
     font-weight: 700;
     letter-spacing: 0.03em;
     margin-bottom: 8px;
     position: relative;
   }
   
   .header p {
     font-size: 13.5px;
     opacity: 0.78;
     line-height: 1.7;
     position: relative;
   }
   
   .header p[align="right"] {
     text-align: right;
     font-size: 12px;
     opacity: 0.55;
     letter-spacing: 0.02em;
   }
   
   /* 在线人数 */
   .online-users {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     font-size: 12.5px;
     color: rgba(255,255,255,0.60);
     margin-top: 8px;
     position: relative;
   }
   
   .online-users::before {
     content: '';
     display: inline-block;
     width: 7px; height: 7px;
     border-radius: 50%;
     background: #4ade80;
     box-shadow: 0 0 6px #4ade80;
     animation: pulse 2s ease-in-out infinite;
   }
   
   @keyframes pulse {
     0%, 100% { opacity: 1; }
     50%       { opacity: 0.4; }
   }
   
   #onlineCount {
     color: var(--accent-light);
     font-weight: 600;
   }
   
   /* ===== 主体布局 ===== */
   .content {
     display: flex !important;
     flex-direction: row !important;
     flex-wrap: nowrap !important;
     align-items: stretch;
     min-height: 640px;
   }
   
   /* ===== 左侧输入区 ===== */
   .input-section {
     flex: 0 0 360px !important;
     min-width: 320px;
     padding: 32px 28px;
     border-right: 1px solid var(--border-light);
     background: var(--bg-panel);
     display: flex;
     flex-direction: column;
     gap: 0;
   }
   
   .input-section h2,
   .output-section h2 {
     font-family: var(--font-serif);
     font-size: 17px;
     font-weight: 700;
     color: var(--primary);
     letter-spacing: 0.02em;
     margin-bottom: 20px;
     padding-bottom: 12px;
     border-bottom: 2px solid var(--border-light);
     position: relative;
   }
   
   .input-section h2::after,
   .output-section h2::after {
     content: '';
     position: absolute;
     left: 0; bottom: -2px;
     width: 40px; height: 2px;
     background: var(--accent);
   }
   
   /* ===== 右侧输出区 ===== */
   .output-section {
     flex: 1 !important;
     padding: 32px 32px;
     min-width: 0;
     background: var(--bg-white);
   }
   
   .output-content {
     background: var(--bg-output);
     border: 1px solid var(--border-light);
     border-radius: var(--radius-md);
     padding: 20px 24px;
     white-space: pre-wrap;
     overflow-y: auto;
     max-height: 520px;
     line-height: 1.75;
     font-size: 13.5px;
     color: var(--text-secondary);
     font-family: var(--font-sans);
   }
   
   /* ===== 表单元素 ===== */
   .form-group {
     margin-bottom: 16px;
   }
   
   .form-group label {
     display: block;
     margin-bottom: 6px;
     font-size: 13px;
     font-weight: 500;
     color: var(--text-primary);
   }
   
   .form-group input,
   .form-group textarea {
     width: 100%;
     padding: 10px 13px;
     border: 1.5px solid var(--border);
     border-radius: var(--radius-sm);
     font-size: 13.5px;
     font-family: var(--font-sans);
     color: var(--text-primary);
     background: var(--bg-white);
     transition: border-color var(--transition), box-shadow var(--transition);
   }
   
   .form-group textarea {
     min-height: 88px;
     resize: vertical;
   }
   
   .form-group input:focus,
   .form-group textarea:focus {
     outline: none;
     border-color: var(--primary-light);
     box-shadow: 0 0 0 3px var(--primary-glow);
     background: #fff;
   }
   
   .form-group input::placeholder,
   .form-group textarea::placeholder {
     color: var(--text-muted);
     font-size: 13px;
   }
   
   /* 文件上传区 */
   .file-zone {
     display: flex;
     align-items: center;
     justify-content: center;
     height: 80px;
     border: 2px dashed var(--border);
     border-radius: var(--radius-sm);
     cursor: pointer;
     color: var(--text-muted);
     font-size: 13px;
     transition: var(--transition);
     background: var(--bg-panel);
   }
   
   .file-zone:hover {
     border-color: var(--primary-light);
     color: var(--primary-light);
     background: var(--primary-glow);
   }
   
   /* ===== 按钮 ===== */
   .btn {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
     width: 100%;
     padding: 11px 20px;
     margin-bottom: 8px;
     background: var(--primary);
     color: #fff;
     border: none;
     border-radius: var(--radius-sm);
     font-family: var(--font-sans);
     font-size: 13.5px;
     font-weight: 500;
     cursor: pointer;
     letter-spacing: 0.03em;
     transition: background var(--transition), box-shadow var(--transition), transform var(--transition);
     position: relative;
     overflow: hidden;
   }
   
   .btn::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,0.08) 50%, transparent 70%);
     transform: translateX(-100%);
     transition: transform 0.5s ease;
   }
   
   .btn:hover:not(:disabled)::after {
     transform: translateX(100%);
   }
   
   .btn:hover:not(:disabled) {
     background: var(--primary-light);
     box-shadow: 0 4px 16px rgba(37,99,168,0.30);
     transform: translateY(-1px);
   }
   
   .btn:active:not(:disabled) {
     transform: translateY(0);
     box-shadow: none;
   }
   
   .btn:disabled {
     background: #a0aab8;
     cursor: not-allowed;
     transform: none;
     box-shadow: none;
   }
   
   /* 强调按钮（金色边框变体） */
   #searchBtn {
     background: transparent;
     border: 1.5px solid var(--accent);
     color: var(--accent);
   }
   
   #searchBtn:hover:not(:disabled) {
     background: var(--accent);
     color: #fff;
     box-shadow: 0 4px 16px rgba(201,168,76,0.30);
     transform: translateY(-1px);
   }
   
   #searchBtn:disabled {
     background: transparent;
     border-color: #ccc;
     color: #aaa;
   }
   
   .btn-sm {
     width: auto;
     padding: 5px 14px;
     font-size: 12.5px;
     margin-bottom: 0;
   }
   
   .btn-danger { background: var(--error);   }
   .btn-danger:hover:not(:disabled) { background: #a93226; }
   .btn-primary { background: var(--primary-light); }
   
   /* ===== 选项卡 ===== */
   .tab-nav {
     display: flex;
     gap: 2px;
     margin-bottom: 20px;
     border-bottom: 2px solid var(--border-light);
     overflow-x: auto;
     scrollbar-width: none;
   }
   
   .tab-nav::-webkit-scrollbar { display: none; }
   
   .tab-btn {
     background: none;
     border: none;
     padding: 10px 18px;
     cursor: pointer;
     color: var(--text-muted);
     font-family: var(--font-sans);
     font-size: 13px;
     font-weight: 400;
     white-space: nowrap;
     border-bottom: 2.5px solid transparent;
     margin-bottom: -2px;
     transition: color var(--transition), border-color var(--transition);
   }
   
   .tab-btn:hover {
     color: var(--primary);
   }
   
   .tab-btn.active {
     color: var(--primary);
     border-bottom-color: var(--primary);
     font-weight: 600;
   }
   
   .tab-content         { display: none; }
   .tab-content.active  { display: block; }
   
   /* ===== 状态提示条 ===== */
   .status {
     display: inline-flex;
     align-items: center;
     gap: 7px;
     padding: 7px 14px;
     border-radius: 20px;
     margin-bottom: 12px;
     font-size: 12.5px;
     font-weight: 500;
     letter-spacing: 0.01em;
   }
   
   .status.generating {
     background: var(--warning-bg);
     border: 1px solid #e0b84a;
     color: var(--warning);
   }
   
   .status.generating::before {
     content: '';
     display: inline-block;
     width: 8px; height: 8px;
     border-radius: 50%;
     border: 2px solid var(--warning);
     border-top-color: transparent;
     animation: spin 0.9s linear infinite;
   }
   
   .status.completed {
     background: var(--success-bg);
     border: 1px solid #6ec89a;
     color: var(--success);
   }
   
   .status.completed::before {
     content: '✓';
     font-size: 11px;
     font-weight: 700;
   }
   
   .status.error {
     background: var(--error-bg);
     border: 1px solid #e8a49c;
     color: var(--error);
   }
   
   .status.error::before {
     content: '✕';
     font-size: 11px;
     font-weight: 700;
   }
   
   @keyframes spin { to { transform: rotate(360deg); } }
   
   /* 加载动画 */
   .loading {
     display: inline-block;
     width: 14px; height: 14px;
     border: 2px solid rgba(255,255,255,0.35);
     border-radius: 50%;
     border-top-color: #fff;
     animation: spin 0.8s linear infinite;
     flex-shrink: 0;
   }
   
   /* ===== 相似专利结果卡片 ===== */
   #similarity-output-tab .output-content {
     line-height: 1.4;
     padding: 12px;
     display: flex;
     flex-direction: column;
     gap: 8px;
   }
   
   .similarity-item {
     background: var(--bg-white);
     border: 1px solid var(--border);
     border-radius: var(--radius-md);
     padding: 14px 16px;
     transition: box-shadow var(--transition), border-color var(--transition);
   }
   
   .similarity-item:hover {
     border-color: var(--primary-light);
     box-shadow: var(--shadow-sm);
   }
   
   .similarity-header {
     display: flex;
     justify-content: space-between;
     align-items: flex-start;
     gap: 12px;
     margin-bottom: 8px;
   }
   
   .similarity-title {
     font-size: 14px;
     font-weight: 600;
     color: var(--primary);
     line-height: 1.4;
   }
   
   .similarity-score {
     flex-shrink: 0;
     background: var(--success);
     color: #fff;
     padding: 3px 10px;
     border-radius: 20px;
     font-size: 12px;
     font-weight: 600;
     letter-spacing: 0.02em;
   }
   
   .similarity-info {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 3px 12px;
     margin-bottom: 8px;
     font-size: 12px;
     color: var(--text-muted);
   }
   
   .similarity-label {
     font-weight: 600;
     color: var(--text-secondary);
   }
   
   .similarity-abstract {
     background: var(--bg-output);
     padding: 8px 12px;
     border-radius: var(--radius-sm);
     border-left: 3px solid var(--primary-light);
     font-size: 12.5px;
     line-height: 1.55;
     color: var(--text-secondary);
   }
   
   /* ===== 弹窗 ===== */
   .modal {
     position: fixed;
     inset: 0;
     background: rgba(10,20,40,0.55);
     backdrop-filter: blur(3px);
     z-index: 9999;
     display: none;
     justify-content: center;
     align-items: center;
     padding: 20px;
   }
   
   .modal-content {
     background: var(--bg-white);
     width: 60%;
     max-width: 700px;
     max-height: 85vh;
     border-radius: var(--radius-lg);
     box-shadow: 0 24px 60px rgba(10,20,40,0.25);
     display: flex;
     flex-direction: column;
     overflow: hidden;
     animation: modalIn 0.2s cubic-bezier(0.34,1.56,0.64,1);
   }
   
   @keyframes modalIn {
     from { opacity: 0; transform: scale(0.94) translateY(12px); }
     to   { opacity: 1; transform: scale(1) translateY(0); }
   }
   
   .modal-content h2 {
     font-family: var(--font-serif);
     font-size: 18px;
     font-weight: 700;
     color: var(--primary);
     padding: 22px 28px 0;
   }
   
   .modal-content h3 {
     font-family: var(--font-serif);
     font-size: 16px;
     font-weight: 600;
     color: var(--primary);
     padding: 20px 28px 0;
     margin-bottom: 4px;
   }
   
   .modal-body {
     flex: 1;
     overflow: auto;
     padding: 16px 28px 28px;
   }
   
   .modal-body iframe { width: 100%; height: 100%; border: none; }
   
   .modal-footer {
     padding: 16px 28px;
     border-top: 1px solid var(--border-light);
     display: flex;
     justify-content: flex-end;
     gap: 10px;
   }
   
   .modal-footer .btn {
     width: auto;
     padding: 9px 24px;
   }

   .info-modal-content { width: min(760px, 92vw); }
   .info-modal-body { color: var(--text-secondary); line-height: 1.9; }
   .info-modal-body h3 {
     padding: 14px 0 2px;
     margin: 0;
     color: var(--primary-light);
   }
   .info-modal-body p + p { margin-top: 10px; }
   .info-lead { color: var(--primary); font-weight: 600; }
   .info-signature { color: var(--primary-light); font-weight: 600; }

   .site-footer {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     gap: 8px 18px;
     padding: 18px 20px;
     font-size: 14px;
     line-height: 1.7;
     color: #2563a8;
   }
   .site-footer a,
   .footer-link {
     color: #2563a8;
     text-decoration: none;
   }
   .footer-link { cursor: pointer; font-weight: 500; }
   .site-footer a:hover,
   .footer-link:hover {
     color: #174f91;
     text-decoration: underline;
   }
   
   /* 绑定邮箱弹窗内 form 样式修正 */
   #bindEmailModal .modal-content {
     padding: 24px 28px;
   }
   
   #bindEmailModal form {
     display: flex;
     flex-direction: column;
     gap: 14px;
     margin-top: 14px;
   }
   
   #bindEmailModal input {
     width: 100%;
     padding: 10px 13px;
     border: 1.5px solid var(--border);
     border-radius: var(--radius-sm);
     font-size: 13.5px;
     font-family: var(--font-sans);
     transition: border-color var(--transition), box-shadow var(--transition);
   }
   
   #bindEmailModal input:focus {
     outline: none;
     border-color: var(--primary-light);
     box-shadow: 0 0 0 3px var(--primary-glow);
   }
   
   .captcha-group {
     display: flex;
     gap: 8px;
     align-items: center;
   }
   
   .captcha-group input { flex: 1; }
   
   /* ===== 下载区域 ===== */
   #downloadSection,
   #searchDownloadSection,
   #compareDownloadSection,
   #download1v1Section {
     margin-top: 14px;
     display: flex;
     gap: 10px;
     flex-wrap: wrap;
   }
   
   #downloadSection .btn,
   #searchDownloadSection .btn,
   #compareDownloadSection .btn,
   #download1v1Section .btn {
     width: auto;
     flex: 1;
     min-width: 140px;
     padding: 10px 18px;
     font-size: 13px;
     margin-bottom: 0;
   }
   
   /* ===== 一对一 tab ===== */
   #\31 v1-tab h3 {
     font-family: var(--font-serif);
     font-size: 14px;
     font-weight: 600;
     color: var(--primary);
     margin-bottom: 16px;
     padding-bottom: 8px;
     border-bottom: 1px solid var(--border-light);
   }
   
   /* ===== 响应式 ===== */
   @media (max-width: 900px) {
     .content {
       flex-direction: column !important;
     }
     .input-section {
       flex: none !important;
       width: 100%;
       border-right: none;
       border-bottom: 1px solid var(--border-light);
     }
     .header { padding: 24px 24px 20px; }
     .header h1 { font-size: 20px; }
   }
   
   @media (max-width: 600px) {
     body { padding: 8px; }
     .top-nav { padding: 0 16px; border-radius: var(--radius-md) var(--radius-md) 0 0; }
     .site-title { display: none; }
     .top-nav-left .brand-logo {
       width: 124px !important;
       max-width: 124px !important;
       flex-basis: 124px;
     }
     .input-section, .output-section { padding: 20px 16px; }
   }
   /* ================================================================
      历史记录模块样式
      ================================================================ */
   
   /* ---- 工具栏 ---- */
   .history-toolbar {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 10px 0 14px;
     gap: 10px;
     flex-wrap: wrap;
     border-bottom: 1px solid var(--border-light);
     margin-bottom: 14px;
   }
   
   .history-filter {
     display: flex;
     gap: 6px;
     flex-wrap: wrap;
   }
   
   .history-filter-btn {
     padding: 5px 14px;
     border-radius: 20px;
     border: 1px solid var(--border);
     background: var(--bg-panel);
     color: var(--text-secondary);
     font-size: 13px;
     cursor: pointer;
     transition: var(--transition);
   }
   
   .history-filter-btn:hover {
     border-color: var(--primary-light);
     color: var(--primary-light);
     background: var(--primary-glow);
   }
   
   .history-filter-btn.active {
     background: var(--primary-light);
     color: #fff;
     border-color: var(--primary-light);
   }
   
   .history-refresh-btn {
     font-size: 13px;
     padding: 5px 14px;
     border-radius: 20px;
   }
   
   /* ---- 列表容器 ---- */
   .history-list-container {
     max-height: 520px;
     overflow-y: auto;
     display: flex;
     flex-direction: column;
     gap: 10px;
     padding-right: 4px;
   }
   
   .history-list-container::-webkit-scrollbar { width: 5px; }
   .history-list-container::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
   
   .history-empty {
     text-align: center;
     color: var(--text-muted);
     padding: 40px 0;
     font-size: 14px;
   }
   
   /* ---- 历史卡片 ---- */
   .history-card {
     background: var(--bg-white);
     border: 1px solid var(--border-light);
     border-radius: var(--radius-md);
     padding: 12px 16px;
     transition: var(--transition);
     box-shadow: var(--shadow-sm);
   }
   
   .history-card:hover {
     border-color: var(--primary-light);
     box-shadow: var(--shadow-md);
     transform: translateY(-1px);
   }
   
   .history-card-header {
     display: flex;
     align-items: center;
     gap: 8px;
     flex-wrap: wrap;
     margin-bottom: 6px;
   }
   
   .history-card-title {
     font-weight: 600;
     color: var(--text-primary);
     font-size: 14px;
     flex: 1;
     min-width: 0;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
   }
   
   .history-card-time {
     color: var(--text-muted);
     font-size: 12px;
     white-space: nowrap;
   }
   
   .history-type-badge {
     display: inline-block;
     padding: 2px 8px;
     border-radius: 10px;
     font-size: 11px;
     font-weight: 600;
     white-space: nowrap;
   }
   
   .history-card-summary {
     font-size: 12px;
     color: var(--text-secondary);
     margin-bottom: 10px;
     line-height: 1.5;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
   }
   
   .history-card-actions {
     display: flex;
     gap: 8px;
     flex-wrap: wrap;
   }
   
   .btn-sm {
     padding: 4px 12px !important;
     font-size: 12px !important;
     border-radius: var(--radius-sm) !important;
   }
   
   .btn-danger-sm {
     background: var(--error-bg) !important;
     color: var(--error) !important;
     border-color: #f5c6c2 !important;
   }
   
   .btn-danger-sm:hover {
     background: var(--error) !important;
     color: #fff !important;
   }
   
   /* ---- 详情弹窗 ---- */
   .history-modal {
     position: fixed;
     inset: 0;
     background: rgba(10, 20, 40, 0.65);
     z-index: 9000;
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 20px;
     backdrop-filter: blur(4px);
   }
   
   .history-modal-inner {
     background: var(--bg-white);
     border-radius: var(--radius-lg);
     box-shadow: var(--shadow-lg);
     width: 100%;
     max-width: 860px;
     max-height: 88vh;
     display: flex;
     flex-direction: column;
     overflow: hidden;
   }
   
   .history-modal-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 16px 20px 12px;
     border-bottom: 1px solid var(--border-light);
     background: linear-gradient(135deg, var(--primary) 0%, #0f2540 100%);
     gap: 12px;
   }
   
   .history-modal-title {
     font-size: 16px;
     font-weight: 700;
     color: #fff;
     flex: 1;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
   }
   
   .history-modal-actions {
     display: flex;
     gap: 8px;
     flex-shrink: 0;
   }
   
   .history-modal-actions .btn {
     font-size: 12px;
     padding: 5px 14px;
   }
   
   .btn-close-history {
     background: rgba(255,255,255,0.12) !important;
     color: #fff !important;
     border-color: rgba(255,255,255,0.25) !important;
   }
   
   .btn-close-history:hover {
     background: rgba(255,255,255,0.22) !important;
   }
   
   .history-modal-meta {
     padding: 8px 20px;
     background: var(--bg-panel);
     border-bottom: 1px solid var(--border-light);
     display: flex;
     align-items: center;
   }
   
   .history-modal-section {
     display: flex;
     flex-direction: column;
     gap: 0;
   }
   
   .history-section-label {
     font-size: 12px;
     font-weight: 600;
     color: var(--text-muted);
     text-transform: uppercase;
     letter-spacing: 0.05em;
     padding: 10px 20px 6px;
     background: var(--bg-panel);
     border-bottom: 1px solid var(--border-light);
   }
   
   .history-input-box {
     padding: 12px 20px;
     background: var(--bg-panel);
     border-bottom: 1px solid var(--border-light);
     display: flex;
     flex-direction: column;
     gap: 6px;
     max-height: 180px;
     overflow-y: auto;
   }
   
   .history-input-row {
     display: flex;
     gap: 8px;
     font-size: 13px;
     line-height: 1.5;
   }
   
   .history-input-label {
     color: var(--text-muted);
     white-space: nowrap;
     flex-shrink: 0;
     min-width: 64px;
   }
   
   .history-input-val {
     color: var(--text-primary);
     word-break: break-word;
   }
   
   .history-output-box {
     flex: 1;
     overflow-y: auto;
     padding: 16px 20px;
     min-height: 200px;
     max-height: 380px;
     font-size: 13px;
     line-height: 1.8;
     background: #fff;
   }
   
   /* ---- 滚动条美化 ---- */
   .history-output-box::-webkit-scrollbar,
   .history-input-box::-webkit-scrollbar { width: 5px; }
   .history-output-box::-webkit-scrollbar-thumb,
   .history-input-box::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
   
   @media (max-width: 600px) {
     .history-modal-inner { max-height: 95vh; border-radius: var(--radius-md); }
     .history-modal-header { padding: 12px 14px; }
     .history-output-box { max-height: 280px; }
   }

   .recharge-package:hover {
    background: #f5f5f5;
    transform: translateX(5px);
    border-color: #ff6b35;
  }
  .credits-display {
    background: rgba(0, 229, 255, 0.2);
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 14px;
    margin-right: 15px;
  }
  .recharge-btn {
    background: linear-gradient(135deg, #ffd89b, #fdfff9);
    color: #333;
    border: none;
    padding: 6px 12px;
    border-radius: 20px;
    cursor: pointer;
    font-size: 13px;
    margin-left: 10px;
    transition: all 0.3s;
  }
  .recharge-btn:hover {
    transform: scale(1.05);
    background: linear-gradient(135deg, #ffecb3, #b3e5fc);
  }

 /* ===== 配额徽章 ===== */
 #quotaBadge {
  display: none;
  margin-right: 12px;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 600;
  background: rgba(234, 239, 71, 0.12);
  border: 1px solid rgba(0,229,255,0.35);
  cursor: pointer;
  transition: background .2s;
}
#quotaBadge:hover { background: rgba(255, 255, 255, 0.22); }

/* ===== 充值弹窗 ===== */
#rechargeModal .modal-content {
  max-width: 420px;
  background: #ffffff;
  border-radius: 12px;
  padding: 28px 32px;
  color: #0b0000;
}
#rechargeModal h3 {
  margin: 0 0 6px;
  color: #011a1d;
  font-size: 20px;
}
#rechargeTip {
  font-size: 14px;
  color: #ffaa00;
  margin-bottom: 18px;
  min-height: 20px;
}
.recharge-info {
  background:  #f0d080;
  ;
  border-radius: 8px;
  padding: 14px 16px;
  margin-bottom: 18px;
  font-size: 14px;
  line-height: 2;
}
.recharge-info strong { color: #000000; }
#rechargeQrBox {
  display: none;
  text-align: center;
  margin-bottom: 12px;
}
.recharge-btns {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}
#rechargeConfirmBtn {
  background: linear-gradient(135deg,#000000,#000609);
  color: #fff;
  border: none;
  padding: 9px 22px;
  border-radius: 7px;
  font-size: 15px;
  cursor: pointer;
  transition: opacity .2s;
}
#rechargeConfirmBtn:disabled { opacity: .6; cursor: not-allowed; }
#rechargeCancelBtn {
  background: transparent;
  color: #aaa;
  border: 1px solid #444;
  padding: 9px 18px;
  border-radius: 7px;
  font-size: 14px;
  cursor: pointer;
}
#rechargeCancelBtn:hover { border-color: #888; color: #ddd; }

  /* ===== 配额徽章（浅色·金色点缀，呼应主样式） ===== */
  #quotaBadge {
    display: none;
    margin-right: 8px;
    padding: 5px 12px;
    border-radius: var(--radius-sm, 6px);
    font-size: 13px;
    font-weight: 500;
    color: var(--accent-light, #f0d080);
    background: rgba(201,168,76,0.15);
    border: 1px solid rgba(201,168,76,0.30);
    cursor: pointer;
    transition: var(--transition, .22s);
    white-space: nowrap;
  }
  #quotaBadge:hover {
    background: rgba(201,168,76,0.28);
    border-color: rgba(201,168,76,0.5);
  }

  /* ===== 充值弹窗（白底·靛蓝标题·金色信息卡） ===== */
  #rechargeModal .modal-content {
    width: auto;
    max-width: 440px;
    padding: 0;
  }
  #rechargeModal h3 {
    font-family: var(--font-serif, serif);
    font-size: 19px;
    font-weight: 700;
    color: var(--primary, #1a3a5c);
    padding: 24px 28px 4px;
    margin: 0;
  }
  #rechargeTip {
    font-size: 13.5px;
    color: var(--warning, #a06800);
    padding: 0 28px;
    margin-bottom: 14px;
    min-height: 18px;
  }
  #rechargeTip:empty { margin-bottom: 6px; }
  .recharge-info {
    margin: 0 28px 18px;
    background: var(--bg-output, #f4f6f9);
    border: 1px solid var(--border-light, #eaecf0);
    border-left: 3px solid var(--accent, #c9a84c);
    border-radius: var(--radius-sm, 6px);
    padding: 14px 18px;
    font-size: 13.5px;
    line-height: 1.9;
    color: var(--text-secondary, #4a5568);
  }
  .recharge-info strong { color: var(--primary, #1a3a5c); font-weight: 600; }
  #rechargeQrBox { display: none; text-align: center; margin: 0 28px 12px; }
  .recharge-btns {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    padding: 0 28px 24px;
  }
  #rechargeConfirmBtn {
    background: var(--primary, #1a3a5c);
    color: #fff;
    border: none;
    padding: 10px 24px;
    border-radius: var(--radius-sm, 6px);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: var(--transition, .22s);
  }
  #rechargeConfirmBtn:hover:not(:disabled) {
    background: var(--primary-light, #2563a8);
    box-shadow: 0 4px 16px rgba(37,99,168,0.30);
  }
  #rechargeConfirmBtn:disabled { background: #a0aab8; cursor: not-allowed; }
  #rechargeCancelBtn {
    background: transparent;
    color: var(--text-secondary, #4a5568);
    border: 1.5px solid var(--border, #d8dde6);
    padding: 10px 20px;
    border-radius: var(--radius-sm, 6px);
    font-size: 14px;
    cursor: pointer;
    transition: var(--transition, .22s);
  }
  #rechargeCancelBtn:hover { border-color: var(--primary-light, #2563a8); color: var(--primary, #1a3a5c); }

  /* ===== 配额徽章 ===== */
  #quotaBadge {
    display: none; margin-right: 8px; padding: 5px 13px;
    border-radius: 6px; font-size: 13px; font-weight: 600;
    color: #f0d080; background: rgba(201,168,76,0.18);
    border: 1px solid rgba(201,168,76,0.45);
    cursor: pointer; transition: .22s; white-space: nowrap;
  }
  #quotaBadge:hover { background: rgba(201,168,76,0.32); border-color: #c9a84c; }

  /* ===== 充值弹窗（白底 · 靛蓝标题 · 金边信息卡） ===== */
  #rechargeModal .modal-content { width: auto; max-width: 440px; padding: 0; }
  #rechargeModal h3 {
    font-family: 'Noto Serif SC', serif; font-size: 19px; font-weight: 700;
    color: #1a3a5c; padding: 24px 28px 4px; margin: 0;
  }
  #rechargeTip { font-size: 13.5px; color: #a06800; padding: 0 28px; margin-bottom: 14px; min-height: 18px; }
  #rechargeTip:empty { margin-bottom: 6px; }
  .recharge-info {
    margin: 0 28px 18px; background: #f4f6f9;
    border: 1px solid #eaecf0; border-left: 3px solid #c9a84c;
    border-radius: 6px; padding: 14px 18px;
    font-size: 13.5px; line-height: 1.9; color: #4a5568;
  }
  .recharge-info strong { color: #1a3a5c; font-weight: 600; }
  #rechargeQrBox { display: none; text-align: center; margin: 0 28px 12px; }
  .recharge-btns { display: flex; gap: 10px; justify-content: flex-end; padding: 0 28px 24px; }
  #rechargeConfirmBtn {
    background: linear-gradient(135deg, #1a3a5c, #0f2540); color: #fff;
    border: none; padding: 10px 24px; border-radius: 6px;
    font-size: 14px; font-weight: 500; cursor: pointer; transition: .22s;
  }
  #rechargeConfirmBtn:hover:not(:disabled) { background: linear-gradient(135deg, #2563a8, #1a3a5c); box-shadow: 0 4px 16px rgba(37,99,168,.3); }
  #rechargeConfirmBtn:disabled { background: #a0aab8; cursor: not-allowed; }
  #rechargeCancelBtn {
    background: transparent; color: #4a5568; border: 1.5px solid #d8dde6;
    padding: 10px 20px; border-radius: 6px; font-size: 14px; cursor: pointer; transition: .22s;
  }
  #rechargeCancelBtn:hover { border-color: #2563a8; color: #1a3a5c; }

/* 对话流容器 */
.chat-stream{
  background:var(--bg-output,#f4f6f9);
  border:1px solid var(--border-light,#eaecf0);
  border-radius:var(--radius-md,10px) var(--radius-md,10px) 0 0;
  padding:18px;
  height:460px;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  gap:15px;
  scrollbar-width:thin;
  scrollbar-color:var(--border,#d8dde6) transparent;
}
.chat-stream::-webkit-scrollbar{width:6px}
.chat-stream::-webkit-scrollbar-thumb{background:var(--border,#d8dde6);border-radius:4px}

/* 空态提示 */
.chat-empty-hint{
  margin:auto;text-align:center;
  color:var(--text-muted,#8899aa);font-size:14px;line-height:2;
}
.chat-empty-icon{font-size:42px;display:block;margin-bottom:10px;opacity:.45}

/* 消息行 */
.chat-row{display:flex;gap:10px;max-width:100%}
.chat-row.user{flex-direction:row-reverse}
.chat-avatar{
  width:30px;height:30px;border-radius:8px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:#fff;
}
.chat-row.ai .chat-avatar{background:linear-gradient(135deg,#1a3a5c,#0f2540)}
.chat-row.user .chat-avatar{background:linear-gradient(135deg,#c9a84c,#b8923a);color:#1a2437}

.chat-bubble{
  padding:12px 15px;border-radius:12px;
  font-size:13.5px;line-height:1.75;
  white-space:pre-wrap;word-break:break-word;max-width:78%;
}
.chat-row.ai .chat-bubble{
  background:#fff;color:var(--text-primary,#1a2437);
  border:1px solid var(--border-light,#eaecf0);
  border-radius:4px 12px 12px 12px;
  box-shadow:0 1px 4px rgba(10,30,60,.06);
}
.chat-row.user .chat-bubble{
  background:var(--primary,#1a3a5c);color:#fff;
  border-radius:12px 4px 12px 12px;
}

/* 交底书首条特殊样式 */
.chat-row.ai.disclosure .chat-bubble{
  border-left:3px solid var(--accent,#c9a84c);max-width:90%;
}
.chat-disclosure-tag{
  font-size:11px;color:var(--accent,#c9a84c);font-weight:700;
  margin-bottom:7px;display:block;letter-spacing:.03em;
}

/* 流式光标 */
.chat-row.streaming .chat-bubble::after{
  content:'▋';color:var(--accent,#c9a84c);
  animation:chatBk .65s step-end infinite;margin-left:2px;
}
@keyframes chatBk{50%{opacity:0}}

/* 快捷指令 */
.chat-quick{
  display:flex;gap:6px;flex-wrap:wrap;
  padding:10px 0 0;
}
.chat-quick.disabled{opacity:.4;pointer-events:none}
.chat-quick-btn{
  font-size:11.5px;padding:4px 11px;
  border:1px solid var(--border,#d8dde6);border-radius:999px;
  background:#fff;color:var(--text-secondary,#4a5568);
  cursor:pointer;white-space:nowrap;transition:.2s;
}
.chat-quick-btn:hover{
  border-color:var(--primary-light,#2563a8);
  color:var(--primary,#1a3a5c);background:var(--bg-panel,#f7f8fa);
}

/* 锁定提示 */
.chat-lock-note{
  font-size:11.5px;color:var(--warning,#a06800);
  text-align:center;padding:8px 0 4px;
}

/* 输入条 */
.chat-input-bar{
  display:flex;gap:9px;align-items:flex-end;
  padding:10px 0 0;
}
#chatInput{
  flex:1;resize:none;
  border:1.5px solid var(--border,#d8dde6);border-radius:9px;
  padding:10px 13px;font-size:13.5px;line-height:1.6;
  min-height:42px;max-height:120px;overflow-y:auto;outline:none;
  color:var(--text-primary,#1a2437);background:#fff;
  font-family:var(--font-sans,sans-serif);transition:.2s;
}
#chatInput:focus{border-color:var(--primary-light,#2563a8);box-shadow:0 0 0 3px var(--primary-glow,rgba(37,99,168,.15))}
#chatInput:disabled{background:var(--bg-panel,#f7f8fa);color:var(--text-muted,#8899aa);cursor:not-allowed}
#chatInput::placeholder{color:var(--text-muted,#8899aa)}

.chat-send-btn{
  padding:0 20px;height:42px;
  background:var(--primary,#1a3a5c);color:#fff;border:none;border-radius:9px;
  font-size:13.5px;font-weight:500;cursor:pointer;flex-shrink:0;transition:.2s;
}
.chat-send-btn:hover:not(:disabled){background:var(--primary-light,#2563a8)}
.chat-send-btn:disabled{background:#a0aab8;cursor:not-allowed}
