/* ============================================================
   论文辅导平台 · 样式表（高端版 · 翡翠 × 暖玉）
   设计语言：墨绿 × 暖玉白 × 鎏金 —— 东方雅奢，专业而温润
   顶部 CSS 变量是主题色板，改这里可整体换肤
   注意：变量名 / 类名与 app.js 强耦合，只可改值，不可改名
   ============================================================ */

:root {
      /* 主体色：翡翠绿 */
      --primary: #1F8A6D; --primary-hover: #176B54; --primary-light: #E7F4EE;
      /* 语义色（精炼） */
      --success: #2E9E6B; --success-light: #E9F6F0;
      --warning: #C77E1F; --warning-light: #FBF3E3;
      --danger: #BE3B3B; --danger-light: #FBECED;
      --info: #2C6BA8; --info-light: #EAF2F9;
      /* 中性色：暖调灰，与暖玉白协调 */
      --gray-50: #F8F7F1; --gray-100: #F1EEE6; --gray-200: #E6E0D3; --gray-300: #D2CAB9;
      --gray-400: #9C9486; --gray-500: #6E675C; --gray-600: #564F45; --gray-700: #3E382F; --gray-800: #2A261F; --gray-900: #1A1712;
      /* 高级配色扩展：鎏金 / 墨绿深色 */
      --gold: #C9A45C; --gold-deep: #A88434; --gold-light: #F5EEDD; --gold-text: #8A6A2B;
      --ink: #06231C; --ink-2: #0F4A38; --ink-3: #1F8A6D;
      --ivory: #FBF7EF;
      --radius: 12px; --radius-lg: 18px;
      --shadow: 0 1px 2px rgba(26,38,28,.05), 0 1px 3px rgba(26,38,28,.06);
      --shadow-md: 0 4px 8px -2px rgba(26,38,28,.08), 0 12px 24px -6px rgba(26,38,28,.10);
      --shadow-lg: 0 24px 60px -12px rgba(6,35,28,.30);
      --transition: all 0.22s cubic-bezier(.4,0,.2,1);
    }
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'HarmonyOS Sans SC', 'Microsoft YaHei', sans-serif; background: var(--gray-50); color: var(--gray-800); line-height: 1.65; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
    ::selection { background: rgba(201,164,92,.30); color: var(--gray-900); }
    a { color: var(--primary); text-decoration: none; transition: var(--transition); }
    a:hover { color: var(--primary-hover); }
    button { cursor: pointer; font-family: inherit; border: none; }
    input, select, textarea { font-family: inherit; font-size: 15px; }
    ::-webkit-scrollbar { width: 8px; height: 8px; }
    ::-webkit-scrollbar-thumb { background: var(--gray-300); border-radius: 8px; }
    ::-webkit-scrollbar-thumb:hover { background: var(--gray-400); }
    ::-webkit-scrollbar-track { background: transparent; }

    /* ===== 登录页：墨绿极光渐变 + 细网格 + 鎏金顶线暖玉卡片 ===== */
    .auth-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; position: relative; padding: 20px;
      background:
        radial-gradient(720px 440px at 78% -12%, rgba(31,138,109,.45), transparent 62%),
        radial-gradient(600px 380px at 8% 112%, rgba(201,164,92,.16), transparent 55%),
        radial-gradient(680px 400px at 88% 90%, rgba(46,158,107,.26), transparent 60%),
        linear-gradient(160deg, #06231C 0%, #0C3A2C 50%, #0F4A38 100%); }
    .auth-page::before { content: ''; position: absolute; inset: 0; pointer-events: none;
      background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
      background-size: 48px 48px;
      -webkit-mask-image: radial-gradient(760px 520px at 50% 42%, rgba(0,0,0,.9), transparent 78%);
      mask-image: radial-gradient(760px 520px at 50% 42%, rgba(0,0,0,.9), transparent 78%); }
    .auth-page::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; pointer-events: none;
      background: linear-gradient(90deg, transparent 8%, rgba(201,164,92,.85) 50%, transparent 92%); }
    .auth-card { position: relative; z-index: 1; background: var(--ivory); border-radius: 20px; box-shadow: var(--shadow-lg); padding: 48px 40px 40px; width: 100%; max-width: 400px; overflow: hidden; }
    .auth-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
      background: linear-gradient(90deg, transparent, var(--gold) 35%, #E7CE9A 50%, var(--gold) 65%, transparent); }
    .auth-logo { text-align: center; margin-bottom: 34px; }
    .auth-logo h1 { font-size: 27px; font-weight: 700; letter-spacing: 5px; padding-left: 5px; color: var(--ink-2); }
    .auth-logo p { color: var(--gray-500); font-size: 15px; margin-top: 4px; }
    .form-group { margin-bottom: 20px; }
    .form-group label { display: block; font-size: 13px; font-weight: 600; color: var(--gray-600); margin-bottom: 7px; letter-spacing: .4px; }
    .form-group input, .form-group select { width: 100%; padding: 12px 14px; border: 1.5px solid var(--gray-200); border-radius: var(--radius); font-size: 15px; background: #FFFBF3; transition: var(--transition); outline: none; }
    .form-group input::placeholder { color: var(--gray-400); }
    .form-group input:hover, .form-group select:hover { border-color: var(--gray-300); }
    .form-group input:focus, .form-group select:focus { border-color: var(--primary); background: #fff; box-shadow: 0 0 0 4px rgba(31,138,109,.12); }

    /* ===== 按钮 ===== */
    .btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 20px; border-radius: var(--radius); font-size: 15px; font-weight: 500; letter-spacing: .3px; transition: var(--transition); border: 1.5px solid transparent; }
    .btn:focus-visible, .nav-item:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
    .btn-primary { background: linear-gradient(180deg, #23966F, var(--primary)); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 1px 3px rgba(6,35,28,.28); }
    .btn-primary:hover { background: linear-gradient(180deg, #1E8563, var(--primary-hover)); transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 6px 16px -4px rgba(6,35,28,.42); }
    .btn-primary:active { transform: translateY(0); }
    .btn-primary:disabled { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }
    .btn-outline { background: #fff; color: var(--primary); border-color: rgba(31,138,109,.42); }
    .btn-outline:hover { background: var(--primary-light); border-color: var(--primary); }
    .btn-ghost { background: none; color: var(--primary); font-size: 15px; padding: 4px 8px; }
    .btn-ghost:hover { text-decoration: underline; color: var(--primary-hover); }
    .btn-ghost.text-danger { color: var(--danger); }
    .btn-sm { padding: 6px 14px; font-size: 14px; border-radius: 9px; }
    .btn-success { background: var(--success); color: #fff; box-shadow: 0 1px 3px rgba(46,158,107,.3); }
    .btn-success:hover { background: #258A5E; }
    .btn-danger { background: var(--danger); color: #fff; box-shadow: 0 1px 3px rgba(190,59,59,.3); }
    .btn-danger:hover { background: #A32F2F; }
    .btn-block { width: 100%; }
    .btn-lg { padding: 13px; font-size: 15px; letter-spacing: 2px; font-weight: 600; }

    /* ===== 主框架：墨绿暗色侧栏 ===== */
    .app { display: flex; min-height: 100vh; }
    .sidebar { width: 220px; background: linear-gradient(180deg, var(--ink) 0%, var(--ink-2) 100%); position: fixed; top: 0; left: 0; bottom: 0; z-index: 100; display: flex; flex-direction: column; }
    .sidebar-logo { padding: 24px 20px 20px; border-bottom: 1px solid rgba(255,255,255,.10); }
    .sidebar-logo h2 { font-size: 19px; font-weight: 700; letter-spacing: 2px; background: linear-gradient(120deg, #E7CE9A, var(--gold) 60%, #B8934A); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
    .sidebar-logo p { font-size: 12px; color: rgba(255,255,255,.42); margin-top: 3px; letter-spacing: .5px; }
    .sidebar-nav { padding: 12px 0; flex: 1; overflow-y: auto; }
    .sidebar-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.14); }
    .nav-section { padding: 12px 20px 5px; font-size: 11px; text-transform: uppercase; letter-spacing: 1.5px; color: rgba(255,255,255,.34); font-weight: 600; }
    .nav-item { display: flex; align-items: center; gap: 10px; padding: 11px 20px; color: rgba(255,255,255,.66); font-size: 14.5px; cursor: pointer; transition: var(--transition); border: none; background: none; width: 100%; text-align: left; position: relative; }
    .nav-item:hover { background: rgba(255,255,255,.07); color: #fff; }
    .nav-item.active { background: linear-gradient(90deg, rgba(201,164,92,.22), rgba(201,164,92,.05)); color: #EDDCB4; font-weight: 600; }
    .nav-item.active::before { content: ''; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px; border-radius: 0 3px 3px 0; background: linear-gradient(180deg, #E7CE9A, var(--gold)); }
    .nav-item .icon { width: 20px; text-align: center; font-size: 15px; }
    .nav-item.active .icon { filter: drop-shadow(0 0 6px rgba(201,164,92,.45)); }
    .sidebar-footer { padding: 16px 20px; border-top: 1px solid rgba(255,255,255,.10); display: flex; align-items: center; gap: 10px; }
    .sidebar-avatar { width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg, #E0C489, #B8934A); color: #2B1F09; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 700; box-shadow: 0 0 0 2px rgba(201,164,92,.28); }
    .sidebar-user-info { flex: 1; min-width: 0; }
    .sidebar-user-info .name { font-size: 14px; font-weight: 600; color: rgba(255,255,255,.92); }
    .sidebar-user-info .balance { font-size: 12px; color: #DCC48C; font-weight: 600; letter-spacing: .3px; }
    .role-badge { font-size: 10px; padding: 2px 7px; border-radius: 5px; font-weight: 600; letter-spacing: .5px; }
    .role-admin { background: var(--danger-light); color: var(--danger); }
    .role-agent { background: var(--gold-light); color: var(--gold-text); }
    .role-user { background: var(--info-light); color: var(--info); }

    /* ===== 顶栏 / 内容区 ===== */
    .main { margin-left: 220px; flex: 1; min-height: 100vh; display: flex; flex-direction: column; }
    .topbar { background: rgba(255,255,255,.88); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--gray-100); padding: 14px 28px; display: flex; align-items: center; justify-content: space-between; position: sticky; top: 0; z-index: 50; }
    .topbar h3 { font-size: 18px; font-weight: 700; color: var(--gray-900); letter-spacing: .5px; }
    .topbar-right { display: flex; align-items: center; gap: 12px; }
    .points-badge { background: linear-gradient(135deg, var(--ink-2), var(--ink)); color: #EDDCB4; padding: 8px 18px; border-radius: 22px; font-size: 16px; font-weight: 700; letter-spacing: .4px; font-variant-numeric: tabular-nums; box-shadow: 0 2px 10px rgba(6,35,28,.35), inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 1px rgba(201,164,92,.35); white-space: nowrap; }
    .content { padding: 28px; flex: 1 0 auto; }

    /* ===== 卡片 / 统计卡 ===== */
    .card { background: #fff; border: 1px solid var(--gray-100); border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: 24px; margin-bottom: 20px; }
    .card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
    .card-header h3 { font-size: 16px; font-weight: 700; color: var(--gray-900); letter-spacing: .3px; }
    .stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-bottom: 24px; }
    .stat-card { background: #fff; border: 1px solid var(--gray-100); border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: 22px; position: relative; overflow: hidden; transition: var(--transition); }
    .stat-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
    .stat-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; }
    .stat-card.purple::before { background: linear-gradient(90deg, var(--ink-2), var(--ink-3)); }
    .stat-card.green::before { background: linear-gradient(90deg, var(--primary), #3AA67E); }
    .stat-card.orange::before { background: linear-gradient(90deg, var(--gold), var(--gold-deep)); }
    .stat-card.blue::before { background: linear-gradient(90deg, var(--info), #4A8CC7); }
    .stat-card .label { font-size: 13px; color: var(--gray-500); margin-bottom: 8px; letter-spacing: .3px; }
    .stat-card .value { font-size: 28px; font-weight: 700; color: var(--gray-900); font-variant-numeric: tabular-nums; letter-spacing: -.3px; }
    .stat-card .sub { font-size: 12px; color: var(--gray-400); margin-top: 4px; }

    /* ===== 上传区 ===== */
    .upload-zone { border: 1.5px dashed var(--gray-300); border-radius: var(--radius-lg); padding: 48px 24px; text-align: center; cursor: pointer; transition: var(--transition); background: linear-gradient(180deg, #FEFAFC, var(--gray-50)); }
    .upload-zone:hover, .upload-zone.dragover { border-color: var(--primary); background: var(--primary-light); }
    .upload-zone .uz-icon { font-size: 46px; margin-bottom: 8px; }
    .upload-zone h4 { font-size: 16px; color: var(--gray-700); font-weight: 600; }
    .upload-zone p { font-size: 14px; color: var(--gray-500); margin-top: 4px; }
    .file-preview { margin-top: 16px; padding: 12px 16px; background: var(--success-light); border: 1px solid rgba(46,158,107,.18); border-radius: var(--radius); display: flex; align-items: center; justify-content: space-between; font-size: 15px; }

    /* ===== 智评提分页 UI（scoring-*）：墨绿主视觉 ===== */
    .scoring-hero { position: relative; border-radius: var(--radius-lg); padding: 30px 32px 26px; color: #fff; overflow: hidden; margin-bottom: 22px; background: linear-gradient(120deg, #06231C 0%, var(--ink-2) 55%, var(--ink-3) 110%); box-shadow: var(--shadow-lg); }
    .scoring-hero::before { content: ''; position: absolute; right: -70px; top: -90px; width: 280px; height: 280px; border-radius: 50%; background: radial-gradient(circle, rgba(231,206,154,.22), transparent 65%); pointer-events: none; }
    .scoring-hero::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: linear-gradient(90deg, transparent, rgba(201,164,92,.7), transparent); pointer-events: none; }
    .scoring-hero h2 { font-size: 23px; font-weight: 700; letter-spacing: .5px; display: flex; align-items: center; gap: 10px; }
    .scoring-hero .sc-tagline { margin-top: 10px; font-size: 13.5px; opacity: .85; letter-spacing: .3px; position: relative; z-index: 1; }
    .sc-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; position: relative; z-index: 1; }
    .sc-chip { background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.26); backdrop-filter: blur(4px); padding: 6px 16px; border-radius: 999px; font-size: 13px; letter-spacing: .5px; transition: var(--transition); }
    .sc-chip:hover { background: rgba(231,206,154,.22); border-color: rgba(231,206,154,.55); transform: translateY(-1px); }
    .sc-cols { display: flex; gap: 20px; flex-wrap: wrap; align-items: stretch; }
    .sc-col { flex: 1; min-width: 300px; display: flex; flex-direction: column; }
    .sc-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
    .sc-no { width: 26px; height: 26px; border-radius: 50%; background: linear-gradient(135deg, var(--primary), var(--ink-3)); color: #fff; font-size: 14px; font-weight: 700; display: flex; align-items: center; justify-content: center; flex: none; box-shadow: 0 2px 6px rgba(31,138,109,.4); }
    .sc-title { font-size: 15px; font-weight: 600; color: var(--gray-800); }
    .sc-opt { font-size: 12px; color: var(--gray-400); }
    .sc-zone { border: 1.5px dashed var(--gray-300); border-radius: var(--radius-lg); padding: 40px 20px; text-align: center; cursor: pointer; transition: var(--transition); background: linear-gradient(180deg, #FEFAFC, var(--gray-50)); flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }
    .sc-zone:hover, .sc-zone.dragover { border-color: var(--primary); background: var(--primary-light); transform: translateY(-2px); box-shadow: var(--shadow-md); }
    .sc-emoji { font-size: 42px; line-height: 1.15; }
    .sc-main { font-size: 16px; font-weight: 600; color: var(--gray-700); margin-top: 6px; }
    .sc-hint { font-size: 13px; color: var(--gray-400); margin-top: 2px; }
    .sc-note { margin-top: 10px; font-size: 12.5px; color: var(--gray-500); background: var(--gray-100); border-radius: var(--radius); padding: 9px 12px; line-height: 1.7; }
    .sc-note.amber { background: var(--warning-light); color: #8A5A14; }

    /* ===== 表格 ===== */
    .table-wrap { overflow-x: auto; }
    table { width: 100%; border-collapse: collapse; font-size: 15px; }
    th { background: var(--gray-50); padding: 11px 14px; text-align: left; font-weight: 600; color: var(--gray-500); font-size: 13px; letter-spacing: .6px; border-bottom: 1px solid var(--gray-200); white-space: nowrap; }
    td { padding: 12px 14px; border-bottom: 1px solid var(--gray-100); color: var(--gray-700); font-variant-numeric: tabular-nums; }
    tr:hover td { background: #FBFAF4; }

    /* ===== 徽章 ===== */
    .badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; letter-spacing: .3px; }
    .badge-pending { background: var(--warning-light); color: #8A5A14; }
    .badge-processing { background: var(--info-light); color: #1F568C; }
    .badge-completed { background: var(--success-light); color: #14684A; }
    .badge-failed { background: var(--danger-light); color: #97282B; }
    .badge-active { background: var(--success-light); color: #14684A; }
    .badge-frozen { background: var(--danger-light); color: #97282B; }
    /* 成品未下载醒目提示（呼吸动画引导用户注意） */
    .badge-undl { background: #FBE3E4; color: #97282B; font-weight: 700; border: 1px solid #EFAFB2; animation: undlPulse 1.4s ease-in-out infinite; }
    @keyframes undlPulse { 0%, 100% { opacity: 1; } 50% { opacity: .5; } }

    /* ===== 弹窗 ===== */
    .modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(6,35,28,.52); backdrop-filter: blur(3px); display: flex; align-items: center; justify-content: center; z-index: 1000; opacity: 0; visibility: hidden; transition: var(--transition); }
    .modal-overlay.show { opacity: 1; visibility: visible; }
    .modal { background: #fff; border-radius: 20px; box-shadow: var(--shadow-lg); padding: 28px; width: 100%; max-width: 460px; max-height: 80vh; overflow-y: auto; transform: translateY(20px) scale(.98); transition: var(--transition); }
    .modal-overlay.show .modal { transform: translateY(0) scale(1); }
    .modal-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
    .modal-header h3 { font-size: 18px; font-weight: 700; color: var(--gray-900); }
    .modal-close { background: none; border: none; font-size: 24px; color: var(--gray-400); cursor: pointer; transition: var(--transition); }
    .modal-close:hover { color: var(--gray-700); }
    .modal-footer { display: flex; justify-content: flex-end; gap: 10px; margin-top: 24px; }
    .cm-body { font-size: 16.5px; line-height: 1.95; color: var(--gray-700); letter-spacing: .2px; }
    .cm-body p { margin: 0 0 12px; }
    .cm-body p:last-child { margin-bottom: 0; }
    .cm-lead { font-size: 18px; font-weight: 700; color: var(--gray-900); }
    .cm-body b { color: var(--primary); font-weight: 700; padding: 0 1px; }
    .cm-warn { color: #8A5A14; background: var(--warning-light); border-left: 3px solid var(--gold-deep); border-radius: 8px; padding: 11px 14px; font-size: 15px; }
    .info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .info-item { min-width: 0; }
    .info-item .info-label { font-size: 12px; color: var(--gray-500); }
    .info-item .info-value { font-size: 15px; font-weight: 500; margin-top: 2px; word-break: break-all; }

    /* ===== 轻提示 ===== */
    .toast-box { position: fixed; top: 20px; right: 20px; z-index: 2000; display: flex; flex-direction: column; gap: 8px; }
    .toast { padding: 12px 20px; border-radius: var(--radius); font-size: 15px; box-shadow: var(--shadow-md); animation: slideIn 0.3s ease; }
    .toast-success { background: var(--success); color: #fff; }
    .toast-error { background: var(--danger); color: #fff; }
    .toast-info { background: var(--primary); color: #fff; }
    @keyframes slideIn { from { transform: translateX(100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
    .hidden { display: none !important; }
    .text-muted { color: var(--gray-500); font-size: 14px; }
    .text-primary { color: var(--primary); } .text-success { color: var(--success); } .text-danger { color: var(--danger); }
    .mt-2 { margin-top: 8px; } .mt-3 { margin-top: 12px; } .mt-4 { margin-top: 16px; } .mb-4 { margin-bottom: 16px; }
    .empty { text-align: center; padding: 48px 24px; color: var(--gray-400); }
    .empty .empty-icon { font-size: 48px; margin-bottom: 12px; }
    .filter-bar { display: flex; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; align-items: center; }
    .filter-bar select, .filter-bar input { padding: 8px 12px; border: 1.5px solid var(--gray-200); border-radius: var(--radius); font-size: 15px; outline: none; background: #fff; transition: var(--transition); }
    .filter-bar select:focus, .filter-bar input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(31,138,109,.12); }
    .site-footer { padding: 22px 28px 30px; text-align: center; color: var(--gray-400); font-size: 13px; }
    .auth-foot { margin-top: 20px; text-align: center; color: var(--gray-400); font-size: 12px; }

    /* ===== 鎏金价格标签 ===== */
    .svc-price { display: inline-flex; align-items: center; gap: 4px; background: linear-gradient(135deg, #F0E1BC, #DCC084); color: #5C4413; border: 1px solid #E3CE9C; padding: 7px 18px; border-radius: 999px; font-size: 16px; font-weight: 800; letter-spacing: .3px; font-variant-numeric: tabular-nums; box-shadow: 0 2px 8px rgba(168,132,52,.25), inset 0 1px 0 rgba(255,255,255,.55); white-space: nowrap; }
    .svc-price .unit { font-size: 12.5px; font-weight: 600; opacity: .85; }

    /* ===== 降重解析费用卡（暖玉浅调 + 翡翠点缀） ===== */
    .cost-card { margin-top: 16px; background: linear-gradient(135deg, #F4F8F5, #FAF5E9); border: 1px solid #D8E5DC; border-radius: var(--radius-lg); padding: 16px 20px; box-shadow: var(--shadow); }
    .cost-card-h { font-size: 13px; color: var(--primary); font-weight: 700; margin-bottom: 10px; display: flex; align-items: center; gap: 6px; letter-spacing: .5px; }
    .cost-card-rows { display: flex; gap: 28px; flex-wrap: wrap; }
    .cost-card-cell { display: flex; flex-direction: column; gap: 2px; }
    .cost-card-label { font-size: 12px; color: var(--gray-500); }
    .cost-card-val { font-size: 18px; font-weight: 700; color: var(--gray-800); font-variant-numeric: tabular-nums; }
    .cost-card-total { display: flex; align-items: baseline; justify-content: space-between; margin-top: 14px; padding-top: 12px; border-top: 1px dashed rgba(31,138,109,.32); }
    .cost-card-total-l { font-size: 15px; color: var(--gray-700); font-weight: 600; }
    .cost-card-price { font-size: 30px; font-weight: 800; color: var(--primary); letter-spacing: .5px; font-variant-numeric: tabular-nums; }
    .cost-card-price .cur { font-size: 15px; font-weight: 700; margin-left: 3px; }
    .cost-card-note { margin-top: 8px; text-align: right; font-size: 13px; color: var(--danger); font-weight: 700; }
    .cost-card-parsing { margin-top: 16px; padding: 14px 20px; background: var(--info-light); border: 1.5px dashed var(--info); border-radius: var(--radius-lg); color: var(--info); font-size: 14px; font-weight: 600; }
    .cost-card-err { margin-top: 16px; padding: 14px 20px; background: var(--danger-light); border: 1.5px solid var(--danger); border-radius: var(--radius-lg); color: var(--danger); font-size: 14px; font-weight: 600; }
    .cost-card-hint { font-size: 13px; color: var(--gray-400); margin-top: 8px; }

    /* ===== 提交后进度弹窗 ===== */
    .prog-hero { text-align: center; font-size: 40px; line-height: 1.1; margin: 4px 0 2px; }
    .prog-title { text-align: center; font-weight: 700; font-size: 16px; color: var(--gray-800); }
    .prog-sub { text-align: center; font-size: 13px; color: var(--gray-500); margin-top: 2px; }
    .prog-steps { display: flex; justify-content: space-between; margin: 20px 0 6px; }
    .prog-step { flex: 1; text-align: center; font-size: 13px; color: var(--gray-400); }
    .prog-step .dot { width: 30px; height: 30px; border-radius: 50%; background: var(--gray-200); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 700; margin-bottom: 4px; }
    .prog-step.done { color: var(--success); } .prog-step.done .dot { background: var(--success); }
    .prog-step.active { color: var(--primary); font-weight: 600; } .prog-step.active .dot { background: var(--primary); box-shadow: 0 0 0 4px rgba(31,138,109,.14); }
    .prog-step.err { color: var(--danger); } .prog-step.err .dot { background: var(--danger); }
    .prog-wrap { margin: 14px 0 4px; }
    .prog-track { height: 12px; background: var(--gray-100); border-radius: 8px; overflow: hidden; position: relative; }
    .prog-fill { height: 100%; background: linear-gradient(90deg, var(--primary), var(--ink-3)); border-radius: 8px; transition: width .5s ease; }
    .prog-fill.indeterminate { position: absolute; left: 0; width: 35%; transition: none; animation: progMove 1.15s infinite ease-in-out; }
    @keyframes progMove { 0% { left: -35%; } 100% { left: 100%; } }
    .prog-pct { text-align: center; font-size: 15px; font-weight: 700; color: var(--primary); margin-top: 8px; font-variant-numeric: tabular-nums; }
    .prog-info { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--gray-100); }

    /* ===== 订单列表：行内进度条 / 文件名 / 下载按钮 / 分页 ===== */
    .lpb { display: flex; align-items: center; gap: 8px; min-width: 150px; }
    .lpb-track { flex: 1; height: 6px; background: var(--gray-100); border-radius: 4px; overflow: hidden; }
    .lpb-bar { height: 100%; border-radius: 4px; transition: width .5s ease; }
    .lpb-bar.pending { background: var(--warning); }
    .lpb-bar.processing { background: linear-gradient(90deg, var(--primary), var(--ink-3)); }
    .lpb-bar.completed { background: var(--success); }
    .lpb-bar.failed { background: var(--danger); }
    .lpb-txt { font-size: 12px; color: var(--gray-500); white-space: nowrap; }
    .fname { display: inline-block; max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
    .btn-dl { display: inline-flex; align-items: center; gap: 5px; padding: 5px 12px; border-radius: 8px; font-size: 13px; font-weight: 600; color: #fff; background: linear-gradient(180deg, #23966F, var(--primary)); border: 1px solid var(--primary); cursor: pointer; transition: var(--transition); box-shadow: 0 1px 3px rgba(31,138,109,.35); white-space: nowrap; }
    .btn-dl:hover { background: linear-gradient(180deg, #1E8563, var(--primary-hover)); transform: translateY(-1px); box-shadow: 0 3px 8px rgba(31,138,109,.4); }
    .btn-dl:active { transform: translateY(0); box-shadow: 0 1px 2px rgba(31,138,109,.3); }
    .pager { display: flex; align-items: center; justify-content: space-between; padding: 10px 4px 0; font-size: 13px; color: var(--gray-500); }
    .pager button:disabled { opacity: .45; cursor: not-allowed; }

    /* ===== 论文辅导：tab / 识别标签 / 步骤 ===== */
    .wt-tabs { display: flex; gap: 8px; border-bottom: 1px solid var(--gray-200); }
    .wt-tab { padding: 10px 20px; font-size: 15px; font-weight: 500; color: var(--gray-500); background: none; border: none; border-bottom: 2px solid transparent; cursor: pointer; transition: var(--transition); }
    .wt-tab.active { color: var(--primary); border-bottom-color: var(--gold); font-weight: 600; }
    .wt-tab:hover { color: var(--gray-800); }
    .wr-textarea { width: 100%; min-height: 150px; padding: 12px 14px; border: 1.5px solid var(--gray-200); border-radius: var(--radius); font-size: 15px; line-height: 1.7; outline: none; resize: vertical; font-family: inherit; box-sizing: border-box; background: #FFFBF3; transition: var(--transition); }
    .wr-textarea:focus { border-color: var(--primary); background: #fff; box-shadow: 0 0 0 4px rgba(31,138,109,.12); }
    .wr-rec-head { font-size: 14px; color: var(--gray-500); margin-bottom: 6px; }
    .wr-rec-fields { margin-top: 14px; padding: 14px 16px 4px; background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius); }
    .wr-rec-fields-title { font-size: 13px; color: var(--gray-500); margin-bottom: 10px; font-weight: 600; }
    .wr-chip { display: inline-block; padding: 4px 10px; border-radius: 999px; font-size: 12px; margin: 0 6px 6px 0; }
    .wr-chip.ok { background: var(--success-light); color: #14684A; }
    .wr-chip.no { background: var(--gray-100); color: var(--gray-400); }
    .wr-step { border: 1px solid var(--gray-200); border-radius: var(--radius-lg); margin-bottom: 16px; overflow: hidden; }
    .wr-step-h { padding: 12px 16px; background: var(--gray-50); font-weight: 600; font-size: 15px; color: var(--gray-700); display: flex; align-items: center; gap: 10px; }
    .wr-step-n { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--primary); color: white; font-size: 14px; }
    .wr-step-b { padding: 16px; }
    .wr-row-invalid td { background: var(--danger-light); }
    /* 单个提交页三段式分组 */
    .wr-fieldset { padding: 14px 16px 12px; background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius); }
    .wr-fieldset-title { font-size: 13px; color: var(--gray-600); margin-bottom: 10px; font-weight: 600; }
    .wr-req-hint { font-size: 12px; color: var(--gray-400); font-weight: normal; margin-left: 8px; }

    /* ===== 文本降重/降AI：左粘贴右结果即时工具 ===== */
    .dt-cols { display: flex; gap: 20px; flex-wrap: wrap; }
    .dt-col { flex: 1; min-width: 320px; display: flex; flex-direction: column; }
    .dt-col-h { font-size: 15px; font-weight: 600; color: var(--gray-700); margin-bottom: 8px; }
    .dt-ta { flex: 1; min-height: 340px; }
    .dt-result { background: var(--gray-50); }
    .dt-count { font-size: 13px; margin-top: 6px; }
    .dt-actions { display: none; align-items: center; gap: 12px; margin-top: 12px; }
    .dt-actions.show { display: flex; }
    .dt-meta { font-size: 13px; }

    @media (max-width: 768px) { .sidebar { transform: translateX(-100%); } .main { margin-left: 0; } .stats-grid { grid-template-columns: 1fr 1fr; } .content { padding: 16px; } .topbar { padding: 12px 16px; } }

    /* ===== 客服悬浮按钮 ===== */
    .cs-widget { position: fixed; right: 22px; bottom: 22px; z-index: 900; display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
    .cs-menu { display: flex; flex-direction: column; gap: 8px; opacity: 0; visibility: hidden; transform: translateY(10px) scale(.96); transition: var(--transition); }
    .cs-widget.open .cs-menu { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }
    .cs-item { display: flex; align-items: center; gap: 8px; background: #fff; color: var(--gray-700); border: 1px solid var(--gray-200); border-radius: 999px; padding: 9px 16px; font-size: 14px; font-weight: 500; box-shadow: var(--shadow-md); cursor: pointer; transition: var(--transition); white-space: nowrap; }
    .cs-item:hover { background: var(--primary-light); color: var(--primary); border-color: var(--primary); }
    .cs-fab { width: 56px; height: 56px; border-radius: 50%; background: linear-gradient(135deg, #23966F, var(--ink)); color: #E7CE9A; border: 1px solid rgba(201,164,92,.4); box-shadow: var(--shadow-lg); font-size: 24px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: var(--transition); }
    .cs-fab:hover { transform: scale(1.06); box-shadow: 0 16px 40px -8px rgba(6,35,28,.5); }
    .cs-qr-wrap { text-align: center; }
    .cs-qr-wrap img { max-width: 240px; width: 100%; border-radius: var(--radius); border: 1px solid var(--gray-200); }
    textarea.cs-content { width: 100%; padding: 12px 14px; border: 1.5px solid var(--gray-200); border-radius: var(--radius); font-size: 15px; outline: none; min-height: 110px; resize: vertical; font-family: inherit; background: #FFFBF3; transition: var(--transition); }
    textarea.cs-content:focus { border-color: var(--primary); background: #fff; box-shadow: 0 0 0 4px rgba(31,138,109,.12); }

    /* 弱动效偏好：尊重系统设置 */
    @media (prefers-reduced-motion: reduce) {
      .badge-undl, .prog-fill.indeterminate { animation: none; }
      .stat-card:hover, .btn-primary:hover, .btn-dl:hover { transform: none; }
    }

/* ===== 兼容补丁（2026-11-05 上线时补，避免个别组件掉样式）===== */
.badge-info {
  background: var(--primary-light, #E7F3EE);
  color: var(--primary, #1F7A5C);
  border: 1px solid var(--primary, #1F7A5C);
  border-radius: 6px;
  padding: 2px 8px;
  font-size: 12px;
  white-space: nowrap;
}
.auth-switch { margin-top: 12px; }
.auth-switch a { color: var(--primary, #1F7A5C); }

/* ===== 批量模板控件（2026-11-05 扩展设计）=====
   设计师交付包未覆盖「批量写作 · 每行模板选择」这组控件，按设计系统规则补：
   复用既有 token（--primary / --gold / --radius / --gray-*）、不新增散落颜色、
   行内控件取 8px 圆角与 13px 字号，与 .btn-sm / .badge 保持同一节奏。 */
.tpl-cell { display: flex; align-items: center; gap: 6px; min-width: 236px; }
.tpl-select {
  flex: 1 1 auto; max-width: 200px;
  padding: 5px 8px;
  font-size: 13px; line-height: 1.5;
  color: var(--gray-700);
  background: #fff;
  border: 1px solid var(--gray-200);
  border-radius: 8px;
  transition: var(--transition);
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--gray-400) 50%), linear-gradient(135deg, var(--gray-400) 50%, transparent 50%);
  background-position: calc(100% - 14px) 55%, calc(100% - 9px) 55%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  padding-right: 26px;
}
.tpl-select:hover { border-color: var(--primary); }
.tpl-select:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.tpl-upload {
  flex: 0 0 auto;
  width: 28px; height: 28px; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--gray-200); border-radius: 8px;
  background: #fff; color: var(--gray-600);
  font-size: 14px; cursor: pointer;
  transition: var(--transition);
}
.tpl-upload:hover { border-color: var(--gold); color: var(--gold); background: var(--gold-light); }
.tpl-file {
  display: inline-flex; align-items: center; gap: 6px;
  max-width: 200px;
  padding: 3px 8px;
  font-size: 12px;
  color: var(--primary);
  background: var(--primary-light);
  border: 1px solid rgba(31, 138, 109, .28);
  border-radius: 8px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.tpl-file-x { border: none; background: transparent; color: var(--danger); cursor: pointer; font-size: 12px; padding: 0 2px; }
.tpl-hint { margin-top: 4px; font-size: 11px; color: var(--gray-400); }
.tpl-hint.is-auto { color: var(--primary); }
.tpl-hint.is-miss { color: var(--warning); }

/* ===== 搜索下拉 combo（2026-11-05 扩展设计）=====
   模板 54+ 个、按学校分组，原生 select 不好滑也不好找，改成可输入过滤的下拉。
   颜色/圆角/过渡全部取设计系统 token；列表最大高 260px，超出滚动。 */
.combo { position: relative; }
.combo-box { display: flex; align-items: center; background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); transition: var(--transition); }
.combo-box:hover { border-color: var(--primary); }
.combo.is-open .combo-box { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.combo-input { flex: 1; min-width: 0; border: none; outline: none; background: transparent; padding: 8px 10px; font-size: 14px; color: var(--gray-700); }
.combo-input::placeholder { color: var(--gray-400); }
.combo-clear { border: none; background: transparent; color: var(--gray-400); cursor: pointer; padding: 0 10px; font-size: 12px; opacity: 0; transition: var(--transition); }
.combo:hover .combo-clear { opacity: 1; }
.combo-clear:hover { color: var(--danger); }
.combo-list { display: none; position: absolute; z-index: 60; left: 0; right: 0; top: calc(100% + 4px); max-height: 260px; overflow-y: auto;
  background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); box-shadow: var(--shadow-md); padding: 4px; }
.combo.is-open .combo-list { display: block; }
.combo-group { padding: 6px 10px 2px; font-size: 11px; letter-spacing: .04em; color: var(--gold-deep); background: transparent; }
.combo-item { padding: 7px 10px; border-radius: 8px; font-size: 13px; color: var(--gray-700); cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.combo-item:hover, .combo-item.is-active { background: var(--primary-light); color: var(--primary); }
.combo-none { color: var(--gray-500); }
.combo-empty { padding: 10px; font-size: 12px; color: var(--gray-400); text-align: center; }
.combo-foot { padding: 6px 10px; font-size: 11px; color: var(--gray-400); border-top: 1px solid var(--gray-100); margin-top: 4px; }
/* 行内小号 */
.combo-sm { flex: 1 1 auto; max-width: 210px; }
.combo-sm .combo-input { padding: 5px 8px; font-size: 13px; }
.combo-sm .combo-list { max-height: 220px; }
.combo-sm .combo-item { font-size: 12px; padding: 6px 8px; }
/* 表格里下拉不要被单元格裁掉 */
.table-wrap td { overflow: visible; }

/* ===== 视觉点缀（2026-11-05 调优）=====
   反馈：侧栏颜色偏深、主区偏空。处理原则沿用设计系统——
   侧栏在墨绿区间内提亮两档并加一道鎏金顶线；主区用极淡翡翠晕染 + 彩色服务标签 + 表格头暖灰，
   所有颜色仍来自 :root 变量或由变量派生的半透明值，不引入新的硬编码色系。 */
:root {
  /* 侧栏提亮档位（在墨绿区间内，不跳出品牌色） */
  --ink-a: #0B4132;      /* 侧栏渐变上端（原 #06231C 提亮） */
  --ink-b: #186B52;      /* 侧栏渐变下端（原 #0F4A38 提亮） */
  --ink-soft: rgba(255,255,255,.14);
}
.sidebar {
  background: linear-gradient(180deg, var(--ink-a) 0%, var(--ink-b) 100%);
  box-shadow: 1px 0 0 rgba(6,35,28,.06), 8px 0 24px -18px rgba(6,35,28,.45);
}
.sidebar::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--gold-deep), var(--gold) 45%, rgba(201,164,92,0));
}
.sidebar-logo { border-bottom: 1px solid var(--ink-soft); }
.sidebar .nav-section { color: rgba(255,255,255,.46); }
.sidebar .nav-item { color: rgba(255,255,255,.80); }
.sidebar .nav-item:hover { background: rgba(255,255,255,.10); color: #fff; }
.sidebar .nav-item.active {
  background: linear-gradient(90deg, rgba(201,164,92,.26), rgba(201,164,92,.08));
  color: #F3DDAE;
  box-shadow: inset 2px 0 0 var(--gold);
}

/* 主区背景：极淡翡翠晕染，避免大片纯白显空 */
#pageContent, .main { background: transparent; }
.app { background:
  radial-gradient(1100px 520px at 88% -8%, rgba(31,138,109,.10) 0%, rgba(31,138,109,0) 62%),
  radial-gradient(760px 420px at -6% 108%, rgba(201,164,92,.10) 0%, rgba(201,164,92,0) 60%),
  var(--gray-50); }

/* 页面标题：鎏金短线做点缀 */
.topbar h3 { position: relative; padding-bottom: 8px; }
.topbar h3::after {
  content: ''; position: absolute; left: 0; bottom: 0;
  width: 34px; height: 3px; border-radius: 2px;
  background: linear-gradient(90deg, var(--gold), rgba(201,164,92,.15));
}

/* 卡片：顶部一道极细翡翠→鎏金渐变，给白卡一点色彩记忆点 */
#pageContent > .card, #pageContent .card {
  position: relative;
  box-shadow: var(--shadow);
}
#pageContent .card::before {
  content: ''; position: absolute; left: 18px; right: 18px; top: 0; height: 2px;
  border-radius: 0 0 2px 2px;
  background: linear-gradient(90deg, rgba(31,138,109,.55), rgba(201,164,92,.45) 55%, rgba(31,138,109,0));
}

/* 表格：表头暖灰底 + 首列强调 + 行悬浮淡翡翠 */
.table-wrap thead th {
  background: linear-gradient(180deg, #F6F3E9, var(--gray-100));
  color: var(--gray-600);
  font-weight: 600;
  letter-spacing: .02em;
  border-bottom: 1px solid var(--gray-200);
}
.table-wrap tbody tr:nth-child(even) { background: rgba(248,247,241,.55); }
.table-wrap tbody tr:hover { background: rgba(231,244,238,.65); }
.table-wrap tbody td:first-child { color: var(--gray-500); font-variant-numeric: tabular-nums; }

/* 服务彩色标签（列表里区分服务类型，补足色彩点缀） */
.svc {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 9px; border-radius: 999px;
  font-size: 12px; line-height: 1.7; white-space: nowrap;
  border: 1px solid transparent;
}
.svc-tt { color: var(--primary); background: var(--primary-light); border-color: rgba(31,138,109,.26); }
.svc-as { color: var(--gold-text); background: var(--gold-light); border-color: rgba(201,164,92,.42); }
.svc-dd { color: var(--info); background: var(--info-light); border-color: rgba(44,107,168,.26); }
.svc-other { color: var(--gray-600); background: var(--gray-100); border-color: var(--gray-200); }