* { box-sizing: border-box; }
/* Scoped overlay-modal hide rules — both elements ship with inline display:flex,
   so a class toggle alone wouldn't hide them without !important. */
#cmdPalette.hidden,
#onboardCard.hidden { display: none !important; }

body {
  margin: 0;
  font-family: -apple-system, "Segoe UI", system-ui, sans-serif;
  background: var(--bg, #f5f6f8);
  color: var(--fg, #1f2937);
}

/* Phase 18 / α — Dark mode (data-theme="dark" or auto via prefers-color-scheme) */
:root {
  --bg: #f5f6f8;
  --fg: #1f2937;
  --panel: #ffffff;
  --panel-2: #f8fafc;
  --border: #e5e7eb;
  --muted: #6b7280;
}
[data-theme="dark"] {
  --bg: #0f172a;
  --fg: #e5e7eb;
  --panel: #1e293b;
  --panel-2: #0b1424;
  --border: #334155;
  --muted: #94a3b8;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --bg: #0f172a;
    --fg: #e5e7eb;
    --panel: #1e293b;
    --panel-2: #0b1424;
    --border: #334155;
    --muted: #94a3b8;
  }
}
[data-theme="dark"] section, [data-theme="dark"] aside { background: var(--panel); color: var(--fg); }
[data-theme="dark"] .row input, [data-theme="dark"] .row select, [data-theme="dark"] textarea, [data-theme="dark"] input[type=text], [data-theme="dark"] input[type=number], [data-theme="dark"] input[type=email], [data-theme="dark"] input[type=password] { background: var(--panel-2); color: var(--fg); border-color: var(--border); }
[data-theme="dark"] hr { border-top-color: var(--border); }
[data-theme="dark"] .pdf-section { background: var(--panel-2); }
[data-theme="dark"] .modal-card { background: var(--panel); color: var(--fg); }
[data-theme="dark"] pre { background: var(--panel-2); color: var(--fg); }
[data-theme="dark"] table { color: var(--fg); }
[data-theme="dark"] table th { background: var(--panel-2) !important; }
.topbar {
  display: flex; align-items: center; gap: 1rem;
  padding: 0.75rem 1.25rem;
  background: #0f172a; color: #f1f5f9;
}
.brand { font-weight: 700; font-size: 1.15rem; letter-spacing: 0.04em; }
.brand span { font-weight: 300; opacity: 0.7; margin-left: 0.4rem; }
.status { margin-left: auto; color: #94a3b8; font-size: 0.85rem; }
.icon-btn { background: transparent; border: 0; color: inherit; font-size: 1.2rem; cursor: pointer; }
.icon-btn:hover { color: #38bdf8; }

.grid {
  display: grid;
  grid-template-columns: 320px 1fr 240px;
  gap: 1rem;
  padding: 1rem;
}
@media (max-width: 1100px) { .grid { grid-template-columns: 1fr; padding: 0.5rem; gap: 0.6rem; } }

/* Phase 4 / K — mobile/touch optimizations (≤768px) */
@media (max-width: 768px) {
  .topbar { padding: 0.5rem 0.75rem; gap: 0.5rem; }
  .brand  { font-size: 1.0rem; }
  .brand span { margin-left: 0.25rem; }
  .icon-btn { font-size: 1.4rem; padding: 0.25rem 0.5rem; }
  section, aside { padding: 0.75rem; }
  h2 { font-size: 1.0rem; }
  h3 { font-size: 0.85rem; }
  /* Touch targets — Material Design min 44px */
  button, .chip, select, input[type=text], input[type=password] { min-height: 44px; font-size: 0.95rem; }
  button { padding: 0.55rem 0.85rem; }
  .chip { padding: 0.45rem 0.75rem; }
  /* Drawer fullscreen on small screens */
  .drawer { width: 100vw !important; max-width: 100vw !important; left: 0 !important; right: 0 !important; }
  /* Tables — allow horizontal scroll instead of breaking layout */
  table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  /* Status badges shouldn't get pushed off-screen */
  #connStatus, #tenantBadge { font-size: 0.7rem; }
  /* Modal/dialog cards on mobile take 95vw */
  .modal-card { width: 95vw !important; max-width: 95vw !important; padding: 0.75rem !important; }
}
/* Touch-action improvements (hover→tap) */
@media (hover: none) and (pointer: coarse) {
  .chip:hover, button:hover { background: inherit; }
  .chip.active { box-shadow: 0 0 0 2px var(--brand-color, #1e3a8a) inset; }
}

section, aside {
  background: white;
  padding: 1rem;
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,.05);
}
h2 { margin: 0 0 0.75rem 0; font-size: 1.05rem; color: #1e3a8a; }
h3 { margin: 1rem 0 0.5rem 0; font-size: 0.92rem; color: #374151; text-transform: uppercase; letter-spacing: 0.04em; }
hr { border: 0; border-top: 1px solid #e5e7eb; margin: 0.75rem 0; }

.row { display: flex; gap: 0.5rem; margin-bottom: 0.5rem; align-items: center; }
.row label { flex: 0 0 auto; font-size: 0.85rem; color: #4b5563; }
.row input, .row select { flex: 1; padding: 0.4rem; border: 1px solid #d1d5db; border-radius: 4px; font: inherit; }

fieldset.vitals {
  border: 1px solid #e5e7eb; border-radius: 6px; padding: 0.5rem 0.75rem 0.75rem;
  display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem;
  margin: 0.5rem 0;
}
fieldset.vitals legend { padding: 0 0.4rem; font-size: 0.78rem; color: #6b7280; }
fieldset.vitals label { display: flex; flex-direction: column; font-size: 0.72rem; color: #6b7280; }
fieldset.vitals input { padding: 0.3rem; border: 1px solid #d1d5db; border-radius: 4px; font: inherit; margin-top: 0.15rem; }

label.block { display: block; margin: 0.5rem 0; font-size: 0.85rem; color: #4b5563; }
label.block textarea {
  width: 100%; padding: 0.5rem; border: 1px solid #d1d5db; border-radius: 4px;
  font: inherit; resize: vertical; margin-top: 0.3rem;
}

/* ── Module / Specialty / Template selectors ── */
.chip-row {
  display: flex; flex-wrap: wrap; gap: 0.3rem;
  margin: 0.4rem 0;
}
.chip {
  flex: 0 0 auto;
  padding: 0.32rem 0.55rem;
  border: 1px solid #d1d5db;
  background: white;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  color: #374151;
  white-space: nowrap;
}
.chip:hover { border-color: #1e3a8a; background: #eff6ff; }
.chip.active {
  background: #1e3a8a; color: white; border-color: #1e3a8a;
  box-shadow: 0 1px 3px rgba(30,58,138,0.25);
}

.specialty-select {
  width: 100%; padding: 0.45rem;
  border: 1px solid #d1d5db; border-radius: 6px;
  font: inherit; font-size: 0.85rem;
  margin: 0.25rem 0 0.5rem;
  background: white;
}
.specialty-select:focus { outline: none; border-color: #1e3a8a; }

.template-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.3rem;
  margin: 0.4rem 0 0.6rem;
}
.tpl-label {
  flex: 0 0 100%; font-size: 0.72rem; color: #6b7280;
  text-transform: uppercase; letter-spacing: 0.04em;
  margin-bottom: 0.1rem;
}
.chip-mini {
  flex: 0 0 auto;
  padding: 0.28rem 0.5rem;
  border: 1px solid #e5e7eb;
  background: #f9fafb;
  border-radius: 6px;
  font-size: 0.75rem;
  cursor: pointer;
  color: #374151;
  white-space: nowrap;
}
.chip-mini:hover { background: #dbeafe; border-color: #1e3a8a; color: #1e40af; }

/* ── Attachment preview (Step 5) ── */
.attach-preview {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 0.4rem; margin: 0.4rem 0;
}
.attach-thumb {
  position: relative;
  border-radius: 4px;
  overflow: hidden;
  background: #f3f4f6;
  aspect-ratio: 1;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.6rem;
}
.attach-thumb img {
  width: 100%; height: 100%; object-fit: cover;
}
.attach-thumb .pdf-tag {
  position: absolute; bottom: 4px; left: 4px;
  background: rgba(220,38,38,0.9); color: white;
  font-size: 0.65rem; padding: 0.1rem 0.3rem; border-radius: 3px;
  font-weight: 700;
}
.attach-thumb .parse-btn {
  position: absolute; top: 4px; right: 4px;
  background: #1e3a8a; color: white;
  font-size: 0.65rem; padding: 0.15rem 0.4rem; border-radius: 3px;
  border: 0; cursor: pointer; font-weight: 600;
}
.attach-thumb .parse-btn:hover { background: #1e40af; }
.attach-thumb .parse-btn:disabled { background: #6b7280; cursor: wait; }

.mic-row {
  display: flex; align-items: center; gap: 0.6rem;
  margin: 0.6rem 0 0.4rem;
}
.mic-btn {
  flex: 0 0 auto; padding: 0.5rem 0.85rem; border: 1px solid #d1d5db;
  background: white; border-radius: 6px; cursor: pointer;
  font-size: 0.88rem; font-weight: 600;
}
.mic-btn:hover { border-color: #1e3a8a; }
.mic-btn.recording { background: #dc2626; color: white; border-color: #dc2626; animation: pulse 1.2s infinite; }
.mic-btn.recording-long { background: #1e40af; color: white; border-color: #1e40af; animation: pulse-blue 1.4s infinite; }
.mic-btn.busy     { background: #f59e0b; color: white; border-color: #f59e0b; cursor: wait; }
.mic-btn:disabled { opacity: 0.5; cursor: not-allowed; }
@keyframes pulse-blue {
  0%, 100% { box-shadow: 0 0 0 0 rgba(30, 64, 175, 0.55); }
  50%      { box-shadow: 0 0 0 6px rgba(30, 64, 175, 0); }
}
.mic-status { font-size: 0.78rem; color: #6b7280; }
.mic-status.ok    { color: #059669; }
.mic-status.error { color: #dc2626; }
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.6); }
  50%      { box-shadow: 0 0 0 8px rgba(220, 38, 38, 0); }
}

.attach-zone {
  border: 2px dashed #d1d5db; border-radius: 6px; padding: 0.75rem;
  text-align: center; font-size: 0.85rem; color: #6b7280; cursor: pointer;
  margin: 0.5rem 0;
}
.attach-zone.drag { border-color: #2563eb; background: #eff6ff; color: #1e40af; }
#attachList { font-size: 0.8rem; color: #4b5563; }
#attachList .item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 0.3rem 0.5rem; background: #f3f4f6; border-radius: 4px; margin-top: 0.2rem;
}
#attachList .item button { border: 0; background: transparent; cursor: pointer; color: #ef4444; font-size: 1rem; }

.primary {
  background: #1e3a8a; color: white; border: 0;
  padding: 0.65rem 1rem; border-radius: 6px; cursor: pointer;
  font-weight: 600; width: 100%; margin-top: 0.5rem;
}
.primary:hover { background: #1e40af; }
.primary:disabled { background: #94a3b8; cursor: not-allowed; }

.action {
  display: block; width: 100%;
  margin-bottom: 0.5rem; padding: 0.7rem 0.75rem;
  border: 1px solid #d1d5db; background: white;
  border-radius: 6px; cursor: pointer;
  font-size: 0.9rem; text-align: left;
}
.action:hover:not(:disabled) { border-color: #1e3a8a; background: #eff6ff; }
.action:disabled { opacity: 0.5; cursor: not-allowed; }

/* ── HALT 1–4 progressive bar (Step 3B) ── */
.halt-bar {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 4px; margin: 0 0 0.6rem;
}
.halt-segment {
  padding: 0.45rem 0.5rem;
  text-align: center;
  border-radius: 5px;
  background: #f3f4f6; color: #9ca3af;
  border: 2px solid transparent;
  transition: all 0.2s;
}
.halt-segment strong { display: block; font-size: 0.78rem; font-weight: 700; }
.halt-segment small  { display: block; font-size: 0.65rem; opacity: 0.85; margin-top: 0.1rem; }
.halt-segment.active.halt-1 { background: #d1fae5; color: #065f46; border-color: #10b981; }
.halt-segment.active.halt-2 { background: #fef3c7; color: #92400e; border-color: #f59e0b; }
.halt-segment.active.halt-3 { background: #ffedd5; color: #9a3412; border-color: #ea580c; }
.halt-segment.active.halt-4 {
  background: #fee2e2; color: #991b1b; border-color: #dc2626;
  animation: halt-pulse 1.4s infinite;
}
@keyframes halt-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(220,38,38,0.55); }
  50%      { box-shadow: 0 0 0 6px rgba(220,38,38,0); }
}

/* ── Quality cards (Stability / Decision Quality / Doctor Confidence) ── */
.quality-cards {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem; margin: 0 0 0.75rem;
}
.qcard {
  padding: 0.6rem 0.55rem;
  border-radius: 6px;
  background: #f3f4f6;
  text-align: center;
  border: 1px solid transparent;
}
.qcard-label { font-size: 0.68rem; color: #6b7280; text-transform: uppercase; letter-spacing: 0.04em; }
.qcard-value { font-size: 0.95rem; font-weight: 700; margin-top: 0.25rem; color: #111827; }
.qcard-sub   { font-size: 0.7rem; color: #6b7280; margin-top: 0.1rem; }
.qcard.green  { background: #d1fae5; border-color: #10b981; }
.qcard.green  .qcard-value { color: #065f46; }
.qcard.yellow { background: #fef3c7; border-color: #f59e0b; }
.qcard.yellow .qcard-value { color: #92400e; }
.qcard.orange { background: #ffedd5; border-color: #ea580c; }
.qcard.orange .qcard-value { color: #9a3412; }
.qcard.red    { background: #fee2e2; border-color: #dc2626; }
.qcard.red    .qcard-value { color: #991b1b; }

/* ── Pre-validation warning ── */
.prewarn {
  display: flex; align-items: center; gap: 0.5rem;
  background: #fffbeb; border: 1px solid #f59e0b; border-radius: 6px;
  padding: 0.5rem 0.7rem; margin: 0 0 0.7rem;
  font-size: 0.85rem; color: #92400e;
}
.prewarn.hidden { display: none; }
.prewarn-icon { font-size: 1.1rem; }

/* ── Tab navigation (Step 3C) ── */
.tabnav {
  display: flex; flex-wrap: wrap; gap: 2px;
  border-bottom: 2px solid #e5e7eb;
  margin: 0.5rem 0 0;
}
.tab {
  flex: 0 0 auto;
  padding: 0.5rem 0.85rem;
  border: 0;
  background: transparent;
  color: #6b7280;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
}
.tab:hover { color: #1e3a8a; }
.tab.active {
  color: #1e3a8a;
  border-bottom-color: #1e3a8a;
  background: #eff6ff;
}
.tabpane { display: none; padding-top: 0.5rem; }
.tabpane.active { display: block; }

/* Tab content blocks */
.topdx { padding-left: 1.4rem; font-size: 0.92rem; }
.topdx li { margin-bottom: 0.3rem; }
.distilled { background: #f8fafc; padding: 0.6rem 0.8rem; border-left: 3px solid #1e3a8a; border-radius: 4px; font-size: 0.92rem; }
.keyfacts { background: #f9fafb; padding: 0.55rem; border-radius: 6px; font-size: 0.85rem; }
.keyfacts dl { margin: 0; display: grid; grid-template-columns: 140px 1fr; gap: 0.3rem 0.6rem; }
.keyfacts dt { font-weight: 600; color: #374151; }
.keyfacts dd { margin: 0; color: #1f2937; }
.keyfacts dd.empty { color: #9ca3af; font-style: italic; }

.missing, .redflags, .halt-reasons, .safety-list, .vitals-list, .first5, .recactions {
  padding-left: 1.3rem; font-size: 0.88rem;
}
.missing li, .redflags li, .safety-list li, .recactions li { margin-bottom: 0.25rem; }
.redflags li { color: #991b1b; }
.safety-list li.critical { color: #991b1b; font-weight: 600; }
.safety-list li.warn { color: #92400e; }
.safety-list li.info { color: #4b5563; }

.score-list {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 0.5rem;
}
.score-card {
  padding: 0.55rem; border-radius: 6px; background: #f9fafb;
  border: 1px solid #e5e7eb;
}
.score-card .name  { font-size: 0.7rem; text-transform: uppercase; color: #6b7280; letter-spacing: 0.04em; }
.score-card .val   { font-size: 1.05rem; font-weight: 700; margin-top: 0.2rem; }
.score-card .level { font-size: 0.75rem; color: #6b7280; }
.score-card.high   { background: #fee2e2; border-color: #dc2626; }
.score-card.high   .val { color: #991b1b; }
.score-card.moderate{ background: #fef3c7; border-color: #f59e0b; }
.score-card.moderate .val { color: #92400e; }
.score-card.low    { background: #d1fae5; border-color: #10b981; }
.score-card.low    .val { color: #065f46; }

.lab-analysis { background: #f9fafb; padding: 0.6rem; border-radius: 6px; font-size: 0.85rem; }

/* ── Lab trends (Phase 3 / Step 3) ── */
.lab-trends { font-size: 0.85rem; }
.lab-trends .empty { color: #9ca3af; font-style: italic; }
.lab-trends table { width: 100%; border-collapse: collapse; }
.lab-trends th, .lab-trends td { padding: 0.35rem 0.5rem; border-bottom: 1px solid #e5e7eb; text-align: left; }
.lab-trends th { font-size: 0.72rem; color: #6b7280; text-transform: uppercase; letter-spacing: 0.04em; }
.lab-trends .trend-arrow { font-weight: 700; font-size: 1rem; }
.lab-trends .trend-rising  { color: #dc2626; }
.lab-trends .trend-falling { color: #1e40af; }
.lab-trends .trend-stable  { color: #6b7280; }
.lab-trends .trend-points  { color: #6b7280; font-size: 0.78rem; }
.lab-trends .delta-pct.up  { color: #dc2626; font-weight: 600; }
.lab-trends .delta-pct.dn  { color: #1e40af; font-weight: 600; }

.dispo-summary { background: #eff6ff; padding: 0.6rem 0.8rem; border-left: 3px solid #1e3a8a; border-radius: 4px; font-size: 0.95rem; font-weight: 600; }

.meta-table { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.meta-table th { text-align: left; padding: 0.3rem 0.6rem 0.3rem 0; color: #6b7280; font-weight: 500; width: 130px; }
.meta-table td { padding: 0.3rem 0; color: #111827; word-break: break-all; }
.audit-raw summary { cursor: pointer; color: #1e3a8a; font-weight: 600; padding: 0.3rem 0; }
.audit-raw pre {
  background: #0f172a; color: #cbd5e1;
  padding: 0.6rem; border-radius: 4px;
  font-size: 0.7rem; overflow-x: auto;
  max-height: 360px;
}

/* ── DICOM Viewer Modal (Phase 3 / Step 1) ── */
.dicom-modal {
  position: fixed; inset: 0;
  background: rgba(15, 23, 42, 0.85);
  display: flex; align-items: center; justify-content: center;
  z-index: 400;
}
.dicom-modal.hidden { display: none; }
.dicom-card {
  background: #0f172a; color: #f1f5f9;
  width: 95%; height: 92%;
  max-width: 1400px; max-height: 950px;
  border-radius: 8px;
  display: flex; flex-direction: column;
  overflow: hidden;
}
.dicom-head {
  display: flex; align-items: center; gap: 0.6rem;
  padding: 0.55rem 0.9rem;
  background: #1e293b;
  border-bottom: 1px solid #334155;
}
.dicom-head h3 { margin: 0; font-size: 0.95rem; flex: 0 0 auto; color: #38bdf8; }
.dicom-tools { flex: 1; display: flex; gap: 0.35rem; flex-wrap: wrap; align-items: center; }
.dicom-tool {
  background: #334155; color: #f1f5f9;
  border: 0; padding: 0.35rem 0.7rem;
  border-radius: 4px; cursor: pointer;
  font-size: 0.8rem;
}
.dicom-tool:hover { background: #475569; }
.dicom-tool.active { background: #38bdf8; color: #0f172a; }
.dicom-sep { width: 1px; height: 22px; background: #475569; margin: 0 0.35rem; }
.dicom-canvas {
  flex: 1; position: relative;
  background: #000;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.dicom-canvas canvas { max-width: 100%; max-height: 100%; }
.dicom-loading {
  color: #94a3b8; font-size: 0.95rem;
}
.dicom-meta {
  padding: 0.45rem 0.9rem;
  background: #1e293b;
  border-top: 1px solid #334155;
  font-size: 0.75rem;
  color: #cbd5e1;
  font-family: ui-monospace, Consolas, monospace;
  overflow-x: auto;
  white-space: nowrap;
}

/* DICOM thumbnail badge */
.attach-thumb .dcm-tag {
  position: absolute; bottom: 4px; left: 4px;
  background: rgba(56, 189, 248, 0.9); color: #0f172a;
  font-size: 0.65rem; padding: 0.1rem 0.3rem; border-radius: 3px;
  font-weight: 700;
}
.attach-thumb .open-btn {
  position: absolute; top: 4px; right: 4px;
  background: #38bdf8; color: #0f172a;
  font-size: 0.65rem; padding: 0.15rem 0.4rem; border-radius: 3px;
  border: 0; cursor: pointer; font-weight: 700;
}
.attach-thumb .open-btn:hover { background: #0ea5e9; color: white; }

/* ── Toast notification ── */
.toast {
  position: fixed; bottom: 240px; right: 20px;
  background: #0f172a; color: white;
  padding: 0.7rem 1rem; border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  font-size: 0.88rem;
  z-index: 300;
  max-width: 360px;
  animation: toast-in 0.18s ease-out;
}
.toast.error   { background: #991b1b; }
.toast.success { background: #065f46; }
.toast.warn    { background: #92400e; }
.toast.hidden  { display: none; }
@keyframes toast-in {
  from { transform: translateY(20px); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

.metrics { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0.5rem; margin-bottom: 0.75rem; }
.metric { background: #f3f4f6; padding: 0.5rem; border-radius: 6px; text-align: center; }
.metric .label { font-size: 0.7rem; color: #6b7280; text-transform: uppercase; }
.metric .value { font-size: 1.1rem; font-weight: 700; margin-top: 0.2rem; color: #111827; }
.metric.red .value { color: #dc2626; }
.metric.yellow .value { color: #d97706; }
.metric.green .value { color: #059669; }

pre.final-out {
  background: #f8fafc;
  border-left: 3px solid #1e3a8a;
  padding: 0.75rem 1rem;
  border-radius: 6px;
  white-space: pre-wrap;
  font-family: -apple-system, "Segoe UI", sans-serif;
  font-size: 0.92rem;
  line-height: 1.5;
  max-height: 420px;
  overflow-y: auto;
}

.oversight { background: #f0f9ff; padding: 0.65rem; border-radius: 6px; border-left: 3px solid #0284c7; }
.flag { font-weight: 700; padding: 0.2rem 0.55rem; border-radius: 4px; font-size: 0.8rem; }
.flag.appropriate { background: #d1fae5; color: #065f46; }
.flag.over_triage { background: #fef3c7; color: #92400e; }
.flag.under_triage { background: #fee2e2; color: #991b1b; }
.oversight p { margin: 0.4rem 0 0; font-size: 0.85rem; color: #475569; }

.evidence { padding-left: 1.2rem; font-size: 0.85rem; }
.evidence .empty { list-style: none; padding-left: 0; color: #9ca3af; font-style: italic; }
.evidence li { margin-bottom: 0.3rem; }

.progress {
  background: #e5e7eb; border-radius: 999px; height: 1.5rem;
  position: relative; margin-bottom: 0.75rem; overflow: hidden;
}
.progress.hidden { display: none; }
#progressFill { background: linear-gradient(90deg, #1e3a8a, #38bdf8); height: 100%; width: 0; transition: width 0.3s; }
#progressMsg {
  position: absolute; top: 0; left: 0; right: 0; bottom: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.85rem; color: #1f2937; font-weight: 500;
}

.pdf-preview {
  margin: 1rem; background: white; padding: 0.5rem 1rem;
  border-radius: 8px; box-shadow: 0 1px 2px rgba(0,0,0,.05);
}
.pdf-preview summary { cursor: pointer; font-weight: 600; padding: 0.4rem 0; color: #1e3a8a; }
.pdf-inner { padding: 0.5rem 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0.75rem; }
.pdf-section h4 { margin: 0 0 0.3rem; font-size: 0.85rem; color: #374151; }
.pdf-section ul { margin: 0; padding-left: 1.1rem; font-size: 0.8rem; }
.pdf-section .empty { list-style: none; padding-left: 0; color: #9ca3af; font-style: italic; }
.pdf-section pre { background: #f8fafc; padding: 0.4rem; font-size: 0.78rem; white-space: pre-wrap; max-height: 160px; overflow-y: auto; border-radius: 4px; }
.pdf-section textarea { width: 100%; padding: 0.4rem; border: 1px solid #d1d5db; border-radius: 4px; font: inherit; min-height: 60px; }

.modal {
  position: fixed; inset: 0;
  background: rgba(15, 23, 42, 0.55);
  display: flex; align-items: center; justify-content: center;
  z-index: 100;
}
.modal.hidden { display: none; }
.modal-card {
  background: white; border-radius: 8px; max-width: 540px; width: 92%;
  max-height: 80vh; display: flex; flex-direction: column;
}
.modal-card header { display: flex; align-items: center; padding: 0.6rem 1rem; border-bottom: 1px solid #e5e7eb; }
.modal-card header h3 { margin: 0; flex: 1; font-size: 1rem; color: #1e3a8a; }
.modal-body { padding: 1rem; overflow-y: auto; flex: 1; }
.modal-body label { display: flex; align-items: center; gap: 0.5rem; padding: 0.3rem 0.4rem; font-size: 0.92rem; cursor: pointer; border-radius: 4px; }
.modal-body label:hover { background: #f3f4f6; }
.modal-body input[type=checkbox] { width: 16px; height: 16px; }
.modal-card footer { padding: 0.6rem 1rem; border-top: 1px solid #e5e7eb; display: flex; gap: 0.5rem; justify-content: flex-end; }
.modal-card footer button { padding: 0.5rem 1rem; border-radius: 6px; border: 1px solid #d1d5db; background: white; cursor: pointer; }
.modal-card footer button.primary { background: #1e3a8a; color: white; border-color: #1e3a8a; width: auto; margin-top: 0; }

.drawer {
  position: fixed; top: 0; right: 0; bottom: 0;
  width: 320px; background: white;
  box-shadow: -2px 0 8px rgba(0,0,0,.15);
  padding: 1.25rem; z-index: 200;
  transform: translateX(100%); transition: transform 0.2s;
}
.drawer:not(.hidden) { transform: translateX(0); }
.drawer h3 { margin-top: 0; }
.drawer label { display: block; margin-bottom: 0.75rem; font-size: 0.9rem; color: #4b5563; }
.drawer label input { width: 100%; padding: 0.45rem; border: 1px solid #d1d5db; border-radius: 4px; margin-top: 0.3rem; font: inherit; }
.drawer .hint { font-size: 0.75rem; color: #6b7280; margin-top: 0.75rem; line-height: 1.4; }

/* ── Key management (Phase 3 / Step 4) ── */
.drawer { overflow-y: auto; }
.key-list {
  margin-top: 0.6rem;
  font-size: 0.78rem;
  max-height: 280px; overflow-y: auto;
}
.key-row {
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  padding: 0.4rem 0.5rem;
  margin-bottom: 0.4rem;
  background: #fafafa;
}
.key-row.inactive { opacity: 0.5; }
.key-row .name  { font-weight: 600; color: #111827; }
.key-row .keyv  { font-family: ui-monospace, Consolas, monospace; color: #4b5563; word-break: break-all; }
.key-row .meta  { color: #6b7280; font-size: 0.7rem; margin-top: 0.2rem; }
.key-row .actions { display: flex; gap: 0.3rem; margin-top: 0.4rem; }
.key-row .actions button {
  flex: 1; padding: 0.25rem 0.4rem; border: 1px solid #d1d5db; background: white;
  border-radius: 3px; cursor: pointer; font-size: 0.7rem;
}
.key-row .actions button.danger { border-color: #dc2626; color: #dc2626; }
.key-row .actions button.danger:hover { background: #fee2e2; }
.key-row .actions button.primary { background: #1e3a8a; color: white; border-color: #1e3a8a; width: auto; margin: 0; }

/* Debug overlay */
.debug-bar {
  position: fixed; bottom: 0; left: 0; right: 0;
  background: #0f172a; color: #f1f5f9;
  font-family: ui-monospace, "SF Mono", Consolas, monospace;
  font-size: 11px;
  z-index: 999;
  border-top: 2px solid #38bdf8;
  max-height: 220px;
  display: flex; flex-direction: column;
}
.debug-bar.hidden { display: none; }
.debug-head { display: flex; align-items: center; gap: 0.5rem; padding: 0.4rem 0.75rem; background: #1e293b; }
.debug-head strong { color: #38bdf8; font-family: -apple-system, sans-serif; }
.debug-head .icon-btn { color: #94a3b8; padding: 0; font-size: 0.9rem; }
.debug-head .icon-btn:hover { color: #f1f5f9; }
#debugLog {
  margin: 0; padding: 0.5rem 0.75rem;
  overflow-y: auto; flex: 1;
  white-space: pre-wrap;
  line-height: 1.45;
}
.dlog-info  { color: #cbd5e1; }
.dlog-ok    { color: #4ade80; }
.dlog-warn  { color: #fbbf24; }
.dlog-error { color: #f87171; font-weight: 600; }
.dlog-net   { color: #38bdf8; }

/* Phase 20 / γ — help tooltips */
.help-tip {
  display: inline-block;
  width: 16px; height: 16px;
  border-radius: 50%;
  background: #6b7280;
  color: white;
  text-align: center;
  font-size: 11px;
  line-height: 16px;
  cursor: help;
  margin-left: 4px;
  font-weight: 700;
  position: relative;
}
.help-tip:hover { background: #1e3a8a; }
.help-tip::before {
  content: attr(data-tip);
  position: absolute;
  bottom: 130%;
  left: 50%;
  transform: translateX(-50%);
  background: #1e293b;
  color: white;
  padding: 6px 10px;
  border-radius: 4px;
  font-size: 0.78rem;
  font-weight: 400;
  white-space: nowrap;
  max-width: 320px;
  white-space: normal;
  width: max-content;
  max-width: min(320px, 90vw);
  display: none;
  z-index: 9000;
  text-align: left;
  line-height: 1.4;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}
.help-tip:hover::before, .help-tip:focus::before { display: block; }

/* Phase 5 / β.2 — drug interaction warnings */
#drugInteractionsBox { margin-top: 0.6rem; padding: 0.5rem 0.7rem; border-radius: 4px; background: #fefce8; border-left: 4px solid #f59e0b; font-size: 0.82rem; }
#drugInteractionsBox.hidden { display: none; }
.drug-clean { color: #065f46; font-weight: 600; }
.drug-warn-head { color: #92400e; font-weight: 700; margin-bottom: 0.3rem; }
.drug-warn-list { list-style: none; padding: 0; margin: 0; }
.drug-warn-list li { padding: 0.4rem 0.5rem; border-bottom: 1px solid #fde68a; }
.drug-warn-list li:last-child { border-bottom: 0; }
.drug-warn-list .sev-tag { display: inline-block; padding: 1px 6px; border-radius: 3px; font-size: 0.7rem; font-weight: 700; margin-right: 0.4rem; }
.drug-warn-list li.sev-contra { background: #fee2e2; }
.drug-warn-list li.sev-contra .sev-tag { background: #b91c1c; color: white; }
.drug-warn-list li.sev-major  { background: #fff1f2; }
.drug-warn-list li.sev-major  .sev-tag { background: #dc2626; color: white; }
.drug-warn-list li.sev-mod    .sev-tag { background: #f59e0b; color: white; }
.drug-warn-list li.sev-min    .sev-tag { background: #94a3b8; color: white; }
.drug-reason { font-size: 0.78rem; color: #1f2937; margin-top: 2px; }
.drug-hint   { font-size: 0.78rem; color: #166534; margin-top: 2px; font-style: italic; }
.drug-unknown { font-size: 0.74rem; color: #9ca3af; margin-top: 0.4rem; }

/* Phase 4 / I — lab reference-range badges */
.range-flag { display: inline-block; margin-left: 0.25rem; font-weight: 700; font-size: 0.78rem; padding: 0 4px; border-radius: 3px; }
.range-flag.range-crit   { background: #dc2626; color: white;   box-shadow: 0 0 0 2px rgba(220,38,38,0.25); }
.range-flag.range-high   { background: #fef3c7; color: #92400e; }
.range-flag.range-low    { background: #dbeafe; color: #1e3a8a; }
.range-flag.range-normal { background: #d1fae5; color: #065f46; }
td.range-crit   { color: #dc2626; font-weight: 700; }
td.range-high   { color: #b45309; font-weight: 600; }
td.range-low    { color: #1e40af; font-weight: 600; }
td.range-normal { color: #065f46; }
td.ref-cell     { color: #9ca3af; font-size: 0.85em; }

/* Phase 1 / Dalga 11 — RAG feedback buttons under each evidence chunk */
.rag-fb { display: inline-flex; gap: 6px; margin-top: 4px; }
.rag-fb-btn {
  background: transparent;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 1px 8px;
  cursor: pointer;
  font-size: 13px;
  line-height: 1.2;
  transition: all .12s ease;
}
.rag-fb-btn:hover:not(:disabled) {
  border-color: #1e3a8a;
  background: #eff6ff;
}
.rag-fb-btn:disabled { cursor: default; opacity: 0.6; }
.rag-fb-btn.voted-up   { background: #ecfdf5; border-color: #10b981; }
.rag-fb-btn.voted-down { background: #fef2f2; border-color: #ef4444; }

/* Sprint 7 — AI Toolbox details/summary polish */
#aiToolboxDetails > summary::-webkit-details-marker { display: none; }
#aiToolboxDetails[open] .ai-toolbox-caret { transform: rotate(90deg); }
#aiToolboxDetails > summary:hover { background: #f3f4f6; border-radius: 6px; }

/* Sprint 8 — Active AI Surveillance banner */
#aiSurvBanner {
  position: sticky; top: 0; z-index: 80;
  display: none;
  padding: 0.55rem 0.9rem;
  font-size: 0.92rem; font-weight: 600;
  color: #fff;
  border-bottom: 2px solid rgba(0,0,0,0.15);
  display: flex; align-items: center; gap: 0.6rem;
  animation: ai-surv-pulse 1.6s ease-in-out infinite;
}
#aiSurvBanner.hidden { display: none !important; }
#aiSurvBanner .label { flex: 1; }
#aiSurvBanner .meta  { font-size: 0.75rem; font-weight: 400; opacity: 0.85; margin-top: 2px; }
#aiSurvBanner .actions { display: flex; gap: 0.4rem; }
#aiSurvBanner button {
  background: rgba(255,255,255,0.18); color: white; border: 1px solid rgba(255,255,255,0.35);
  padding: 3px 10px; border-radius: 4px; font-size: 0.78rem; cursor: pointer;
}
#aiSurvBanner button:hover { background: rgba(255,255,255,0.28); }
#aiSurvBanner.sev-critical  { background: linear-gradient(90deg, #b91c1c 0%, #dc2626 100%); }
#aiSurvBanner.sev-immediate { background: linear-gradient(90deg, #b91c1c 0%, #dc2626 100%); }
#aiSurvBanner.sev-urgent    { background: linear-gradient(90deg, #b45309 0%, #d97706 100%); }
@keyframes ai-surv-pulse {
  0%,100% { box-shadow: inset 0 0 0 0 rgba(255,255,255,0); }
  50%     { box-shadow: inset 0 -3px 0 0 rgba(255,255,255,0.45); }
}

/* Aşama F.2 — Mobile responsive (single column under 900px) */
@media (max-width: 900px) {
  .layout, .three-col, main, body > div.app {
    grid-template-columns: 1fr !important;
    flex-direction: column !important;
  }
  .col-left, .col-center, .col-right { width: 100% !important; max-width: 100% !important; }
  .modal-card { max-width: 95vw !important; }
  #aiSurvBanner { font-size: 0.78rem; padding: 6px 10px; }
  #cdsDisclaimer { font-size: 0.72rem; padding: 4px 8px; }
  .pilot-feedback-rail { font-size: 0.7rem !important; }
  .pilot-feedback-rail .pf-comment { min-width: 100px !important; }
}
@media (max-width: 600px) {
  header.topbar { flex-wrap: wrap; gap: 4px; padding: 4px 8px; }
  .actions, .action { font-size: 0.78rem; }
}
