/* Round 35 chronic TV Bro fallback overlay. */
html.page-chronic body.page-chronic .chronic-summary-progress {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  height: 8px !important;
  min-height: 8px !important;
  margin-top: 6px !important;
  margin-bottom: 5px !important;
  overflow: hidden !important;
  background: var(--dashboard-surface, #1e293b) !important;
  border-radius: 9999px !important;
}

html.page-chronic body.page-chronic .chronic-summary-progress-fill {
  display: block !important;
  height: 100% !important;
  min-height: 8px !important;
  border-radius: inherit !important;
}

html.page-chronic body.page-chronic .chronic-summary-row > .chronic-summary-card:nth-child(2) .chronic-summary-progress-fill {
  width: 62%;
  background: #f59e0b;
  background: var(--dashboard-amber, #f59e0b);
}

/* Family: explicit spacer tracks preserve the 6/4/4 layout without grid-gap. */
html.page-family body.page-family .family-content-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) 12px repeat(4, minmax(0, 1fr)) 12px repeat(4, minmax(0, 1fr));
  grid-template-rows: 185px 12px minmax(0, 1fr);
  gap: 0;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

html.page-family body.page-family .dashboard-container.page-family {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: 74px 284px minmax(0, 1fr) !important;
}

html.page-family body.page-family .family-trend-card {
  grid-column: 1 / span 6 !important;
  grid-row: 1 !important;
}

html.page-family body.page-family .family-risk-card {
  grid-column: 8 / span 4 !important;
  grid-row: 1 !important;
}

html.page-family body.page-family .family-archive-card {
  grid-column: 13 / span 4 !important;
  grid-row: 1 !important;
  height: 185px !important;
}

html.page-family body.page-family .family-reminder-card {
  grid-column: 1 / span 11 !important;
  grid-row: 3 !important;
}

html.page-family body.page-family .plan-card {
  grid-column: 13 / span 4 !important;
  grid-row: 3 !important;
  margin-top: 0 !important;
}

.page-family .family-trend-card,
.page-family .family-risk-card,
.page-family .family-archive-card,
.page-family .family-reminder-card,
.page-family .plan-card {
  box-sizing: border-box;
  min-width: 0;
  min-height: 0;
  max-height: none !important;
  overflow: hidden;
}

.page-family .family-trend-card,
.page-family .family-risk-card,
.page-family .family-archive-card {
  padding: 12px !important;
}

.page-family .family-trend-card,
.page-family .family-risk-card {
  display: flex !important;
  flex-direction: column;
}

.page-family .family-trend-card #familyTrendChart {
  flex: 1 1 auto;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
}

.page-family .family-risk-card > .family-risk-chart-pane {
  display: flex !important;
  flex: 1 1 auto;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
}

.page-family .family-risk-card #familyRiskChart {
  flex: 0 1 180px;
  width: 180px !important;
  max-width: 62% !important;
  height: 132px !important;
  min-height: 0 !important;
  margin: 0 auto;
}

.page-family .family-archive-card {
  display: flex !important;
  flex-direction: column;
}

.page-family .family-archive-card > .family-risk-progress-pane {
  display: flex !important;
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: flex-start !important;
  min-height: 0;
  margin: 0 !important;
}

.page-family .family-archive-card > .family-risk-progress-pane > * + * {
  margin-top: 5px !important;
}

.page-family .family-archive-card .family-followup-notice {
  position: static !important;
  width: 100% !important;
  max-width: none !important;
  padding: 5px 7px !important;
  font-size: 11px;
  line-height: 1.25;
  transform: none !important;
}

.page-family .family-reminder-card {
  height: auto !important;
  min-height: 0 !important;
  align-self: stretch !important;
}

.page-family .family-reminder-card .reminder-list {
  height: auto !important;
  min-height: 0 !important;
}

.page-family .family-reminder-card .reminder-list > * {
  height: auto !important;
  min-height: 0 !important;
}

/* Match the legacy Family selector weight so this final overlay owns the geometry. */
html.page-family.page-family.page-family body.page-family.page-family.page-family .dashboard-container.page-family {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: 74px 284px minmax(0, 1fr) !important;
}

