/* AllScience — Unified Research Workspace */

/* ── CRITICAL FIX: Hide all slide-out panels by default ────────────── */
/* These panels were blocking clicks across the entire workspace.      */
/* They use position:fixed and intercepted all mouse events even when  */
/* visually off-screen. Now hidden by default, visible only when their */
/* specific open class is applied by JavaScript.                       */
/* NOTE: JS creates many panels with class-only (no ID), so we target  */
/* BOTH #id and .class selectors to ensure coverage.                   */
#research-notes-panel,  .research-notes-panel,
#export-panel,          .export-panel,
#cn-panel,              .cn-panel,
#ann-sidebar,           .ann-sidebar,
#ga-panel,              .ga-panel,
#mc-panel,              .mc-panel,
#em-panel,              .em-panel,
#dd-panel,              .dd-panel,
#ec-panel,              .ec-panel,
#pa-panel,              .pa-panel,
#vm-panel,              .vm-panel,
#iec-panel,             .iec-panel,
#template-library-panel,
.tl-overlay {
  pointer-events: none !important;
  visibility: hidden !important;
}
/* Each panel uses its own open class — restore when opened */
#research-notes-panel.rn-open,  .research-notes-panel.rn-open,
#export-panel.export-panel-open, .export-panel.export-panel-open,
#cn-panel.cn-panel-open,        .cn-panel.cn-panel-open,
#ann-sidebar.ann-sidebar-open,  .ann-sidebar.ann-sidebar-open,
#ga-panel.ga-panel-open,        .ga-panel.ga-panel-open,
#mc-panel.mc-panel-open,        .mc-panel.mc-panel-open,
#em-panel.em-panel-open,        .em-panel.em-panel-open,
#dd-panel.dd-panel-open,        .dd-panel.dd-panel-open,
#ec-panel.ec-panel-open,        .ec-panel.ec-panel-open,
#pa-panel.pa-panel-open,        .pa-panel.pa-panel-open,
#vm-panel.vm-panel-open,        .vm-panel.vm-panel-open,
#iec-panel.iec-panel-open,      .iec-panel.iec-panel-open,
#template-library-panel.template-library-open,
.tl-overlay.tl-overlay-open {
  pointer-events: auto !important;
  visibility: visible !important;
}

/* ── CRITICAL FIX #2: Hide dynamic content that bleeds into viewport ── */
/* JS creates elements and appends them directly to body outside the    */
/* .research-app container. Without styling they render as visible      */
/* block/inline content below the page, adding unwanted scroll height   */
/* and causing text to bleed into the viewport.                         */
/*                                                                      */
/* The .research-toolbar is created by 19 init functions that look for  */
/* main/.main-content/.page-body — none of which exist on this page     */
/* (it uses .workspace-main). So the toolbar falls back to body.        */
/* Similarly, .research-timeline-section is appended to body.           */
/* Hide these orphaned elements. Tools remain accessible via the        */
/* position:fixed FABs and workflow-bar buttons.                        */
body > .research-toolbar,
body > .research-timeline-section,
body > .tl-trigger-btn,
body > .ga-trigger-btn {
  display: none !important;
}

/* ── App Shell ─────────────────────────────────────────────────────── */
.research-app {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* ── Top Bar ───────────────────────────────────────────────────────── */
.research-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 1.25rem;
  height: 48px;
  background: var(--color-bg-secondary, #111827);
  border-bottom: 1px solid var(--color-border, #1e293b);
  position: sticky;
  top: 0;
  z-index: 50;
}

.topbar-left { display: flex; align-items: center; gap: 1rem; flex-shrink: 1; min-width: 0; overflow: hidden; }

.topbar-brand {
  display: flex; align-items: center; gap: 0.5rem;
  font-weight: 700; color: var(--color-text, #e2e8f0);
  text-decoration: none; font-size: 0.9375rem; white-space: nowrap;
}

.project-indicator {
  font-size: 0.8125rem; color: var(--color-text-muted, #8896ab);
  display: flex; align-items: center; gap: 0.5rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.proj-title { font-weight: 500; overflow: hidden; text-overflow: ellipsis; }
.proj-saved { color: var(--color-success, #10b981); font-size: 0.6875rem; white-space: nowrap; }

.topbar-right { display: flex; align-items: center; gap: 0.75rem; flex-shrink: 0; }
.topbar-user { font-size: 0.8125rem; color: var(--color-text-muted, #8896ab); }

/* ── Workflow Bar ──────────────────────────────────────────────────── */
.workflow-bar {
  display: flex; align-items: center; justify-content: center;
  gap: 0.75rem; padding: 0.5rem 1rem;
  background: var(--color-bg, #0a0e17);
  border-bottom: 1px solid var(--color-border, #1e293b);
  position: sticky; top: 48px; z-index: 49;
}

.workflow-step-mini {
  display: flex; align-items: center; gap: 0.375rem;
  padding: 0.375rem 0.875rem; border-radius: 100px;
  font-size: 0.75rem; font-weight: 600;
  color: var(--color-text-dim, #5a6a80);
  background: transparent; border: 1px solid transparent;
  transition: all 0.2s;
}

.step-num {
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--color-border, #1e293b);
  display: flex; align-items: center; justify-content: center;
  font-size: 0.625rem; font-weight: 700;
}

.workflow-step-mini.step-active {
  color: var(--color-primary, #3b82f6);
  border-color: rgba(59, 130, 246, 0.3);
  background: rgba(59, 130, 246, 0.08);
}

.workflow-step-mini.step-active .step-num { background: var(--color-primary, #3b82f6); color: #fff; }

.workflow-step-mini.step-done { color: var(--color-success, #10b981); }
.workflow-step-mini.step-done .step-num { background: var(--color-success, #10b981); color: #fff; }

.step-arrow { color: var(--color-text-dim, #5a6a80); font-size: 0.75rem; }

/* ── Main Content ──────────────────────────────────────────────────── */
.workspace-main { max-width: 900px; margin: 0 auto; padding: 1.5rem; width: 100%; }

.section-bar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.section-bar h3 { font-size: 1.125rem; margin: 0; }
.section-subtitle { font-weight: 400; color: var(--color-text-muted, #8896ab); font-size: 0.875rem; }

/* ── Input Section ─────────────────────────────────────────────────── */
.input-section { margin-bottom: 2rem; }
.input-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.75rem; }
.input-header h3 { margin: 0; font-size: 1rem; }
.input-mode-chips { display: flex; gap: 0.375rem; }

.mode-chip {
  padding: 0.375rem 0.75rem; border-radius: 100px;
  font-size: 0.75rem; font-weight: 600;
  border: 1px solid var(--color-border, #1e293b);
  background: transparent; color: var(--color-text-muted, #8896ab);
  cursor: pointer; transition: all 0.15s;
}

.mode-chip:hover { border-color: var(--color-primary, #3b82f6); color: var(--color-text, #e2e8f0); }

.mode-chip.active {
  background: rgba(59, 130, 246, 0.12);
  border-color: var(--color-primary, #3b82f6);
  color: var(--color-primary, #3b82f6);
}

.source-textarea {
  width: 100%; min-height: 140px; padding: 1rem;
  background: var(--color-bg-secondary, #111827);
  border: 1px solid var(--color-border, #1e293b); border-radius: 8px;
  color: var(--color-text, #e2e8f0); font-family: inherit;
  font-size: 0.9375rem; line-height: 1.6; resize: vertical;
  transition: border-color 0.2s;
}

.source-textarea:focus { outline: none; border-color: var(--color-primary, #3b82f6); }
.source-textarea::placeholder { color: var(--color-text-dim, #5a6a80); }

.input-meta { display: flex; justify-content: space-between; margin-top: 0.375rem; font-size: 0.75rem; color: var(--color-text-dim, #5a6a80); }

.import-field { display: flex; gap: 0.5rem; margin-bottom: 0.5rem; }
.import-input { flex: 1; }
.import-hint { font-size: 0.75rem; color: var(--color-text-dim, #5a6a80); margin-bottom: 0.75rem; }

.import-success { padding: 0.75rem; background: rgba(16, 185, 129, 0.08); border: 1px solid rgba(16, 185, 129, 0.2); border-radius: 6px; font-size: 0.875rem; }
.import-meta { font-size: 0.75rem; color: var(--color-text-muted, #8896ab); }
.import-provider { font-size: 0.6875rem; color: var(--color-text-dim, #5a6a80); }
.import-error { padding: 0.75rem; background: rgba(239, 68, 68, 0.08); border: 1px solid rgba(239, 68, 68, 0.2); border-radius: 6px; color: #fca5a5; font-size: 0.875rem; }

.source-library { margin-top: 1rem; background: var(--color-bg-secondary, #111827); border: 1px solid var(--color-border, #1e293b); border-radius: 8px; }
.source-lib-header { display: flex; align-items: center; justify-content: space-between; padding: 0.625rem 0.875rem; font-size: 0.8125rem; font-weight: 600; color: var(--color-text-muted, #8896ab); cursor: pointer; }
.source-lib-list { padding: 0 0.75rem 0.75rem; }
.source-lib-item { padding: 0.5rem 0; border-bottom: 1px solid rgba(255, 255, 255, 0.03); cursor: pointer; }
.source-lib-item:last-child { border-bottom: none; }
.source-lib-title { font-size: 0.8125rem; font-weight: 500; color: var(--color-text, #e2e8f0); }
.source-lib-meta { font-size: 0.6875rem; color: var(--color-text-dim, #5a6a80); }

.analyze-bar { display: flex; align-items: center; gap: 1rem; margin-top: 1rem; }
.analyze-hint { font-size: 0.75rem; color: var(--color-text-dim, #5a6a80); }

/* ── Sections ──────────────────────────────────────────────────────── */
.findings-section, .evidence-section, .pipeline-section, .draft-section, .projects-section {
  margin-bottom: 2rem; padding-top: 1rem;
  border-top: 1px solid var(--color-border, #1e293b);
}

/* Findings */
.finding-card { padding: 1rem; margin-bottom: 0.625rem; background: var(--color-bg-secondary, #111827); border: 1px solid var(--color-border, #1e293b); border-radius: 8px; }
.finding-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.5rem; }
.finding-category { font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; padding: 0.125rem 0.5rem; border-radius: 3px; background: rgba(6, 214, 160, 0.12); color: var(--color-accent, #06d6a0); }
.finding-confidence { font-size: 0.75rem; font-weight: 600; font-family: 'JetBrains Mono', monospace; }
.conf-high { color: var(--color-success, #10b981); }
.conf-mid { color: var(--color-warning, #f59e0b); }
.conf-low { color: var(--color-danger, #ef4444); }
.finding-text { font-size: 0.875rem; line-height: 1.6; color: var(--color-text, #e2e8f0); }
.finding-entities { display: flex; flex-wrap: wrap; gap: 0.25rem; margin-top: 0.5rem; }
.entity-tag { padding: 0.0625rem 0.375rem; font-size: 0.6875rem; background: rgba(59, 130, 246, 0.1); color: #93bbfc; border-radius: 3px; }
.finding-links { display: flex; gap: 0.5rem; margin-top: 0.5rem; }
.finding-link { font-size: 0.6875rem; color: var(--color-primary, #3b82f6); cursor: pointer; }

/* Evidence & Sources */
.evidence-sources-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.evidence-card, .source-card { padding: 0.75rem; background: var(--color-bg-secondary, #111827); border: 1px solid var(--color-border, #1e293b); border-radius: 6px; margin-bottom: 0.5rem; }
.evidence-card { border-left: 3px solid var(--color-primary, #3b82f6); }
.source-card { border-left: 3px solid var(--color-accent, #06d6a0); }
.evidence-claim, .source-text { font-size: 0.8125rem; line-height: 1.5; color: var(--color-text, #e2e8f0); }
.evidence-meta, .source-meta { display: flex; gap: 0.5rem; margin-top: 0.375rem; font-size: 0.6875rem; color: var(--color-text-dim, #5a6a80); }
.sentiment-positive { color: var(--color-success, #10b981); }
.sentiment-negative { color: var(--color-danger, #ef4444); }

/* Pipeline */
.pipeline-step { display: flex; align-items: center; gap: 0.75rem; padding: 0.5rem 0; font-size: 0.8125rem; border-bottom: 1px solid rgba(255, 255, 255, 0.03); }
.pipe-icon { font-size: 0.875rem; }
.pipe-name { font-weight: 600; flex: 1; }
.pipe-module { color: var(--color-text-dim, #5a6a80); font-family: 'JetBrains Mono', monospace; font-size: 0.75rem; }
.pipe-time { color: var(--color-text-dim, #5a6a80); font-family: 'JetBrains Mono', monospace; font-size: 0.75rem; min-width: 50px; text-align: right; }

/* Draft */
.draft-controls { display: flex; gap: 0.5rem; align-items: center; }
.draft-style-select { width: auto; padding: 0.375rem 0.625rem; font-size: 0.8125rem; }
.draft-section-tabs { display: flex; gap: 0.25rem; margin-bottom: 1rem; overflow-x: auto; padding-bottom: 0.25rem; }
.draft-tab { padding: 0.375rem 0.75rem; border-radius: 6px; font-size: 0.75rem; font-weight: 600; border: 1px solid var(--color-border, #1e293b); background: transparent; color: var(--color-text-muted, #8896ab); cursor: pointer; white-space: nowrap; transition: all 0.15s; }
.draft-tab:hover { border-color: var(--color-primary, #3b82f6); }
.draft-tab.active { background: rgba(59, 130, 246, 0.12); border-color: var(--color-primary, #3b82f6); color: var(--color-primary, #3b82f6); }
.draft-block { margin-bottom: 1.25rem; padding: 1rem; background: var(--color-bg-secondary, #111827); border: 1px solid var(--color-border, #1e293b); border-radius: 8px; }
.draft-block-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.75rem; }
.draft-block-header h4 { margin: 0; font-size: 0.9375rem; }
.draft-block-meta { display: flex; align-items: center; gap: 0.5rem; }
.draft-wc { font-size: 0.6875rem; color: var(--color-text-dim, #5a6a80); font-family: 'JetBrains Mono', monospace; }
.copy-section-btn { padding: 0.25rem 0.5rem; font-size: 0.6875rem; border: 1px solid var(--color-border, #1e293b); border-radius: 4px; background: transparent; color: var(--color-text-muted, #8896ab); cursor: pointer; }
.copy-section-btn:hover { border-color: var(--color-primary, #3b82f6); color: var(--color-text, #e2e8f0); }
.draft-block-content { font-size: 0.9375rem; line-height: 1.8; color: var(--color-text, #e2e8f0); white-space: pre-wrap; }
.draft-references { margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid var(--color-border, #1e293b); }
.draft-references h4 { margin-bottom: 0.75rem; }
.draft-citation { font-size: 0.8125rem; color: var(--color-text-muted, #8896ab); padding: 0.25rem 0; line-height: 1.5; }

.refine-bar { display: flex; align-items: center; justify-content: space-between; margin-top: 1rem; padding: 0.75rem; background: var(--color-bg-secondary, #111827); border: 1px solid var(--color-border, #1e293b); border-radius: 8px; }
.refine-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.refine-btn { padding: 0.375rem 0.75rem; border-radius: 100px; font-size: 0.75rem; font-weight: 600; border: 1px solid var(--color-border, #1e293b); background: transparent; color: var(--color-text-muted, #8896ab); cursor: pointer; transition: all 0.15s; }
.refine-btn:hover { border-color: var(--color-primary, #3b82f6); color: var(--color-primary, #3b82f6); }
.version-info { font-size: 0.75rem; color: var(--color-text-dim, #5a6a80); }
.export-bar { display: flex; gap: 0.5rem; margin-top: 0.75rem; flex-wrap: wrap; }

/* Projects */
.project-item { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 0.75rem; border-radius: 6px; cursor: pointer; font-size: 0.8125rem; color: var(--color-text-muted, #8896ab); transition: background 0.15s; }
.project-item:hover { background: rgba(255, 255, 255, 0.03); }
.project-item.active { background: rgba(59, 130, 246, 0.08); color: var(--color-primary, #3b82f6); }
.project-status-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.status-draft { background: var(--color-warning, #f59e0b); }
.status-analyzed { background: var(--color-primary, #3b82f6); }
.status-drafted { background: var(--color-accent, #06d6a0); }
.project-title-text { flex: 1; font-weight: 500; }
.project-date { font-size: 0.6875rem; color: var(--color-text-dim, #5a6a80); }

/* Demo banner */
.demo-banner { position: fixed; bottom: 0; left: 0; right: 0; padding: 0.75rem 1.5rem; background: rgba(16, 185, 129, 0.12); border-top: 1px solid rgba(16, 185, 129, 0.3); display: flex; align-items: center; justify-content: center; gap: 1rem; font-size: 0.875rem; color: var(--color-accent, #06d6a0); z-index: 100; }

/* Publish success */
.publish-success { padding: 1rem; margin-bottom: 1rem; background: rgba(16, 185, 129, 0.08); border: 1px solid rgba(16, 185, 129, 0.2); border-radius: 8px; }
.pub-success-title { font-size: 1.125rem; font-weight: 700; color: var(--color-success, #10b981); margin-bottom: 0.5rem; }
.pub-success-link { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.5rem; }
.pub-success-link a { color: var(--color-primary, #3b82f6); font-size: 0.875rem; word-break: break-all; }
.pub-success-doi { font-size: 0.75rem; color: var(--color-text-dim, #5a6a80); font-family: 'JetBrains Mono', monospace; }

/* Feedback FAB */
.feedback-fab { position: fixed; bottom: 1.5rem; right: 1.5rem; padding: 0.625rem 1rem; background: var(--color-bg-secondary, #111827); border: 1px solid var(--color-border, #1e293b); border-radius: 100px; color: var(--color-text-muted, #8896ab); font-size: 0.8125rem; cursor: pointer; z-index: 90; transition: border-color 0.2s; }
.feedback-fab:hover { border-color: var(--color-primary, #3b82f6); }

/* ── Use-this / Next-steps blocks ──────────────────────────────── */
.use-this-block {
  padding: 0.625rem 1rem; margin-bottom: 0.75rem;
  background: rgba(59,130,246,0.05); border: 1px solid rgba(59,130,246,0.12);
  border-radius: 6px; font-size: 0.8125rem; color: var(--color-text-muted, #8896ab);
}
.use-this-block strong { color: var(--color-primary, #3b82f6); }
.next-steps-hint {
  padding: 0.625rem 1rem; margin-top: 0.75rem;
  background: rgba(16,185,129,0.05); border: 1px solid rgba(16,185,129,0.12);
  border-radius: 6px; font-size: 0.8125rem; color: var(--color-text-muted, #8896ab);
}
.next-steps-hint strong { color: var(--color-success, #10b981); }

/* ── Multi-source inputs ──────────────────────────────────────── */
.source-input-block {
  margin-bottom: 0.75rem; border: 1px solid var(--color-border, #1e293b);
  border-radius: 8px; overflow: hidden;
}
.source-input-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 0.375rem 0.75rem; background: rgba(255,255,255,0.02);
  border-bottom: 1px solid var(--color-border, #1e293b);
}
.source-label { font-size: 0.75rem; font-weight: 600; color: var(--color-primary, #3b82f6); }
.source-remove-btn {
  background: none; border: none; color: var(--color-text-dim, #5a6a80);
  cursor: pointer; font-size: 1.125rem; padding: 0 0.25rem;
}
.source-remove-btn:hover { color: var(--color-danger, #ef4444); }
.source-input-block .source-textarea {
  border: none; border-radius: 0; min-height: 80px;
}
.source-count-badge {
  display: inline-block; padding: 0.25rem 0.75rem; margin-bottom: 1rem;
  background: rgba(59,130,246,0.1); border-radius: 100px;
  font-size: 0.8125rem; color: var(--color-primary, #3b82f6);
}

/* ── PDF Upload Zone ───────────────────────────────────────────── */
.pdf-upload-zone {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 2.5rem; border: 2px dashed var(--color-border, #1e293b);
  border-radius: 10px; cursor: pointer; transition: border-color 0.2s, background 0.2s;
  text-align: center;
}
.pdf-upload-zone:hover { border-color: var(--color-primary, #3b82f6); background: rgba(59,130,246,0.03); }
.pdf-upload-icon { font-size: 2rem; margin-bottom: 0.5rem; }
.pdf-upload-text { font-weight: 500; color: var(--color-text, #e2e8f0); margin-bottom: 0.25rem; }
.pdf-upload-hint { font-size: 0.75rem; color: var(--color-text-dim, #5a6a80); }
.pdf-upload-result { margin-top: 0.75rem; }

/* ── Intelligence Panel ────────────────────────────────────────── */
.intelligence-panel { margin-top: 1.5rem; }
.intel-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.intel-card {
  padding: 1rem; background: var(--color-bg-secondary, #111827);
  border: 1px solid var(--color-border, #1e293b); border-radius: 8px;
}
.intel-card-title { font-size: 0.75rem; font-weight: 600; color: var(--color-primary, #3b82f6); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.75rem; }
.intel-metric { display: flex; justify-content: space-between; align-items: baseline; padding: 0.25rem 0; font-size: 0.8125rem; border-bottom: 1px solid rgba(255,255,255,0.03); }
.intel-metric:last-child { border-bottom: none; }
.intel-label { color: var(--color-text-dim, #5a6a80); }
.intel-card-small { padding: 0.5rem 1rem; }
.domain-tag { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 0.7rem; font-weight: 600; background: rgba(59,130,246,0.12); color: var(--color-primary, #3b82f6); margin-right: 4px; }
.intel-issues { margin-top: 0.5rem; border-top: 1px solid rgba(255,255,255,0.06); padding-top: 0.5rem; }
.intel-issue { font-size: 0.75rem; color: var(--color-text-muted, #8896ab); padding: 0.2rem 0; line-height: 1.4; }

/* ── Preset Badge ──────────────────────────────────────────────── */
.preset-badge {
  display: flex; align-items: center; gap: 0.5rem;
  padding: 0.5rem 1rem; margin-bottom: 0.75rem;
  background: rgba(59,130,246,0.08); border: 1px solid rgba(59,130,246,0.2);
  border-radius: 6px; font-size: 0.8125rem; font-weight: 500;
  color: var(--color-primary, #3b82f6);
}
.preset-clear {
  background: none; border: none; color: var(--color-text-dim, #5a6a80);
  cursor: pointer; font-size: 1rem; padding: 0 0.25rem; margin-left: auto;
}

/* ── Writing Bridge ─────────────────────────────────────────────── */
.writing-bridge {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem 1.5rem; margin-top: 1rem;
  background: linear-gradient(135deg, rgba(59,130,246,0.08), rgba(16,185,129,0.06));
  border: 1px solid var(--color-primary, #3b82f6);
  border-radius: 8px;
}
.writing-bridge-text { font-size: 0.875rem; color: var(--color-text, #e2e8f0); }
.writing-bridge-text strong { color: var(--color-primary, #3b82f6); }
.writing-bridge-text p { margin: 0.25rem 0 0; font-size: 0.75rem; color: var(--color-text-muted, #8896ab); }
.writing-bridge .btn { white-space: nowrap; }

/* ── Toolbar Nav Links ─────────────────────────────────────────── */
.topbar-nav { display: flex; align-items: center; gap: 0.25rem; margin-left: 1rem; }
.topbar-nav a {
  font-size: 0.75rem; padding: 0.25rem 0.625rem; border-radius: 4px;
  color: var(--color-text-muted, #8896ab); text-decoration: none;
  transition: background 0.15s, color 0.15s;
}
.topbar-nav a:hover { background: rgba(255,255,255,0.06); color: var(--color-text, #e2e8f0); }
.topbar-nav a.active { background: rgba(59,130,246,0.15); color: var(--color-primary, #3b82f6); }

/* ── Publish Success ───────────────────────────────────────────── */
.publish-success {
  padding: 1rem 1.5rem; margin-bottom: 1rem;
  background: rgba(16,185,129,0.08); border: 1px solid var(--color-success, #10b981);
  border-radius: 8px;
}
.pub-success-title { font-weight: 700; color: var(--color-success, #10b981); font-size: 1.125rem; margin-bottom: 0.5rem; }
.pub-success-link { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; }
.pub-success-link a { color: var(--color-primary, #3b82f6); word-break: break-all; }
.pub-success-doi { font-size: 0.75rem; color: var(--color-text-muted, #8896ab); margin-top: 0.5rem; }

/* ── Preset Picker ─────────────────────────────────────────────────── */
.preset-picker {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.375rem 1.25rem;
  background: var(--color-bg, #0a0e17);
  border-bottom: 1px solid var(--color-border, #1e293b);
}

.preset-picker-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-text-muted, #8896ab);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-right: 0.25rem;
}

.preset-option {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.25rem 0.75rem;
  font-size: 0.8125rem;
  border-radius: 999px;
  color: var(--color-text-muted, #8896ab);
  text-decoration: none;
  border: 1px solid transparent;
  transition: all 0.2s;
}

.preset-option:hover {
  color: var(--color-text, #e2e8f0);
  background: var(--color-bg-secondary, #111827);
  border-color: var(--color-border, #1e293b);
}

.preset-option.active {
  color: var(--color-primary, #3b82f6);
  background: rgba(59, 130, 246, 0.1);
  border-color: var(--color-primary, #3b82f6);
  font-weight: 600;
}

.preset-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  margin-bottom: 0.75rem;
  background: rgba(59, 130, 246, 0.1);
  border: 1px solid rgba(59, 130, 246, 0.3);
  border-radius: 8px;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-primary, #3b82f6);
}

.preset-clear {
  background: none;
  border: none;
  color: var(--color-text-muted, #8896ab);
  font-size: 1rem;
  cursor: pointer;
  padding: 0 0.25rem;
  margin-left: 0.5rem;
}

.preset-clear:hover { color: var(--color-text, #e2e8f0); }

/* ── Comparison View ───────────────────────────────────────────── */
.compare-select-bar {
  display: flex; align-items: center; gap: 0.75rem;
  padding: 0.625rem 0.75rem; margin-bottom: 0.75rem;
  background: rgba(59, 130, 246, 0.06);
  border: 1px solid rgba(59, 130, 246, 0.2);
  border-radius: 8px;
}
.compare-select-hint {
  font-size: 0.8125rem; font-weight: 500;
  color: var(--color-primary, #3b82f6); flex: 1;
}
.compare-checkbox {
  width: 16px; height: 16px; margin-right: 0.5rem;
  accent-color: var(--color-primary, #3b82f6); cursor: pointer;
  flex-shrink: 0;
}

.comparison-section {
  margin-bottom: 2rem; padding-top: 1rem;
  border-top: 1px solid var(--color-border, #1e293b);
}

.comparison-summary-bar {
  display: flex; flex-wrap: wrap; gap: 0.75rem;
  padding: 0.75rem 1rem; margin-bottom: 1rem;
  background: var(--color-bg-secondary, #111827);
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 8px;
  font-size: 0.8125rem; color: var(--color-text-muted, #8896ab);
}
.comparison-summary-bar .summary-stat {
  display: flex; align-items: center; gap: 0.375rem;
}
.summary-stat-count {
  font-weight: 700; font-family: 'JetBrains Mono', monospace;
  color: var(--color-text, #e2e8f0);
}
.summary-stat-shared .summary-stat-count { color: var(--color-success, #10b981); }
.summary-stat-unique .summary-stat-count { color: var(--color-warning, #f59e0b); }

.comparison-columns {
  display: grid; gap: 1rem;
  grid-template-columns: repeat(var(--compare-cols, 2), 1fr);
  overflow-x: auto;
}

.comparison-col {
  min-width: 260px;
  background: var(--color-bg-secondary, #111827);
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 8px; overflow: hidden;
}
.comparison-col-header {
  padding: 0.75rem 1rem;
  background: rgba(255, 255, 255, 0.02);
  border-bottom: 1px solid var(--color-border, #1e293b);
}
.comparison-col-title {
  font-size: 0.9375rem; font-weight: 700;
  color: var(--color-text, #e2e8f0);
  margin-bottom: 0.25rem;
}
.comparison-col-date {
  font-size: 0.6875rem;
  color: var(--color-text-dim, #5a6a80);
}
.comparison-col-body {
  padding: 0.75rem 1rem;
}
.comparison-group-label {
  font-size: 0.6875rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.05em;
  color: var(--color-text-dim, #5a6a80);
  margin-bottom: 0.5rem; margin-top: 0.75rem;
}
.comparison-group-label:first-child { margin-top: 0; }

.comparison-finding-item {
  display: flex; align-items: flex-start; gap: 0.5rem;
  padding: 0.375rem 0;
  font-size: 0.8125rem; line-height: 1.5;
  color: var(--color-text, #e2e8f0);
  border-bottom: 1px solid rgba(255, 255, 255, 0.03);
}
.comparison-finding-item:last-child { border-bottom: none; }

.comparison-badge {
  display: inline-flex; align-items: center;
  padding: 0.0625rem 0.375rem;
  font-size: 0.625rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.04em;
  border-radius: 3px; flex-shrink: 0; margin-top: 0.125rem;
}
.comparison-badge-shared {
  background: rgba(16, 185, 129, 0.15);
  color: var(--color-success, #10b981);
}
.comparison-badge-unique {
  background: rgba(245, 158, 11, 0.15);
  color: var(--color-warning, #f59e0b);
}

.comparison-entity-tags {
  display: flex; flex-wrap: wrap; gap: 0.25rem;
  margin-top: 0.375rem;
}
.comparison-entity-tag {
  padding: 0.0625rem 0.375rem;
  font-size: 0.6875rem;
  background: rgba(59, 130, 246, 0.1);
  color: #93bbfc; border-radius: 3px;
}

.comparison-theme-tags {
  display: flex; flex-wrap: wrap; gap: 0.25rem;
  margin-top: 0.375rem;
}
.comparison-theme-tag {
  padding: 0.125rem 0.5rem;
  font-size: 0.6875rem; font-weight: 500;
  background: rgba(139, 92, 246, 0.1);
  color: #a78bfa; border-radius: 100px;
}

.comparison-empty {
  font-size: 0.75rem; font-style: italic;
  color: var(--color-text-dim, #5a6a80);
  padding: 0.5rem 0;
}

/* ── Source Import/Export & DOI Lookup ────────────────────────────── */
.source-import-export {
  padding: 0.75rem;
  border-top: 1px solid var(--color-border, #1e293b);
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.source-ie-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.source-ie-label {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text-dim, #5a6a80);
  min-width: 60px;
  flex-shrink: 0;
}

.source-doi-input {
  flex: 1;
  min-width: 140px;
  padding: 0.375rem 0.625rem;
  font-size: 0.8125rem;
}

.source-ie-dropzone {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  border: 2px dashed var(--color-border, #1e293b);
  border-radius: 8px;
  font-size: 0.8125rem;
  color: var(--color-text-dim, #5a6a80);
  text-align: center;
  cursor: pointer;
  transition: border-color 0.2s, background 0.2s, color 0.2s;
}

.source-ie-dropzone:hover,
.source-ie-dropzone.dragover {
  border-color: var(--color-primary, #3b82f6);
  background: rgba(59, 130, 246, 0.04);
  color: var(--color-primary, #3b82f6);
}

/* ── Import Preview Modal ─────────────────────────────────────────── */
.import-preview-list {
  max-height: 340px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.import-preview-item {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  padding: 0.5rem 0.625rem;
  background: var(--color-bg, #0a0e17);
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px;
  cursor: pointer;
  transition: border-color 0.15s;
  flex-wrap: wrap;
}

.import-preview-item:hover {
  border-color: var(--color-primary, #3b82f6);
}

.import-preview-cb {
  margin-top: 0.2rem;
  flex-shrink: 0;
  accent-color: var(--color-primary, #3b82f6);
}

.import-preview-title {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-text, #e2e8f0);
  flex: 1 1 100%;
}

.import-preview-meta {
  font-size: 0.6875rem;
  color: var(--color-text-dim, #5a6a80);
  flex: 1 1 100%;
  padding-left: 1.25rem;
}

/* ── Template Picker ──────────────────────────────────────────────── */
.template-picker-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1rem;
  margin-top: 1rem;
}

.template-card {
  position: relative;
  padding: 1.25rem;
  background: var(--color-bg-secondary, #111827);
  border: 2px solid var(--color-border, #1e293b);
  border-radius: 10px;
  cursor: pointer;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.15s;
}

.template-card:hover {
  border-color: var(--color-primary, #3b82f6);
  box-shadow: 0 4px 20px rgba(59, 130, 246, 0.12);
  transform: translateY(-2px);
}

.template-card.template-selected {
  border-color: var(--color-primary, #3b82f6);
  background: rgba(59, 130, 246, 0.06);
}

.template-card-icon {
  font-size: 1.75rem;
  margin-bottom: 0.625rem;
  line-height: 1;
}

.template-card-name {
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-text, #e2e8f0);
  margin-bottom: 0.375rem;
}

.template-card-desc {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text-muted, #8896ab);
  margin-bottom: 0.75rem;
}

.template-card-meta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.6875rem;
  color: var(--color-text-dim, #5a6a80);
}

.template-meta-item {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.template-meta-icon {
  font-size: 0.75rem;
}

.template-sections-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-top: 0.625rem;
}

.template-section-tag {
  padding: 0.125rem 0.5rem;
  font-size: 0.625rem;
  font-weight: 600;
  background: rgba(59, 130, 246, 0.08);
  color: var(--color-primary, #3b82f6);
  border-radius: 100px;
  white-space: nowrap;
}

.template-picker-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border, #1e293b);
}

.template-blank-link {
  font-size: 0.8125rem;
  color: var(--color-text-muted, #8896ab);
  cursor: pointer;
  background: none;
  border: none;
  text-decoration: underline;
  transition: color 0.15s;
}

.template-blank-link:hover {
  color: var(--color-text, #e2e8f0);
}

/* ── Batch Analysis Queue ─────────────────────────────────────────── */
.batch-panel {
  position: fixed;
  top: 0; right: 0; bottom: 0;
  width: 480px; max-width: 100vw;
  background: var(--color-bg-secondary, #111827);
  border-left: 1px solid var(--color-border, #1e293b);
  z-index: 200;
  display: flex; flex-direction: column;
  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.3);
  animation: batchSlideIn 0.2s ease-out;
}

@keyframes batchSlideIn {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}

.batch-panel-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--color-border, #1e293b);
}
.batch-panel-header h3 { margin: 0; font-size: 1rem; color: var(--color-text, #e2e8f0); }

.batch-panel-close {
  background: none; border: none;
  color: var(--color-text-muted, #8896ab);
  font-size: 1.5rem; cursor: pointer;
  padding: 0 0.25rem; line-height: 1;
}
.batch-panel-close:hover { color: var(--color-text, #e2e8f0); }

.batch-add-bar { padding: 1rem 1.25rem; }

.batch-dropzone {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 1.5rem; border: 2px dashed var(--color-border, #1e293b);
  border-radius: 10px; cursor: pointer; text-align: center;
  transition: border-color 0.2s, background 0.2s;
}
.batch-dropzone:hover,
.batch-dropzone.dragover {
  border-color: var(--color-primary, #3b82f6);
  background: rgba(59, 130, 246, 0.04);
}
.batch-dropzone-icon { font-size: 1.5rem; margin-bottom: 0.375rem; }
.batch-dropzone-text { font-weight: 500; color: var(--color-text, #e2e8f0); font-size: 0.875rem; }
.batch-dropzone-hint { font-size: 0.6875rem; color: var(--color-text-dim, #5a6a80); margin-top: 0.25rem; }

.batch-add-buttons {
  display: flex; gap: 0.5rem; margin-top: 0.75rem;
}

.batch-queue-list {
  flex: 1; overflow-y: auto; padding: 0 1.25rem;
}

.batch-queue-empty {
  text-align: center; padding: 2rem 1rem;
  font-size: 0.8125rem; color: var(--color-text-dim, #5a6a80);
}

.batch-queue-item {
  display: flex; align-items: center; gap: 0.625rem;
  padding: 0.625rem 0.75rem; margin-bottom: 0.375rem;
  background: var(--color-bg, #0a0e17);
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px;
  transition: border-color 0.15s;
}

.batch-queue-item.batch-item-analyzing {
  border-color: var(--color-primary, #3b82f6);
  background: rgba(59, 130, 246, 0.06);
}
.batch-queue-item.batch-item-done {
  border-color: var(--color-success, #10b981);
  opacity: 0.85;
}
.batch-queue-item.batch-item-error {
  border-color: var(--color-danger, #ef4444);
}

.batch-item-status {
  flex-shrink: 0; width: 20px; text-align: center;
  font-size: 0.875rem;
}

.batch-item-spinner {
  display: inline-block;
  width: 14px; height: 14px;
  border: 2px solid var(--color-border, #1e293b);
  border-top-color: var(--color-primary, #3b82f6);
  border-radius: 50%;
  animation: batchSpin 0.8s linear infinite;
}

@keyframes batchSpin {
  to { transform: rotate(360deg); }
}

.batch-item-info { flex: 1; min-width: 0; }
.batch-item-title {
  font-size: 0.8125rem; font-weight: 500;
  color: var(--color-text, #e2e8f0);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.batch-item-meta {
  display: flex; align-items: center; gap: 0.5rem;
  font-size: 0.6875rem; color: var(--color-text-dim, #5a6a80);
  margin-top: 0.125rem;
}

.batch-type-badge {
  display: inline-flex; align-items: center;
  padding: 0.0625rem 0.375rem;
  font-size: 0.5625rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.04em;
  border-radius: 3px;
}
.batch-type-file { background: rgba(59, 130, 246, 0.15); color: var(--color-primary, #3b82f6); }
.batch-type-text { background: rgba(16, 185, 129, 0.15); color: var(--color-success, #10b981); }
.batch-type-url { background: rgba(245, 158, 11, 0.15); color: var(--color-warning, #f59e0b); }

.batch-item-error-msg {
  font-size: 0.6875rem; color: var(--color-danger, #ef4444);
  margin-top: 0.125rem;
}

.batch-item-result-link {
  font-size: 0.6875rem; color: var(--color-primary, #3b82f6);
  cursor: pointer; text-decoration: underline;
  background: none; border: none; padding: 0;
}
.batch-item-result-link:hover { color: var(--color-text, #e2e8f0); }

.batch-item-remove {
  flex-shrink: 0;
  background: none; border: none;
  color: var(--color-text-dim, #5a6a80);
  cursor: pointer; font-size: 1rem; padding: 0 0.25rem;
}
.batch-item-remove:hover { color: var(--color-danger, #ef4444); }

.batch-progress-area {
  padding: 0.75rem 1.25rem;
  border-top: 1px solid var(--color-border, #1e293b);
}

.batch-progress-bar-track {
  width: 100%; height: 6px;
  background: var(--color-border, #1e293b);
  border-radius: 3px; overflow: hidden;
}
.batch-progress-bar-fill {
  height: 100%;
  background: var(--color-primary, #3b82f6);
  border-radius: 3px;
  transition: width 0.3s ease;
}

.batch-progress-info {
  display: flex; justify-content: space-between;
  margin-top: 0.375rem;
  font-size: 0.6875rem; color: var(--color-text-muted, #8896ab);
}

.batch-summary {
  padding: 0.75rem 1.25rem;
  border-top: 1px solid var(--color-border, #1e293b);
  font-size: 0.8125rem;
}
.batch-summary-stats {
  display: flex; gap: 1rem; margin-bottom: 0.5rem;
}
.batch-summary-stat {
  display: flex; align-items: center; gap: 0.375rem;
  font-weight: 600;
}
.batch-summary-stat.stat-success { color: var(--color-success, #10b981); }
.batch-summary-stat.stat-error { color: var(--color-danger, #ef4444); }

.batch-actions {
  display: flex; gap: 0.5rem; flex-wrap: wrap;
  padding: 1rem 1.25rem;
  border-top: 1px solid var(--color-border, #1e293b);
}

/* Responsive */
@media (max-width: 768px) {
  .workspace-main { padding: 1rem; }
  .evidence-sources-grid { grid-template-columns: 1fr; }
  .workflow-bar { gap: 0.25rem; font-size: 0.6875rem; }
  .step-arrow { display: none; }
  .input-header { flex-direction: column; align-items: flex-start; gap: 0.5rem; }
  .draft-controls { flex-wrap: wrap; }
  .refine-bar { flex-direction: column; gap: 0.75rem; }
  .analyze-bar { flex-direction: column; align-items: stretch; }
  .preset-picker { flex-wrap: wrap; padding: 0.25rem 0.75rem; }
  .preset-picker-label { display: none; }
  .preset-option { font-size: 0.75rem; padding: 0.25rem 0.5rem; }
  .comparison-columns { grid-template-columns: 1fr !important; overflow-x: visible; }
  .comparison-col { min-width: 0; }
  .compare-select-bar { flex-wrap: wrap; }
  .source-ie-row { flex-direction: column; align-items: stretch; }
  .source-ie-label { min-width: auto; }
  .source-doi-input { min-width: 0; }
  .template-picker-grid { grid-template-columns: 1fr; }
  .template-picker-actions { flex-direction: column; align-items: stretch; }
  .batch-panel { width: 100%; border-left: none; }
}

/* ── Template Library ───────────────────────────────────────────────── */
.template-library-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 214, 160, 0.1);
  border: 1px solid rgba(6, 214, 160, 0.25);
  border-radius: var(--radius-md, 10px);
  color: var(--color-accent, #06d6a0);
  font-size: 0.8125rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s ease;
}

.template-library-btn:hover {
  background: rgba(6, 214, 160, 0.18);
  border-color: rgba(6, 214, 160, 0.4);
}

.template-overlay {
  position: fixed;
  inset: 0;
  z-index: 5000;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.2s ease;
  backdrop-filter: blur(4px);
}

.template-overlay.template-visible {
  opacity: 1;
}

.template-dialog {
  background: var(--color-bg-card, #1a2233);
  border: 1px solid var(--color-border, #2a3a52);
  border-radius: var(--radius-lg, 16px);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
  width: 720px;
  max-width: 95vw;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  transform: scale(0.96) translateY(8px);
  transition: transform 0.2s ease;
}

.template-visible .template-dialog {
  transform: scale(1) translateY(0);
}

.template-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--color-border, #2a3a52);
  flex-shrink: 0;
}

.template-title {
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0;
}

.template-close {
  background: none;
  border: none;
  color: var(--color-text-muted, #8896ab);
  font-size: 1.5rem;
  cursor: pointer;
  padding: 0.25rem;
  line-height: 1;
  transition: color 0.15s;
}

.template-close:hover {
  color: var(--color-text, #e2e8f0);
}

.template-search {
  padding: 0.75rem 1.5rem;
  border-bottom: 1px solid var(--color-border, #2a3a52);
  flex-shrink: 0;
}

.template-search input {
  width: 100%;
  padding: 0.5rem 0.875rem;
  background: var(--color-bg-secondary, #111827);
  border: 1px solid var(--color-border, #2a3a52);
  border-radius: var(--radius-sm, 6px);
  color: var(--color-text, #e2e8f0);
  font-size: 0.8125rem;
  outline: none;
  transition: border-color 0.15s;
}

.template-search input:focus {
  border-color: var(--color-primary, #3b82f6);
}

.template-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  overflow-y: auto;
  flex: 1;
}

.template-overlay .template-card {
  background: var(--color-bg-secondary, #111827);
  border: 1px solid var(--color-border, #2a3a52);
  border-radius: var(--radius-md, 10px);
  padding: 1.125rem;
  cursor: pointer;
  transition: all 0.15s ease;
  display: flex;
  flex-direction: column;
}

.template-overlay .template-card:hover {
  border-color: var(--color-primary, #3b82f6);
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(59, 130, 246, 0.12);
}

.template-overlay .template-card-icon {
  font-size: 1.5rem;
  margin-bottom: 0.625rem;
}

.template-overlay .template-card-name {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text, #e2e8f0);
  margin-bottom: 0.25rem;
}

.template-overlay .template-card-desc {
  font-size: 0.75rem;
  color: var(--color-text-muted, #8896ab);
  line-height: 1.45;
  margin-bottom: 0.625rem;
  flex: 1;
}

.template-overlay .template-card-meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.6875rem;
  color: var(--color-text-dim, #5a6a80);
}

.template-card-sections {
  display: none;
  padding-top: 0.625rem;
  margin-top: 0.625rem;
  border-top: 1px solid var(--color-border, #2a3a52);
  padding-left: 0;
}

.template-overlay .template-card:hover .template-card-sections {
  display: block;
}

.template-card-sections li {
  font-size: 0.6875rem;
  color: var(--color-text-dim, #5a6a80);
  padding: 0.125rem 0;
  list-style: none;
}

.template-card-sections li::before {
  content: "\00A7 ";
  color: var(--color-primary, #3b82f6);
}

.template-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-top: 0.375rem;
}

.template-tag {
  font-size: 0.5625rem;
  padding: 0.125rem 0.375rem;
  background: rgba(59, 130, 246, 0.08);
  border-radius: 3px;
  color: var(--color-primary, #3b82f6);
  font-weight: 500;
}

[data-theme="light"] .template-dialog {
  background: #fff;
  border-color: #e2e8f0;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
}

[data-theme="light"] .template-overlay .template-card {
  background: #f8fafc;
  border-color: #e2e8f0;
}

[data-theme="light"] .template-overlay .template-card:hover {
  box-shadow: 0 4px 16px rgba(59, 130, 246, 0.08);
}

@media (max-width: 768px) {
  .template-grid {
    grid-template-columns: 1fr;
  }
  .template-dialog {
    max-height: 90vh;
  }
}

/* ── Bulk Operations ────────────────────────────────────────────────── */
.bulk-select-btn {
  padding: 0.375rem 0.75rem;
  background: rgba(59, 130, 246, 0.08);
  border: 1px solid rgba(59, 130, 246, 0.15);
  border-radius: var(--radius-sm, 6px);
  color: var(--color-primary, #3b82f6);
  font-size: 0.6875rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.12s;
}

.bulk-select-btn:hover {
  background: rgba(59, 130, 246, 0.15);
}

.bulk-select-btn.active {
  background: var(--color-primary, #3b82f6);
  color: #fff;
  border-color: var(--color-primary, #3b82f6);
}

/* Checkbox overlay on cards */
.bulk-checkbox-wrap {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  z-index: 10;
  display: none;
}

.select-mode .bulk-checkbox-wrap {
  display: block;
}

.bulk-checkbox {
  width: 20px;
  height: 20px;
  accent-color: var(--color-primary, #3b82f6);
  cursor: pointer;
}

.select-mode .project-card,
.select-mode .source-card {
  position: relative;
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s;
}

.select-mode .project-card.bulk-selected,
.select-mode .source-card.bulk-selected {
  border-color: var(--color-primary, #3b82f6);
  background: rgba(59, 130, 246, 0.04);
}

/* Floating action bar */
.bulk-action-bar {
  position: fixed;
  bottom: -80px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5000;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1.25rem;
  background: var(--color-bg-card, #1a2233);
  border: 1px solid var(--color-border, #2a3a52);
  border-radius: var(--radius-lg, 16px);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
  transition: bottom 0.25s ease;
}

.bulk-action-bar.bulk-bar-visible {
  bottom: 1.5rem;
}

.bulk-selected-count {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-text, #e2e8f0);
  white-space: nowrap;
}

.bulk-action-divider {
  width: 1px;
  height: 24px;
  background: var(--color-border, #2a3a52);
}

.bulk-action-btn {
  padding: 0.375rem 0.625rem;
  background: rgba(59, 130, 246, 0.08);
  border: 1px solid rgba(59, 130, 246, 0.15);
  border-radius: var(--radius-sm, 6px);
  color: var(--color-primary, #3b82f6);
  font-size: 0.6875rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.12s;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.bulk-action-btn:hover {
  background: rgba(59, 130, 246, 0.15);
}

.bulk-action-btn.bulk-delete {
  color: var(--color-danger, #ef4444);
  background: rgba(239, 68, 68, 0.06);
  border-color: rgba(239, 68, 68, 0.12);
}

.bulk-action-btn.bulk-delete:hover {
  background: rgba(239, 68, 68, 0.12);
}

.bulk-cancel-btn {
  padding: 0.375rem 0.625rem;
  background: none;
  border: 1px solid var(--color-border, #2a3a52);
  border-radius: var(--radius-sm, 6px);
  color: var(--color-text-muted, #8896ab);
  font-size: 0.6875rem;
  cursor: pointer;
  transition: all 0.12s;
}

.bulk-cancel-btn:hover {
  background: rgba(255, 255, 255, 0.04);
  color: var(--color-text, #e2e8f0);
}

.bulk-select-all-btn {
  padding: 0.25rem 0.5rem;
  background: none;
  border: none;
  color: var(--color-primary, #3b82f6);
  font-size: 0.625rem;
  font-weight: 500;
  cursor: pointer;
  text-decoration: underline;
}

/* Tag input modal */
.bulk-tag-input {
  width: 100%;
  padding: 0.5rem 0.75rem;
  background: var(--color-bg-secondary, #111827);
  border: 1px solid var(--color-border, #2a3a52);
  border-radius: var(--radius-sm, 6px);
  color: var(--color-text, #e2e8f0);
  font-size: 0.8125rem;
  outline: none;
}

.bulk-tag-input:focus {
  border-color: var(--color-primary, #3b82f6);
}

[data-theme="light"] .bulk-action-bar {
  background: #fff;
  border-color: #e2e8f0;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .bulk-action-bar {
    left: 0.75rem;
    right: 0.75rem;
    transform: none;
    flex-wrap: wrap;
    border-radius: var(--radius-md, 10px);
  }
}

/* ── DOI Quick-Add ─────────────────────────────────────────────── */
.doi-quick-add {
  margin-bottom: 1rem;
  padding: 0.875rem;
  background: var(--color-bg-card, #1a2233);
  border: 1px solid var(--color-border, #2a3a52);
  border-radius: 10px;
}

.doi-input-row {
  display: flex;
  gap: 0.5rem;
}

.doi-input {
  flex: 1;
  background: var(--color-bg, #0a0e17);
  border: 1px solid var(--color-border, #2a3a52);
  border-radius: 8px;
  color: var(--color-text, #e2e8f0);
  font-family: inherit;
  font-size: 0.8125rem;
  padding: 0.5rem 0.75rem;
  transition: border-color 0.15s;
}
.doi-input:focus { outline: none; border-color: var(--color-primary, #3b82f6); }
.doi-input::placeholder { color: var(--color-text-dim, #5a6a80); }

.doi-fetch-btn {
  background: var(--color-primary, #3b82f6);
  border: none;
  color: #fff;
  border-radius: 8px;
  padding: 0.5rem 1rem;
  font-size: 0.8125rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s, opacity 0.15s;
}
.doi-fetch-btn:hover { background: var(--color-primary-hover, #2563eb); }
.doi-fetch-btn:disabled { opacity: 0.6; cursor: not-allowed; }

.doi-status { margin-top: 0.5rem; font-size: 0.8125rem; min-height: 0; transition: all 0.2s; }
.doi-status:empty { margin-top: 0; }
.doi-status-loading { color: var(--color-primary, #3b82f6); }
.doi-status-error { color: var(--color-danger, #ef4444); }
.doi-status-success { color: var(--color-success, #10b981); }

.doi-spinner {
  display: inline-block;
  width: 14px;
  height: 14px;
  border: 2px solid var(--color-primary, #3b82f6);
  border-top-color: transparent;
  border-radius: 50%;
  animation: doiSpin 0.6s linear infinite;
  vertical-align: middle;
  margin-right: 0.375rem;
}
@keyframes doiSpin { to { transform: rotate(360deg); } }

.doi-result-card {
  background: var(--color-bg-hover, #1e293b);
  border: 1px solid var(--color-border, #2a3a52);
  border-radius: 8px;
  padding: 0.75rem;
  margin-top: 0.25rem;
}
.doi-result-title {
  font-weight: 600;
  font-size: 0.875rem;
  color: var(--color-text, #e2e8f0);
  margin-bottom: 0.25rem;
  line-height: 1.4;
}
.doi-result-meta {
  font-size: 0.75rem;
  color: var(--color-text-muted, #8896ab);
  margin-bottom: 0.125rem;
}
.doi-result-journal {
  font-size: 0.75rem;
  font-style: italic;
  color: var(--color-text-dim, #5a6a80);
  margin-bottom: 0.375rem;
}
.doi-result-actions { display: flex; align-items: center; gap: 0.5rem; }
.doi-result-added {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-success, #10b981);
}

[data-theme="light"] .doi-quick-add { background: #fff; }
[data-theme="light"] .doi-input { background: #f1f5f9; }
[data-theme="light"] .doi-result-card { background: #f8fafc; }

/* ── Research Notes Panel ─────────────────────────────────────────── */
.rn-toggle-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px;
  background: transparent;
  color: var(--color-text-muted, #8896ab);
  cursor: pointer;
  transition: color 0.15s, border-color 0.15s, background 0.15s;
}
.rn-toggle-btn:hover {
  color: var(--color-text, #e2e8f0);
  border-color: var(--color-accent, #6366f1);
  background: var(--color-bg-tertiary, #1e293b);
}

.research-notes-panel {
  position: fixed;
  top: 0;
  right: 0;
  width: 350px;
  height: 100vh;
  background: var(--color-bg-secondary, #111827);
  border-left: 1px solid var(--color-border, #1e293b);
  display: flex;
  flex-direction: column;
  z-index: 100;
  transform: translateX(100%);
  transition: transform 0.25s ease;
  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.3);
}
.research-notes-panel.rn-open {
  transform: translateX(0);
}

.rn-header {
  padding: 0.875rem 1rem 0.625rem;
  border-bottom: 1px solid var(--color-border, #1e293b);
  flex-shrink: 0;
}
.rn-header-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.5rem;
}
.rn-title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--color-text, #e2e8f0);
  margin: 0;
}
.rn-close-btn {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 6px;
  background: transparent;
  color: var(--color-text-muted, #8896ab);
  font-size: 1.125rem;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.rn-close-btn:hover {
  background: var(--color-bg-tertiary, #1e293b);
  color: var(--color-text, #e2e8f0);
}

.rn-search {
  width: 100%;
  padding: 0.4375rem 0.75rem;
  font-size: 0.8125rem;
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px;
  background: var(--color-bg, #0f172a);
  color: var(--color-text, #e2e8f0);
  outline: none;
  transition: border-color 0.15s;
}
.rn-search::placeholder { color: var(--color-text-muted, #8896ab); }
.rn-search:focus { border-color: var(--color-accent, #6366f1); }

.rn-content {
  flex: 1;
  overflow-y: auto;
  padding: 0.5rem;
}

.rn-notes-list {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.rn-empty {
  text-align: center;
  color: var(--color-text-muted, #8896ab);
  font-size: 0.8125rem;
  padding: 2rem 1rem;
  line-height: 1.6;
}

.rn-note-card {
  padding: 0.625rem 0.75rem;
  border-radius: 6px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.rn-note-card:hover {
  background: var(--color-bg-tertiary, #1e293b);
  border-color: var(--color-border, #1e293b);
}
.rn-note-card.rn-note-active {
  background: var(--color-bg-tertiary, #1e293b);
  border-color: var(--color-accent, #6366f1);
}

.rn-note-title {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-text, #e2e8f0);
  margin-bottom: 0.1875rem;
  line-height: 1.4;
}

.rn-note-preview {
  font-size: 0.75rem;
  color: var(--color-text-muted, #8896ab);
  margin-bottom: 0.3125rem;
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rn-note-meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.rn-note-time {
  font-size: 0.6875rem;
  color: var(--color-text-muted, #8896ab);
}
.rn-note-tags {
  display: flex;
  gap: 0.25rem;
  flex-wrap: wrap;
}

.rn-tag {
  display: inline-block;
  padding: 0.0625rem 0.4375rem;
  font-size: 0.625rem;
  font-weight: 600;
  border-radius: 9999px;
  background: var(--color-accent, #6366f1);
  color: #fff;
  line-height: 1.5;
}

/* ── Note Editor ──────────────────────────────────────────────────── */
.rn-editor {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 0.25rem;
}
.rn-editor-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
.rn-back-btn,
.rn-delete-btn {
  padding: 0.3125rem 0.625rem;
  font-size: 0.75rem;
  font-weight: 500;
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px;
  background: transparent;
  color: var(--color-text-muted, #8896ab);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.rn-back-btn:hover { background: var(--color-bg-tertiary, #1e293b); color: var(--color-text, #e2e8f0); }
.rn-delete-btn:hover { background: #7f1d1d; color: #fca5a5; border-color: #991b1b; }

.rn-editor-title {
  width: 100%;
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 600;
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px;
  background: var(--color-bg, #0f172a);
  color: var(--color-text, #e2e8f0);
  outline: none;
  transition: border-color 0.15s;
}
.rn-editor-title:focus { border-color: var(--color-accent, #6366f1); }

.rn-editor-body {
  width: 100%;
  min-height: 200px;
  padding: 0.625rem 0.75rem;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.8125rem;
  line-height: 1.6;
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px;
  background: var(--color-bg, #0f172a);
  color: var(--color-text, #e2e8f0);
  resize: vertical;
  outline: none;
  transition: border-color 0.15s;
}
.rn-editor-body:focus { border-color: var(--color-accent, #6366f1); }

.rn-label {
  display: block;
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--color-text-muted, #8896ab);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.25rem;
}

.rn-tag-input-wrap { display: flex; flex-direction: column; }
.rn-tag-input {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  padding: 0.375rem;
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px;
  background: var(--color-bg, #0f172a);
  align-items: center;
}
.rn-tag-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.125rem 0.4375rem;
  font-size: 0.6875rem;
  font-weight: 600;
  border-radius: 9999px;
  background: var(--color-accent, #6366f1);
  color: #fff;
}
.rn-tag-remove {
  background: none;
  border: none;
  color: rgba(255,255,255,0.7);
  font-size: 0.8125rem;
  cursor: pointer;
  padding: 0;
  line-height: 1;
}
.rn-tag-remove:hover { color: #fff; }
.rn-tag-new {
  flex: 1;
  min-width: 60px;
  border: none;
  background: transparent;
  color: var(--color-text, #e2e8f0);
  font-size: 0.8125rem;
  outline: none;
}
.rn-tag-new::placeholder { color: var(--color-text-muted, #8896ab); }

.rn-source-wrap { display: flex; flex-direction: column; }
.rn-source-link {
  width: 100%;
  padding: 0.4375rem 0.75rem;
  font-size: 0.8125rem;
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px;
  background: var(--color-bg, #0f172a);
  color: var(--color-text, #e2e8f0);
  outline: none;
  cursor: pointer;
}
.rn-source-link:focus { border-color: var(--color-accent, #6366f1); }

.rn-fab {
  flex-shrink: 0;
  margin: 0.625rem;
  padding: 0.625rem 1rem;
  font-size: 0.8125rem;
  font-weight: 600;
  border: none;
  border-radius: 8px;
  background: var(--color-accent, #6366f1);
  color: #fff;
  cursor: pointer;
  text-align: center;
  transition: background 0.15s, transform 0.1s;
}
.rn-fab:hover { background: var(--color-accent-hover, #4f46e5); }
.rn-fab:active { transform: scale(0.97); }

/* ── Light Theme Overrides ────────────────────────────────────────── */
[data-theme="light"] .rn-toggle-btn {
  border-color: #d1d5db;
  color: #6b7280;
}
[data-theme="light"] .rn-toggle-btn:hover {
  color: #111827;
  border-color: #6366f1;
  background: #f3f4f6;
}
[data-theme="light"] .research-notes-panel {
  background: #fff;
  border-left-color: #e5e7eb;
  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.08);
}
[data-theme="light"] .rn-header { border-bottom-color: #e5e7eb; }
[data-theme="light"] .rn-title { color: #111827; }
[data-theme="light"] .rn-close-btn { color: #6b7280; }
[data-theme="light"] .rn-close-btn:hover { background: #f3f4f6; color: #111827; }
[data-theme="light"] .rn-search {
  border-color: #d1d5db;
  background: #f9fafb;
  color: #111827;
}
[data-theme="light"] .rn-search::placeholder { color: #9ca3af; }
[data-theme="light"] .rn-note-card:hover { background: #f3f4f6; border-color: #e5e7eb; }
[data-theme="light"] .rn-note-card.rn-note-active { background: #eef2ff; border-color: #6366f1; }
[data-theme="light"] .rn-note-title { color: #111827; }
[data-theme="light"] .rn-note-preview { color: #6b7280; }
[data-theme="light"] .rn-note-time { color: #9ca3af; }
[data-theme="light"] .rn-editor-title {
  border-color: #d1d5db;
  background: #f9fafb;
  color: #111827;
}
[data-theme="light"] .rn-editor-body {
  border-color: #d1d5db;
  background: #f9fafb;
  color: #111827;
}
[data-theme="light"] .rn-back-btn,
[data-theme="light"] .rn-delete-btn {
  border-color: #d1d5db;
  color: #6b7280;
}
[data-theme="light"] .rn-back-btn:hover { background: #f3f4f6; color: #111827; }
[data-theme="light"] .rn-tag-input {
  border-color: #d1d5db;
  background: #f9fafb;
}
[data-theme="light"] .rn-tag-new { color: #111827; }
[data-theme="light"] .rn-tag-new::placeholder { color: #9ca3af; }
[data-theme="light"] .rn-source-link {
  border-color: #d1d5db;
  background: #f9fafb;
  color: #111827;
}
[data-theme="light"] .rn-empty { color: #6b7280; }
[data-theme="light"] .rn-label { color: #6b7280; }

/* ── Responsive: full-width panel below 768px ─────────────────────── */
@media (max-width: 768px) {
  .research-notes-panel {
    width: 100vw;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   SOURCE COMPARISON TABLE
   ══════════════════════════════════════════════════════════════════════ */

/* ── Compare button (toolbar / action bar) ─────────────────────────── */
.sc-compare-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.375rem 0.875rem;
  font-size: 0.8125rem;
  font-weight: 600;
  border: 1px solid var(--color-border, #334155);
  border-radius: var(--radius, 6px);
  background: var(--color-surface, #1e293b);
  color: var(--color-text, #e2e8f0);
  cursor: pointer;
  transition: background 0.15s, opacity 0.15s;
  margin-left: 0.5rem;
}
.sc-compare-btn:hover:not(:disabled) {
  background: var(--color-surface-hover, #334155);
}
.sc-compare-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

/* ── Column visibility toggles ─────────────────────────────────────── */
.sc-column-toggles {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  margin-bottom: 0.75rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--color-border, #334155);
}
.sc-toggle-label {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.8125rem;
  color: var(--color-text-dim, #94a3b8);
  cursor: pointer;
  user-select: none;
}
.sc-toggle-label input[type="checkbox"] {
  accent-color: var(--color-primary, #3b82f6);
}

/* ── Scrollable table wrapper ──────────────────────────────────────── */
.sc-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-height: 60vh;
  overflow-y: auto;
  border: 1px solid var(--color-border, #334155);
  border-radius: var(--radius, 6px);
}

/* ── Comparison table ──────────────────────────────────────────────── */
.sc-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 600px;
  font-size: 0.8125rem;
}
.sc-table th,
.sc-table td {
  padding: 0.5rem 0.75rem;
  text-align: left;
  border-bottom: 1px solid var(--color-border, #334155);
  vertical-align: top;
  min-width: 140px;
  max-width: 280px;
  word-wrap: break-word;
}
.sc-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--color-surface, #1e293b);
  color: var(--color-text, #e2e8f0);
  font-weight: 600;
  white-space: nowrap;
}

/* ── First column (attribute name) — sticky left ───────────────────── */
.sc-row-label {
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--color-surface, #1e293b);
  font-weight: 600;
  color: var(--color-text, #e2e8f0);
  min-width: 100px;
  max-width: 120px;
  white-space: nowrap;
}
.sc-table thead th.sc-row-label {
  z-index: 3; /* above both sticky row and sticky header */
}

/* ── Diff highlight ────────────────────────────────────────────────── */
.sc-cell-diff {
  background: rgba(250, 204, 21, 0.12);
}

/* ── Empty cell placeholder ────────────────────────────────────────── */
.sc-empty .sc-dash {
  color: var(--color-text-dim, #64748b);
  font-style: italic;
}

/* ── Export button ─────────────────────────────────────────────────── */
.sc-export-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.4rem 1rem;
  font-size: 0.8125rem;
  font-weight: 600;
  border: 1px solid var(--color-primary, #3b82f6);
  border-radius: var(--radius, 6px);
  background: transparent;
  color: var(--color-primary, #3b82f6);
  cursor: pointer;
  transition: background 0.15s;
}
.sc-export-btn:hover {
  background: rgba(59, 130, 246, 0.1);
}

/* ── Inline note input ─────────────────────────────────────────────── */
.sc-note-input {
  display: block;
  width: 100%;
  margin-top: 0.25rem;
  padding: 0.25rem 0.375rem;
  font-size: 0.75rem;
  border: 1px solid var(--color-primary, #3b82f6);
  border-radius: 3px;
  background: var(--color-surface, #1e293b);
  color: var(--color-text, #e2e8f0);
  outline: none;
}
.sc-note-badge {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.6875rem;
  color: var(--color-primary, #3b82f6);
  font-style: italic;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 200px;
}

/* ══════════════════════════════════════════════════════════════════════
   SOURCE COMPARISON — LIGHT THEME OVERRIDES
   ══════════════════════════════════════════════════════════════════════ */
[data-theme="light"] .sc-compare-btn {
  background: #f1f5f9;
  border-color: #cbd5e1;
  color: #1e293b;
}
[data-theme="light"] .sc-compare-btn:hover:not(:disabled) {
  background: #e2e8f0;
}
[data-theme="light"] .sc-column-toggles {
  border-bottom-color: #e2e8f0;
}
[data-theme="light"] .sc-toggle-label {
  color: #475569;
}
[data-theme="light"] .sc-table-wrap {
  border-color: #e2e8f0;
}
[data-theme="light"] .sc-table th,
[data-theme="light"] .sc-table td {
  border-bottom-color: #e2e8f0;
}
[data-theme="light"] .sc-table thead th {
  background: #f8fafc;
  color: #1e293b;
}
[data-theme="light"] .sc-row-label {
  background: #f8fafc;
  color: #1e293b;
}
[data-theme="light"] .sc-cell-diff {
  background: rgba(234, 179, 8, 0.15);
}
[data-theme="light"] .sc-empty .sc-dash {
  color: #94a3b8;
}
[data-theme="light"] .sc-note-input {
  background: #ffffff;
  color: #1e293b;
  border-color: #3b82f6;
}
[data-theme="light"] .sc-note-badge {
  color: #2563eb;
}

/* ── Responsive: comparison table horizontal scroll ────────────────── */
@media (max-width: 768px) {
  .sc-table-wrap {
    max-height: 50vh;
  }
  .sc-table th,
  .sc-table td {
    min-width: 120px;
    padding: 0.375rem 0.5rem;
    font-size: 0.75rem;
  }
  .sc-column-toggles {
    gap: 0.375rem 0.75rem;
  }
}

/* ================================================================
   Research Timeline Visualization
   ================================================================ */

.research-timeline-section {
  background: var(--card-bg, #1e293b);
  border: 1px solid var(--border, #334155);
  border-radius: 0.75rem;
  padding: 1.25rem;
  margin-top: 1.5rem;
}

.rt-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.rt-title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--heading, #f1f5f9);
  margin: 0;
}

.rt-controls {
  display: flex;
  align-items: center;
  gap: 0.375rem;
}

.rt-zoom-btn {
  background: var(--btn-bg, #334155);
  color: var(--btn-text, #e2e8f0);
  border: 1px solid var(--border, #475569);
  border-radius: 0.375rem;
  padding: 0.25rem 0.625rem;
  font-size: 0.85rem;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
  line-height: 1.4;
}
.rt-zoom-btn:hover {
  background: var(--btn-hover, #475569);
  border-color: var(--accent, #6366f1);
}

.rt-toggle-btn {
  background: var(--btn-bg, #334155);
  color: var(--btn-text, #e2e8f0);
  border: 1px solid var(--border, #475569);
  border-radius: 0.375rem;
  padding: 0.25rem 0.75rem;
  font-size: 0.8rem;
  cursor: pointer;
  margin-left: 0.375rem;
  transition: background 0.15s;
}
.rt-toggle-btn:hover {
  background: var(--btn-hover, #475569);
}

/* ── Range filter bar ───────────────────────────────────────────── */

.rt-range-bar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
  font-size: 0.8rem;
  color: var(--muted, #94a3b8);
  flex-wrap: wrap;
}

.rt-range-input {
  width: 5rem;
  padding: 0.2rem 0.4rem;
  border: 1px solid var(--border, #475569);
  border-radius: 0.3rem;
  background: var(--input-bg, #0f172a);
  color: var(--text, #e2e8f0);
  font-size: 0.8rem;
  margin-left: 0.25rem;
}

/* ── Scrollable container ───────────────────────────────────────── */

.rt-container {
  overflow-x: auto;
  overflow-y: visible;
  padding: 1.5rem 0 2.5rem;
  position: relative;
  min-height: 120px;
}

.rt-track {
  position: relative;
  min-height: 100px;
}

/* ── Axis ───────────────────────────────────────────────────────── */

.rt-axis {
  position: absolute;
  top: 50px;
  left: 60px;
  height: 2px;
  background: var(--border, #475569);
  border-radius: 1px;
}

.rt-tick {
  position: absolute;
  top: 46px;
  width: 1px;
  height: 10px;
  background: var(--border, #475569);
}

.rt-year-label {
  position: absolute;
  top: 62px;
  transform: translateX(-50%);
  font-size: 0.7rem;
  color: var(--muted, #64748b);
  white-space: nowrap;
  user-select: none;
}

/* ── Era bands ──────────────────────────────────────────────────── */

.rt-era-band {
  position: absolute;
  top: 0;
  bottom: 0;
  background: var(--era-bg, rgba(99, 102, 241, 0.04));
  border-left: 1px dashed var(--era-border, rgba(99, 102, 241, 0.15));
  pointer-events: none;
}
.rt-era-band:nth-child(even) {
  background: var(--era-bg-alt, rgba(99, 102, 241, 0.07));
}

.rt-era-label {
  position: absolute;
  top: 4px;
  left: 6px;
  font-size: 0.65rem;
  color: var(--muted, #64748b);
  opacity: 0.7;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* ── Dots ───────────────────────────────────────────────────────── */

.rt-dot {
  position: absolute;
  top: 40px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  cursor: pointer;
  border: 2px solid transparent;
  transition: transform 0.15s, box-shadow 0.15s;
  z-index: 2;
}
.rt-dot:hover {
  transform: translate(-50%, -50%) scale(1.35);
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.3);
  z-index: 5;
}

.rt-dot-stack {
  position: absolute;
  top: 40px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 2;
}
.rt-dot-stacked {
  position: relative;
  top: auto;
  transform: none;
}
.rt-dot-stacked:hover {
  transform: scale(1.35);
}

.rt-count-badge {
  background: var(--accent, #6366f1);
  color: #fff;
  font-size: 0.6rem;
  font-weight: 700;
  padding: 0 0.3rem;
  border-radius: 0.5rem;
  line-height: 1.3;
  margin-top: 2px;
  pointer-events: none;
}

/* ── Dot type colors ────────────────────────────────────────────── */

.rt-type-article  { background: #6366f1; border-color: #818cf8; }
.rt-type-book     { background: #22c55e; border-color: #4ade80; }
.rt-type-conference { background: #f59e0b; border-color: #fbbf24; }
.rt-type-preprint { background: #ec4899; border-color: #f472b6; }

/* ── Popover ────────────────────────────────────────────────────── */

.rt-popover {
  position: absolute;
  width: 220px;
  background: var(--card-bg, #1e293b);
  border: 1px solid var(--border, #475569);
  border-radius: 0.5rem;
  padding: 0.75rem;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  z-index: 20;
  animation: rtFadeIn 0.12s ease-out;
}

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

.rt-popover-title {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--heading, #f1f5f9);
  margin-bottom: 0.375rem;
  line-height: 1.35;
}

.rt-popover-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  font-size: 0.72rem;
  color: var(--muted, #94a3b8);
  margin-bottom: 0.5rem;
}

.rt-popover-authors {
  flex: 1 1 100%;
}

.rt-popover-year {
  font-weight: 600;
}

.rt-type-article-text  { color: #818cf8; }
.rt-type-book-text     { color: #4ade80; }
.rt-type-conference-text { color: #fbbf24; }
.rt-type-preprint-text { color: #f472b6; }

.rt-popover-actions {
  display: flex;
  gap: 0.375rem;
}

.rt-popover-btn {
  flex: 1;
  padding: 0.3rem 0.5rem;
  border-radius: 0.3rem;
  font-size: 0.72rem;
  cursor: pointer;
  border: 1px solid var(--border, #475569);
  transition: background 0.15s;
}

.rt-view-btn {
  background: var(--accent, #6366f1);
  color: #fff;
  border-color: var(--accent, #6366f1);
}
.rt-view-btn:hover {
  background: #4f46e5;
}

.rt-remove-btn {
  background: transparent;
  color: var(--muted, #94a3b8);
}
.rt-remove-btn:hover {
  background: rgba(239, 68, 68, 0.15);
  color: #f87171;
  border-color: #f87171;
}

.rt-empty {
  text-align: center;
  color: var(--muted, #64748b);
  font-size: 0.85rem;
  padding: 1.5rem 0;
}

/* ── Light theme overrides ──────────────────────────────────────── */

[data-theme="light"] .research-timeline-section {
  background: #ffffff;
  border-color: #e2e8f0;
}
[data-theme="light"] .rt-title {
  color: #1e293b;
}
[data-theme="light"] .rt-zoom-btn {
  background: #f1f5f9;
  color: #334155;
  border-color: #cbd5e1;
}
[data-theme="light"] .rt-zoom-btn:hover {
  background: #e2e8f0;
}
[data-theme="light"] .rt-toggle-btn {
  background: #f1f5f9;
  color: #334155;
  border-color: #cbd5e1;
}
[data-theme="light"] .rt-range-input {
  background: #f8fafc;
  color: #1e293b;
  border-color: #cbd5e1;
}
[data-theme="light"] .rt-axis {
  background: #cbd5e1;
}
[data-theme="light"] .rt-tick {
  background: #cbd5e1;
}
[data-theme="light"] .rt-year-label {
  color: #64748b;
}
[data-theme="light"] .rt-era-band {
  background: rgba(99, 102, 241, 0.05);
  border-left-color: rgba(99, 102, 241, 0.12);
}
[data-theme="light"] .rt-era-band:nth-child(even) {
  background: rgba(99, 102, 241, 0.08);
}
[data-theme="light"] .rt-dot:hover {
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
}
[data-theme="light"] .rt-popover {
  background: #ffffff;
  border-color: #e2e8f0;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}
[data-theme="light"] .rt-popover-title {
  color: #1e293b;
}
[data-theme="light"] .rt-popover-meta {
  color: #64748b;
}
[data-theme="light"] .rt-popover-btn {
  border-color: #e2e8f0;
}
[data-theme="light"] .rt-remove-btn {
  color: #64748b;
}
[data-theme="light"] .rt-count-badge {
  background: #6366f1;
}

/* ── Responsive: timeline ───────────────────────────────────────── */

@media (max-width: 768px) {
  .research-timeline-section {
    padding: 0.875rem;
  }
  .rt-header {
    flex-direction: column;
    align-items: flex-start;
  }
  .rt-dot {
    width: 10px;
    height: 10px;
  }
  .rt-dot-stacked {
    width: 10px;
    height: 10px;
  }
  .rt-year-label {
    font-size: 0.6rem;
  }
  .rt-popover {
    width: 180px;
    padding: 0.5rem;
  }
  .rt-popover-title {
    font-size: 0.78rem;
  }
  .rt-range-bar {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.375rem;
  }
}

/* ── Export Panel ──────────────────────────────────────────────────── */

.export-float-btn {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 200;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: none;
  background: var(--color-accent, #6366f1);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
  transition: transform 0.2s, box-shadow 0.2s;
}
.export-float-btn:hover {
  transform: scale(1.08);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.45);
}

.export-panel {
  position: fixed;
  top: 0;
  right: 0;
  width: 360px;
  height: 100vh;
  z-index: 300;
  background: var(--color-bg-secondary, #111827);
  border-left: 1px solid var(--color-border, #1e293b);
  backdrop-filter: blur(12px);
  transform: translateX(100%);
  transition: transform 0.3s ease;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.export-panel-open {
  transform: translateX(0);
}

.export-panel-inner {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.export-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.export-panel-header h3 {
  margin: 0;
  font-size: 1.05rem;
  color: var(--color-text, #e2e8f0);
}
.export-panel-close {
  background: none;
  border: none;
  color: var(--color-text-muted, #8896ab);
  font-size: 1.4rem;
  cursor: pointer;
  padding: 0 0.25rem;
  line-height: 1;
}
.export-panel-close:hover {
  color: var(--color-text, #e2e8f0);
}

.export-format-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
}

.export-format-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  padding: 0.625rem 0.25rem;
  border-radius: 8px;
  border: 1px solid var(--color-border, #1e293b);
  background: var(--color-bg, #0a0e17);
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.export-format-card:hover {
  border-color: var(--color-accent, #6366f1);
}
.export-format-card-active {
  border-color: var(--color-accent, #6366f1);
  background: rgba(99, 102, 241, 0.1);
}
.export-format-icon { font-size: 1.25rem; }
.export-format-label {
  font-size: 0.75rem;
  color: var(--color-text-muted, #8896ab);
  font-weight: 500;
}
.export-format-card-active .export-format-label {
  color: var(--color-text, #e2e8f0);
}

.export-options {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.export-option-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--color-text, #e2e8f0);
}
.export-option-row input[type="checkbox"] { accent-color: var(--color-accent, #6366f1); }
.export-date-input,
.export-template-select {
  flex: 1;
  padding: 0.3rem 0.5rem;
  border-radius: 4px;
  border: 1px solid var(--color-border, #1e293b);
  background: var(--color-bg, #0a0e17);
  color: var(--color-text, #e2e8f0);
  font-size: 0.75rem;
}

.export-preview-section h4 {
  margin: 0 0 0.375rem;
  font-size: 0.8125rem;
  color: var(--color-text-muted, #8896ab);
}

.export-preview {
  background: var(--color-bg, #0a0e17);
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px;
  padding: 0.75rem;
  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  font-size: 0.7rem;
  color: var(--color-text-muted, #8896ab);
  max-height: 200px;
  overflow-y: auto;
  white-space: pre-wrap;
  word-break: break-word;
  margin: 0;
}

.export-action-btn {
  width: 100%;
  padding: 0.625rem;
  border: none;
  border-radius: 6px;
  background: var(--color-accent, #6366f1);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.15s;
}
.export-action-btn:hover { opacity: 0.88; }

/* Light theme overrides */
[data-theme="light"] .export-float-btn { box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15); }
[data-theme="light"] .export-panel { background: #fff; border-left-color: #e2e8f0; }
[data-theme="light"] .export-panel-header h3 { color: #1e293b; }
[data-theme="light"] .export-panel-close { color: #64748b; }
[data-theme="light"] .export-panel-close:hover { color: #1e293b; }
[data-theme="light"] .export-format-card { background: #f8fafc; border-color: #e2e8f0; }
[data-theme="light"] .export-format-card-active { background: rgba(99, 102, 241, 0.08); }
[data-theme="light"] .export-format-label { color: #64748b; }
[data-theme="light"] .export-format-card-active .export-format-label { color: #1e293b; }
[data-theme="light"] .export-option-row { color: #1e293b; }
[data-theme="light"] .export-date-input,
[data-theme="light"] .export-template-select { background: #f8fafc; border-color: #e2e8f0; color: #1e293b; }
[data-theme="light"] .export-preview { background: #f8fafc; border-color: #e2e8f0; color: #64748b; }
[data-theme="light"] .export-preview-section h4 { color: #64748b; }

/* Mobile: full-width panel */
@media (max-width: 768px) {
  .export-panel {
    width: 100vw;
  }
  .export-float-btn {
    bottom: 1rem;
    right: 1rem;
    width: 44px;
    height: 44px;
  }
  .export-format-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ══════════════════════════════════════════════════════════════════
   METHODOLOGY WIZARD
   ══════════════════════════════════════════════════════════════════ */

.mw-trigger-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.5rem 1rem;
  border: 1px solid var(--color-border, #444);
  border-radius: 6px;
  background: var(--color-surface, #1e1e1e);
  color: var(--color-text, #e0e0e0);
  font-size: 0.85rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.mw-trigger-btn:hover {
  background: var(--color-hover, #2a2a2a);
  border-color: var(--color-accent, #4f8cff);
}

.mw-wizard-container {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  min-height: 380px;
}

/* Steps bar */
.mw-steps-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 0.5rem 0;
}
.mw-step-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  min-width: 72px;
}
.mw-step-circle {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  font-weight: 600;
  border: 2px solid var(--color-border, #444);
  color: var(--color-text-dim, #888);
  background: transparent;
  transition: all 0.25s;
}
.mw-step-active {
  border-color: var(--color-accent, #4f8cff);
  color: #fff;
  background: var(--color-accent, #4f8cff);
}
.mw-step-done {
  border-color: var(--color-success, #34d399);
  color: #fff;
  background: var(--color-success, #34d399);
}
.mw-step-label {
  font-size: 0.7rem;
  color: var(--color-text-dim, #888);
  text-align: center;
}
.mw-step-line {
  flex: 0 0 40px;
  height: 2px;
  background: var(--color-border, #444);
  margin-bottom: 1.2rem;
  transition: background 0.25s;
}
.mw-step-line-done {
  background: var(--color-success, #34d399);
}

/* Step heading */
.mw-step-heading {
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 0.75rem;
  color: var(--color-text, #e0e0e0);
}
.mw-sub-label {
  font-size: 0.85rem;
  font-weight: 500;
  margin: 0 0 0.5rem;
  color: var(--color-text-dim, #aaa);
}

/* Type grid — 2x3 */
.mw-type-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
}
.mw-type-card {
  padding: 0.75rem;
  border: 1px solid var(--color-border, #444);
  border-radius: 8px;
  background: var(--color-surface, #1e1e1e);
  cursor: pointer;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.mw-type-card:hover {
  border-color: var(--color-accent, #4f8cff);
}
.mw-type-selected {
  border-color: var(--color-accent, #4f8cff);
  box-shadow: 0 0 0 2px rgba(79, 140, 255, 0.25);
}
.mw-type-icon {
  font-size: 1.4rem;
  margin-bottom: 0.35rem;
}
.mw-type-title {
  font-weight: 600;
  font-size: 0.85rem;
  color: var(--color-text, #e0e0e0);
}
.mw-type-category {
  font-size: 0.7rem;
  color: var(--color-accent, #4f8cff);
  margin-bottom: 0.35rem;
}
.mw-type-desc {
  font-size: 0.75rem;
  line-height: 1.45;
  color: var(--color-text-dim, #aaa);
  margin-bottom: 0.35rem;
}
.mw-type-meta {
  font-size: 0.7rem;
  color: var(--color-text-dim, #888);
  line-height: 1.4;
}

/* Collection grid variant */
.mw-collection-grid {
  grid-template-columns: repeat(5, 1fr);
}
.mw-collection-card {
  text-align: center;
  padding: 0.6rem 0.4rem;
}

/* Technique list */
.mw-technique-list {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-bottom: 1rem;
}
.mw-technique-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.85rem;
  color: var(--color-text, #e0e0e0);
  cursor: pointer;
  padding: 0.3rem 0.5rem;
  border-radius: 4px;
  transition: background 0.15s;
}
.mw-technique-item:hover {
  background: var(--color-hover, #2a2a2a);
}

/* Input groups */
.mw-input-group {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  margin-bottom: 0.75rem;
}
.mw-input-group label {
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--color-text-dim, #aaa);
}
.mw-input-group input,
.mw-input-group select,
.mw-input-group textarea {
  padding: 0.5rem 0.6rem;
  border: 1px solid var(--color-border, #444);
  border-radius: 5px;
  background: var(--color-bg, #141414);
  color: var(--color-text, #e0e0e0);
  font-size: 0.85rem;
  font-family: inherit;
}
.mw-input-group textarea {
  resize: vertical;
}

/* Preview box */
.mw-preview-box {
  background: var(--color-bg, #141414);
  border: 1px solid var(--color-border, #444);
  border-radius: 6px;
  padding: 1.25rem 1.5rem;
  font-size: 0.85rem;
  line-height: 1.75;
  color: var(--color-text, #e0e0e0);
  font-family: 'Times New Roman', Georgia, serif;
  max-height: 280px;
  overflow-y: auto;
}
.mw-preview-box p {
  margin: 0 0 0.75rem;
  text-indent: 2em;
}

/* Action row */
.mw-action-row {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.75rem;
  flex-wrap: wrap;
}
.mw-action-btn {
  padding: 0.45rem 0.85rem;
  border: 1px solid var(--color-border, #444);
  border-radius: 5px;
  background: var(--color-surface, #1e1e1e);
  color: var(--color-text, #e0e0e0);
  font-size: 0.8rem;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.mw-action-btn:hover {
  background: var(--color-accent, #4f8cff);
  border-color: var(--color-accent, #4f8cff);
  color: #fff;
}

/* Navigation row */
.mw-nav-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: auto;
  padding-top: 0.5rem;
  border-top: 1px solid var(--color-border, #333);
}
.mw-nav-btn {
  padding: 0.45rem 1.1rem;
  border: 1px solid var(--color-border, #444);
  border-radius: 5px;
  background: var(--color-surface, #1e1e1e);
  color: var(--color-text, #e0e0e0);
  font-size: 0.85rem;
  cursor: pointer;
  transition: background 0.2s;
}
.mw-nav-next {
  background: var(--color-accent, #4f8cff);
  border-color: var(--color-accent, #4f8cff);
  color: #fff;
}
.mw-nav-btn:hover {
  opacity: 0.85;
}

.mw-empty-msg {
  color: var(--color-text-dim, #888);
  font-size: 0.85rem;
  font-style: italic;
}

/* Light theme overrides */
[data-theme="light"] .mw-trigger-btn {
  background: #f5f5f5;
  color: #222;
  border-color: #ccc;
}
[data-theme="light"] .mw-trigger-btn:hover {
  background: #e8e8e8;
}
[data-theme="light"] .mw-type-card {
  background: #fafafa;
  border-color: #ddd;
}
[data-theme="light"] .mw-preview-box {
  background: #fff;
  border-color: #ddd;
  color: #222;
}
[data-theme="light"] .mw-input-group input,
[data-theme="light"] .mw-input-group select,
[data-theme="light"] .mw-input-group textarea {
  background: #fff;
  color: #222;
  border-color: #ccc;
}
[data-theme="light"] .mw-action-btn,
[data-theme="light"] .mw-nav-btn {
  background: #f5f5f5;
  color: #222;
  border-color: #ccc;
}
[data-theme="light"] .mw-nav-next {
  background: var(--color-accent, #4f8cff);
  color: #fff;
}

/* Responsive */
@media (max-width: 768px) {
  .mw-type-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .mw-collection-grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .mw-steps-bar {
    gap: 0;
  }
  .mw-step-item {
    min-width: 54px;
  }
  .mw-step-line {
    flex: 0 0 20px;
  }
  .mw-step-circle {
    width: 28px;
    height: 28px;
    font-size: 0.7rem;
  }
  .mw-step-label {
    font-size: 0.6rem;
  }
  .mw-action-row {
    flex-direction: column;
  }
  .mw-action-btn {
    width: 100%;
    text-align: center;
  }
}

/* ── Hypothesis Tracker ──────────────────────────────────────────── */
.ht-trigger-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px;
  background: var(--color-bg-secondary, #111827);
  color: var(--color-text-muted, #8896ab);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.ht-trigger-btn:hover {
  background: var(--color-bg-tertiary, #1e293b);
  color: var(--color-text, #e2e8f0);
}

.ht-panel {
  min-height: 300px;
}

.ht-pipeline {
  display: flex;
  gap: 0.75rem;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.ht-column {
  flex: 1 1 0;
  min-width: 180px;
  background: var(--color-bg, #0a0e17);
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
}

.ht-column-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.625rem 0.75rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-text, #e2e8f0);
  border-bottom: 1px solid var(--color-border, #1e293b);
}

.ht-column-body {
  flex: 1;
  padding: 0.5rem;
  min-height: 80px;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  transition: background 0.15s;
}

.ht-card {
  background: var(--color-bg-secondary, #111827);
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px;
  padding: 0.625rem 0.75rem;
  cursor: grab;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  transition: transform 0.15s, box-shadow 0.15s, opacity 0.15s;
}
.ht-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
}
.ht-card-dragging {
  opacity: 0.4;
}
.ht-drag-over {
  background: var(--color-bg-tertiary, #1e293b);
  border-radius: 0 0 8px 8px;
}

.ht-card-text {
  font-size: 0.8125rem;
  color: var(--color-text, #e2e8f0);
  line-height: 1.4;
  margin-bottom: 0.5rem;
  word-break: break-word;
}

.ht-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.375rem;
}

.ht-evidence-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.6875rem;
  font-weight: 600;
  background: var(--color-bg-tertiary, #1e293b);
  color: var(--color-text-muted, #8896ab);
  padding: 0.125rem 0.5rem;
  border-radius: 999px;
}

.ht-confidence-bar {
  position: relative;
  height: 6px;
  background: var(--color-bg-tertiary, #1e293b);
  border-radius: 3px;
  margin: 0.375rem 0;
  overflow: visible;
}
.ht-confidence-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.3s ease;
}
.ht-confidence-label {
  position: absolute;
  right: 0;
  top: -14px;
  font-size: 0.625rem;
  color: var(--color-text-muted, #8896ab);
}

.ht-status-history {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0.375rem 0 0.25rem;
}
.ht-history-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}

.ht-card-actions {
  display: flex;
  gap: 0.375rem;
  margin-top: 0.375rem;
}
.ht-card-action-btn {
  flex: 1;
  padding: 0.25rem 0;
  font-size: 0.6875rem;
  font-weight: 500;
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 4px;
  background: var(--color-bg, #0a0e17);
  color: var(--color-text-muted, #8896ab);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
  text-align: center;
}
.ht-card-action-btn:hover {
  background: var(--color-bg-tertiary, #1e293b);
  color: var(--color-text, #e2e8f0);
}

.ht-add-btn {
  padding: 0.5rem 1rem;
  font-size: 0.8125rem;
  font-weight: 600;
  border: none;
  border-radius: 6px;
  background: var(--color-primary, #6366f1);
  color: #fff;
  cursor: pointer;
  transition: opacity 0.15s;
}
.ht-add-btn:hover {
  opacity: 0.85;
}

.ht-form label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-text, #e2e8f0);
  margin-bottom: 0.25rem;
}

/* Light theme overrides */
[data-theme="light"] .ht-trigger-btn {
  background: #f8fafc;
  border-color: #e2e8f0;
  color: #475569;
}
[data-theme="light"] .ht-trigger-btn:hover {
  background: #e2e8f0;
  color: #0f172a;
}
[data-theme="light"] .ht-column {
  background: #ffffff;
  border-color: #e2e8f0;
}
[data-theme="light"] .ht-card {
  background: #f8fafc;
  border-color: #e2e8f0;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}
[data-theme="light"] .ht-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}
[data-theme="light"] .ht-card-text {
  color: #0f172a;
}
[data-theme="light"] .ht-card-action-btn {
  background: #ffffff;
  border-color: #e2e8f0;
  color: #475569;
}
[data-theme="light"] .ht-card-action-btn:hover {
  background: #f1f5f9;
  color: #0f172a;
}

/* Responsive: stack columns vertically on mobile */
@media (max-width: 768px) {
  .ht-pipeline {
    flex-direction: column;
  }
  .ht-column {
    min-width: 0;
  }
}

/* ── Data Visualizer ──────────────────────────────────────────────── */
.dv-trigger-btn {
  display: inline-flex; align-items: center; gap: 0.35rem;
  padding: 0.35rem 0.85rem; border-radius: 6px;
  background: var(--color-accent, #6366f1); color: #fff;
  font-size: 0.8125rem; font-weight: 600; border: none; cursor: pointer;
  transition: background 0.15s, transform 0.1s;
}
.dv-trigger-btn:hover { background: #4f46e5; transform: translateY(-1px); }

.dv-layout {
  display: flex; gap: 1.25rem; min-height: 480px;
}
.dv-input-panel {
  flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.75rem;
}
.dv-chart-preview {
  flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.75rem;
}
.dv-section-title {
  font-size: 0.75rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.05em; color: var(--color-text-muted, #8896ab);
  margin-bottom: 0.25rem;
}
.dv-csv-input {
  width: 100%; resize: vertical; min-height: 80px;
  background: var(--color-bg, #0a0e17); color: var(--color-text, #e2e8f0);
  border: 1px solid var(--color-border, #1e293b); border-radius: 6px;
  padding: 0.6rem 0.75rem; font-family: 'SF Mono', monospace; font-size: 0.8125rem;
}
.dv-csv-input:focus { outline: none; border-color: var(--color-accent, #6366f1); }

.dv-input-actions { display: flex; gap: 0.5rem; }
.dv-action-btn {
  padding: 0.3rem 0.7rem; border-radius: 5px; font-size: 0.75rem; font-weight: 600;
  background: var(--color-bg-secondary, #111827); color: var(--color-text, #e2e8f0);
  border: 1px solid var(--color-border, #1e293b); cursor: pointer;
}
.dv-action-btn:hover { border-color: var(--color-accent, #6366f1); }
.dv-upload-label { display: inline-flex; align-items: center; }

.dv-data-table {
  width: 100%; border-collapse: collapse; font-size: 0.75rem;
  border: 1px solid var(--color-border, #1e293b); border-radius: 6px;
  overflow: hidden;
}
.dv-data-table th {
  background: var(--color-bg-secondary, #111827); color: var(--color-text-muted, #8896ab);
  padding: 0.35rem 0.5rem; text-align: left; font-weight: 600;
  border-bottom: 1px solid var(--color-border, #1e293b); cursor: pointer; white-space: nowrap;
}
.dv-data-table td {
  padding: 0.3rem 0.5rem; border-bottom: 1px solid var(--color-border, #1e293b);
  color: var(--color-text, #e2e8f0);
}
.dv-data-table tr:hover td { background: rgba(99,102,241,0.05); }
.dv-col-type {
  font-size: 0.625rem; padding: 0.1rem 0.3rem; border-radius: 3px;
  background: rgba(99,102,241,0.15); color: #818cf8; margin-left: 0.25rem;
}
.dv-table-note { font-size: 0.6875rem; color: var(--color-text-dim, #64748b); margin-top: 0.25rem; }

.dv-chart-config { display: flex; flex-direction: column; gap: 0.5rem; }
.dv-type-selector { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.dv-type-btn {
  display: flex; align-items: center; gap: 0.3rem;
  padding: 0.35rem 0.7rem; border-radius: 5px; font-size: 0.75rem;
  background: var(--color-bg-secondary, #111827); color: var(--color-text-muted, #8896ab);
  border: 1px solid var(--color-border, #1e293b); cursor: pointer;
  transition: border-color 0.15s, color 0.15s;
}
.dv-type-btn:hover { border-color: var(--color-accent, #6366f1); color: var(--color-text, #e2e8f0); }
.dv-type-btn.dv-type-active {
  border-color: var(--color-accent, #6366f1); color: #fff;
  background: rgba(99,102,241,0.15);
}
.dv-type-icon { font-size: 0.875rem; }
.dv-label {
  font-size: 0.6875rem; font-weight: 600; color: var(--color-text-muted, #8896ab);
  margin-top: 0.25rem;
}
.dv-select {
  padding: 0.3rem 0.5rem; border-radius: 5px; font-size: 0.8125rem;
  background: var(--color-bg, #0a0e17); color: var(--color-text, #e2e8f0);
  border: 1px solid var(--color-border, #1e293b); width: 100%;
}
.dv-select:focus { outline: none; border-color: var(--color-accent, #6366f1); }

.dv-color-swatches { display: flex; gap: 0.5rem; margin-top: 0.25rem; }
.dv-swatch {
  width: 24px; height: 24px; border-radius: 50%; border: 2px solid transparent;
  cursor: pointer; transition: border-color 0.15s, transform 0.1s;
}
.dv-swatch:hover { transform: scale(1.15); }
.dv-swatch.dv-swatch-active { border-color: #fff; box-shadow: 0 0 0 2px var(--color-accent, #6366f1); }

#dv-chart-area {
  flex: 1; display: flex; align-items: center; justify-content: center;
  background: var(--color-bg, #0a0e17); border: 1px solid var(--color-border, #1e293b);
  border-radius: 8px; min-height: 300px; overflow: hidden;
}
#dv-chart-area .dv-svg { width: 100%; height: auto; }
.dv-empty {
  color: var(--color-text-dim, #64748b); font-size: 0.875rem; text-align: center; padding: 2rem;
}

.dv-export-bar { display: flex; gap: 0.5rem; justify-content: flex-end; }
.dv-export-btn {
  padding: 0.35rem 0.75rem; border-radius: 5px; font-size: 0.75rem; font-weight: 600;
  background: var(--color-bg-secondary, #111827); color: var(--color-text, #e2e8f0);
  border: 1px solid var(--color-border, #1e293b); cursor: pointer;
}
.dv-export-btn:hover { border-color: var(--color-accent, #6366f1); }
.dv-export-btn.dv-export-primary {
  background: var(--color-accent, #6366f1); color: #fff; border-color: transparent;
}
.dv-export-btn.dv-export-primary:hover { background: #4f46e5; }

.dv-inserted-chart { margin: 1rem 0; max-width: 100%; }
.dv-inserted-chart svg { width: 100%; height: auto; }

/* Light theme overrides */
[data-theme="light"] .dv-trigger-btn { background: #4f46e5; }
[data-theme="light"] .dv-csv-input {
  background: #f8fafc; color: #0f172a; border-color: #cbd5e1;
}
[data-theme="light"] .dv-data-table th { background: #f1f5f9; color: #475569; }
[data-theme="light"] .dv-data-table td { color: #0f172a; }
[data-theme="light"] .dv-type-btn { background: #f8fafc; color: #475569; border-color: #cbd5e1; }
[data-theme="light"] .dv-type-btn.dv-type-active { background: rgba(79,70,229,0.1); color: #4f46e5; }
[data-theme="light"] .dv-select { background: #f8fafc; color: #0f172a; border-color: #cbd5e1; }
[data-theme="light"] #dv-chart-area { background: #f8fafc; border-color: #cbd5e1; }
[data-theme="light"] .dv-export-btn { background: #f1f5f9; color: #0f172a; border-color: #cbd5e1; }
[data-theme="light"] .dv-action-btn { background: #f1f5f9; color: #0f172a; border-color: #cbd5e1; }

/* Responsive: stack visualizer panels */
@media (max-width: 900px) {
  .dv-layout { flex-direction: column; }
  .dv-input-panel, .dv-chart-preview { flex: none; width: 100%; }
  #dv-chart-area { min-height: 250px; }
}

/* ══════════════════════════════════════════════════════════════════ */
/* ██  Research Collaboration Notes                               ██ */
/* ══════════════════════════════════════════════════════════════════ */

.cn-toggle-btn {
  display: inline-flex; align-items: center; gap: 0.35rem;
  padding: 0.3rem 0.75rem; border-radius: 6px; border: 1px solid var(--color-border, #1e293b);
  background: var(--color-bg-secondary, #111827); color: var(--color-text, #e2e8f0);
  font-size: 0.8125rem; cursor: pointer; transition: background 0.15s;
}
.cn-toggle-btn:hover { background: var(--color-bg-tertiary, #1e293b); }

.cn-panel {
  position: fixed; top: 0; right: -340px; width: 320px; height: 100vh;
  background: var(--color-bg, #0a0e17); border-left: 1px solid var(--color-border, #1e293b);
  z-index: 200; display: flex; flex-direction: column;
  transition: right 0.25s ease; box-shadow: -4px 0 16px rgba(0,0,0,0.3);
}
.cn-panel-open { right: 0; }

.cn-panel-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.75rem 1rem; border-bottom: 1px solid var(--color-border, #1e293b);
}
.cn-panel-header h3 { margin: 0; font-size: 0.9375rem; color: var(--color-text, #e2e8f0); }
.cn-close-btn {
  background: none; border: none; color: var(--color-text-muted, #8896ab);
  font-size: 1.25rem; cursor: pointer; padding: 0 0.25rem;
}
.cn-close-btn:hover { color: var(--color-text, #e2e8f0); }

.cn-author-bar {
  display: flex; align-items: center; gap: 0.5rem;
  padding: 0.625rem 1rem; border-bottom: 1px solid var(--color-border, #1e293b);
}
.cn-avatar {
  width: 32px; height: 32px; border-radius: 50%; display: flex;
  align-items: center; justify-content: center; font-size: 0.6875rem;
  font-weight: 700; color: #fff; cursor: pointer;
  border: 2px solid transparent; transition: border-color 0.15s;
  flex-shrink: 0;
}
.cn-avatar-selected { border-color: #fff; box-shadow: 0 0 0 2px rgba(99,102,241,0.5); }
.cn-avatar-sm { width: 24px; height: 24px; font-size: 0.5625rem; cursor: default; }
.cn-current-name {
  font-size: 0.75rem; color: var(--color-text-muted, #8896ab);
  margin-left: auto; white-space: nowrap;
}

.cn-filter-bar {
  display: flex; align-items: center; gap: 0.375rem;
  padding: 0.5rem 1rem; border-bottom: 1px solid var(--color-border, #1e293b);
}
.cn-filter-pill {
  padding: 0.2rem 0.625rem; border-radius: 12px; border: 1px solid var(--color-border, #1e293b);
  background: transparent; color: var(--color-text-muted, #8896ab);
  font-size: 0.75rem; cursor: pointer; transition: all 0.15s;
}
.cn-filter-pill:hover { color: var(--color-text, #e2e8f0); }
.cn-filter-active {
  background: var(--color-accent, #6366f1); color: #fff;
  border-color: var(--color-accent, #6366f1);
}
.cn-export-btn {
  margin-left: auto; background: none; border: 1px solid var(--color-border, #1e293b);
  color: var(--color-text-muted, #8896ab); font-size: 0.75rem;
  padding: 0.2rem 0.5rem; border-radius: 4px; cursor: pointer;
}
.cn-export-btn:hover { color: var(--color-text, #e2e8f0); }

.cn-notes-list { flex: 1; overflow-y: auto; padding: 0.5rem; }
.cn-empty {
  text-align: center; padding: 2rem 1rem;
  color: var(--color-text-muted, #8896ab); font-size: 0.8125rem;
}

.cn-note-card {
  background: var(--color-bg-secondary, #111827); border-radius: 8px;
  border-left: 3px solid #6366f1; padding: 0.625rem 0.75rem;
  margin-bottom: 0.5rem; transition: opacity 0.15s;
}
.cn-note-resolved { opacity: 0.5; }
.cn-note-resolved .cn-note-text { text-decoration: line-through; }

.cn-note-header {
  display: flex; align-items: center; gap: 0.375rem; margin-bottom: 0.35rem;
}
.cn-note-author { font-size: 0.75rem; font-weight: 600; color: var(--color-text, #e2e8f0); }
.cn-note-time { font-size: 0.6875rem; color: var(--color-text-muted, #8896ab); margin-left: auto; }

.cn-note-text { font-size: 0.8125rem; color: var(--color-text, #e2e8f0); line-height: 1.45; margin-bottom: 0.35rem; }
.cn-mention { color: #818cf8; font-weight: 600; }
.cn-note-ref { font-size: 0.6875rem; color: var(--color-text-muted, #8896ab); margin-bottom: 0.35rem; }

.cn-note-actions { display: flex; gap: 0.5rem; }
.cn-note-actions button {
  background: none; border: none; font-size: 0.6875rem; cursor: pointer;
  color: var(--color-accent, #6366f1); padding: 0;
}
.cn-note-actions button:hover { text-decoration: underline; }

.cn-replies { padding-left: 1rem; margin-top: 0.375rem; border-left: 1px solid var(--color-border, #1e293b); }
.cn-reply { padding: 0.375rem 0; }

.cn-reply-form { padding: 0.375rem 0 0 1rem; }
.cn-reply-input {
  width: 100%; min-height: 40px; padding: 0.375rem; border-radius: 4px;
  border: 1px solid var(--color-border, #1e293b);
  background: var(--color-bg, #0a0e17); color: var(--color-text, #e2e8f0);
  font-size: 0.75rem; resize: vertical; margin-bottom: 0.25rem;
}
.cn-reply-submit {
  background: var(--color-accent, #6366f1); color: #fff; border: none;
  padding: 0.2rem 0.5rem; border-radius: 4px; font-size: 0.6875rem; cursor: pointer;
}
.cn-reply-submit:hover { background: #4f46e5; }

.cn-add-form {
  padding: 0.75rem 1rem; border-top: 1px solid var(--color-border, #1e293b);
  background: var(--color-bg-secondary, #111827);
}
.cn-add-textarea {
  width: 100%; min-height: 60px; padding: 0.5rem; border-radius: 6px;
  border: 1px solid var(--color-border, #1e293b);
  background: var(--color-bg, #0a0e17); color: var(--color-text, #e2e8f0);
  font-size: 0.8125rem; resize: vertical; margin-bottom: 0.375rem;
}
.cn-add-textarea:focus { border-color: var(--color-accent, #6366f1); outline: none; }
.cn-add-row { display: flex; gap: 0.5rem; align-items: center; }
.cn-finding-select {
  flex: 1; padding: 0.3rem 0.5rem; border-radius: 4px;
  border: 1px solid var(--color-border, #1e293b);
  background: var(--color-bg, #0a0e17); color: var(--color-text, #e2e8f0);
  font-size: 0.75rem;
}
.cn-submit-btn {
  background: var(--color-accent, #6366f1); color: #fff; border: none;
  padding: 0.375rem 0.75rem; border-radius: 6px; font-size: 0.8125rem;
  cursor: pointer; font-weight: 600; white-space: nowrap;
}
.cn-submit-btn:hover { background: #4f46e5; }

.cn-mention-dropdown {
  position: fixed; background: var(--color-bg-secondary, #111827);
  border: 1px solid var(--color-border, #1e293b); border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.4); z-index: 300;
  min-width: 160px; overflow: hidden;
}
.cn-mention-item {
  padding: 0.4rem 0.75rem; font-size: 0.8125rem;
  color: var(--color-text, #e2e8f0); cursor: pointer;
}
.cn-mention-item:hover { background: var(--color-accent, #6366f1); color: #fff; }

.cn-finding-badge {
  position: absolute; top: -4px; right: -4px;
  background: var(--color-accent, #6366f1); color: #fff;
  font-size: 0.625rem; font-weight: 700; min-width: 18px; height: 18px;
  border-radius: 9px; display: flex; align-items: center; justify-content: center;
  padding: 0 4px; box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

/* Light theme overrides */
[data-theme="light"] .cn-toggle-btn { background: #f1f5f9; color: #0f172a; border-color: #cbd5e1; }
[data-theme="light"] .cn-panel { background: #ffffff; border-left-color: #e2e8f0; box-shadow: -4px 0 16px rgba(0,0,0,0.08); }
[data-theme="light"] .cn-panel-header { border-bottom-color: #e2e8f0; }
[data-theme="light"] .cn-panel-header h3 { color: #0f172a; }
[data-theme="light"] .cn-note-card { background: #f8fafc; }
[data-theme="light"] .cn-note-author { color: #0f172a; }
[data-theme="light"] .cn-note-text { color: #1e293b; }
[data-theme="light"] .cn-add-textarea,
[data-theme="light"] .cn-reply-input { background: #f8fafc; color: #0f172a; border-color: #cbd5e1; }
[data-theme="light"] .cn-finding-select { background: #f8fafc; color: #0f172a; border-color: #cbd5e1; }
[data-theme="light"] .cn-mention-dropdown { background: #ffffff; border-color: #e2e8f0; }
[data-theme="light"] .cn-mention-item { color: #0f172a; }

/* Responsive: full-width panel on mobile */
@media (max-width: 768px) {
  .cn-panel { width: 100%; right: -100%; }
  .cn-panel-open { right: 0; }
}

/* ══════════════════════════════════════════════════════════════════════
   Research Keyword Extractor
   ══════════════════════════════════════════════════════════════════════ */

.ke-trigger-btn {
  display: inline-flex; align-items: center; gap: 0.375rem;
  padding: 0.375rem 0.875rem; border-radius: 100px;
  font-size: 0.75rem; font-weight: 600; cursor: pointer;
  color: var(--color-text-dim, #5a6a80);
  background: transparent; border: 1px solid var(--color-border, #1e293b);
  transition: all 0.2s;
}
.ke-trigger-btn:hover {
  color: var(--color-primary, #3b82f6);
  border-color: rgba(59, 130, 246, 0.4);
  background: rgba(59, 130, 246, 0.08);
}

.ke-input-section { margin-bottom: 1rem; }

.ke-textarea {
  width: 100%; min-height: 120px; padding: 0.75rem;
  background: var(--color-bg, #0a0e17);
  color: var(--color-text, #e2e8f0);
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px; font-size: 0.8125rem;
  line-height: 1.6; resize: vertical; font-family: inherit;
}
.ke-textarea:focus {
  outline: none; border-color: var(--color-primary, #3b82f6);
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.15);
}

.ke-controls {
  display: flex; align-items: center; gap: 1.25rem;
  margin-top: 0.75rem; flex-wrap: wrap;
}
.ke-control-label {
  display: flex; align-items: center; gap: 0.5rem;
  font-size: 0.75rem; color: var(--color-text-muted, #8896ab);
}
.ke-control-label span { font-weight: 600; min-width: 1.25rem; text-align: center; }

.ke-slider {
  width: 90px; height: 4px; -webkit-appearance: none; appearance: none;
  background: var(--color-border, #1e293b); border-radius: 2px; cursor: pointer;
}
.ke-slider::-webkit-slider-thumb {
  -webkit-appearance: none; width: 14px; height: 14px;
  background: var(--color-primary, #3b82f6); border-radius: 50%; cursor: pointer;
}

.ke-extract-btn {
  padding: 0.375rem 1rem; border-radius: 6px;
  background: var(--color-primary, #3b82f6); color: #fff;
  border: none; font-size: 0.75rem; font-weight: 600;
  cursor: pointer; transition: background 0.2s; margin-left: auto;
}
.ke-extract-btn:hover { background: #2563eb; }

/* Tabs */
.ke-tabs {
  display: flex; gap: 0; border-bottom: 1px solid var(--color-border, #1e293b);
  margin-bottom: 1rem;
}
.ke-tab {
  padding: 0.5rem 1rem; font-size: 0.75rem; font-weight: 600;
  color: var(--color-text-dim, #5a6a80); background: transparent;
  border: none; border-bottom: 2px solid transparent;
  cursor: pointer; transition: all 0.2s;
}
.ke-tab:hover { color: var(--color-text, #e2e8f0); }
.ke-tab-active {
  color: var(--color-primary, #3b82f6);
  border-bottom-color: var(--color-primary, #3b82f6);
}

/* Results area */
.ke-results { min-height: 180px; }
.ke-placeholder {
  text-align: center; padding: 2rem;
  color: var(--color-text-dim, #5a6a80); font-size: 0.8125rem;
}

/* Tag Cloud */
.ke-cloud {
  display: flex; flex-wrap: wrap; gap: 0.5rem;
  align-items: center; justify-content: center;
  padding: 1rem; min-height: 120px;
}
.ke-tag {
  display: inline-block; padding: 0.25rem 0.625rem;
  border-radius: 100px; cursor: pointer;
  color: var(--color-primary, #3b82f6);
  background: rgba(59, 130, 246, 0.08);
  border: 1px solid rgba(59, 130, 246, 0.15);
  transition: all 0.2s; white-space: nowrap;
}
.ke-tag:hover {
  background: rgba(59, 130, 246, 0.18);
  border-color: rgba(59, 130, 246, 0.4);
}
.ke-tag-selected {
  background: rgba(59, 130, 246, 0.25);
  border-color: var(--color-primary, #3b82f6);
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

/* Keyword Table */
.ke-table {
  width: 100%; border-collapse: collapse; font-size: 0.8125rem;
}
.ke-table th {
  text-align: left; padding: 0.5rem 0.75rem;
  font-size: 0.6875rem; text-transform: uppercase;
  color: var(--color-text-dim, #5a6a80);
  border-bottom: 1px solid var(--color-border, #1e293b);
  letter-spacing: 0.03em;
}
.ke-th-sortable { cursor: pointer; user-select: none; }
.ke-th-sortable:hover { color: var(--color-primary, #3b82f6); }

.ke-table td {
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid rgba(30, 41, 59, 0.5);
  color: var(--color-text, #e2e8f0);
}
.ke-table tr { cursor: pointer; transition: background 0.15s; }
.ke-table tbody tr:hover { background: rgba(59, 130, 246, 0.05); }
.ke-row-selected { background: rgba(59, 130, 246, 0.1) !important; }

.ke-bigram-badge {
  font-size: 0.5625rem; padding: 0.1rem 0.375rem;
  background: rgba(139, 92, 246, 0.15); color: #a78bfa;
  border-radius: 100px; font-weight: 600; vertical-align: middle;
}

.ke-relevance-bar {
  width: 100%; height: 6px; background: var(--color-border, #1e293b);
  border-radius: 3px; overflow: hidden;
}
.ke-relevance-fill {
  height: 100%; background: var(--color-primary, #3b82f6);
  border-radius: 3px; transition: width 0.3s;
}

/* Export */
.ke-export-section { padding: 0.5rem 0; }
.ke-export-info {
  font-size: 0.75rem; color: var(--color-text-muted, #8896ab);
  margin-bottom: 0.75rem;
}
.ke-export-row {
  display: flex; gap: 0.625rem; flex-wrap: wrap; margin-bottom: 1rem;
}
.ke-copy-btn {
  padding: 0.4rem 0.875rem; border-radius: 6px;
  font-size: 0.75rem; font-weight: 600; cursor: pointer;
  background: var(--color-bg-secondary, #111827);
  color: var(--color-text, #e2e8f0);
  border: 1px solid var(--color-border, #1e293b);
  transition: all 0.2s;
}
.ke-copy-btn:hover {
  border-color: var(--color-primary, #3b82f6);
  color: var(--color-primary, #3b82f6);
}
.ke-preview {
  padding: 0.75rem; background: var(--color-bg, #0a0e17);
  border: 1px solid var(--color-border, #1e293b);
  border-radius: 6px; font-size: 0.75rem;
  color: var(--color-text-muted, #8896ab);
  white-space: pre-wrap; word-break: break-word;
  max-height: 120px; overflow-y: auto;
}

/* Light theme overrides */
[data-theme="light"] .ke-trigger-btn { background: #f1f5f9; color: #475569; border-color: #cbd5e1; }
[data-theme="light"] .ke-trigger-btn:hover { background: #eff6ff; color: #2563eb; border-color: #93c5fd; }
[data-theme="light"] .ke-textarea { background: #f8fafc; color: #0f172a; border-color: #cbd5e1; }
[data-theme="light"] .ke-tag { color: #2563eb; background: rgba(59, 130, 246, 0.08); border-color: rgba(59, 130, 246, 0.2); }
[data-theme="light"] .ke-tag-selected { background: rgba(59, 130, 246, 0.18); }
[data-theme="light"] .ke-table td { color: #1e293b; }
[data-theme="light"] .ke-copy-btn { background: #f8fafc; color: #1e293b; border-color: #cbd5e1; }
[data-theme="light"] .ke-preview { background: #f8fafc; color: #475569; border-color: #e2e8f0; }
[data-theme="light"] .ke-slider { background: #cbd5e1; }

/* Responsive */
@media (max-width: 768px) {
  .ke-controls { flex-direction: column; align-items: flex-start; gap: 0.75rem; }
  .ke-extract-btn { margin-left: 0; width: 100%; }
  .ke-export-row { flex-direction: column; }
  .ke-copy-btn { width: 100%; text-align: center; }
  .ke-cloud { padding: 0.5rem; }
  .ke-table { font-size: 0.75rem; }
  .ke-table th, .ke-table td { padding: 0.375rem 0.5rem; }
}

/* ── Research Progress Tracker ────────────────────────────── */
.rpt-trigger-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.5rem 1rem;
  background: var(--color-primary, #6366f1);
  color: #fff;
  border: none;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, box-shadow 0.2s;
}
.rpt-trigger-btn:hover {
  background: #4f46e5;
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.4);
}

.rpt-panel {
  position: fixed;
  top: 4rem;
  right: 1.5rem;
  width: 360px;
  max-height: calc(100vh - 6rem);
  overflow-y: auto;
  background: #1e1e2e;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 0.75rem;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
  padding: 1.25rem;
  z-index: var(--z-toast);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-10px);
  transition: opacity 0.25s, transform 0.25s;
}
.rpt-panel-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.rpt-panel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
}
.rpt-panel-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  color: #e2e8f0;
}
.rpt-close-btn {
  background: none;
  border: none;
  color: #94a3b8;
  font-size: 1.25rem;
  cursor: pointer;
  padding: 0.25rem;
  line-height: 1;
  border-radius: 0.25rem;
  transition: color 0.15s;
}
.rpt-close-btn:hover { color: #e2e8f0; }

.rpt-progress-bar {
  width: 100%;
  height: 8px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 0.5rem;
}
.rpt-progress-fill {
  height: 100%;
  background: var(--color-primary, #6366f1);
  border-radius: 4px;
  transition: width 0.4s ease;
}

.rpt-overall-text {
  font-size: 0.75rem;
  color: #94a3b8;
  margin-bottom: 1rem;
  text-align: center;
}

.rpt-milestones {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.rpt-milestone {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 0.75rem;
  border-radius: 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.06);
  transition: background 0.15s, border-color 0.15s;
}
.rpt-milestone:hover {
  background: rgba(255, 255, 255, 0.04);
}

.rpt-milestone-icon {
  font-size: 1.125rem;
  flex-shrink: 0;
}
.rpt-milestone-label {
  flex: 1;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #e2e8f0;
}
.rpt-milestone-status {
  font-size: 0.6875rem;
  font-weight: 600;
  padding: 0.2rem 0.5rem;
  border-radius: 1rem;
  cursor: pointer;
  user-select: none;
  text-transform: capitalize;
  transition: background 0.15s, color 0.15s;
}

.rpt-status-not-started .rpt-milestone-status {
  background: rgba(148, 163, 184, 0.15);
  color: #94a3b8;
}
.rpt-status-in-progress .rpt-milestone-status {
  background: rgba(251, 191, 36, 0.15);
  color: #fbbf24;
}
.rpt-status-completed .rpt-milestone-status {
  background: rgba(34, 197, 94, 0.15);
  color: #22c55e;
}

.rpt-status-completed {
  border-color: rgba(34, 197, 94, 0.2);
}
.rpt-status-in-progress {
  border-color: rgba(251, 191, 36, 0.2);
}

.rpt-note-btn {
  background: none;
  border: none;
  font-size: 0.8125rem;
  cursor: pointer;
  padding: 0.125rem;
  opacity: 0.5;
  transition: opacity 0.15s;
}
.rpt-note-btn:hover { opacity: 1; }

.rpt-note {
  width: 100%;
  font-size: 0.6875rem;
  color: #94a3b8;
  font-style: italic;
  padding-left: 1.75rem;
  margin-top: 0.125rem;
}

/* Light theme overrides */
[data-theme="light"] .rpt-panel {
  background: #ffffff;
  border-color: #e2e8f0;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}
[data-theme="light"] .rpt-panel-title { color: #1e293b; }
[data-theme="light"] .rpt-close-btn { color: #64748b; }
[data-theme="light"] .rpt-close-btn:hover { color: #1e293b; }
[data-theme="light"] .rpt-progress-bar { background: #e2e8f0; }
[data-theme="light"] .rpt-overall-text { color: #64748b; }
[data-theme="light"] .rpt-milestone-label { color: #1e293b; }
[data-theme="light"] .rpt-milestone { border-color: #e2e8f0; }
[data-theme="light"] .rpt-milestone:hover { background: #f8fafc; }
[data-theme="light"] .rpt-note { color: #64748b; }
[data-theme="light"] .rpt-status-not-started .rpt-milestone-status {
  background: rgba(100, 116, 139, 0.1);
  color: #64748b;
}

/* Responsive */
@media (max-width: 640px) {
  .rpt-panel {
    right: 0.5rem;
    left: 0.5rem;
    width: auto;
    top: 3rem;
    max-height: calc(100vh - 4rem);
  }
  .rpt-trigger-btn {
    padding: 0.375rem 0.75rem;
    font-size: 0.8125rem;
  }
}

/* ── Research Annotation Layer ────────────────────────────── */
.ann-toggle-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0.375rem 0.875rem;
  background: rgba(255, 255, 255, 0.06);
  color: #e2e8f0;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 6px;
  font-size: 0.8125rem;
  cursor: pointer;
  transition: all 0.2s ease;
  position: relative;
}
.ann-toggle-btn:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
}
.ann-toggle-active {
  background: var(--color-primary, #6366f1);
  border-color: var(--color-primary, #6366f1);
  color: #fff;
  box-shadow: 0 0 12px rgba(99, 102, 241, 0.4);
}
.ann-toggle-active:hover {
  background: var(--color-primary, #6366f1);
  filter: brightness(1.1);
}

.ann-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  background: #ef4444;
  color: #fff;
  border-radius: 9px;
  font-size: 0.6875rem;
  font-weight: 600;
  line-height: 1;
  margin-left: 4px;
}

.ann-highlight {
  cursor: pointer;
  border-radius: 2px;
  padding: 0 1px;
  transition: filter 0.15s ease;
}
.ann-highlight:hover {
  filter: brightness(1.3);
}

.ann-category-popup {
  position: absolute;
  z-index: var(--z-tooltip);
  background: #1e1e2e;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  padding: 10px;
  min-width: 180px;
  max-width: 280px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
  animation: annPopupIn 0.15s ease-out;
}
@keyframes annPopupIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.ann-cat-option {
  display: block;
  width: 100%;
  padding: 6px 10px;
  margin-bottom: 3px;
  background: rgba(255, 255, 255, 0.04);
  color: #e2e8f0;
  border: none;
  border-left: 3px solid #94a3b8;
  border-radius: 4px;
  font-size: 0.8125rem;
  cursor: pointer;
  text-align: left;
  transition: background 0.15s ease;
}
.ann-cat-option:hover {
  background: rgba(255, 255, 255, 0.1);
}
.ann-cat-option:last-of-type {
  margin-bottom: 0;
}

/* Sidebar */
.ann-sidebar {
  position: fixed;
  top: 0;
  right: 0;
  width: 340px;
  height: 100vh;
  background: #1a1a2e;
  border-left: 1px solid rgba(255, 255, 255, 0.08);
  z-index: var(--z-popover);
  transform: translateX(100%);
  transition: transform 0.25s ease;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.ann-sidebar-open {
  transform: translateX(0);
  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.4);
}

.ann-sidebar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  color: #e2e8f0;
}
.ann-sidebar-close {
  background: none;
  border: none;
  color: #94a3b8;
  font-size: 1.25rem;
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 4px;
}
.ann-sidebar-close:hover {
  color: #e2e8f0;
  background: rgba(255, 255, 255, 0.08);
}

.ann-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 10px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.ann-filter-pill {
  padding: 3px 10px;
  background: rgba(255, 255, 255, 0.05);
  color: #94a3b8;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  font-size: 0.75rem;
  cursor: pointer;
  transition: all 0.15s ease;
}
.ann-filter-pill:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #e2e8f0;
}
.ann-filter-active {
  background: var(--pill-color, var(--color-primary, #6366f1));
  color: #fff;
  border-color: transparent;
}

.ann-export-row {
  display: flex;
  gap: 6px;
  padding: 8px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.ann-export-btn {
  flex: 1;
  padding: 5px 10px;
  background: rgba(255, 255, 255, 0.05);
  color: #94a3b8;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 5px;
  font-size: 0.75rem;
  cursor: pointer;
  transition: all 0.15s ease;
}
.ann-export-btn:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #e2e8f0;
}

.ann-empty {
  padding: 24px 16px;
  text-align: center;
  color: #64748b;
  font-size: 0.8125rem;
}

.ann-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  cursor: pointer;
  transition: background 0.15s ease;
}
.ann-item:hover {
  background: rgba(255, 255, 255, 0.03);
}

.ann-item-category {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-top: 5px;
}

.ann-item-body {
  flex: 1;
  min-width: 0;
}
.ann-item-text {
  font-size: 0.8125rem;
  color: #e2e8f0;
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.ann-item-note {
  font-size: 0.75rem;
  color: #94a3b8;
  font-style: italic;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ann-item-meta {
  font-size: 0.6875rem;
  color: #64748b;
  margin-top: 3px;
}

.ann-item-actions {
  display: flex;
  gap: 2px;
  flex-shrink: 0;
  opacity: 0;
  transition: opacity 0.15s ease;
}
.ann-item:hover .ann-item-actions {
  opacity: 1;
}
.ann-item-edit,
.ann-item-delete {
  background: none;
  border: none;
  color: #64748b;
  font-size: 0.875rem;
  cursor: pointer;
  padding: 2px 5px;
  border-radius: 3px;
}
.ann-item-edit:hover {
  color: #3b82f6;
  background: rgba(59, 130, 246, 0.1);
}
.ann-item-delete:hover {
  color: #ef4444;
  background: rgba(239, 68, 68, 0.1);
}

/* Light theme overrides */
[data-theme="light"] .ann-toggle-btn {
  background: rgba(0, 0, 0, 0.04);
  color: #334155;
  border-color: rgba(0, 0, 0, 0.1);
}
[data-theme="light"] .ann-toggle-btn:hover {
  background: rgba(0, 0, 0, 0.08);
}
[data-theme="light"] .ann-category-popup {
  background: #ffffff;
  border-color: rgba(0, 0, 0, 0.1);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}
[data-theme="light"] .ann-cat-option {
  background: rgba(0, 0, 0, 0.02);
  color: #334155;
}
[data-theme="light"] .ann-cat-option:hover {
  background: rgba(0, 0, 0, 0.06);
}
[data-theme="light"] .ann-sidebar {
  background: #ffffff;
  border-left-color: rgba(0, 0, 0, 0.08);
}
[data-theme="light"] .ann-sidebar-open {
  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.1);
}
[data-theme="light"] .ann-sidebar-header {
  color: #1e293b;
  border-bottom-color: rgba(0, 0, 0, 0.06);
}
[data-theme="light"] .ann-sidebar-close {
  color: #64748b;
}
[data-theme="light"] .ann-item-text {
  color: #1e293b;
}
[data-theme="light"] .ann-filter-pill {
  background: rgba(0, 0, 0, 0.04);
  color: #64748b;
  border-color: rgba(0, 0, 0, 0.08);
}
[data-theme="light"] .ann-export-btn {
  background: rgba(0, 0, 0, 0.03);
  color: #64748b;
  border-color: rgba(0, 0, 0, 0.1);
}

/* Responsive */
@media (max-width: 640px) {
  .ann-sidebar {
    width: 100%;
  }
  .ann-category-popup {
    left: 1rem !important;
    right: 1rem;
    max-width: none;
  }
  .ann-toggle-btn {
    padding: 0.375rem 0.625rem;
    font-size: 0.75rem;
  }
  .ann-toggle-btn svg {
    display: none;
  }
}

/* ══════════════════════════════════════════════════════════════════
   ██  Research Timeline Visualizer                               ██
   ══════════════════════════════════════════════════════════════════ */

.tl-trigger-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.5rem 1rem;
  background: rgba(99, 102, 241, 0.12);
  color: var(--color-primary, #6366f1);
  border: 1px solid rgba(99, 102, 241, 0.25);
  border-radius: 0.5rem;
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
  margin: 0.5rem 0;
}
.tl-trigger-btn:hover {
  background: rgba(99, 102, 241, 0.22);
  border-color: rgba(99, 102, 241, 0.45);
}

.tl-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-overlay);
  background: rgba(10, 10, 20, 0.92);
  backdrop-filter: blur(8px);
  display: flex;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s, visibility 0.25s;
}
.tl-overlay-open {
  opacity: 1;
  visibility: visible;
}

.tl-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1.25rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  flex-shrink: 0;
}
.tl-title {
  font-size: 1rem;
  font-weight: 700;
  color: #e2e8f0;
}
.tl-controls {
  display: flex;
  align-items: center;
  gap: 0.375rem;
}

.tl-zoom-btn {
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.06);
  color: #cbd5e1;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 0.375rem;
  font-size: 1rem;
  cursor: pointer;
  transition: background 0.15s;
}
.tl-zoom-btn:hover {
  background: rgba(255, 255, 255, 0.12);
}
.tl-close-btn {
  font-size: 1.25rem;
  margin-left: 0.5rem;
}

.tl-add-btn {
  padding: 0.375rem 0.75rem;
  background: rgba(34, 197, 94, 0.15);
  color: #22c55e;
  border: 1px solid rgba(34, 197, 94, 0.3);
  border-radius: 0.375rem;
  font-size: 0.75rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
}
.tl-add-btn:hover {
  background: rgba(34, 197, 94, 0.25);
}

.tl-export-btn {
  padding: 0.375rem 0.75rem;
  background: rgba(99, 102, 241, 0.12);
  color: var(--color-primary, #6366f1);
  border: 1px solid rgba(99, 102, 241, 0.25);
  border-radius: 0.375rem;
  font-size: 0.75rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
}
.tl-export-btn:hover {
  background: rgba(99, 102, 241, 0.22);
}

.tl-canvas {
  flex: 1;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 1rem;
  display: flex;
  align-items: center;
}
.tl-canvas svg {
  display: block;
}

.tl-event-marker {
  transition: transform 0.15s;
}
.tl-event-marker:hover circle {
  filter: brightness(1.3);
}
.tl-event-label {
  pointer-events: none;
  user-select: none;
}

.tl-today-line {
  pointer-events: none;
}

.tl-tooltip {
  position: absolute;
  z-index: var(--z-overlay);
  background: #1e293b;
  color: #e2e8f0;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  font-size: 0.75rem;
  line-height: 1.4;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
  pointer-events: none;
  white-space: nowrap;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.tl-form {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #1e1e2e;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 0.75rem;
  padding: 1.25rem;
  width: 320px;
  z-index: var(--z-overlay);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
}
.tl-form-title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #e2e8f0;
  margin-bottom: 0.75rem;
}
.tl-form-input {
  display: block;
  width: 100%;
  padding: 0.5rem 0.625rem;
  background: rgba(255, 255, 255, 0.05);
  color: #e2e8f0;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 0.375rem;
  font-size: 0.8125rem;
  margin-bottom: 0.5rem;
  box-sizing: border-box;
}
.tl-form-input:focus {
  outline: none;
  border-color: var(--color-primary, #6366f1);
  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2);
}

.tl-type-selector {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}
.tl-type-option {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.75rem;
  color: #cbd5e1;
  cursor: pointer;
}
.tl-type-option input[type="radio"] {
  display: none;
}
.tl-type-option input[type="radio"]:checked + .tl-type-dot {
  box-shadow: 0 0 0 2px #1e1e2e, 0 0 0 4px currentColor;
}
.tl-type-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  display: inline-block;
  transition: box-shadow 0.15s;
}

.tl-form-actions {
  display: flex;
  gap: 0.5rem;
}
.tl-form-save {
  flex: 1;
  padding: 0.5rem;
  background: var(--color-primary, #6366f1);
  color: #fff;
  border: none;
  border-radius: 0.375rem;
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.15s;
}
.tl-form-save:hover {
  opacity: 0.85;
}
.tl-form-cancel {
  flex: 1;
  padding: 0.5rem;
  background: rgba(255, 255, 255, 0.06);
  color: #94a3b8;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 0.375rem;
  font-size: 0.8125rem;
  cursor: pointer;
  transition: background 0.15s;
}
.tl-form-cancel:hover {
  background: rgba(255, 255, 255, 0.1);
}
.tl-form-delete {
  padding: 0.5rem 0.75rem;
  background: rgba(239, 68, 68, 0.15);
  color: #ef4444;
  border: 1px solid rgba(239, 68, 68, 0.3);
  border-radius: 0.375rem;
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
}
.tl-form-delete:hover {
  background: rgba(239, 68, 68, 0.25);
}

/* Light theme overrides */
[data-theme="light"] .tl-overlay {
  background: rgba(240, 242, 245, 0.95);
}
[data-theme="light"] .tl-header {
  border-bottom-color: rgba(0, 0, 0, 0.08);
}
[data-theme="light"] .tl-title {
  color: #1e293b;
}
[data-theme="light"] .tl-zoom-btn {
  background: rgba(0, 0, 0, 0.04);
  color: #475569;
  border-color: rgba(0, 0, 0, 0.1);
}
[data-theme="light"] .tl-tooltip {
  background: #fff;
  color: #1e293b;
  border-color: rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}
[data-theme="light"] .tl-form {
  background: #fff;
  border-color: rgba(0, 0, 0, 0.1);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
}
[data-theme="light"] .tl-form-title {
  color: #1e293b;
}
[data-theme="light"] .tl-form-input {
  background: rgba(0, 0, 0, 0.03);
  color: #1e293b;
  border-color: rgba(0, 0, 0, 0.12);
}
[data-theme="light"] .tl-event-label {
  fill: #334155;
}
[data-theme="light"] .tl-type-option {
  color: #475569;
}
[data-theme="light"] .tl-form-cancel {
  background: rgba(0, 0, 0, 0.04);
  color: #64748b;
  border-color: rgba(0, 0, 0, 0.1);
}
[data-theme="light"] .tl-export-btn {
  background: rgba(0, 0, 0, 0.03);
  color: #6366f1;
  border-color: rgba(99, 102, 241, 0.2);
}

/* Responsive */
@media (max-width: 640px) {
  .tl-header {
    flex-wrap: wrap;
    gap: 0.5rem;
  }
  .tl-controls {
    flex-wrap: wrap;
  }
  .tl-form {
    width: calc(100% - 2rem);
    left: 1rem;
    right: 1rem;
    transform: translate(0, -50%);
  }
  .tl-trigger-btn {
    font-size: 0.75rem;
    padding: 0.375rem 0.75rem;
  }
  .tl-trigger-btn svg {
    display: none;
  }
}

/* ── Research Gap Analyzer ─────────────────────────────────── */

.ga-trigger-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.5rem 1rem;
  background: var(--color-primary, #6366f1);
  color: #fff;
  border: none;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, box-shadow 0.2s;
}
.ga-trigger-btn:hover {
  background: #4f46e5;
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.4);
}

.ga-panel {
  position: fixed;
  top: 0;
  right: -420px;
  width: 400px;
  height: 100vh;
  background: #1e1e2e;
  border-left: 1px solid #2e2e3e;
  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.4);
  z-index: var(--z-tooltip);
  display: flex;
  flex-direction: column;
  transition: right 0.3s ease;
  overflow: hidden;
}
.ga-panel-open {
  right: 0;
}

.ga-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid #2e2e3e;
  flex-shrink: 0;
}
.ga-header h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  color: #e0e0e0;
}
.ga-close-btn {
  background: none;
  border: none;
  color: #888;
  font-size: 1.25rem;
  cursor: pointer;
  padding: 0.25rem;
  line-height: 1;
}
.ga-close-btn:hover {
  color: #fff;
}

.ga-body {
  flex: 1;
  overflow-y: auto;
  padding: 1.25rem;
}
.ga-desc {
  color: #999;
  font-size: 0.8125rem;
  margin: 0 0 1rem 0;
  line-height: 1.5;
}

.ga-analyze-btn {
  display: block;
  width: 100%;
  padding: 0.625rem;
  background: var(--color-primary, #6366f1);
  color: #fff;
  border: none;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  margin-bottom: 1rem;
  transition: background 0.2s;
}
.ga-analyze-btn:hover {
  background: #4f46e5;
}

.ga-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  margin-bottom: 1rem;
}
.ga-filter-pill {
  padding: 0.25rem 0.625rem;
  border-radius: 999px;
  border: 1px solid #3e3e4e;
  background: transparent;
  color: #bbb;
  font-size: 0.75rem;
  cursor: pointer;
  transition: all 0.15s;
}
.ga-filter-pill:hover {
  border-color: var(--pill-color, #6366f1);
  color: #fff;
}
.ga-filter-active {
  background: var(--pill-color, #6366f1);
  border-color: var(--pill-color, #6366f1);
  color: #fff;
}

.ga-gap-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.ga-empty {
  color: #777;
  font-size: 0.8125rem;
  text-align: center;
  padding: 2rem 0;
}

.ga-gap-card {
  background: #262637;
  border-radius: 0.5rem;
  border-left: 3px solid #6366f1;
  padding: 0.875rem 1rem;
  transition: box-shadow 0.2s;
}
.ga-gap-card:hover {
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
}

.ga-gap-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.375rem;
}
.ga-gap-icon {
  font-size: 1rem;
  flex-shrink: 0;
}
.ga-gap-title {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #e0e0e0;
  flex: 1;
}
.ga-gap-desc {
  color: #999;
  font-size: 0.75rem;
  line-height: 1.5;
  margin: 0 0 0.5rem 0;
}

.ga-gap-confidence {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  padding: 0.125rem 0.5rem;
  border-radius: 999px;
  flex-shrink: 0;
}
.ga-conf-low {
  background: rgba(107, 114, 128, 0.2);
  color: #9ca3af;
}
.ga-conf-medium {
  background: rgba(245, 158, 11, 0.15);
  color: #f59e0b;
}
.ga-conf-high {
  background: rgba(239, 68, 68, 0.15);
  color: #ef4444;
}

.ga-gap-findings {
  margin-top: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid #2e2e3e;
  font-size: 0.75rem;
  color: #888;
}
.ga-gap-findings strong {
  color: #aaa;
}
.ga-gap-findings ul {
  margin: 0.25rem 0 0 1rem;
  padding: 0;
}
.ga-gap-findings li {
  margin-bottom: 0.125rem;
}

.ga-actions {
  display: flex;
  gap: 0.5rem;
  margin-top: 1.25rem;
  flex-wrap: wrap;
}
.ga-report-btn,
.ga-export-btn {
  flex: 1;
  min-width: 100px;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  border: 1px solid #3e3e4e;
  background: transparent;
  color: #ccc;
  font-size: 0.75rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s;
}
.ga-report-btn {
  background: var(--color-primary, #6366f1);
  border-color: var(--color-primary, #6366f1);
  color: #fff;
}
.ga-report-btn:hover {
  background: #4f46e5;
}
.ga-export-btn:hover {
  border-color: #6366f1;
  color: #fff;
}

.ga-report-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: var(--z-max);
  display: flex;
  align-items: center;
  justify-content: center;
}
.ga-report-modal {
  background: #1e1e2e;
  border-radius: 0.75rem;
  border: 1px solid #2e2e3e;
  width: 90%;
  max-width: 640px;
  max-height: 80vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
}
.ga-report-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid #2e2e3e;
}
.ga-report-header h3 {
  margin: 0;
  font-size: 0.9375rem;
  color: #e0e0e0;
}
.ga-report-close {
  background: none;
  border: none;
  color: #888;
  font-size: 1.25rem;
  cursor: pointer;
}
.ga-report-content {
  flex: 1;
  overflow-y: auto;
  padding: 1.25rem;
  font-size: 0.75rem;
  color: #ccc;
  line-height: 1.6;
  white-space: pre-wrap;
  margin: 0;
}
.ga-report-actions {
  padding: 0.75rem 1.25rem;
  border-top: 1px solid #2e2e3e;
  display: flex;
  justify-content: flex-end;
}

/* Light theme overrides */
[data-theme="light"] .ga-panel {
  background: #ffffff;
  border-left-color: #e2e8f0;
}
[data-theme="light"] .ga-header {
  border-bottom-color: #e2e8f0;
}
[data-theme="light"] .ga-header h3 {
  color: #1e293b;
}
[data-theme="light"] .ga-gap-card {
  background: #f8fafc;
}
[data-theme="light"] .ga-gap-title {
  color: #1e293b;
}
[data-theme="light"] .ga-gap-desc {
  color: #64748b;
}
[data-theme="light"] .ga-gap-findings {
  border-top-color: #e2e8f0;
  color: #64748b;
}
[data-theme="light"] .ga-filter-pill {
  border-color: #d1d5db;
  color: #4b5563;
}
[data-theme="light"] .ga-desc {
  color: #64748b;
}
[data-theme="light"] .ga-report-modal {
  background: #fff;
  border-color: #e2e8f0;
}
[data-theme="light"] .ga-report-content {
  color: #334155;
}

/* Responsive */
@media (max-width: 640px) {
  .ga-panel {
    width: 100%;
    right: -100%;
  }
  .ga-trigger-btn {
    font-size: 0.75rem;
    padding: 0.375rem 0.75rem;
  }
  .ga-trigger-btn svg {
    display: none;
  }
  .ga-report-modal {
    width: 95%;
    max-height: 90vh;
  }
}

/* ══════════════════════════════════════════════════════════════════
   ██  Method Comparison                                          ██
   ══════════════════════════════════════════════════════════════════ */

.mc-trigger-btn {
  position: fixed;
  bottom: 140px;
  right: 24px;
  z-index: var(--z-toast);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0.5rem 1rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #fff;
  background: var(--color-primary, #6366f1);
  border: none;
  border-radius: 8px;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(99, 102, 241, 0.35);
  transition: background 0.2s, transform 0.15s;
}
.mc-trigger-btn:hover {
  background: #4f46e5;
  transform: translateY(-1px);
}

.mc-panel {
  position: fixed;
  top: 0;
  right: -540px;
  width: 520px;
  height: 100vh;
  z-index: var(--z-sidebar);
  background: #1e1e2e;
  border-left: 1px solid #2e2e3e;
  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.4);
  display: flex;
  flex-direction: column;
  transition: right 0.3s ease;
  overflow: hidden;
}
.mc-panel-open {
  right: 0;
}

.mc-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid #2e2e3e;
  flex-shrink: 0;
}
.mc-title {
  font-size: 1rem;
  font-weight: 700;
  color: #e2e8f0;
  margin: 0;
}
.mc-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.mc-add-btn {
  padding: 0.35rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: #fff;
  background: var(--color-primary, #6366f1);
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.2s;
}
.mc-add-btn:hover {
  background: #4f46e5;
}

.mc-close-btn {
  background: none;
  border: none;
  color: #94a3b8;
  font-size: 1.25rem;
  cursor: pointer;
  line-height: 1;
  padding: 4px;
}
.mc-close-btn:hover {
  color: #e2e8f0;
}

.mc-cancel-btn {
  padding: 0.35rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: #cbd5e1;
  background: #334155;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.2s;
}
.mc-cancel-btn:hover {
  background: #475569;
}

.mc-form {
  padding: 14px 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  border-bottom: 1px solid #2e2e3e;
  background: #1a1a2a;
  flex-shrink: 0;
}
.mc-form-actions {
  display: flex;
  gap: 8px;
  margin-top: 4px;
}

.mc-form-input,
.mc-form-select {
  width: 100%;
  padding: 0.4rem 0.6rem;
  font-size: 0.8125rem;
  color: #e2e8f0;
  background: #0f0f1a;
  border: 1px solid #334155;
  border-radius: 6px;
  outline: none;
  box-sizing: border-box;
}
.mc-form-input:focus,
.mc-form-select:focus {
  border-color: var(--color-primary, #6366f1);
}

.mc-matrix-wrap {
  flex: 1;
  overflow: auto;
  padding: 14px 18px;
}

.mc-empty {
  color: #94a3b8;
  font-size: 0.8125rem;
  text-align: center;
  margin-top: 40px;
}

.mc-matrix-scroll {
  overflow-x: auto;
}

.mc-matrix {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.75rem;
  color: #e2e8f0;
}
.mc-matrix th,
.mc-matrix td {
  padding: 8px 10px;
  border: 1px solid #2e2e3e;
  text-align: center;
  vertical-align: top;
  white-space: nowrap;
}
.mc-matrix th {
  background: #16162a;
  font-weight: 600;
}
.mc-row-label {
  text-align: left !important;
  font-weight: 600;
  color: #94a3b8;
  white-space: nowrap;
  min-width: 120px;
}
.mc-col-header {
  min-width: 140px;
}
.mc-study-name {
  font-weight: 700;
  margin-bottom: 4px;
  color: #e2e8f0;
}
.mc-study-actions {
  margin-top: 6px;
  display: flex;
  justify-content: center;
  gap: 6px;
}
.mc-edit-btn,
.mc-del-btn {
  background: none;
  border: none;
  color: #94a3b8;
  font-size: 0.8rem;
  cursor: pointer;
  padding: 2px 4px;
}
.mc-edit-btn:hover { color: #6366f1; }
.mc-del-btn:hover { color: #ef4444; }

.mc-method-badge {
  display: inline-block;
  padding: 2px 8px;
  font-size: 0.6875rem;
  font-weight: 600;
  color: #fff;
  border-radius: 10px;
  white-space: nowrap;
}

.mc-strength { color: #10b981; }
.mc-weakness { color: #f59e0b; }

.mc-stars {
  display: inline-flex;
  gap: 2px;
}
.mc-star {
  cursor: pointer;
  color: #334155;
  font-size: 1rem;
  transition: color 0.15s;
  user-select: none;
}
.mc-star:hover,
.mc-star-active {
  color: #f59e0b;
}

.mc-criterion-add {
  display: flex;
  align-items: center;
  margin-top: 12px;
}
.mc-criterion-add .mc-form-input {
  flex: 1;
}

.mc-export-row {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #2e2e3e;
}
.mc-export-btn {
  padding: 0.35rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: #cbd5e1;
  background: #334155;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.2s;
}
.mc-export-btn:hover {
  background: #475569;
}

/* Light theme overrides */
[data-theme="light"] .mc-panel {
  background: #ffffff;
  border-left-color: #e2e8f0;
}
[data-theme="light"] .mc-header {
  border-bottom-color: #e2e8f0;
}
[data-theme="light"] .mc-title {
  color: #1e293b;
}
[data-theme="light"] .mc-form {
  background: #f8fafc;
  border-bottom-color: #e2e8f0;
}
[data-theme="light"] .mc-form-input,
[data-theme="light"] .mc-form-select {
  color: #1e293b;
  background: #fff;
  border-color: #cbd5e1;
}
[data-theme="light"] .mc-matrix {
  color: #1e293b;
}
[data-theme="light"] .mc-matrix th,
[data-theme="light"] .mc-matrix td {
  border-color: #e2e8f0;
}
[data-theme="light"] .mc-matrix th {
  background: #f1f5f9;
}
[data-theme="light"] .mc-row-label {
  color: #64748b;
}
[data-theme="light"] .mc-study-name {
  color: #1e293b;
}
[data-theme="light"] .mc-star {
  color: #cbd5e1;
}
[data-theme="light"] .mc-empty {
  color: #64748b;
}
[data-theme="light"] .mc-export-row {
  border-top-color: #e2e8f0;
}

/* Responsive */
@media (max-width: 640px) {
  .mc-panel {
    width: 100%;
    right: -100%;
  }
  .mc-trigger-btn {
    font-size: 0.75rem;
    padding: 0.375rem 0.75rem;
  }
  .mc-trigger-btn svg {
    display: none;
  }
  .mc-matrix-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .mc-matrix {
    min-width: 500px;
  }
}

/* ── Research Evidence Mapper ─────────────────────────────── */

.em-trigger-btn {
  position: fixed;
  bottom: 160px;
  right: 24px;
  z-index: var(--z-sidebar);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  border: none;
  border-radius: 24px;
  background: var(--color-primary, #6366f1);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(99, 102, 241, 0.35);
  transition: transform 0.2s, box-shadow 0.2s;
}
.em-trigger-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(99, 102, 241, 0.45);
}
.em-trigger-btn svg {
  flex-shrink: 0;
}

.em-panel {
  position: fixed;
  top: 0;
  right: -460px;
  width: 440px;
  height: 100vh;
  z-index: var(--z-sidebar);
  background: #1e1e2e;
  color: #e2e2e8;
  border-left: 1px solid #2e2e3e;
  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.4);
  overflow-y: auto;
  transition: right 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  flex-direction: column;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.em-panel-open {
  right: 0;
}

.em-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid #2e2e3e;
  flex-shrink: 0;
}
.em-header h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: #f0f0f5;
}
.em-close-btn {
  background: none;
  border: none;
  color: #888;
  font-size: 22px;
  cursor: pointer;
  line-height: 1;
  padding: 0 4px;
}
.em-close-btn:hover {
  color: #fff;
}

.em-pyramid {
  padding: 12px 20px 8px;
  flex-shrink: 0;
}
.em-pyramid-svg {
  width: 100%;
  height: auto;
  display: block;
}
.em-pyramid-level {
  cursor: default;
  transition: fill-opacity 0.2s;
}
.em-pyramid-label {
  pointer-events: none;
  font-family: inherit;
}

.em-filter-row {
  display: flex;
  gap: 6px;
  padding: 8px 20px;
  flex-wrap: wrap;
  flex-shrink: 0;
}
.em-filter-pill {
  padding: 4px 12px;
  border-radius: 12px;
  border: 1px solid #3e3e4e;
  background: transparent;
  color: #b0b0be;
  font-size: 12px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.em-filter-pill:hover {
  background: #2a2a3a;
  color: #e0e0ea;
}
.em-filter-pill.active {
  background: var(--pill-color, var(--color-primary, #6366f1));
  color: #fff;
  border-color: transparent;
}

.em-add-btn {
  margin: 8px 20px;
  padding: 8px 16px;
  border: 1px dashed #4e4e5e;
  border-radius: 8px;
  background: transparent;
  color: var(--color-primary, #6366f1);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: background 0.15s;
  flex-shrink: 0;
}
.em-add-btn:hover {
  background: rgba(99, 102, 241, 0.08);
}

.em-form {
  margin: 0 20px 12px;
  padding: 14px;
  border-radius: 10px;
  background: #262636;
  border: 1px solid #3e3e4e;
  flex-shrink: 0;
}
.em-form-row {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}
.em-form-input,
.em-form-select,
.em-form-textarea {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid #3e3e4e;
  border-radius: 6px;
  background: #1e1e2e;
  color: #e2e2e8;
  font-size: 13px;
  font-family: inherit;
  box-sizing: border-box;
}
.em-form-input:focus,
.em-form-select:focus,
.em-form-textarea:focus {
  outline: none;
  border-color: var(--color-primary, #6366f1);
}
.em-form-select {
  min-width: 120px;
  width: auto;
  flex-shrink: 0;
}
.em-form-textarea {
  resize: vertical;
  margin-top: 8px;
}
.em-form-actions {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}
.em-form-save {
  padding: 7px 16px;
  border: none;
  border-radius: 6px;
  background: var(--color-primary, #6366f1);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.em-form-save:hover {
  opacity: 0.9;
}
.em-form-cancel {
  padding: 7px 16px;
  border: 1px solid #3e3e4e;
  border-radius: 6px;
  background: transparent;
  color: #b0b0be;
  font-size: 13px;
  cursor: pointer;
}
.em-form-cancel:hover {
  background: #2a2a3a;
}

.em-claims-list {
  flex: 1;
  overflow-y: auto;
  padding: 0 20px 12px;
}
.em-empty {
  text-align: center;
  padding: 32px 0;
  color: #666;
  font-size: 13px;
}

.em-claim-card {
  background: #262636;
  border: 1px solid #3e3e4e;
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 10px;
}
.em-claim-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.em-claim-text {
  font-size: 13px;
  font-weight: 600;
  color: #f0f0f5;
  line-height: 1.4;
  flex: 1;
}
.em-claim-strength {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
  flex-shrink: 0;
}

.em-evidence-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 8px;
}
.em-evidence-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #b0b0be;
  flex-wrap: wrap;
}
.em-level-badge {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 8px;
  font-size: 10px;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
  flex-shrink: 0;
}
.em-evidence-source {
  font-style: italic;
  color: #9090a0;
}
.em-evidence-notes {
  color: #808090;
}

.em-claim-actions {
  display: flex;
  gap: 8px;
  border-top: 1px solid #2e2e3e;
  padding-top: 8px;
}
.em-claim-actions button {
  background: none;
  border: none;
  color: #7070a0;
  font-size: 11px;
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 4px;
}
.em-claim-actions button:hover {
  background: #2a2a3a;
  color: #b0b0f0;
}

.em-export-row {
  display: flex;
  gap: 8px;
  padding: 12px 20px 20px;
  flex-shrink: 0;
}
.em-export-btn {
  flex: 1;
  padding: 8px 12px;
  border: 1px solid #3e3e4e;
  border-radius: 6px;
  background: transparent;
  color: #b0b0be;
  font-size: 12px;
  cursor: pointer;
  text-align: center;
  transition: background 0.15s;
}
.em-export-btn:hover {
  background: #2a2a3a;
  color: #e0e0ea;
}

/* Light theme */
[data-theme="light"] .em-panel {
  background: #ffffff;
  color: #1e1e2e;
  border-left-color: #e0e0e8;
  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.1);
}
[data-theme="light"] .em-header {
  border-bottom-color: #e0e0e8;
}
[data-theme="light"] .em-header h3 {
  color: #1e1e2e;
}
[data-theme="light"] .em-close-btn {
  color: #999;
}
[data-theme="light"] .em-close-btn:hover {
  color: #333;
}
[data-theme="light"] .em-filter-pill {
  border-color: #d0d0d8;
  color: #555;
}
[data-theme="light"] .em-filter-pill:hover {
  background: #f0f0f5;
  color: #333;
}
[data-theme="light"] .em-add-btn {
  border-color: #c0c0c8;
}
[data-theme="light"] .em-form {
  background: #f5f5fa;
  border-color: #d0d0d8;
}
[data-theme="light"] .em-form-input,
[data-theme="light"] .em-form-select,
[data-theme="light"] .em-form-textarea {
  background: #fff;
  border-color: #d0d0d8;
  color: #1e1e2e;
}
[data-theme="light"] .em-claim-card {
  background: #f5f5fa;
  border-color: #d0d0d8;
}
[data-theme="light"] .em-claim-text {
  color: #1e1e2e;
}
[data-theme="light"] .em-claim-actions {
  border-top-color: #e0e0e8;
}
[data-theme="light"] .em-claim-actions button {
  color: #6060a0;
}
[data-theme="light"] .em-claim-actions button:hover {
  background: #ececf5;
  color: #4040a0;
}
[data-theme="light"] .em-export-btn {
  border-color: #d0d0d8;
  color: #555;
}
[data-theme="light"] .em-export-btn:hover {
  background: #f0f0f5;
  color: #333;
}
[data-theme="light"] .em-evidence-source {
  color: #666;
}
[data-theme="light"] .em-evidence-notes {
  color: #777;
}
[data-theme="light"] .em-pyramid-level {
  stroke: #e0e0e8;
}
[data-theme="light"] .em-empty {
  color: #999;
}
[data-theme="light"] .em-form-cancel {
  border-color: #d0d0d8;
  color: #555;
}
[data-theme="light"] .em-form-cancel:hover {
  background: #ececf5;
}

/* Responsive */
@media (max-width: 640px) {
  .em-panel {
    width: 100vw;
    right: -100vw;
  }
  .em-trigger-btn {
    bottom: 120px;
    right: 12px;
    padding: 8px 14px;
    font-size: 12px;
  }
  .em-trigger-btn svg {
    display: none;
  }
  .em-form-row {
    flex-direction: column;
  }
  .em-form-select {
    width: 100%;
  }
}

/* ── PRISMA Flow Builder ──────────────────────────────────── */
.pfb-trigger-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  background: rgba(59, 130, 246, 0.15);
  color: #60a5fa;
  border: 1px solid rgba(59, 130, 246, 0.3);
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.pfb-trigger-btn:hover {
  background: rgba(59, 130, 246, 0.25);
  border-color: rgba(59, 130, 246, 0.5);
}
.pfb-trigger-btn svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.pfb-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-overlay);
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(4px);
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.pfb-overlay-open {
  display: flex;
}

.pfb-header {
  display: flex;
  align-items: center;
  width: 92vw;
  max-width: 1100px;
  padding: 14px 20px;
  background: #1e293b;
  border-radius: 12px 12px 0 0;
  border: 1px solid rgba(148, 163, 184, 0.15);
  border-bottom: none;
}
.pfb-header h2 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: #e2e8f0;
  flex: 1;
}
.pfb-close-btn {
  background: none;
  border: none;
  color: #94a3b8;
  font-size: 24px;
  cursor: pointer;
  padding: 0 4px;
  line-height: 1;
}
.pfb-close-btn:hover {
  color: #f1f5f9;
}

.pfb-export-row {
  display: flex;
  gap: 8px;
  margin-right: 16px;
}
.pfb-export-btn {
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 600;
  border-radius: 5px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  background: rgba(148, 163, 184, 0.1);
  color: #94a3b8;
  cursor: pointer;
  transition: background 0.2s;
}
.pfb-export-btn:hover {
  background: rgba(148, 163, 184, 0.2);
  color: #e2e8f0;
}

.pfb-content {
  display: flex;
  width: 92vw;
  max-width: 1100px;
  height: 70vh;
  max-height: 600px;
  background: #0f172a;
  border: 1px solid rgba(148, 163, 184, 0.15);
  border-radius: 0 0 12px 12px;
  overflow: hidden;
}

.pfb-svg-wrap {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  overflow: auto;
  background: #0f172a;
}
.pfb-svg-wrap svg {
  max-width: 100%;
  height: auto;
}

.pfb-editor {
  width: 320px;
  min-width: 280px;
  overflow-y: auto;
  padding: 16px;
  border-left: 1px solid rgba(148, 163, 184, 0.12);
  background: #1e293b;
}

.pfb-stage {
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.08);
}
.pfb-stage:last-child {
  border-bottom: none;
  margin-bottom: 0;
}
.pfb-stage-title {
  font-size: 13px;
  font-weight: 700;
  color: #e2e8f0;
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.pfb-stage[data-stage="identification"] .pfb-stage-title { color: #3b82f6; }
.pfb-stage[data-stage="screening"] .pfb-stage-title { color: #a855f7; }
.pfb-stage[data-stage="eligibility"] .pfb-stage-title { color: #f59e0b; }
.pfb-stage[data-stage="included"] .pfb-stage-title { color: #22c55e; }

.pfb-field-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.pfb-field-label {
  flex: 1;
  font-size: 12px;
  color: #94a3b8;
}
.pfb-field-input {
  width: 72px;
  padding: 4px 8px;
  font-size: 13px;
  color: #e2e8f0;
  background: rgba(15, 23, 42, 0.6);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 5px;
  text-align: right;
}
.pfb-field-input:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

.pfb-excl-label {
  font-size: 11px;
  color: #64748b;
  margin-top: 8px;
  margin-bottom: 4px;
}
.pfb-excl-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.pfb-excl-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #cbd5e1;
  padding: 3px 0;
}
.pfb-excl-item span {
  flex: 1;
}
.pfb-excl-rm {
  background: none;
  border: none;
  color: #ef4444;
  cursor: pointer;
  font-size: 14px;
  padding: 0 2px;
  line-height: 1;
}
.pfb-excl-rm:hover {
  color: #f87171;
}
.pfb-excl-add {
  display: inline-block;
  margin-top: 4px;
  font-size: 12px;
  color: #60a5fa;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
.pfb-excl-add:hover {
  color: #93c5fd;
  text-decoration: underline;
}

/* Light theme overrides */
[data-theme="light"] .pfb-trigger-btn {
  background: rgba(59, 130, 246, 0.08);
  color: #2563eb;
  border-color: rgba(59, 130, 246, 0.25);
}
[data-theme="light"] .pfb-header {
  background: #f1f5f9;
  border-color: rgba(0, 0, 0, 0.1);
}
[data-theme="light"] .pfb-header h2 {
  color: #1e293b;
}
[data-theme="light"] .pfb-content {
  background: #ffffff;
  border-color: rgba(0, 0, 0, 0.1);
}
[data-theme="light"] .pfb-svg-wrap {
  background: #ffffff;
}
[data-theme="light"] .pfb-editor {
  background: #f8fafc;
  border-left-color: rgba(0, 0, 0, 0.08);
}
[data-theme="light"] .pfb-stage-title {
  color: #1e293b;
}
[data-theme="light"] .pfb-field-label {
  color: #475569;
}
[data-theme="light"] .pfb-field-input {
  color: #1e293b;
  background: #ffffff;
  border-color: rgba(0, 0, 0, 0.15);
}
[data-theme="light"] .pfb-excl-item {
  color: #334155;
}
[data-theme="light"] .pfb-export-btn {
  color: #475569;
  border-color: rgba(0, 0, 0, 0.12);
  background: rgba(0, 0, 0, 0.04);
}

/* Responsive: stack layout on small screens */
@media (max-width: 640px) {
  .pfb-content {
    flex-direction: column;
    height: 85vh;
    max-height: none;
  }
  .pfb-svg-wrap {
    flex: none;
    height: 280px;
    min-height: 240px;
  }
  .pfb-editor {
    width: 100%;
    min-width: 0;
    border-left: none;
    border-top: 1px solid rgba(148, 163, 184, 0.12);
    flex: 1;
  }
  .pfb-header {
    width: 96vw;
    border-radius: 10px 10px 0 0;
  }
  .pfb-content {
    width: 96vw;
    border-radius: 0 0 10px 10px;
  }
  .pfb-export-row {
    display: none;
  }
  .pfb-trigger-btn svg {
    display: none;
  }
}

/* ══════════════════════════════════════════════════════════════════
   ██  Sample Size Calculator                                     ██
   ══════════════════════════════════════════════════════════════════ */

.ssc-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border: 1px solid rgba(139,92,246,0.35);
  border-radius: 8px; background: rgba(139,92,246,0.08);
  color: #c4b5fd; font-size: 13px; cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.ssc-trigger-btn:hover { background: rgba(139,92,246,0.18); border-color: rgba(139,92,246,0.55); }
.ssc-trigger-btn svg { flex-shrink: 0; }

/* Overlay */
.ssc-overlay {
  position: fixed; inset: 0; z-index: var(--z-overlay);
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,0.55); backdrop-filter: blur(4px);
}

/* Modal */
.ssc-modal {
  width: 540px; max-width: 96vw; max-height: 90vh;
  background: #1a1b2e; border: 1px solid rgba(148,163,184,0.12);
  border-radius: 14px; box-shadow: 0 24px 80px rgba(0,0,0,0.45);
  display: flex; flex-direction: column; overflow: hidden;
}

/* Header */
.ssc-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; border-bottom: 1px solid rgba(148,163,184,0.10);
}
.ssc-title { font-size: 15px; font-weight: 600; color: #e2e8f0; }
.ssc-close {
  background: rgba(148,163,184,0.08); border: none; color: #94a3b8;
  width: 28px; height: 28px; border-radius: 6px; font-size: 18px;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background 0.15s, color 0.15s;
}
.ssc-close:hover { background: rgba(148,163,184,0.18); color: #f1f5f9; }

/* Tab bar */
.ssc-tab-bar {
  display: flex; gap: 4px; padding: 10px 18px 0;
  border-bottom: 1px solid rgba(148,163,184,0.08);
  overflow-x: auto; flex-shrink: 0;
}
.ssc-tab {
  padding: 6px 12px; border: 1px solid rgba(148,163,184,0.12);
  border-bottom: none; border-radius: 8px 8px 0 0;
  background: transparent; color: #94a3b8; font-size: 12px; font-weight: 500;
  cursor: pointer; white-space: nowrap; transition: background 0.15s, color 0.15s;
}
.ssc-tab:hover { background: rgba(139,92,246,0.06); color: #c4b5fd; }
.ssc-tab-active {
  background: rgba(139,92,246,0.12); border-color: rgba(139,92,246,0.3);
  color: #c4b5fd; font-weight: 600;
}

/* Inputs pane — scrollable body */
.ssc-inputs-pane {
  padding: 16px 18px; display: flex; flex-direction: column; gap: 10px;
  overflow-y: auto; flex: 1 1 auto;
}
.ssc-input-row { display: flex; gap: 10px; }
.ssc-input-group { display: flex; flex-direction: column; gap: 4px; flex: 1; }
.ssc-label { font-size: 11px; color: #94a3b8; font-weight: 500; }
.ssc-select, .ssc-input {
  width: 100%; padding: 8px 10px; border-radius: 6px;
  border: 1px solid rgba(148,163,184,0.18); background: rgba(15,23,42,0.6);
  color: #e2e8f0; font-size: 13px; outline: none; transition: border-color 0.2s;
}
.ssc-select:focus, .ssc-input:focus { border-color: #8b5cf6; }
.ssc-select { cursor: pointer; }
.ssc-select option { background: #1e1b4b; }

/* Preset buttons */
.ssc-preset-row { display: flex; gap: 6px; }
.ssc-preset {
  flex: 1; padding: 5px 4px; border: 1px solid rgba(139,92,246,0.2);
  border-radius: 6px; background: rgba(139,92,246,0.06);
  color: #c4b5fd; font-size: 11px; cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.ssc-preset:hover { background: rgba(139,92,246,0.16); border-color: rgba(139,92,246,0.4); }

/* Calculate button */
.ssc-calc-btn {
  margin-top: 4px; padding: 10px 0; border: none; border-radius: 8px;
  background: linear-gradient(135deg, #7c3aed, #8b5cf6);
  color: #fff; font-size: 14px; font-weight: 600; cursor: pointer;
  transition: opacity 0.2s, transform 0.1s;
}
.ssc-calc-btn:hover { opacity: 0.9; }
.ssc-calc-btn:active { transform: scale(0.98); }

/* Result box */
.ssc-result-box {
  margin: 0 18px; padding: 14px; border-radius: 8px;
  background: rgba(15,23,42,0.5); border-left: 3px solid #8b5cf6;
}
.ssc-result-label { font-size: 11px; color: #94a3b8; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 2px; }
.ssc-result-n { font-size: 38px; font-weight: 700; color: #c4b5fd; line-height: 1.1; margin-bottom: 2px; }
.ssc-result-pergroup { font-size: 13px; color: #a78bfa; margin-bottom: 4px; }
.ssc-result-detail { font-size: 12px; color: #94a3b8; line-height: 1.5; margin-bottom: 10px; }
.ssc-result-actions { display: flex; gap: 8px; }

/* Power curve */
.ssc-power-curve { margin-bottom: 10px; border-radius: 6px; overflow: hidden; background: rgba(15,23,42,0.4); padding: 4px; }
.ssc-power-curve svg, .ssc-power-svg { display: block; width: 100%; height: auto; }

/* Copy / Clear buttons */
.ssc-copy-btn, .ssc-clear-btn {
  flex: 1; padding: 7px 0; border: 1px solid rgba(139,92,246,0.3);
  border-radius: 6px; background: rgba(139,92,246,0.08);
  color: #c4b5fd; font-size: 12px; cursor: pointer; transition: background 0.2s;
}
.ssc-copy-btn:hover, .ssc-clear-btn:hover { background: rgba(139,92,246,0.18); }
.ssc-clear-btn { border-color: rgba(148,163,184,0.18); color: #94a3b8; background: rgba(148,163,184,0.06); }
.ssc-clear-btn:hover { background: rgba(148,163,184,0.14); }

/* History section */
.ssc-history-section { padding: 12px 18px 16px; flex-shrink: 0; }
.ssc-history-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.ssc-history-title { margin: 0; font-size: 0.85rem; font-weight: 600; color: #94a3b8; }
.ssc-clear-hist-btn {
  background: none; border: 1px solid rgba(148,163,184,0.15); border-radius: 4px;
  color: #64748b; font-size: 11px; padding: 2px 8px; cursor: pointer; transition: color 0.15s;
}
.ssc-clear-hist-btn:hover { color: #e2e8f0; border-color: rgba(148,163,184,0.3); }
.ssc-history-list { display: flex; flex-direction: column; gap: 5px; max-height: 160px; overflow-y: auto; }
.ssc-history-row {
  display: flex; align-items: center; gap: 8px; padding: 5px 10px;
  border-radius: 6px; background: rgba(255,255,255,0.03); font-size: 0.78rem;
}
.ssc-history-type { color: #c4b5fd; font-weight: 500; white-space: nowrap; min-width: 100px; }
.ssc-history-n { color: #e2e8f0; font-weight: 600; font-family: 'Fira Code', monospace; white-space: nowrap; }
.ssc-history-info { color: #64748b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ssc-history-empty { font-size: 0.78rem; color: #475569; font-style: italic; }

/* ── Light theme ─────────────────────────────────────────────── */
[data-theme="light"] .ssc-trigger-btn { color: #7c3aed; background: rgba(139,92,246,0.06); border-color: rgba(139,92,246,0.25); }
[data-theme="light"] .ssc-trigger-btn:hover { background: rgba(139,92,246,0.12); }
[data-theme="light"] .ssc-overlay { background: rgba(0,0,0,0.25); }
[data-theme="light"] .ssc-modal { background: #ffffff; border-color: rgba(0,0,0,0.1); box-shadow: 0 24px 80px rgba(0,0,0,0.15); }
[data-theme="light"] .ssc-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .ssc-title { color: #1e293b; }
[data-theme="light"] .ssc-close { background: rgba(0,0,0,0.04); color: #64748b; }
[data-theme="light"] .ssc-tab-bar { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .ssc-tab { border-color: rgba(0,0,0,0.08); color: #64748b; }
[data-theme="light"] .ssc-tab:hover { background: rgba(139,92,246,0.04); }
[data-theme="light"] .ssc-tab-active { background: rgba(139,92,246,0.08); border-color: rgba(139,92,246,0.2); color: #7c3aed; }
[data-theme="light"] .ssc-label { color: #475569; }
[data-theme="light"] .ssc-select, [data-theme="light"] .ssc-input { background: #f8fafc; color: #1e293b; border-color: rgba(0,0,0,0.12); }
[data-theme="light"] .ssc-select option { background: #fff; }
[data-theme="light"] .ssc-preset { background: rgba(139,92,246,0.04); border-color: rgba(139,92,246,0.15); color: #7c3aed; }
[data-theme="light"] .ssc-preset:hover { background: rgba(139,92,246,0.1); }
[data-theme="light"] .ssc-result-box { background: rgba(139,92,246,0.04); border-color: rgba(139,92,246,0.15); }
[data-theme="light"] .ssc-result-n { color: #7c3aed; }
[data-theme="light"] .ssc-result-pergroup { color: #6d28d9; }
[data-theme="light"] .ssc-result-detail { color: #64748b; }
[data-theme="light"] .ssc-copy-btn { color: #7c3aed; }
[data-theme="light"] .ssc-power-curve { background: rgba(0,0,0,0.03); }
[data-theme="light"] .ssc-history-row { background: rgba(0,0,0,0.02); }
[data-theme="light"] .ssc-history-type { color: #7c3aed; }
[data-theme="light"] .ssc-history-n { color: #1e293b; }
[data-theme="light"] .ssc-history-info { color: #94a3b8; }
[data-theme="light"] .ssc-history-title { color: #64748b; }

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 640px) {
  .ssc-modal { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; }
  .ssc-tab-bar { gap: 3px; padding: 8px 12px 0; }
  .ssc-tab { padding: 5px 8px; font-size: 0.72rem; }
  .ssc-inputs-pane { padding: 12px; }
  .ssc-input-row { flex-direction: column; }
  .ssc-preset-row { flex-wrap: wrap; }
  .ssc-result-box { margin: 0 12px; }
  .ssc-result-actions { flex-direction: column; }
  .ssc-trigger-btn span { display: none; }
}

/* ══════════════════════════════════════════════════════════════════ */
/* ██  Hypothesis Builder (Wizard Modal)                          ██ */
/* ══════════════════════════════════════════════════════════════════ */

.hyp-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border: 1px solid rgba(59,130,246,0.35); border-radius: 8px;
  background: rgba(59,130,246,0.08); color: #93c5fd; font-size: 13px;
  cursor: pointer; transition: background 0.2s, border-color 0.2s;
}
.hyp-trigger-btn:hover { background: rgba(59,130,246,0.18); border-color: rgba(59,130,246,0.5); }

.hyp-overlay {
  position: fixed; inset: 0; z-index: var(--z-sidebar); background: rgba(0,0,0,0.55);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; pointer-events: none; transition: opacity 0.25s;
}
.hyp-overlay--visible { opacity: 1; pointer-events: auto; }

.hyp-modal {
  width: 580px; max-width: 96vw; max-height: 90vh;
  background: #1a1b2e; border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px; box-shadow: 0 24px 80px rgba(0,0,0,0.45);
  display: flex; flex-direction: column; overflow: hidden;
}

.hyp-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 24px; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.hyp-title { margin: 0; font-size: 1.1rem; font-weight: 700; color: #e2e8f0; }
.hyp-close {
  width: 32px; height: 32px; border: none; border-radius: 8px;
  background: rgba(255,255,255,0.06); color: #94a3b8; font-size: 20px;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background 0.2s, color 0.2s;
}
.hyp-close:hover { background: rgba(255,255,255,0.12); color: #e2e8f0; }

/* Step indicator */
.hyp-step-bar {
  display: flex; align-items: center; justify-content: center; gap: 0;
  padding: 16px 24px 12px;
}
.hyp-step-line {
  flex: 0 0 40px; height: 2px; background: rgba(255,255,255,0.1);
  transition: background 0.3s;
}
.hyp-step-line--done { background: #3b82f6; }
.hyp-step-dot {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.hyp-step-num {
  width: 28px; height: 28px; border-radius: 50%;
  background: rgba(255,255,255,0.06); color: #64748b;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700; transition: background 0.3s, color 0.3s;
}
.hyp-step-dot--active .hyp-step-num { background: #3b82f6; color: #fff; }
.hyp-step-dot--done .hyp-step-num { background: #22c55e; color: #fff; }
.hyp-step-label { font-size: 10px; color: #64748b; white-space: nowrap; }
.hyp-step-dot--active .hyp-step-label { color: #93c5fd; font-weight: 600; }

/* Body */
.hyp-body {
  flex: 1; overflow-y: auto; padding: 20px 24px;
  display: flex; flex-direction: column; gap: 16px;
}

.hyp-field { display: flex; flex-direction: column; gap: 5px; }
.hyp-label { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: #94a3b8; }
.hyp-hint { font-size: 11px; color: #64748b; }
.hyp-input {
  padding: 9px 12px; border: 1px solid rgba(255,255,255,0.1); border-radius: 8px;
  background: rgba(255,255,255,0.04); color: #e2e8f0; font-size: 13px;
  transition: border-color 0.2s;
}
.hyp-input:focus { outline: none; border-color: rgba(59,130,246,0.5); }

/* Tag input for CVs */
.hyp-tag-input-wrap {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  padding: 6px 10px; border: 1px solid rgba(255,255,255,0.1); border-radius: 8px;
  background: rgba(255,255,255,0.04); min-height: 38px;
}
.hyp-tag-input-wrap:focus-within { border-color: rgba(59,130,246,0.5); }
.hyp-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.hyp-tag {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px; border-radius: 12px;
  background: rgba(59,130,246,0.15); color: #93c5fd; font-size: 12px;
}
.hyp-tag-remove {
  background: none; border: none; color: #93c5fd; cursor: pointer;
  font-size: 14px; padding: 0; line-height: 1;
}
.hyp-tag-remove:hover { color: #ef4444; }
.hyp-tag-field { border: none; background: none; flex: 1; min-width: 120px; padding: 4px 0; }
.hyp-tag-field:focus { outline: none; }

/* Radio card group */
.hyp-radio-group { display: flex; flex-wrap: wrap; gap: 8px; }
.hyp-radio-card {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 14px; border: 1px solid rgba(255,255,255,0.08); border-radius: 10px;
  background: rgba(255,255,255,0.03); cursor: pointer; transition: border-color 0.2s, background 0.2s;
}
.hyp-radio-card:hover { border-color: rgba(59,130,246,0.3); }
.hyp-radio-card input[type="radio"] { accent-color: #3b82f6; }
.hyp-radio-card input[type="radio"]:checked ~ .hyp-radio-label { color: #93c5fd; }
.hyp-radio-label { font-size: 13px; color: #cbd5e1; }
.hyp-relationship-preview {
  padding: 12px 14px; border-radius: 8px;
  background: rgba(59,130,246,0.06); border: 1px solid rgba(59,130,246,0.12);
}
.hyp-rel-summary { font-size: 13px; color: #cbd5e1; line-height: 1.5; }

/* Templates */
.hyp-templates-section { border-top: 1px solid rgba(255,255,255,0.06); padding-top: 14px; }
.hyp-templates-title { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: #94a3b8; margin-bottom: 10px; }
.hyp-templates-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 8px; }
.hyp-template-card {
  display: flex; flex-direction: column; gap: 4px;
  padding: 10px 12px; border: 1px solid rgba(255,255,255,0.08); border-radius: 8px;
  background: rgba(255,255,255,0.03); cursor: pointer; text-align: left;
  transition: border-color 0.2s, background 0.2s; color: #e2e8f0; font-size: 12px;
}
.hyp-template-card:hover { border-color: rgba(59,130,246,0.4); background: rgba(59,130,246,0.06); }
.hyp-template-card strong { font-size: 13px; }
.hyp-template-preview { font-size: 11px; color: #64748b; line-height: 1.3; }

/* Output (Step 3) */
.hyp-output-section { display: flex; flex-direction: column; gap: 14px; }
.hyp-output-box {
  position: relative; padding: 14px 16px; border-radius: 10px;
  background: rgba(255,255,255,0.03); border-left: 4px solid #3b82f6;
}
.hyp-h1-box { border-left-color: #f59e0b; }
.hyp-output-label { font-size: 12px; font-weight: 700; color: #93c5fd; margin-bottom: 6px; }
.hyp-h1-box .hyp-output-label { color: #fbbf24; }
.hyp-output-text {
  width: 100%; min-height: 60px; padding: 10px; border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px; background: rgba(255,255,255,0.02); color: #e2e8f0;
  font-size: 13px; line-height: 1.6; resize: vertical; font-family: inherit;
}
.hyp-output-text:focus { outline: none; border-color: rgba(59,130,246,0.4); }
.hyp-copy-btn {
  margin-top: 8px; padding: 4px 12px; border: 1px solid rgba(59,130,246,0.3);
  border-radius: 6px; background: rgba(59,130,246,0.08); color: #93c5fd;
  font-size: 11px; cursor: pointer; transition: background 0.2s;
}
.hyp-copy-btn:hover { background: rgba(59,130,246,0.2); }
.hyp-output-actions { display: flex; justify-content: flex-end; gap: 10px; }

/* Footer navigation */
.hyp-footer {
  display: flex; align-items: center; padding: 14px 24px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.hyp-btn {
  padding: 9px 20px; border-radius: 8px; font-size: 13px; font-weight: 600;
  cursor: pointer; border: none; transition: opacity 0.2s, background 0.2s;
}
.hyp-btn-primary { background: linear-gradient(135deg, #3b82f6, #6366f1); color: #fff; }
.hyp-btn-primary:hover { opacity: 0.88; }
.hyp-btn-secondary { background: rgba(255,255,255,0.06); color: #cbd5e1; }
.hyp-btn-secondary:hover { background: rgba(255,255,255,0.1); }

/* Saved section */
.hyp-saved-section {
  border-top: 1px solid rgba(255,255,255,0.06); padding: 14px 24px 18px;
  max-height: 220px; overflow-y: auto;
}
.hyp-saved-title { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: #94a3b8; margin-bottom: 10px; }
.hyp-saved-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.hyp-saved-empty { font-size: 12px; color: #64748b; font-style: italic; }
.hyp-saved-item {
  position: relative; padding: 10px 12px; border-radius: 8px;
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.05);
}
.hyp-saved-meta { display: flex; justify-content: space-between; margin-bottom: 4px; }
.hyp-saved-type { font-size: 10px; text-transform: uppercase; letter-spacing: 0.5px; color: #6366f1; }
.hyp-saved-date { font-size: 10px; color: #64748b; }
.hyp-saved-h0, .hyp-saved-h1 { font-size: 12px; color: #cbd5e1; line-height: 1.4; }
.hyp-saved-delete {
  position: absolute; top: 8px; right: 8px; background: none; border: none;
  color: #64748b; font-size: 16px; cursor: pointer; padding: 0 4px;
  border-radius: 3px; transition: color 0.2s;
}
.hyp-saved-delete:hover { color: #ef4444; }
.hyp-export-btn {
  padding: 8px 14px; border: 1px solid rgba(99,102,241,0.3); border-radius: 6px;
  background: rgba(99,102,241,0.08); color: #a5b4fc; font-size: 12px;
  cursor: pointer; transition: background 0.2s;
}
.hyp-export-btn:hover { background: rgba(99,102,241,0.18); }

/* Light theme overrides */
[data-theme="light"] .hyp-trigger-btn { color: #3b82f6; background: rgba(59,130,246,0.06); border-color: rgba(59,130,246,0.25); }
[data-theme="light"] .hyp-trigger-btn:hover { background: rgba(59,130,246,0.12); }
[data-theme="light"] .hyp-modal { background: #ffffff; border-color: rgba(0,0,0,0.1); box-shadow: 0 24px 80px rgba(0,0,0,0.15); }
[data-theme="light"] .hyp-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .hyp-title { color: #1e293b; }
[data-theme="light"] .hyp-close { background: rgba(0,0,0,0.04); color: #64748b; }
[data-theme="light"] .hyp-step-num { background: rgba(0,0,0,0.06); color: #94a3b8; }
[data-theme="light"] .hyp-step-line { background: rgba(0,0,0,0.08); }
[data-theme="light"] .hyp-label { color: #475569; }
[data-theme="light"] .hyp-hint { color: #94a3b8; }
[data-theme="light"] .hyp-input { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #1e293b; }
[data-theme="light"] .hyp-tag-input-wrap { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); }
[data-theme="light"] .hyp-tag { background: rgba(59,130,246,0.1); color: #3b82f6; }
[data-theme="light"] .hyp-radio-card { border-color: rgba(0,0,0,0.08); background: rgba(0,0,0,0.01); }
[data-theme="light"] .hyp-radio-label { color: #334155; }
[data-theme="light"] .hyp-relationship-preview { background: rgba(59,130,246,0.04); border-color: rgba(59,130,246,0.1); }
[data-theme="light"] .hyp-rel-summary { color: #334155; }
[data-theme="light"] .hyp-template-card { border-color: rgba(0,0,0,0.08); color: #1e293b; }
[data-theme="light"] .hyp-output-box { background: rgba(0,0,0,0.02); }
[data-theme="light"] .hyp-output-label { color: #3b82f6; }
[data-theme="light"] .hyp-h1-box .hyp-output-label { color: #d97706; }
[data-theme="light"] .hyp-output-text { background: #fafafa; color: #1e293b; border-color: rgba(0,0,0,0.1); }
[data-theme="light"] .hyp-copy-btn { color: #3b82f6; border-color: rgba(59,130,246,0.25); }
[data-theme="light"] .hyp-footer { border-top-color: rgba(0,0,0,0.06); }
[data-theme="light"] .hyp-btn-secondary { background: rgba(0,0,0,0.04); color: #475569; }
[data-theme="light"] .hyp-saved-section { border-top-color: rgba(0,0,0,0.06); }
[data-theme="light"] .hyp-saved-item { background: #f8fafc; border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .hyp-saved-h0, [data-theme="light"] .hyp-saved-h1 { color: #334155; }
[data-theme="light"] .hyp-export-btn { color: #6366f1; }

/* Responsive */
@media (max-width: 640px) {
  .hyp-modal { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; }
  .hyp-step-label { display: none; }
  .hyp-step-bar { gap: 0; }
  .hyp-templates-grid { grid-template-columns: 1fr; }
  .hyp-radio-group { flex-direction: column; }
}

/* ══════════════════════════════════════════════════════════════════
   ██  Research Methodology Wizard                                ██
   ══════════════════════════════════════════════════════════════════ */

.mw-trigger-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border: 1px solid rgba(99, 102, 241, 0.3);
  border-radius: 8px;
  background: rgba(99, 102, 241, 0.08);
  color: #a5b4fc;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.mw-trigger-btn:hover {
  background: rgba(99, 102, 241, 0.18);
  border-color: rgba(99, 102, 241, 0.5);
}

.mw-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-overlay);
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s;
}
.mw-overlay--visible {
  opacity: 1;
  pointer-events: auto;
}

.mw-modal {
  width: 600px;
  max-width: 95vw;
  max-height: 85vh;
  background: #1e2030;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Progress bar */
.mw-progress {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 20px 24px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.mw-progress-step {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.35);
  flex-shrink: 0;
  transition: background 0.2s, color 0.2s;
}
.mw-progress-step--active {
  background: #6366f1;
  color: #fff;
}
.mw-progress-step--complete {
  background: #22c55e;
  color: #fff;
}
.mw-progress-line {
  flex: 1;
  height: 2px;
  min-width: 24px;
  background: rgba(255, 255, 255, 0.1);
  transition: background 0.2s;
}
.mw-progress-line--done {
  background: #22c55e;
}

/* Content area */
.mw-content {
  flex: 1;
  overflow-y: auto;
  padding: 20px 24px;
}
.mw-step-title {
  font-size: 18px;
  font-weight: 600;
  color: #e2e8f0;
  margin-bottom: 4px;
}
.mw-step-desc {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.5);
  margin-bottom: 16px;
}
.mw-step-hint {
  font-size: 12px;
  color: rgba(99, 102, 241, 0.8);
  margin-bottom: 10px;
  font-style: italic;
}

/* Card grids */
.mw-cards-grid {
  display: grid;
  gap: 10px;
}
.mw-cards-3 { grid-template-columns: repeat(3, 1fr); }
.mw-cards-4 { grid-template-columns: repeat(4, 1fr); }

.mw-card {
  padding: 14px 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.03);
  cursor: pointer;
  text-align: center;
  transition: border-color 0.2s, background 0.2s, transform 0.15s;
}
.mw-card:hover {
  border-color: rgba(99, 102, 241, 0.4);
  background: rgba(99, 102, 241, 0.06);
  transform: translateY(-1px);
}
.mw-card.mw-selected {
  border-color: #6366f1;
  background: rgba(99, 102, 241, 0.12);
}
.mw-card-icon {
  font-size: 28px;
  margin-bottom: 6px;
}
.mw-card-label {
  font-size: 13px;
  font-weight: 600;
  color: #e2e8f0;
}
.mw-card-desc {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.45);
  margin-top: 4px;
}

/* Footer */
.mw-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.mw-btn-back, .mw-btn-next, .mw-btn-finish {
  padding: 8px 18px;
  border: none;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.2s;
}
.mw-btn-back {
  background: rgba(255, 255, 255, 0.06);
  color: #94a3b8;
}
.mw-btn-back:hover { background: rgba(255, 255, 255, 0.12); }
.mw-btn-next {
  background: #6366f1;
  color: #fff;
}
.mw-btn-next:hover { background: #5558e6; }
.mw-btn-finish {
  background: #22c55e;
  color: #fff;
}
.mw-btn-finish:hover { background: #1db954; }

/* Summary */
.mw-summary {
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  padding: 16px 20px;
  margin-top: 12px;
}
.mw-summary pre {
  margin: 0;
  white-space: pre-wrap;
  font-family: 'JetBrains Mono', 'Fira Code', monospace;
  font-size: 12px;
  color: #cbd5e1;
  line-height: 1.6;
}

/* Light theme overrides */
[data-theme="light"] .mw-trigger-btn { color: #6366f1; background: rgba(99, 102, 241, 0.06); border-color: rgba(99, 102, 241, 0.25); }
[data-theme="light"] .mw-trigger-btn:hover { background: rgba(99, 102, 241, 0.12); }
[data-theme="light"] .mw-modal { background: #ffffff; border-color: rgba(0, 0, 0, 0.08); box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15); }
[data-theme="light"] .mw-progress { border-bottom-color: rgba(0, 0, 0, 0.06); }
[data-theme="light"] .mw-progress-step { background: rgba(0, 0, 0, 0.06); color: rgba(0, 0, 0, 0.35); }
[data-theme="light"] .mw-step-title { color: #1e293b; }
[data-theme="light"] .mw-step-desc { color: #64748b; }
[data-theme="light"] .mw-card { background: rgba(0, 0, 0, 0.02); border-color: rgba(0, 0, 0, 0.08); }
[data-theme="light"] .mw-card:hover { background: rgba(99, 102, 241, 0.04); border-color: rgba(99, 102, 241, 0.3); }
[data-theme="light"] .mw-card.mw-selected { background: rgba(99, 102, 241, 0.08); border-color: #6366f1; }
[data-theme="light"] .mw-card-label { color: #1e293b; }
[data-theme="light"] .mw-card-desc { color: #64748b; }
[data-theme="light"] .mw-footer { border-top-color: rgba(0, 0, 0, 0.06); }
[data-theme="light"] .mw-btn-back { background: rgba(0, 0, 0, 0.04); color: #64748b; }
[data-theme="light"] .mw-summary { background: #f8fafc; border-color: rgba(0, 0, 0, 0.06); }
[data-theme="light"] .mw-summary pre { color: #334155; }

/* Responsive — full-width modal on small screens */
@media (max-width: 640px) {
  .mw-modal {
    width: 100vw;
    max-width: 100vw;
    border-radius: 0;
    max-height: 100vh;
  }
  .mw-cards-3 { grid-template-columns: repeat(2, 1fr); }
  .mw-cards-4 { grid-template-columns: repeat(2, 1fr); }
}

/* ══════════════════════════════════════════════════════════════════
   ██  Data Dictionary                                            ██
   ══════════════════════════════════════════════════════════════════ */

.dd-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 14px; border-radius: 8px; border: 1px solid rgba(99,102,241,0.25);
  background: rgba(99,102,241,0.08); color: #a5b4fc; font-size: 13px;
  font-weight: 500; cursor: pointer; transition: background 0.2s, border-color 0.2s;
  white-space: nowrap;
}
.dd-trigger-btn:hover { background: rgba(99,102,241,0.16); border-color: rgba(99,102,241,0.4); }

.dd-panel {
  position: fixed; top: 0; right: 0; width: 370px; height: 100vh;
  background: #1a1b2e; border-left: 1px solid rgba(255,255,255,0.06);
  box-shadow: -8px 0 30px rgba(0,0,0,0.4); z-index: var(--z-overlay);
  display: flex; flex-direction: column;
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.dd-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; border-bottom: 1px solid rgba(255,255,255,0.06);
  color: #e2e8f0; flex-shrink: 0;
}

.dd-form {
  padding: 12px 16px; border-bottom: 1px solid rgba(255,255,255,0.06);
  flex-shrink: 0;
}
.dd-form-row { margin-bottom: 8px; }
.dd-form-row label { display: block; font-size: 11px; color: #94a3b8; margin-bottom: 3px; font-weight: 500; }

.dd-input, .dd-select, .dd-textarea {
  width: 100%; padding: 7px 10px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04);
  color: #e2e8f0; font-size: 13px; outline: none; box-sizing: border-box;
  transition: border-color 0.2s;
}
.dd-input:focus, .dd-select:focus, .dd-textarea:focus { border-color: #6366f1; }
.dd-textarea { resize: vertical; font-family: inherit; }
.dd-select { cursor: pointer; }

.dd-add-btn {
  width: 100%; padding: 8px; border-radius: 6px; border: none;
  background: #6366f1; color: #fff; font-size: 13px; font-weight: 600;
  cursor: pointer; transition: background 0.2s; margin-top: 4px;
}
.dd-add-btn:hover { background: #4f46e5; }

.dd-filter-row {
  padding: 10px 16px; border-bottom: 1px solid rgba(255,255,255,0.06);
  flex-shrink: 0;
}

.dd-search {
  width: 100%; padding: 7px 10px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04);
  color: #e2e8f0; font-size: 13px; outline: none; box-sizing: border-box;
}
.dd-search:focus { border-color: #6366f1; }

.dd-filter-pill {
  padding: 3px 10px; border-radius: 12px; border: 1px solid rgba(255,255,255,0.1);
  background: transparent; color: #94a3b8; font-size: 11px; cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.dd-filter-pill:hover { background: rgba(255,255,255,0.06); }
.dd-filter-pill.dd-filter-active { background: rgba(99,102,241,0.15); border-color: #6366f1; color: #a5b4fc; }

.dd-list {
  flex: 1; overflow-y: auto; padding: 10px 16px;
}

.dd-var-card {
  padding: 10px 12px; border-radius: 8px;
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06);
  margin-bottom: 8px; transition: border-color 0.2s;
}
.dd-var-card:hover { border-color: rgba(99,102,241,0.3); }

.dd-var-name { font-weight: 600; font-size: 13px; color: #e2e8f0; }
.dd-var-type {
  display: inline-block; padding: 1px 8px; border-radius: 10px;
  font-size: 11px; font-weight: 500;
}
.dd-var-desc { font-size: 12px; color: #94a3b8; margin-top: 2px; line-height: 1.4; }
.dd-var-range {
  font-size: 11px; color: #64748b; background: rgba(255,255,255,0.04);
  padding: 2px 8px; border-radius: 4px;
}
.dd-var-units {
  font-size: 11px; color: #3b82f6; background: rgba(59,130,246,0.1);
  padding: 2px 8px; border-radius: 4px;
}
.dd-var-required { color: #ef4444; font-size: 10px; }

.dd-card-action {
  background: none; border: none; color: #64748b; cursor: pointer;
  font-size: 13px; padding: 2px 4px; border-radius: 4px; transition: color 0.2s;
}
.dd-card-action:hover { color: #e2e8f0; }

.dd-actions {
  display: flex; gap: 6px; padding: 10px 16px;
  border-top: 1px solid rgba(255,255,255,0.06); flex-shrink: 0;
}
.dd-action-btn {
  flex: 1; padding: 7px 4px; border-radius: 6px; border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.04); color: #94a3b8; font-size: 11px;
  cursor: pointer; transition: background 0.2s; text-align: center;
}
.dd-action-btn:hover { background: rgba(255,255,255,0.08); color: #e2e8f0; }

/* Light theme overrides */
[data-theme="light"] .dd-trigger-btn { color: #6366f1; background: rgba(99,102,241,0.06); border-color: rgba(99,102,241,0.25); }
[data-theme="light"] .dd-trigger-btn:hover { background: rgba(99,102,241,0.12); }
[data-theme="light"] .dd-panel { background: #ffffff; border-left-color: rgba(0,0,0,0.08); box-shadow: -8px 0 30px rgba(0,0,0,0.12); }
[data-theme="light"] .dd-header { color: #1e293b; border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .dd-form { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .dd-form-row label { color: #64748b; }
[data-theme="light"] .dd-input,
[data-theme="light"] .dd-select,
[data-theme="light"] .dd-textarea,
[data-theme="light"] .dd-search { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.12); color: #1e293b; }
[data-theme="light"] .dd-filter-row { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .dd-filter-pill { border-color: rgba(0,0,0,0.1); color: #64748b; }
[data-theme="light"] .dd-filter-pill:hover { background: rgba(0,0,0,0.04); }
[data-theme="light"] .dd-var-card { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .dd-var-card:hover { border-color: rgba(99,102,241,0.3); }
[data-theme="light"] .dd-var-name { color: #1e293b; }
[data-theme="light"] .dd-var-desc { color: #64748b; }
[data-theme="light"] .dd-var-range { color: #475569; background: rgba(0,0,0,0.04); }
[data-theme="light"] .dd-card-action { color: #94a3b8; }
[data-theme="light"] .dd-card-action:hover { color: #1e293b; }
[data-theme="light"] .dd-actions { border-top-color: rgba(0,0,0,0.06); }
[data-theme="light"] .dd-action-btn { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #64748b; }
[data-theme="light"] .dd-action-btn:hover { background: rgba(0,0,0,0.05); color: #1e293b; }

/* Responsive — full-width panel on small screens */
@media (max-width: 640px) {
  .dd-panel { width: 100vw; max-width: 100vw; }
}

/* ═══════════════════════════════════════════════════════════════════
   ██  Consent Form Builder                                        ██
   ═══════════════════════════════════════════════════════════════════ */

.cf-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 8px; border: 1px solid rgba(99,102,241,0.3);
  background: rgba(99,102,241,0.08); color: #a5b4fc; font-size: 13px;
  cursor: pointer; transition: background 0.2s, color 0.2s; white-space: nowrap;
}
.cf-trigger-btn:hover { background: rgba(99,102,241,0.16); color: #c7d2fe; }

.cf-overlay {
  position: fixed; inset: 0; z-index: var(--z-overlay);
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,0.55); backdrop-filter: blur(4px);
}

.cf-modal {
  width: 700px; max-width: 96vw; max-height: 92vh;
  background: #1e2030; border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 20px 60px rgba(0,0,0,0.5);
  display: flex; flex-direction: column; overflow: hidden;
}

.cf-modal-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 20px; border-bottom: 1px solid rgba(255,255,255,0.06);
  font-size: 15px; font-weight: 600; color: #e2e8f0;
}

.cf-close-btn {
  background: none; border: none; color: #64748b; font-size: 18px;
  cursor: pointer; padding: 2px 6px; border-radius: 4px; transition: color 0.2s;
}
.cf-close-btn:hover { color: #e2e8f0; }

.cf-templates {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 20px; border-bottom: 1px solid rgba(255,255,255,0.06);
  overflow-x: auto;
}
.cf-templates-label {
  font-size: 12px; color: #64748b; font-weight: 600; white-space: nowrap;
}

.cf-template-card {
  display: flex; flex-direction: column; gap: 2px;
  padding: 8px 14px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.03);
  color: #94a3b8; font-size: 12px; cursor: pointer;
  transition: border-color 0.2s, background 0.2s; text-align: left; white-space: nowrap;
}
.cf-template-card strong { color: #cbd5e1; font-size: 12px; }
.cf-template-card small { color: #64748b; font-size: 10px; }
.cf-template-card:hover { border-color: rgba(99,102,241,0.4); background: rgba(99,102,241,0.06); }
.cf-template-card.cf-template-active {
  border-color: #6366f1; background: rgba(99,102,241,0.12);
}
.cf-template-card.cf-template-active strong { color: #a5b4fc; }

.cf-body {
  display: flex; flex: 1; overflow: hidden; min-height: 0;
}

.cf-form {
  flex: 1; overflow-y: auto; padding: 16px 20px;
  border-right: 1px solid rgba(255,255,255,0.06);
}

.cf-section { margin-bottom: 14px; }

.cf-section-label {
  display: block; font-size: 12px; font-weight: 600;
  color: #94a3b8; margin-bottom: 4px;
}
.cf-required { color: #f87171; }

.cf-section-textarea {
  width: 100%; padding: 8px 10px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.04);
  color: #e2e8f0; font-size: 12px; font-family: inherit;
  resize: vertical; transition: border-color 0.2s;
  box-sizing: border-box;
}
.cf-section-textarea:focus {
  outline: none; border-color: rgba(99,102,241,0.5);
}
.cf-section-textarea::placeholder { color: #475569; }

.cf-add-section-btn {
  display: block; width: 100%; padding: 8px; margin-top: 8px;
  border-radius: 6px; border: 1px dashed rgba(255,255,255,0.12);
  background: none; color: #64748b; font-size: 12px;
  cursor: pointer; transition: color 0.2s, border-color 0.2s;
}
.cf-add-section-btn:hover { color: #a5b4fc; border-color: rgba(99,102,241,0.3); }

.cf-remove-custom {
  background: none; border: none; color: #f87171; font-size: 14px;
  cursor: pointer; padding: 2px 6px; border-radius: 4px;
}
.cf-remove-custom:hover { background: rgba(248,113,113,0.1); }

.cf-preview-col {
  flex: 1; display: flex; flex-direction: column; overflow: hidden;
}

.cf-validation {
  padding: 10px 16px; border-bottom: 1px solid rgba(255,255,255,0.06);
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
}
.cf-valid-summary {
  width: 100%; font-size: 11px; font-weight: 600; color: #94a3b8; margin-bottom: 4px;
}
.cf-valid-item {
  font-size: 11px; padding: 2px 8px; border-radius: 4px; white-space: nowrap;
}
.cf-valid-ok { color: #4ade80; background: rgba(74,222,128,0.08); }
.cf-valid-err { color: #f87171; background: rgba(248,113,113,0.08); }

.cf-preview {
  flex: 1; overflow-y: auto; padding: 16px 20px; font-size: 12px; color: #cbd5e1; line-height: 1.6;
}
.cf-preview-title { font-size: 16px; text-align: center; margin: 0 0 2px; color: #e2e8f0; }
.cf-preview-subtitle { font-size: 13px; text-align: center; color: #64748b; margin: 0 0 16px; font-weight: 400; }
.cf-preview-section { margin-bottom: 14px; }
.cf-preview-section h4 { font-size: 12px; color: #a5b4fc; margin: 0 0 4px; border-bottom: 1px solid rgba(255,255,255,0.06); padding-bottom: 2px; }
.cf-preview-section p { margin: 0; color: #94a3b8; font-size: 12px; }
.cf-preview-sig { margin-top: 24px; padding-top: 16px; border-top: 2px solid rgba(255,255,255,0.1); }
.cf-sig-line { margin-bottom: 12px; font-size: 12px; color: #94a3b8; }
.cf-sig-line span { font-weight: 600; color: #cbd5e1; }

.cf-export-bar {
  display: flex; gap: 8px; padding: 12px 20px;
  border-top: 1px solid rgba(255,255,255,0.06); flex-shrink: 0;
}
.cf-export-btn {
  flex: 1; padding: 8px 4px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04);
  color: #94a3b8; font-size: 12px; cursor: pointer;
  transition: background 0.2s; text-align: center;
}
.cf-export-btn:hover { background: rgba(255,255,255,0.08); color: #e2e8f0; }
.cf-save-btn { border-color: rgba(99,102,241,0.3); color: #a5b4fc; }
.cf-save-btn:hover { background: rgba(99,102,241,0.12); }

/* Light theme overrides */
[data-theme="light"] .cf-trigger-btn { color: #6366f1; background: rgba(99,102,241,0.06); border-color: rgba(99,102,241,0.25); }
[data-theme="light"] .cf-trigger-btn:hover { background: rgba(99,102,241,0.12); }
[data-theme="light"] .cf-modal { background: #ffffff; border-color: rgba(0,0,0,0.08); box-shadow: 0 20px 60px rgba(0,0,0,0.15); }
[data-theme="light"] .cf-modal-header { color: #1e293b; border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .cf-close-btn { color: #94a3b8; }
[data-theme="light"] .cf-close-btn:hover { color: #1e293b; }
[data-theme="light"] .cf-templates { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .cf-template-card { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.08); color: #64748b; }
[data-theme="light"] .cf-template-card strong { color: #1e293b; }
[data-theme="light"] .cf-template-card:hover { border-color: rgba(99,102,241,0.4); }
[data-theme="light"] .cf-template-card.cf-template-active { border-color: #6366f1; background: rgba(99,102,241,0.06); }
[data-theme="light"] .cf-form { border-right-color: rgba(0,0,0,0.06); }
[data-theme="light"] .cf-section-label { color: #475569; }
[data-theme="light"] .cf-section-textarea { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.12); color: #1e293b; }
[data-theme="light"] .cf-section-textarea::placeholder { color: #94a3b8; }
[data-theme="light"] .cf-add-section-btn { border-color: rgba(0,0,0,0.12); color: #64748b; }
[data-theme="light"] .cf-validation { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .cf-valid-summary { color: #475569; }
[data-theme="light"] .cf-preview { color: #1e293b; }
[data-theme="light"] .cf-preview-title { color: #1e293b; }
[data-theme="light"] .cf-preview-subtitle { color: #64748b; }
[data-theme="light"] .cf-preview-section h4 { color: #6366f1; border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .cf-preview-section p { color: #475569; }
[data-theme="light"] .cf-preview-sig { border-top-color: rgba(0,0,0,0.12); }
[data-theme="light"] .cf-sig-line { color: #64748b; }
[data-theme="light"] .cf-sig-line span { color: #1e293b; }
[data-theme="light"] .cf-export-bar { border-top-color: rgba(0,0,0,0.06); }
[data-theme="light"] .cf-export-btn { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #64748b; }
[data-theme="light"] .cf-export-btn:hover { background: rgba(0,0,0,0.05); color: #1e293b; }

/* Responsive */
@media (max-width: 640px) {
  .cf-modal { width: 100vw; max-width: 100vw; height: 100vh; max-height: 100vh; border-radius: 0; }
  .cf-body { flex-direction: column; }
  .cf-form { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.06); max-height: 45vh; }
  .cf-templates { flex-wrap: wrap; }
}

/* ═══════════════════════════════════════════════════════════════════ */
/* Ethics Checklist                                                   */
/* ═══════════════════════════════════════════════════════════════════ */

.ec-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 8px; border: 1px solid rgba(99,102,241,0.3);
  background: rgba(99,102,241,0.08); color: #a5b4fc; font-size: 0.85rem;
  cursor: pointer; transition: background 0.2s, border-color 0.2s;
}
.ec-trigger-btn:hover { background: rgba(99,102,241,0.16); border-color: rgba(99,102,241,0.5); }

.ec-panel {
  position: fixed; top: 0; right: -390px; width: 370px; height: 100vh;
  background: #1a1b2e; border-left: 1px solid rgba(255,255,255,0.06);
  box-shadow: -4px 0 24px rgba(0,0,0,0.3); z-index: var(--z-overlay);
  display: flex; flex-direction: column; transition: right 0.3s ease;
}
.ec-panel.ec-panel-open { right: 0; }

.ec-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 18px; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.ec-header-left { display: flex; align-items: center; }
.ec-title { font-size: 1rem; font-weight: 600; color: #e2e8f0; }
.ec-header-right { display: flex; align-items: center; gap: 12px; }

.ec-progress-ring-wrap {
  position: relative; width: 50px; height: 50px; display: flex; align-items: center; justify-content: center;
}
.ec-progress-ring { display: block; }
.ec-progress-text {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  font-size: 0.7rem; font-weight: 700; color: #e2e8f0;
}

.ec-close-btn {
  background: none; border: none; color: #94a3b8; font-size: 1.4rem;
  cursor: pointer; line-height: 1; padding: 2px 6px;
}
.ec-close-btn:hover { color: #e2e8f0; }

.ec-categories {
  flex: 1; overflow-y: auto; padding: 10px 14px;
}

.ec-category {
  margin-bottom: 6px; border-radius: 8px;
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06);
}

.ec-category-header {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 12px; cursor: pointer; user-select: none;
  transition: background 0.15s;
}
.ec-category-header:hover { background: rgba(255,255,255,0.04); }
.ec-category-header.ec-expanded { background: rgba(99,102,241,0.06); }

.ec-cat-arrow { font-size: 0.7rem; color: #64748b; width: 14px; }
.ec-cat-label { flex: 1; font-size: 0.82rem; font-weight: 500; color: #cbd5e1; }
.ec-cat-count { font-size: 0.72rem; color: #64748b; margin-right: 6px; }

.ec-category-bar {
  width: 50px; height: 4px; background: rgba(255,255,255,0.08);
  border-radius: 2px; overflow: hidden;
}
.ec-category-bar-fill {
  height: 100%; background: #6366f1; border-radius: 2px;
  transition: width 0.3s ease;
}

.ec-category-body {
  padding: 6px 12px 12px 34px;
  border-top: 1px solid rgba(255,255,255,0.04);
}

.ec-check-item {
  display: flex; align-items: center; gap: 8px;
  padding: 5px 0; cursor: pointer; transition: opacity 0.15s;
}
.ec-check-item:hover { opacity: 0.85; }

.ec-checkbox { font-size: 1rem; color: #64748b; }
.ec-check-label { font-size: 0.8rem; color: #94a3b8; }

.ec-check-item.ec-checked .ec-checkbox { color: #22c55e; }
.ec-check-item.ec-checked .ec-check-label {
  color: #4ade80; text-decoration: line-through; opacity: 0.7;
}

.ec-notes-label {
  display: block; font-size: 0.72rem; color: #64748b;
  margin-top: 10px; margin-bottom: 4px;
}
.ec-notes {
  width: 100%; min-height: 48px; max-height: 100px; resize: vertical;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08);
  border-radius: 6px; padding: 6px 8px; color: #cbd5e1; font-size: 0.78rem;
  font-family: inherit; outline: none;
}
.ec-notes::placeholder { color: #475569; }
.ec-notes:focus { border-color: rgba(99,102,241,0.4); }

.ec-actions {
  display: flex; gap: 8px; padding: 12px 14px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.ec-action-btn {
  flex: 1; padding: 7px 0; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04);
  color: #94a3b8; font-size: 0.76rem; cursor: pointer;
  transition: background 0.2s; text-align: center;
}
.ec-action-btn:hover { background: rgba(255,255,255,0.08); color: #e2e8f0; }
.ec-reset-btn { border-color: rgba(239,68,68,0.3); color: #f87171; }
.ec-reset-btn:hover { background: rgba(239,68,68,0.12); }

/* Light theme overrides */
[data-theme="light"] .ec-trigger-btn { color: #6366f1; background: rgba(99,102,241,0.06); border-color: rgba(99,102,241,0.25); }
[data-theme="light"] .ec-trigger-btn:hover { background: rgba(99,102,241,0.12); }
[data-theme="light"] .ec-panel { background: #ffffff; border-left-color: rgba(0,0,0,0.08); box-shadow: -4px 0 24px rgba(0,0,0,0.1); }
[data-theme="light"] .ec-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .ec-title { color: #1e293b; }
[data-theme="light"] .ec-progress-text { color: #1e293b; }
[data-theme="light"] .ec-close-btn { color: #94a3b8; }
[data-theme="light"] .ec-close-btn:hover { color: #1e293b; }
[data-theme="light"] .ec-category { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .ec-category-header:hover { background: rgba(0,0,0,0.03); }
[data-theme="light"] .ec-category-header.ec-expanded { background: rgba(99,102,241,0.05); }
[data-theme="light"] .ec-cat-label { color: #334155; }
[data-theme="light"] .ec-cat-count { color: #64748b; }
[data-theme="light"] .ec-category-bar { background: rgba(0,0,0,0.06); }
[data-theme="light"] .ec-category-body { border-top-color: rgba(0,0,0,0.04); }
[data-theme="light"] .ec-checkbox { color: #94a3b8; }
[data-theme="light"] .ec-check-label { color: #475569; }
[data-theme="light"] .ec-check-item.ec-checked .ec-checkbox { color: #16a34a; }
[data-theme="light"] .ec-check-item.ec-checked .ec-check-label { color: #16a34a; }
[data-theme="light"] .ec-notes { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #1e293b; }
[data-theme="light"] .ec-notes::placeholder { color: #94a3b8; }
[data-theme="light"] .ec-actions { border-top-color: rgba(0,0,0,0.06); }
[data-theme="light"] .ec-action-btn { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #64748b; }
[data-theme="light"] .ec-action-btn:hover { background: rgba(0,0,0,0.05); color: #1e293b; }

/* Responsive */
@media (max-width: 640px) {
  .ec-panel { width: 100vw; max-width: 100vw; right: -110vw; }
  .ec-panel.ec-panel-open { right: 0; }
}

/* ══════════════════════════════════════════════════════════════════ */
/* ██  Power Analysis Visualizer                                  ██ */
/* ══════════════════════════════════════════════════════════════════ */

.pa-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 8px; border: 1px solid rgba(99,102,241,0.3);
  background: rgba(99,102,241,0.08); color: #a5b4fc;
  font-size: 13px; font-weight: 500; cursor: pointer;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.pa-trigger-btn:hover { background: rgba(99,102,241,0.18); color: #c7d2fe; border-color: rgba(99,102,241,0.5); }

.pa-panel {
  position: fixed; top: 0; right: -420px; width: 380px; height: 100vh;
  background: #1a1b2e; border-left: 1px solid rgba(99,102,241,0.15);
  box-shadow: -4px 0 24px rgba(0,0,0,0.4); z-index: var(--z-tooltip);
  display: flex; flex-direction: column; overflow-y: auto;
  transition: right 0.35s cubic-bezier(0.4,0,0.2,1);
}
.pa-panel.pa-panel-open { right: 0; }

.pa-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; border-bottom: 1px solid rgba(255,255,255,0.06);
  flex-shrink: 0;
}
.pa-title { font-size: 15px; font-weight: 600; color: #e2e8f0; }
.pa-close-btn {
  background: none; border: none; color: #64748b; font-size: 16px;
  cursor: pointer; padding: 4px 6px; border-radius: 4px;
  transition: color 0.2s;
}
.pa-close-btn:hover { color: #e2e8f0; }

.pa-canvas-wrap {
  position: relative; padding: 12px 16px; flex-shrink: 0;
}
.pa-canvas {
  width: 100%; height: auto; border-radius: 8px;
  background: #0f1021; display: block;
}

.pa-tooltip {
  display: none; position: absolute; padding: 6px 10px;
  background: rgba(15,16,33,0.95); border: 1px solid rgba(99,102,241,0.3);
  border-radius: 6px; font-size: 11px; color: #cbd5e1;
  pointer-events: none; z-index: 10; white-space: nowrap;
  line-height: 1.5;
}

.pa-controls {
  padding: 8px 16px 12px; display: flex; flex-direction: column; gap: 10px;
  flex-shrink: 0;
}
.pa-control-row {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.pa-control-row label {
  font-size: 12px; color: #94a3b8; min-width: 70px; flex-shrink: 0;
}
.pa-slider {
  flex: 1; min-width: 80px; height: 4px; -webkit-appearance: none; appearance: none;
  background: rgba(99,102,241,0.2); border-radius: 2px; outline: none;
  cursor: pointer;
}
.pa-slider::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; width: 14px; height: 14px;
  border-radius: 50%; background: #6366f1; cursor: pointer;
}
.pa-slider::-moz-range-thumb {
  width: 14px; height: 14px; border-radius: 50%; background: #6366f1;
  border: none; cursor: pointer;
}
.pa-slider-val {
  font-size: 11px; color: #a5b4fc; min-width: 36px; text-align: right;
  font-family: 'SF Mono', monospace;
}

.pa-select {
  flex: 1; padding: 4px 8px; border-radius: 6px;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
  color: #e2e8f0; font-size: 12px; cursor: pointer; outline: none;
}
.pa-select option { background: #1a1b2e; color: #e2e8f0; }

.pa-effect-sizes {
  display: flex; flex-wrap: wrap; gap: 6px; flex: 1;
}
.pa-effect-chip {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 8px; border-radius: 12px; border: 1px solid;
  font-size: 11px; font-family: 'SF Mono', monospace;
}
.pa-chip-remove {
  cursor: pointer; font-size: 13px; opacity: 0.7;
  transition: opacity 0.2s;
}
.pa-chip-remove:hover { opacity: 1; }

.pa-add-effect-btn {
  padding: 3px 10px; border-radius: 6px; border: 1px dashed rgba(99,102,241,0.3);
  background: transparent; color: #818cf8; font-size: 11px;
  cursor: pointer; transition: background 0.2s, border-color 0.2s;
}
.pa-add-effect-btn:hover { background: rgba(99,102,241,0.1); border-color: rgba(99,102,241,0.5); }

.pa-annotations {
  padding: 4px 16px 8px; display: flex; flex-direction: column; gap: 4px;
}
.pa-annotation {
  padding: 4px 10px; border-left: 3px solid #6366f1;
  font-size: 11px; color: #94a3b8; background: rgba(255,255,255,0.02);
  border-radius: 0 4px 4px 0;
}

.pa-legend {
  padding: 0 16px 8px; display: flex; flex-wrap: wrap; gap: 10px;
}

.pa-export-row {
  display: flex; gap: 8px; padding: 8px 16px 16px; flex-shrink: 0;
}
.pa-export-btn {
  flex: 1; padding: 7px 12px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04);
  color: #94a3b8; font-size: 12px; cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.pa-export-btn:hover { background: rgba(255,255,255,0.08); color: #e2e8f0; }

/* Light theme overrides */
[data-theme="light"] .pa-trigger-btn { color: #6366f1; background: rgba(99,102,241,0.06); border-color: rgba(99,102,241,0.25); }
[data-theme="light"] .pa-trigger-btn:hover { background: rgba(99,102,241,0.12); }
[data-theme="light"] .pa-panel { background: #ffffff; border-left-color: rgba(0,0,0,0.08); box-shadow: -4px 0 24px rgba(0,0,0,0.1); }
[data-theme="light"] .pa-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .pa-title { color: #1e293b; }
[data-theme="light"] .pa-close-btn { color: #94a3b8; }
[data-theme="light"] .pa-close-btn:hover { color: #1e293b; }
[data-theme="light"] .pa-control-row label { color: #475569; }
[data-theme="light"] .pa-slider { background: rgba(99,102,241,0.15); }
[data-theme="light"] .pa-slider-val { color: #6366f1; }
[data-theme="light"] .pa-select { background: rgba(0,0,0,0.03); border-color: rgba(0,0,0,0.1); color: #1e293b; }
[data-theme="light"] .pa-annotation { background: rgba(0,0,0,0.02); color: #475569; }
[data-theme="light"] .pa-export-btn { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #64748b; }
[data-theme="light"] .pa-export-btn:hover { background: rgba(0,0,0,0.05); color: #1e293b; }
[data-theme="light"] .pa-tooltip { background: rgba(255,255,255,0.95); border-color: rgba(0,0,0,0.1); color: #334155; }
[data-theme="light"] .pa-add-effect-btn { border-color: rgba(99,102,241,0.2); color: #6366f1; }
[data-theme="light"] .pa-add-effect-btn:hover { background: rgba(99,102,241,0.06); }

/* Responsive */
@media (max-width: 640px) {
  .pa-panel { width: 100vw; max-width: 100vw; right: -110vw; }
  .pa-panel.pa-panel-open { right: 0; }
  .pa-canvas-wrap { padding: 8px 10px; }
  .pa-controls { padding: 6px 10px 10px; }
  .pa-export-row { padding: 6px 10px 12px; }
}

/* ═══════════════════════════════════════════════════════════════════
   Variable Mapper
   ═══════════════════════════════════════════════════════════════════ */

.vm-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 8px; font-size: 13px; font-weight: 500;
  border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.05);
  color: #a78bfa; cursor: pointer; transition: background 0.2s, color 0.2s;
}
.vm-trigger-btn:hover { background: rgba(167,139,250,0.12); color: #c4b5fd; }

.vm-panel {
  position: fixed; top: 0; right: -440px; width: 400px; height: 100vh;
  background: #1a1b2e; border-left: 1px solid rgba(255,255,255,0.06);
  box-shadow: -4px 0 24px rgba(0,0,0,0.4); z-index: var(--z-overlay);
  display: flex; flex-direction: column; transition: right 0.3s ease;
  overflow-y: auto;
}
.vm-panel-open { right: 0; }

.vm-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; border-bottom: 1px solid rgba(255,255,255,0.06); flex-shrink: 0;
}
.vm-title { font-size: 15px; font-weight: 600; color: #e2e8f0; }
.vm-close-btn {
  background: none; border: none; color: #64748b; font-size: 22px;
  cursor: pointer; line-height: 1; padding: 0 4px; transition: color 0.2s;
}
.vm-close-btn:hover { color: #e2e8f0; }

.vm-canvas-wrap { padding: 12px 16px; flex-shrink: 0; }
.vm-canvas {
  width: 100%; border-radius: 8px; border: 1px solid rgba(255,255,255,0.08);
  background: #0f1025; cursor: crosshair;
}

.vm-type-btns {
  display: flex; gap: 6px; padding: 0 16px 10px; flex-shrink: 0;
}
.vm-type-btn {
  flex: 1; padding: 6px 8px; border-radius: 6px; font-size: 12px; font-weight: 500;
  border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04);
  color: #94a3b8; cursor: pointer; transition: background 0.2s, color 0.2s;
}
.vm-type-btn:hover { background: rgba(255,255,255,0.08); }
.vm-type-independent { color: #818cf8; border-color: rgba(99,102,241,0.3); }
.vm-type-independent:hover { background: rgba(99,102,241,0.15); }
.vm-type-dependent { color: #34d399; border-color: rgba(16,185,129,0.3); }
.vm-type-dependent:hover { background: rgba(16,185,129,0.15); }
.vm-type-control { color: #fbbf24; border-color: rgba(245,158,11,0.3); }
.vm-type-control:hover { background: rgba(245,158,11,0.15); }

.vm-connect-toggle {
  margin: 0 16px 10px; padding: 7px 12px; border-radius: 6px; font-size: 12px;
  border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04);
  color: #94a3b8; cursor: pointer; transition: background 0.2s, border-color 0.2s;
}
.vm-connect-toggle:hover { background: rgba(255,255,255,0.08); }

.vm-var-list, .vm-conn-list {
  padding: 0 16px 8px; display: flex; flex-direction: column; gap: 4px;
}
.vm-var-item {
  display: flex; align-items: center; gap: 8px; padding: 5px 8px;
  border-radius: 6px; background: rgba(255,255,255,0.03); font-size: 12px;
}
.vm-var-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; border-radius: 4px; font-size: 11px; font-weight: 700;
  flex-shrink: 0;
}
.vm-badge-independent { background: rgba(99,102,241,0.2); color: #818cf8; }
.vm-badge-dependent { background: rgba(16,185,129,0.2); color: #34d399; }
.vm-badge-control { background: rgba(245,158,11,0.2); color: #fbbf24; }

.vm-var-name, .vm-conn-label { flex: 1; color: #cbd5e1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vm-var-delete, .vm-conn-delete {
  background: none; border: none; color: #64748b; font-size: 16px; cursor: pointer;
  padding: 0 2px; line-height: 1; transition: color 0.2s;
}
.vm-var-delete:hover, .vm-conn-delete:hover { color: #ef4444; }

.vm-export-row {
  display: flex; gap: 6px; padding: 10px 16px 16px; flex-shrink: 0;
}
.vm-export-btn {
  flex: 1; padding: 7px 10px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04);
  color: #94a3b8; font-size: 12px; cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.vm-export-btn:hover { background: rgba(255,255,255,0.08); color: #e2e8f0; }

/* Light theme overrides */
[data-theme="light"] .vm-trigger-btn { color: #6366f1; background: rgba(99,102,241,0.06); border-color: rgba(99,102,241,0.25); }
[data-theme="light"] .vm-trigger-btn:hover { background: rgba(99,102,241,0.12); }
[data-theme="light"] .vm-panel { background: #ffffff; border-left-color: rgba(0,0,0,0.08); box-shadow: -4px 0 24px rgba(0,0,0,0.1); }
[data-theme="light"] .vm-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .vm-title { color: #1e293b; }
[data-theme="light"] .vm-close-btn { color: #94a3b8; }
[data-theme="light"] .vm-close-btn:hover { color: #1e293b; }
[data-theme="light"] .vm-canvas { background: #f8fafc; border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .vm-type-btn { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #64748b; }
[data-theme="light"] .vm-type-independent { color: #6366f1; border-color: rgba(99,102,241,0.3); }
[data-theme="light"] .vm-type-dependent { color: #059669; border-color: rgba(16,185,129,0.3); }
[data-theme="light"] .vm-type-control { color: #d97706; border-color: rgba(245,158,11,0.3); }
[data-theme="light"] .vm-connect-toggle { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #64748b; }
[data-theme="light"] .vm-var-item { background: rgba(0,0,0,0.02); }
[data-theme="light"] .vm-var-name, [data-theme="light"] .vm-conn-label { color: #334155; }
[data-theme="light"] .vm-export-btn { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #64748b; }
[data-theme="light"] .vm-export-btn:hover { background: rgba(0,0,0,0.05); color: #1e293b; }

/* Responsive */
@media (max-width: 640px) {
  .vm-panel { width: 100vw; max-width: 100vw; right: -110vw; }
  .vm-panel.vm-panel-open { right: 0; }
  .vm-canvas-wrap { padding: 8px 10px; }
  .vm-type-btns { padding: 0 10px 8px; }
  .vm-export-row { padding: 6px 10px 12px; }
}

/* ══════════════════════════════════════════════════════════════════ */
/*  Inclusion/Exclusion Criteria Builder                             */
/* ══════════════════════════════════════════════════════════════════ */

.iec-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 14px; border-radius: 8px; font-size: 13px; font-weight: 500;
  border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04);
  color: #a78bfa; cursor: pointer; transition: background 0.2s, border-color 0.2s;
}
.iec-trigger-btn:hover { background: rgba(167,139,250,0.12); border-color: rgba(167,139,250,0.3); }

.iec-panel {
  position: fixed; top: 0; right: -440px; width: 420px; height: 100vh;
  background: #1a1b2e; border-left: 1px solid rgba(255,255,255,0.06);
  box-shadow: -4px 0 24px rgba(0,0,0,0.4); z-index: var(--z-overlay);
  display: flex; flex-direction: column;
  transition: right 0.3s cubic-bezier(0.4,0,0.2,1);
}
.iec-panel.iec-panel-open { right: 0; }

.iec-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px; border-bottom: 1px solid rgba(255,255,255,0.06); flex-shrink: 0;
}
.iec-title { font-size: 15px; font-weight: 600; color: #e2e8f0; }
.iec-close-btn {
  width: 28px; height: 28px; border-radius: 6px; border: none;
  background: transparent; color: #64748b; font-size: 18px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: color 0.2s, background 0.2s;
}
.iec-close-btn:hover { color: #e2e8f0; background: rgba(255,255,255,0.06); }

.iec-body { flex: 1; overflow-y: auto; padding: 12px 16px; }

.iec-add-row { display: flex; gap: 8px; margin-bottom: 14px; }
.iec-add-btn {
  flex: 1; padding: 8px 12px; border-radius: 6px; font-size: 12px; font-weight: 600;
  border: 1px dashed; cursor: pointer; transition: background 0.2s;
}
.iec-add-include { color: #10b981; border-color: rgba(16,185,129,0.4); background: rgba(16,185,129,0.06); }
.iec-add-include:hover { background: rgba(16,185,129,0.15); }
.iec-add-exclude { color: #ef4444; border-color: rgba(239,68,68,0.4); background: rgba(239,68,68,0.06); }
.iec-add-exclude:hover { background: rgba(239,68,68,0.15); }

.iec-section-title {
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em;
  margin: 10px 0 6px; color: #64748b;
}
.iec-section-include { color: #10b981; }
.iec-section-exclude { color: #ef4444; }

.iec-criterion {
  background: rgba(255,255,255,0.03); border-radius: 8px; padding: 10px;
  margin-bottom: 8px; border-left: 3px solid transparent;
  transition: opacity 0.2s;
}
.iec-criterion.iec-include { border-left-color: #10b981; }
.iec-criterion.iec-exclude { border-left-color: #ef4444; }
.iec-criterion.iec-disabled { opacity: 0.4; }

.iec-criterion-controls { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 6px; }
.iec-field-select, .iec-op-select {
  padding: 5px 8px; border-radius: 5px; font-size: 12px;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1);
  color: #e2e8f0; cursor: pointer;
}
.iec-value-input {
  flex: 1; min-width: 80px; padding: 5px 8px; border-radius: 5px; font-size: 12px;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1);
  color: #e2e8f0;
}
.iec-value-input::placeholder { color: #475569; }

.iec-criterion-actions { display: flex; gap: 4px; justify-content: flex-end; }
.iec-toggle-btn, .iec-delete-btn {
  width: 26px; height: 26px; border-radius: 5px; border: none;
  background: rgba(255,255,255,0.04); color: #94a3b8; font-size: 14px;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background 0.2s, color 0.2s;
}
.iec-toggle-btn:hover { background: rgba(255,255,255,0.1); color: #e2e8f0; }
.iec-delete-btn:hover { background: rgba(239,68,68,0.15); color: #ef4444; }

.iec-empty { font-size: 12px; color: #475569; padding: 8px 0; text-align: center; }

.iec-apply-btn {
  display: block; width: 100%; padding: 10px; border-radius: 8px; margin: 14px 0;
  font-size: 13px; font-weight: 600; border: none; cursor: pointer;
  background: linear-gradient(135deg, #6366f1, #8b5cf6); color: #fff;
  transition: opacity 0.2s;
}
.iec-apply-btn:hover { opacity: 0.9; }

.iec-results { margin-bottom: 12px; }

.iec-flow { display: flex; flex-direction: column; align-items: center; gap: 0; }
.iec-flow-box {
  width: 100%; padding: 10px 14px; border-radius: 8px; text-align: center;
  font-size: 12px; color: #e2e8f0; line-height: 1.4;
}
.iec-flow-box strong { font-size: 16px; }
.iec-flow-arrow { font-size: 14px; color: #475569; padding: 2px 0; }
.iec-flow-box.iec-flow-total { background: rgba(99,102,241,0.15); border: 1px solid rgba(99,102,241,0.3); }
.iec-flow-box.iec-flow-excluded { background: rgba(239,68,68,0.12); border: 1px solid rgba(239,68,68,0.25); }
.iec-flow-box.iec-flow-included { background: rgba(16,185,129,0.12); border: 1px solid rgba(16,185,129,0.3); }

.iec-export-row { display: flex; gap: 6px; padding: 10px 0 16px; }
.iec-export-btn {
  flex: 1; padding: 7px 10px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04);
  color: #94a3b8; font-size: 12px; cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.iec-export-btn:hover { background: rgba(255,255,255,0.08); color: #e2e8f0; }

/* Light theme overrides */
[data-theme="light"] .iec-trigger-btn { color: #6366f1; background: rgba(99,102,241,0.06); border-color: rgba(99,102,241,0.25); }
[data-theme="light"] .iec-trigger-btn:hover { background: rgba(99,102,241,0.12); }
[data-theme="light"] .iec-panel { background: #ffffff; border-left-color: rgba(0,0,0,0.08); box-shadow: -4px 0 24px rgba(0,0,0,0.1); }
[data-theme="light"] .iec-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .iec-title { color: #1e293b; }
[data-theme="light"] .iec-close-btn { color: #94a3b8; }
[data-theme="light"] .iec-close-btn:hover { color: #1e293b; }
[data-theme="light"] .iec-criterion { background: rgba(0,0,0,0.02); }
[data-theme="light"] .iec-field-select, [data-theme="light"] .iec-op-select { background: #fff; border-color: rgba(0,0,0,0.12); color: #334155; }
[data-theme="light"] .iec-value-input { background: #fff; border-color: rgba(0,0,0,0.12); color: #334155; }
[data-theme="light"] .iec-value-input::placeholder { color: #94a3b8; }
[data-theme="light"] .iec-toggle-btn, [data-theme="light"] .iec-delete-btn { background: rgba(0,0,0,0.03); color: #64748b; }
[data-theme="light"] .iec-export-btn { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #64748b; }
[data-theme="light"] .iec-export-btn:hover { background: rgba(0,0,0,0.05); color: #1e293b; }
[data-theme="light"] .iec-flow-box { color: #1e293b; }
[data-theme="light"] .iec-section-title { color: #94a3b8; }
[data-theme="light"] .iec-empty { color: #94a3b8; }

/* Responsive */
@media (max-width: 640px) {
  .iec-panel { width: 100vw; max-width: 100vw; right: -110vw; }
  .iec-panel.iec-panel-open { right: 0; }
  .iec-body { padding: 8px 10px; }
  .iec-criterion-controls { flex-direction: column; }
  .iec-export-row { padding: 6px 0 12px; }
}

/* ═══════════════════════════════════════════════════════════════════
   Survey Builder
   ═══════════════════════════════════════════════════════════════════ */
.svb-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px;
  background: rgba(99,102,241,0.08); color: #a5b4fc; border: 1px solid rgba(99,102,241,0.3);
  border-radius: 6px; cursor: pointer; font-size: 13px; font-weight: 500;
  transition: background 0.2s, color 0.2s;
}
.svb-trigger-btn:hover { background: rgba(99,102,241,0.18); color: #c7d2fe; }

.svb-overlay {
  position: fixed; inset: 0; z-index: var(--z-tooltip); display: flex;
  align-items: center; justify-content: center;
  background: rgba(0,0,0,0.55); backdrop-filter: blur(4px);
}
.svb-modal {
  width: 640px; max-width: 95vw; max-height: 90vh; display: flex; flex-direction: column;
  background: #1e1e2e; border: 1px solid rgba(255,255,255,0.08); border-radius: 12px;
  box-shadow: 0 24px 64px rgba(0,0,0,0.5); overflow: hidden;
}
.svb-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 20px; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.svb-header-title { font-size: 16px; font-weight: 700; color: #e2e8f0; }
.svb-header-actions { display: flex; align-items: center; gap: 8px; }
.svb-close-btn {
  background: none; border: none; color: #94a3b8; font-size: 18px; cursor: pointer;
  padding: 2px 6px; border-radius: 4px; transition: color 0.2s;
}
.svb-close-btn:hover { color: #ef4444; }
.svb-mode-toggle {
  padding: 4px 12px; font-size: 12px; border-radius: 4px; cursor: pointer;
  background: rgba(99,102,241,0.12); color: #a5b4fc; border: 1px solid rgba(99,102,241,0.25);
  transition: background 0.2s;
}
.svb-mode-toggle:hover { background: rgba(99,102,241,0.25); }

.svb-body { flex: 1; overflow-y: auto; padding: 16px 20px; }
.svb-title-input {
  width: 100%; padding: 10px 12px; font-size: 18px; font-weight: 700;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
  border-radius: 6px; color: #e2e8f0; margin-bottom: 16px; box-sizing: border-box;
}
.svb-title-input::placeholder { color: #64748b; }

.svb-add-row {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.svb-add-label { color: #94a3b8; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; }
.svb-add-types { display: flex; flex-wrap: wrap; gap: 4px; }
.svb-add-type-btn {
  padding: 4px 10px; font-size: 11px; border-radius: 4px; cursor: pointer;
  background: rgba(255,255,255,0.04); color: #94a3b8; border: 1px solid rgba(255,255,255,0.08);
  transition: background 0.2s, color 0.2s;
}
.svb-add-type-btn:hover { background: rgba(99,102,241,0.15); color: #c7d2fe; border-color: rgba(99,102,241,0.3); }

.svb-question {
  background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.06);
  border-left: 3px solid #6366f1; border-radius: 8px; padding: 12px 14px;
  margin-bottom: 10px; transition: border-color 0.2s;
}
.svb-question:hover { border-left-color: #818cf8; }
.svb-q-header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.svb-q-type-badge {
  padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 600;
  background: rgba(99,102,241,0.15); color: #a5b4fc;
}
.svb-type-likert { background: rgba(99,102,241,0.15); color: #a5b4fc; }
.svb-type-multiple_choice { background: rgba(16,185,129,0.15); color: #6ee7b7; }
.svb-type-checkbox { background: rgba(245,158,11,0.15); color: #fcd34d; }
.svb-type-open_ended { background: rgba(236,72,153,0.15); color: #f9a8d4; }
.svb-type-matrix { background: rgba(14,165,233,0.15); color: #7dd3fc; }
.svb-type-dropdown { background: rgba(168,85,247,0.15); color: #d8b4fe; }
.svb-type-rating { background: rgba(245,158,11,0.15); color: #fcd34d; }
.svb-q-num { color: #64748b; font-size: 12px; font-weight: 600; }
.svb-q-required-label { font-size: 11px; color: #94a3b8; display: flex; align-items: center; gap: 4px; cursor: pointer; }
.svb-q-move-btn, .svb-q-delete-btn {
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08);
  color: #64748b; padding: 2px 6px; border-radius: 3px; cursor: pointer;
  font-size: 11px; transition: background 0.2s, color 0.2s;
}
.svb-q-move-btn:hover { background: rgba(99,102,241,0.15); color: #a5b4fc; }
.svb-q-delete-btn:hover { background: rgba(239,68,68,0.15); color: #fca5a5; }
.svb-q-text {
  width: 100%; padding: 8px 10px; font-size: 14px; box-sizing: border-box;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08);
  border-radius: 4px; color: #e2e8f0; margin-bottom: 8px;
}
.svb-q-text::placeholder { color: #475569; }

.svb-options-list { padding-left: 4px; }
.svb-option-row { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.svb-option-input {
  flex: 1; padding: 5px 8px; font-size: 13px;
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06);
  border-radius: 4px; color: #cbd5e1; box-sizing: border-box;
}
.svb-del-option-btn {
  background: none; border: none; color: #64748b; cursor: pointer; font-size: 12px;
  padding: 2px 4px; border-radius: 3px; transition: color 0.2s;
}
.svb-del-option-btn:hover { color: #ef4444; }
.svb-add-option-btn {
  padding: 3px 10px; font-size: 12px; color: #6366f1; background: none;
  border: 1px dashed rgba(99,102,241,0.3); border-radius: 4px; cursor: pointer;
  margin-top: 4px; transition: background 0.2s;
}
.svb-add-option-btn:hover { background: rgba(99,102,241,0.08); }

.svb-matrix-editor { display: flex; gap: 16px; flex-wrap: wrap; }
.svb-matrix-section { flex: 1; min-width: 140px; }
.svb-matrix-section strong { color: #94a3b8; font-size: 12px; display: block; margin-bottom: 4px; }
.svb-row-input, .svb-col-input {
  display: block; width: 100%; padding: 4px 8px; font-size: 12px; margin-bottom: 3px;
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06);
  border-radius: 3px; color: #cbd5e1; box-sizing: border-box;
}

.svb-likert-labels { display: flex; gap: 4px; }
.svb-likert-input {
  flex: 1; padding: 5px 6px; font-size: 12px; text-align: center;
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06);
  border-radius: 3px; color: #cbd5e1; box-sizing: border-box;
}
.svb-rating-info { color: #64748b; font-size: 12px; font-style: italic; }

.svb-empty { color: #475569; font-size: 14px; text-align: center; padding: 32px 0; }

/* Preview mode */
.svb-preview { padding: 4px 0; }
.svb-preview-title { color: #e2e8f0; font-size: 22px; margin: 0 0 20px; padding-bottom: 8px; border-bottom: 2px solid #6366f1; }
.svb-preview-question {
  background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px; padding: 14px 16px; margin-bottom: 12px;
}
.svb-preview-q-label { font-weight: 600; color: #e2e8f0; margin-bottom: 10px; font-size: 14px; }
.svb-required-star { color: #ef4444; font-weight: 700; }
.svb-preview-likert { display: flex; gap: 12px; flex-wrap: wrap; }
.svb-preview-likert-opt { font-size: 13px; color: #94a3b8; display: flex; align-items: center; gap: 4px; }
.svb-preview-opt { display: block; font-size: 13px; color: #94a3b8; margin: 6px 0; }
.svb-preview-input {
  width: 100%; padding: 8px 10px; font-size: 13px; box-sizing: border-box;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
  border-radius: 4px; color: #cbd5e1;
}
textarea.svb-preview-input { resize: vertical; }
select.svb-preview-input { appearance: auto; }
.svb-preview-matrix { width: 100%; border-collapse: collapse; margin-top: 8px; }
.svb-preview-matrix th, .svb-preview-matrix td {
  border: 1px solid rgba(255,255,255,0.08); padding: 6px 10px; text-align: center;
  font-size: 12px; color: #94a3b8;
}
.svb-preview-matrix th { background: rgba(255,255,255,0.03); color: #cbd5e1; font-weight: 600; }
.svb-preview-rating { font-size: 22px; color: #f59e0b; letter-spacing: 4px; margin-top: 4px; }
.svb-preview-star { cursor: default; }

.svb-footer {
  display: flex; gap: 6px; padding: 12px 20px; flex-wrap: wrap;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.svb-footer-btn {
  padding: 6px 14px; font-size: 12px; border-radius: 5px; cursor: pointer;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
  color: #94a3b8; transition: background 0.2s, color 0.2s;
}
.svb-footer-btn:hover { background: rgba(255,255,255,0.08); color: #e2e8f0; }

/* Light theme overrides */
[data-theme="light"] .svb-trigger-btn { color: #6366f1; background: rgba(99,102,241,0.06); border-color: rgba(99,102,241,0.25); }
[data-theme="light"] .svb-trigger-btn:hover { background: rgba(99,102,241,0.12); }
[data-theme="light"] .svb-modal { background: #ffffff; border-color: rgba(0,0,0,0.08); box-shadow: 0 24px 64px rgba(0,0,0,0.15); }
[data-theme="light"] .svb-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .svb-header-title { color: #1e293b; }
[data-theme="light"] .svb-close-btn { color: #94a3b8; }
[data-theme="light"] .svb-close-btn:hover { color: #ef4444; }
[data-theme="light"] .svb-title-input { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #1e293b; }
[data-theme="light"] .svb-title-input::placeholder { color: #94a3b8; }
[data-theme="light"] .svb-add-label { color: #64748b; }
[data-theme="light"] .svb-add-type-btn { background: rgba(0,0,0,0.02); color: #64748b; border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .svb-add-type-btn:hover { background: rgba(99,102,241,0.08); color: #6366f1; }
[data-theme="light"] .svb-question { background: rgba(0,0,0,0.01); border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .svb-q-text { background: #fff; border-color: rgba(0,0,0,0.1); color: #334155; }
[data-theme="light"] .svb-option-input { background: #fff; border-color: rgba(0,0,0,0.08); color: #334155; }
[data-theme="light"] .svb-row-input, [data-theme="light"] .svb-col-input { background: #fff; border-color: rgba(0,0,0,0.08); color: #334155; }
[data-theme="light"] .svb-likert-input { background: #fff; border-color: rgba(0,0,0,0.08); color: #334155; }
[data-theme="light"] .svb-preview-title { color: #1e293b; }
[data-theme="light"] .svb-preview-question { background: rgba(0,0,0,0.01); border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .svb-preview-q-label { color: #1e293b; }
[data-theme="light"] .svb-preview-likert-opt, [data-theme="light"] .svb-preview-opt { color: #334155; }
[data-theme="light"] .svb-preview-input { background: #fff; border-color: rgba(0,0,0,0.12); color: #334155; }
[data-theme="light"] .svb-preview-matrix th, [data-theme="light"] .svb-preview-matrix td { border-color: rgba(0,0,0,0.08); color: #334155; }
[data-theme="light"] .svb-preview-matrix th { background: rgba(0,0,0,0.02); color: #1e293b; }
[data-theme="light"] .svb-footer { border-top-color: rgba(0,0,0,0.06); }
[data-theme="light"] .svb-footer-btn { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #64748b; }
[data-theme="light"] .svb-footer-btn:hover { background: rgba(0,0,0,0.05); color: #1e293b; }
[data-theme="light"] .svb-empty { color: #94a3b8; }

/* Responsive */
@media (max-width: 640px) {
  .svb-modal { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; }
  .svb-body { padding: 12px 14px; }
  .svb-likert-labels { flex-direction: column; }
  .svb-matrix-editor { flex-direction: column; }
  .svb-preview-likert { flex-direction: column; gap: 6px; }
  .svb-footer { flex-direction: column; }
  .svb-footer-btn { width: 100%; text-align: center; }
  .svb-add-types { gap: 3px; }
  .svb-add-type-btn { font-size: 10px; padding: 3px 7px; }
}

/* ══════════════════════════════════════════════════════════════════ */
/* ██  PICO Framework Builder                                     ██ */
/* ══════════════════════════════════════════════════════════════════ */

/* Floating action button */
.pico-fab {
  position: fixed; bottom: 24px; right: 90px; z-index: var(--z-popover);
  width: 48px; height: 48px; border-radius: 50%;
  background: #3b82f6; border: none; color: #fff;
  font-size: 22px; cursor: pointer;
  box-shadow: 0 4px 16px rgba(59,130,246,0.4);
  transition: transform 0.2s, box-shadow 0.2s;
  display: flex; align-items: center; justify-content: center;
}
.pico-fab:hover { transform: scale(1.1); box-shadow: 0 6px 24px rgba(59,130,246,0.5); }

/* Toolbar trigger */
.pico-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 14px; border-radius: 8px; border: 1px solid rgba(59,130,246,0.2);
  background: rgba(59,130,246,0.08); color: #60a5fa; font-size: 13px;
  cursor: pointer; transition: background 0.2s, border-color 0.2s;
}
.pico-trigger-btn:hover { background: rgba(59,130,246,0.15); border-color: rgba(59,130,246,0.4); color: #93c5fd; }

/* Overlay */
.pico-overlay {
  position: fixed; inset: 0; z-index: var(--z-tooltip);
  background: rgba(0,0,0,0.55); backdrop-filter: blur(4px);
  display: flex; justify-content: center; align-items: center;
  opacity: 0; transition: opacity 0.25s;
}
.pico-panel-visible { opacity: 1; }

/* Panel */
.pico-panel {
  width: 640px; max-width: 95vw; max-height: 90vh;
  background: #1e1e2e; border: 1px solid rgba(59,130,246,0.15);
  border-radius: 16px; display: flex; flex-direction: column;
  box-shadow: 0 24px 64px rgba(0,0,0,0.5);
  overflow: hidden; transform: translateY(10px);
  transition: transform 0.25s;
}
.pico-panel-visible .pico-panel { transform: translateY(0); }

/* Header */
.pico-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid rgba(255,255,255,0.06);
  background: rgba(59,130,246,0.04);
}
.pico-header-left { display: flex; align-items: center; gap: 10px; }
.pico-header-icon { font-size: 20px; }
.pico-title { font-size: 16px; font-weight: 700; color: #e2e8f0; }
.pico-close-btn {
  background: none; border: none; color: #64748b; font-size: 24px;
  cursor: pointer; line-height: 1; padding: 0 4px; transition: color 0.2s;
}
.pico-close-btn:hover { color: #ef4444; }

/* Body */
.pico-body { flex: 1; overflow-y: auto; padding: 18px 20px; }

/* PICO sections */
.pico-sections { display: flex; flex-direction: column; gap: 16px; }

.pico-section {
  border-left: 4px solid #64748b; padding: 14px 16px;
  background: rgba(255,255,255,0.02); border-radius: 0 10px 10px 0;
  transition: background 0.2s;
}
.pico-section:hover { background: rgba(255,255,255,0.035); }

/* Colored borders per component */
.pico-section[data-pico-color="population"]   { border-left-color: #3b82f6; }
.pico-section[data-pico-color="intervention"] { border-left-color: #22c55e; }
.pico-section[data-pico-color="comparison"]   { border-left-color: #f59e0b; }
.pico-section[data-pico-color="outcome"]      { border-left-color: #a855f7; }

.pico-section-header {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 10px;
}

.pico-letter-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 8px;
  font-size: 14px; font-weight: 700; color: #fff;
}

.pico-section-title {
  font-size: 14px; font-weight: 600; color: #e2e8f0;
}

/* Input */
.pico-input {
  width: 100%; padding: 10px 12px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.08); background: rgba(0,0,0,0.2);
  color: #e2e8f0; font-size: 13px; font-family: inherit;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.pico-input::placeholder { color: #475569; }
.pico-input:focus {
  outline: none; border-color: rgba(59,130,246,0.5);
  box-shadow: 0 0 0 3px rgba(59,130,246,0.1);
}

/* Helper chips */
.pico-chips {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px;
}

.pico-chip {
  padding: 4px 10px; border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04); color: #94a3b8;
  font-size: 11px; cursor: pointer; transition: all 0.2s;
  white-space: nowrap;
}
.pico-chip:hover {
  background: rgba(59,130,246,0.12); border-color: rgba(59,130,246,0.3);
  color: #60a5fa;
}

/* Action buttons */
.pico-actions {
  display: flex; gap: 10px; margin-top: 20px;
}

.pico-gen-question-btn {
  flex: 1; padding: 10px 16px; border-radius: 8px; border: none;
  background: #3b82f6; color: #fff; font-size: 13px; font-weight: 600;
  cursor: pointer; transition: background 0.2s;
}
.pico-gen-question-btn:hover { background: #2563eb; }

.pico-gen-search-btn {
  flex: 1; padding: 10px 16px; border-radius: 8px;
  border: 1px solid rgba(59,130,246,0.3);
  background: rgba(59,130,246,0.1); color: #60a5fa;
  font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.2s;
}
.pico-gen-search-btn:hover { background: rgba(59,130,246,0.2); border-color: rgba(59,130,246,0.5); }

/* Output preview */
.pico-output {
  margin-top: 20px; display: flex; flex-direction: column; gap: 12px;
}

.pico-output-section {
  position: relative; padding: 14px 16px;
  background: rgba(59,130,246,0.04); border: 1px solid rgba(59,130,246,0.1);
  border-radius: 10px;
}

.pico-output-label {
  font-size: 11px; font-weight: 600; color: #3b82f6;
  text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 8px;
}

.pico-output-text {
  font-size: 13px; color: #cbd5e1; line-height: 1.6;
  word-break: break-word;
}
.pico-output-text.pico-mono {
  font-family: 'SF Mono', Monaco, Consolas, monospace;
  font-size: 12px;
}

.pico-copy-btn {
  position: absolute; top: 10px; right: 12px; padding: 4px 10px;
  border-radius: 6px; border: 1px solid rgba(59,130,246,0.2);
  background: rgba(59,130,246,0.08); color: #60a5fa; font-size: 11px;
  cursor: pointer; transition: all 0.2s;
}
.pico-copy-btn:hover { background: rgba(59,130,246,0.2); color: #93c5fd; }

/* Footer actions */
.pico-footer-actions {
  display: flex; gap: 8px; margin-top: 18px;
  padding-top: 14px; border-top: 1px solid rgba(255,255,255,0.06);
}

.pico-save-btn {
  padding: 8px 16px; border-radius: 7px; border: none;
  background: rgba(59,130,246,0.15); color: #60a5fa; font-size: 12px;
  font-weight: 500; cursor: pointer; transition: background 0.2s;
}
.pico-save-btn:hover { background: rgba(59,130,246,0.25); }

.pico-export-btn {
  padding: 8px 16px; border-radius: 7px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03); color: #94a3b8; font-size: 12px;
  cursor: pointer; transition: all 0.2s;
}
.pico-export-btn:hover { background: rgba(255,255,255,0.07); color: #e2e8f0; }

.pico-clear-btn {
  padding: 8px 16px; border-radius: 7px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03); color: #94a3b8; font-size: 12px;
  cursor: pointer; transition: all 0.2s; margin-left: auto;
}
.pico-clear-btn:hover { background: rgba(239,68,68,0.12); color: #f87171; border-color: rgba(239,68,68,0.2); }

/* History section */
.pico-history { margin-top: 20px; }
.pico-history-title {
  font-size: 14px; font-weight: 600; color: #e2e8f0;
  margin-bottom: 12px; padding-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.pico-history-list { display: flex; flex-direction: column; gap: 10px; }

.pico-history-item {
  background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px; padding: 12px 14px;
  transition: background 0.2s;
}
.pico-history-item:hover { background: rgba(255,255,255,0.04); }

.pico-history-date { font-size: 11px; color: #64748b; margin-bottom: 4px; }
.pico-history-question { font-size: 13px; color: #e2e8f0; line-height: 1.5; margin-bottom: 8px; }

.pico-history-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }

.pico-tag {
  padding: 2px 8px; border-radius: 4px; font-size: 10px; font-weight: 500;
  white-space: nowrap; max-width: 200px; overflow: hidden; text-overflow: ellipsis;
}
.pico-tag-p { background: rgba(59,130,246,0.12); color: #60a5fa; }
.pico-tag-i { background: rgba(34,197,94,0.12); color: #4ade80; }
.pico-tag-c { background: rgba(245,158,11,0.12); color: #fbbf24; }
.pico-tag-o { background: rgba(168,85,247,0.12); color: #c084fc; }

.pico-history-btns { display: flex; gap: 6px; }

.pico-history-load-btn {
  padding: 4px 12px; border-radius: 5px; border: 1px solid rgba(59,130,246,0.2);
  background: rgba(59,130,246,0.08); color: #60a5fa; font-size: 11px;
  cursor: pointer; transition: all 0.2s;
}
.pico-history-load-btn:hover { background: rgba(59,130,246,0.18); }

.pico-history-del-btn {
  padding: 4px 12px; border-radius: 5px; border: 1px solid rgba(255,255,255,0.06);
  background: transparent; color: #64748b; font-size: 11px;
  cursor: pointer; transition: all 0.2s;
}
.pico-history-del-btn:hover { background: rgba(239,68,68,0.1); color: #f87171; border-color: rgba(239,68,68,0.2); }

.pico-empty { font-size: 12px; color: #64748b; text-align: center; padding: 16px 0; }

/* ── PICO Light theme overrides ──────────────────────────────────── */
[data-theme="light"] .pico-fab { box-shadow: 0 4px 16px rgba(59,130,246,0.3); }
[data-theme="light"] .pico-trigger-btn { background: rgba(59,130,246,0.06); border-color: rgba(59,130,246,0.15); color: #2563eb; }
[data-theme="light"] .pico-trigger-btn:hover { background: rgba(59,130,246,0.12); color: #1d4ed8; }
[data-theme="light"] .pico-overlay { background: rgba(0,0,0,0.3); }
[data-theme="light"] .pico-panel { background: #fff; border-color: rgba(0,0,0,0.08); box-shadow: 0 24px 64px rgba(0,0,0,0.15); }
[data-theme="light"] .pico-header { border-bottom-color: rgba(0,0,0,0.06); background: rgba(59,130,246,0.03); }
[data-theme="light"] .pico-title { color: #1e293b; }
[data-theme="light"] .pico-close-btn { color: #94a3b8; }
[data-theme="light"] .pico-section { background: rgba(0,0,0,0.01); }
[data-theme="light"] .pico-section:hover { background: rgba(0,0,0,0.02); }
[data-theme="light"] .pico-section-title { color: #1e293b; }
[data-theme="light"] .pico-input { background: #fff; border-color: rgba(0,0,0,0.1); color: #334155; }
[data-theme="light"] .pico-input::placeholder { color: #94a3b8; }
[data-theme="light"] .pico-input:focus { border-color: rgba(59,130,246,0.5); box-shadow: 0 0 0 3px rgba(59,130,246,0.08); }
[data-theme="light"] .pico-chip { background: rgba(0,0,0,0.03); border-color: rgba(0,0,0,0.08); color: #64748b; }
[data-theme="light"] .pico-chip:hover { background: rgba(59,130,246,0.08); border-color: rgba(59,130,246,0.2); color: #2563eb; }
[data-theme="light"] .pico-gen-question-btn { background: #3b82f6; color: #fff; }
[data-theme="light"] .pico-gen-question-btn:hover { background: #2563eb; }
[data-theme="light"] .pico-gen-search-btn { background: rgba(59,130,246,0.06); border-color: rgba(59,130,246,0.2); color: #2563eb; }
[data-theme="light"] .pico-output-section { background: rgba(59,130,246,0.03); border-color: rgba(59,130,246,0.08); }
[data-theme="light"] .pico-output-label { color: #2563eb; }
[data-theme="light"] .pico-output-text { color: #334155; }
[data-theme="light"] .pico-copy-btn { background: rgba(59,130,246,0.06); border-color: rgba(59,130,246,0.12); color: #2563eb; }
[data-theme="light"] .pico-copy-btn:hover { background: rgba(59,130,246,0.12); color: #1d4ed8; }
[data-theme="light"] .pico-footer-actions { border-top-color: rgba(0,0,0,0.06); }
[data-theme="light"] .pico-save-btn { background: rgba(59,130,246,0.08); color: #2563eb; }
[data-theme="light"] .pico-export-btn { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.08); color: #64748b; }
[data-theme="light"] .pico-clear-btn { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.08); color: #64748b; }
[data-theme="light"] .pico-history-title { color: #1e293b; border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .pico-history-item { background: rgba(0,0,0,0.01); border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .pico-history-item:hover { background: rgba(0,0,0,0.03); }
[data-theme="light"] .pico-history-date { color: #94a3b8; }
[data-theme="light"] .pico-history-question { color: #1e293b; }
[data-theme="light"] .pico-tag-p { background: rgba(59,130,246,0.08); color: #2563eb; }
[data-theme="light"] .pico-tag-i { background: rgba(34,197,94,0.08); color: #16a34a; }
[data-theme="light"] .pico-tag-c { background: rgba(245,158,11,0.08); color: #d97706; }
[data-theme="light"] .pico-tag-o { background: rgba(168,85,247,0.08); color: #9333ea; }
[data-theme="light"] .pico-history-load-btn { background: rgba(59,130,246,0.06); border-color: rgba(59,130,246,0.15); color: #2563eb; }
[data-theme="light"] .pico-history-del-btn { color: #94a3b8; border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .pico-history-del-btn:hover { background: rgba(239,68,68,0.06); color: #dc2626; }
[data-theme="light"] .pico-empty { color: #94a3b8; }

/* ── PICO Responsive ─────────────────────────────────────────────── */
@media (max-width: 640px) {
  .pico-panel { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; }
  .pico-body { padding: 14px 16px; }
  .pico-actions { flex-direction: column; }
  .pico-footer-actions { flex-wrap: wrap; }
  .pico-clear-btn { margin-left: 0; }
  .pico-fab { bottom: 16px; right: 16px; }
}

/* ══════════════════════════════════════════════════════════════════ */
/* ██  Bias Assessment Tool                                       ██ */
/* ══════════════════════════════════════════════════════════════════ */

.bat-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 16px;
  background: rgba(168,85,247,0.12); color: #c084fc; border: 1px solid rgba(168,85,247,0.25);
  border-radius: 8px; font-size: 13px; font-weight: 500; cursor: pointer; transition: all 0.2s;
}
.bat-trigger-btn:hover { background: rgba(168,85,247,0.22); color: #d8b4fe; }

.bat-overlay {
  display: none; position: fixed; inset: 0; z-index: var(--z-tooltip);
  background: rgba(0,0,0,0.55); backdrop-filter: blur(4px);
  justify-content: center; align-items: center;
}
.bat-modal {
  width: 600px; max-width: 95vw; max-height: 90vh; display: flex; flex-direction: column;
  background: #1e1e2e; border: 1px solid rgba(255,255,255,0.08); border-radius: 14px;
  box-shadow: 0 24px 80px rgba(0,0,0,0.45); overflow: hidden;
}
.bat-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.bat-title { font-size: 16px; font-weight: 600; color: #e2e8f0; }
.bat-close-btn {
  background: none; border: none; color: #94a3b8; font-size: 22px; cursor: pointer;
  padding: 0 4px; line-height: 1;
}
.bat-close-btn:hover { color: #e2e8f0; }

.bat-body { flex: 1; overflow-y: auto; padding: 12px 20px; }

.bat-section { margin-bottom: 6px; border: 1px solid rgba(255,255,255,0.06); border-radius: 8px; overflow: hidden; }
.bat-section-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; cursor: pointer; background: rgba(255,255,255,0.03); transition: background 0.15s;
}
.bat-section-header:hover { background: rgba(255,255,255,0.06); }
.bat-section-header.bat-expanded { background: rgba(255,255,255,0.05); }
.bat-section-name { font-size: 14px; font-weight: 500; color: #cbd5e1; }

.bat-traffic { display: inline-flex; align-items: center; flex-shrink: 0; }
.bat-traffic svg { display: block; }
.bat-traffic-low svg circle { fill: #22c55e; }
.bat-traffic-moderate svg circle { fill: #eab308; }
.bat-traffic-high svg circle { fill: #ef4444; }
.bat-traffic-unclear svg circle { fill: #6b7280; }

.bat-section-body { padding: 8px 14px 14px; border-top: 1px solid rgba(255,255,255,0.04); }

.bat-item { padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,0.03); }
.bat-item:last-child { border-bottom: none; }
.bat-item-text { font-size: 13px; color: #94a3b8; margin-bottom: 6px; }
.bat-radio-group { display: flex; gap: 12px; margin-bottom: 6px; }
.bat-radio-label {
  display: inline-flex; align-items: center; gap: 4px; font-size: 12px;
  color: #94a3b8; cursor: pointer; padding: 2px 8px; border-radius: 4px; transition: background 0.15s;
}
.bat-radio-label:hover { background: rgba(255,255,255,0.05); }
.bat-radio-yes input:checked ~ { color: #22c55e; }
.bat-radio-label.bat-radio-yes { color: #6ee7b7; }
.bat-radio-label.bat-radio-no { color: #fca5a5; }
.bat-radio-label.bat-radio-unclear { color: #a1a1aa; }

.bat-item-notes {
  width: 100%; padding: 5px 8px; font-size: 12px;
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06);
  border-radius: 4px; color: #cbd5e1; outline: none; transition: border-color 0.2s;
}
.bat-item-notes::placeholder { color: #4b5563; }
.bat-item-notes:focus { border-color: rgba(168,85,247,0.4); }

.bat-summary { padding: 12px 20px; border-top: 1px solid rgba(255,255,255,0.06); }
.bat-summary-title { font-size: 14px; color: #cbd5e1; margin-bottom: 8px; }
.bat-overall-low { color: #22c55e; }
.bat-overall-moderate { color: #eab308; }
.bat-overall-high { color: #ef4444; }
.bat-overall-unclear { color: #6b7280; }

.bat-risk-chart {
  display: flex; height: 22px; border-radius: 6px; overflow: hidden; margin-bottom: 10px;
  background: rgba(255,255,255,0.04);
}
.bat-risk-bar {
  display: flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 600; color: #fff; transition: width 0.3s;
}
.bat-risk-bar-low { background: #22c55e; }
.bat-risk-bar-moderate { background: #eab308; }
.bat-risk-bar-high { background: #ef4444; }
.bat-risk-bar-unclear { background: #6b7280; }

.bat-mitigations { margin-top: 10px; }
.bat-mitigations-title { font-size: 13px; font-weight: 600; color: #e2e8f0; margin-bottom: 6px; }
.bat-mitigation-group { margin-bottom: 8px; font-size: 12px; color: #cbd5e1; }
.bat-mitigation-group ul { margin: 4px 0 0 18px; padding: 0; }
.bat-mitigation-item { color: #94a3b8; margin-bottom: 2px; }

.bat-footer {
  display: flex; gap: 8px; padding: 12px 20px; border-top: 1px solid rgba(255,255,255,0.06);
  flex-wrap: wrap;
}
.bat-footer-btn {
  padding: 6px 14px; font-size: 12px; font-weight: 500; border-radius: 6px; cursor: pointer;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); color: #94a3b8;
  transition: all 0.15s;
}
.bat-footer-btn:hover { background: rgba(255,255,255,0.08); color: #e2e8f0; }

/* Light theme overrides */
[data-theme="light"] .bat-trigger-btn { background: rgba(168,85,247,0.08); color: #7c3aed; border-color: rgba(168,85,247,0.2); }
[data-theme="light"] .bat-trigger-btn:hover { background: rgba(168,85,247,0.15); color: #6d28d9; }
[data-theme="light"] .bat-modal { background: #ffffff; border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .bat-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .bat-title { color: #1e293b; }
[data-theme="light"] .bat-close-btn { color: #64748b; }
[data-theme="light"] .bat-close-btn:hover { color: #1e293b; }
[data-theme="light"] .bat-section { border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .bat-section-header { background: rgba(0,0,0,0.02); }
[data-theme="light"] .bat-section-header:hover { background: rgba(0,0,0,0.04); }
[data-theme="light"] .bat-section-name { color: #334155; }
[data-theme="light"] .bat-section-body { border-top-color: rgba(0,0,0,0.04); }
[data-theme="light"] .bat-item { border-bottom-color: rgba(0,0,0,0.04); }
[data-theme="light"] .bat-item-text { color: #475569; }
[data-theme="light"] .bat-radio-label { color: #64748b; }
[data-theme="light"] .bat-radio-label:hover { background: rgba(0,0,0,0.04); }
[data-theme="light"] .bat-radio-label.bat-radio-yes { color: #16a34a; }
[data-theme="light"] .bat-radio-label.bat-radio-no { color: #dc2626; }
[data-theme="light"] .bat-radio-label.bat-radio-unclear { color: #71717a; }
[data-theme="light"] .bat-item-notes { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.08); color: #334155; }
[data-theme="light"] .bat-item-notes::placeholder { color: #94a3b8; }
[data-theme="light"] .bat-item-notes:focus { border-color: rgba(168,85,247,0.3); }
[data-theme="light"] .bat-summary { border-top-color: rgba(0,0,0,0.06); }
[data-theme="light"] .bat-summary-title { color: #334155; }
[data-theme="light"] .bat-risk-chart { background: rgba(0,0,0,0.04); }
[data-theme="light"] .bat-mitigations-title { color: #1e293b; }
[data-theme="light"] .bat-mitigation-group { color: #334155; }
[data-theme="light"] .bat-mitigation-item { color: #64748b; }
[data-theme="light"] .bat-footer { border-top-color: rgba(0,0,0,0.06); }
[data-theme="light"] .bat-footer-btn { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #64748b; }
[data-theme="light"] .bat-footer-btn:hover { background: rgba(0,0,0,0.05); color: #1e293b; }

/* Responsive */
@media (max-width: 640px) {
  .bat-modal { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; }
  .bat-body { padding: 10px 14px; }
  .bat-footer { flex-direction: column; }
  .bat-footer-btn { width: 100%; text-align: center; }
  .bat-radio-group { flex-direction: column; gap: 4px; }
}

/* ══════════════════════════════════════════════════════════════════ */
/* Study Registry Lookup                                            */
/* ══════════════════════════════════════════════════════════════════ */

.srl-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px;
  background: rgba(168,85,247,0.12); border: 1px solid rgba(168,85,247,0.25);
  border-radius: 8px; color: #c4b5fd; font-size: 13px; cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.srl-trigger-btn:hover { background: rgba(168,85,247,0.22); border-color: rgba(168,85,247,0.45); }

.srl-overlay {
  position: fixed; inset: 0; z-index: var(--z-max); display: flex;
  align-items: center; justify-content: center;
  background: rgba(0,0,0,0.55); backdrop-filter: blur(4px);
}
.srl-modal {
  width: 640px; max-width: 95vw; max-height: 88vh; display: flex; flex-direction: column;
  background: #1e1e2e; border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px; box-shadow: 0 20px 60px rgba(0,0,0,0.5); overflow: hidden;
}
.srl-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.srl-title { font-size: 16px; font-weight: 600; color: #e2e8f0; }
.srl-close-btn {
  background: none; border: none; font-size: 22px; color: #94a3b8;
  cursor: pointer; line-height: 1; padding: 0 4px;
}
.srl-close-btn:hover { color: #f1f5f9; }

.srl-search-row { display: flex; gap: 8px; padding: 12px 18px 8px; }
.srl-search-input {
  flex: 1; padding: 8px 12px; background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1); border-radius: 8px;
  color: #e2e8f0; font-size: 13px; outline: none;
}
.srl-search-input::placeholder { color: #64748b; }
.srl-search-input:focus { border-color: rgba(168,85,247,0.4); }
.srl-search-btn {
  padding: 8px 16px; background: rgba(168,85,247,0.2); border: 1px solid rgba(168,85,247,0.3);
  border-radius: 8px; color: #c4b5fd; font-size: 13px; cursor: pointer;
}
.srl-search-btn:hover { background: rgba(168,85,247,0.35); }

.srl-filters { display: flex; gap: 8px; padding: 4px 18px 10px; flex-wrap: wrap; }
.srl-filter-select, .srl-date-input {
  padding: 6px 10px; background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1); border-radius: 6px;
  color: #e2e8f0; font-size: 12px; outline: none;
}
.srl-filter-select:focus, .srl-date-input:focus { border-color: rgba(168,85,247,0.4); }
.srl-date-input { width: 130px; }

.srl-tabs {
  display: flex; gap: 0; border-bottom: 1px solid rgba(255,255,255,0.06);
  padding: 0 18px;
}
.srl-tab {
  padding: 8px 18px; background: none; border: none; border-bottom: 2px solid transparent;
  color: #94a3b8; font-size: 13px; cursor: pointer; transition: color 0.15s, border-color 0.15s;
}
.srl-tab:hover { color: #e2e8f0; }
.srl-tab.srl-active { color: #c4b5fd; border-bottom-color: #a855f7; }

.srl-results { flex: 1; overflow-y: auto; padding: 12px 18px; }
.srl-card {
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px; padding: 14px; margin-bottom: 10px;
  transition: border-color 0.15s;
}
.srl-card:hover { border-color: rgba(168,85,247,0.25); }
.srl-card-header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.srl-card-id {
  font-size: 11px; font-family: monospace; padding: 2px 8px;
  background: rgba(99,102,241,0.15); color: #a5b4fc; border-radius: 4px;
}
.srl-card-title { font-size: 14px; font-weight: 600; color: #e2e8f0; margin-bottom: 8px; line-height: 1.4; }

.srl-status-badge {
  font-size: 11px; padding: 2px 8px; border-radius: 4px; font-weight: 500;
}
.srl-status-recruiting { background: rgba(34,197,94,0.15); color: #4ade80; }
.srl-status-completed { background: rgba(59,130,246,0.15); color: #60a5fa; }
.srl-status-active { background: rgba(250,204,21,0.15); color: #fbbf24; }
.srl-status-notyetrecruiting { background: rgba(168,85,247,0.15); color: #c4b5fd; }
.srl-status-terminated { background: rgba(239,68,68,0.15); color: #f87171; }

.srl-phase-badge {
  font-size: 11px; padding: 2px 8px; border-radius: 4px;
  background: rgba(255,255,255,0.06); color: #94a3b8;
}

.srl-card-meta {
  display: flex; flex-wrap: wrap; gap: 12px; font-size: 12px; color: #64748b; margin-bottom: 8px;
}
.srl-card-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.srl-card-tag {
  font-size: 11px; padding: 2px 8px; border-radius: 4px;
  background: rgba(59,130,246,0.1); color: #93c5fd;
}
.srl-card-tag-int { background: rgba(34,197,94,0.1); color: #86efac; }

.srl-save-btn {
  padding: 5px 14px; font-size: 12px; border-radius: 6px; cursor: pointer;
  background: rgba(168,85,247,0.12); border: 1px solid rgba(168,85,247,0.25); color: #c4b5fd;
  transition: background 0.15s;
}
.srl-save-btn:hover { background: rgba(168,85,247,0.25); }
.srl-saved-indicator {
  background: rgba(34,197,94,0.12); border-color: rgba(34,197,94,0.25); color: #4ade80;
}
.srl-saved-indicator:hover { background: rgba(239,68,68,0.15); color: #f87171; }

.srl-pagination { display: flex; justify-content: center; gap: 6px; padding: 8px 18px; }
.srl-page-btn {
  padding: 4px 10px; font-size: 12px; border-radius: 6px; cursor: pointer;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); color: #94a3b8;
}
.srl-page-btn:hover { background: rgba(255,255,255,0.08); color: #e2e8f0; }
.srl-page-btn.srl-page-active { background: rgba(168,85,247,0.2); border-color: rgba(168,85,247,0.3); color: #c4b5fd; }

.srl-footer {
  display: flex; justify-content: flex-end; padding: 10px 18px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.srl-export-btn {
  padding: 6px 16px; font-size: 12px; border-radius: 6px; cursor: pointer;
  background: rgba(59,130,246,0.12); border: 1px solid rgba(59,130,246,0.25); color: #93c5fd;
}
.srl-export-btn:hover { background: rgba(59,130,246,0.25); }

/* Light theme overrides */
[data-theme="light"] .srl-trigger-btn { background: rgba(168,85,247,0.08); border-color: rgba(168,85,247,0.2); color: #7c3aed; }
[data-theme="light"] .srl-trigger-btn:hover { background: rgba(168,85,247,0.15); }
[data-theme="light"] .srl-modal { background: #ffffff; border-color: rgba(0,0,0,0.08); box-shadow: 0 20px 60px rgba(0,0,0,0.15); }
[data-theme="light"] .srl-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .srl-title { color: #1e293b; }
[data-theme="light"] .srl-close-btn { color: #64748b; }
[data-theme="light"] .srl-close-btn:hover { color: #1e293b; }
[data-theme="light"] .srl-search-input { background: rgba(0,0,0,0.03); border-color: rgba(0,0,0,0.1); color: #1e293b; }
[data-theme="light"] .srl-search-input::placeholder { color: #94a3b8; }
[data-theme="light"] .srl-search-btn { background: rgba(168,85,247,0.1); border-color: rgba(168,85,247,0.2); color: #7c3aed; }
[data-theme="light"] .srl-filter-select, [data-theme="light"] .srl-date-input { background: rgba(0,0,0,0.03); border-color: rgba(0,0,0,0.1); color: #334155; }
[data-theme="light"] .srl-tabs { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .srl-tab { color: #64748b; }
[data-theme="light"] .srl-tab:hover { color: #1e293b; }
[data-theme="light"] .srl-tab.srl-active { color: #7c3aed; border-bottom-color: #7c3aed; }
[data-theme="light"] .srl-card { background: rgba(0,0,0,0.01); border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .srl-card:hover { border-color: rgba(168,85,247,0.2); }
[data-theme="light"] .srl-card-id { background: rgba(99,102,241,0.08); color: #6366f1; }
[data-theme="light"] .srl-card-title { color: #1e293b; }
[data-theme="light"] .srl-card-meta { color: #64748b; }
[data-theme="light"] .srl-card-tag { background: rgba(59,130,246,0.06); color: #2563eb; }
[data-theme="light"] .srl-card-tag-int { background: rgba(34,197,94,0.06); color: #16a34a; }
[data-theme="light"] .srl-phase-badge { background: rgba(0,0,0,0.04); color: #64748b; }
[data-theme="light"] .srl-save-btn { background: rgba(168,85,247,0.06); border-color: rgba(168,85,247,0.15); color: #7c3aed; }
[data-theme="light"] .srl-saved-indicator { background: rgba(34,197,94,0.06); border-color: rgba(34,197,94,0.15); color: #16a34a; }
[data-theme="light"] .srl-page-btn { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.06); color: #64748b; }
[data-theme="light"] .srl-page-btn.srl-page-active { background: rgba(168,85,247,0.1); border-color: rgba(168,85,247,0.2); color: #7c3aed; }
[data-theme="light"] .srl-footer { border-top-color: rgba(0,0,0,0.06); }
[data-theme="light"] .srl-export-btn { background: rgba(59,130,246,0.06); border-color: rgba(59,130,246,0.15); color: #2563eb; }

/* Responsive */
@media (max-width: 640px) {
  .srl-modal { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; }
  .srl-filters { flex-direction: column; }
  .srl-date-input { width: 100%; }
  .srl-card-meta { flex-direction: column; gap: 4px; }
  .srl-card-header { flex-wrap: wrap; }
}

/* ═══════════════════════════════════════════════════════════════════ */
/* ██  Data Extraction Table                                       ██ */
/* ═══════════════════════════════════════════════════════════════════ */

.det-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 16px; border-radius: 8px; border: 1px solid rgba(168,85,247,0.25);
  background: rgba(168,85,247,0.08); color: #c084fc; font-size: 0.85rem;
  cursor: pointer; transition: all 0.2s;
}
.det-trigger-btn:hover { background: rgba(168,85,247,0.18); border-color: rgba(168,85,247,0.4); }

.det-overlay {
  position: fixed; inset: 0; z-index: var(--z-tooltip);
  background: rgba(0,0,0,0.6); backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
}

.det-modal {
  width: 94vw; max-width: 1200px; max-height: 90vh;
  background: #1e1b2e; border: 1px solid rgba(168,85,247,0.2);
  border-radius: 16px; display: flex; flex-direction: column;
  box-shadow: 0 24px 80px rgba(0,0,0,0.5); overflow: hidden;
}

.det-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.det-title { font-size: 1.1rem; font-weight: 600; color: #e2e8f0; }
.det-close {
  width: 32px; height: 32px; border-radius: 8px; border: none;
  background: rgba(255,255,255,0.06); color: #94a3b8; font-size: 1.2rem;
  cursor: pointer; transition: all 0.2s;
}
.det-close:hover { background: rgba(239,68,68,0.15); color: #f87171; }

.det-toolbar {
  display: flex; gap: 8px; padding: 12px 20px; flex-wrap: wrap;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.det-btn {
  padding: 6px 14px; border-radius: 6px; border: 1px solid transparent;
  font-size: 0.8rem; cursor: pointer; transition: all 0.2s;
}
.det-btn-primary { background: rgba(99,102,241,0.15); border-color: rgba(99,102,241,0.3); color: #818cf8; }
.det-btn-primary:hover { background: rgba(99,102,241,0.25); }
.det-btn-secondary { background: rgba(34,197,94,0.1); border-color: rgba(34,197,94,0.25); color: #4ade80; }
.det-btn-secondary:hover { background: rgba(34,197,94,0.2); }
.det-btn-export { background: rgba(59,130,246,0.1); border-color: rgba(59,130,246,0.2); color: #60a5fa; }
.det-btn-export:hover { background: rgba(59,130,246,0.2); }

.det-table-wrap { flex: 1; overflow: auto; padding: 0 20px 12px; }
.det-table-scroll { overflow-x: auto; }

.det-table {
  width: 100%; border-collapse: collapse; font-size: 0.82rem;
}
.det-table thead th {
  position: sticky; top: 0; z-index: 2;
  background: #1e1b2e; padding: 10px 8px;
  text-align: left; color: #94a3b8; font-weight: 500;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  white-space: nowrap; user-select: none;
}
.det-col-header { position: relative; }
.det-col-name { cursor: pointer; }
.det-col-name:hover { color: #c084fc; }
.det-col-del {
  display: none; position: absolute; right: 2px; top: 50%; transform: translateY(-50%);
  width: 20px; height: 20px; border-radius: 4px; border: none;
  background: rgba(239,68,68,0.15); color: #f87171; font-size: 0.75rem;
  cursor: pointer; line-height: 1;
}
.det-col-header:hover .det-col-del { display: inline-flex; align-items: center; justify-content: center; }

.det-row-num { color: #475569; font-size: 0.75rem; width: 36px; text-align: center; }

.det-cell { padding: 2px 4px; }
.det-input {
  width: 100%; padding: 6px 8px; border-radius: 4px;
  border: 1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.04);
  color: #e2e8f0; font-size: 0.82rem; font-family: inherit;
  transition: border-color 0.2s;
}
.det-input:focus { outline: none; border-color: rgba(168,85,247,0.4); background: rgba(255,255,255,0.06); }
.det-textarea { resize: vertical; min-height: 32px; max-height: 120px; }

.det-actions-col { width: 50px; text-align: center; }
.det-row-del {
  width: 24px; height: 24px; border-radius: 4px; border: none;
  background: rgba(239,68,68,0.1); color: #f87171; font-size: 0.85rem;
  cursor: pointer; opacity: 0; transition: opacity 0.2s;
}
.det-row:hover .det-row-del { opacity: 1; }
.det-row-del:hover { background: rgba(239,68,68,0.25); }

.det-stats-row {
  display: flex; gap: 12px; flex-wrap: wrap; padding: 10px 20px;
  border-top: 1px solid rgba(255,255,255,0.06); font-size: 0.78rem;
}
.det-stat-label { color: #94a3b8; font-weight: 500; }
.det-stat-item { color: #cbd5e1; }
.det-stat-item strong { color: #a78bfa; }

.det-footer {
  padding: 10px 20px; border-top: 1px solid rgba(255,255,255,0.06);
  font-size: 0.75rem; color: #475569;
}

.det-empty {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 48px 20px; text-align: center;
}
.det-empty-icon { font-size: 2.5rem; margin-bottom: 12px; opacity: 0.5; }
.det-empty-title { font-size: 1.05rem; color: #94a3b8; margin-bottom: 8px; }
.det-empty-desc { font-size: 0.85rem; color: #64748b; max-width: 400px; line-height: 1.5; }

/* Light theme */
[data-theme="light"] .det-trigger-btn { background: rgba(168,85,247,0.06); border-color: rgba(168,85,247,0.15); color: #7c3aed; }
[data-theme="light"] .det-modal { background: #ffffff; border-color: rgba(0,0,0,0.1); box-shadow: 0 24px 80px rgba(0,0,0,0.15); }
[data-theme="light"] .det-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .det-title { color: #1e293b; }
[data-theme="light"] .det-close { background: rgba(0,0,0,0.04); color: #64748b; }
[data-theme="light"] .det-toolbar { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .det-btn-primary { background: rgba(99,102,241,0.08); color: #6366f1; }
[data-theme="light"] .det-btn-secondary { background: rgba(34,197,94,0.06); color: #16a34a; }
[data-theme="light"] .det-btn-export { background: rgba(59,130,246,0.06); color: #2563eb; }
[data-theme="light"] .det-table thead th { background: #ffffff; color: #64748b; border-bottom-color: rgba(0,0,0,0.08); }
[data-theme="light"] .det-input { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.08); color: #334155; }
[data-theme="light"] .det-input:focus { border-color: rgba(168,85,247,0.3); background: rgba(0,0,0,0.01); }
[data-theme="light"] .det-stats-row { border-top-color: rgba(0,0,0,0.06); }
[data-theme="light"] .det-stat-label { color: #64748b; }
[data-theme="light"] .det-stat-item { color: #334155; }
[data-theme="light"] .det-stat-item strong { color: #7c3aed; }
[data-theme="light"] .det-footer { border-top-color: rgba(0,0,0,0.06); color: #94a3b8; }
[data-theme="light"] .det-empty-title { color: #64748b; }
[data-theme="light"] .det-empty-desc { color: #94a3b8; }
[data-theme="light"] .det-row-num { color: #94a3b8; }

/* Responsive */
@media (max-width: 640px) {
  .det-modal { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; }
  .det-toolbar { gap: 6px; }
  .det-btn { padding: 5px 10px; font-size: 0.75rem; }
  .det-stats-row { flex-direction: column; gap: 4px; }
}

/* ── Methodology Checklist ──────────────────────────────────── */
.mc-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 16px;
  border-radius: 8px; border: 1px solid rgba(16,185,129,0.18);
  background: rgba(16,185,129,0.08); color: #34d399;
  font-size: 0.85rem; font-weight: 600; cursor: pointer; transition: background 0.15s, border-color 0.15s;
}
.mc-trigger-btn:hover { background: rgba(16,185,129,0.15); border-color: rgba(16,185,129,0.3); }

.mc-overlay {
  position: fixed; inset: 0; z-index: var(--z-max);
  background: rgba(0,0,0,0.55); display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(4px);
}

.mc-modal {
  width: 720px; max-width: 95vw; max-height: 85vh; display: flex; flex-direction: column;
  background: #1e1e2e; border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px; box-shadow: 0 24px 80px rgba(0,0,0,0.45); overflow: hidden;
}

.mc-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.mc-title { font-size: 1.1rem; font-weight: 700; color: #e2e8f0; }
.mc-close {
  width: 30px; height: 30px; border-radius: 8px; border: none;
  background: rgba(255,255,255,0.06); color: #94a3b8; font-size: 1rem;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.mc-close:hover { background: rgba(255,255,255,0.1); color: #e2e8f0; }

.mc-toolbar {
  display: flex; align-items: center; gap: 8px; padding: 10px 20px;
  border-bottom: 1px solid rgba(255,255,255,0.06); flex-wrap: wrap;
}

.mc-select {
  padding: 6px 12px; border-radius: 6px; border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.04); color: #e2e8f0; font-size: 0.85rem; cursor: pointer;
}
.mc-select:focus { outline: none; border-color: rgba(16,185,129,0.4); }

.mc-btn {
  padding: 6px 14px; border-radius: 6px; border: none; font-size: 0.8rem;
  font-weight: 600; cursor: pointer; transition: background 0.15s;
}
.mc-btn-secondary { background: rgba(99,102,241,0.1); color: #818cf8; }
.mc-btn-secondary:hover { background: rgba(99,102,241,0.2); }
.mc-btn-export { background: rgba(59,130,246,0.1); color: #60a5fa; }
.mc-btn-export:hover { background: rgba(59,130,246,0.2); }

.mc-progress-wrap {
  display: flex; align-items: center; gap: 12px; padding: 10px 20px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.mc-progress-bar {
  flex: 1; height: 8px; background: rgba(255,255,255,0.06); border-radius: 4px; overflow: hidden;
}
.mc-progress-fill {
  height: 100%; width: 0; background: linear-gradient(90deg, #10b981, #34d399);
  border-radius: 4px; transition: width 0.3s ease;
}
.mc-progress-label { font-size: 0.8rem; color: #94a3b8; white-space: nowrap; font-weight: 600; }

.mc-body {
  flex: 1; overflow-y: auto; padding: 16px 20px;
}

.mc-section { margin-bottom: 18px; }
.mc-section-title {
  font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em;
  color: #34d399; margin-bottom: 8px; padding-bottom: 4px;
  border-bottom: 1px solid rgba(16,185,129,0.15);
}

.mc-item {
  display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px;
  padding: 8px 10px; border-radius: 6px; margin-bottom: 4px;
  transition: background 0.15s;
}
.mc-item:hover { background: rgba(255,255,255,0.03); }
.mc-item-done { background: rgba(16,185,129,0.06); }
.mc-item-done .mc-label { color: #64748b; text-decoration: line-through; }

.mc-checkbox { margin-top: 3px; cursor: pointer; accent-color: #10b981; }

.mc-label { flex: 1; font-size: 0.85rem; color: #cbd5e1; line-height: 1.45; cursor: default; }

.mc-note-toggle {
  width: 24px; height: 24px; border-radius: 4px; border: none;
  background: rgba(255,255,255,0.04); color: #64748b; font-size: 0.8rem;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.mc-note-toggle:hover { background: rgba(255,255,255,0.08); color: #94a3b8; }

.mc-note-area {
  width: 100%; min-height: 48px; margin-top: 4px; padding: 8px 10px;
  border-radius: 6px; border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03); color: #e2e8f0; font-size: 0.82rem;
  font-family: inherit; resize: vertical;
}
.mc-note-area:focus { outline: none; border-color: rgba(16,185,129,0.3); }

.mc-complete-msg {
  text-align: center; padding: 16px; margin-top: 12px;
  background: rgba(16,185,129,0.08); border-radius: 8px;
  color: #34d399; font-weight: 600; font-size: 0.9rem;
}

.mc-footer {
  padding: 10px 20px; border-top: 1px solid rgba(255,255,255,0.06);
  font-size: 0.75rem; color: #475569;
}

/* Light theme */
[data-theme="light"] .mc-trigger-btn { background: rgba(16,185,129,0.06); border-color: rgba(16,185,129,0.15); color: #059669; }
[data-theme="light"] .mc-modal { background: #ffffff; border-color: rgba(0,0,0,0.1); box-shadow: 0 24px 80px rgba(0,0,0,0.15); }
[data-theme="light"] .mc-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .mc-title { color: #1e293b; }
[data-theme="light"] .mc-close { background: rgba(0,0,0,0.04); color: #64748b; }
[data-theme="light"] .mc-toolbar { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .mc-select { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #334155; }
[data-theme="light"] .mc-btn-secondary { background: rgba(99,102,241,0.08); color: #6366f1; }
[data-theme="light"] .mc-btn-export { background: rgba(59,130,246,0.06); color: #2563eb; }
[data-theme="light"] .mc-progress-bar { background: rgba(0,0,0,0.06); }
[data-theme="light"] .mc-progress-label { color: #64748b; }
[data-theme="light"] .mc-section-title { color: #059669; border-bottom-color: rgba(16,185,129,0.15); }
[data-theme="light"] .mc-label { color: #334155; }
[data-theme="light"] .mc-item-done .mc-label { color: #94a3b8; }
[data-theme="light"] .mc-note-area { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.08); color: #334155; }
[data-theme="light"] .mc-complete-msg { background: rgba(16,185,129,0.06); color: #059669; }
[data-theme="light"] .mc-footer { border-top-color: rgba(0,0,0,0.06); color: #94a3b8; }

/* Responsive */
@media (max-width: 640px) {
  .mc-modal { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; }
  .mc-toolbar { gap: 6px; }
  .mc-btn { padding: 5px 10px; font-size: 0.75rem; }
  .mc-progress-wrap { flex-direction: column; align-items: stretch; gap: 6px; }
}

/* ══════════════════════════════════════════════════════════════════ */
/* ██  Effect Size Calculator                                     ██ */
/* ══════════════════════════════════════════════════════════════════ */

.esc-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px;
  background: rgba(168,85,247,0.08); border: 1px solid rgba(168,85,247,0.2);
  border-radius: 8px; color: #c084fc; font-size: 0.85rem; font-weight: 600;
  cursor: pointer; transition: all 0.2s;
}
.esc-trigger-btn:hover { background: rgba(168,85,247,0.15); border-color: rgba(168,85,247,0.35); }

.esc-overlay {
  position: fixed; inset: 0; z-index: var(--z-tooltip);
  background: rgba(0,0,0,0.6); backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
}

.esc-modal {
  background: #1e1e2e; border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px; width: 560px; max-width: 95vw; max-height: 90vh;
  overflow-y: auto; box-shadow: 0 24px 80px rgba(0,0,0,0.4);
}

.esc-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 24px; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.esc-title { margin: 0; font-size: 1.15rem; font-weight: 700; color: #f1f5f9; }
.esc-close {
  width: 32px; height: 32px; border-radius: 8px; border: none;
  background: rgba(255,255,255,0.06); color: #94a3b8; font-size: 1rem;
  cursor: pointer; transition: all 0.15s;
}
.esc-close:hover { background: rgba(255,255,255,0.12); color: #f1f5f9; }

.esc-tab-bar {
  display: flex; gap: 4px; padding: 12px 24px;
  border-bottom: 1px solid rgba(255,255,255,0.06); flex-wrap: wrap;
}
.esc-tab {
  padding: 6px 14px; border-radius: 6px; border: 1px solid rgba(255,255,255,0.08);
  background: transparent; color: #94a3b8; font-size: 0.8rem; font-weight: 500;
  cursor: pointer; transition: all 0.15s;
}
.esc-tab:hover { background: rgba(168,85,247,0.08); color: #c084fc; }
.esc-tab-active {
  background: rgba(168,85,247,0.15); border-color: rgba(168,85,247,0.3);
  color: #c084fc; font-weight: 600;
}

.esc-formula {
  padding: 10px 24px; font-family: 'Fira Code', monospace; font-size: 0.78rem;
  color: #64748b; border-bottom: 1px solid rgba(255,255,255,0.04);
  word-break: break-word;
}

.esc-inputs {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;
  padding: 16px 24px;
}
.esc-field { display: flex; flex-direction: column; gap: 4px; }
.esc-label { font-size: 0.75rem; font-weight: 600; color: #94a3b8; }
.esc-input {
  padding: 8px 10px; border-radius: 6px; border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.04); color: #f1f5f9; font-size: 0.88rem;
  outline: none; transition: border-color 0.15s;
}
.esc-input:focus { border-color: rgba(168,85,247,0.5); }

.esc-actions {
  display: flex; gap: 10px; padding: 0 24px 16px;
}
.esc-btn {
  padding: 8px 18px; border-radius: 8px; border: none; font-size: 0.85rem;
  font-weight: 600; cursor: pointer; transition: all 0.15s;
}
.esc-btn-calc { background: rgba(168,85,247,0.2); color: #c084fc; }
.esc-btn-calc:hover { background: rgba(168,85,247,0.35); }
.esc-btn-clear { background: rgba(255,255,255,0.06); color: #94a3b8; }
.esc-btn-clear:hover { background: rgba(255,255,255,0.12); }
.esc-btn-copy { background: rgba(56,189,248,0.12); color: #38bdf8; margin-left: auto; }
.esc-btn-copy:hover { background: rgba(56,189,248,0.25); }

.esc-result-box {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin: 0 24px 16px; padding: 14px 16px; border-radius: 10px;
  background: rgba(168,85,247,0.06); border: 1px solid rgba(168,85,247,0.15);
}
.esc-result-text { font-size: 0.88rem; color: #e2e8f0; font-family: 'Fira Code', monospace; }
.esc-magnitude-badge {
  display: inline-block; padding: 3px 10px; border-radius: 20px;
  font-size: 0.72rem; font-weight: 700; color: #fff; text-transform: uppercase;
  letter-spacing: 0.5px; white-space: nowrap;
}
.esc-magnitude-sm { padding: 2px 7px; font-size: 0.65rem; }

.esc-history-section { padding: 0 24px 18px; }
.esc-history-title {
  margin: 0 0 10px; font-size: 0.85rem; font-weight: 600; color: #94a3b8;
}
.esc-history-list { display: flex; flex-direction: column; gap: 6px; max-height: 180px; overflow-y: auto; }
.esc-history-row {
  display: flex; align-items: center; gap: 8px; padding: 6px 10px;
  border-radius: 6px; background: rgba(255,255,255,0.03);
}
.esc-history-label { font-size: 0.78rem; color: #cbd5e1; font-family: 'Fira Code', monospace; }
.esc-history-empty { font-size: 0.78rem; color: #475569; font-style: italic; }

/* Light theme */
[data-theme="light"] .esc-trigger-btn { background: rgba(168,85,247,0.06); border-color: rgba(168,85,247,0.15); color: #9333ea; }
[data-theme="light"] .esc-modal { background: #ffffff; border-color: rgba(0,0,0,0.1); box-shadow: 0 24px 80px rgba(0,0,0,0.15); }
[data-theme="light"] .esc-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .esc-title { color: #1e293b; }
[data-theme="light"] .esc-close { background: rgba(0,0,0,0.04); color: #64748b; }
[data-theme="light"] .esc-tab-bar { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .esc-tab { border-color: rgba(0,0,0,0.08); color: #64748b; }
[data-theme="light"] .esc-tab-active { background: rgba(168,85,247,0.08); border-color: rgba(168,85,247,0.2); color: #9333ea; }
[data-theme="light"] .esc-formula { color: #64748b; border-bottom-color: rgba(0,0,0,0.04); }
[data-theme="light"] .esc-label { color: #475569; }
[data-theme="light"] .esc-input { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #1e293b; }
[data-theme="light"] .esc-result-box { background: rgba(168,85,247,0.04); border-color: rgba(168,85,247,0.12); }
[data-theme="light"] .esc-result-text { color: #334155; }
[data-theme="light"] .esc-history-row { background: rgba(0,0,0,0.02); }
[data-theme="light"] .esc-history-label { color: #475569; }
[data-theme="light"] .esc-history-title { color: #64748b; }

/* Responsive */
@media (max-width: 640px) {
  .esc-modal { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; }
  .esc-inputs { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .esc-tab-bar { gap: 3px; padding: 8px 12px; }
  .esc-tab { padding: 5px 8px; font-size: 0.72rem; }
  .esc-result-box { flex-direction: column; align-items: flex-start; }
}

/* ══════════════════════════════════════════════════════════════════ */
/* ██  Timeline Planner                                           ██ */
/* ══════════════════════════════════════════════════════════════════ */

.tp-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px;
  border-radius: 8px; font-size: 0.8125rem; font-weight: 600; cursor: pointer;
  background: rgba(245,158,11,0.08); border: 1px solid rgba(245,158,11,0.18);
  color: #f59e0b; transition: background 0.15s, border-color 0.15s;
}
.tp-trigger-btn:hover { background: rgba(245,158,11,0.15); border-color: rgba(245,158,11,0.3); }

.tp-overlay {
  position: fixed; inset: 0; z-index: var(--z-popover); display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,0.55); backdrop-filter: blur(4px);
}
.tp-modal {
  width: 90vw; max-width: 960px; max-height: 90vh; overflow-y: auto; border-radius: 16px;
  background: #111827; border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 24px 80px rgba(0,0,0,0.5);
}
.tp-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 24px; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.tp-title { margin: 0; font-size: 1.1rem; font-weight: 700; color: #e2e8f0; }
.tp-close {
  width: 32px; height: 32px; border: none; border-radius: 8px; cursor: pointer;
  background: rgba(255,255,255,0.06); color: #94a3b8; font-size: 1.2rem;
  display: flex; align-items: center; justify-content: center;
}
.tp-close:hover { background: rgba(255,255,255,0.12); }
.tp-export-btn {
  padding: 6px 12px; border-radius: 6px; font-size: 0.75rem; font-weight: 600; cursor: pointer;
  background: rgba(245,158,11,0.1); border: 1px solid rgba(245,158,11,0.2); color: #f59e0b;
}
.tp-export-btn:hover { background: rgba(245,158,11,0.2); }

.tp-progress-wrap { padding: 14px 24px; display: flex; align-items: center; gap: 12px; }
.tp-progress-label { font-size: 0.8rem; font-weight: 600; color: #94a3b8; white-space: nowrap; }
.tp-progress-track { flex: 1; height: 8px; border-radius: 4px; background: rgba(255,255,255,0.06); overflow: hidden; }
.tp-progress-fill { height: 100%; border-radius: 4px; background: linear-gradient(90deg, #6366f1, #06b6d4); transition: width 0.3s; width: 0; }

.tp-canvas-wrap { padding: 0 24px 16px; overflow-x: auto; }
.tp-canvas { display: block; border-radius: 8px; }

.tp-section { padding: 0 24px 18px; }
.tp-section-title { margin: 0 0 10px; font-size: 0.85rem; font-weight: 600; color: #94a3b8; }

.tp-phase-list { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.tp-phase-row {
  display: flex; align-items: center; gap: 6px; padding: 6px 8px;
  border-radius: 6px; background: rgba(255,255,255,0.03);
}
.tp-phase-swatch { width: 14px; height: 14px; border-radius: 4px; flex-shrink: 0; }
.tp-phase-name-input {
  flex: 1; min-width: 0; padding: 4px 8px; border-radius: 4px; font-size: 0.78rem;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); color: #e2e8f0;
}
.tp-date-input {
  width: 120px; padding: 4px 6px; border-radius: 4px; font-size: 0.75rem;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); color: #e2e8f0;
}
.tp-status-select {
  padding: 4px 6px; border-radius: 4px; font-size: 0.75rem;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); color: #e2e8f0;
}
.tp-phase-dur { font-size: 0.72rem; color: #64748b; min-width: 28px; text-align: center; }
.tp-phase-del, .tp-milestone-del {
  width: 24px; height: 24px; border: none; border-radius: 6px; cursor: pointer;
  background: rgba(239,68,68,0.1); color: #ef4444; font-size: 1rem;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.tp-phase-del:hover, .tp-milestone-del:hover { background: rgba(239,68,68,0.2); }

.tp-add-btn {
  padding: 6px 14px; border-radius: 6px; font-size: 0.78rem; font-weight: 600; cursor: pointer;
  background: rgba(99,102,241,0.08); border: 1px solid rgba(99,102,241,0.18); color: #818cf8;
}
.tp-add-btn:hover { background: rgba(99,102,241,0.16); }

.tp-milestone-list { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.tp-milestone-row {
  display: flex; align-items: center; gap: 8px; padding: 6px 10px;
  border-radius: 6px; background: rgba(255,255,255,0.03);
}
.tp-milestone-diamond { color: #f59e0b; font-size: 0.85rem; }
.tp-milestone-name { flex: 1; font-size: 0.8rem; color: #cbd5e1; }
.tp-milestone-date { font-size: 0.75rem; color: #64748b; font-family: 'Fira Code', monospace; }

.tp-ms-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tp-ms-name-input {
  flex: 1; min-width: 140px; padding: 6px 10px; border-radius: 6px; font-size: 0.78rem;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); color: #e2e8f0;
}
.tp-ms-date-input {
  width: 130px; padding: 6px 8px; border-radius: 6px; font-size: 0.75rem;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); color: #e2e8f0;
}

/* Light theme */
[data-theme="light"] .tp-trigger-btn { background: rgba(245,158,11,0.06); border-color: rgba(245,158,11,0.15); color: #d97706; }
[data-theme="light"] .tp-modal { background: #ffffff; border-color: rgba(0,0,0,0.1); box-shadow: 0 24px 80px rgba(0,0,0,0.15); }
[data-theme="light"] .tp-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .tp-title { color: #1e293b; }
[data-theme="light"] .tp-close { background: rgba(0,0,0,0.04); color: #64748b; }
[data-theme="light"] .tp-progress-label { color: #64748b; }
[data-theme="light"] .tp-progress-track { background: rgba(0,0,0,0.06); }
[data-theme="light"] .tp-section-title { color: #64748b; }
[data-theme="light"] .tp-phase-row, [data-theme="light"] .tp-milestone-row { background: rgba(0,0,0,0.02); }
[data-theme="light"] .tp-phase-name-input, [data-theme="light"] .tp-date-input,
[data-theme="light"] .tp-status-select, [data-theme="light"] .tp-ms-name-input,
[data-theme="light"] .tp-ms-date-input { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #1e293b; }
[data-theme="light"] .tp-milestone-name { color: #334155; }
[data-theme="light"] .tp-milestone-date { color: #64748b; }
[data-theme="light"] .tp-export-btn { background: rgba(245,158,11,0.06); border-color: rgba(245,158,11,0.15); color: #d97706; }

/* Responsive */
@media (max-width: 640px) {
  .tp-modal { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; }
  .tp-phase-row { flex-wrap: wrap; }
  .tp-date-input { width: 100px; }
  .tp-ms-form { flex-direction: column; }
  .tp-ms-name-input { min-width: 0; width: 100%; }
}

/* ═══════════════════════════════════════════════════════════════
   Keyword Extractor
   ═══════════════════════════════════════════════════════════════ */
.kex-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px;
  border-radius: 8px; font-size: 0.82rem; font-weight: 500; cursor: pointer;
  background: rgba(56,189,248,0.08); border: 1px solid rgba(56,189,248,0.18);
  color: #38bdf8; transition: all 0.2s;
}
.kex-trigger-btn:hover { background: rgba(56,189,248,0.15); border-color: rgba(56,189,248,0.3); }

.kex-overlay {
  position: fixed; inset: 0; z-index: var(--z-popover);
  background: rgba(0,0,0,0.6); backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
}
.kex-modal {
  width: 780px; max-width: 96vw; max-height: 90vh; overflow-y: auto;
  background: #0f172a; border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px; box-shadow: 0 24px 80px rgba(0,0,0,0.5);
  display: flex; flex-direction: column;
}
.kex-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.kex-title { font-size: 1.1rem; font-weight: 600; color: #e2e8f0; margin: 0; }
.kex-close {
  width: 32px; height: 32px; border-radius: 8px; border: none; cursor: pointer;
  background: rgba(255,255,255,0.06); color: #94a3b8; font-size: 1rem;
  display: flex; align-items: center; justify-content: center; transition: all 0.15s;
}
.kex-close:hover { background: rgba(239,68,68,0.15); color: #f87171; }

.kex-input-section { padding: 16px 20px 8px; }
.kex-textarea {
  width: 100%; padding: 10px 14px; border-radius: 8px; font-size: 0.82rem;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
  color: #e2e8f0; resize: vertical; font-family: inherit; line-height: 1.5;
  box-sizing: border-box;
}
.kex-textarea:focus { outline: none; border-color: rgba(56,189,248,0.4); }

.kex-btn-row { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.kex-extract-btn, .kex-project-btn {
  padding: 8px 16px; border-radius: 8px; font-size: 0.8rem; font-weight: 500;
  cursor: pointer; border: 1px solid transparent; transition: all 0.2s;
}
.kex-extract-btn {
  background: rgba(56,189,248,0.15); border-color: rgba(56,189,248,0.25); color: #38bdf8;
}
.kex-extract-btn:hover { background: rgba(56,189,248,0.25); }
.kex-project-btn {
  background: rgba(168,85,247,0.1); border-color: rgba(168,85,247,0.2); color: #a855f7;
}
.kex-project-btn:hover { background: rgba(168,85,247,0.2); }

.kex-settings-bar {
  display: flex; gap: 16px; padding: 8px 20px 4px; flex-wrap: wrap; align-items: center;
}
.kex-setting {
  display: flex; align-items: center; gap: 6px; font-size: 0.75rem; color: #94a3b8;
}
.kex-setting-num {
  width: 52px; padding: 4px 6px; border-radius: 6px; font-size: 0.75rem;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
  color: #e2e8f0; text-align: center;
}
.kex-setting-chk { accent-color: #38bdf8; }

.kex-tabs {
  display: flex; gap: 4px; padding: 10px 20px 0;
}
.kex-tab {
  padding: 6px 14px; border-radius: 6px 6px 0 0; font-size: 0.78rem;
  cursor: pointer; border: 1px solid transparent; border-bottom: none;
  background: transparent; color: #64748b; transition: all 0.15s;
}
.kex-tab:hover { color: #94a3b8; background: rgba(255,255,255,0.03); }
.kex-tab-active { background: rgba(56,189,248,0.1); color: #38bdf8; border-color: rgba(56,189,248,0.2); }

.kex-results {
  padding: 16px 20px; min-height: 120px; flex: 1;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.kex-placeholder { text-align: center; color: #475569; font-size: 0.85rem; padding: 40px 0; }

/* Word cloud SVG */
.kex-cloud-wrap { width: 100%; overflow: hidden; border-radius: 10px; background: rgba(0,0,0,0.2); }
.kex-cloud-svg { width: 100%; height: auto; display: block; }
.kex-cloud-word { font-family: 'Inter', sans-serif; transition: opacity 0.15s; }
.kex-cloud-word:hover { opacity: 0.7 !important; }
.kex-cloud-word-sel { stroke: #38bdf8; stroke-width: 0.5; paint-order: stroke; }

/* Table */
.kex-table { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.kex-table thead th {
  text-align: left; padding: 6px 8px; color: #64748b; font-weight: 600;
  border-bottom: 1px solid rgba(255,255,255,0.08); white-space: nowrap;
}
.kex-th-sort { cursor: pointer; }
.kex-th-sort:hover { color: #94a3b8; }
.kex-table tbody td { padding: 6px 8px; color: #cbd5e1; }
.kex-row { transition: background 0.15s; cursor: pointer; }
.kex-row:hover { background: rgba(255,255,255,0.03); }
.kex-row-sel { background: rgba(56,189,248,0.08) !important; }
.kex-rank { color: #475569; font-size: 0.72rem; width: 28px; }
.kex-badge {
  display: inline-block; padding: 1px 6px; border-radius: 4px;
  font-size: 0.68rem; font-weight: 500;
}
.kex-badge-uni { background: rgba(34,197,94,0.12); color: #22c55e; }
.kex-badge-bi { background: rgba(245,158,11,0.12); color: #f59e0b; }
.kex-badge-tri { background: rgba(168,85,247,0.12); color: #a855f7; }
.kex-bar-track {
  width: 100%; height: 6px; border-radius: 3px;
  background: rgba(255,255,255,0.06); overflow: hidden;
}
.kex-bar-fill { height: 100%; border-radius: 3px; transition: width 0.3s; }

/* Export */
.kex-export-section { padding: 4px 0; }
.kex-export-info { color: #94a3b8; font-size: 0.8rem; margin: 0 0 10px; }
.kex-export-btns { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.kex-exp-btn {
  padding: 7px 14px; border-radius: 8px; font-size: 0.78rem; cursor: pointer;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
  color: #cbd5e1; transition: all 0.15s;
}
.kex-exp-btn:hover { background: rgba(56,189,248,0.12); border-color: rgba(56,189,248,0.2); color: #38bdf8; }
.kex-export-preview {
  padding: 10px 14px; border-radius: 8px; font-size: 0.75rem; line-height: 1.5;
  background: rgba(0,0,0,0.25); border: 1px solid rgba(255,255,255,0.06);
  color: #94a3b8; white-space: pre-wrap; word-break: break-word; max-height: 140px;
  overflow-y: auto; margin: 0;
}

/* Light theme overrides */
[data-theme="light"] .kex-trigger-btn { background: rgba(56,189,248,0.06); border-color: rgba(56,189,248,0.15); color: #0284c7; }
[data-theme="light"] .kex-modal { background: #ffffff; border-color: rgba(0,0,0,0.1); box-shadow: 0 24px 80px rgba(0,0,0,0.15); }
[data-theme="light"] .kex-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .kex-title { color: #1e293b; }
[data-theme="light"] .kex-close { background: rgba(0,0,0,0.04); color: #64748b; }
[data-theme="light"] .kex-textarea { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.12); color: #1e293b; }
[data-theme="light"] .kex-setting { color: #64748b; }
[data-theme="light"] .kex-setting-num { background: rgba(0,0,0,0.03); border-color: rgba(0,0,0,0.1); color: #1e293b; }
[data-theme="light"] .kex-tab-active { background: rgba(56,189,248,0.08); color: #0284c7; }
[data-theme="light"] .kex-results { border-top-color: rgba(0,0,0,0.06); }
[data-theme="light"] .kex-cloud-wrap { background: rgba(0,0,0,0.03); }
[data-theme="light"] .kex-table thead th { color: #64748b; border-bottom-color: rgba(0,0,0,0.08); }
[data-theme="light"] .kex-table tbody td { color: #334155; }
[data-theme="light"] .kex-row:hover { background: rgba(0,0,0,0.02); }
[data-theme="light"] .kex-row-sel { background: rgba(56,189,248,0.06) !important; }
[data-theme="light"] .kex-exp-btn { background: rgba(0,0,0,0.03); border-color: rgba(0,0,0,0.1); color: #334155; }
[data-theme="light"] .kex-export-preview { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.08); color: #475569; }

/* Responsive */
@media (max-width: 640px) {
  .kex-modal { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; }
  .kex-btn-row { flex-direction: column; }
  .kex-settings-bar { flex-direction: column; gap: 8px; }
  .kex-export-btns { flex-direction: column; }
}

/* ── Conflict of Interest Checker ─────────────────────────────────── */

.coi-trigger-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 8px; border: 1px solid rgba(139,92,246,0.25);
  background: rgba(139,92,246,0.08); color: #a78bfa;
  font-size: 0.8125rem; font-weight: 500; cursor: pointer;
  transition: all 0.2s ease;
}
.coi-trigger-btn:hover { background: rgba(139,92,246,0.15); border-color: rgba(139,92,246,0.4); }

.coi-overlay {
  position: fixed; inset: 0; z-index: var(--z-overlay);
  background: rgba(0,0,0,0.5); backdrop-filter: blur(4px);
  display: flex; justify-content: flex-end;
  opacity: 0; pointer-events: none; transition: opacity 0.25s ease;
}
.coi-overlay.coi-visible { opacity: 1; pointer-events: auto; }

.coi-panel {
  width: 480px; max-width: 100vw; height: 100vh;
  background: #0f1219; border-left: 1px solid rgba(139,92,246,0.15);
  display: flex; flex-direction: column;
  transform: translateX(100%); transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
  box-shadow: -8px 0 40px rgba(0,0,0,0.4);
}
.coi-visible .coi-panel { transform: translateX(0); }

.coi-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid rgba(139,92,246,0.12);
  flex-shrink: 0;
}
.coi-title-wrap { display: flex; align-items: center; gap: 10px; }
.coi-title-icon { font-size: 1.25rem; }
.coi-title { font-size: 1rem; font-weight: 700; color: #e2e8f0; margin: 0; }

.coi-close-btn {
  width: 32px; height: 32px; border-radius: 8px; border: none;
  background: rgba(255,255,255,0.06); color: #94a3b8;
  font-size: 1.25rem; cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: all 0.15s ease;
}
.coi-close-btn:hover { background: rgba(255,255,255,0.12); color: #e2e8f0; }

.coi-body {
  flex: 1; overflow-y: auto; padding: 20px;
  display: flex; flex-direction: column; gap: 24px;
}

.coi-section { display: flex; flex-direction: column; gap: 10px; }
.coi-section-title { font-size: 0.875rem; font-weight: 600; color: #c4b5fd; margin: 0; }
.coi-section-desc { font-size: 0.75rem; color: #8896ab; margin: 0; line-height: 1.5; }

/* Checklist items */
.coi-check-item {
  padding: 12px 14px; border-radius: 10px;
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06);
  transition: all 0.2s ease;
}
.coi-check-item.coi-item-active {
  background: rgba(139,92,246,0.06); border-color: rgba(139,92,246,0.2);
}
.coi-check-label {
  display: flex; align-items: center; gap: 10px; cursor: pointer;
  font-size: 0.8125rem; font-weight: 500; color: #e2e8f0;
}
.coi-checkbox {
  width: 16px; height: 16px; accent-color: #8b5cf6; cursor: pointer; flex-shrink: 0;
}
.coi-label-text { user-select: none; }
.coi-hint { font-size: 0.6875rem; color: #64748b; margin: 4px 0 0 26px; line-height: 1.4; }

.coi-detail-input {
  width: 100%; margin-top: 8px; padding: 8px 12px;
  border-radius: 8px; border: 1px solid rgba(139,92,246,0.2);
  background: rgba(0,0,0,0.25); color: #e2e8f0;
  font-size: 0.75rem; font-family: inherit; resize: vertical;
  line-height: 1.5; box-sizing: border-box;
}
.coi-detail-input::placeholder { color: #4a5568; }
.coi-detail-input:focus { outline: none; border-color: rgba(139,92,246,0.5); }

/* Scan button */
.coi-scan-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 16px; border-radius: 8px; border: 1px solid rgba(139,92,246,0.3);
  background: rgba(139,92,246,0.1); color: #c4b5fd;
  font-size: 0.8125rem; font-weight: 500; cursor: pointer;
  transition: all 0.2s ease; align-self: flex-start;
}
.coi-scan-btn:hover { background: rgba(139,92,246,0.2); border-color: rgba(139,92,246,0.5); }
.coi-btn-icon { font-size: 0.875rem; }

/* Warning cards */
.coi-issues-wrap { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.coi-issue-count {
  font-size: 0.75rem; font-weight: 600; color: #fbbf24;
  padding: 6px 10px; border-radius: 6px;
  background: rgba(251,191,36,0.08); border: 1px solid rgba(251,191,36,0.15);
}
.coi-warning-card {
  padding: 10px 14px; border-radius: 8px;
  background: rgba(251,191,36,0.04); border: 1px solid rgba(251,191,36,0.12);
  display: flex; flex-direction: column; gap: 6px;
}
.coi-kw-badge {
  display: inline-block; font-size: 0.6875rem; font-weight: 600;
  padding: 2px 8px; border-radius: 4px;
  background: rgba(139,92,246,0.15); color: #c4b5fd;
  align-self: flex-start;
}
.coi-snippet {
  font-size: 0.6875rem; color: #94a3b8; margin: 0;
  line-height: 1.5; font-style: italic;
}

/* Generate section */
.coi-btn-row { display: flex; gap: 8px; flex-wrap: wrap; }

.coi-generate-btn, .coi-copy-btn, .coi-export-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 14px; border-radius: 8px; border: 1px solid;
  font-size: 0.8125rem; font-weight: 500; cursor: pointer;
  transition: all 0.2s ease;
}
.coi-generate-btn {
  background: rgba(139,92,246,0.15); border-color: rgba(139,92,246,0.3); color: #c4b5fd;
}
.coi-generate-btn:hover { background: rgba(139,92,246,0.25); border-color: rgba(139,92,246,0.5); }
.coi-copy-btn {
  background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.1); color: #94a3b8;
}
.coi-copy-btn:hover { background: rgba(255,255,255,0.08); color: #e2e8f0; }
.coi-export-btn {
  background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.1); color: #94a3b8;
}
.coi-export-btn:hover { background: rgba(255,255,255,0.08); color: #e2e8f0; }

/* Statement preview */
.coi-statement-preview {
  padding: 12px 14px; border-radius: 8px; font-size: 0.75rem; line-height: 1.6;
  background: rgba(0,0,0,0.25); border: 1px solid rgba(139,92,246,0.1);
  color: #94a3b8; white-space: pre-wrap; word-break: break-word;
  max-height: 200px; overflow-y: auto; margin: 4px 0 0 0;
}

/* ── COI Light theme overrides ── */
[data-theme="light"] .coi-trigger-btn { background: rgba(139,92,246,0.06); border-color: rgba(139,92,246,0.15); color: #7c3aed; }
[data-theme="light"] .coi-panel { background: #ffffff; border-left-color: rgba(139,92,246,0.1); box-shadow: -8px 0 40px rgba(0,0,0,0.1); }
[data-theme="light"] .coi-header { border-bottom-color: rgba(0,0,0,0.06); }
[data-theme="light"] .coi-title { color: #1e293b; }
[data-theme="light"] .coi-close-btn { background: rgba(0,0,0,0.04); color: #64748b; }
[data-theme="light"] .coi-section-title { color: #7c3aed; }
[data-theme="light"] .coi-section-desc { color: #64748b; }
[data-theme="light"] .coi-check-item { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .coi-check-item.coi-item-active { background: rgba(139,92,246,0.04); border-color: rgba(139,92,246,0.15); }
[data-theme="light"] .coi-check-label { color: #1e293b; }
[data-theme="light"] .coi-hint { color: #64748b; }
[data-theme="light"] .coi-detail-input { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #1e293b; }
[data-theme="light"] .coi-scan-btn { background: rgba(139,92,246,0.06); border-color: rgba(139,92,246,0.15); color: #7c3aed; }
[data-theme="light"] .coi-issue-count { background: rgba(251,191,36,0.06); border-color: rgba(251,191,36,0.12); color: #b45309; }
[data-theme="light"] .coi-warning-card { background: rgba(251,191,36,0.03); border-color: rgba(251,191,36,0.1); }
[data-theme="light"] .coi-kw-badge { background: rgba(139,92,246,0.1); color: #7c3aed; }
[data-theme="light"] .coi-snippet { color: #475569; }
[data-theme="light"] .coi-generate-btn { background: rgba(139,92,246,0.08); border-color: rgba(139,92,246,0.2); color: #7c3aed; }
[data-theme="light"] .coi-copy-btn { background: rgba(0,0,0,0.03); border-color: rgba(0,0,0,0.08); color: #475569; }
[data-theme="light"] .coi-export-btn { background: rgba(0,0,0,0.03); border-color: rgba(0,0,0,0.08); color: #475569; }
[data-theme="light"] .coi-statement-preview { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.06); color: #475569; }

/* COI Responsive */
@media (max-width: 640px) {
  .coi-panel { width: 100vw; max-width: 100vw; }
  .coi-btn-row { flex-direction: column; }
}

/* ══════════════════════════════════════════════════════════════════════
   ██  Study Design Wizard (SDW)                                     ██
   ══════════════════════════════════════════════════════════════════════ */

/* Floating action button */
.sdw-fab {
  position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 999;
  width: 52px; height: 52px; border-radius: 50%;
  background: linear-gradient(135deg, #10b981, #34d399);
  border: none; font-size: 1.4rem; cursor: pointer;
  box-shadow: 0 4px 16px rgba(16,185,129,0.35);
  display: flex; align-items: center; justify-content: center;
  transition: transform 0.2s, box-shadow 0.2s;
}
.sdw-fab:hover { transform: scale(1.1); box-shadow: 0 6px 24px rgba(16,185,129,0.45); }

/* Toolbar trigger */
.sdw-trigger-btn {
  padding: 0.375rem 0.75rem; border-radius: 0.375rem; font-size: 0.8125rem;
  background: rgba(16,185,129,0.1); border: 1px solid rgba(16,185,129,0.2);
  color: #34d399; cursor: pointer; transition: background 0.15s, border-color 0.15s;
}
.sdw-trigger-btn:hover { background: rgba(16,185,129,0.18); border-color: rgba(16,185,129,0.35); }

/* Panel */
.sdw-panel {
  position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 680px; max-width: 95vw; max-height: 88vh;
  background: #0f172a; border: 1px solid rgba(16,185,129,0.2);
  border-radius: 1rem; z-index: var(--z-tooltip);
  display: flex; flex-direction: column;
  box-shadow: 0 24px 64px rgba(0,0,0,0.5);
  overflow: hidden;
}

/* Header */
.sdw-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem 1.25rem; border-bottom: 1px solid rgba(16,185,129,0.12);
}
.sdw-header-title {
  font-size: 1.0625rem; font-weight: 700; color: #e2e8f0;
  display: flex; align-items: center; gap: 0.5rem;
}
.sdw-close-btn {
  background: none; border: none; color: #64748b; font-size: 1.1rem;
  cursor: pointer; padding: 0.25rem; border-radius: 0.25rem;
  transition: color 0.15s, background 0.15s;
}
.sdw-close-btn:hover { color: #e2e8f0; background: rgba(255,255,255,0.06); }

/* Step indicators */
.sdw-steps {
  display: flex; align-items: center; justify-content: center;
  gap: 0; padding: 1rem 2rem 0.25rem;
}
.sdw-step-dot {
  width: 30px; height: 30px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.75rem; font-weight: 700;
  background: rgba(255,255,255,0.06); color: #64748b;
  border: 2px solid rgba(255,255,255,0.08);
  transition: all 0.2s;
}
.sdw-step-dot.active { background: #10b981; color: #fff; border-color: #10b981; }
.sdw-step-dot.completed { background: rgba(16,185,129,0.2); color: #34d399; border-color: #34d399; }
.sdw-step-line {
  width: 48px; height: 2px; background: rgba(255,255,255,0.08);
}
.sdw-step-labels {
  display: flex; justify-content: center; gap: 3.25rem;
  padding: 0.375rem 2rem 0.75rem; font-size: 0.6875rem;
  color: #64748b;
}
.sdw-step-label.active { color: #34d399; font-weight: 600; }

/* Body (scrollable) */
.sdw-body {
  flex: 1; overflow-y: auto; padding: 1rem 1.25rem;
  min-height: 280px;
}

/* Type selection grid */
.sdw-type-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.75rem;
}
.sdw-type-card {
  padding: 0.875rem 1rem; border-radius: 0.625rem; cursor: pointer;
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06);
  transition: all 0.2s;
}
.sdw-type-card:hover { background: rgba(16,185,129,0.06); border-color: rgba(16,185,129,0.2); }
.sdw-type-card.selected { background: rgba(16,185,129,0.1); border-color: #10b981; }
.sdw-type-icon { font-size: 1.5rem; margin-bottom: 0.375rem; }
.sdw-type-title { font-size: 0.875rem; font-weight: 600; color: #e2e8f0; margin-bottom: 0.25rem; }
.sdw-type-desc { font-size: 0.75rem; color: #8896ab; line-height: 1.4; }

/* Form fields */
.sdw-form { display: flex; flex-direction: column; gap: 0.875rem; }
.sdw-field-group { display: flex; flex-direction: column; gap: 0.3rem; }
.sdw-field-label { font-size: 0.8125rem; font-weight: 600; color: #cbd5e1; }
.sdw-field-input, .sdw-field-select, .sdw-field-textarea {
  padding: 0.5rem 0.75rem; border-radius: 0.5rem; font-size: 0.8125rem;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
  color: #e2e8f0; font-family: inherit; transition: border-color 0.15s;
}
.sdw-field-input:focus, .sdw-field-select:focus, .sdw-field-textarea:focus {
  outline: none; border-color: #10b981;
}
.sdw-field-textarea { resize: vertical; min-height: 64px; }
.sdw-field-select { cursor: pointer; }
.sdw-field-select option { background: #1e293b; color: #e2e8f0; }

/* Protocol preview */
.sdw-protocol-preview { display: flex; flex-direction: column; gap: 0.75rem; }
.sdw-protocol-text {
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06);
  border-radius: 0.5rem; padding: 1rem; font-size: 0.75rem;
  color: #cbd5e1; white-space: pre-wrap; word-break: break-word;
  max-height: 360px; overflow-y: auto; line-height: 1.5;
  font-family: 'SF Mono', 'Fira Code', 'Cascadia Code', monospace;
}
.sdw-btn-row { display: flex; gap: 0.5rem; }
.sdw-copy-btn, .sdw-export-btn {
  padding: 0.5rem 1rem; border-radius: 0.5rem; font-size: 0.8125rem;
  cursor: pointer; font-weight: 500; transition: all 0.15s;
}
.sdw-copy-btn {
  background: rgba(16,185,129,0.1); border: 1px solid rgba(16,185,129,0.25);
  color: #34d399;
}
.sdw-copy-btn:hover { background: rgba(16,185,129,0.18); border-color: rgba(16,185,129,0.4); }
.sdw-export-btn {
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
  color: #94a3b8;
}
.sdw-export-btn:hover { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.18); }

/* Navigation */
.sdw-nav {
  display: flex; align-items: center; padding: 0.75rem 1.25rem;
  border-top: 1px solid rgba(16,185,129,0.12);
}
.sdw-nav-back {
  padding: 0.5rem 1rem; border-radius: 0.5rem; font-size: 0.8125rem;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
  color: #94a3b8; cursor: pointer; font-weight: 500; transition: all 0.15s;
}
.sdw-nav-back:hover { background: rgba(255,255,255,0.08); color: #e2e8f0; }
.sdw-nav-next {
  padding: 0.5rem 1.25rem; border-radius: 0.5rem; font-size: 0.8125rem;
  background: linear-gradient(135deg, #10b981, #34d399); border: none;
  color: #fff; cursor: pointer; font-weight: 600;
  box-shadow: 0 2px 8px rgba(16,185,129,0.25); transition: all 0.15s;
}
.sdw-nav-next:hover { box-shadow: 0 4px 16px rgba(16,185,129,0.35); transform: translateY(-1px); }

/* ── SDW Light Theme ─────────────────────────────────────────────── */
[data-theme="light"] .sdw-panel { background: #ffffff; border-color: rgba(16,185,129,0.15); box-shadow: 0 24px 64px rgba(0,0,0,0.12); }
[data-theme="light"] .sdw-header { border-bottom-color: rgba(16,185,129,0.1); }
[data-theme="light"] .sdw-header-title { color: #1e293b; }
[data-theme="light"] .sdw-close-btn { color: #94a3b8; }
[data-theme="light"] .sdw-close-btn:hover { color: #1e293b; background: rgba(0,0,0,0.04); }
[data-theme="light"] .sdw-step-dot { background: rgba(0,0,0,0.04); color: #94a3b8; border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .sdw-step-dot.active { background: #10b981; color: #fff; border-color: #10b981; }
[data-theme="light"] .sdw-step-dot.completed { background: rgba(16,185,129,0.1); color: #059669; border-color: #34d399; }
[data-theme="light"] .sdw-step-line { background: rgba(0,0,0,0.08); }
[data-theme="light"] .sdw-step-labels { color: #94a3b8; }
[data-theme="light"] .sdw-step-label.active { color: #059669; }
[data-theme="light"] .sdw-type-card { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .sdw-type-card:hover { background: rgba(16,185,129,0.04); border-color: rgba(16,185,129,0.15); }
[data-theme="light"] .sdw-type-card.selected { background: rgba(16,185,129,0.08); border-color: #10b981; }
[data-theme="light"] .sdw-type-title { color: #1e293b; }
[data-theme="light"] .sdw-type-desc { color: #64748b; }
[data-theme="light"] .sdw-field-label { color: #374151; }
[data-theme="light"] .sdw-field-input,
[data-theme="light"] .sdw-field-select,
[data-theme="light"] .sdw-field-textarea { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.1); color: #1e293b; }
[data-theme="light"] .sdw-field-input:focus,
[data-theme="light"] .sdw-field-select:focus,
[data-theme="light"] .sdw-field-textarea:focus { border-color: #10b981; }
[data-theme="light"] .sdw-field-select option { background: #fff; color: #1e293b; }
[data-theme="light"] .sdw-protocol-text { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.06); color: #475569; }
[data-theme="light"] .sdw-copy-btn { background: rgba(16,185,129,0.06); border-color: rgba(16,185,129,0.15); color: #059669; }
[data-theme="light"] .sdw-export-btn { background: rgba(0,0,0,0.03); border-color: rgba(0,0,0,0.08); color: #475569; }
[data-theme="light"] .sdw-nav { border-top-color: rgba(16,185,129,0.1); }
[data-theme="light"] .sdw-nav-back { background: rgba(0,0,0,0.03); border-color: rgba(0,0,0,0.08); color: #475569; }
[data-theme="light"] .sdw-nav-back:hover { background: rgba(0,0,0,0.06); color: #1e293b; }
[data-theme="light"] .sdw-fab { box-shadow: 0 4px 16px rgba(16,185,129,0.25); }
[data-theme="light"] .sdw-trigger-btn { background: rgba(16,185,129,0.06); border-color: rgba(16,185,129,0.15); color: #059669; }

/* SDW Responsive */
@media (max-width: 640px) {
  .sdw-panel { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; }
  .sdw-type-grid { grid-template-columns: 1fr; }
  .sdw-btn-row { flex-direction: column; }
}