@import url("https://fonts.googleapis.com/css2?family=Prompt:wght@300;400;500;600;700;800&display=swap");

:root {
  --font-main: "Prompt", "Noto Sans Thai", "Leelawadee UI", "Tahoma", sans-serif;
  --bg: #eef3f8;
  --surface: #ffffff;
  --surface-soft: #f8fbfd;
  --line: #d8e2ec;
  --line-strong: #c6d3df;
  --text: #142033;
  --muted: #64748b;
  --blue: #1d4ed8;
  --blue-soft: #e8f0ff;
  --teal: #0f766e;
  --teal-soft: #e4f5f2;
  --green: #15803d;
  --green-soft: #dcfce7;
  --yellow: #b45309;
  --yellow-soft: #fef3c7;
  --red: #b91c1c;
  --red-soft: #fee2e2;
  --black: #1f2937;
  --shadow: 0 14px 36px rgba(15, 23, 42, .08);
  --sidebar-width: 260px;
  --sidebar-collapsed-width: 76px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: var(--font-main);
  background: var(--bg);
  color: var(--text);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.dark {
  --bg: #0b1220;
  --surface: #111827;
  --surface-soft: #162033;
  --line: #263449;
  --line-strong: #334155;
  --text: #e5edf7;
  --muted: #9aa8ba;
  --blue-soft: #172554;
  --teal-soft: #123c3a;
  --green-soft: #13331f;
  --yellow-soft: #3b2b0c;
  --red-soft: #3a1515;
  --shadow: 0 16px 36px rgba(0, 0, 0, .28);
}

button, input, select, textarea, table, canvas { font-family: var(--font-main); }

button {
  border: 0;
  cursor: pointer;
}

.app-shell {
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  min-height: 100vh;
  transition: grid-template-columns .22s ease;
}

.app-shell.sidebar-collapsed { grid-template-columns: var(--sidebar-collapsed-width) minmax(0, 1fr); }

.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  background: #0f1f2e;
  color: #f8fafc;
  padding: 22px 18px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  border-right: 1px solid rgba(255,255,255,.08);
  overflow-y: auto;
}

.brand {
  position: sticky;
  top: -22px;
  z-index: 12;
  display: flex;
  gap: 12px;
  align-items: center;
  margin: -22px -18px 0;
  padding: 22px 18px 16px;
  border-bottom: 1px solid rgba(255,255,255,.1);
  background: #0f1f2e;
}

.brand-copy { min-width: 0; }

.sidebar-toggle {
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 8px;
  color: #ffffff;
  background: rgba(255,255,255,.08);
  font-size: 20px;
  line-height: 1;
  transition: background .2s ease, border-color .2s ease;
}

.sidebar-toggle:hover { background: rgba(255,255,255,.16); }

.header-sidebar-toggle {
  width: 42px;
  height: 42px;
  color: var(--text);
  background: var(--surface-soft);
  border-color: var(--line);
}

.header-sidebar-toggle:hover {
  color: #ffffff;
  background: var(--blue);
  border-color: var(--blue);
}

.app-shell.sidebar-collapsed .sidebar {
  padding-inline: 12px;
  overflow-x: hidden;
}

.app-shell.sidebar-collapsed .brand {
  justify-content: center;
  margin-inline: -12px;
  padding-inline: 12px;
}

.app-shell.sidebar-collapsed .brand-logo {
  width: 44px;
  height: 44px;
}

.app-shell.sidebar-collapsed .brand-copy,
.app-shell.sidebar-collapsed .nav-group h3,
.app-shell.sidebar-collapsed .nav-item span,
.app-shell.sidebar-collapsed .nav-item small,
.app-shell.sidebar-collapsed .sidebar-actions span,
.app-shell.sidebar-collapsed .sync-card div {
  display: none;
}

.app-shell.sidebar-collapsed .sidebar-toggle {
  background: #1d4ed8;
  border-color: #1d4ed8;
  color: #ffffff;
}

.app-shell.sidebar-collapsed .nav { gap: 6px; }
.app-shell.sidebar-collapsed .nav-group { gap: 5px; padding-block: 8px; }
.app-shell.sidebar-collapsed .nav-item {
  grid-template-columns: 1fr;
  place-items: center;
  padding: 8px;
}
.app-shell.sidebar-collapsed .nav-item i { grid-row: auto; }
.app-shell.sidebar-collapsed .sidebar-actions { grid-template-columns: 1fr; }
.app-shell.sidebar-collapsed .sidebar-actions button { min-height: 38px; padding: 8px; }
.app-shell.sidebar-collapsed .sidebar-actions i { display: block; font-style: normal; font-size: 18px; }
.app-shell.sidebar-collapsed .sync-card { justify-content: center; padding: 12px; }

.brand-logo {
  width: 52px;
  height: 52px;
  border-radius: 8px;
  background: #ffffff;
  object-fit: contain;
  padding: 5px;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}

.brand strong {
  display: block;
  font-size: 20px;
  line-height: 1.1;
}

.brand span, .sync-card small, .nav-item small {
  color: #c9d6e3;
  font-size: 12px;
}

.nav {
  display: grid;
  gap: 12px;
  align-content: start;
}

.nav-group {
  display: grid;
  gap: 5px;
  padding: 10px 0 12px;
  border-top: 1px solid rgba(255,255,255,.1);
}

.nav-group h3 {
  margin: 0 0 3px;
  padding: 0 8px;
  color: #8fb3d7;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .02em;
}

.nav-section-toggle {
  width: 100%;
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 10px;
  border-radius: 10px;
  color: #dbe5ef;
  background: transparent;
  font-weight: 800;
  text-align: left;
}

.nav-section-toggle:hover,
.nav-section-toggle:focus-visible { background: rgba(255,255,255,.09); }
.nav-section-toggle b { transition: transform .2s ease; }
.nav-collapsible.open .nav-section-toggle b { transform: rotate(180deg); }
.nav-submenu { display: none; gap: 4px; padding-left: 6px; }
.nav-collapsible.open .nav-submenu { display: grid; }
.app-shell.sidebar-collapsed .nav-section-toggle span,
.app-shell.sidebar-collapsed .nav-section-toggle b { display: none; }
.app-shell.sidebar-collapsed .nav-section-toggle::before { content: "•••"; margin: auto; color: #8fb3d7; }
.app-shell.sidebar-collapsed .nav-collapsible.open .nav-submenu { display: grid; padding-left: 0; }

.nav-item.primary {
  background: rgba(37, 99, 235, .18);
  border-color: rgba(147,197,253,.22);
}

.nav-item {
  width: 100%;
  text-align: left;
  color: #dbe5ef;
  background: transparent;
  padding: 9px 10px;
  border-radius: 8px;
  display: grid;
  gap: 2px;
  border: 1px solid transparent;
  cursor: pointer;
}

.nav-item span {
  font-weight: 700;
}

.nav-item:hover, .nav-item.active {
  background: rgba(255,255,255,.09);
  color: #ffffff;
  border-color: rgba(255,255,255,.12);
}

.nav-item.active::before {
  content: "";
  position: absolute;
  left: -10px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 4px;
  background: #60a5fa;
}

.nav-item.active i {
  background: #1d4ed8;
  color: #ffffff;
}

.sync-card {
  margin-top: auto;
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 8px;
  background: rgba(255,255,255,.06);
}

.dot, .pin {
  width: 11px;
  height: 11px;
  display: inline-block;
  border-radius: 999px;
}

.ok, .controlled { background: var(--green); }
.watch { background: var(--yellow); }
.uncontrolled { background: var(--red); }
.lost { background: var(--black); }

.main {
  min-width: 0;
  padding: 24px;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 18;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  margin-bottom: 18px;
  min-height: 88px;
  padding: 12px 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  backdrop-filter: blur(12px);
  flex-wrap: nowrap;
}

.topbar-logo {
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  border-radius: 8px;
  object-fit: contain;
  background: #ffffff;
  border: 1px solid var(--line);
  padding: 5px;
}

.eyebrow {
  margin: 0 0 4px;
  color: var(--teal);
  font-size: 13px;
  font-weight: 800;
}

.topbar h1 {
  margin: 0;
  font-size: 21px;
  line-height: 1.2;
}

.topbar p {
  margin: 5px 0 0;
  color: var(--muted);
}

.top-title > p:last-child { display: none; }

.top-actions, .header-tools {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}

.header-tools {
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  min-width: 0;
}

.top-title {
  min-width: 0;
  flex: 1 1 320px;
}

#globalPatientSearch {
  width: 100%;
  max-width: 100%;
}

.header-search { position: relative; flex: 1 1 360px; max-width: 560px; }
.header-search input { min-height: 44px; padding-inline: 14px; }
.patient-search-results {
  position: absolute;
  z-index: 40;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  max-height: 360px;
  overflow-y: auto;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: 0 18px 40px rgba(15,23,42,.18);
}
.search-result-item { width: 100%; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 3px 12px; padding: 11px 12px; border-radius: 10px; color: var(--text); background: transparent; text-align: left; }
.search-result-item:hover, .search-result-item:focus-visible { background: var(--blue-soft); outline: 2px solid var(--blue); }
.search-result-item strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-result-item small { color: var(--muted); }
.search-result-item em { grid-row: 1 / span 2; grid-column: 2; align-self: center; padding: 4px 8px; border-radius: 999px; color: var(--blue); background: var(--blue-soft); font-style: normal; font-size: 12px; font-weight: 800; }
.search-state { padding: 20px; color: var(--muted); text-align: center; }

.connection-status { min-height: 46px; display: flex; gap: 9px; align-items: center; padding: 6px 10px; border: 1px solid var(--line); border-radius: 12px; color: var(--text); background: var(--surface-soft); text-align: left; }
.connection-status .dot { flex: 0 0 auto; background: var(--muted); }
.connection-status .dot.ok { background: var(--green); }
.connection-status strong, .connection-status small { display: block; white-space: nowrap; }
.connection-status strong { font-size: 12px; }
.connection-status small { color: var(--muted); font-size: 11px; }
.user-chip { min-height: 44px; display: flex; align-items: center; gap: 7px; padding: 5px 9px; border: 1px solid var(--line); border-radius: 12px; color: var(--text); background: var(--surface); }
.user-chip span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--blue); font-weight: 800; }
.user-chip b { font-size: 12px; }

.global-filter-bar { position: sticky; top: 106px; z-index: 16; display: grid; grid-template-columns: repeat(5,minmax(130px,1fr)) auto; gap: 10px; align-items: end; margin-bottom: 16px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: color-mix(in srgb, var(--surface) 96%, transparent); box-shadow: 0 8px 24px rgba(15,23,42,.06); backdrop-filter: blur(12px); }
.global-filter-bar label { display: grid; gap: 5px; color: var(--muted); font-size: 12px; font-weight: 800; }
.global-filter-bar select { min-height: 42px; }
.global-filter-bar button { min-height: 42px; padding: 0 14px; border: 1px solid var(--line); border-radius: 10px; color: var(--text); background: var(--surface-soft); font-weight: 800; }
.global-filter-bar button:hover { background: var(--blue-soft); color: var(--blue); }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.current-time {
  min-height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px;
  background: var(--surface-soft);
  color: var(--muted);
  font-weight: 800;
  white-space: nowrap;
}

.icon-button, .panel button, .home-form button {
  min-height: 38px;
  border-radius: 8px;
  padding: 0 14px;
  background: var(--blue);
  color: white;
  font-weight: 700;
}

.icon-button.secondary {
  background: var(--teal);
}

.view { display: none; }
.view.active { display: block; }

.dashboard-tabs {
  position: sticky;
  top: 112px;
  z-index: 8;
  display: flex;
  gap: 8px;
  align-items: center;
  overflow-x: auto;
  margin: 0 0 14px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  box-shadow: var(--shadow);
}

.dashboard-tab {
  flex: 0 0 auto;
  min-height: 40px;
  padding: 9px 14px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
  white-space: nowrap;
}

.dashboard-tab:hover {
  background: var(--surface-soft);
  color: var(--text);
  border-color: var(--line);
}

.dashboard-tab.active,
.dashboard-tab[aria-selected="true"] {
  background: var(--blue);
  color: #ffffff;
  border-color: var(--blue);
  box-shadow: 0 10px 24px rgba(29, 78, 216, .24);
}

[data-dashboard-panel][hidden] {
  display: none !important;
}

.quick-actions, .filter-panel {
  display: grid;
  gap: 10px;
  margin-bottom: 14px;
}

.quick-actions {
  grid-template-columns: auto repeat(5, minmax(105px, max-content));
  align-items: center;
  justify-content: start;
}
.quick-actions > span { color: var(--muted); font-size: 13px; font-weight: 800; }
.quick-actions button:disabled { opacity: .52; cursor: not-allowed; }

.quick-actions button, .sidebar-actions button {
  min-height: 38px;
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--line);
  font-weight: 800;
}

.quick-actions button:hover, .sidebar-actions button:hover {
  background: var(--blue-soft);
}

.filter-panel {
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.filter-panel label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(240px, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.metric-section {
  display: grid;
  gap: 10px;
}

.metric-section h3 {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.metric-section-grid {
  display: grid;
  gap: 10px;
}

.metric-card, .panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.metric-card {
  min-height: 108px;
  padding: 14px;
  display: grid;
  align-content: space-between;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .05);
  border-left: 4px solid var(--blue);
  position: relative;
  overflow: hidden;
}

.metric-card.teal { border-left-color: var(--teal); }
.metric-card.green { border-left-color: var(--green); }
.metric-card.amber { border-left-color: var(--yellow); }
.metric-card.red { border-left-color: var(--red); }

.metric-top, .kpi-heading, .priority-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.metric-icon {
  min-width: 34px;
  height: 34px;
  border-radius: 8px;
  display: inline-grid;
  place-items: center;
  background: var(--blue-soft);
  color: var(--blue);
  font-weight: 900;
  font-size: 13px;
}

.sparkline {
  width: 100%;
  height: 34px;
  margin-top: 6px;
}

.sparkline polyline {
  fill: none;
  stroke: var(--teal);
  stroke-width: 3;
}

.skeleton {
  min-height: 108px;
  background: linear-gradient(90deg, var(--surface-soft), #e9eef5, var(--surface-soft));
  background-size: 220% 100%;
  animation: pulse 1.1s infinite;
}

@keyframes pulse {
  to { background-position: -220% 0; }
}

.metric-card span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.metric-card strong {
  display: block;
  margin-top: 7px;
  font-size: 29px;
  line-height: 1;
}

.metric-card small {
  color: var(--teal);
  font-weight: 700;
}

.metric-card:nth-child(2), .metric-card:nth-child(4), .metric-card:nth-child(8) { border-left-color: var(--teal); }
.metric-card:nth-child(3), .metric-card:nth-child(10), .metric-card:nth-child(11) { border-left-color: var(--yellow); }
.metric-card:nth-child(9), .metric-card:nth-child(13) { border-left-color: var(--red); }

.dashboard-layout, .followup-grid, .settings-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(360px, .65fr);
  gap: 14px;
}

.dashboard-layout.secondary {
  margin-top: 14px;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .7fr);
}

.chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.chart-grid canvas {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  min-height: 220px;
}

.panel {
  padding: 16px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .05);
}

.panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}

.panel-head h2 {
  margin: 0;
  font-size: 18px;
}

.panel-head span, .legend, .muted {
  color: var(--muted);
  font-size: 13px;
}

select, input, textarea {
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  padding: 9px 10px;
  background: var(--surface);
  min-width: 0;
  color: var(--text);
}

select:focus, input:focus, textarea:focus {
  outline: 3px solid #dbeafe;
  border-color: var(--blue);
}

canvas {
  width: 100%;
  max-width: 100%;
}

.map-filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.map-panel {
  height: 420px;
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #e2e8f0;
}

.map-panel .leaflet-container {
  width: 100%;
  height: 100%;
  font-family: var(--font-main);
}

.real-map-pin {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 3px solid #ffffff;
  box-shadow: 0 5px 15px rgba(0,0,0,.2);
}

.real-map-cluster {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 3px solid #fff;
  background: #1d4ed8;
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 800;
  box-shadow: 0 8px 18px rgba(0,0,0,.24);
}

.map-empty {
  height: 100%;
  display: grid;
  place-items: center;
  color: var(--muted);
  padding: 18px;
  text-align: center;
}

.map-empty::before {
  content: "";
  width: 72px;
  height: 72px;
  display: block;
  margin: 0 auto 10px;
  background: url("assets/smart-ncd-logo.png") center / contain no-repeat;
  opacity: .9;
}

.patient-summary {
  margin-top: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--surface-soft);
  color: var(--muted);
}

.legend {
  margin-top: 10px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.legend span {
  display: inline-flex;
  gap: 6px;
  align-items: center;
}

.ai-item, .kpi-item, .task-item, .volunteer-item, .notification-item, .exec-card, .ai-summary {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 10px;
  background: var(--surface-soft);
}

.ai-dashboard, .executive-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.ai-summary strong, .exec-card strong {
  display: block;
  font-size: 26px;
}

.notification-list {
  display: grid;
  gap: 10px;
}

.notification-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.badge, .nav-badge {
  display: inline-grid;
  place-items: center;
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  border-radius: 999px;
  background: var(--red);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.nav-badge {
  position: absolute;
  right: 8px;
  top: 8px;
}

.ai-item strong, .task-item strong, .volunteer-item strong {
  display: block;
  margin-bottom: 4px;
}

.risk-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 12px;
  color: #fff;
  font-weight: 800;
  white-space: nowrap;
}

.kpi-track {
  height: 8px;
  background: var(--blue-soft);
  border-radius: 999px;
  margin-top: 8px;
  overflow: hidden;
}

.kpi-track span {
  display: block;
  height: 100%;
  background: var(--teal);
}

.area-tag {
  display: inline-flex;
  align-items: center;
  margin-top: 4px;
  border-radius: 999px;
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.area-tag.inside {
  background: var(--green-soft);
  color: #166534;
}

.area-tag.outside {
  background: var(--yellow-soft);
  color: #92400e;
}

.registry-toolbar {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) 190px;
  gap: 12px;
  margin-bottom: 12px;
}

.registry-landing,
.registry-detail {
  min-width: 0;
}

.registry-detail[hidden],
.registry-landing[hidden] { display: none; }

.registry-page-head,
.registry-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 14px;
}

.registry-page-head h2,
.registry-detail-head h2 {
  margin: 0;
  font-size: 26px;
}

.registry-page-head p,
.registry-detail-head p {
  margin: 4px 0 0;
  color: var(--muted);
}

.registry-head-tools,
.registry-detail-tools {
  display: grid;
  grid-template-columns: minmax(230px, 1fr) 160px 120px;
  gap: 9px;
  min-width: min(100%, 540px);
}

.registry-detail-tools {
  grid-template-columns: minmax(220px, 1fr) 150px 150px 115px;
  min-width: min(100%, 700px);
}

.registry-summary-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-bottom: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  overflow: hidden;
}

.registry-summary-item {
  min-width: 0;
  padding: 10px 13px;
  border-right: 1px solid var(--line);
}

.registry-summary-item:last-child { border-right: 0; }

.registry-summary-item span,
.registry-summary-item strong { display: block; }

.registry-summary-item span {
  color: var(--muted);
  font-size: 11px;
}

.registry-summary-item strong {
  margin-top: 2px;
  font-size: 19px;
}

.registry-summary-item.controlled strong { color: var(--green); }
.registry-summary-item.followup strong { color: var(--red); }
.registry-summary-item.lost-status strong { color: var(--black); }

.registry-source-row {
  display: flex;
  justify-content: flex-end;
  gap: 18px;
  margin-bottom: 12px;
  color: var(--muted);
  font-size: 11px;
}

.disease-registry-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: 12px;
}

.disease-registry-card {
  --disease-color: var(--blue);
  min-width: 0;
  height: 100%;
  padding: 14px;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  border-top: 3px solid var(--disease-color);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: 0 6px 18px rgba(15, 23, 42, .045);
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.disease-registry-card:hover,
.disease-registry-card:focus-visible {
  border-color: var(--disease-color);
  box-shadow: 0 11px 24px rgba(15, 23, 42, .1);
  transform: translateY(-2px);
  outline: none;
}

.disease-card-head {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.disease-card-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: var(--disease-color);
  background: color-mix(in srgb, var(--disease-color) 12%, var(--surface));
  font-size: 12px;
  font-weight: 800;
}

.disease-card-title strong,
.disease-card-title span { display: block; }

.disease-card-title strong {
  color: var(--text);
  font-size: 18px;
}

.disease-card-title span {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.disease-card-total {
  text-align: right;
  white-space: nowrap;
}

.disease-card-total strong,
.disease-card-total span { display: block; }

.disease-card-total strong { font-size: 21px; }
.disease-card-total span { color: var(--muted); font-size: 10px; }

.disease-card-statuses {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 12px;
  margin: 12px 0;
  padding: 10px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.disease-status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--muted);
  font-size: 10px;
}

.disease-status-row b { color: var(--text); font-size: 12px; }

.status-dot {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 999px;
}

.status-label {
  display: flex;
  align-items: center;
  gap: 5px;
}

.disease-card-link {
  margin-top: auto;
  color: var(--disease-color);
  font-size: 11px;
  font-weight: 800;
  text-align: right;
}

.registry-back-button {
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  background: var(--surface);
  font-size: 21px;
}

.registry-back-button:hover { color: #ffffff; background: var(--blue); }

.registry-detail-title {
  min-width: 240px;
  margin-right: auto;
}

.registry-breadcrumb {
  font-size: 11px;
}

.registry-breadcrumb span { padding: 0 5px; }

.registry-detail-summary {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-bottom: 12px;
}

.registry-table-wrap {
  max-height: 62vh;
  background: var(--surface);
}

.registry-disease-table { min-width: 1760px; }

.registry-disease-table th,
.registry-disease-table td {
  padding: 9px 8px;
  font-size: 11px;
}

.registry-disease-table td strong { font-size: 12px; }

.comorbidity-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.comorbidity-badge {
  display: inline-flex;
  padding: 3px 6px;
  border-radius: 5px;
  background: var(--blue-soft);
  color: #1e40af;
  font-size: 10px;
  font-weight: 800;
}

body.dark .comorbidity-badge { color: #bfdbfe; }

.registry-risk-score {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-weight: 800;
}

.registry-action-button {
  padding: 6px 9px;
  border-radius: 6px;
  color: #ffffff;
  background: var(--blue);
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

.registry-pagination {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}

.registry-pagination button {
  min-width: 34px;
  height: 34px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  background: var(--surface);
}

.registry-pagination button:disabled { opacity: .45; cursor: default; }

.registry-pagination span { color: var(--muted); font-size: 11px; }

.profile-return-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
}

.profile-return-bar button {
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  background: var(--surface-soft);
  font-weight: 700;
}

.registry-result {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 36px;
  margin-bottom: 12px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.patient-registry-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
  max-width: 100%;
}

.patient-registry-card {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: 0 6px 18px rgba(15, 23, 42, .04);
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.patient-registry-card:hover,
.patient-registry-card:focus-visible {
  border-color: #93b4e8;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .09);
  transform: translateY(-1px);
  outline: none;
}

.patient-card-head {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding-bottom: 13px;
  border-bottom: 1px solid var(--line);
}

.patient-card-name {
  min-width: 0;
}

.patient-card-name strong,
.patient-card-name span {
  display: block;
  overflow-wrap: anywhere;
}

.patient-card-name strong {
  margin-bottom: 2px;
  font-size: 17px;
}

.patient-card-name span {
  color: var(--muted);
  font-size: 12px;
}

.patient-card-sections {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 18px;
  padding-top: 14px;
}

.patient-card-section {
  min-width: 0;
}

.patient-card-section h3 {
  margin: 0 0 8px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
}

.patient-card-section dl {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 5px 8px;
  margin: 0;
  font-size: 12px;
}

.patient-card-section dt {
  color: var(--muted);
}

.patient-card-section dd {
  min-width: 0;
  margin: 0;
  color: var(--text);
  font-weight: 600;
  overflow-wrap: anywhere;
}

.disease-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.disease-chip {
  display: inline-flex;
  padding: 3px 7px;
  border-radius: 6px;
  background: var(--blue-soft);
  color: #1e40af;
  font-size: 11px;
  font-weight: 800;
}

body.dark .disease-chip { color: #bfdbfe; }

.registry-empty {
  grid-column: 1 / -1;
  padding: 42px 20px;
  border: 1px dashed var(--line-strong);
  border-radius: 8px;
  color: var(--muted);
  text-align: center;
}

.table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  max-height: 68vh;
}

table {
  width: 100%;
  border-collapse: collapse;
  min-width: 1040px;
  background: var(--surface);
}

th, td {
  padding: 11px 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
}

th {
  position: sticky;
  top: 0;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  z-index: 1;
}

tbody tr:hover {
  background: #f8fbfd;
}

.avatar {
  width: 42px;
  height: 42px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: var(--blue-soft);
  color: var(--blue);
  font-weight: 800;
}

.profile-grid {
  display: grid;
  grid-template-columns: minmax(320px, .55fr) minmax(0, 1fr);
  gap: 14px;
}

.profile-wide {
  grid-column: 1 / -1;
}

.clinical-summary {
  display: grid;
  gap: 10px;
}

.clinical-card, .clinical-grid > div {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface-soft);
}

.clinical-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.clinical-grid span {
  display: block;
  color: var(--muted);
  font-size: 12px;
}

.clinical-grid b {
  display: block;
  margin-top: 4px;
}

.profile-card h2 {
  margin: 8px 0;
  font-size: 24px;
}

.profile-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.meta-cell {
  background: var(--surface-soft);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  min-width: 0;
}

.meta-cell span {
  color: var(--muted);
  font-size: 12px;
}

.meta-cell strong {
  display: block;
  margin-top: 3px;
  overflow-wrap: anywhere;
}

.vital-grid, .channel-grid, .report-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.vital-cell, .channel-cell, .report-cell {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface-soft);
}

.vital-cell strong, .report-cell strong {
  display: block;
  margin-top: 4px;
  font-size: 20px;
}

.timeline {
  display: grid;
  gap: 10px;
}

.timeline-item {
  padding-left: 14px;
  border-left: 3px solid var(--teal);
}

.missed-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.missed-tabs button {
  background: var(--blue-soft);
  color: #1e3a8a;
}

.missed-tabs button.active {
  background: var(--blue);
  color: white;
}

.home-form, .settings-form {
  display: grid;
  gap: 10px;
}

.settings-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.mapping-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.config-status {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--surface-soft);
  color: var(--muted);
  white-space: pre-wrap;
  line-height: 1.45;
}

.home-form label, .settings-form label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.home-form textarea {
  min-height: 96px;
  resize: vertical;
}

.table-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.table-chip-list span {
  padding: 8px 10px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: #1e3a8a;
  font-size: 13px;
  font-weight: 800;
}

.sidebar-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.sidebar-actions button {
  color: #e5edf7;
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.14);
}