html.page-family.page-family.page-family body.page-family.page-family.page-family .dashboard-container.page-family > .family-content-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) 12px repeat(4, minmax(0, 1fr)) 12px repeat(4, minmax(0, 1fr)) !important;
  grid-template-rows: 185px 12px minmax(0, 1fr) !important;
  gap: 0 !important;
}

html.page-family.page-family.page-family body.page-family.page-family.page-family .family-content-grid > .family-archive-card {
  display: flex !important;
  height: 185px !important;
  min-height: 185px !important;
  max-height: 185px !important;
}

html.page-family.page-family.page-family body.page-family.page-family.page-family .family-archive-card > .family-risk-progress-pane {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  margin: 0 !important;
}

html.page-family.page-family.page-family body.page-family.page-family.page-family .family-risk-card > .family-risk-chart-pane {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
}

html.page-family.page-family.page-family body.page-family.page-family.page-family .family-risk-card #familyRiskChart {
  flex: 0 1 180px !important;
  width: 180px !important;
  max-width: 62% !important;
  height: 132px !important;
  min-height: 0 !important;
  margin: 0 auto !important;
}

html.page-family.page-family.page-family body.page-family.page-family.page-family .dashboard-container.page-family .family-reminder-card,
html.page-family.page-family.page-family body.page-family.page-family.page-family .family-reminder-card .reminder-list,
html.page-family.page-family.page-family body.page-family.page-family.page-family .family-reminder-card .reminder-list > * {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}

/* Individual Vitals: preserve the flattened eight-track dashboard while making
   the row-four cards read as a stable 6:4 pair. The physical margin is the TV
   Bro fallback for engines that do not reliably honor grid item alignment. */
html.page-individual-vitals.page-individual-vitals.page-individual-vitals body.page-individual-vitals.page-individual-vitals.page-individual-vitals .dashboard-container.page-individual-vitals .middle-grid > .vitals-heart-rate-card {
  --vitals-trend-row-columns: 6fr 4fr;
  grid-column: 1 / span 3 !important;
  width: 120% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin-right: 0 !important;
  justify-self: start !important;
}

html.page-individual-vitals.page-individual-vitals.page-individual-vitals body.page-individual-vitals.page-individual-vitals.page-individual-vitals .dashboard-container.page-individual-vitals .vitals-third-row > .vitals-sleep-card {
  --vitals-trend-row-columns: 6fr 4fr;
  grid-column: 4 / span 3 !important;
  width: 80% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin-left: 20% !important;
  margin-right: 0 !important;
  justify-self: end !important;
}

html.page-individual-vitals.page-individual-vitals.page-individual-vitals body.page-individual-vitals.page-individual-vitals.page-individual-vitals .dashboard-container.page-individual-vitals .vitals-monitoring-card .stat-grid.responsive-metric-grid > .stat-item {
  height: 74px !important;
  min-height: 74px !important;
}

/* Medical and Overview: share one final China-map geometry at TV Bro size. */
html.page-medical.page-medical.page-medical body.page-medical.page-medical.page-medical .dashboard-container.page-medical {
  grid-template-rows: 74px 596px 292px !important;
}

html.page-medical.page-medical.page-medical body.page-medical.page-medical.page-medical .medical-map-card {
  min-width: 0 !important;
  overflow: hidden !important;
}

html.page-medical.page-medical.page-medical body.page-medical.page-medical.page-medical .medical-middle-content {
  grid-template-columns: minmax(0, 0.36fr) minmax(0, 0.64fr) !important;
}

html.page-overview.page-overview.page-overview body.page-overview.page-overview.page-overview .overview-middle-grid {
  grid-template-columns: minmax(0, 4fr) minmax(0, 7.69fr) minmax(0, 4.31fr) !important;
  min-width: 0 !important;
}

html.page-overview.page-overview.page-overview body.page-overview.page-overview.page-overview .dashboard-container.page-overview {
  grid-template-rows: 74px 135px minmax(0, 4fr) minmax(0, 3fr) !important;
}

html.page-overview.page-overview.page-overview body.page-overview.page-overview.page-overview .overview-region-card {
  min-width: 0 !important;
  overflow: hidden !important;
}

html.page-medical.page-medical.page-medical body.page-medical.page-medical.page-medical .medical-map-card #mapChart {
  transform: scale(1.05) !important;
  transform-origin: center center !important;
}

