:root {
  --brand-navy: #0f172a;
  --brand-blue: #2563eb;
  --brand-blue-dark: #1d4ed8;
  --brand-indigo: #4338ca;
  --brand-teal: #0891b2;
  --brand-amber: #d97706;
  --surface-border: #e7ebf1;
}
* { box-sizing: border-box; }
body { min-height: 100vh; }
.scrollbar-thin::-webkit-scrollbar { height: 6px; width: 6px; }
.scrollbar-thin::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 3px; }

/* ---------- Executive hero ---------- */
.hero-banner {
  position: relative; overflow: hidden; border-radius: 1rem;
  background: linear-gradient(120deg, #0b1220 0%, #101b34 45%, #14275a 100%);
  color: #fff; padding: 1.75rem 2rem; margin-bottom: 1.5rem;
  box-shadow: 0 12px 30px -12px rgba(15,23,42,.35);
}
.hero-banner::before {
  content: ''; position: absolute; inset: 0;
  background-image: radial-gradient(circle at 88% 12%, rgba(37,99,235,.35), transparent 42%),
                     radial-gradient(circle at 8% 92%, rgba(8,145,178,.28), transparent 45%);
  pointer-events: none;
}
.hero-banner .hero-content { position: relative; z-index: 1; }
.hero-eyebrow { font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #93c5fd; }
.hero-title { font-size: 1.5rem; font-weight: 800; letter-spacing: -.01em; margin-top: .2rem; }
.hero-sub { font-size: .8rem; color: #cbd5e1; margin-top: .3rem; }
.hero-pill { display:inline-flex; align-items:center; gap:.4rem; font-size:.72rem; font-weight:700; padding:.3rem .75rem; border-radius:9999px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); backdrop-filter: blur(4px); }
.hero-pill.live { background: rgba(34,197,94,.16); border-color: rgba(34,197,94,.4); color: #86efac; }
.hero-pill .dot { width:.4rem; height:.4rem; border-radius:50%; background:#4ade80; box-shadow:0 0 0 3px rgba(74,222,128,.25); }

/* ---------- Section headers ---------- */
.section-head { display:flex; align-items:center; justify-content:space-between; margin: 1.75rem 0 .9rem; }
.section-head .section-title { font-size:.8rem; font-weight:800; color:#1e293b; text-transform:uppercase; letter-spacing:.06em; display:flex; align-items:center; gap:.5rem; }
.section-head .section-title i { color:#2563eb; font-size:.75rem; }
.section-head .section-hint { font-size:.72rem; color:#94a3b8; }

/* ---------- Stat cards (executive) ---------- */
.stat-card {
  position: relative; background:#fff; border:1px solid var(--surface-border); border-radius:1rem;
  padding:1.15rem 1.25rem; overflow:hidden; transition: transform .15s ease, box-shadow .15s ease;
}
.stat-card:hover { transform: translateY(-2px); box-shadow: 0 10px 24px -14px rgba(15,23,42,.22); }
.stat-card .stat-icon {
  width:2.25rem; height:2.25rem; border-radius:.65rem; display:flex; align-items:center; justify-content:center;
  font-size:.85rem; margin-bottom:.65rem;
}
.stat-card .stat-value { font-size:1.7rem; font-weight:800; color:#0f172a; line-height:1.05; letter-spacing:-.01em; }
.stat-card .stat-label { font-size:.72rem; font-weight:600; color:#64748b; margin-top:.3rem; }
.stat-card .stat-accent { position:absolute; top:0; left:0; width:100%; height:3px; }

.tone-blue .stat-icon { background:#eff6ff; color:#2563eb; }
.tone-blue .stat-accent { background:#2563eb; }
.tone-indigo .stat-icon { background:#eef2ff; color:#4338ca; }
.tone-indigo .stat-accent { background:#4338ca; }
.tone-teal .stat-icon { background:#ecfeff; color:#0891b2; }
.tone-teal .stat-accent { background:#0891b2; }
.tone-amber .stat-icon { background:#fffbeb; color:#d97706; }
.tone-amber .stat-accent { background:#d97706; }
.tone-green .stat-icon { background:#f0fdf4; color:#16a34a; }
.tone-green .stat-accent { background:#16a34a; }
.tone-rose .stat-icon { background:#fff1f2; color:#e11d48; }
.tone-rose .stat-accent { background:#e11d48; }
.tone-slate .stat-icon { background:#f8fafc; color:#475569; }
.tone-slate .stat-accent { background:#94a3b8; }

.surface-card {
  background:#fff; border:1px solid var(--surface-border); border-radius:1rem;
  padding:1.25rem 1.4rem; box-shadow: 0 1px 3px rgba(15,23,42,.03);
}
.surface-card .surface-card-title { font-size:.82rem; font-weight:700; color:#1e293b; margin-bottom:.9rem; display:flex; align-items:center; gap:.45rem; }
.surface-card .surface-card-title i { color:#2563eb; font-size:.75rem; }

.nav-link { display:flex; align-items:center; gap:.6rem; padding:.5rem .9rem; border-radius:.5rem; color:#cbd5e1; font-size:.82rem; font-weight:500; cursor:pointer; transition:background .15s,color .15s; margin-bottom:.1rem; }
.nav-link:hover { background:rgba(255,255,255,.08); color:#fff; }
.nav-link.active { background:#2563eb; color:#fff; }
.nav-link i { width:1.1rem; text-align:center; flex-shrink:0; }
.nav-group-label {
  font-size:.65rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:#64748b; padding:1.1rem .9rem .4rem; margin-top:.2rem;
  border-top:1px solid rgba(255,255,255,.08);
}
.nav-group-label.first { border-top:none; margin-top:0; padding-top:.2rem; }

.kpi-card { background:#fff; border:1px solid #e2e8f0; border-radius:.75rem; padding:1.1rem 1.25rem; box-shadow:0 1px 2px rgba(0,0,0,.03); }
.kpi-value { font-size:1.85rem; font-weight:800; color:#0f172a; line-height:1.1; }
.kpi-label { font-size:.75rem; font-weight:600; color:#64748b; text-transform:uppercase; letter-spacing:.03em; }

.badge { display:inline-flex; align-items:center; font-size:.7rem; font-weight:600; padding:.15rem .55rem; border-radius:9999px; }
.badge-new { background:#dcfce7; color:#166534; }
.badge-updated { background:#fef9c3; color:#854d0e; }
.badge-discontinued { background:#fee2e2; color:#991b1b; }
.badge-conflicting { background:#fde68a; color:#78350f; }
.badge-unchanged { background:#e2e8f0; color:#475569; }
.badge-high { background:#dcfce7; color:#166534; }
.badge-medium { background:#fef9c3; color:#854d0e; }
.badge-low { background:#fee2e2; color:#991b1b; }
.badge-verified { background:#dbeafe; color:#1e40af; }
.badge-pending { background:#fef9c3; color:#854d0e; }
.badge-unverified { background:#f1f5f9; color:#475569; }

table.data-table { width:100%; border-collapse:collapse; font-size:.8rem; }
table.data-table th { position:sticky; top:0; background:#f8fafc; text-align:left; padding:.55rem .75rem; font-weight:600; color:#475569; border-bottom:2px solid #e2e8f0; white-space:nowrap; }
table.data-table td { padding:.55rem .75rem; border-bottom:1px solid #f1f5f9; vertical-align:top; }
table.data-table tr:hover td { background:#f8fafc; }

.tab-btn { padding:.5rem 1rem; border-radius:.5rem 0.5rem 0 0; font-size:.85rem; font-weight:600; color:#64748b; cursor:pointer; border-bottom:2px solid transparent; }
.tab-btn.active { color:#2563eb; border-bottom-color:#2563eb; }

.modal-overlay { position:fixed; inset:0; background:rgba(15,23,42,.55); display:flex; align-items:center; justify-content:center; z-index:50; }
.modal-box { background:#fff; border-radius:.75rem; max-width:90vw; max-height:88vh; overflow:auto; }

.btn { display:inline-flex; align-items:center; gap:.4rem; padding:.5rem 1rem; border-radius:.5rem; font-size:.85rem; font-weight:600; cursor:pointer; transition:opacity .15s; border:1px solid transparent; }
.btn:hover { opacity:.9; }
.btn-primary { background:#2563eb; color:#fff; }
.btn-secondary { background:#fff; color:#334155; border-color:#cbd5e1; }
.btn-success { background:#16a34a; color:#fff; }
.btn-danger { background:#dc2626; color:#fff; }
.btn:disabled { opacity:.5; cursor:not-allowed; }

.spinner { border:3px solid #e2e8f0; border-top-color:#2563eb; border-radius:50%; width:1.5rem; height:1.5rem; animation:spin 0.7s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }

.field-diff-old { text-decoration:line-through; color:#94a3b8; }
.field-diff-new { color:#166534; font-weight:600; }

.source-link { color:#2563eb; text-decoration:none; font-size:.75rem; }
.source-link:hover { text-decoration:underline; }

.chat-bubble-user { background:#2563eb; color:#fff; border-radius:1rem 1rem .25rem 1rem; }
.chat-bubble-ai { background:#fff; border:1px solid #e2e8f0; border-radius:1rem 1rem 1rem .25rem; }

/* ---------- Record list (replaces raw Excel-style grid) ---------- */
.record-list { border:1px solid var(--surface-border); border-radius:1rem; overflow:hidden; background:#fff; }
.record-row {
  display:grid; align-items:center; gap:1rem; padding:.85rem 1.25rem; border-bottom:1px solid #f1f5f9;
  cursor:pointer; transition: background .12s ease;
}
.record-row:last-child { border-bottom:none; }
.record-row:hover { background:#f8fafc; }
.record-row:hover .record-title { color:#2563eb; }
.record-row .record-title { font-size:.85rem; font-weight:700; color:#0f172a; transition: color .12s ease; }
.record-row .record-subtitle { font-size:.72rem; color:#94a3b8; margin-top:.1rem; }
.record-row .record-field-label { font-size:.63rem; font-weight:700; color:#94a3b8; text-transform:uppercase; letter-spacing:.04em; margin-bottom:.15rem; }
.record-row .record-field-value { font-size:.78rem; color:#334155; font-weight:500; }
.record-avatar {
  width:2.35rem; height:2.35rem; border-radius:.65rem; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  font-size:.75rem; font-weight:800; color:#fff; background: linear-gradient(135deg, #2563eb, #4338ca);
}
.record-list-head {
  display:grid; align-items:center; gap:1rem; padding:.65rem 1.25rem; background:#f8fafc; border-bottom:1px solid var(--surface-border);
  font-size:.66rem; font-weight:700; color:#64748b; text-transform:uppercase; letter-spacing:.05em;
}
.stage-chip { display:inline-flex; align-items:center; gap:.3rem; font-size:.68rem; font-weight:700; padding:.22rem .6rem; border-radius:.4rem; white-space:nowrap; }
.stage-phase1 { background:#dbeafe; color:#1e40af; }
.stage-phase12plus { background:#e0e7ff; color:#3730a3; }
.stage-ind { background:#cffafe; color:#155e75; }
.stage-preclinical { background:#f1f5f9; color:#475569; }
.stage-acquired { background:#fce7f3; color:#9d174d; }
.stage-other { background:#f8fafc; color:#64748b; border:1px solid #e2e8f0; }

.chip-row { display:flex; flex-wrap:wrap; gap:.35rem; }
.tag-chip { display:inline-flex; align-items:center; font-size:.68rem; font-weight:600; padding:.18rem .55rem; border-radius:.4rem; background:#f1f5f9; color:#475569; border:1px solid #e2e8f0; }

.icon-btn {
  width:2rem; height:2rem; border-radius:.55rem; display:flex; align-items:center; justify-content:center;
  color:#64748b; background:#f8fafc; border:1px solid #e2e8f0; transition: all .12s ease; flex-shrink:0;
}
.icon-btn:hover { background:#eff6ff; color:#2563eb; border-color:#bfdbfe; }

.detail-modal-overlay {
  position:fixed; inset:0; background:rgba(15,23,42,.55); backdrop-filter: blur(2px);
  display:flex; align-items:flex-start; justify-content:center; z-index:60; padding: 4vh 1.5rem; overflow-y:auto;
}
.detail-modal {
  background:#fff; border-radius:1.1rem; width:100%; max-width:44rem; box-shadow: 0 24px 60px -20px rgba(15,23,42,.45);
  animation: modalPop .16s ease-out;
}
@keyframes modalPop { from { opacity:0; transform: translateY(8px) scale(.98); } to { opacity:1; transform: translateY(0) scale(1); } }
.detail-modal-head {
  display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:1.5rem 1.75rem 1.1rem;
  border-bottom:1px solid #f1f5f9;
}
.detail-modal-body { padding: 1.25rem 1.75rem 1.75rem; max-height:70vh; overflow-y:auto; }
.detail-field { padding: .65rem 0; border-bottom: 1px solid #f8fafc; display:grid; grid-template-columns: 11rem 1fr; gap:1rem; }
.detail-field:last-child { border-bottom:none; }
.detail-field .detail-field-label { font-size:.68rem; font-weight:700; color:#94a3b8; text-transform:uppercase; letter-spacing:.04em; padding-top:.1rem; }
.detail-field .detail-field-value { font-size:.85rem; color:#1e293b; font-weight:500; word-break:break-word; }
.detail-source-row { display:flex; flex-wrap:wrap; gap:.6rem; padding-top:1.1rem; margin-top:.4rem; border-top:1px solid #f1f5f9; }
.detail-source-btn {
  display:inline-flex; align-items:center; gap:.4rem; font-size:.75rem; font-weight:600; padding:.45rem .85rem; border-radius:.6rem;
  background:#eff6ff; color:#1d4ed8; border:1px solid #dbeafe; text-decoration:none; transition: all .12s ease;
}
.detail-source-btn:hover { background:#dbeafe; }
.detail-source-btn.muted { background:#f8fafc; color:#94a3b8; border-color:#e2e8f0; cursor:default; }

.toolbar-card { background:#fff; border:1px solid var(--surface-border); border-radius:1rem; padding:.85rem 1.1rem; margin-bottom:1.1rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.search-input-wrap { position:relative; }
.search-input-wrap i { position:absolute; left:.75rem; top:50%; transform:translateY(-50%); color:#94a3b8; font-size:.78rem; }
.search-input { padding-left:2.1rem !important; }