.sidebar-actions button i { display: none; }

.nav-item {
  position: relative;
  grid-template-columns: 30px minmax(0, 1fr);
}

.nav-item i {
  grid-row: span 2;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: rgba(255,255,255,.08);
  font-style: normal;
  font-weight: 900;
}

@media (max-width: 1180px) {
  .app-shell { grid-template-columns: 1fr; }
  .app-shell.sidebar-collapsed { grid-template-columns: 1fr; }
  .sidebar {
    position: static;
    height: auto;
  }
  .brand {
    position: static;
    margin: 0;
    padding: 0 0 16px;
  }
  .app-shell.sidebar-collapsed .sidebar { padding: 22px 18px; }
  .app-shell.sidebar-collapsed .brand {
    justify-content: flex-start;
    margin: 0;
    padding: 0;
    border-bottom: 0;
  }
  .app-shell.sidebar-collapsed .brand-logo { width: 52px; height: 52px; }
  .app-shell.sidebar-collapsed .brand-copy { display: block; }
  .app-shell.sidebar-collapsed .nav,
  .app-shell.sidebar-collapsed .sidebar-actions,
  .app-shell.sidebar-collapsed .sync-card { display: none; }
  .dashboard-tabs {
    top: 104px;
  }
  .nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }
  .nav-item.primary {
    grid-column: 1 / -1;
  }
  .metric-grid, .quick-actions, .filter-panel { grid-template-columns: repeat(2, minmax(140px, 1fr)); }
  .patient-registry-grid { grid-template-columns: 1fr; }
  .disease-registry-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .registry-page-head,
  .registry-detail-head { flex-wrap: wrap; }
  .registry-head-tools,
  .registry-detail-tools { width: 100%; }
  .dashboard-layout, .dashboard-layout.secondary, .followup-grid, .settings-grid, .profile-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .main { padding: 14px; }
  .topbar {
    display: grid;
    grid-template-columns: 42px 52px minmax(0, 1fr);
    align-items: center;
  }
  .header-tools { grid-column: 1 / -1; }
  .top-title { min-width: 0; }
  .dashboard-tabs {
    top: 0;
    position: relative;
  }
  .topbar-logo { width: 52px; height: 52px; }
  .header-tools { justify-content: stretch; }
  #globalPatientSearch { width: 100%; }
  .top-actions, .header-tools { width: 100%; }
  .top-actions button, .header-tools button { flex: 1; }
  .nav { grid-template-columns: 1fr; }
  .metric-grid, .metric-section-grid, .quick-actions, .filter-panel, .vital-grid, .channel-grid, .report-grid, .registry-toolbar, .profile-meta, .chart-grid, .map-filters, .ai-dashboard, .executive-grid, .clinical-grid {
    grid-template-columns: 1fr;
  }
  .mapping-grid {
    grid-template-columns: 1fr;
  }
  .patient-card-head { grid-template-columns: 46px minmax(0, 1fr); }
  .patient-card-head .risk-badge { grid-column: 1 / -1; justify-self: start; }
  .patient-card-sections { grid-template-columns: 1fr; }
  .patient-registry-card,
  .patient-card-section,
  .patient-card-section dl { max-width: 100%; }
  .disease-registry-grid { grid-template-columns: 1fr; }
  .registry-head-tools,
  .registry-detail-tools { grid-template-columns: 1fr; }
  .registry-summary-strip,
  .registry-detail-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .registry-summary-item { border-bottom: 1px solid var(--line); }
  .registry-source-row { justify-content: flex-start; flex-wrap: wrap; }
  .registry-detail-title { min-width: 0; }
  .topbar h1 { font-size: 24px; }
}

@media (max-width: 1180px) and (min-width: 769px) {
  .app-shell, .app-shell.sidebar-collapsed { grid-template-columns: var(--sidebar-collapsed-width) minmax(0,1fr); }
  .sidebar { position: sticky; height: 100vh; padding-inline: 12px; }
  .brand { position: sticky; top: -22px; margin: -22px -12px 0; padding: 22px 12px 16px; justify-content: center; }
  .brand-copy, .nav-section-toggle span, .nav-section-toggle b, .nav-item span, .nav-item small, .sidebar-actions span, .sync-card div { display: none !important; }
  .nav { display: grid !important; grid-template-columns: 1fr; }
  .nav-item { grid-template-columns: 1fr; place-items: center; padding: 8px; }
  .nav-item.primary { grid-column: auto; }
  .nav-item i { grid-row: auto; }
  .nav-collapsible.open .nav-submenu { padding-left: 0; }
  .sidebar-actions { display: grid !important; grid-template-columns: 1fr; }
  .sync-card { display: flex !important; justify-content: center; padding: 10px; }
  .topbar { flex-wrap: wrap; }
  .header-search { order: 4; max-width: none; flex-basis: 100%; }
  .global-filter-bar { top: 151px; grid-template-columns: repeat(3,minmax(140px,1fr)); }
}

@media (max-width: 768px) {
  .app-shell, .app-shell.sidebar-collapsed { display: block; }
  .sidebar { position: fixed; z-index: 60; top: 0; left: 0; width: min(86vw,280px); height: 100dvh; padding: 18px; transform: translateX(-105%); transition: transform .22s ease; box-shadow: 20px 0 50px rgba(2,6,23,.35); }
  .app-shell.sidebar-open .sidebar { transform: translateX(0); }
  .sidebar-overlay { position: fixed; z-index: 55; inset: 0; background: rgba(2,6,23,.55); }
  .sidebar-overlay[hidden] { display: none !important; pointer-events: none !important; }
  .sidebar-overlay:not([hidden]) { display: block; pointer-events: auto; }
  .app-shell.sidebar-collapsed .brand-copy, .app-shell.sidebar-collapsed .nav-section-toggle span, .app-shell.sidebar-collapsed .nav-section-toggle b, .app-shell.sidebar-collapsed .nav-item span, .app-shell.sidebar-collapsed .nav-item small, .app-shell.sidebar-collapsed .sidebar-actions span, .app-shell.sidebar-collapsed .sync-card div { display: initial; }
  .app-shell.sidebar-collapsed .nav,
  .app-shell.sidebar-collapsed .sidebar-actions,
  .app-shell.sidebar-collapsed .sync-card { display: grid !important; }
  .app-shell.sidebar-collapsed .sync-card { display: flex !important; }
  .app-shell.sidebar-collapsed .nav-item { grid-template-columns: 30px minmax(0,1fr); place-items: initial; }
  .app-shell.sidebar-collapsed .nav-item i { grid-row: span 2; }
  .app-shell.sidebar-collapsed .nav-section-toggle::before { display: none; }
  .main { padding: 10px; }
  .topbar { position: sticky; display: grid; grid-template-columns: 44px 42px minmax(0,1fr); gap: 9px; min-height: auto; padding: 10px; border-radius: 12px; }
  .topbar-logo { width: 42px; height: 42px; }
  .top-title h1 { font-size: 16px; }
  .top-title .eyebrow { font-size: 10px; }
  .header-search { grid-column: 1 / -1; max-width: none; }
  .header-tools { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0,1fr) 44px 44px; width: 100%; }
  .user-chip b { display: none; }
  .global-filter-bar { position: static; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 10px; }
  .global-filter-bar button { grid-column: 1 / -1; }
  .dashboard-tabs { top: 0; position: relative; }
  .quick-actions { display: flex; flex-wrap: wrap; }
  .quick-actions > span { width: 100%; }
  .quick-actions button { min-height: 44px; }
}


.app-footer {
  margin-top: 18px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  color: var(--muted);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  font-size: 12px;
}
.app-footer strong { color: var(--text); }
.footer-main, .footer-contact { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.app-footer a { color: var(--blue); text-decoration: none; font-weight: 700; }
.app-footer a:hover { text-decoration: underline; }
#appVersion { font-weight: 800; color: var(--teal); }
@media (max-width: 768px) {
  .app-footer { align-items: flex-start; flex-direction: column; }
}

/* FIXED_SHELL_V2_1_1 */
:root {
  --app-gap: 24px;
  --fixed-header-height: 112px;
  --fixed-footer-height: 66px;
}

.main {
  padding-top: calc(var(--fixed-header-height) + var(--app-gap));
  padding-bottom: calc(var(--fixed-footer-height) + var(--app-gap));
}

.topbar {
  position: fixed;
  top: 12px;
  left: calc(var(--sidebar-width) + var(--app-gap));
  right: var(--app-gap);
  z-index: 50;
  min-height: 88px;
  margin: 0;
}

.app-shell.sidebar-collapsed .topbar {
  left: calc(var(--sidebar-collapsed-width) + var(--app-gap));
}

.global-filter-bar {
  top: calc(var(--fixed-header-height) + 6px);
}

.dashboard-tabs {
  top: calc(var(--fixed-header-height) + 72px);
}

.app-footer {
  position: fixed;
  left: calc(var(--sidebar-width) + var(--app-gap));
  right: var(--app-gap);
  bottom: 10px;
  z-index: 48;
  min-height: 54px;
  margin: 0;
  box-shadow: 0 -8px 28px rgba(15,23,42,.08);
  backdrop-filter: blur(12px);
}

.app-shell.sidebar-collapsed .app-footer {
  left: calc(var(--sidebar-collapsed-width) + var(--app-gap));
}

@media (max-width: 1180px) and (min-width: 769px) {
  :root {
    --app-gap: 18px;
    --fixed-header-height: 154px;
    --fixed-footer-height: 72px;
  }
  .topbar,
  .app-shell.sidebar-collapsed .topbar {
    left: calc(var(--sidebar-collapsed-width) + var(--app-gap));
    right: var(--app-gap);
  }
  .app-footer,
  .app-shell.sidebar-collapsed .app-footer {
    left: calc(var(--sidebar-collapsed-width) + var(--app-gap));
    right: var(--app-gap);
  }
  .global-filter-bar {
    top: calc(var(--fixed-header-height) + 4px);
  }
  .dashboard-tabs {
    top: calc(var(--fixed-header-height) + 70px);
  }
}

@media (max-width: 768px) {
  :root {
    --app-gap: 10px;
    --fixed-header-height: 184px;
    --fixed-footer-height: 116px;
  }
  .main {
    padding-top: calc(var(--fixed-header-height) + 8px);
    padding-bottom: calc(var(--fixed-footer-height) + 12px);
  }
  .topbar,
  .app-shell.sidebar-collapsed .topbar {
    position: fixed;
    top: 8px;
    left: var(--app-gap);
    right: var(--app-gap);
    z-index: 50;
    max-height: calc(var(--fixed-header-height) - 12px);
    overflow: visible;
  }
  .global-filter-bar {
    position: relative;
    top: auto;
  }
  .dashboard-tabs {
    position: relative;
    top: auto;
  }
  .app-footer,
  .app-shell.sidebar-collapsed .app-footer {
    left: var(--app-gap);
    right: var(--app-gap);
    bottom: 8px;
    min-height: auto;
    padding: 10px 12px;
    gap: 4px;
  }
  .footer-main,
  .footer-contact {
    gap: 5px 7px;
  }
}

/* EDGE_HEADER_FOOTER_V2_1_2 */
:root {
  --fixed-header-height: 106px;
  --fixed-footer-height: 54px;
}

.main {
  padding-top: calc(var(--fixed-header-height) + 18px);
  padding-bottom: calc(var(--fixed-footer-height) + 18px);
}

.topbar {
  top: 0;
  left: var(--sidebar-width);
  right: 0;
  min-height: var(--fixed-header-height);
  border-radius: 0;
  border-top: 0;
  border-right: 0;
  border-left: 0;
  padding-left: 24px;
  padding-right: 24px;
  box-shadow: 0 8px 24px rgba(15,23,42,.07);
}

.app-shell.sidebar-collapsed .topbar {
  left: var(--sidebar-collapsed-width);
}

.app-footer {
  left: var(--sidebar-width);
  right: 0;
  bottom: 0;
  min-height: var(--fixed-footer-height);
  border-radius: 0;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
  padding-left: 24px;
  padding-right: 24px;
  box-shadow: 0 -8px 24px rgba(15,23,42,.07);
}

.app-shell.sidebar-collapsed .app-footer {
  left: var(--sidebar-collapsed-width);
}

.global-filter-bar {
  top: calc(var(--fixed-header-height) + 6px);
}

.dashboard-tabs {
  top: calc(var(--fixed-header-height) + 72px);
}

@media (max-width: 1180px) and (min-width: 769px) {
  :root {
    --fixed-header-height: 150px;
    --fixed-footer-height: 62px;
  }

  .topbar,
  .app-shell.sidebar-collapsed .topbar {
    left: var(--sidebar-collapsed-width);
    right: 0;
    top: 0;
    border-radius: 0;
    padding-left: 18px;
    padding-right: 18px;
  }

  .app-footer,
  .app-shell.sidebar-collapsed .app-footer {
    left: var(--sidebar-collapsed-width);
    right: 0;
    bottom: 0;
    border-radius: 0;
    padding-left: 18px;
    padding-right: 18px;
  }
}

@media (max-width: 768px) {
  :root {
    --fixed-header-height: 180px;
    --fixed-footer-height: 104px;
  }

  .main {
    padding-top: calc(var(--fixed-header-height) + 10px);
    padding-bottom: calc(var(--fixed-footer-height) + 10px);
  }

  .topbar,
  .app-shell.sidebar-collapsed .topbar {
    top: 0;
    left: 0;
    right: 0;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
    padding-left: 10px;
    padding-right: 10px;
  }

  .app-footer,
  .app-shell.sidebar-collapsed .app-footer {
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 0;
    padding: 9px 12px;
  }
}


/* PATIENT_PROFILE_V2_2_0 */
.profile-data-table { min-width: 0; }
.profile-table-wrap { overflow: auto; max-height: 430px; border: 1px solid var(--line); border-radius: 8px; }
.profile-table { width: 100%; min-width: 760px; border-collapse: collapse; background: var(--surface); }
.profile-table th, .profile-table td { padding: 9px 11px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; font-size: 12px; }
.profile-table th { position: sticky; top: 0; z-index: 2; background: var(--surface-soft); color: var(--muted); font-weight: 800; }
.profile-table tbody tr:hover { background: var(--blue-soft); }
.profile-table td strong, .profile-table td small { display: block; }
.profile-table td small { margin-top: 2px; color: var(--muted); }
.profile-empty { padding: 20px; color: var(--muted); text-align: center; border: 1px dashed var(--line-strong); border-radius: 8px; background: var(--surface-soft); }


/* TRACKING_V2_3_0 */
.compact-head { margin-top: 18px; }
.home-form { display: grid; gap: 10px; }
.home-form label { display: grid; gap: 5px; color: var(--muted); font-size: 12px; font-weight: 800; }
.home-form textarea { min-height: 88px; resize: vertical; }
.home-form button { min-height: 42px; }
.task-item small { display: block; margin-top: 5px; color: var(--muted); }


/* AUTH_V2_4_0 */
.auth-screen { position: fixed; z-index: 9999; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(238,243,248,.96); backdrop-filter: blur(10px); }
.auth-screen[hidden] { display: none !important; }
.auth-card { width: min(100%,420px); padding: 28px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: 0 24px 70px rgba(15,23,42,.18); }
.auth-card > img { width: 72px; height: 72px; display: block; margin: 0 auto 14px; object-fit: contain; }
.auth-card h1, .auth-card h2 { margin: 0 0 8px; text-align: center; }
.auth-card p { margin: 0 0 18px; color: var(--muted); text-align: center; }
.auth-form { display: grid; gap: 12px; }
.auth-form label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; font-weight: 800; }
.auth-form input { min-height: 44px; }
.auth-form button { min-height: 44px; border-radius: 10px; background: var(--blue); color: white; font-weight: 800; }
.auth-status { min-height: 22px; color: var(--red); font-size: 12px; text-align: center; }
body.auth-required .app-shell { visibility: hidden; }
#logoutButton { min-width: 52px; }


/* ADMIN_UI_V2_4_0 */
.admin-only[hidden] { display: none !important; }
#userManagementPanel .profile-table-wrap, #auditPanel .profile-table-wrap { margin-top: 14px; max-height: 360px; }

/* AUTH_ADMIN_V2_4_1 */
.password-modal {
  position: fixed; inset: 0; z-index: 10020;
  display: grid; place-items: center; padding: 20px;
  background: rgba(15,23,42,.45); backdrop-filter: blur(6px);
}
.password-modal[hidden] { display: none !important; }
.password-modal-card {
  width: min(100%, 430px); padding: 24px;
  border-radius: 16px; border: 1px solid var(--line);
  background: var(--surface); box-shadow: 0 24px 70px rgba(15,23,42,.24);
}
.password-modal-card h2 { margin: 0 0 6px; }
.password-modal-card p { margin: 0 0 16px; color: var(--muted); }
.setting-check { display: flex !important; grid-template-columns: auto 1fr; align-items: center; gap: 8px; }
.user-admin-table input, .user-admin-table select { min-height: 34px; }
.user-admin-table button { white-space: nowrap; }

/* CONTEXT_FILTER_VISIBILITY_V2_6_0 */
.global-filter-bar[hidden] { display: none !important; }
body:not(.dashboard-filter-visible) .global-filter-bar { display: none !important; }


/* MANAGEMENT_DASHBOARD_V2_7_0 */
.management-filter-bar {
  display: grid;
  grid-template-columns: minmax(150px,.8fr) minmax(390px,1.9fr) minmax(180px,1fr) minmax(180px,1fr) minmax(190px,1fr) auto;
  gap: 12px;
  align-items: end;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 6px 22px rgba(15,23,42,.06);
}
.management-filter-bar > label,
.area-filter-block {
  display: grid;
  gap: 6px;
  min-width: 0;
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
}
.management-filter-bar select {
  min-height: 42px;
  width: 100%;
}
.area-segmented {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  background: var(--surface-soft);
}
.area-segmented button {
  min-height: 42px;
  padding: 7px 9px;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-weight: 800;
  white-space: nowrap;
}
.area-segmented button:last-child { border-right: 0; }
.area-segmented button.active {
  background: var(--blue);
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);
}
.filter-reset-button {
  min-height: 42px;
  white-space: nowrap;
  color: var(--blue);
  border: 1px solid #bfd5fb;
  background: #eef5ff;
  font-weight: 800;
}

.management-dashboard {
  display: none;
  gap: 12px;
}
.management-dashboard.active { display: grid; }

.dashboard-info-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  min-height: 38px;
  padding: 8px 14px;
  border: 1px solid #cfe0fb;
  border-radius: 10px;
  background: linear-gradient(90deg,#eef6ff,#f7fbff);
  color: #2d5fa8;
  font-size: 12px;
}
.dashboard-info-bar strong { margin-right: 6px; }

.disease-tabs {
  display: flex;
  gap: 5px;
  overflow-x: auto;
  padding: 0 1px 2px;
  scrollbar-width: thin;
}
.disease-tabs button {
  min-width: 76px;
  min-height: 40px;
  padding: 8px 16px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--text);
  border-radius: 9px;
  font-weight: 800;
  white-space: nowrap;
}
.disease-tabs button.active {
  color: #fff;
  background: linear-gradient(135deg,#2563eb,#1d4ed8);
  border-color: #2563eb;
  box-shadow: 0 5px 14px rgba(37,99,235,.2);
}

.management-kpi-grid {
  display: grid;
  grid-template-columns: repeat(6,minmax(0,1fr));
  gap: 10px;
}
.management-kpi-card {
  min-height: 128px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface);
  box-shadow: 0 5px 18px rgba(15,23,42,.055);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.management-kpi-card.unavailable { opacity: .68; }
.management-kpi-label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 28px;
  color: var(--muted);
  font-size: 12px;
}
.management-kpi-label span {
  display: grid;
  place-items: center;
  width: 31px;
  height: 31px;
  border-radius: 9px;
  background: #edf4ff;
  color: var(--blue);
  font-size: 15px;
}
.management-kpi-card strong {
  color: #132542;
  font-size: clamp(25px,2vw,34px);
  line-height: 1;
  letter-spacing: -.5px;
}
.management-kpi-card small { color: var(--muted); font-weight: 700; }