html.page-overview.page-overview.page-overview body.page-overview.page-overview.page-overview .overview-region-card > #mapChart {
  transform: scale(1.05) !important;
  transform-origin: center center !important;
}

html.page-medical.page-medical.page-medical body.page-medical.page-medical.page-medical .medical-map-card #mapChart,
html.page-overview.page-overview.page-overview body.page-overview.page-overview.page-overview .overview-region-card > #mapChart {
  width: 835.5px !important;
  max-width: 100% !important;
  height: 320px !important;
  min-height: 0 !important;
  justify-self: center !important;
  position: relative !important;
  top: 0 !important;
}

/* Operations: keep the four first-row plots equally narrow and physically
   centered without changing the useful chart heights owned by the base CSS. */
html.page-operations body.page-operations .operations-top-mini-chart {
  display: block !important;
  box-sizing: border-box !important;
  width: 84% !important;
  max-width: 84% !important;
  min-width: 0 !important;
  margin: 0 auto !important;
}

html.page-operations body.page-operations .operations-roi-card {
  overflow: visible !important;
}

html.page-operations body.page-operations .operations-roi-card > .flex:last-child {
  flex-direction: column !important;
  align-items: stretch !important;
  min-width: 0 !important;
  overflow: visible !important;
}

html.page-operations body.page-operations .operations-revenue-chart-frame {
  display: block !important;
  flex: 0 0 87px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 87px !important;
  min-width: 0 !important;
  min-height: 87px !important;
}

html.page-operations body.page-operations .operations-roi-card .operations-revenue-chart-frame > #chart-revenue {
  display: block !important;
  width: 84% !important;
  max-width: 84% !important;
  height: 87px !important;
  min-width: 0 !important;
  min-height: 87px !important;
  margin: 0 auto !important;
}

/* Keep the gender chart inside the remaining card body. Older 100%-height
   distribution rules otherwise add the title height on top of the canvas. */
html.page-operations.page-operations.page-operations body.page-operations.page-operations.page-operations .operations-gender-card {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
}

html.page-operations.page-operations.page-operations body.page-operations.page-operations.page-operations .operations-gender-card > .operations-gender-content {
  height: auto !important;
  min-height: 0 !important;
}

html.page-operations.page-operations.page-operations body.page-operations.page-operations.page-operations .operations-gender-card > .operations-gender-content > #chart-gender {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
}

/* Personal Service: grow the type card by exactly 24 design pixels. The
   matching positive grid-item offset preserves the legacy 16px track gap and
   gives the appointment stack the remaining row space without overlap. */
html.page-personal-service body.page-personal-service .personal-service-type-card {
  box-sizing: border-box !important;
  height: calc(100% + 24px) !important;
  min-height: 0 !important;
}

html.page-personal-service body.page-personal-service .personal-appointment-stack {
  grid-column: 3 !important;
  grid-row: 4 / span 4 !important;
  min-height: 0 !important;
  margin-top: 24px !important;
}

