/* ── DOCUMENTS PAGE ── */
    .docs-page { padding: 0; }
    .docs-header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 10px; gap: 12px; flex-wrap: wrap; }
    .docs-page-title { font-size: 20px; font-weight: 600; color: var(--text-primary); margin-bottom: 4px; }
    .docs-page-sub { font-size: 12px; color: var(--text-tertiary); line-height: 1.5; }
    .docs-header-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; flex-wrap: wrap; }
    .docs-delete-toggle-btn {
      display: inline-flex; align-items: center; gap: 5px;
      font-size: 12px; padding: 5px 14px; border-radius: 20px;
      border: 0.5px solid var(--border-md); background: var(--bg);
      color: var(--text-secondary); cursor: pointer; font-family: inherit;
      transition: all 0.12s; white-space: nowrap; flex-shrink: 0;
    }
    .docs-delete-toggle-btn:hover { background: var(--red-bg); color: var(--red-mid); border-color: var(--red-accent, var(--red-mid)); }
    .docs-delete-toggle-btn.active { background: var(--bg-secondary); color: var(--text-primary); border-color: var(--border-md); }
    .docs-gameplan-btn {
      display: inline-flex; align-items: center; gap: 5px;
      font-size: 12px; padding: 5px 14px; border-radius: 20px;
      border: 0.5px solid var(--border-md); background: var(--bg);
      color: var(--text-secondary); cursor: pointer; font-family: inherit;
      transition: all 0.12s; white-space: nowrap; flex-shrink: 0;
    }
    .docs-gameplan-btn:hover { background: var(--blue-bg); color: var(--blue-mid); border-color: var(--blue-mid); }
    .docs-exam-btn {
      display: inline-flex; align-items: center; gap: 5px;
      font-size: 12px; padding: 5px 14px; border-radius: 20px;
      border: 0.5px solid #7C3AED; background: var(--bg);
      color: #7C3AED; cursor: pointer; font-family: inherit;
      transition: all 0.12s; white-space: nowrap; flex-shrink: 0;
    }
    .docs-exam-btn:hover { background: #7C3AED18; }
    .docs-exam-btn:disabled { opacity: 0.6; cursor: default; }
    .docs-list-item.delete-mode { cursor: pointer; }
    .docs-list-item.delete-mode:hover { background: var(--red-bg); }
    .docs-list-check { width: 14px; height: 14px; flex-shrink: 0; cursor: pointer; accent-color: var(--red-mid); }
    /* Modal */
    .docs-modal-overlay {
      position: fixed; inset: 0; background: rgba(0,0,0,0.55);
      display: flex; align-items: center; justify-content: center;
      z-index: 1000;
    }
    .docs-modal {
      background: var(--bg); border: 0.5px solid var(--border);
      border-radius: var(--radius-lg); padding: 1.5rem;
      max-width: 420px; width: 90%; box-shadow: 0 8px 32px rgba(0,0,0,0.3);
    }
    .docs-modal-title { font-size: 15px; font-weight: 600; color: var(--text-primary); margin-bottom: 12px; }
    .docs-modal-body { font-size: 13px; color: var(--text-secondary); line-height: 1.6; }
    .docs-modal-body p { margin: 0 0 8px; }
    .docs-modal-file-list { margin: 8px 0; padding: 8px 10px; background: var(--bg-secondary); border-radius: var(--radius-md); display: flex; flex-direction: column; gap: 4px; }
    .docs-modal-file { font-size: 12px; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .docs-modal-warn { font-size: 12px; color: var(--red-mid); margin-top: 8px; }
    .docs-modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
    .docs-modal-cancel {
      font-size: 12px; padding: 6px 16px; border-radius: 20px;
      border: 0.5px solid var(--border-md); background: var(--bg);
      color: var(--text-secondary); cursor: pointer; font-family: inherit;
    }
    .docs-modal-cancel:hover { background: var(--bg-secondary); }
    .docs-modal-confirm {
      font-size: 12px; padding: 6px 16px; border-radius: 20px;
      border: 0.5px solid var(--red-mid); background: var(--red-mid);
      color: #fff; cursor: pointer; font-family: inherit; transition: opacity 0.12s;
    }
    .docs-modal-confirm:hover { opacity: 0.85; }
    .docs-upload-btn {
      display: inline-flex; align-items: center; gap: 6px;
      font-size: 12px; padding: 6px 14px; border-radius: 20px;
      border: 0.5px solid var(--blue-mid); background: var(--blue-mid);
      color: #fff; cursor: pointer; white-space: nowrap; flex-shrink: 0;
      transition: opacity 0.12s; font-family: inherit;
    }
    .docs-upload-btn:hover { opacity: 0.85; }
    .docs-hint {
      display: flex; align-items: flex-start; gap: 6px;
      font-size: 10.5px; color: var(--text-tertiary); line-height: 1.6;
      margin-bottom: 14px;
    }
    .docs-upload-status { font-size: 12px; min-height: 18px; margin-bottom: 10px; }
    .docs-upload-status--error   { color: var(--red-mid); }
    .docs-upload-status--success { color: var(--green-mid); }
    .docs-upload-status--loading { color: var(--text-tertiary); }
    .docs-body { display: flex; gap: 16px; align-items: flex-start; }
    /* Document list panel */
    .docs-list-panel {
      flex: 0 0 280px; min-width: 220px;
      background: var(--bg); border: 0.5px solid var(--border);
      border-radius: var(--radius-lg); overflow: hidden;
    }
    .docs-list-hdr {
      font-size: 11px; font-weight: 600; color: var(--text-tertiary);
      text-transform: uppercase; letter-spacing: .04em;
      padding: 10px 14px; border-bottom: 0.5px solid var(--border);
      background: var(--bg-subtle);
    }
    .docs-list-item {
      display: flex; align-items: center; gap: 10px;
      padding: 10px 14px; border-bottom: 0.5px solid var(--border-sm);
      cursor: pointer; transition: background 0.12s;
    }
    .docs-list-item:last-child { border-bottom: none; }
    .docs-list-item:hover { background: var(--bg-secondary); }
    .docs-list-item.active { background: var(--blue-bg); }
    .docs-list-icon { font-size: 18px; flex-shrink: 0; }
    .docs-list-info { flex: 1; min-width: 0; }
    .docs-list-name {
      font-size: 12px; font-weight: 500; color: var(--text-primary);
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .docs-list-meta { font-size: 10px; color: var(--text-tertiary); margin-top: 1px; }
    .docs-list-badge { flex-shrink: 0; }
    .docs-badge { font-size: 9px; padding: 2px 6px; border-radius: 8px; white-space: nowrap; }
    .docs-badge--none        { background: var(--bg-secondary); color: var(--text-tertiary); }
    .docs-badge--generating  { background: var(--blue-bg); color: var(--blue-mid); }
    .docs-badge--generated   { background: var(--green-bg, #f0fdf4); color: var(--green-mid); }
    .docs-badge--failed      { background: var(--red-bg); color: var(--red-mid); }
    .docs-badge--unsupported { background: var(--bg-secondary); color: var(--text-tertiary); }
    .docs-empty {
      display: flex; flex-direction: column; align-items: center;
      padding: 3rem 1.25rem; text-align: center; gap: 6px;
    }
    .docs-empty > svg, .docs-empty .docs-empty-icon {
      width: 44px; height: 44px; margin-bottom: 10px;
      opacity: 0.5; color: var(--text-tertiary);
    }
    .docs-empty-text { font-size: var(--font-base); font-weight: 600; color: var(--text-primary); }
    .docs-empty-hint { font-size: var(--font-sm); color: var(--text-tertiary); line-height: 1.5; max-width: 320px; margin-top: 2px; }
    .docs-loading { display: flex; align-items: center; gap: 8px; padding: 16px 14px; font-size: 12px; color: var(--text-tertiary); }
    /* Summary panel */
    .docs-summary-panel {
      flex: 1; min-width: 0;
      background: var(--bg); border: 0.5px solid var(--border);
      border-radius: var(--radius-lg); overflow: hidden;
    }
    .docs-summary-empty-state {
      display: flex; flex-direction: column; align-items: center; justify-content: center;
      min-height: 240px; padding: 2rem; text-align: center;
    }
    .docs-summary-empty-text { font-size: 13px; color: var(--text-tertiary); }
    .docs-summary-inner { padding: 1.25rem; display: flex; flex-direction: column; gap: 16px; }
    .docs-summary-file {
      display: flex; align-items: center; gap: 12px;
      padding-bottom: 14px; border-bottom: 0.5px solid var(--border);
    }
    .docs-summary-file-icon { font-size: 24px; flex-shrink: 0; }
    .docs-summary-file-info { flex: 1; min-width: 0; }
    .docs-summary-filename {
      font-size: 14px; font-weight: 500; color: var(--text-primary);
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .docs-summary-filemeta { font-size: 11px; color: var(--text-tertiary); margin-top: 2px; }
    .docs-download-btn {
      flex-shrink: 0; font-size: 11px; padding: 4px 10px;
      border-radius: var(--radius-md); border: 0.5px solid var(--border-md);
      background: none; color: var(--text-secondary); cursor: pointer;
      font-family: inherit; transition: background 0.12s;
    }
    .docs-download-btn:hover { background: var(--bg-secondary); }
    .docs-summary-section { display: flex; flex-direction: column; gap: 10px; }
    .docs-summary-section-hdr { display: flex; align-items: center; justify-content: space-between; }
    .docs-summary-section-title { font-size: 12px; font-weight: 600; color: var(--text-primary); }
    .docs-summary-date { font-size: 10px; color: var(--text-tertiary); }
    .docs-summary-text {
      font-size: 13px; color: var(--text-primary); line-height: 1.7;
      background: var(--bg-subtle); border-radius: var(--radius-md);
      padding: 12px 14px; white-space: pre-wrap;
    }
    .docs-summary-empty { font-size: 12px; color: var(--text-tertiary); font-style: italic; }
    .docs-summary-generating { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text-tertiary); }
    .docs-summary-unsupported {
      display: flex; align-items: flex-start; gap: 7px;
      font-size: 12px; color: var(--text-secondary); line-height: 1.5;
      background: var(--bg-secondary); border-radius: var(--radius-md); padding: 10px 12px;
    }
    .docs-summary-error-msg { font-size: 12px; color: var(--red-mid); min-height: 16px; }
    .docs-summary-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
    .docs-generate-btn {
      font-size: 12px; padding: 6px 16px; border-radius: 20px;
      border: 0.5px solid var(--blue-mid); background: var(--blue-mid);
      color: #fff; cursor: pointer; font-family: inherit; transition: opacity 0.12s;
    }
    .docs-generate-btn:hover:not(:disabled) { opacity: 0.85; }
    .docs-generate-btn:disabled { opacity: 0.45; cursor: not-allowed; }
    .docs-summary-hint { font-size: 10.5px; color: var(--text-tertiary); font-style: italic; }
    .docs-summary-loading { display: flex; align-items: center; gap: 10px; padding: 2rem; font-size: 13px; color: var(--text-tertiary); }
    .docs-summary-error { padding: 2rem; font-size: 12px; color: var(--red-mid); }
    @media (max-width: 680px) {
      .docs-body { flex-direction: column; }
      .docs-list-panel { flex: none; width: 100%; }
    }