.management-chart-grid {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 12px;
  min-width: 0;
}
.management-bottom-grid {
  display: grid;
  grid-template-columns: minmax(320px,.78fr) minmax(0,1.52fr);
  gap: 12px;
  min-width: 0;
}
.management-panel {
  min-width: 0;
  padding: 14px 16px;
  border-radius: 13px;
}
.management-panel canvas {
  width: 100%;
  max-width: 100%;
  display: block;
}
.management-panel-head {
  gap: 12px;
  align-items: flex-start;
}
.chart-toggle {
  display: flex;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
}
.chart-toggle button {
  min-height: 32px;
  padding: 5px 10px;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.chart-toggle button:last-child { border-right: 0; }
.chart-toggle button.active { background: var(--blue); color: #fff; }

.control-chart-layout {
  display: grid;
  grid-template-columns: minmax(180px,.9fr) minmax(190px,1.1fr);
  align-items: center;
  gap: 8px;
}
.control-legend { display: grid; gap: 9px; }
.control-legend-item {
  display: grid;
  grid-template-columns: 12px 1fr auto;
  gap: 7px;
  align-items: center;
  font-size: 12px;
}
.control-legend-item small {
  grid-column: 2 / -1;
  color: var(--muted);
}
.control-legend-item.muted { opacity: .62; }
.legend-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: #94a3b8;
}
.legend-dot.controlled { background:#18a66a; }
.legend-dot.uncontrolled { background:#f97316; }
.legend-dot.lost_followup { background:#3b82f6; }
.legend-dot.home_visit { background:#8b5cf6; }

.management-table-wrap {
  width: 100%;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 9px;
}
.management-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  background: var(--surface);
}
.management-table th,
.management-table td {
  padding: 9px 11px;
  border-bottom: 1px solid var(--line);
  text-align: center;
  font-size: 11px;
  white-space: nowrap;
}
.management-table th {
  background: #f3f7fb;
  color: #53647d;
  font-weight: 800;
}
.management-table td:first-child,
.management-table th:first-child { text-align: left; }
.table-number-link {
  min-width: 32px;
  padding: 3px 7px;
  border: 0;
  background: transparent;
  color: var(--blue);
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.detail-row-button {
  padding: 5px 9px;
  border: 1px solid #bed4fb;
  border-radius: 7px;
  color: var(--blue);
  background: #eef5ff;
  font-size: 11px;
  font-weight: 800;
}
.empty-cell { padding: 22px !important; color: var(--muted); text-align: center !important; }

.dashboard-drilldown {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: grid;
  place-items: center;
  padding: 26px;
  background: rgba(15,23,42,.52);
  backdrop-filter: blur(5px);
}
.dashboard-drilldown[hidden] { display:none !important; }
.dashboard-drilldown-card {
  width: min(1180px,96vw);
  max-height: 82vh;
  overflow: auto;
  padding: 16px;
  border-radius: 15px;
  background: var(--surface);
  box-shadow: 0 28px 80px rgba(15,23,42,.28);
}
.dashboard-drilldown-card > .panel-head > button {
  width: 36px; height: 36px; border-radius: 9px;
}
.drilldown-patient-row { cursor:pointer; }
.drilldown-patient-row:hover { background:#f3f8ff; }

@media (max-width: 1350px) {
  .management-filter-bar {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
  .area-filter-block { grid-column: span 2; }
  .management-kpi-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 1050px) {
  .management-chart-grid,
  .management-bottom-grid { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .management-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .area-filter-block { grid-column: 1 / -1; }
  .management-kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .dashboard-info-bar { align-items:flex-start; flex-direction:column; }
  .management-panel-head { flex-direction:column; }
  .control-chart-layout { grid-template-columns:1fr; }
}
@media (max-width: 560px) {
  .management-filter-bar { grid-template-columns:1fr; }
  .area-filter-block { grid-column:auto; }
  .area-segmented { grid-template-columns:repeat(2,1fr); }
  .management-kpi-grid { grid-template-columns:1fr; }
  .management-kpi-card { min-height:110px; }
  .chart-toggle { width:100%; overflow:auto; }
  .chart-toggle button { flex:1; }
  .dashboard-drilldown { padding:10px; }
}


/* SCROLL_OVERLAP_FIX_V2_7_0_1 */
/* Header / Footer remain fixed. Dashboard controls must scroll in normal document flow. */
.global-filter-bar,
.management-filter-bar,
.dashboard-tabs,
.disease-tabs {
  position: relative !important;
  top: auto !important;
  z-index: 2 !important;
}

.management-filter-bar {
  margin: 0 0 12px !important;
}

.management-dashboard {
  position: relative;
  z-index: 1;
  padding-top: 0 !important;
}

.dashboard-info-bar,
.disease-tabs,
.management-kpi-grid,
.management-chart-grid,
.management-bottom-grid {
  position: relative;
  z-index: 1;
}

.panel,
.management-panel,
.management-kpi-card {
  z-index: 1;
}

@media (min-width: 769px) {
  .main {
    padding-top: calc(var(--fixed-header-height) + 18px) !important;
    padding-bottom: calc(var(--fixed-footer-height) + 18px) !important;
  }
}

@media (max-width: 768px) {
  .global-filter-bar,
  .management-filter-bar,
  .dashboard-tabs,
  .disease-tabs {
    position: relative !important;
    top: auto !important;
  }
}

/* TREATMENT_SITE_FILTER_V2_7_1 */
@media (min-width: 1351px) {
  .management-filter-bar {
    grid-template-columns:
      minmax(125px,.65fr)
      minmax(360px,1.8fr)
      minmax(160px,.9fr)
      minmax(160px,.9fr)
      minmax(175px,.95fr)
      minmax(180px,1fr)
      auto;
  }
}

/* TREATMENT_SITE_FILTER_V2_7_1 */
@media (min-width: 1501px) {
  .management-filter-bar {
    grid-template-columns: minmax(135px,.72fr) minmax(370px,1.85fr) minmax(155px,.9fr) minmax(155px,.9fr) minmax(190px,1.05fr) minmax(180px,1fr) auto;
  }
}
@media (min-width: 1101px) and (max-width: 1500px) {
  .management-filter-bar { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .management-filter-bar .area-filter-block { grid-column: span 2; }
}


/* REGISTRY_V2_8_0 */
.registry-filter-tools {
  grid-template-columns: minmax(220px, 1.4fr) minmax(145px,.9fr) minmax(150px,.9fr) minmax(150px,.9fr) 112px !important;
  min-width: min(100%, 890px) !important;
  width: min(100%, 890px);
}

.registry-info-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin-bottom: 10px;
  padding: 8px 12px;
  border: 1px solid #cfe0fb;
  border-radius: 8px;
  background: linear-gradient(90deg,#eef6ff,#f8fbff);
  color: #315f9f;
  font-size: 11px;
}

.registry-loading-state {
  grid-column: 1 / -1;
  padding: 32px 16px;
  text-align: center;
  color: var(--muted);
  border: 1px dashed var(--line);
  border-radius: 9px;
  background: var(--surface);
}

.registry-metric-button,
.registry-status-metric,
.registry-area-metric {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

.registry-metric-button {
  padding: 0;
  border-radius: 7px;
}

.registry-metric-button:hover,
.registry-metric-button:focus-visible {
  background: color-mix(in srgb, var(--disease-color) 9%, transparent);
  outline: 2px solid color-mix(in srgb, var(--disease-color) 28%, transparent);
  outline-offset: 2px;
}

.disease-area-row {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 7px;
  margin-top: 10px;
}

.registry-area-metric {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 10px;
}

.registry-area-metric b {
  color: var(--text);
  font-size: 11px;
}

.registry-area-metric:hover,
.registry-area-metric:focus-visible {
  border-color: var(--disease-color);
  color: var(--disease-color);
  outline: none;
}

.registry-status-metric {
  width: 100%;
  padding: 3px 5px;
  border-radius: 6px;
  text-align: left;
}

.registry-status-metric:hover,
.registry-status-metric:focus-visible {
  background: var(--surface-soft);
  outline: none;
}

.disease-status-row.unavailable {
  opacity: .58;
  cursor: default;
}

.registry-detail-summary {
  grid-template-columns: repeat(6,minmax(0,1fr));
}

@media (max-width: 1400px) and (min-width: 1051px) {
  .disease-registry-grid {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
  .registry-page-head,
  .registry-detail-head {
    flex-wrap: wrap;
  }
  .registry-filter-tools {
    width: 100%;
    min-width: 0 !important;
  }
}

@media (max-width: 1050px) {
  .registry-filter-tools {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    width: 100%;
    min-width: 0 !important;
  }
  .registry-filter-tools input {
    grid-column: 1 / -1;
  }
  .registry-info-bar {
    align-items: flex-start;
    flex-direction: column;
  }
  .registry-detail-summary {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
}

@media (max-width: 820px) {
  .disease-registry-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .registry-summary-strip {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 560px) {
  .registry-filter-tools {
    grid-template-columns: 1fr !important;
  }
  .registry-filter-tools input {
    grid-column: auto;
  }
  .disease-registry-grid,
  .registry-summary-strip,
  .registry-detail-summary {
    grid-template-columns: 1fr;
  }
}


/* HOME_OVERVIEW_V2_9_0 */
.home-overview-dashboard {
  display: none;
  gap: 14px;
}
.home-overview-dashboard.active {
  display: grid;
}

.home-overview-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  padding: 2px 2px 0;
}
.home-overview-head h2 {
  margin: 2px 0 3px;
  font-size: clamp(23px, 2vw, 31px);
  line-height: 1.15;
  color: var(--text);
}
.home-overview-head p {
  margin: 0;
  color: var(--muted);
}
.home-overview-meta {
  display: grid;
  justify-items: end;
  gap: 3px;
  text-align: right;
  color: var(--muted);
  font-size: 11px;
}
.home-overview-meta strong {
  color: var(--text);
  font-size: 12px;
}

.home-main-summary-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 12px;
}
.home-main-card {
  min-height: 138px;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 20px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: 0 7px 24px rgba(15,23,42,.055);
}
.home-main-card.total { border-top: 3px solid #2563eb; }
.home-main-card.local { border-top: 3px solid #0f9f79; }
.home-main-card.other { border-top: 3px solid #f59e0b; }

.home-main-icon {
  flex: 0 0 auto;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: #eef5ff;
  color: #2563eb;
  font-size: 24px;
  font-weight: 900;
}
.home-main-card.local .home-main-icon {
  background: #eaf8f3;
  color: #0f9f79;
}
.home-main-card.other .home-main-icon {
  background: #fff6e7;
  color: #c87306;
}
.home-main-card > div:last-child {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.home-main-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.home-main-card strong {
  color: var(--text);
  font-size: clamp(32px,3vw,46px);
  line-height: 1;
  letter-spacing: -.8px;
}
.home-main-card small {
  color: var(--muted);
  font-size: 10px;
}

.home-treatment-panel {
  padding: 15px 16px;
}
.home-treatment-grid {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 10px;
}
.home-treatment-item {
  min-height: 98px;
  display: grid;
  gap: 4px;
  padding: 13px 14px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface-soft);
}
.home-treatment-item span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.home-treatment-item strong {
  color: var(--text);
  font-size: 25px;
  line-height: 1;
}
.home-treatment-item small {
  color: var(--muted);
  font-size: 10px;
}
.home-treatment-item.local { border-left: 4px solid #0f9f79; }
.home-treatment-item.other { border-left: 4px solid #f59e0b; }
.home-treatment-item.mixed { border-left: 4px solid #7c3aed; }
.home-treatment-item.unknown { border-left: 4px solid #94a3b8; }

.home-treatment-note {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-top: 10px;
  color: var(--muted);
  font-size: 10px;
}

.home-disease-section {
  display: grid;
  gap: 10px;
}
.home-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
}
.home-section-head h2 {
  margin: 0 0 2px;
  font-size: 18px;
}
.home-section-head span {
  color: var(--muted);
  font-size: 11px;
}

.home-disease-grid {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 11px;
}
.home-disease-card {
  min-height: 190px;
  display: flex;
  flex-direction: column;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface);
  box-shadow: 0 5px 18px rgba(15,23,42,.05);
  cursor: pointer;
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
.home-disease-card:hover,
.home-disease-card:focus-visible {
  transform: translateY(-2px);
  border-color: #a9c5f5;
  box-shadow: 0 10px 28px rgba(15,23,42,.09);
  outline: none;
}
.home-disease-card-head {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
}
.home-disease-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: #edf4ff;
  color: #2563eb;
  font-size: 10px;
  font-weight: 900;
}
.home-disease-title {
  min-width: 0;
  display: grid;
  gap: 1px;
}
.home-disease-title strong {
  color: var(--text);
  font-size: 16px;
}
.home-disease-title span {
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-disease-total {
  display: grid;
  justify-items: end;
}
.home-disease-total strong {
  color: var(--text);
  font-size: 24px;
  line-height: 1;
}
.home-disease-total span {
  color: var(--muted);
  font-size: 9px;
}

.home-disease-site-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 6px;
  margin-top: 13px;
}
.home-disease-site-grid > div {
  display: flex;
  justify-content: space-between;
  gap: 7px;
  padding: 6px 7px;
  border-radius: 7px;
  background: var(--surface-soft);
  font-size: 10px;
}
.home-disease-site-grid span { color: var(--muted); }
.home-disease-site-grid b { color: var(--text); }

.home-disease-card-link {
  margin-top: auto;
  padding-top: 10px;
  color: var(--blue);
  font-size: 10px;
  font-weight: 800;
  text-align: right;
}

.home-dashboard-loading {
  grid-column: 1 / -1;
  padding: 34px;
  border: 1px dashed var(--line);
  border-radius: 12px;
  color: var(--muted);
  background: var(--surface);
  text-align: center;
}

@media (max-width: 1350px) {
  .home-disease-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 1050px) {
  .home-main-summary-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .home-treatment-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .home-disease-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 760px) {
  .home-overview-head { align-items: flex-start; flex-direction: column; }
  .home-overview-meta { justify-items: start; text-align: left; }
  .home-main-summary-grid { grid-template-columns: 1fr; }
  .home-disease-grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .home-treatment-grid { grid-template-columns: 1fr; }
  .home-main-card { min-height: 120px; }
}


/* HOME_DASHBOARD_V2_9_0 */
.home-overview-dashboard {
  display: none;
  gap: 14px;
  min-width: 0;
}
.home-overview-dashboard.active { display: grid; }

.home-overview-head,
.home-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
}
.home-overview-head h2,
.home-section-head h2 {
  margin: 2px 0 2px;
  color: var(--text);
  font-size: clamp(22px,2vw,30px);
}
.home-overview-head p,
.home-section-head span {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}
.home-overview-meta {
  display: grid;
  justify-items: end;
  gap: 2px;
  color: var(--muted);
  font-size: 11px;
  text-align: right;
}
.home-overview-meta strong {
  color: var(--text);
  font-size: 12px;
}

.home-main-summary-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 12px;
}
.home-main-card {
  min-height: 134px;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: 0 6px 20px rgba(15,23,42,.055);
}
.home-main-card.total { border-top: 3px solid #2563eb; }
.home-main-card.local { border-top: 3px solid #0f766e; }
.home-main-card.other { border-top: 3px solid #f59e0b; }
.home-main-icon {
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  background: var(--surface-soft);
  font-size: 22px;
}
.home-main-card > div:last-child {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.home-main-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.home-main-card strong {
  color: #132542;
  font-size: clamp(30px,2.7vw,42px);
  line-height: 1.05;
}
.home-main-card small {
  color: var(--muted);
  font-size: 10px;
}

.home-treatment-panel {
  padding: 16px;
  border-radius: 14px;
}
.home-treatment-grid {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 10px;
}
.home-treatment-item {
  min-height: 94px;
  display: grid;
  align-content: center;
  gap: 4px;
  padding: 13px 14px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface-soft);
}
.home-treatment-item.local { border-left: 4px solid #0f766e; }
.home-treatment-item.other { border-left: 4px solid #f59e0b; }
.home-treatment-item.mixed { border-left: 4px solid #7c3aed; }
.home-treatment-item.unknown { border-left: 4px solid #94a3b8; }
.home-treatment-item span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.home-treatment-item strong {
  color: var(--text);
  font-size: 24px;
}
.home-treatment-item small {
  color: var(--muted);
  font-weight: 700;
}
.home-treatment-note {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-top: 10px;
  color: var(--muted);
  font-size: 10px;
}

.home-disease-section {
  display: grid;
  gap: 10px;
}
.home-disease-grid {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 12px;
}
.home-disease-card {
  position: relative;
  min-height: 190px;
  display: grid;
  align-content: start;
  gap: 11px;
  padding: 15px;
  border: 1px solid var(--line);
  border-top: 3px solid var(--home-disease-color);
  border-radius: 13px;
  background: var(--surface);
  box-shadow: 0 5px 18px rgba(15,23,42,.05);
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.home-disease-card:hover,
.home-disease-card:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 9px 24px rgba(15,23,42,.1);
  border-color: color-mix(in srgb,var(--home-disease-color) 45%,var(--line));
  outline: none;
}
.home-disease-card-head {
  display: grid;
  grid-template-columns: 40px minmax(0,1fr) auto;
  align-items: center;
  gap: 10px;
}
.home-disease-icon {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: color-mix(in srgb,var(--home-disease-color) 10%,white);
  color: var(--home-disease-color);
  font-size: 11px;
  font-weight: 900;
}
.home-disease-title {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.home-disease-title strong {
  color: var(--text);
  font-size: 17px;
}
.home-disease-title span {
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-disease-total {
  display: grid;
  justify-items: end;
}
.home-disease-total strong {
  color: var(--text);
  font-size: 25px;
  line-height: 1;
}
.home-disease-total span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 9px;
}
.home-disease-treatment {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
}
.home-disease-treatment > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
  padding: 8px 9px;
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 10px;
}
.home-disease-treatment b {
  color: var(--text);
  font-size: 13px;
}
.home-disease-extra {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 10px;
  color: var(--muted);
  font-size: 9px;
}
.home-disease-link {
  margin-top: auto;
  color: var(--home-disease-color);
  font-size: 10px;
  font-weight: 900;
  text-align: right;
}
.home-dashboard-loading {
  grid-column: 1 / -1;
  padding: 34px;
  border: 1px dashed var(--line);
  border-radius: 12px;
  color: var(--muted);
  background: var(--surface);
  text-align: center;
}
.home-dashboard-loading.error { color: var(--red); }

@media (max-width: 1300px) {
  .home-disease-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 980px) {
  .home-main-summary-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .home-treatment-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .home-disease-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 720px) {
  .home-overview-head,
  .home-section-head { align-items: flex-start; flex-direction: column; }
  .home-overview-meta { justify-items: start; text-align: left; }
  .home-main-summary-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .home-treatment-grid,
  .home-disease-grid { grid-template-columns: 1fr; }
  .home-disease-title span { white-space: normal; }
}


/* SIDEBAR_NAV_V2_10_0 */
.sidebar {
  padding: 16px 14px;
  gap: 10px;
  overflow: hidden;
}
.brand {
  flex: 0 0 auto;
  top: -16px;
  margin: -16px -14px 0;
  padding: 16px 14px 12px;
}
.nav {
  min-height: 0;
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  gap: 6px;
  padding-right: 2px;
  scrollbar-width: thin;
}
.nav-group {
  gap: 3px;
  padding: 5px 0 7px;
}
.nav-section-toggle {
  min-height: 36px;
  padding: 6px 8px;
  border-radius: 8px;
  display: grid;
  grid-template-columns: 22px minmax(0,1fr) 18px;
  gap: 7px;
}
.nav-section-toggle .nav-parent-icon {
  font-style: normal;
  text-align: center;
  color: #9fc5ea;
}
.nav-submenu {
  gap: 2px;
  padding-left: 5px;
}
.nav-item {
  min-height: 34px;
  padding: 6px 8px;
  border-radius: 7px;
  grid-template-columns: 28px minmax(0,1fr) auto;
  align-items: center;
  column-gap: 7px;
}
.nav-item i {
  font-style: normal;
  font-size: 11px;
  font-weight: 900;
  text-align: center;
  color: #a8c7e8;
}
.nav-item span { min-width: 0; }
.nav-group.active-parent > .nav-section-toggle {
  background: rgba(37,99,235,.24);
  color: #fff;
  box-shadow: inset 3px 0 0 #60a5fa;
}
.nav-group.active-parent > .nav-section-toggle .nav-parent-icon {
  color: #fff;
}
.nav-item.active {
  background: #1d4ed8;
  border-color: rgba(147,197,253,.32);
  color: #fff;
}
.nav-badge {
  min-width: 25px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  padding: 0 6px;
  border-radius: 999px;
  background: #f59e0b;
  color: #fff;
  font-size: 10px;
  font-weight: 900;
}
.nav-badge.danger { background: #dc2626; }
.nav-system-tools {
  display: grid;
  gap: 2px;
  margin-top: 4px;
  padding-top: 7px;
  border-top: 1px solid rgba(255,255,255,.1);
}
.nav-system-label {
  padding: 0 8px 3px;
  color: #7698b9;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.sidebar-actions,
.sync-card {
  flex: 0 0 auto;
}
.sidebar-actions {
  grid-template-columns: 1fr;
}
.app-shell.sidebar-collapsed .nav {
  overflow-y: auto;
}
.app-shell.sidebar-collapsed .nav-section-toggle {
  grid-template-columns: 1fr;
}
.app-shell.sidebar-collapsed .nav-section-toggle .nav-parent-icon {
  display: block;
}
.app-shell.sidebar-collapsed .nav-section-toggle::before { content: none; }
.app-shell.sidebar-collapsed .nav-system-label { display: none; }
.app-shell.sidebar-collapsed .nav-badge { display: none; }

.module-view {
  display: grid;
  gap: 14px;
}
.module-summary-grid {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 10px;
}
.module-summary-card {
  min-height: 100px;
  display: grid;
  align-content: center;
  gap: 4px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface-soft);
}
.module-summary-card span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.module-summary-card strong {
  color: var(--text);
  font-size: 27px;
  line-height: 1;
}
.module-summary-card small { color: var(--muted); }
.module-summary-card.good { border-left: 4px solid #16a34a; }
.module-summary-card.warn { border-left: 4px solid #f59e0b; }
.module-summary-card.danger { border-left: 4px solid #dc2626; }
.module-summary-card.muted { border-left: 4px solid #94a3b8; }

.module-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 720px;
}
.module-table th,
.module-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
}
.module-table th {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  background: var(--surface-soft);
}
.module-table td { font-size: 11px; }
.table-subtext {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
}
.module-empty {
  padding: 22px;
  color: var(--muted);
  text-align: center;
}
.simple-bar-chart {
  display: grid;
  gap: 8px;
  padding: 6px 0;
}
.simple-bar-row {
  display: grid;
  grid-template-columns: minmax(120px,180px) minmax(160px,1fr) 56px;
  gap: 10px;
  align-items: center;
  font-size: 11px;
}
.simple-bar-row > div {
  height: 14px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8eef7;
}
.simple-bar-row i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #3b82f6;
}
.simple-bar-row b { text-align: right; }

@media (max-width: 1050px) {
  .module-summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 560px) {
  .module-summary-grid { grid-template-columns: 1fr; }
  .simple-bar-row { grid-template-columns: 92px minmax(110px,1fr) 42px; gap: 6px; }
}

.module-search {
  width: min(360px,100%);
  height: 38px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface);
  color: var(--text);
}
.module-search:focus {
  outline: 2px solid rgba(37,99,235,.18);
  border-color: #60a5fa;
}
.module-result {
  color: var(--muted);
  font-size: 11px;
}


/* VILLAGE_GROUPED_CHART_V2_10_3 */
.village-grouped-chart {
  margin: 4px 0 14px;
  padding: 14px 14px 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 8px 22px rgba(15,23,42,.04);
}
.village-chart-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}
.village-chart-head > div:first-child { display: grid; gap: 2px; }
.village-chart-head strong { color: var(--text); font-size: 13px; }
.village-chart-head span { color: var(--muted); font-size: 10px; }
.village-chart-legend { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; }
.village-chart-legend span { display: inline-flex; gap: 6px; align-items: center; color: var(--muted); font-size: 10px; font-weight: 800; }
.village-chart-legend i { width: 9px; height: 9px; border-radius: 50%; }
.village-chart-legend i.vg-controlled { background: #3b82f6; }
.village-chart-legend i.vg-uncontrolled { background: #f59e0b; }
.village-chart-legend i.vg-no-lab { background: #cbd5e1; }

.village-chart-stage {
  position: relative;
  min-height: 310px;
  padding: 10px 8px 48px 50px;
  overflow-x: auto;
}
.village-chart-y-title {
  position: absolute;
  left: 2px;
  top: 50%;
  transform: translate(-28%,-50%) rotate(-90deg);
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  white-space: nowrap;
}
.village-chart-grid {
  position: absolute;
  inset: 10px 8px 48px 50px;
  min-width: 760px;
  pointer-events: none;
}
.village-chart-grid span {
  position: absolute;
  left: 0;
  right: 0;
  border-top: 1px solid #e6edf6;
}
.village-chart-grid span b {
  position: absolute;
  right: calc(100% + 8px);
  top: -7px;
  min-width: 32px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
  text-align: right;
}
.village-chart-groups {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(8,minmax(84px,1fr));
  align-items: end;
  gap: 14px;
  min-width: 760px;
  height: 252px;
}
.village-chart-group {
  display: grid;
  grid-template-rows: 1fr auto;
  min-width: 0;
  height: 100%;
}
.village-chart-bars {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  align-items: end;
  gap: 5px;
  min-height: 0;
  height: 100%;
  padding: 0 4px;
}
.village-chart-col {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  height: 100%;
}
.village-chart-col b {
  position: absolute;
  bottom: calc(var(--bar-h, 0%) + 4px);
  color: #334155;
  font-size: 9px;
  font-weight: 900;
}
.village-chart-col i {
  display: block;
  width: 100%;
  min-height: 0;
  border-radius: 5px 5px 2px 2px;
  box-shadow: inset 0 -1px 0 rgba(15,23,42,.08);
}
.village-chart-col.vg-controlled i { background: #3b82f6; }
.village-chart-col.vg-uncontrolled i { background: #f59e0b; }
.village-chart-col.vg-no-lab i { background: #cbd5e1; }
.village-chart-label { display: grid; gap: 1px; margin-top: 7px; text-align: center; }
.village-chart-label strong { color: var(--text); font-size: 10px; }
.village-chart-label span {
  overflow: hidden;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .village-chart-head { flex-direction: column; }
  .village-chart-legend { justify-content: flex-start; }
  .village-chart-stage { min-height: 290px; }
}

/* SETTINGS_CONSOLIDATION_V2_10_1 */
.settings-sync-summary {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 10px;
}
.settings-sync-summary > div {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-soft);
}
.settings-sync-summary span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}
.settings-sync-summary strong {
  color: var(--text);
  font-size: 15px;
}
#settingsSyncNow {
  min-height: 36px;
  padding: 0 14px;
  border: 0;
  border-radius: 8px;
  background: #2563eb;
  color: #fff;
  font-weight: 800;
  cursor: pointer;
}
#settingsSyncNow:disabled {
  opacity: .55;
  cursor: wait;
}
@media (max-width: 640px) {
  .settings-sync-summary { grid-template-columns: 1fr; }
}



/* REGISTRY_TABLE_FIRST_V2_11_0 */
.registry-table-first {
  display: grid;
  gap: 12px;
}
.registry-page-head-v2 {
  margin-bottom: 0;
  padding: 0 2px;
}
.registry-page-head-v2 h2 {
  margin: 2px 0 4px;
  font-size: 26px;
  line-height: 1.15;
}
.registry-page-head-v2 > div > p:last-child {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}
.registry-filter-bar-v2 {
  display: grid;
  grid-template-columns: minmax(260px,1.35fr) repeat(4,minmax(145px,.78fr)) auto;
  gap: 10px;
  align-items: end;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 7px 20px rgba(15,23,42,.04);
}
.registry-filter-bar-v2 label {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.registry-filter-bar-v2 label > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
}
.registry-filter-bar-v2 input,
.registry-filter-bar-v2 select {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 0 11px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 12px;
}
.registry-export-button-v2 {
  min-height: 42px;
  padding: 0 18px;
  border: 0;
  border-radius: 9px;
  background: var(--blue);
  color: #fff;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(37,99,235,.18);
}
.registry-export-button-v2:hover { filter: brightness(.96); }

.registry-summary-strip-v2 {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 10px;
  padding: 0;
  border: 0;
  background: transparent;
}
.registry-summary-strip-v2 article {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas: "label label" "value unit";
  align-items: end;
  min-height: 86px;
  padding: 15px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: linear-gradient(135deg,#ffffff 0%,#f7fbff 100%);
  box-shadow: 0 7px 20px rgba(15,23,42,.035);
}
.registry-summary-strip-v2 article span {
  grid-area: label;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.registry-summary-strip-v2 article strong {
  grid-area: value;
  color: var(--text);
  font-size: 24px;
  line-height: 1;
}
.registry-summary-strip-v2 article small {
  grid-area: unit;
  align-self: end;
  margin-left: 6px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}
.registry-summary-strip-v2 article.good {
  border-color: #bbf7d0;
  background: linear-gradient(135deg,#f0fdf4,#ecfdf5);
}
.registry-summary-strip-v2 article.good strong,
.registry-summary-strip-v2 article.good small { color: #15803d; }
.registry-summary-strip-v2 article.danger {
  border-color: #fecdd3;
  background: linear-gradient(135deg,#fff1f2,#fff7ed);
}
.registry-summary-strip-v2 article.danger strong,
.registry-summary-strip-v2 article.danger small { color: #dc2626; }

.registry-disease-tabs-v2 {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding: 2px 0 3px;
  scrollbar-width: thin;
}
.registry-disease-tab-v2 {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface);
  color: var(--text);
  font-size: 11px;
  font-weight: 900;
  cursor: pointer;
}
.registry-disease-tab-v2 b {
  display: inline-grid;
  place-items: center;
  min-width: 25px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 9px;
}
.registry-disease-tab-v2:hover {
  border-color: #93c5fd;
  background: #eff6ff;
}
.registry-disease-tab-v2.active {
  border-color: var(--blue);
  background: var(--blue);
  color: #fff;
  box-shadow: 0 7px 18px rgba(37,99,235,.18);
}
.registry-disease-tab-v2.active b {
  background: rgba(255,255,255,.18);
  color: #fff;
}

.registry-table-card-v2 {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 8px 24px rgba(15,23,42,.04);
}
.registry-table-toolbar-v2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 12px;
  border-bottom: 1px solid var(--line);
}
.registry-page-size-v2 {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}
.registry-page-size-v2 select {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 28px 0 10px;
  background: var(--surface);
  color: var(--text);
}
.registry-table-search-v2 {
  width: min(280px,100%);
  min-height: 36px;
  padding: 0 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
}
.registry-result-v2 {
  padding: 8px 12px 0;
  font-size: 10px;
}
.registry-table-wrap-v2 {
  max-height: min(56vh,590px);
  overflow: auto;
}
.registry-table-v2 {
  width: 100%;
  min-width: 1120px;
  border-collapse: separate;
  border-spacing: 0;
}
.registry-table-v2 thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  padding: 10px 11px;
  border-bottom: 1px solid var(--line);
  background: #f1f5f9;
  color: #475569;
  font-size: 10px;
  font-weight: 900;
  text-align: left;
  white-space: nowrap;
}
.registry-table-v2 tbody td {
  padding: 9px 11px;
  border-bottom: 1px solid #edf2f7;
  color: var(--text);
  font-size: 10px;
  vertical-align: middle;
}
.registry-table-v2 tbody tr:hover { background: #f8fbff; }

.registry-disease-badges-v2 {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.registry-disease-badges-v2 span {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 7px;
  border-radius: 6px;
  background: #dbeafe;
  color: #1d4ed8;
  font-size: 9px;
  font-weight: 900;
}
.registry-disease-badges-v2 span:nth-child(2n) {
  background: #ccfbf1;
  color: #0f766e;
}
.registry-disease-badges-v2 span:nth-child(3n) {
  background: #ede9fe;
  color: #7c3aed;
}
.registry-status-pill-v2 {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 900;
  white-space: nowrap;
}
.registry-status-pill-v2 i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
}
.registry-status-pill-v2.controlled { background: #dcfce7; color: #15803d; }
.registry-status-pill-v2.controlled i { background: #16a34a; }
.registry-status-pill-v2.uncontrolled { background: #fee2e2; color: #b91c1c; }
.registry-status-pill-v2.uncontrolled i { background: #dc2626; }
.registry-status-pill-v2.watch { background: #ffedd5; color: #b45309; }
.registry-status-pill-v2.watch i { background: #f59e0b; }
.registry-row-actions-v2 {
  display: flex;
  gap: 5px;
  align-items: center;
}
.registry-row-actions-v2 button {
  min-height: 28px;
  padding: 0 9px;
  border: 1px solid #bfdbfe;
  border-radius: 7px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 9px;
  font-weight: 900;
  cursor: pointer;
}
.registry-row-actions-v2 button:hover { background: #dbeafe; }

.registry-pagination-v2 {
  justify-content: flex-end;
  gap: 5px;
  padding: 12px;
  border-top: 1px solid var(--line);
}
.registry-pagination-v2 button {
  min-width: 32px;
  height: 32px;
  padding: 0 8px;
  border-radius: 7px;
}
.registry-pagination-v2 button.active {
  border-color: var(--blue);
  background: var(--blue);
  color: #fff;
}
.registry-page-ellipsis {
  display: inline-grid;
  place-items: center;
  min-width: 26px;
  color: var(--muted);
  font-size: 10px;
}

@media (max-width: 1280px) {
  .registry-filter-bar-v2 {
    grid-template-columns: minmax(220px,1.2fr) repeat(2,minmax(140px,1fr)) repeat(2,minmax(130px,.8fr));
  }
  .registry-export-button-v2 { grid-column: auto; }
}
@media (max-width: 900px) {
  .registry-filter-bar-v2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .registry-search-field { grid-column: 1 / -1; }
  .registry-export-button-v2 { grid-column: 1 / -1; }
  .registry-summary-strip-v2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 600px) {
  .registry-filter-bar-v2 { grid-template-columns: 1fr; }
  .registry-search-field,
  .registry-export-button-v2 { grid-column: auto; }
  .registry-summary-strip-v2 { grid-template-columns: 1fr; }
  .registry-table-toolbar-v2 { align-items: stretch; flex-direction: column; }
  .registry-table-search-v2 { width: 100%; }
}



/* TYPOGRAPHY_SYSTEM_V2_15_1_BASE_16PX */
:root {
  --font-xs: 13px;
  --font-sm: 14px;
  --font-base: 16px;
  --font-md: 17px;
  --font-lg: 20px;
  --font-title: 28px;
  --font-kpi: 32px;
}

body,
button,
input,
select,
textarea,
table {
  font-size: var(--font-base);
}

.brand strong { font-size: 22px; }
.brand span,
.sync-card small,
.nav-item small { font-size: var(--font-sm); }

.nav-section-toggle { font-size: var(--font-base); }
.nav-item { font-size: var(--font-base); }
.nav-item i { font-size: var(--font-xs); }
.dashboard-main-nav span { font-size: var(--font-md); }
.nav-badge,
.nav-system-label { font-size: var(--font-xs); }

.eyebrow { font-size: var(--font-sm); }
.topbar h1 { font-size: 24px; }
.topbar p,
.connection-status strong,
.user-chip b { font-size: var(--font-sm); }
.connection-status small { font-size: var(--font-xs); }

.global-filter-bar label,
.registry-filter-bar-v2 label > span { font-size: var(--font-sm); }
.global-filter-bar select,
.global-filter-bar input,
.registry-filter-bar-v2 input,
.registry-filter-bar-v2 select,
.module-search,
.registry-table-search-v2,
.registry-page-size-v2 select { font-size: var(--font-base); }

.registry-page-head-v2 h2 { font-size: var(--font-title); }
.registry-page-head-v2 > div > p:last-child { font-size: var(--font-base); }

.registry-summary-strip-v2 article span,
.module-summary-card span { font-size: var(--font-sm); }
.registry-summary-strip-v2 article strong,
.module-summary-card strong { font-size: var(--font-kpi); }
.registry-summary-strip-v2 article small,
.module-summary-card small { font-size: var(--font-xs); }

.registry-disease-tab-v2 { font-size: var(--font-sm); }
.registry-disease-tab-v2 b { font-size: var(--font-xs); }

.registry-page-size-v2,
.registry-result-v2,
.module-result { font-size: var(--font-sm); }

.registry-table-v2 thead th,
.module-table th {
  font-size: var(--font-sm);
  line-height: 1.35;
}
.registry-table-v2 tbody td,
.module-table td {
  font-size: var(--font-base);
  line-height: 1.45;
}

.registry-disease-badges-v2 span,
.registry-status-pill-v2,
.registry-row-actions-v2 button,
.table-subtext {
  font-size: var(--font-xs);
}

.simple-bar-row { font-size: var(--font-sm); }

.panel-head h2,
.module-view .panel-head h2 { font-size: 22px; }
.panel-head span,
.module-view .panel-head span { font-size: var(--font-sm); }

@media (max-width: 768px) {
  body,
  button,
  input,
  select,
  textarea,
  table { font-size: var(--font-base); }

  .registry-page-head-v2 h2 { font-size: 25px; }
  .registry-table-v2 thead th,
  .module-table th { font-size: var(--font-xs); }
  .registry-table-v2 tbody td,
  .module-table td { font-size: var(--font-sm); }
}

/* TEAL_HEALTH_THEME_V2_11_1 */
:root {
  --bg: #f0fdfa;
  --surface: #ffffff;
  --surface-soft: #f5fffd;
  --line: #ccfbf1;
  --line-strong: #99f6e4;
  --text: #134e4a;
  --muted: #5f7f7b;
  --blue: #0f766e;
  --blue-soft: #ccfbf1;
  --teal: #0f766e;
  --teal-soft: #ccfbf1;
  --green: #16a34a;
  --green-soft: #dcfce7;
  --yellow: #d97706;
  --yellow-soft: #ffedd5;
  --red: #dc2626;
  --red-soft: #fee2e2;
  --shadow: 0 14px 36px rgba(13,148,136,.08);
}
body {
  background: #f0fdfa;
}
.sidebar,
.brand {
  background: #134e4a;
}
.nav-item.active {
  background: #0d9488;
  border-color: rgba(153,246,228,.34);
}
.nav-item.active i {
  background: #0f766e;
}
.nav-item.active::before {
  background: #5eead4;
}
.nav-group.active-parent > .nav-section-toggle {
  background: rgba(13,148,136,.28);
  box-shadow: inset 3px 0 0 #5eead4;
}
.app-shell.sidebar-collapsed .sidebar-toggle {
  background: #0d9488;
  border-color: #0d9488;
}
.header-sidebar-toggle:hover {
  background: #0f766e;
  border-color: #0f766e;
}
.topbar,
.panel,
.registry-filter-bar-v2,
.registry-table-card-v2,
.registry-summary-strip-v2 article {
  box-shadow: 0 8px 24px rgba(13,148,136,.05);
}
.registry-export-button-v2,
.registry-disease-tab-v2.active,
.registry-pagination-v2 button.active {
  background: #0f766e;
  border-color: #0f766e;
  box-shadow: 0 8px 18px rgba(15,118,110,.16);
}
.registry-disease-tab-v2:hover {
  border-color: #5eead4;
  background: #ecfdf5;
}
.registry-row-actions-v2 button {
  border-color: #99f6e4;
  background: #f0fdfa;
  color: #0f766e;
}
.registry-row-actions-v2 button:hover {
  background: #ccfbf1;
}
.registry-table-v2 thead th {
  background: #ecfdf5;
  color: #115e59;
}
.registry-table-v2 tbody tr:hover {
  background: #f0fdfa;
}
.registry-summary-strip-v2 article {
  background: linear-gradient(135deg,#ffffff 0%,#f0fdfa 100%);
}
.registry-disease-badges-v2 span {
  background: #ccfbf1;
  color: #0f766e;
}
.registry-disease-badges-v2 span:nth-child(2n) {
  background: #d1fae5;
  color: #047857;
}
.registry-disease-badges-v2 span:nth-child(3n) {
  background: #e0f2fe;
  color: #0369a1;
}

/* DASHBOARD_TABS_V2_10_2 */
.dashboard-main-nav {
  min-height: 46px;
  margin-bottom: 3px;
  grid-template-columns: 32px minmax(0,1fr);
}
.dashboard-main-nav span {
  font-size: 14px;
  font-weight: 900;
}
.dashboard-main-nav small {
  grid-column: 2;
  margin-top: -2px;
}
.dashboard-tab-panel {
  min-width: 0;
  display: grid;
  gap: 14px;
}
.dashboard-tab-panel[hidden] {
  display: none !important;
}
@media (max-width: 768px) {
  .dashboard-tabs {
    padding: 7px;
    gap: 6px;
  }
  .dashboard-tab {
    min-height: 38px;
    padding: 8px 11px;
    font-size: 12px;
  }
}

/* PATIENT_PROFILE_WORKSPACE_V2_16_0 */
.patient-profile-layout {
  display: grid;
  grid-template-columns: minmax(340px, 34%) minmax(0, 66%);
  gap: 16px;
  align-items: start;
}
.patient-profile-sidebar,
.patient-profile-workspace {
  min-width: 0;
}
.patient-profile-sidebar {
  position: sticky;
  top: 92px;
  display: grid;
  gap: 18px;
}
.profile-return-bar {
  margin-bottom: 14px;
}
.profile-return-bar button {
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: var(--surface-soft);
  color: var(--teal);
  font-weight: 800;
  cursor: pointer;
}
.patient-profile-identity {
  display: flex;
  align-items: center;
  gap: 14px;
}
.patient-avatar-large {
  width: 64px;
  height: 64px;
  flex: 0 0 64px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: linear-gradient(135deg,#ccfbf1,#d1fae5);
  color: #0f766e;
  font-size: 20px;
  font-weight: 900;
}
.patient-profile-identity h2 {
  margin: 0 0 8px;
  font-size: 24px;
  line-height: 1.25;
}
.patient-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.profile-status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: #ecfdf5;
  color: #047857;
  font-size: 13px;
  font-weight: 800;
}
.profile-status-badge.uncontrolled,
.profile-status-badge.lost { background:#fee2e2; color:#b91c1c; }
.profile-status-badge.watch { background:#ffedd5; color:#b45309; }
.profile-status-badge.controlled { background:#dcfce7; color:#15803d; }

.patient-profile-meta {
  margin-top: 16px;
}
.patient-profile-meta .meta-cell {
  min-height: 76px;
  display: grid;
  align-content: center;
}
.patient-profile-meta .meta-cell span {
  font-size: 13px;
}
.patient-profile-meta .meta-cell strong {
  font-size: 15px;
  line-height: 1.35;
}

.patient-current-status {
  border-top: 1px solid var(--line);
  padding-top: 16px;
}
.patient-section-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}
.patient-section-head h3 {
  margin: 0;
  font-size: 18px;
}
.patient-section-head span {
  color: var(--muted);
  font-size: 12px;
}
.patient-status-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 10px;
}
.patient-status-grid article,
.patient-lab-summary article {
  min-width: 0;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-soft);
}
.patient-status-grid span,
.patient-lab-summary span {
  display: block;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}
.patient-status-grid strong,
.patient-lab-summary strong {
  display: block;
  margin-top: 6px;
  color: var(--text);
  font-size: 16px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.patient-profile-workspace {
  display: grid;
  gap: 14px;
}
.patient-main-tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-soft);
  scrollbar-width: thin;
}
.patient-main-tabs button,
.patient-lab-tabs button {
  flex: 0 0 auto;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}
.patient-main-tabs button.active,
.patient-main-tabs button[aria-selected="true"],
.patient-lab-tabs button.active {
  border-color: #0f766e;
  background: #0f766e;
  color: #fff;
  box-shadow: 0 6px 16px rgba(15,118,110,.16);
}
.patient-tab-panel {
  display: grid;
  gap: 14px;
  min-width: 0;
}
.patient-tab-panel[hidden] { display:none !important; }

.patient-lab-head {
  align-items: end;
}
.patient-lab-head select {
  min-width: 120px;
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface);
  color: var(--text);
  font-size: 14px;
}
.patient-lab-tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
}
.patient-lab-tabs button {
  min-width: 92px;
  border-color: var(--line);
  background: var(--surface);
  color: var(--text);
}
.patient-lab-summary {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 10px;
}
.patient-lab-summary article:first-child strong {
  color: #0f766e;
  font-size: 22px;
}
.patient-lab-grid {
  display: grid;
  grid-template-columns: minmax(0,1.35fr) minmax(300px,.85fr);
  gap: 14px;
  align-items: start;
}
.patient-chart-panel,
.patient-lab-history {
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}
.patient-chart-panel canvas,
#vitalTrendChart {
  display: block;
  width: 100%;
  max-width: 100%;
}
.patient-lab-note {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 9px;
  background: #f0fdfa;
  color: #476c68;
  font-size: 13px;
  line-height: 1.55;
}
.patient-profile-workspace .profile-table th,
.patient-profile-workspace .profile-table td {
  font-size: 14px;
}
.patient-profile-workspace .profile-table-wrap {
  max-height: 460px;
}
.patient-profile-workspace .profile-empty {
  padding: 28px 16px;
  border: 1px dashed var(--line-strong);
  border-radius: 10px;
  background: var(--surface-soft);
  color: var(--muted);
  text-align: center;
  font-size: 14px;
}

@media (max-width: 1180px) {
  .patient-profile-layout {
    grid-template-columns: minmax(300px, 36%) minmax(0,64%);
  }
  .patient-lab-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .patient-lab-grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .patient-profile-layout { grid-template-columns: 1fr; }
  .patient-profile-sidebar { position: static; }
}
@media (max-width: 600px) {
  .patient-profile-meta,
  .patient-status-grid,
  .patient-lab-summary { grid-template-columns: 1fr; }
  .patient-profile-identity { align-items: flex-start; }
  .patient-main-tabs { margin-inline: -4px; }
  .patient-lab-head { align-items: stretch; }
  .patient-lab-head select { width: 100%; }
}

/* DASHBOARD_SCOPE_REGISTRY_V2_17_0 */
.home-main-summary-grid.home-main-summary-grid-all {
  grid-template-columns: repeat(4,minmax(0,1fr));
}
.home-main-card[role="button"] {
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.home-main-card[role="button"]:hover,
.home-main-card[role="button"]:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(15,23,42,.10);
  outline: none;
  border-color: #99d8d1;
}
.home-main-card.area-in { border-top: 3px solid #0f766e; }
.home-main-card.controlled { border-top: 3px solid #16a34a; }
.home-main-card.follow-up { border-top: 3px solid #dc2626; }
.home-main-card.controlled .home-main-icon { background: #ecfdf5; color: #15803d; }
.home-main-card.follow-up .home-main-icon { background: #fef2f2; color: #dc2626; }
.home-main-card.area-out { border-top: 3px solid #f59e0b; }
.home-main-card.area-unknown { border-top: 3px solid #94a3b8; }
.home-main-card.mixed { border-top: 3px solid #7c3aed; }
.home-main-card.treatment-unknown { border-top: 3px solid #64748b; }

.home-main-card.area-in .home-main-icon { background:#ecfdf5;color:#047857; }
.home-main-card.area-out .home-main-icon { background:#fff7ed;color:#c2410c; }
.home-main-card.area-unknown .home-main-icon { background:#f1f5f9;color:#475569; }
.home-main-card.mixed .home-main-icon { background:#f5f3ff;color:#6d28d9; }
.home-main-card.treatment-unknown .home-main-icon { background:#f8fafc;color:#475569; }

.registry-filter-bar-v2 {
  grid-template-columns: minmax(250px,1.3fr) repeat(5,minmax(135px,.76fr)) auto;
}
.registry-treatment-cell {
  display: grid;
  gap: 5px;
  min-width: 150px;
}
.registry-treatment-cell small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  white-space: normal;
}
.treatment-badge {
  width: max-content;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.treatment-badge.local { background:#dcfce7;color:#166534; }
.treatment-badge.other { background:#ffedd5;color:#9a3412; }
.treatment-badge.mixed { background:#ede9fe;color:#6d28d9; }
.treatment-badge.unknown { background:#f1f5f9;color:#475569; }

@media (max-width: 1280px) {
  .home-main-summary-grid.home-main-summary-grid-all { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .registry-filter-bar-v2 { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .registry-search-field { grid-column: span 2; }
}
@media (max-width: 700px) {
  .home-main-summary-grid.home-main-summary-grid-all { grid-template-columns: 1fr; }
  .registry-filter-bar-v2 { grid-template-columns: 1fr; }
  .registry-search-field { grid-column: auto; }
}

/* LAB_HISTORY_REGISTRY_V2_18_0 */
.lab-history-registry {
  display: grid;
  gap: 14px;
}
.lab-registry-toolbar {
  display: grid;
  grid-template-columns: minmax(260px,1.4fr) minmax(180px,.7fr) minmax(160px,.6fr);
  gap: 10px;
}
.lab-registry-toolbar input,
.lab-registry-toolbar select {
  min-height: 44px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0 12px;
  background: var(--surface);
  color: var(--text);
  font-size: 14px;
}
.lab-registry-summary-grid {
  grid-template-columns: repeat(auto-fit,minmax(150px,1fr));
}
.lab-three-year-report {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px;
  background: var(--surface-soft);
}
.lab-three-year-table td,
.lab-three-year-table th {
  text-align: center;
  white-space: nowrap;
}
.lab-group-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.lab-group-badge.group-lt7,
.lab-group-badge.group-g1,
.lab-group-badge.group-g2 { background:#dcfce7;color:#166534; }
.lab-group-badge.group-7_7_9,
.lab-group-badge.group-g3a { background:#fef3c7;color:#92400e; }
.lab-group-badge.group-ge8,
.lab-group-badge.group-g3b,
.lab-group-badge.group-g4,
.lab-group-badge.group-g5 { background:#fee2e2;color:#b91c1c; }

@media (max-width: 900px) {
  .lab-registry-toolbar { grid-template-columns: 1fr; }
}

/* LAB_YEARLY_ANALYSIS_V2_19_0 */
.lab-yearly-analysis {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px;
  background: var(--surface);
  display: grid;
  gap: 12px;
}
.lab-analysis-summary {
  grid-template-columns: repeat(4,minmax(0,1fr));
}
.lab-yearly-analysis-table th,
.lab-yearly-analysis-table td {
  vertical-align: middle;
}
.lab-trend-badge {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.lab-trend-badge.good { background:#dcfce7; color:#166534; }
.lab-trend-badge.bad { background:#fee2e2; color:#b91c1c; }
.lab-trend-badge.stable { background:#fef3c7; color:#92400e; }
.lab-trend-badge.muted { background:#f1f5f9; color:#475569; }
/* Lab tabs in the title row */
#lab-registry .lab-panel-head,
#lab-hba1c .lab-panel-head,
#lab-egfr .lab-panel-head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px 18px;
}
.lab-panel-head > div:first-child { flex: 1 1 300px; min-width: 250px; }
.lab-panel-head > .registry-export-button-v2 { flex: 0 0 auto; margin-left: auto; }
.lab-panel-head .lab-header-tabs {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  border: 0;
}
.lab-panel-head .lab-header-tabs [role="tab"] {
  border: 1px solid #b8e5df;
  border-radius: 9px;
  background: #f2fbf9;
  color: #145451;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  padding: 8px 11px;
  cursor: pointer;
}
.lab-panel-head .lab-header-tabs [role="tab"][aria-selected="true"] {
  border-color: #0f766e;
  background: #0f766e;
  color: #fff;
}
.lab-panel-head .lab-header-tabs [role="tab"]:focus-visible {
  outline: 3px solid #f59e0b;
  outline-offset: 2px;
}
.lab-tab-panel[hidden] { display: none !important; }
@media (max-width: 1100px) {
  .lab-panel-head .lab-header-tabs { order: 3; flex-basis: 100%; justify-content: flex-start; }
}
/* TABLE_VIEWPORT_V2_19_4 */
@media (min-width:1100px) and (min-height:650px) {
  html,body { height:100%; }
  body { overflow:hidden; }
  .app-shell { height:100dvh; min-height:0; overflow:hidden; }
  .main { height:100dvh; min-height:0; overflow-y:auto; overflow-x:hidden; }
  .main:has(> #registry.active),
  .main:has(> .view.active:is(#followup-overview,#service-history,#area-treatment,#reports-disease,#reports-village)),
  .main:has(> .view.active:is(#lab-registry,#lab-egfr,#lab-hba1c):has(.lab-tab-panel[data-lab-panel="results"]:not([hidden]))) { overflow-y:hidden; }
  .view.active:is(#registry,#followup-overview,#service-history,#area-treatment,#reports-disease,#reports-village),
  .view.active:is(#lab-registry,#lab-egfr,#lab-hba1c):has(.lab-tab-panel[data-lab-panel="results"]:not([hidden])) {
    height:calc(100dvh - var(--fixed-header-height) - var(--fixed-footer-height) - 36px);
    min-height:0;
  }
  #registry.active > .registry-landing:not([hidden]),
  #registry.active > .registry-detail:not([hidden]),
  .view.active:is(#followup-overview,#service-history,#area-treatment,#reports-disease,#reports-village) > .module-view,
  .view.active:is(#lab-registry,#lab-egfr,#lab-hba1c):has(.lab-tab-panel[data-lab-panel="results"]:not([hidden])) > .module-view {
    height:100%; min-height:0; display:flex; flex-direction:column;
  }
  #registry.active .registry-table-card-v2,
  .view.active:is(#lab-registry,#lab-egfr,#lab-hba1c) .lab-tab-panel[data-lab-panel="results"]:not([hidden]) {
    display:flex; flex:1 1 auto; min-height:0; flex-direction:column;
  }
  #registry.active .registry-table-card-v2 > .registry-table-wrap-v2,
  #registry.active > .registry-detail:not([hidden]) > .registry-table-wrap,
  .view.active:is(#followup-overview,#service-history,#area-treatment,#reports-disease,#reports-village) > .module-view > .table-wrap,
  .view.active:is(#lab-registry,#lab-egfr,#lab-hba1c) .lab-tab-panel[data-lab-panel="results"]:not([hidden]) > .table-wrap {
    flex:1 1 auto; min-height:0; max-height:none; overflow:auto;
  }
  #registry.active .registry-table-first > .registry-page-head-v2,
  #registry.active .registry-table-first > .registry-filter-bar-v2,
  #registry.active .registry-table-card-v2 > :not(.registry-table-wrap-v2),
  #registry.active > .registry-detail:not([hidden]) > :not(.registry-table-wrap),
  .view.active:is(#followup-overview,#service-history,#area-treatment,#reports-disease,#reports-village) > .module-view > :not(.table-wrap) { flex-shrink:0; }
}

/* REGISTRY_COMPACT_V2_19_5 */
@media (min-width:769px) {
  #registry.active .registry-table-first { gap:8px; }
  #registry.active .registry-page-head-v2 { padding:0; }
  #registry.active .registry-page-head-v2 h2 { margin:0; font-size:24px; line-height:1.2; }
  #registry.active .registry-filter-bar-v2 { padding:8px 12px; gap:8px; }
  #registry.active .registry-filter-bar-v2 label { gap:3px; }
  #registry.active .registry-filter-bar-v2 input,
  #registry.active .registry-filter-bar-v2 select,
  #registry.active .registry-export-button-v2 { min-height:36px; }
  #registry.active .registry-table-toolbar-v2 { padding:5px 12px; }
  #registry.active .registry-table-search-v2 { min-height:32px; }
  #registry.active .registry-result-v2 { padding:3px 12px; }
  #registry.active .registry-pagination-v2 { padding:6px 10px; }
  #registry.active .registry-pagination-v2 button { height:28px; min-width:28px; }
  #registry.active .registry-table-v2 thead th { padding:7px 10px; }
  #registry.active .registry-table-v2 tbody td { padding:5px 10px; line-height:1.3; }
  #registry.active .registry-treatment-cell { gap:2px; }
  #registry.active .treatment-badge { min-height:22px; }
  #registry.active .registry-treatment-cell small { line-height:1.15; }
}
@media (min-width:1100px) and (min-height:650px) {
  .main:has(> #registry.active) {
    padding-top:calc(var(--fixed-header-height) + 8px) !important;
    padding-bottom:calc(var(--fixed-footer-height) + 8px) !important;
  }
  #registry.active { height:calc(100dvh - var(--fixed-header-height) - var(--fixed-footer-height) - 16px); }
}

/* TABLE_FOOTER_V2_19_6 */
@media (min-width:769px) {
  .main { padding-bottom:calc(var(--fixed-footer-height) + 4px) !important; }
}
.registry-table-footer-v2 {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:44px;
  padding:5px 10px;
  border-top:1px solid var(--line);
}
.registry-table-footer-info-v2 {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  min-width:0;
}
#registry.active .registry-table-footer-v2 .registry-result-v2 { padding:0; }
.registry-table-footer-v2 .registry-pagination-v2 {
  margin:0;
  padding:0;
  border:0;
  flex:0 0 auto;
}
@media (max-width:850px) {
  .registry-table-footer-v2 { flex-wrap:wrap; }
  .registry-table-footer-v2 .registry-pagination-v2 { margin-left:auto; }
}
@media (min-width:1100px) and (min-height:650px) {
  .main:has(> .view.active:is(#registry,#followup-overview,#service-history,#area-treatment,#reports-disease,#reports-village)),
  .main:has(> .view.active:is(#lab-registry,#lab-egfr,#lab-hba1c):has(.lab-tab-panel[data-lab-panel="results"]:not([hidden]))) {
    padding-top:calc(var(--fixed-header-height) + 4px) !important;
    padding-bottom:calc(var(--fixed-footer-height) + 4px) !important;
  }
  .view.active:is(#registry,#followup-overview,#service-history,#area-treatment,#reports-disease,#reports-village),
  .view.active:is(#lab-registry,#lab-egfr,#lab-hba1c):has(.lab-tab-panel[data-lab-panel="results"]:not([hidden])) {
    height:calc(100dvh - var(--fixed-header-height) - var(--fixed-footer-height) - 8px);
  }
  #registry.active .registry-table-card-v2 > .registry-table-footer-v2 { flex:0 0 auto; }
}

/* REGISTRY_SCREEN_FIT_V2_19_7 */
#registry.active .registry-table-footer-info-v2 { gap:6px; }
#registry.active .registry-page-size-v2 { gap:6px; }
#registry.active .registry-table-footer-v2 .registry-result-v2 {
  display:inline-flex;
  align-items:center;
  min-height:0;
  margin:0;
  padding:0;
  line-height:1.3;
  white-space:nowrap;
}
@media (min-width:1100px) and (min-height:650px) {
  .main:has(> #registry.active) {
    padding-left:12px;
    padding-right:12px;
    overflow:hidden;
  }
  #registry.active .registry-table-first { gap:6px; }
  #registry.active .registry-table-card-v2 { min-height:0; }
  #registry.active .registry-table-wrap-v2 {
    min-height:0;
    overflow-y:auto;
    overflow-x:auto;
  }
}

/* MODULE_TABLE_PAGER_V2_20_0 */
.module-table-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:8px 12px;
  min-height:44px;
  padding:5px 10px;
  border-top:1px solid var(--line);
  background:var(--surface);
}
.module-table-footer .registry-table-footer-info-v2 { gap:6px; }
.module-table-footer .registry-page-size-v2 { gap:6px; }
.module-table-footer .module-page-total { color:var(--muted); font-size:var(--font-sm); font-weight:700; white-space:nowrap; }
.module-table-footer .registry-pagination-v2 { margin:0; padding:0; border:0; flex:0 0 auto; }
@media (max-width:850px) {
  .module-table-footer .registry-pagination-v2 { margin-left:auto; }
}
@media (min-width:1100px) and (min-height:650px) {
  .view.active:is(#followup-overview,#service-history) > .module-view > .module-table-footer,
  .view.active:is(#lab-registry,#lab-egfr,#lab-hba1c) .lab-tab-panel[data-lab-panel="results"]:not([hidden]) > .module-table-footer { flex:0 0 auto; }
  .view.active:is(#lab-registry,#lab-egfr,#lab-hba1c) .lab-tab-panel[data-lab-panel="results"]:not([hidden]) > .table-wrap { flex:1 1 auto; min-height:0; }
}

.lab-analysis-note {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 9px;
  background: #f8fafc;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}
@media (max-width: 900px) {
  .lab-analysis-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 600px) {
  .lab-analysis-summary { grid-template-columns: 1fr; }
}

/* Medical Clean Blue-White Theme v2.23.0 */
:root{
  --bg:#f4f9ff;--surface:#ffffff;--surface-soft:#f7fbff;
  --line:#dbeafe;--line-strong:#bfdbfe;--text:#15304f;--muted:#64748b;
  --blue:#1683f3;--blue-soft:#eaf4ff;--teal:#1683f3;--teal-soft:#eaf4ff;
  --shadow:0 10px 28px rgba(30,100,180,.08);
}
body:not(.dark){background:linear-gradient(180deg,#f7fbff 0,#f2f8ff 100%);color:var(--text)}
body:not(.dark) .sidebar{background:linear-gradient(180deg,#0d66c2 0%,#1683f3 100%);border-right-color:rgba(255,255,255,.18)}
body:not(.dark) .brand{background:#0d66c2;border-bottom-color:rgba(255,255,255,.18)}
body:not(.dark) .topbar{background:rgba(255,255,255,.98);border-bottom-color:#dbeafe;box-shadow:0 4px 18px rgba(30,100,180,.07)}
body:not(.dark) .card,body:not(.dark) .panel,body:not(.dark) .table-card{border-color:#dbeafe;box-shadow:var(--shadow)}
body:not(.dark) input,body:not(.dark) select,body:not(.dark) textarea{border-color:#cfe3fa}
body:not(.dark) input:focus,body:not(.dark) select:focus,body:not(.dark) textarea:focus{border-color:#1683f3;box-shadow:0 0 0 3px rgba(22,131,243,.12)}
body:not(.dark) .nav-item.active,body:not(.dark) .tab-btn.active{background:#fff;color:#0d66c2}

/* Medical Clean Dark Mode compatibility v2.23.1 */
body.dark{
  --bg:#081321;--surface:#0f1f33;--surface-soft:#142943;
  --line:#28425f;--line-strong:#365878;--text:#eaf4ff;--muted:#9fb3c8;
  --blue:#42a5ff;--blue-soft:#16385c;--teal:#42a5ff;--teal-soft:#16385c;
  --shadow:0 14px 34px rgba(0,0,0,.28);
  background:#081321;color:var(--text);
}
body.dark .sidebar{background:linear-gradient(180deg,#071a2e 0%,#0b3158 100%);border-right-color:#28425f}
body.dark .brand{background:#071a2e;border-bottom-color:#28425f}
body.dark .topbar,body.dark .card,body.dark .panel,body.dark .table-card,
body.dark .modal-card,body.dark .dropdown-menu,body.dark .profile-card,
body.dark .summary-card,body.dark .filter-card{background:var(--surface)!important;color:var(--text);border-color:var(--line)}
body.dark input,body.dark select,body.dark textarea{background:var(--surface-soft)!important;color:var(--text)!important;border-color:var(--line)!important}
body.dark table,body.dark th,body.dark td{color:var(--text);border-color:var(--line)}
body.dark th{background:var(--surface-soft)}
body.dark .tab-btn:not(.active),body.dark .secondary{color:var(--text)}
body.dark .nav-item.active,body.dark .tab-btn.active{background:#16385c;color:#d9ecff}
body.dark .muted,body.dark small{color:var(--muted)}

/* System-wide Medical Clean color normalization v2.23.2 */
body:not(.dark){
 --primary:#1683f3;--primary-strong:#0d66c2;--primary-soft:#eaf4ff;
 --accent:#42a5ff;--focus-ring:rgba(22,131,243,.16);
}
body:not(.dark) a:not(.danger-link){color:#0d66c2}
body:not(.dark) .primary,body:not(.dark) button.primary,
body:not(.dark) .btn-primary,body:not(.dark) .action-primary,
body:not(.dark) .icon-button.active{background:#1683f3!important;border-color:#1683f3!important;color:#fff!important}
body:not(.dark) .secondary,body:not(.dark) .btn-secondary{border-color:#bfdbfe!important;color:#0d66c2}
body:not(.dark) .secondary:hover,body:not(.dark) .btn-secondary:hover{background:#eaf4ff!important}
body:not(.dark) :focus-visible{outline-color:#1683f3}
body:not(.dark) .tabs button[aria-selected="true"],
body:not(.dark) .screening-tabs button[aria-selected="true"],
body:not(.dark) #screeningCompareToggle.active{background:#1683f3!important;border-color:#1683f3!important;color:#fff!important}
body:not(.dark) .screening-summary-card:focus-visible{border-color:#1683f3!important;box-shadow:0 7px 18px rgba(22,131,243,.14)!important}
body:not(.dark) .screening-action-link{color:#0d66c2!important}
body:not(.dark) .pagination button.active,
body:not(.dark) .filter-chip.active{background:#1683f3!important;border-color:#1683f3!important;color:#fff!important}
body:not(.dark) .badge.info,body:not(.dark) .status-info{background:#eaf4ff!important;color:#0d66c2!important}
body:not(.dark) .progress:not(.clinical) > span{background:#1683f3}
body.dark a:not(.danger-link){color:#7cc0ff}
body.dark .primary,body.dark button.primary,body.dark .btn-primary,body.dark .action-primary{background:#248fe8!important;border-color:#248fe8!important;color:#fff!important}
body.dark .secondary,body.dark .btn-secondary{border-color:#365878!important;color:#d9ecff!important;background:#142943!important}
body.dark .tabs button[aria-selected="true"],
body.dark .screening-tabs button[aria-selected="true"],
body.dark #screeningCompareToggle.active{background:#1b6fab!important;border-color:#42a5ff!important;color:#fff!important}

/* Approved Smart NCD Light/Dark Deep Tone Theme v2.24.0 */
:root{
 --navy-900:#0b1f44;--navy-800:#123366;--blue-600:#1565d8;--teal-600:#0ea5a8;--teal-500:#10b981;
 --bg:#f3f8fe;--surface:#fff;--surface-soft:#f1f5fb;--line:#d8e7f5;--line-strong:#bcd3ea;
 --text:#0f2747;--muted:#647b94;--blue:#1565d8;--blue-soft:#e6f0ff;--teal:#0ea5a8;--teal-soft:#e2f8f7;
 --shadow:0 10px 28px rgba(11,31,68,.09);
 --clinical-normal:#10b981;--clinical-risk:#facc15;--clinical-suspected:#fb923c;--clinical-new:#ef4444;--clinical-missing:#64748b;
}
body:not(.dark){background:linear-gradient(180deg,#f7fbff 0,#f3f8fe 100%);color:var(--text)}
body:not(.dark) .sidebar{background:linear-gradient(180deg,#0b1f44 0%,#123366 100%)!important;color:#eef6ff}
body:not(.dark) .brand{background:#0b1f44!important}
body:not(.dark) .nav-item.active{background:#1565d8!important;color:#fff!important;border-left-color:#10cfc2!important}
body:not(.dark) .nav-item:hover{background:rgba(21,101,216,.18)}
body:not(.dark) .topbar{background:rgba(255,255,255,.98)!important;border-bottom-color:#d8e7f5!important}
body:not(.dark) .card,body:not(.dark) .panel,body:not(.dark) .table-card{background:#fff;border-color:#d8e7f5;box-shadow:var(--shadow)}
body:not(.dark) .primary,body:not(.dark) button.primary,body:not(.dark) .btn-primary{background:#1565d8!important;border-color:#1565d8!important;color:#fff!important}
body:not(.dark) .primary:hover,body:not(.dark) button.primary:hover{background:#0d55bb!important}
body:not(.dark) input,body:not(.dark) select,body:not(.dark) textarea{background:#fff!important;border-color:#d8e7f5!important;color:#0f2747!important}
body:not(.dark) input:focus,body:not(.dark) select:focus,body:not(.dark) textarea:focus{border-color:#1565d8!important;box-shadow:0 0 0 3px rgba(21,101,216,.14)!important}

body.dark{
 --bg:#071727;--surface:#0b2239;--surface-soft:#0f2c49;--line:#1f4668;--line-strong:#2c5c83;
 --text:#eaf4ff;--muted:#9bb2ca;--blue:#3b82f6;--blue-soft:#123b66;--teal:#14b8a6;--teal-soft:#103f46;
 --shadow:0 14px 34px rgba(0,0,0,.32);background:#071727!important;color:var(--text);
}
body.dark .sidebar{background:linear-gradient(180deg,#06182c 0%,#0b3769 100%)!important;color:#eef6ff}
body.dark .brand{background:#06182c!important}
body.dark .topbar{background:#08203a!important;border-bottom-color:#1f4668!important;color:#eaf4ff}
body.dark .card,body.dark .panel,body.dark .table-card,body.dark .modal-card,body.dark .dropdown-menu,
body.dark .profile-card,body.dark .summary-card,body.dark .filter-card{background:#0b2239!important;color:#eaf4ff!important;border-color:#1f4668!important;box-shadow:var(--shadow)}
body.dark input,body.dark select,body.dark textarea{background:#0f2c49!important;color:#eaf4ff!important;border-color:#2c5c83!important}
body.dark input:focus,body.dark select:focus,body.dark textarea:focus{border-color:#3b82f6!important;box-shadow:0 0 0 3px rgba(59,130,246,.18)!important}
body.dark table,body.dark th,body.dark td{color:#eaf4ff;border-color:#1f4668}
body.dark th{background:#0f2c49!important}
body.dark .nav-item.active{background:#1672e8!important;color:#fff!important;border-left-color:#16d4c5!important}
body.dark .nav-item:hover{background:rgba(59,130,246,.16)}
body.dark .primary,body.dark button.primary,body.dark .btn-primary{background:#1672e8!important;border-color:#1672e8!important;color:#fff!important}
body.dark .secondary,body.dark .btn-secondary{background:#0f2c49!important;border-color:#2c5c83!important;color:#dcecff!important}

/* semantic colors: stable in both modes */
.status-normal,.clinical-normal{color:var(--clinical-normal)!important}
.status-risk,.clinical-risk{color:#b58900!important}
.status-suspected,.clinical-suspected{color:var(--clinical-suspected)!important}
.status-newcase,.clinical-new{color:var(--clinical-new)!important}

/* UI accent cleanup v2.24.1: replace legacy teal controls, preserve semantic clinical colors */
body:not(.dark) .patient-vital-tabs button.active,
body:not(.dark) .patient-vital-tabs button[aria-selected="true"],
body:not(.dark) .settings-tablist button.active,
body:not(.dark) .settings-tablist button[aria-selected="true"]{background:#1565d8!important;border-color:#1565d8!important;color:#fff!important;box-shadow:0 5px 14px rgba(21,101,216,.14)!important}
body:not(.dark) .module-summary-card.clickable:hover,
body:not(.dark) .module-summary-card.clickable:focus-visible{border-color:#1565d8!important;box-shadow:0 8px 18px rgba(21,101,216,.12)!important}
body:not(.dark) .module-summary-card.clickable::after{color:#1565d8!important}
body:not(.dark) .sidebar-mobile-edge-toggle{background:#1565d8!important}
body:not(.dark) .profile-tabs button.active,
body:not(.dark) .profile-tabs button[aria-selected="true"],
body:not(.dark) .registry-tabs button.active,
body:not(.dark) .registry-tabs button[aria-selected="true"]{background:#1565d8!important;border-color:#1565d8!important;color:#fff!important}
body:not(.dark) button.export-btn,body:not(.dark) .export-btn{background:#1565d8!important;border-color:#1565d8!important;color:#fff!important}
body:not(.dark) .profile-back,body:not(.dark) .back-link{color:#0d55bb!important;border-color:#bcd3ea!important;background:#f5f9ff!important}
body:not(.dark) .action-btn:not(.danger),body:not(.dark) .icon-action{color:#0d55bb!important;border-color:#9fc5ee!important;background:#f4f9ff!important}
body.dark .patient-vital-tabs button.active,body.dark .settings-tablist button.active,
body.dark .profile-tabs button.active,body.dark .registry-tabs button.active{background:#1672e8!important;border-color:#3b82f6!important;color:#fff!important}
body.dark .module-summary-card.clickable::after,body.dark .profile-back,body.dark .back-link{color:#7cc0ff!important}

/* Registry approved palette hard-fix v2.24.2 */
body:not(.dark) .registry-export-button-v2,
body:not(.dark) .registry-disease-tab-v2.active,
body:not(.dark) .registry-pagination-v2 button.active{
 background:#1565d8!important;border-color:#1565d8!important;color:#fff!important;
 box-shadow:0 8px 18px rgba(21,101,216,.16)!important;
}
body:not(.dark) .registry-disease-tab-v2:hover{border-color:#8bbcf0!important;background:#eaf4ff!important}
body:not(.dark) .registry-row-actions-v2 button{border-color:#9fc5ee!important;background:#f4f9ff!important;color:#0d55bb!important}
body:not(.dark) .registry-row-actions-v2 button:hover{background:#e6f0ff!important;border-color:#6da9e8!important}
body:not(.dark) .registry-table-card-v2 thead th,
body:not(.dark) #registry table thead th{background:#eaf4ff!important;color:#123366!important;border-bottom-color:#bcd3ea!important}
body:not(.dark) .registry-filter-bar-v2{background:#fff!important;border-color:#d8e7f5!important}
body:not(.dark) .registry-table-card-v2{border-color:#d8e7f5!important}
body:not(.dark) .header-sidebar-toggle,
body:not(.dark) .theme-toggle{background:#1565d8!important;border-color:#1565d8!important;color:#fff!important}
body.dark .registry-export-button-v2,
body.dark .registry-disease-tab-v2.active,
body.dark .registry-pagination-v2 button.active{background:#1672e8!important;border-color:#3b82f6!important;color:#fff!important}
body.dark .registry-table-card-v2 thead th,
body.dark #registry table thead th{background:#0f2c49!important;color:#eaf4ff!important;border-bottom-color:#2c5c83!important}

/* NCD medication cost dashboard + patient history v2.25.0 */
.medication-cost-dashboard .panel-head span{display:block;margin-top:4px;color:var(--muted);font-size:12px}
.medication-cost-kpis{grid-template-columns:repeat(5,minmax(0,1fr))}
.medication-cost-kpi{min-height:108px}
.medication-cost-kpi span{color:var(--muted);font-size:12px;font-weight:700}
.medication-cost-kpi strong{display:block;margin:8px 0 4px;font-size:22px;color:var(--text)}
.medication-cost-kpi small{color:var(--muted)}
.medication-cost-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:14px;margin-top:14px}
.medication-cost-card{margin-top:14px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.medication-cost-card .table-wrap{margin-top:10px}
.medication-cost-year-bars{display:grid;gap:12px;margin-top:12px}
.medication-year-row{display:grid;grid-template-columns:90px minmax(140px,1fr) 150px 70px;align-items:center;gap:10px;font-size:12px}
.medication-year-row>span{font-weight:800;color:var(--text)}
.medication-year-row>b{text-align:right;color:var(--text)}
.medication-year-row>small{color:var(--muted);text-align:right}
.medication-year-track{height:18px;border-radius:999px;background:var(--surface-soft);overflow:hidden;border:1px solid var(--line)}
.medication-year-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--blue),var(--teal))}
.medication-patient-row{cursor:pointer}.medication-patient-row:hover{background:var(--blue-soft)}
.medication-cost-rule{margin-top:14px;padding:12px 14px;border-radius:10px;background:var(--surface-soft);color:var(--muted);font-size:12px;border:1px solid var(--line)}
.medication-cost-rule strong{color:var(--text)}
.patient-med-cost-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0}
.patient-med-kpi{padding:13px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface-soft)}
.patient-med-kpi span{display:block;color:var(--muted);font-size:11px;font-weight:700}
.patient-med-kpi strong{display:block;margin-top:5px;font-size:19px;color:var(--text)}
.patient-med-kpi small{display:block;margin-top:3px;color:var(--muted);font-size:10px}
.patient-med-cost-drugs{margin:14px 0}.patient-med-history-head{margin-top:18px}
.medication-name-summary{min-width:980px}
.med-trend,.ncd-med-badge,.med-excluded-badge{display:inline-flex;align-items:center;min-height:24px;padding:2px 8px;border-radius:999px;font-size:10px;font-weight:800;white-space:nowrap}
.med-trend.decrease{background:#dcfce7;color:#15803d}.med-trend.increase{background:#fee2e2;color:#b91c1c}.med-trend.same{background:var(--blue-soft);color:var(--blue)}
.ncd-med-badge{background:var(--blue-soft);color:var(--blue)}
.med-excluded-badge{background:var(--surface-soft);color:var(--muted);border:1px solid var(--line)}
.non-ncd-med-row{opacity:.72}
body.dark .med-trend.decrease{background:#123b2a;color:#86efac}
body.dark .med-trend.increase{background:#4a1d25;color:#fca5a5}
body.dark .ncd-med-badge{background:#123b66;color:#93c5fd}
body.dark .med-excluded-badge{background:#0f2c49;color:#9bb2ca;border-color:#2c5c83}
@media(max-width:1100px){.medication-cost-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.medication-cost-grid{grid-template-columns:1fr}.patient-med-cost-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.medication-cost-kpis,.patient-med-cost-summary{grid-template-columns:1fr}.medication-year-row{grid-template-columns:72px 1fr}.medication-year-row>b,.medication-year-row>small{grid-column:2;text-align:left}}

/* Patient medication profile responsive containment v2.25.1 */
.patient-tab-panel[data-profile-panel="meds"]{
  min-width:0;
  max-width:100%;
  overflow:hidden;
}
.patient-med-cost-summary{
  width:100%;
  min-width:0;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
}
.patient-med-kpi{
  min-width:0;
}
.patient-med-kpi strong,
.patient-med-kpi small{
  overflow-wrap:anywhere;
}
.patient-med-cost-drugs,
#profileDrugTable{
  min-width:0;
  max-width:100%;
  overflow:hidden;
}
.patient-med-cost-drugs .patient-section-head{
  flex-wrap:wrap;
  align-items:flex-start;
}
.patient-med-cost-drugs .profile-table-wrap,
#profileDrugTable .profile-table-wrap{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  overflow-y:auto;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
}
.medication-name-summary{
  width:max-content;
  min-width:980px;
  max-width:none;
  table-layout:auto;
}
.medication-name-summary th,
.medication-name-summary td{
  white-space:nowrap;
}
@media(max-width:1200px){
  .patient-med-cost-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .patient-med-cost-summary{grid-template-columns:1fr}
  .medication-name-summary{min-width:860px}
}

/* Patient NCD medication change analysis v2.26.0 */
.patient-med-change-analysis{min-width:0;max-width:100%;margin:14px 0}
.patient-med-change-card{min-width:0;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.med-change-summary{display:grid;grid-template-columns:repeat(6,minmax(120px,1fr));gap:8px;margin-bottom:12px}
.med-change-kpi{min-width:0;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-soft)}
.med-change-kpi span{display:block;font-size:10px;font-weight:800;color:var(--muted)}
.med-change-kpi strong{display:block;margin-top:4px;font-size:21px;color:var(--text)}
.med-change-kpi small{display:block;margin-top:2px;font-size:9px;color:var(--muted)}
.med-change-kpi.decrease{border-top:3px solid #10b981}
.med-change-kpi.increase{border-top:3px solid #ef4444}
.med-change-kpi.switch{border-top:3px solid #8b5cf6}
.med-change-kpi.stopped{border-top:3px solid #64748b}
.med-change-kpi.addon{border-top:3px solid #3b82f6}
.med-change-kpi.changed{border-top:3px solid #f59e0b}
.med-change-table-wrap{width:100%;max-width:100%;overflow-x:auto;overflow-y:auto}
.med-change-table{width:max-content;min-width:1280px;max-width:none}
.med-change-table th,.med-change-table td{white-space:nowrap;vertical-align:top}
.med-change-table .med-dose-cell{min-width:220px;max-width:320px;white-space:normal;line-height:1.45}
.med-change-badge{display:inline-flex;align-items:center;min-height:24px;padding:2px 8px;border-radius:999px;font-size:10px;font-weight:900;white-space:nowrap}
.med-change-badge.decrease{background:#dcfce7;color:#15803d}
.med-change-badge.increase{background:#fee2e2;color:#b91c1c}
.med-change-badge.switch{background:#ede9fe;color:#6d28d9}
.med-change-badge.stopped{background:#e2e8f0;color:#475569}
.med-change-badge.addon{background:#dbeafe;color:#1d4ed8}
.med-change-badge.changed{background:#fef3c7;color:#b45309}
.med-change-caution{margin-top:10px;padding:10px 12px;border-radius:9px;background:var(--surface-soft);border:1px solid var(--line);color:var(--muted);font-size:11px;line-height:1.5}
.med-trend.changed{background:#fef3c7;color:#b45309}
body.dark .med-change-badge.decrease{background:#123b2a;color:#86efac}
body.dark .med-change-badge.increase{background:#4a1d25;color:#fca5a5}
body.dark .med-change-badge.switch{background:#312e81;color:#c4b5fd}
body.dark .med-change-badge.stopped{background:#26384d;color:#cbd5e1}
body.dark .med-change-badge.addon{background:#123b66;color:#93c5fd}
body.dark .med-change-badge.changed,body.dark .med-trend.changed{background:#49330c;color:#fcd34d}
@media(max-width:1250px){.med-change-summary{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.med-change-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.patient-med-change-card{padding:10px}}

/* Annual NCD medication adjustment summary v2.27.0 */
.med-change-year-head{margin-top:16px;margin-bottom:8px}
.med-change-year-wrap{width:100%;max-width:100%;margin-bottom:12px;overflow-x:auto}
.med-change-year-table{min-width:760px}
.med-change-year-table th,.med-change-year-table td{text-align:center;white-space:nowrap}
.med-change-year-table th:first-child,.med-change-year-table td:first-child{text-align:left}

/* Compact medication adjustment summary v2.27.1 */
.compact-med-head{margin-bottom:8px}
.med-latest-year{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:10px 12px;margin-bottom:10px;border:1px solid var(--line);
  border-radius:10px;background:var(--surface-soft)
}
.med-latest-year span{font-size:12px;font-weight:800;color:var(--muted)}
.med-latest-year strong{font-size:14px;color:var(--text)}
.med-year-chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.med-year-chip{
  display:flex;align-items:center;gap:8px;max-width:100%;
  padding:7px 10px;border:1px solid var(--line);border-radius:999px;
  background:var(--surface)
}
.med-year-chip strong{font-size:11px;color:var(--text);white-space:nowrap}
.med-year-chip span{font-size:11px;color:var(--muted);white-space:normal}
.patient-med-change-card:has(.med-latest-year):not(:has(.med-change-table-wrap)){padding-bottom:10px}

/* Medication cohort dashboard v2.33.0 */
.medication-cohort-dashboard{
  min-width:0;
}
.medication-cohort-head{
  align-items:flex-end;
}
.medication-cohort-kpis{
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
}
.medication-cohort-kpi{
  position:relative;
  min-height:126px;
  overflow:hidden;
}
.medication-cohort-kpi::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:var(--line);
}
.medication-cohort-kpi.total::before{background:var(--teal)}
.medication-cohort-kpi.patients::before{background:var(--blue)}
.medication-cohort-kpi.existing::before{background:var(--green)}
.medication-cohort-kpi.new::before{background:var(--blue)}
.medication-cohort-kpi.lost::before{background:var(--red)}
.medication-cohort-kpi.existing{background:color-mix(in srgb,var(--green) 7%,var(--surface))}
.medication-cohort-kpi.new{background:color-mix(in srgb,var(--blue) 7%,var(--surface))}
.medication-cohort-kpi.lost{background:color-mix(in srgb,var(--red) 6%,var(--surface))}
.medication-cohort-kpi > span{
  font-size:12px;
  font-weight:800;
}
.medication-cohort-kpi > strong{
  margin:7px 0 5px;
  font-size:24px;
}
.med-kpi-foot{
  display:flex;
  flex-wrap:wrap;
  gap:4px 8px;
  align-items:center;
}
.med-kpi-foot small{
  color:var(--muted);
}
.med-kpi-money{
  font-size:12px!important;
  color:var(--text);
}
.med-kpi-delta{
  font-size:11px;
  font-weight:800;
}
.med-kpi-delta.up,
.med-cohort-delta.up{color:var(--red)}
.med-kpi-delta.down,
.med-cohort-delta.down{color:var(--green)}
.med-kpi-delta.same,
.med-cohort-delta.same{color:var(--muted)}

.medication-cohort-top-grid{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);
  gap:14px;
}
.medication-cohort-middle-grid{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(300px,.65fr);
  gap:14px;
}
.medication-cohort-top-grid .medication-cost-card,
.medication-cohort-middle-grid .medication-cost-card{
  min-width:0;
}
.medication-cohort-trend-card{
  overflow:hidden;
}
.medication-cohort-chart{
  display:block;
  min-height:280px;
  margin-top:4px;
}
.med-cohort-chart-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(90px,1fr));
  align-items:end;
  gap:18px;
  height:245px;
  padding:10px 18px 0;
  border-bottom:1px solid var(--line);
  background:
    linear-gradient(to bottom, transparent calc(25% - .5px), color-mix(in srgb,var(--line) 70%,transparent) 25%, transparent calc(25% + .5px)),
    linear-gradient(to bottom, transparent calc(50% - .5px), color-mix(in srgb,var(--line) 70%,transparent) 50%, transparent calc(50% + .5px)),
    linear-gradient(to bottom, transparent calc(75% - .5px), color-mix(in srgb,var(--line) 70%,transparent) 75%, transparent calc(75% + .5px));
}
.med-cohort-chart-column{
  min-width:0;
  height:100%;
  display:grid;
  grid-template-rows:24px minmax(0,1fr) 22px 18px;
  justify-items:center;
  align-items:end;
}
.med-cohort-total-label{
  align-self:start;
  color:var(--text);
  font-size:10px;
  font-weight:800;
  white-space:nowrap;
}
.med-cohort-bar-zone{
  width:70%;
  max-width:96px;
  height:100%;
  display:flex;
  align-items:flex-end;
}
.med-cohort-bar{
  width:100%;
  min-height:3px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  overflow:hidden;
  border-radius:9px 9px 3px 3px;
  box-shadow:0 4px 12px rgba(15,39,71,.08);
}
.med-cohort-bar-existing{
  display:block;
  width:100%;
  background:var(--green);
}
.med-cohort-bar-new{
  display:block;
  width:100%;
  background:var(--blue);
}
.med-cohort-chart-column > strong{
  align-self:center;
  font-size:12px;
}
.med-cohort-chart-column > small{
  align-self:start;
  color:var(--muted);
  font-size:10px;
}
.medication-cohort-legend{
  display:flex;
  justify-content:center;
  gap:22px;
  margin-top:10px;
  color:var(--muted);
  font-size:11px;
  font-weight:700;
}
.medication-cohort-legend span{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.medication-cohort-legend i,
.med-cohort-donut-legend i{
  width:11px;
  height:11px;
  border-radius:3px;
  flex:0 0 auto;
}
.medication-cohort-legend i.existing,
.med-cohort-donut-legend i.existing{background:var(--green)}
.medication-cohort-legend i.new,
.med-cohort-donut-legend i.new{background:var(--blue)}
.med-cohort-donut-legend i.lost{background:var(--red)}

.medication-cohort-change-table td:first-child strong{
  display:block;
}
.medication-cohort-change-table td:first-child small{
  display:block;
  margin-top:3px;
  color:var(--muted);
}
.med-change-component.existing td:first-child{border-left:3px solid var(--green)}
.med-change-component.new td:first-child{border-left:3px solid var(--blue)}
.med-change-component.med-change-lost{background:var(--surface)!important;color:var(--text)!important}
.med-change-component.med-change-lost td{background:var(--surface)!important;color:var(--text)!important}
.med-change-component.med-change-lost td:first-child{border-left:3px solid var(--red)}
.med-change-component.total{
  font-weight:800;
  background:color-mix(in srgb,var(--teal) 8%,var(--surface));
}
.med-cohort-delta{
  font-weight:800;
  white-space:nowrap;
}

.medication-year-compare-card{
  overflow:hidden;
}
.medication-year-compare-card .table-wrap{
  overflow-x:auto;
}
.medication-year-compare-table{
  min-width:1080px;
}
.medication-year-compare-table thead th{
  text-align:center;
}
.medication-year-compare-table .existing-head,
.medication-year-compare-table .med-existing-cell{
  background:color-mix(in srgb,var(--green) 7%,var(--surface));
}
.medication-year-compare-table .new-head,
.medication-year-compare-table .med-new-cell{
  background:color-mix(in srgb,var(--blue) 7%,var(--surface));
}
.medication-year-compare-table .lost-head,
.medication-year-compare-table .med-lost-cell{
  background:color-mix(in srgb,var(--red) 6%,var(--surface));
}

.med-cohort-donut-layout{
  display:grid;
  grid-template-columns:190px 1fr;
  gap:18px;
  align-items:center;
  padding:8px 4px 4px;
}
.med-cohort-donut{
  --existing-pct:50%;
  width:180px;
  aspect-ratio:1;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:conic-gradient(var(--green) 0 var(--existing-pct),var(--blue) var(--existing-pct) 100%);
}
.med-cohort-donut::before{
  content:"";
  grid-area:1/1;
  width:68%;
  aspect-ratio:1;
  border-radius:50%;
  background:var(--surface);
  box-shadow:inset 0 0 0 1px var(--line);
}
.med-cohort-donut-center{
  grid-area:1/1;
  z-index:1;
  display:grid;
  gap:2px;
  text-align:center;
}
.med-cohort-donut-center strong{
  font-size:13px;
}
.med-cohort-donut-center span{
  color:var(--muted);
  font-size:10px;
}
.med-cohort-donut-legend{
  display:grid;
  gap:12px;
}
.med-cohort-donut-legend > div{
  display:grid;
  grid-template-columns:12px minmax(0,1fr);
  gap:8px;
  align-items:start;
}
.med-cohort-donut-legend span{
  display:grid;
  gap:2px;
}
.med-cohort-donut-legend b{
  font-size:11px;
}
.med-cohort-donut-legend strong{
  font-size:11px;
  font-weight:800;
}
.med-cohort-donut-legend small{
  color:var(--muted);
  font-size:10px;
}
.med-cohort-donut-legend .lost-note{
  padding-top:10px;
  border-top:1px solid var(--line);
}

.medication-cohort-patient-card .patient-section-head{
  align-items:flex-end;
}
.medication-patient-filter-tabs{
  display:flex;
  gap:5px;
  padding:3px;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--surface-soft);
}
.medication-patient-filter-tabs button{
  min-height:30px;
  padding:0 12px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:var(--muted);
  font-size:10px;
  font-weight:800;
}
.medication-patient-filter-tabs button.active{
  background:var(--teal);
  color:#fff;
}
.medication-cohort-patient-wrap{
  max-height:390px;
  overflow:auto!important;
}
.medication-cohort-patient-table{
  min-width:1080px;
}
.medication-cohort-patient-table thead th{
  position:sticky;
  top:0;
  z-index:2;
  background:var(--surface-soft);
}
.med-cohort-chip{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:2px 8px;
  border-radius:999px;
  font-size:10px;
  font-weight:800;
  white-space:nowrap;
}
.med-cohort-chip.existing{
  color:var(--green);
  background:color-mix(in srgb,var(--green) 12%,var(--surface));
}
.med-cohort-chip.new{
  color:var(--blue);
  background:color-mix(in srgb,var(--blue) 12%,var(--surface));
}
.med-cohort-chip.lost{
  color:var(--red);
  background:color-mix(in srgb,var(--red) 10%,var(--surface));
}
.medication-cohort-secondary-grid{
  grid-template-columns:.8fr 1.2fr;
}

@media(max-width:1300px){
  .medication-cohort-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
  .medication-cohort-top-grid,
  .medication-cohort-middle-grid{grid-template-columns:1fr}
  .med-cohort-donut-layout{grid-template-columns:180px minmax(0,1fr)}
}
@media(max-width:900px){
  .medication-cohort-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .medication-cohort-secondary-grid{grid-template-columns:1fr}
  .medication-cohort-patient-card .patient-section-head{align-items:stretch;flex-direction:column}
  .medication-patient-filter-tabs{overflow-x:auto}
}
@media(max-width:650px){
  .medication-cohort-kpis{grid-template-columns:1fr}
  .med-cohort-chart-grid{gap:8px;padding-inline:6px}
  .med-cohort-bar-zone{width:82%}
  .med-cohort-donut-layout{grid-template-columns:1fr;justify-items:center}
  .med-cohort-donut-legend{width:100%}
}

/* Medication cohort overflow containment */
.medication-cohort-dashboard{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:hidden;
}
.medication-cohort-top-grid,
.medication-cohort-middle-grid,
.medication-cohort-secondary-grid,
.medication-cohort-patient-card,
.medication-year-compare-card,
.medication-cohort-change-card,
.medication-cohort-trend-card,
.medication-cohort-donut-card{
  min-width:0;
  max-width:100%;
}
.medication-cohort-dashboard .table-wrap{
  max-width:100%;
}

/* Medication analysis module v2.34.0 */
.medication-analysis-page{
  width:100%;
  min-width:0;
}
.med-analysis-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin-bottom:12px;
}
.med-analysis-head h2{
  margin:0;
  font-size:22px;
}
.med-analysis-head p{
  margin:4px 0 0;
  color:var(--muted);
  font-size:12px;
}
.med-analysis-filters{
  display:flex;
  align-items:flex-end;
  gap:10px;
  flex:0 0 auto;
}
.med-analysis-filters label{
  display:grid;
  gap:4px;
  color:var(--muted);
  font-size:10px;
  font-weight:700;
}
.med-analysis-filters select,
.med-analysis-filters input{
  min-height:36px;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--surface);
  color:var(--text);
  padding:0 10px;
  font:inherit;
}
.med-analysis-search input{
  width:250px;
}
.medication-analysis-kpis{
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
  margin-bottom:12px;
}
.med-analysis-kpi{
  position:relative;
  min-height:100px;
  overflow:hidden;
}
.med-analysis-kpi::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:var(--line);
}
.med-analysis-kpi.total::before{background:var(--teal)}
.med-analysis-kpi.patients::before{background:var(--blue)}
.med-analysis-kpi.existing::before{background:var(--green)}
.med-analysis-kpi.new::before{background:var(--blue)}
.med-analysis-kpi.cohort::before{background:#7c3aed}
.med-analysis-kpi span{
  color:var(--muted);
  font-size:11px;
  font-weight:800;
}
.med-analysis-kpi strong{
  display:block;
  margin:6px 0 4px;
  font-size:20px;
}
.med-analysis-kpi small{
  color:var(--muted);
  font-size:10px;
}
.med-analysis-tabs{
  display:flex;
  gap:4px;
  padding:4px;
  margin-bottom:10px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--surface-soft);
  overflow-x:auto;
  scrollbar-width:thin;
}
.med-analysis-tabs button{
  flex:1 1 0;
  min-width:110px;
  min-height:34px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
}
.med-analysis-tabs button.active{
  background:var(--teal);
  color:#fff;
  border-color:var(--teal);
}
.med-analysis-panel[hidden]{
  display:none!important;
}
.med-analysis-panel.active{
  display:block;
}
.med-analysis-overview-grid{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:12px;
}
.med-analysis-drug-grid{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:12px;
}
.med-analysis-card{
  min-width:0;
  margin-bottom:12px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface);
}
.med-analysis-card .table-wrap{
  max-width:100%;
  overflow-x:auto;
}
.med-analysis-year-chart{
  min-height:260px;
}
.med-analysis-bars{
  display:grid;
  grid-template-columns:repeat(4,minmax(80px,1fr));
  gap:16px;
  align-items:end;
  height:225px;
  padding:8px 14px 0;
  border-bottom:1px solid var(--line);
  background:
    linear-gradient(to bottom, transparent calc(25% - .5px), color-mix(in srgb,var(--line) 65%,transparent) 25%, transparent calc(25% + .5px)),
    linear-gradient(to bottom, transparent calc(50% - .5px), color-mix(in srgb,var(--line) 65%,transparent) 50%, transparent calc(50% + .5px)),
    linear-gradient(to bottom, transparent calc(75% - .5px), color-mix(in srgb,var(--line) 65%,transparent) 75%, transparent calc(75% + .5px));
}
.med-analysis-bar-col{
  height:100%;
  min-width:0;
  display:grid;
  grid-template-rows:22px minmax(0,1fr) 20px 18px;
  justify-items:center;
  align-items:end;
}
.med-analysis-bar-col>strong{
  align-self:start;
  font-size:10px;
  white-space:nowrap;
}
.med-analysis-bar-zone{
  width:70%;
  height:100%;
  display:flex;
  align-items:flex-end;
}
.med-analysis-bar{
  width:100%;
  min-height:3px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  overflow:hidden;
  border-radius:8px 8px 3px 3px;
}
.med-analysis-bar i{
  display:block;
  width:100%;
}
.med-analysis-bar i.existing{background:var(--green)}
.med-analysis-bar i.new{background:var(--blue)}
.med-analysis-bar-col>b{font-size:11px}
.med-analysis-bar-col>small{align-self:start;color:var(--muted);font-size:9px}
.med-analysis-legend{
  display:flex;
  justify-content:center;
  gap:18px;
  margin-top:9px;
  color:var(--muted);
  font-size:10px;
  font-weight:700;
}
.med-analysis-legend span{
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.med-analysis-legend i{
  width:10px;
  height:10px;
  border-radius:3px;
}
.med-analysis-legend i.existing{background:var(--green)}
.med-analysis-legend i.new{background:var(--blue)}
.med-analysis-change-table tr.existing td:first-child{border-left:3px solid var(--green)}
.med-analysis-change-table tr.new td:first-child{border-left:3px solid var(--blue)}
.med-analysis-change-table tr.lost td:first-child{border-left:3px solid var(--red)}
.med-analysis-year-table{
  min-width:1050px;
}
.med-analysis-matrix-wrap{
  position:relative;
  max-height:620px;
  overflow:auto!important;
  border:1px solid var(--line);
  border-radius:10px;
}
.med-analysis-patient-matrix{
  width:max-content;
  min-width:100%;
  border-collapse:separate;
  border-spacing:0;
}
.med-analysis-patient-matrix thead th{
  position:sticky;
  top:0;
  z-index:4;
  background:var(--surface-soft);
  white-space:nowrap;
}
.med-analysis-patient-matrix .med-matrix-sticky{
  position:sticky;
  z-index:3;
  background:var(--surface);
}
.med-analysis-patient-matrix thead .med-matrix-sticky{
  z-index:6;
  background:var(--surface-soft);
}
.med-analysis-patient-matrix .med-matrix-sticky.hn{
  left:0;
  min-width:78px;
  max-width:78px;
}
.med-analysis-patient-matrix .med-matrix-sticky.name{
  left:78px;
  min-width:190px;
  max-width:220px;
  box-shadow:5px 0 8px rgba(15,39,71,.04);
}
.med-analysis-patient-matrix td.med-matrix-sticky.name small{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:9px;
}
.med-matrix-year-head,
.med-matrix-year{
  min-width:165px;
  max-width:185px;
}
.med-matrix-year{
  vertical-align:top;
  white-space:normal!important;
}
.med-matrix-year strong{
  display:block;
  font-size:11px;
}
.med-matrix-year small{
  display:block;
  margin:3px 0 5px;
  color:var(--muted);
  font-size:9px;
}
.med-matrix-year.none,
.med-matrix-year.lost{
  text-align:center;
  vertical-align:middle;
  background:var(--surface-soft);
}
.med-analysis-cohort-kpis{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-bottom:12px;
}
.med-analysis-cohort-kpis .module-summary-card{
  min-height:88px;
}
.med-analysis-cohort-kpis span{
  color:var(--muted);
  font-size:10px;
  font-weight:700;
}
.med-analysis-cohort-kpis strong{
  display:block;
  margin:5px 0 3px;
  font-size:18px;
}
.med-analysis-cohort-kpis small{
  color:var(--muted);
}
.med-analysis-patient-row{
  cursor:pointer;
}
.med-analysis-patient-row:hover td{
  background:color-mix(in srgb,var(--blue) 5%,var(--surface));
}
.medication-dashboard-analysis-link{
  display:flex;
  justify-content:flex-end;
  margin:10px 0 2px;
}
.medication-dashboard-analysis-link button{
  min-height:36px;
  font-size:11px;
  font-weight:800;
}

@media(max-width:1300px){
  .medication-analysis-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
  .med-analysis-overview-grid,
  .med-analysis-drug-grid{grid-template-columns:1fr}
}
@media(max-width:900px){
  .med-analysis-head{align-items:stretch;flex-direction:column}
  .med-analysis-filters{width:100%;flex-wrap:wrap}
  .med-analysis-search{flex:1 1 220px}
  .med-analysis-search input{width:100%}
  .medication-analysis-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .med-analysis-cohort-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
  .medication-analysis-kpis,
  .med-analysis-cohort-kpis{grid-template-columns:1fr}
  .med-analysis-bars{gap:7px;padding-inline:4px}
}

/* Medication analysis width containment */
#medication-analysis,
#medication-analysis .medication-analysis-page,
#medication-analysis .med-analysis-panel,
#medication-analysis .med-analysis-card,
#medication-analysis .med-analysis-overview-grid,
#medication-analysis .med-analysis-drug-grid{
  width:100%;
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}
#medication-analysis .med-analysis-card{
  overflow:hidden;
}
#medication-analysis .table-wrap,
#medication-analysis .med-analysis-matrix-wrap{
  display:block;
  width:100%;
  min-width:0;
  max-width:100%;
  overflow-x:auto!important;
  box-sizing:border-box;
}

/* Force wide medication matrices to scroll inside their card */
#medication-analysis .med-analysis-panel{
  overflow:hidden;
}
#medication-analysis .med-analysis-matrix-wrap{
  width:0!important;
  min-width:100%!important;
  max-width:100%!important;
  overflow:auto!important;
  contain:inline-size;
}
#medication-analysis .med-analysis-patient-matrix{
  max-width:none;
}

/* NCD Remission module v2.35.0 */
.remission-page{
  width:100%;
  min-width:0;
}
.remission-topbar{
  display:flex;
  align-items:stretch;
  gap:10px;
  width:100%;
  min-width:0;
  margin-bottom:8px;
}
#ncd-remission.active .remission-topbar{
  flex:0 0 auto!important;
}
.remission-topbar .remission-tabs{
  flex:1 1 auto!important;
  min-width:0;
  margin-bottom:0!important;
}
.remission-fiscal-filter{
  flex:0 0 152px;
  display:grid;
  grid-template-rows:auto 1fr;
  gap:3px;
  padding:4px 8px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--surface-soft);
}
.remission-fiscal-filter>span{
  color:var(--muted);
  font-size:9px;
  font-weight:800;
  line-height:1.1;
}
.remission-fiscal-filter select{
  width:100%;
  min-width:0;
  height:29px;
  padding:0 8px;
  border:1px solid var(--line);
  border-radius:7px;
  background:var(--surface);
  color:var(--text);
  font-size:11px;
  font-weight:800;
}
@media(max-width:900px){
  .remission-topbar{flex-direction:column}
  .remission-fiscal-filter{flex:0 0 auto;width:180px;align-self:flex-end}
}
.remission-page-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin-bottom:12px;
}
.remission-page-head h2{
  margin:0;
  font-size:22px;
}
.remission-page-head p{
  margin:4px 0 0;
  color:var(--muted);
  font-size:12px;
}
.remission-source-status{
  display:flex;
  align-items:center;
  gap:9px;
  padding:8px 10px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--surface-soft);
}
.remission-source-status>div{
  display:grid;
  gap:2px;
}
.remission-source-status strong{font-size:11px}
.remission-source-status small{color:var(--muted);font-size:9px}
.remission-source-dot{
  width:10px;height:10px;border-radius:50%;background:var(--yellow);flex:0 0 auto;
  box-shadow:0 0 0 4px color-mix(in srgb,var(--yellow) 12%,transparent);
}
.remission-kpis{
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
  margin-bottom:12px;
}
.remission-kpi{
  position:relative;
  min-height:98px;
  overflow:hidden;
}
.remission-kpi::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:var(--line);
}
.remission-kpi.base::before{background:var(--blue)}
.remission-kpi.candidate::before{background:var(--green)}
.remission-kpi.hba::before{background:var(--teal)}
.remission-kpi.review::before{background:var(--red)}
.remission-kpi.source::before{background:var(--yellow)}
.remission-kpi span{font-size:10px;color:var(--muted);font-weight:800}
.remission-kpi strong{display:block;margin:5px 0 3px;font-size:20px}
.remission-kpi small{color:var(--muted);font-size:9px;line-height:1.4}

.remission-tabs{
  display:flex;
  gap:4px;
  padding:4px;
  margin-bottom:10px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--surface-soft);
  overflow-x:auto;
  scrollbar-width:thin;
}
.remission-tabs button{
  flex:1 1 0;
  min-width:112px;
  min-height:34px;
  padding:0 9px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:var(--muted);
  font-size:10px;
  font-weight:800;
  white-space:nowrap;
}
.remission-tabs button.active{
  color:#fff;
  background:var(--teal);
  border-color:var(--teal);
}
.remission-panel[hidden]{display:none!important}
.remission-panel.active{display:block}
.remission-overview-grid{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:12px;
}
.remission-card{
  min-width:0;
  margin-bottom:12px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface);
}
.remission-card .table-wrap{
  width:100%;
  max-width:100%;
  overflow-x:auto;
}
.remission-criteria-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.remission-criterion{
  display:flex;
  align-items:flex-start;
  gap:9px;
  min-width:0;
  padding:9px;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--surface-soft);
}
.remission-criterion-icon{
  width:30px;height:30px;border-radius:8px;
  display:grid;place-items:center;
  flex:0 0 auto;
  font-size:10px;font-weight:900;
}
.remission-criterion-icon.auto{background:color-mix(in srgb,var(--green) 14%,var(--surface));color:var(--green)}
.remission-criterion-icon.manual{background:color-mix(in srgb,var(--yellow) 16%,var(--surface));color:#9a6700}
.remission-criterion-icon.confirm{background:color-mix(in srgb,var(--blue) 13%,var(--surface));color:var(--blue)}
.remission-criterion div{display:grid;gap:3px;min-width:0}
.remission-criterion strong{font-size:10px;line-height:1.4}
.remission-criterion small{color:var(--muted);font-size:9px}
.remission-readiness-list{
  display:grid;
  gap:9px;
}
.remission-readiness-list>div{
  padding:11px;
  border:1px solid var(--line);
  border-radius:9px;
  display:grid;
  gap:5px;
}
.remission-readiness-list .ready{border-left:4px solid var(--green)}
.remission-readiness-list .pending{border-left:4px solid var(--yellow)}
.remission-readiness-list b{font-size:11px}
.remission-readiness-list span{color:var(--muted);font-size:10px;line-height:1.5}
.remission-awaiting-source{
  margin:0 0 12px;
  padding:12px 14px;
  border:1px dashed var(--line-strong);
  border-radius:10px;
  background:var(--surface-soft);
}
.remission-awaiting-source strong{display:block;font-size:12px}
.remission-awaiting-source p{margin:4px 0 0;color:var(--muted);font-size:10px;line-height:1.5}
.remission-screening-note{
  margin-bottom:10px;
  padding:9px 11px;
  border-left:4px solid var(--yellow);
  border-radius:8px;
  background:color-mix(in srgb,var(--yellow) 8%,var(--surface));
  color:var(--text);
  font-size:10px;
  line-height:1.5;
}
.remission-search{
  width:250px;
  min-height:34px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--surface);
  color:var(--text);
  padding:0 10px;
  font:inherit;
}
.remission-screening-wrap{
  max-height:560px;
  overflow:auto!important;
}
.remission-screening-table{
  min-width:1100px;
}
.remission-screening-table thead th{
  position:sticky;
  top:0;
  z-index:2;
  background:var(--surface-soft);
}
.remission-assessment{
  display:inline-flex;
  min-height:22px;
  align-items:center;
  padding:2px 8px;
  border-radius:999px;
  font-size:9px;
  font-weight:900;
  white-space:nowrap;
}
.remission-assessment.good{color:var(--green);background:color-mix(in srgb,var(--green) 12%,var(--surface))}
.remission-assessment.watch{color:#9a6700;background:color-mix(in srgb,var(--yellow) 15%,var(--surface))}
.remission-assessment.danger{color:var(--red);background:color-mix(in srgb,var(--red) 10%,var(--surface))}
.remission-assessment.none{color:var(--muted);background:var(--surface-soft)}
.remission-confirm-cell{
  min-width:280px;
  max-width:360px;
  white-space:normal!important;
  color:var(--muted);
  font-size:9px!important;
  line-height:1.5;
}
.remission-result-kpis{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-bottom:12px;
}
.remission-result-kpis .module-summary-card{min-height:88px}
.remission-result-kpis span{font-size:10px;color:var(--muted);font-weight:700}
.remission-result-kpis strong{display:block;margin:5px 0 3px;font-size:18px}
.remission-result-kpis small{color:var(--muted);font-size:9px}

@media(max-width:1300px){
  .remission-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
  .remission-overview-grid{grid-template-columns:1fr}
}
@media(max-width:900px){
  .remission-page-head{align-items:stretch;flex-direction:column}
  .remission-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .remission-result-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .remission-criteria-grid{grid-template-columns:1fr}
  .remission-card .patient-section-head{align-items:stretch;flex-direction:column}
  .remission-search{width:100%}
}
@media(max-width:600px){
  .remission-kpis,.remission-result-kpis{grid-template-columns:1fr}
}

/* Patient Profile: DM Remission */
.patient-remission-panel{min-width:0}
.patient-remission-head{margin-bottom:12px}
.patient-remission-status-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px}
.patient-remission-status-row>div,.patient-remission-metrics>div,.patient-remission-timeline-card{background:var(--surface,#fff);border:1px solid var(--line,#dbe7f0);border-radius:14px}
.patient-remission-status-row>div{padding:14px;min-width:0}
.patient-remission-status-row span,.patient-remission-metrics span{display:block;color:var(--muted,#667085);font-size:12px;font-weight:700;margin-bottom:6px}
.patient-remission-status-row strong{display:block;font-size:17px;line-height:1.35}
.patient-remission-status-row small{display:block;margin-top:5px;color:var(--muted,#667085);font-size:11px}
.patient-remission-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:12px}
.patient-remission-metrics>div{padding:12px 14px}.patient-remission-metrics b{font-size:16px}
.patient-remission-timeline-card{padding:14px;margin-bottom:12px}.patient-remission-timeline{display:grid;gap:8px}
.patient-remission-timeline-item{display:grid;grid-template-columns:120px minmax(0,1fr);gap:12px;align-items:start;padding:10px 0;border-bottom:1px solid var(--line,#dbe7f0)}
.patient-remission-timeline-item:last-child{border-bottom:0}.patient-remission-timeline-item time{font-weight:700;color:var(--muted,#667085)}
.patient-remission-timeline-item strong,.patient-remission-timeline-item span{display:block}.patient-remission-timeline-item span{margin-top:3px;color:var(--muted,#667085);font-size:12px}
.patient-remission-note{border:1px solid var(--line,#dbe7f0);border-radius:12px;padding:12px 14px;background:var(--surface,#fff);line-height:1.6}
@media(max-width:1100px){.patient-remission-status-row{grid-template-columns:repeat(2,minmax(0,1fr))}.patient-remission-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.patient-remission-status-row,.patient-remission-metrics{grid-template-columns:1fr}.patient-remission-timeline-item{grid-template-columns:1fr;gap:4px}}


/* Remission registry — align with NCD registry table layout */
.remission-registry-v2{padding:0;background:transparent;border:0;box-shadow:none}
.remission-registry-filter-bar{grid-template-columns:minmax(300px,1.35fr) minmax(210px,.9fr) minmax(200px,.85fr) auto;margin-bottom:12px}
.remission-registry-table-v2{min-width:1120px}
.remission-registry-table-v2 td:nth-child(1),.remission-registry-table-v2 th:nth-child(1){width:76px}
.remission-registry-table-v2 td:nth-child(2),.remission-registry-table-v2 th:nth-child(2){min-width:190px}
.remission-registry-table-v2 td:nth-child(3),.remission-registry-table-v2 th:nth-child(3){width:70px;text-align:center}
.remission-registry-table-v2 td:nth-child(4),.remission-registry-table-v2 th:nth-child(4){width:70px;text-align:center}
.remission-registry-table-v2 td:nth-child(5),.remission-registry-table-v2 th:nth-child(5){width:80px}
.remission-registry-table-v2 td:nth-child(6),.remission-registry-table-v2 th:nth-child(6){min-width:190px}
.remission-registry-table-v2 td:nth-child(7),.remission-registry-table-v2 th:nth-child(7){min-width:145px}
.remission-registry-table-v2 td:nth-child(8),.remission-registry-table-v2 th:nth-child(8){min-width:190px}
.remission-registry-table-v2 td:nth-child(9),.remission-registry-table-v2 th:nth-child(9){width:100px;text-align:center}
@media(max-width:1100px){.remission-registry-filter-bar{grid-template-columns:minmax(240px,1fr) repeat(2,minmax(170px,1fr));}.remission-registry-filter-bar .registry-export-button-v2{grid-column:1/-1;justify-self:end}}
@media(max-width:760px){.remission-registry-filter-bar{grid-template-columns:1fr}.remission-registry-filter-bar .registry-export-button-v2{grid-column:auto;width:100%}}


/* NCD Remission list layout — registry standard */
#ncd-remission .remission-registry-v2,
#ncd-remission .remission-list-v2{
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
  gap:6px;
}
#ncd-remission .remission-registry-v2 .registry-page-head-v2,
#ncd-remission .remission-list-v2 .registry-page-head-v2{
  margin:0;
  padding:0 2px;
}
#ncd-remission .remission-registry-v2 .registry-page-head-v2 h2,
#ncd-remission .remission-list-v2 .registry-page-head-v2 h2{
  margin:0;
  font-size:24px;
  line-height:1.15;
}
#ncd-remission .remission-registry-filter-bar,
#ncd-remission .remission-list-filter-bar{
  margin:0 0 6px;
  padding:8px 12px;
  gap:8px;
  box-shadow:none;
}
#ncd-remission .remission-list-filter-bar{
  grid-template-columns:minmax(320px,1fr);
}
#ncd-remission .remission-registry-filter-bar input,
#ncd-remission .remission-registry-filter-bar select,
#ncd-remission .remission-registry-filter-bar .registry-export-button-v2,
#ncd-remission .remission-list-filter-bar input,
#ncd-remission .remission-list-filter-bar select{
  min-height:36px;
}
#ncd-remission .remission-list-v2 .remission-screening-note{
  margin:0 0 6px;
  padding:7px 10px;
}
#ncd-remission .remission-panel.active > .remission-registry-v2,
#ncd-remission .remission-panel.active > .remission-list-v2{
  min-height:0;
}
#ncd-remission .remission-registry-v2 .registry-table-card-v2,
#ncd-remission .remission-list-v2 .registry-table-card-v2{
  min-height:0;
  display:flex;
  flex-direction:column;
}
#ncd-remission .remission-registry-v2 .registry-table-wrap-v2,
#ncd-remission .remission-list-v2 .registry-table-wrap-v2{
  max-height:calc(100dvh - var(--fixed-header-height) - var(--fixed-footer-height) - 245px);
  min-height:320px;
  overflow:auto;
}
#ncd-remission .remission-list-table-v2{
  min-width:1080px;
}
#ncd-remission .remission-list-table-v2 thead th{
  position:sticky;
  top:0;
  z-index:3;
}
#ncd-remission .remission-list-table-v2 thead th,
#ncd-remission .remission-list-table-v2 tbody td,
#ncd-remission .remission-registry-table-v2 thead th,
#ncd-remission .remission-registry-table-v2 tbody td{
  padding-top:7px;
  padding-bottom:7px;
}
#ncd-remission .remission-list-v2 .registry-table-footer-v2{
  min-height:38px;
  padding:4px 10px;
}
#ncd-remission .remission-list-v2 .registry-result-v2{
  padding:3px 2px;
}
#ncd-remission .remission-tabs{
  margin-bottom:8px;
}
#ncd-remission .remission-panel.active:not([data-remission-panel="overview"]):not([data-remission-panel="kpi"]){
  min-height:0;
}
@media (min-width:1100px) and (min-height:650px){
  #ncd-remission.active{
    height:calc(100dvh - var(--fixed-header-height) - var(--fixed-footer-height) - 16px);
    min-height:0;
  }
  #ncd-remission.active > .remission-page{
    height:100%;
    min-height:0;
    display:flex;
    flex-direction:column;
  }
  #ncd-remission.active .remission-tabs{flex-shrink:0}
  #ncd-remission.active .remission-panel.active:not([data-remission-panel="overview"]):not([data-remission-panel="kpi"]){
    flex:1 1 auto;
    min-height:0;
  }
  #ncd-remission.active .remission-panel.active > .remission-registry-v2,
  #ncd-remission.active .remission-panel.active > .remission-list-v2{
    height:100%;
    min-height:0;
    display:flex;
    flex-direction:column;
  }
  #ncd-remission.active .remission-registry-v2 .registry-table-card-v2,
  #ncd-remission.active .remission-list-v2 .registry-table-card-v2{
    flex:1 1 auto;
    min-height:0;
  }
  #ncd-remission.active .remission-registry-v2 .registry-table-wrap-v2,
  #ncd-remission.active .remission-list-v2 .registry-table-wrap-v2{
    flex:1 1 auto;
    min-height:0;
    max-height:none;
  }
}
@media(max-width:760px){
  #ncd-remission .remission-list-filter-bar{grid-template-columns:1fr}
  #ncd-remission .remission-registry-v2 .registry-table-wrap-v2,
  #ncd-remission .remission-list-v2 .registry-table-wrap-v2{min-height:260px}
}

/* Page titles: subtitle text is intentionally omitted across the system */
.medication-cohort-head > div,
.med-analysis-head > div,
.screening-page-head > div,
.patient-med-title,
.patient-remission-head > div,
.remission-page-head > div,
.registry-page-head-v2 > div{
  min-width:0;
}


/* Patient names in data tables: plain NCD-registry style, never button pills */
.patient-name-link{
  appearance:none !important;
  -webkit-appearance:none !important;
  display:inline !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:inherit !important;
  font:inherit !important;
  font-weight:800 !important;
  line-height:inherit !important;
  text-align:left !important;
  text-decoration:none !important;
  cursor:pointer;
}
.patient-name-link:hover,
.patient-name-link:focus{
  background:transparent !important;
  box-shadow:none !important;
  color:var(--blue) !important;
  text-decoration:underline !important;
  text-underline-offset:2px;
  outline:none;
}

/* Defensive rule: legacy table links must remain links, not filled theme buttons */
button.table-number-link,
.table-number-link{
  appearance:none !important;
  -webkit-appearance:none !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}


/* NCD Drug Utilization & Cost Analysis v2.40.3 */
.med-analysis-period-note{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  margin:0 0 12px;padding:10px 12px;border:1px solid #cfe4f6;border-radius:11px;
  background:linear-gradient(135deg,#f7fbff,#f2fbfa);color:var(--text);font-size:11px;
}
.med-analysis-period-note>div{display:grid;gap:2px}
.med-analysis-period-note>div:last-child{text-align:right}
.med-analysis-period-note strong{color:#1559bd;font-size:12px}
.med-analysis-period-note span,.med-analysis-period-note small{color:var(--muted)}
.medication-analysis-kpis{grid-template-columns:repeat(6,minmax(0,1fr))}
.med-analysis-kpi{cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}
.med-analysis-kpi:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(15,39,71,.08)}
.med-analysis-kpi.recorded::before{background:#7c3aed}
.med-analysis-kpi.units::before{background:#0ea5e9}
.med-analysis-kpi.average::before{background:#14b8a6}
.med-analysis-kpi.changes::before{background:#f59e0b}
.med-analysis-year-button{appearance:none;border:0;background:transparent;color:inherit;font:inherit;padding:0;cursor:pointer}
.med-analysis-bar.single{background:linear-gradient(180deg,#4d9af7,#246fdc)}
.med-analysis-bar-col em{font-style:normal;font-size:8px;color:#0d9488}
.med-analysis-legend i.current-value{background:#2f80ed}
.med-analysis-legend i.previous-value{background:#94a3b8}
.med-analysis-month-chart{min-height:260px;overflow-x:auto}
.med-month-bars{height:220px;display:flex;align-items:flex-end;gap:10px;min-width:100%;padding:8px 10px 0;border-bottom:1px solid var(--line)}
.med-month-col{height:100%;min-width:62px;flex:1;display:grid;grid-template-rows:30px minmax(0,1fr) 22px;align-items:end;text-align:center}
.med-month-values{display:flex;justify-content:center;gap:5px;font-size:8px;color:var(--muted)}
.med-month-values span:first-child{color:#1559bd;font-weight:700}
.med-month-zone{height:100%;display:flex;align-items:flex-end;justify-content:center;gap:5px}
.med-month-zone i{width:16px;min-height:2px;border-radius:5px 5px 1px 1px}
.med-month-zone i.current{background:linear-gradient(180deg,#60a5fa,#2563eb)}
.med-month-zone i.previous{background:#94a3b8}
.med-month-col>b{font-size:10px;padding-top:4px}
.med-analysis-effect-total{display:flex;align-items:baseline;gap:12px;margin-bottom:12px;padding:10px 12px;border-radius:10px;background:var(--surface-soft)}
.med-analysis-effect-total span{font-size:11px;color:var(--muted);font-weight:700}
.med-analysis-effect-total strong{font-size:20px}
.med-analysis-effect-total small{font-size:10px;color:var(--muted)}
.med-analysis-effects{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.med-analysis-effects article{min-height:88px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.med-analysis-effects article.quantity{border-top:3px solid #2563eb}
.med-analysis-effects article.price{border-top:3px solid #7c3aed}
.med-analysis-effects article.regimen{border-top:3px solid #14b8a6}
.med-analysis-effects article.residual{border-top:3px solid #94a3b8}
.med-analysis-effects span{display:block;color:var(--muted);font-size:10px;font-weight:700}
.med-analysis-effects strong{display:block;margin:5px 0 3px;font-size:16px}
.med-analysis-effects small{display:block;color:var(--muted);font-size:9px;line-height:1.35}
.med-analysis-effects .up,.med-analysis-effect-total .up{color:#c2410c}
.med-analysis-effects .down,.med-analysis-effect-total .down{color:#15803d}
.med-analysis-method-note{margin:10px 0 0;color:var(--muted);font-size:9px}
.med-period-chip{display:inline-flex;align-items:center;padding:2px 7px;border-radius:999px;font-size:9px;font-weight:800}
.med-period-chip.ytd{background:#e0f2fe;color:#0369a1}
.med-period-chip.full_year{background:#ecfdf5;color:#047857}
.med-analysis-change-kpis{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:12px}
.med-change-kpi{min-height:82px}
.med-change-kpi span{color:var(--muted);font-size:10px;font-weight:700}
.med-change-kpi strong{display:block;margin-top:6px;font-size:19px}
.med-change-kpi.increase{border-top:3px solid #f97316}
.med-change-kpi.decrease{border-top:3px solid #16a34a}
.med-change-kpi.changed{border-top:3px solid #2563eb}
.med-change-kpi.pending{border-top:3px solid #f59e0b}
.med-change-kpi.price{border-top:3px solid #7c3aed}
.med-analysis-drug-row{cursor:pointer}
.med-analysis-drug-row:hover td{background:color-mix(in srgb,var(--blue) 5%,var(--surface))}
.med-analysis-rcc{margin:12px 0 8px;padding:11px 13px;border:1px dashed #c4b5fd;border-radius:10px;background:#faf8ff;color:#6d5a8b;font-size:10px}
.med-analysis-rcc strong{color:#6d28d9}
.medication-cost-rule code{padding:1px 4px;border-radius:4px;background:var(--surface-soft);color:#1559bd}
.patient-med-outcome-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0}
.patient-med-outcome-strip article{padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--surface-soft)}
.patient-med-outcome-strip span{display:block;color:var(--muted);font-size:9px}
.patient-med-outcome-strip strong{display:block;margin-top:3px;font-size:16px}
.patient-med-outcome-note{grid-column:1/-1;color:var(--muted);font-size:9px}
.patient-med-year-matrix{min-width:800px}
.patient-med-year-matrix th:first-child{position:sticky;left:0;background:var(--surface-soft);z-index:2;min-width:170px}
.patient-med-year-matrix td:first-child{position:sticky;left:0;background:var(--surface);z-index:1;font-weight:700}
.patient-med-month-chart{height:190px;display:flex;align-items:flex-end;gap:5px;padding:10px 6px 24px;border-bottom:1px solid var(--line);overflow-x:auto}
.patient-med-month-col{position:relative;min-width:24px;flex:1;height:100%;display:flex;align-items:flex-end}
.patient-med-month-col i{width:100%;min-height:1px;border-radius:4px 4px 1px 1px;background:linear-gradient(180deg,#60a5fa,#2563eb)}
.patient-med-month-col span{position:absolute;top:100%;left:50%;transform:translateX(-50%);font-size:7px;color:var(--muted);white-space:nowrap;margin-top:4px}
.patient-med-month-col.zero i{background:#e2e8f0;height:2px!important}
.med-price-missing{color:#b45309;font-weight:700}
@media(max-width:1180px){
  .medication-analysis-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
  .med-analysis-effects{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:820px){
  .med-analysis-overview-grid,.med-analysis-drug-grid{grid-template-columns:1fr}
  .med-analysis-period-note{align-items:flex-start;flex-direction:column}
  .med-analysis-period-note>div:last-child{text-align:left}
  .med-analysis-change-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px){
  .medication-analysis-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .med-analysis-effects{grid-template-columns:1fr}
  .patient-med-outcome-strip{grid-template-columns:1fr}
}


.med-analysis-data-quality{
  margin:-4px 0 12px;
  padding:9px 12px;
  border:1px solid #f6d28b;
  border-radius:10px;
  background:#fffaf0;
  color:#875b00;
  font-size:11px;
}
.med-analysis-data-quality[hidden]{display:none}
.med-analysis-disease-row{cursor:pointer}
.med-analysis-disease-row:hover td{background:#f3f9ff}


/* Interactive change cards v2.40.2 */
.med-change-kpi{
  appearance:none;
  width:100%;
  text-align:left;
  cursor:pointer;
  color:inherit;
  font:inherit;
  transition:border-color .15s ease,background .15s ease,box-shadow .15s ease,transform .15s ease;
}
.med-change-kpi:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(15,39,71,.08)}
.med-change-kpi:focus-visible{outline:3px solid color-mix(in srgb,var(--blue) 24%,transparent);outline-offset:2px}
.med-change-kpi.active{background:#f5faff;box-shadow:0 0 0 2px #2f80ed inset,0 7px 18px rgba(47,128,237,.10)}
.med-change-kpi.increase.active{background:#fff7ed;box-shadow:0 0 0 2px #f97316 inset,0 7px 18px rgba(249,115,22,.10)}
.med-change-kpi.decrease.active{background:#f0fdf4;box-shadow:0 0 0 2px #16a34a inset,0 7px 18px rgba(22,163,74,.10)}
.med-change-kpi.changed.active{background:#eff6ff;box-shadow:0 0 0 2px #2563eb inset,0 7px 18px rgba(37,99,235,.10)}
.med-change-kpi.pending.active{background:#fffbeb;box-shadow:0 0 0 2px #f59e0b inset,0 7px 18px rgba(245,158,11,.10)}
.med-change-kpi.price.active{background:#faf5ff;box-shadow:0 0 0 2px #7c3aed inset,0 7px 18px rgba(124,58,237,.10)}
.med-analysis-change-table[data-change-filter="increase"] :is(th,td):nth-child(3){background:#fff7ed}
.med-analysis-change-table[data-change-filter="decrease"] :is(th,td):nth-child(4){background:#f0fdf4}
.med-analysis-change-table[data-change-filter="regimen"] :is(th,td):nth-child(5){background:#eff6ff}
.med-analysis-change-table[data-change-filter="pending"] :is(th,td):nth-child(6){background:#fffbeb}
.med-analysis-change-table[data-change-filter="price"] :is(th,td):nth-child(7){background:#faf5ff}
.med-analysis-change-table tbody tr:hover td{background-color:#f7fbff}
.med-analysis-change-table[data-change-filter="increase"] tbody tr:hover td:nth-child(3){background:#ffedd5}
.med-analysis-change-table[data-change-filter="decrease"] tbody tr:hover td:nth-child(4){background:#dcfce7}
.med-analysis-change-table[data-change-filter="regimen"] tbody tr:hover td:nth-child(5){background:#dbeafe}
.med-analysis-change-table[data-change-filter="pending"] tbody tr:hover td:nth-child(6){background:#fef3c7}
.med-analysis-change-table[data-change-filter="price"] tbody tr:hover td:nth-child(7){background:#f3e8ff}


/* Medication dashboard information tab list v2.40.3 */
.medication-cost-info-tabs-wrap{
  width:100%;
  min-width:0;
  margin-bottom:14px;
}
.medication-cost-info-tabs{
  display:flex;
  align-items:center;
  gap:6px;
  margin:0 0 10px;
  padding:5px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface-soft);
}
.medication-cost-info-tabs button{
  appearance:none;
  border:0;
  border-radius:9px;
  min-height:38px;
  padding:7px 16px;
  background:transparent;
  color:var(--muted);
  font:inherit;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
  transition:background .15s ease,color .15s ease,box-shadow .15s ease;
}
.medication-cost-info-tabs button:hover{
  color:var(--text);
  background:color-mix(in srgb,var(--blue) 7%,transparent);
}
.medication-cost-info-tabs button.active{
  color:#fff;
  background:linear-gradient(135deg,#2563eb,#14b8a6);
  box-shadow:0 4px 12px rgba(37,99,235,.16);
}
.medication-cost-info-tabs button:focus-visible{
  outline:3px solid color-mix(in srgb,var(--blue) 24%,transparent);
  outline-offset:2px;
}
.medication-cost-info-panel{
  width:100%;
  min-width:0;
  max-width:100%;
}
.medication-cost-info-panel[hidden]{display:none!important}
.medication-cost-info-panel.active{display:block}
.medication-cost-info-panel .table-wrap{
  width:100%;
  max-width:100%;
}
.medication-cost-info-panel .medication-cohort-change-table{
  min-width:0;
  width:100%;
  table-layout:fixed;
}
.medication-cost-info-panel .medication-cohort-change-table th:first-child,
.medication-cost-info-panel .medication-cohort-change-table td:first-child{
  width:34%;
}
.medication-cost-info-panel .medication-cohort-change-table th:not(:first-child),
.medication-cost-info-panel .medication-cohort-change-table td:not(:first-child){
  width:22%;
}
@media(max-width:620px){
  .medication-cost-info-tabs{overflow-x:auto;scrollbar-width:none}
  .medication-cost-info-tabs::-webkit-scrollbar{display:none}
  .medication-cost-info-tabs button{white-space:nowrap;flex:1 0 auto}
  .medication-cost-info-panel .medication-cohort-change-table{min-width:680px;table-layout:auto}
}

/* Medication dashboard full tablist v2.40.4 */
.medication-cost-info-tabs-wrap{width:100%;min-width:0;margin-bottom:14px}
.medication-cost-info-tabs{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:6px;
  width:100%;
  overflow-x:auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
  scroll-behavior:smooth;
}
.medication-cost-info-tabs::-webkit-scrollbar{display:none}
.medication-cost-info-tabs button{
  flex:1 0 148px;
  min-width:148px;
  white-space:nowrap;
}
.medication-cost-info-panel{
  width:100%;
  min-width:0;
  max-width:100%;
}
.medication-cost-info-panel>.patient-section-head{margin-bottom:10px}
.medication-cost-info-panel .table-wrap{width:100%;max-width:100%}
.medication-cost-rule-panel{min-height:160px}
.medication-cost-rule-panel .medication-cost-rule{margin-top:0}
@media(max-width:900px){
  .medication-cost-info-tabs button{flex:0 0 auto;min-width:140px}
}

/* Medication change KPI — soft blue medical clean v2.40.5 */
.med-analysis-change-kpis .med-change-kpi{
  background:linear-gradient(180deg,#f8fbff 0%,#eef7ff 100%) !important;
  border:1px solid #cfe5fb !important;
  border-top:3px solid #38bdf8 !important;
  color:#123a63 !important;
  box-shadow:0 3px 10px rgba(37,99,235,.06) !important;
}
.med-analysis-change-kpis .med-change-kpi span{
  color:#5f7f9f !important;
}
.med-analysis-change-kpis .med-change-kpi strong{
  color:#0f3d6d !important;
}
.med-analysis-change-kpis .med-change-kpi:hover{
  background:linear-gradient(180deg,#f4faff 0%,#e6f3ff 100%) !important;
  border-color:#9fd4f8 !important;
  box-shadow:0 7px 16px rgba(37,99,235,.10) !important;
}
.med-analysis-change-kpis .med-change-kpi.active,
.med-analysis-change-kpis .med-change-kpi.increase.active,
.med-analysis-change-kpis .med-change-kpi.decrease.active,
.med-analysis-change-kpis .med-change-kpi.changed.active,
.med-analysis-change-kpis .med-change-kpi.pending.active,
.med-analysis-change-kpis .med-change-kpi.price.active{
  background:linear-gradient(180deg,#eaf5ff 0%,#ddecff 100%) !important;
  border-color:#60a5fa !important;
  border-top-color:#2563eb !important;
  box-shadow:0 0 0 2px rgba(37,99,235,.16) inset,0 7px 16px rgba(37,99,235,.10) !important;
}
.med-analysis-change-kpis .med-change-kpi.active span{
  color:#3f6f9f !important;
}
.med-analysis-change-kpis .med-change-kpi.active strong{
  color:#0b4f96 !important;
}

/* Medication cost performance: paginate large patient tables */
.med-table-pager{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  margin-top:8px;
  border:1px solid #d8e8f5;
  border-radius:10px;
  background:#f8fbff;
  color:#496782;
  font-size:14px;
}
.med-table-pager[hidden]{display:none !important;}
.med-table-pager > div{display:flex;align-items:center;gap:8px;}
.med-table-pager strong{color:#164e7a;font-weight:600;}
.med-table-pager button{
  min-height:34px;
  padding:6px 12px;
  border:1px solid #bdd8eb;
  border-radius:8px;
  background:#fff;
  color:#155b8c;
  cursor:pointer;
  font:inherit;
}
.med-table-pager button:hover:not(:disabled){background:#edf7ff;border-color:#83bfe7;}
.med-table-pager button:disabled{opacity:.45;cursor:not-allowed;}
@media (max-width:720px){
  .med-table-pager{align-items:stretch;flex-direction:column;}
  .med-table-pager > div{justify-content:space-between;}
}


/* Medication value trend: separate total / existing / new charts */
.medication-trend-chart-layout{
  display:grid;
  gap:14px;
  margin-top:12px;
}
.medication-trend-chart-split{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.medication-trend-chart-card{
  min-width:0;
  padding:14px 16px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--surface-soft);
}
.medication-trend-chart-card.total{
  background:color-mix(in srgb,var(--teal) 4%,var(--surface));
}
.medication-trend-chart-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:4px;
}
.medication-trend-chart-head h4{
  margin:0;
  color:var(--text);
  font-size:14px;
  font-weight:800;
}
.medication-trend-chart-head span{
  display:block;
  margin-top:2px;
  color:var(--muted);
  font-size:11px;
}
.medication-trend-dot{
  width:11px;
  height:11px;
  margin-top:4px;
  border-radius:999px;
  flex:0 0 auto;
}
.medication-trend-dot.total,
.med-cohort-bar-single.series-total{background:var(--teal)}
.medication-trend-dot.existing,
.med-cohort-bar-single.series-existing{background:var(--green)}
.medication-trend-dot.new,
.med-cohort-bar-single.series-new{background:var(--blue)}

.medication-single-series-chart{
  min-height:245px;
  margin-top:0;
}
.medication-single-series-chart .med-cohort-chart-grid{
  height:220px;
  padding:8px 12px 0;
  gap:16px;
}
.medication-trend-chart-split .medication-single-series-chart{
  min-height:225px;
}
.medication-trend-chart-split .medication-single-series-chart .med-cohort-chart-grid{
  height:205px;
  gap:10px;
  padding-inline:8px;
}
.med-cohort-bar-single{
  min-height:3px;
  border-radius:9px 9px 3px 3px;
  cursor:help;
  transition:transform .16s ease,box-shadow .16s ease,filter .16s ease;
}
.med-cohort-bar-single:hover{
  transform:scaleX(1.05);
  box-shadow:0 6px 16px rgba(15,39,71,.16);
  filter:saturate(1.08);
}
.medication-trend-chart-split .med-cohort-total-label{
  font-size:9px;
}
.medication-trend-chart-split .med-cohort-chart-column > small{
  font-size:9px;
}

@media(max-width:1050px){
  .medication-trend-chart-split{grid-template-columns:1fr}
}
@media(max-width:650px){
  .medication-trend-chart-card{padding:12px 10px 10px}
  .medication-single-series-chart .med-cohort-chart-grid{gap:7px;padding-inline:4px}
  .medication-trend-chart-split .medication-single-series-chart .med-cohort-chart-grid{gap:7px;padding-inline:4px}
}


/* Medication analysis chart color semantics */
#medAnalysisYearChart .med-analysis-year-button{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:inherit!important;
}
#medAnalysisYearChart .med-analysis-year-button:hover,
#medAnalysisYearChart .med-analysis-year-button:focus-visible{
  background:color-mix(in srgb,var(--blue) 4%,transparent)!important;
  box-shadow:none!important;
}
#medAnalysisYearChart .med-analysis-bar.single.history{
  background:linear-gradient(180deg,#60a5fa,#2563eb);
}
#medAnalysisYearChart .med-analysis-bar.single.current-ytd{
  background:linear-gradient(180deg,#2dd4bf,#0f766e);
}
#medAnalysisYearChart .med-analysis-legend i.history-value{
  background:#2563eb;
}
#medAnalysisYearChart .med-analysis-legend i.current-ytd-value{
  background:#0f766e;
}
#medAnalysisMonthChart .med-month-zone i.current{
  background:linear-gradient(180deg,#2dd4bf,#0f766e);
}
#medAnalysisMonthChart .med-month-zone i.previous{
  background:#94a3b8;
}
#medAnalysisMonthChart .med-analysis-legend i.current-value{
  background:#0f766e;
}
#medAnalysisMonthChart .med-analysis-legend i.previous-value{
  background:#94a3b8;
}
#medAnalysisMonthChart .med-month-values span:first-child{
  color:#0f766e;
  font-weight:800;
}


/* Critical Lab Alert Center */
.critical-lab-header-button{position:relative}
.critical-lab-header-badge{
  position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;padding:0 5px;
  display:grid;place-items:center;border-radius:999px;background:#dc2626;color:#fff;
  border:2px solid var(--surface);font-size:10px;font-weight:800;line-height:1;
}
.critical-lab-dashboard-alert{margin:12px 0 14px}
.critical-lab-dashboard-button{
  width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;
  padding:13px 16px;border:1px solid #fecaca;border-radius:13px;background:#fff7f7;
  color:var(--text);text-align:left;cursor:pointer;
}
.critical-lab-dashboard-button:hover{border-color:#ef4444;box-shadow:0 6px 18px rgba(220,38,38,.08)}
.critical-lab-dashboard-icon{
  width:38px;height:38px;display:grid;place-items:center;border-radius:10px;
  background:#fee2e2;color:#b91c1c;
}
.critical-lab-dashboard-button>span:nth-child(2){display:grid;gap:2px}
.critical-lab-dashboard-button strong{color:#991b1b;font-size:13px}
.critical-lab-dashboard-button small{color:var(--muted);font-size:11px}
.critical-lab-dashboard-button>b{font-size:24px;color:#b91c1c}

.critical-lab-page{min-width:0}
.critical-lab-page-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px;
}
.critical-lab-page-head h2{margin:0}
.critical-lab-page-head p{margin:3px 0 0;color:var(--muted);font-size:12px}
.critical-lab-source-chip{
  display:grid;gap:1px;min-width:210px;padding:8px 11px;border:1px solid #fecaca;
  border-radius:10px;background:#fff7f7;
}
.critical-lab-source-chip span{font-size:10px;color:#991b1b;font-weight:700}
.critical-lab-source-chip strong{font-size:11px}

.critical-lab-tabs{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;
  margin-bottom:12px;padding:5px;border:1px solid var(--line);border-radius:11px;background:var(--surface-soft);
}
.critical-lab-tabs button{
  min-height:36px;border:0;border-radius:8px;background:transparent;color:var(--muted);
  font:inherit;font-size:12px;font-weight:700;cursor:pointer;
}
.critical-lab-tabs button.active{background:var(--surface);color:#b91c1c;box-shadow:0 2px 8px rgba(15,39,71,.07)}

.critical-lab-toolbar{
  display:grid;grid-template-columns:140px 150px 160px minmax(180px,1fr) minmax(220px,1.3fr) auto;
  gap:8px;margin-bottom:12px;
}
.critical-lab-toolbar select,.critical-lab-toolbar input{
  min-width:0;min-height:40px;padding:0 10px;border:1px solid var(--line);
  border-radius:9px;background:var(--surface);color:var(--text);font:inherit;
}
.critical-lab-summary-grid{grid-template-columns:repeat(5,minmax(130px,1fr));margin-bottom:12px}
.critical-lab-summary-card{position:relative;overflow:hidden}
.critical-lab-summary-card::before{content:"";position:absolute;inset:0 auto 0 0;width:4px}
.critical-lab-summary-card.danger::before{background:#dc2626}
.critical-lab-summary-card.warn::before{background:#d97706}
.critical-lab-summary-card.info::before{background:#2563eb}
.critical-lab-summary-card.good::before{background:#16a34a}

.critical-lab-table-wrap{max-width:100%;overflow:auto}
.critical-lab-table{min-width:1260px}
.critical-lab-row.critical_high td:first-child,
.critical-lab-row.critical_low td:first-child,
.critical-lab-row.critical_positive td:first-child{border-left:3px solid #dc2626}
.critical-lab-level{
  display:inline-flex;margin:0 6px 4px 0;padding:3px 7px;border-radius:999px;
  font-size:10px;font-weight:800;background:#fee2e2;color:#991b1b;
}
.critical-lab-result-value{display:block;color:#991b1b;font-size:14px}
.critical-lab-status{
  display:inline-flex;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:800;white-space:nowrap;
}
.critical-lab-status.new{background:#fee2e2;color:#991b1b}
.critical-lab-status.acknowledged{background:#fef3c7;color:#92400e}
.critical-lab-status.doctor_notified{background:#dbeafe;color:#1d4ed8}
.critical-lab-status.completed{background:#dcfce7;color:#166534}
.critical-lab-actions{display:flex;flex-wrap:wrap;gap:5px}
.critical-lab-actions button{
  min-height:30px;padding:4px 9px;border:1px solid #fecaca;border-radius:7px;
  background:#fff;color:#991b1b;font:inherit;font-size:10px;font-weight:700;cursor:pointer;
}
.critical-lab-actions button:hover{background:#fff1f2}
.critical-lab-actions button.secondary{border-color:var(--line);color:#1559bd}
.critical-lab-done{font-size:10px;color:#166534;font-weight:800}

.critical-lab-report-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.critical-lab-report-card{
  min-width:0;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--surface);
}
.critical-lab-bar-chart{min-height:250px;overflow-x:auto}
.critical-lab-bars{
  height:225px;min-width:460px;display:flex;align-items:flex-end;gap:10px;
  padding:8px 8px 0;border-bottom:1px solid var(--line);
}
.critical-lab-bars.monthly{min-width:720px;gap:7px}
.critical-lab-bar-col{
  height:100%;min-width:54px;flex:1;display:grid;grid-template-rows:22px minmax(0,1fr) 34px;
  justify-items:center;align-items:end;text-align:center;
}
.critical-lab-bar-col>span{font-size:10px;font-weight:800}
.critical-lab-bar-zone{height:100%;width:58%;display:flex;align-items:flex-end}
.critical-lab-bar-zone i{
  display:block;width:100%;min-height:2px;border-radius:7px 7px 2px 2px;
  background:linear-gradient(180deg,#fb7185,#dc2626);
}
.critical-lab-bar-col>b{align-self:start;font-size:9px;line-height:1.2;max-width:100%;overflow-wrap:anywhere}

.critical-lab-mapping-summary{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;
}
.critical-lab-mapping-summary>div{
  min-width:130px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-soft);
}
.critical-lab-mapping-summary strong{display:block;font-size:22px}
.critical-lab-mapping-summary span{font-size:10px;color:var(--muted)}
.critical-lab-mapping-summary p{margin:0;color:var(--muted);font-size:11px}
.critical-lab-mapping-table{min-width:900px}
.critical-lab-mapping-table code{
  display:inline-flex;margin:1px 2px;padding:2px 5px;border-radius:5px;background:var(--surface-soft);
  color:#1559bd;font-size:10px;
}
.critical-lab-mapping-status{
  display:inline-flex;padding:3px 7px;border-radius:999px;font-size:10px;font-weight:800;
}
.critical-lab-mapping-status.mapped{background:#dcfce7;color:#166534}
.critical-lab-mapping-status.pending{background:#fef3c7;color:#92400e}

.patient-critical-lab-alert{
  margin-top:10px;padding:10px 12px;display:grid;grid-template-columns:auto 1fr auto;
  gap:10px;align-items:center;border:1px solid #fecaca;border-radius:11px;background:#fff7f7;
}
.patient-critical-lab-alert[hidden]{display:none}
.patient-critical-lab-icon{
  width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#fee2e2;color:#b91c1c;
}
.patient-critical-lab-alert>div:nth-child(2){display:grid;gap:2px}
.patient-critical-lab-alert strong{font-size:12px;color:#991b1b}
.patient-critical-lab-alert span{font-size:11px;color:var(--muted)}
.patient-critical-lab-alert button{
  min-height:32px;padding:5px 10px;border:1px solid #ef4444;border-radius:8px;background:#fff;color:#b91c1c;
  font:inherit;font-size:10px;font-weight:800;cursor:pointer;
}

@media(max-width:1180px){
  .critical-lab-toolbar{grid-template-columns:repeat(3,minmax(0,1fr))}
  .critical-lab-summary-grid{grid-template-columns:repeat(3,minmax(130px,1fr))}
}
@media(max-width:900px){
  .critical-lab-report-grid{grid-template-columns:1fr}
  .critical-lab-page-head{flex-direction:column}
  .critical-lab-source-chip{width:100%}
}
@media(max-width:700px){
  .critical-lab-toolbar{grid-template-columns:1fr 1fr}
  .critical-lab-summary-grid{grid-template-columns:1fr 1fr}
  .patient-critical-lab-alert{grid-template-columns:auto 1fr}
  .patient-critical-lab-alert button{grid-column:1/-1}
}


/* DM Remission Candidate Screening v2.43 */
.remission-candidate-filter-bar{
  grid-template-columns:minmax(280px,1.5fr) minmax(180px,.8fr) minmax(190px,.9fr)!important;
}
.remission-candidate-summary-grid{
  grid-template-columns:repeat(6,minmax(130px,1fr));
  gap:10px;
  margin-bottom:10px;
}
.remission-candidate-card{
  appearance:none;
  width:100%;
  text-align:left;
  cursor:pointer;
  font:inherit;
  color:var(--text);
  position:relative;
  overflow:hidden;
  transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease;
}
.remission-candidate-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:var(--line-strong);
}
.remission-candidate-card.base::before{background:var(--blue)}
.remission-candidate-card.good::before{background:var(--green)}
.remission-candidate-card.candidate::before{background:var(--teal)}
.remission-candidate-card.review::before{background:#7c3aed}
.remission-candidate-card.watch::before{background:#d97706}
.remission-candidate-card.danger::before{background:var(--red)}
.remission-candidate-card:hover,
.remission-candidate-card.active{
  border-color:color-mix(in srgb,var(--blue) 46%,var(--line));
  box-shadow:0 6px 16px rgba(15,39,71,.08);
}
.remission-candidate-card.active{transform:translateY(-1px)}
.remission-candidate-card span{
  display:block;
  color:var(--muted);
  font-size:10px;
  font-weight:700;
}
.remission-candidate-card strong{
  display:block;
  margin-top:5px;
  font-size:20px;
}
.remission-candidate-table{min-width:1450px}
.remission-candidate-tier,
.remission-data-readiness{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:3px 8px;
  border-radius:999px;
  font-size:9px;
  font-weight:900;
  white-space:nowrap;
}
.remission-candidate-tier.high_priority{
  color:#166534;
  background:#dcfce7;
}
.remission-candidate-tier.consider{
  color:#0f766e;
  background:#ccfbf1;
}
.remission-candidate-tier.review_required{
  color:#6d28d9;
  background:#ede9fe;
}
.remission-candidate-tier.data_needed{
  color:#92400e;
  background:#fef3c7;
}
.remission-candidate-tier.not_recommended{
  color:#b91c1c;
  background:#fee2e2;
}
.remission-data-readiness.ready{
  color:#166534;
  background:#dcfce7;
}
.remission-data-readiness.needs_update{
  color:#92400e;
  background:#fef3c7;
}
.remission-candidate-table .remission-confirm-cell strong{
  display:block;
  margin-bottom:3px;
  color:var(--text);
  font-size:10px;
}
@media(max-width:1300px){
  .remission-candidate-summary-grid{grid-template-columns:repeat(3,minmax(130px,1fr))}
}
@media(max-width:900px){
  .remission-candidate-filter-bar{grid-template-columns:1fr!important}
  .remission-candidate-summary-grid{grid-template-columns:repeat(2,minmax(130px,1fr))}
}
@media(max-width:560px){
  .remission-candidate-summary-grid{grid-template-columns:1fr}
}


/* Remission candidate cards: semantic clean palette v2.43.1 */
body:not(.dark) #remissionCandidateCards .remission-candidate-card{
  background:#fff!important;
  color:#0f2747!important;
  border:1px solid #d8e7f5!important;
  box-shadow:0 3px 10px rgba(15,39,71,.04)!important;
}
body:not(.dark) #remissionCandidateCards .remission-candidate-card span{
  color:#60758f!important;
}
body:not(.dark) #remissionCandidateCards .remission-candidate-card strong{
  color:#123366!important;
}
body:not(.dark) #remissionCandidateCards .remission-candidate-card.base strong{color:#1565d8!important}
body:not(.dark) #remissionCandidateCards .remission-candidate-card.good strong{color:#15803d!important}
body:not(.dark) #remissionCandidateCards .remission-candidate-card.candidate strong{color:#0f766e!important}
body:not(.dark) #remissionCandidateCards .remission-candidate-card.review strong{color:#6d28d9!important}
body:not(.dark) #remissionCandidateCards .remission-candidate-card.watch strong{color:#b45309!important}
body:not(.dark) #remissionCandidateCards .remission-candidate-card.danger strong{color:#b91c1c!important}

body:not(.dark) #remissionCandidateCards .remission-candidate-card.base.active{
  background:#eef6ff!important;border-color:#93c5fd!important;
}
body:not(.dark) #remissionCandidateCards .remission-candidate-card.good.active{
  background:#ecfdf3!important;border-color:#86efac!important;
}
body:not(.dark) #remissionCandidateCards .remission-candidate-card.candidate.active{
  background:#ecfeff!important;border-color:#99f6e4!important;
}
body:not(.dark) #remissionCandidateCards .remission-candidate-card.review.active{
  background:#f5f3ff!important;border-color:#c4b5fd!important;
}
body:not(.dark) #remissionCandidateCards .remission-candidate-card.watch.active{
  background:#fffbeb!important;border-color:#fcd34d!important;
}
body:not(.dark) #remissionCandidateCards .remission-candidate-card.danger.active{
  background:#fff1f2!important;border-color:#fda4af!important;
}

body.dark #remissionCandidateCards .remission-candidate-card{
  background:var(--surface)!important;
  border-color:var(--line)!important;
}
body.dark #remissionCandidateCards .remission-candidate-card.active{
  background:var(--surface-soft)!important;
}