/* Population: explicit three-column, three-row ownership for TV Bro. */
html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population > .dashboard-grid.population-balance-columns {
  grid-template-columns: minmax(0, 1fr) 16px minmax(0, 1fr) 16px minmax(0, 1fr) !important;
  grid-template-rows: 280px 16px 280px 16px 280px !important;
  gap: 0 !important;
  min-width: 0 !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population .population-balance-columns > .pop-top-1 {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population .population-balance-columns > .pop-top-2 {
  grid-column: 1 !important;
  grid-row: 3 !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population .population-balance-columns > .population-health-indicator-card {
  grid-column: 3 !important;
  grid-row: 1 !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population .population-balance-columns > .population-activity-card {
  grid-column: 3 !important;
  grid-row: 3 !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population .population-balance-columns > .pop-top-1,
html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population .population-balance-columns > .pop-top-2,
html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population .population-balance-columns > .population-health-indicator-card,
html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population .population-balance-columns > .population-activity-card {
  box-sizing: border-box !important;
  width: auto !important;
  height: 280px !important;
  min-width: 0 !important;
  min-height: 280px !important;
  max-height: 280px !important;
  align-self: stretch !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population .population-balance-columns > .population-region-card {
  grid-column: 5 !important;
  grid-row: 1 / span 3 !important;
  box-sizing: border-box !important;
  width: auto !important;
  height: 576px !important;
  min-width: 0 !important;
  min-height: 576px !important;
  max-height: 576px !important;
  align-self: stretch !important;
  overflow: hidden !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .population-region-card > .grid,
html.page-population.page-population.page-population body.page-population.page-population.page-population .population-region-card > .grid > * {
  min-width: 0 !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .population-region-card #region-chart,
html.page-population.page-population.page-population body.page-population.page-population.page-population .population-region-card #china-map {
  max-width: 100% !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .population-region-card #china-map {
  transform: translateX(-16px) scale(1.10) !important;
  transform-origin: center center !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population .population-balance-columns > .population-duration-card {
  grid-column: 1 / span 3 !important;
  grid-row: 5 !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population .population-balance-columns > .population-tags-card {
  grid-column: 5 !important;
  grid-row: 5 !important;
  overflow: hidden !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population .population-balance-columns > .population-duration-card,
html.page-population.page-population.page-population body.page-population.page-population.page-population .dashboard-container.page-population .population-balance-columns > .population-tags-card {
  box-sizing: border-box !important;
  width: auto !important;
  height: 280px !important;
  min-width: 0 !important;
  min-height: 280px !important;
  max-height: 280px !important;
  align-self: stretch !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .population-tags-card #tags-cloud {
  box-sizing: border-box !important;
  height: 180px !important;
  min-height: 0 !important;
  max-height: 180px !important;
  margin: 0 auto !important;
  overflow: hidden !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .population-tags-card .tag {
  opacity: 1 !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .population-tags-card .tag-lg {
  background: #7c5a12 !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .population-tags-card .tag-md {
  background: #593080 !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .population-tags-card .tag-sm {
  background: #145b70 !important;
}

html.page-population.page-population.page-population body.page-population.page-population.page-population .population-tags-card .tag-xs {
  background: #244778 !important;
}

/* Realtime: final TV Bro row contract. The repeated page namespaces match the
   legacy selector weight while keeping the six vitals and right-side device
   card on the existing shared grid. */
html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 16px minmax(0, 1fr) 16px minmax(0, 1fr) 16px minmax(0, 1fr) 16px minmax(0, 1fr) 16px minmax(0, 1fr) !important;
  grid-template-rows: 74px 16px 170px 16px 250px 16px 343px !important;
  gap: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
}

html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime > .realtime-top-grid {
  display: contents !important;
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
}

html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime > .realtime-top-grid > .vital-card {
  grid-row: 3 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime > .realtime-top-grid > .vital-card:nth-of-type(2) { grid-column: 1 !important; }
html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime > .realtime-top-grid > .vital-card:nth-of-type(3) { grid-column: 3 !important; }
html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime > .realtime-top-grid > .vital-card:nth-of-type(4) { grid-column: 5 !important; }
html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime > .realtime-top-grid > .vital-card:nth-of-type(5) { grid-column: 7 !important; }
html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime > .realtime-top-grid > .vital-card:nth-of-type(6) { grid-column: 9 !important; }
html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime > .realtime-top-grid > .vital-card:nth-of-type(7) { grid-column: 11 !important; }

html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime > .realtime-top-grid > .devices-card {
  grid-column: 9 / span 3 !important;
  grid-row: 5 / span 3 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime > :nth-child(3) {
  display: contents !important;
  grid-column: 1 / -1 !important;
  grid-row: 5 / span 3 !important;
  min-width: 0 !important;
  min-height: 0 !important;
}

html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime > :nth-child(3) > .realtime-alert-card {
  grid-column: 1 / span 3 !important;
  grid-row: 5 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime > :nth-child(3) > :first-child {
  grid-column: 1 / span 7 !important;
  grid-row: 7 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime > :nth-child(3) > :nth-child(3) {
  grid-column: 5 / span 3 !important;
  grid-row: 5 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime .event-table {
  min-width: 0 !important;
  overflow: hidden !important;
}

html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime .event-table table {
  width: 100% !important;
  table-layout: fixed !important;
  line-height: 1.15 !important;
}

html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime .event-table th,
html.page-realtime.page-realtime.page-realtime body.page-realtime.page-realtime.page-realtime .dashboard-container.page-realtime .event-table td {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}